.path-shell{background:var(--color-bg)}.path-loading{min-height:calc(100dvh - 66px - env(safe-area-inset-bottom));justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-6);color:var(--color-muted);flex-direction:column;display:flex}.path-content{width:min(100%,800px);padding:var(--space-6) var(--space-4) var(--space-8);gap:var(--space-4);flex-direction:column;margin-inline:auto;display:flex}.path-stat-row{gap:var(--space-2);grid-template-columns:repeat(3,1fr);display:grid}.path-stat-card{border-radius:var(--radius-md);background:var(--color-surface);min-width:0;box-shadow:var(--shadow-sm);align-items:center;gap:8px;padding:10px 11px;display:flex}.path-stat-icon{border-radius:var(--radius-pill);flex:none;place-items:center;width:28px;height:28px;display:grid}.path-stat-icon svg{width:14px;height:14px}.path-stat-icon.goal{background:var(--color-accent-2-100);color:var(--color-accent-2-700)}.path-stat-icon.review{background:var(--color-accent-100);color:var(--color-accent-700)}.path-stat-icon.done{background:var(--color-accent-2-200);color:var(--color-accent-2-800)}.path-stat-body{flex-direction:column;gap:1px;min-width:0;display:flex}.path-stat-value{font-size:var(--text-lg);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:800;line-height:1.1}.path-stat-value small{font-size:var(--text-xxs);color:var(--color-muted);font-weight:700}.path-stat-label{font-size:var(--text-xxs);color:var(--color-muted);white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden}.path-level-banner{top:var(--learning-app-nav-height);z-index:5;padding:12px var(--space-4);border-radius:var(--radius-md);background:var(--color-accent-2-800);color:var(--color-neutral-100);box-shadow:var(--shadow-sm);position:sticky;overflow:hidden}.path-banner-leaf{width:64px;height:64px;color:var(--color-accent-2-700);opacity:.55;pointer-events:none;position:absolute;top:-10px;right:-10px;transform:rotate(18deg)}.path-banner-top{justify-content:space-between;align-items:center;gap:var(--space-2);display:flex;position:relative}.path-banner-kicker{font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent-2-200);font-weight:800}.path-guide-btn{border-radius:var(--radius-pill);border:1px solid color-mix(in srgb, var(--color-bg) 40%, transparent);color:var(--color-bg);font-size:var(--text-xs);cursor:pointer;background:0 0;align-items:center;gap:6px;padding:6px 10px;font-weight:700;display:inline-flex}.path-guide-btn svg{width:14px;height:14px}.path-level-banner h1{font-family:var(--font-heading);font-weight:var(--font-heading-weight);font-size:var(--text-2xl);line-height:var(--line-height-snug);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:3px 0 0;display:-webkit-box;position:relative;overflow:hidden}.path-guide-panel{padding:var(--space-4);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-sm)}.path-guide-intro{align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-divider);display:flex}.path-guide-intro .learning-companion{width:82px;height:82px}.path-guide-intro span{color:var(--color-accent-2-700);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;font-weight:800;display:block}.path-guide-intro strong{font-family:var(--font-heading);font-size:var(--text-xl);margin-top:3px;display:block}.path-guide-panel ul{gap:var(--space-3);margin:0;padding:0;list-style:none;display:grid}.path-guide-panel li{padding-top:var(--space-2);border-top:1px solid var(--color-divider)}.path-guide-panel li:first-child{border-top:none;padding-top:0}.path-guide-panel strong{font-size:var(--text-md-lg);display:block}.path-guide-panel p{font-size:var(--text-sm);color:var(--color-muted);margin:2px 0 0}.path-track{--path-off:76px;--path-row-gap:28px;--path-divider-height:28px;box-sizing:border-box;width:100%;margin:var(--space-2) 0 0;padding:44px var(--space-4) calc(var(--space-8) + 28px);background:radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--color-accent-2-100) 54%, transparent), transparent 30%), radial-gradient(circle at 84% 58%, color-mix(in srgb, var(--color-accent-100) 46%, transparent), transparent 28%);flex-direction:column;align-items:center;list-style:none;display:flex;overflow:hidden}.path-level-divider-row{width:100%;height:var(--path-divider-height);margin-top:var(--path-row-gap);font-size:var(--text-xs);letter-spacing:.04em;color:var(--color-muted);align-items:center;gap:10px;font-weight:800;display:flex}.path-level-divider-row:first-child{margin-top:0}.path-level-divider-row:after{content:"";border-top:2px dashed var(--color-divider);flex:1;height:0}.path-node-row{--off:0;margin-top:var(--path-row-gap);transform:translateX(calc(var(--off) * var(--path-off)));flex-direction:column;align-items:center;display:flex;position:relative}.path-node-row.after-divider{margin-top:0}.path-node-row.off-r{--off:1}.path-node-row.off-l{--off:-1}.path-link{top:calc(-1 * var(--path-row-gap));width:calc(var(--path-off) * 2);height:var(--path-row-gap);pointer-events:none;position:absolute;left:50%;transform:translate(-50%)}.path-link.spans-divider{top:calc(-1 * (var(--path-row-gap) + var(--path-divider-height)));height:calc(var(--path-row-gap) + var(--path-divider-height))}.path-link svg{width:100%;height:100%;display:block;overflow:visible}.path-link svg path{fill:none;stroke:var(--color-neutral-400);stroke-width:3px;stroke-linecap:round;stroke-dasharray:6 9}.path-link svg.is-flip{transform:scaleX(-1)}.path-link-straight{border-left:3px dashed var(--color-neutral-400);width:0;height:100%;margin-inline:auto;display:block}.path-node{border-radius:var(--radius-pill);cursor:pointer;width:58px;height:58px;box-shadow:var(--shadow-md);border:none;place-items:center;padding:0;scroll-margin-top:140px;display:grid;position:relative}.path-node svg{width:23px;height:23px}.path-node{box-shadow:0 5px 0 var(--color-accent-2-900), var(--shadow-sm);transition:transform .14s,box-shadow .14s}.path-node:not([aria-disabled]):active{box-shadow:0 1px 0 var(--color-accent-2-900);transform:translateY(4px)}.path-node:focus-visible{outline:var(--focus-ring);outline-offset:3px}.path-node.is-completed{background:var(--color-accent-2-700);color:var(--color-neutral-100)}.path-node.is-current{background:var(--color-accent-2-800);width:84px;height:84px;color:var(--color-neutral-100);box-shadow:0 0 0 10px color-mix(in srgb, var(--color-accent-2-500) 22%, transparent), var(--shadow-lg)}.path-node.is-current svg{width:30px;height:30px}.path-node.is-available{background:var(--color-neutral-100);color:var(--color-accent-2-700);border:1.5px solid var(--color-accent-2-400);box-shadow:var(--shadow-sm)}.path-node.is-locked{background:var(--color-neutral-300);color:var(--color-neutral-700);box-shadow:none;cursor:default}.path-node.is-placed_out{background:var(--color-accent-2-100);color:var(--color-accent-2-700);border:1.5px dashed var(--color-accent-2-400);box-shadow:none}.path-node.is-review{background:var(--color-accent-600);color:var(--color-neutral-100)}.path-node.is-challenge{border-radius:var(--radius-lg);border:2px solid var(--color-accent-2-500)}.path-node.is-challenge.is-completed{border-color:var(--color-accent-2-700)}.path-node.is-challenge.is-current{border-color:var(--color-accent-2-300)}.path-challenge-row .path-current-chip{top:-38px}.path-halo{border-radius:inherit;border:2px solid var(--color-accent-2-400);animation:2.2s ease-out infinite path-halo-pulse;position:absolute;inset:-10px}@media (prefers-reduced-motion:reduce){.path-halo{opacity:0;animation:none}}@keyframes path-halo-pulse{0%{opacity:.9;transform:scale(.92)}80%{opacity:0;transform:scale(1.16)}to{opacity:0;transform:scale(1.16)}}.path-mascot{width:104px;height:104px;position:absolute;top:-28px;left:-102px}.path-current-chip{white-space:nowrap;border-radius:var(--radius-pill);background:var(--color-neutral-100);color:var(--color-accent-2-800);font-size:var(--text-xs);box-shadow:var(--shadow-sm);align-items:center;gap:6px;padding:4px 10px;font-weight:800;display:inline-flex;position:absolute;top:-34px;left:50%;transform:translate(-50%)}.path-current-chip i{background:var(--color-accent-2-600);border-radius:50%;width:6px;height:6px}.path-node-count{border:2px solid var(--color-bg);border-radius:var(--radius-pill);background:var(--color-neutral-100);min-width:24px;height:24px;color:var(--color-accent-800);place-items:center;padding-inline:6px;font-size:11px;font-weight:900;line-height:1;display:grid;position:absolute;top:-7px;right:-7px}.path-hint{padding:var(--space-3) var(--space-4);border-radius:var(--radius-pill);background:var(--color-neutral-800);color:var(--color-neutral-100);font-size:var(--text-sm);text-align:center;margin:0;font-weight:700}.path-sheet-backdrop{z-index:30;background:color-mix(in srgb, var(--color-neutral-900) 45%, transparent);justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.path-sheet{width:min(100%,480px);padding:var(--space-6) var(--space-4) var(--space-8);border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:var(--color-neutral-100);box-shadow:var(--shadow-lg);position:relative}.path-sheet-close{top:var(--space-3);right:var(--space-3);border-radius:var(--radius-pill);background:var(--color-neutral-200);width:44px;height:44px;color:var(--color-text);cursor:pointer;border:none;place-items:center;display:grid;position:absolute}.path-sheet-close svg{width:16px;height:16px}.path-sheet-kicker{font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--color-accent-2-700);font-weight:800;display:block}.path-sheet h2{margin:var(--space-1) 0 0;font-family:var(--font-heading);font-weight:var(--font-heading-weight);font-size:var(--text-2xl)}.path-sheet p{margin:var(--space-2) 0 0;color:var(--color-muted);font-size:var(--text-md-lg);line-height:var(--line-height-body)}.path-sheet .btn{margin-top:var(--space-4)}@media (min-width:720px){.path-content{padding-block:var(--space-8)}.path-loading{min-height:calc(100dvh - var(--learning-app-nav-height))}.path-track{--path-off:112px;padding-inline:var(--space-6)}.path-stat-card{padding:12px 14px}.path-sheet-backdrop{align-items:center}.path-sheet{border-radius:var(--radius-card)}}.path-content{padding-bottom:150px}.path-toolbar{top:var(--learning-app-nav-height);z-index:7;background:var(--color-bg);align-items:center;gap:12px;min-height:60px;padding-block:8px;display:flex;position:sticky}.path-toolbar .dash-locale-switcher{margin-left:auto}.path-streak,.path-xp{font-size:var(--text-sm);white-space:nowrap;align-items:center;gap:5px;font-weight:800;display:inline-flex}.path-streak{min-height:44px;color:var(--color-accent-800);text-decoration:none}.path-xp{color:var(--color-accent-2-800)}.path-toolbar svg{width:19px;height:19px}.path-level-banner{top:calc(var(--learning-app-nav-height) + 60px)}.path-guide-btn{min-height:44px}.path-daily-goal{font-size:var(--text-xs);flex-wrap:wrap;align-items:center;gap:7px;margin-top:12px;display:flex}.path-daily-goal strong{margin-left:auto}.path-daily-goal progress{-webkit-appearance:none;appearance:none;background:var(--color-accent-2-700);border:0;border-radius:10px;width:100%;height:7px;display:block;overflow:hidden}.path-daily-goal progress::-webkit-progress-bar{background:var(--color-accent-2-700)}.path-daily-goal progress::-webkit-progress-value{background:var(--color-accent-2-200);border-radius:10px;transition:width .3s}.path-daily-goal progress::-moz-progress-bar{background:var(--color-accent-2-200);border-radius:10px}.path-node-label{background:var(--color-bg);border-radius:var(--radius-sm);text-align:center;width:180px;font-size:var(--text-sm);z-index:1;gap:4px;padding:5px 8px;line-height:1.4;display:grid;position:absolute;top:calc(100% + 13px);left:50%;transform:translate(-50%)}.path-node-label strong{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.path-node-label small{color:var(--color-muted);font-size:var(--text-xs)}.path-challenge-row .path-node{background:var(--color-accent-100);width:72px;height:72px;color:var(--color-accent-800);border-color:var(--color-accent-400)}.path-challenge-row .path-node.is-current,.path-challenge-row .path-node.is-completed{background:var(--color-accent-700);color:var(--color-bg)}.path-challenge-row .path-node.is-locked{background:var(--color-surface);color:var(--color-muted);border-color:var(--color-divider)}.path-link svg path{stroke-dasharray:none;stroke-width:3px}.path-link-straight{border-left-style:solid}.is-newly-completed .path-node{animation:.55s ease-out both path-complete}.has-arrival .path-mascot{animation:.75s ease-out both path-arrive}.is-newly-completed+.path-node-row .path-link{animation:.6s ease-out both path-connect}.path-arrival{background:var(--color-accent-2-100);color:var(--color-accent-2-900);border-radius:var(--radius-md);font-size:var(--text-sm);align-items:center;gap:8px;margin:0;padding:12px 16px;display:flex}.path-level-banner .path-arrival{font-size:var(--text-xs);margin-top:10px;padding:8px 10px}.path-arrival svg{flex:none;width:20px}.path-total{text-align:center;color:var(--color-muted);font-size:var(--text-sm);margin:0}.path-continue{bottom:calc(66px + env(safe-area-inset-bottom));left:calc(50% + var(--learning-app-nav-width) / 2);z-index:8;background:var(--color-bg);border-top:1px solid var(--color-divider);align-items:center;gap:10px;width:min(100%,520px);padding:12px 16px;display:flex;position:fixed;transform:translate(-50%)}.path-locate{background:var(--color-surface);border:1px solid var(--color-divider);width:48px;height:52px;color:var(--color-accent-2-800);border-radius:var(--radius-md);cursor:pointer;flex:none;place-items:center;display:grid}.path-start{background:var(--color-accent-2-700);min-width:0;min-height:60px;color:var(--color-neutral-100);text-align:left;box-shadow:0 4px 0 var(--color-accent-2-900);flex:1;justify-content:space-between}.path-start:hover{background:var(--color-accent-2-800)}.path-start span{gap:2px;min-width:0;display:grid}.path-start small{font-family:var(--font-body);font-size:var(--text-xs);opacity:.85}.path-start strong{text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm);overflow:hidden}.path-start svg{flex:none;width:20px}:is(.path-locate:focus-visible,.path-streak:focus-visible){outline:var(--focus-ring);outline-offset:3px}.path-sheet{padding-bottom:max(24px, env(safe-area-inset-bottom))}.path-sheet h2{padding-right:40px}.path-sheet .btn{min-height:52px}.path-sheet p svg{vertical-align:-2px;width:16px;height:16px;display:inline-block}.path-hint{left:calc(50% + var(--learning-app-nav-width) / 2);bottom:calc(166px + env(safe-area-inset-bottom));z-index:9;border-radius:var(--radius-md);width:min(100% - 32px,440px);position:fixed;transform:translate(-50%)}@keyframes path-complete{0%{transform:scale(.8)}60%{transform:scale(1.12)}to{transform:none}}@keyframes path-arrive{0%{opacity:0;transform:translate(-26px,48px)rotate(-8deg)}to{opacity:1;transform:none}}@keyframes path-connect{0%{opacity:.15}to{opacity:1}}@media (min-width:720px){.path-continue{border:1px solid var(--color-divider);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);bottom:20px}.path-hint{bottom:126px}}@media (max-width:399px){.path-track{--path-off:62px}.path-node-label{width:160px}.path-xp{font-size:var(--text-xs)}}@media (prefers-reduced-motion:reduce){.path-content *,.path-continue *{transition:none!important;animation:none!important}}@media (max-width:719px){.path-stat-row{display:none}.path-content{gap:var(--space-3);padding-top:var(--space-4)}.path-level-banner{padding:var(--space-3) var(--space-4)}.path-level-banner h1{margin-top:var(--space-1);font-size:var(--text-xl)}}.path-node-label{visibility:hidden;opacity:0;pointer-events:none;z-index:4;border-radius:var(--radius-md);background:var(--color-surface);width:210px;box-shadow:var(--shadow-md);border:1px solid var(--color-divider);padding:10px 12px}.path-node-label strong{display:block;overflow:visible}.path-node:focus-visible~.path-node-label{visibility:visible;opacity:1}@media (hover:hover){.path-node:hover~.path-node-label{visibility:visible;opacity:1}}.path-node-row:first-child{margin-top:0}.path-track .path-node{width:52px;height:52px}.path-track .path-node.is-current{width:72px;height:72px}.path-track .path-mascot{width:88px;height:88px;top:-18px;left:-92px}@media (max-width:719px){.path-track{--path-row-gap:22px}}
