/* 허브 첫 화면의 '길' — 로그인한 사람에게만 보인다(hub-road.js). 로그인 전 화면은 그대로. */
.in-road .exp,.in-road #mytiles,.in-road #apps-label,.in-road #grid{display:none}
.road-wrap[hidden]{display:none}
.road-wrap{margin:0 0 14px}
.road-h{font-family:var(--serif);font-size:1.3rem;line-height:1.4;margin:0 0 12px;word-break:keep-all;text-wrap:balance}
.road-err{margin:0 0 12px;padding:12px 14px;background:var(--fire-tint);color:var(--fire-deep);border-radius:var(--r-list);font-size:.88rem;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.road-err small{flex-basis:100%;opacity:.8;font-size:.75rem;overflow-wrap:anywhere}
/* 나만의 길 그림 (hub-road-art.js) — 색은 모두 jalim-base.css 토큰 */
.rd-art{position:relative;width:100%;aspect-ratio:330/600;margin:0 0 8px}
.rd-art svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rd-draw{stroke-dasharray:1;stroke-dashoffset:1;animation:rd-draw 1.4s ease-out forwards}
.rd-d2{animation-delay:.25s}.rd-d3{animation-delay:.5s}
@keyframes rd-draw{to{stroke-dashoffset:0}}
.rd-n{cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}
.rd-n:focus-visible .rd-dot{stroke:var(--ink);stroke-width:3}
@media(hover:hover){.rd-n:hover .rd-dot{opacity:.88}}
.rd-ring{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:3 4}
.rd-nm{font-family:inherit;font-weight:800;letter-spacing:-.01em}
.rd-ic{fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.rd-cap{font-family:inherit;font-size:10.5px;font-weight:600;fill:var(--sub)}
.rd-st{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;padding:0;border:0;background:none;cursor:pointer;touch-action:manipulation;display:grid;place-items:center;font:inherit}
.rd-st i{position:relative;width:22px;height:22px;display:grid;place-items:center}
.rd-st i::before{content:'';width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--card),var(--shadow-sm)}
.rd-st i::after{content:'';position:absolute;width:12px;height:12px;border-radius:50%;border:1px solid var(--accent);animation:rd-pulse 2.4s ease-out infinite}
@keyframes rd-pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.6);opacity:0}}
.rd-st span{position:absolute;white-space:nowrap;font-size:11.5px;font-weight:700;line-height:1.2;color:var(--accent-ink);padding:2px 8px;border-radius:var(--r-pill);background:var(--card);box-shadow:var(--shadow-sm)}
.rd-st .rd-t-a{bottom:calc(50% + 14px);left:50%;transform:translateX(-50%)}
.rd-st .rd-t-b{top:calc(50% + 14px);left:50%;transform:translateX(-50%)}
.rd-st .rd-t-r{left:calc(50% + 14px);top:50%;transform:translateY(-50%)}
.rd-st[aria-expanded="true"] i::before{box-shadow:0 0 0 3px var(--card),0 0 0 5px var(--accent)}
.rd-bub{position:absolute;z-index:5;width:230px;max-width:94%;max-height:300px;overflow-y:auto;background:var(--card);border-radius:var(--r-list);padding:11px 13px;font-family:var(--serif);font-size:.86rem;line-height:1.7;white-space:pre-line;box-shadow:var(--shadow);word-break:keep-all}
.rd-bub[hidden]{display:none}
.rd-bub b{display:block;margin-bottom:4px;font-size:.78rem;color:var(--accent-ink)}
.rd-tip{position:absolute;z-index:6;pointer-events:none;white-space:nowrap;padding:5px 11px;border-radius:var(--r-pill);background:var(--ink);color:var(--card);font-size:.78rem;font-weight:700;box-shadow:var(--shadow)}
.rd-tip[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.rd-draw{animation:none;stroke-dashoffset:0}.rd-st i::after{animation:none}}
.warnbar{display:flex;flex-direction:column;gap:6px;margin:0 0 12px;padding:14px 16px;background:var(--warn-soft);border:1px solid var(--warn);border-radius:var(--r-list);font-size:.85rem;color:var(--ink)}
.warnbar b{font-size:.95rem}
.warnbar .btn{align-self:flex-start;margin-top:4px}
/* 로그인 후에는 스토리텔링 버튼 대신 길 위의 '자림 스토리텔링' 점으로 읽는다 */
.in-road .story-btn{display:none}