:root{--ink:#1d2748;--paper:#dcd6bd;--paper-2:#cfc8aa;--wood:#6a4527;--wood-dark:#3e2814;--seal:#b8321f;--seal-deep:#9c2b1a;--color-bg:var(--wood-dark);--color-surface:var(--paper);--color-surface-raised:var(--paper-2);--color-border:#1d27482e;--color-border-strong:#1d274861;--color-glass:#dcd6bdeb;--color-glass-border:#1d274840;--color-glass-panel:var(--paper);--color-accent:var(--seal);--color-accent-strong:#d1502f;--color-secondary:var(--wood);--color-text:var(--ink);--color-text-muted:#1d2748d1;--color-text-faint:#1d2748b8;--color-canvas-bg:#0a0f17;--color-focus-ring:var(--seal);--color-activity-dormant:#a39c82;--color-activity-quiet:#57628a;--color-activity-active:var(--ink);--color-activity-festival:var(--seal);--font-display:"Dela Gothic One", "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-body:"Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-num:"Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--text-xs:.7rem;--text-sm:.8125rem;--text-base:.9375rem;--text-md:1.0625rem;--text-lg:1.25rem;--text-xl:1.5rem;--leading-tight:1.2;--leading-normal:1.55;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--radius-sm:6px;--radius-md:10px;--radius-lg:20px;--radius-pill:999px;--radius-panel:14px;--cover-radius:4px;--duration-fast:.12s;--duration-base:.22s;--ease-standard:cubic-bezier(.2, .8, .2, 1);--topbar-h:56px;--tabbar-height:60px;--sidebar-width:400px;--sidebar-inset:16px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px);--z-topbar:10;--z-floating:1;--z-now-playing:15;--z-tabbar:20;--z-backdrop:25;--z-sidebar:30;--z-onboarding:40;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (width>=900px){:root{--cover-radius:8px}}*{box-sizing:border-box}html,body{background:var(--color-bg);color:var(--color-text);margin:0;padding:0}body{font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-normal);height:100dvh;overflow:hidden}button{font:inherit;color:inherit}h1,h2,h3,p{margin:0}img{max-width:100%}input,select{font:inherit;color:inherit}[hidden]{display:none!important}:focus{outline:none}:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px;border-radius:var(--radius-sm)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.app{height:100dvh;overflow:hidden}.layout{height:100%;display:flex}.content{flex-direction:column;flex:auto;min-width:0;height:100%;display:flex;position:relative;overflow:hidden}.topbar{z-index:var(--z-topbar);min-height:var(--topbar-h);justify-content:space-between;align-items:center;gap:var(--space-4);padding:calc(var(--safe-top) + var(--space-2)) calc(var(--space-4) + var(--safe-right)) var(--space-2) calc(var(--space-4) + var(--safe-left));background:repeating-linear-gradient(0deg, #1d274809 0 1px, transparent 1px 5px), var(--color-glass-panel);border-top:4px solid var(--wood);border-bottom:4px solid var(--wood);display:flex;position:absolute;top:0;left:0;right:0;box-shadow:0 20px 40px -24px #00000080}.brand{font-family:var(--font-display);font-size:var(--text-md);letter-spacing:.02em;color:var(--color-text)}.topbar-nav{align-items:center;gap:var(--space-4);min-width:0;display:flex}.topbar-actions{align-items:center;gap:var(--space-2);flex:none;display:flex}.status-chip{font-size:var(--text-xs);padding:4px var(--space-2) 4px 8px;border-radius:var(--radius-pill);border:1px solid var(--color-border-strong);color:var(--color-text-muted);background:var(--color-surface-raised);white-space:nowrap;align-items:center;gap:6px;font-weight:500;display:inline-flex}.status-chip:before{content:"";background:var(--dot,var(--color-text-faint));width:6px;height:6px;box-shadow:0 0 8px var(--dot,transparent);border-radius:50%;flex:none}.status-chip--paused{--dot:var(--wood);color:var(--color-text)}.status-chip--connected{color:var(--seal-deep);border:2px solid var(--seal-deep);background:0 0;border-radius:4px;gap:0;padding:1px 8px;font-weight:700;transform:rotate(-3deg)}.status-chip--connected:before{content:none}.topbar-btn{appearance:none;min-height:32px;padding:0 var(--space-3);background:var(--ink);color:var(--paper);font-family:var(--font-body);font-size:var(--text-xs);cursor:pointer;white-space:nowrap;transition:background var(--duration-fast) var(--ease-standard);border:none;border-radius:3px;justify-content:center;align-items:center;font-weight:700;display:inline-flex}.topbar-btn:hover,.topbar-btn[aria-expanded=true],.topbar-btn[aria-current=true]{background:var(--wood-dark)}.topbar-village-btns{align-items:center;gap:var(--space-2);display:flex}.topbar-btn--village{display:none}@media (width<=1099px){.topbar-village-btns{display:none}.topbar-btn--village{display:inline-flex}.sidebar--village .sidebar-tablist{display:flex}}.top-artists-backdrop{z-index:var(--z-backdrop);background:0 0;position:fixed;inset:0}.top-artists-panel{z-index:var(--z-sidebar);top:calc(var(--topbar-h) + var(--safe-top) + var(--space-2));left:var(--space-4);right:var(--space-4);max-width:360px;max-height:min(70vh,520px);padding:var(--space-4);background:repeating-linear-gradient(0deg, #1d274809 0 1px, transparent 1px 5px), var(--color-glass-panel);border:1px solid var(--wood);border-radius:6px;margin-left:auto;position:fixed;overflow-y:auto;box-shadow:0 24px 48px -20px #0000008c}.ta-panel-header{justify-content:space-between;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);display:flex}.ta-heading{font-family:var(--font-display);font-size:var(--text-sm);color:var(--color-text);margin:0}.ta-close{min-width:32px;min-height:32px;font-size:1.1rem}.ta-range{gap:var(--space-1);margin-bottom:var(--space-3);display:flex}.ta-range-btn{appearance:none;border:1.5px solid var(--ink);color:var(--ink);font-family:var(--font-body);padding:3px var(--space-2);font-size:var(--text-xs);cursor:pointer;background:0 0;border-radius:3px;min-height:32px;font-weight:700}.ta-range-btn.is-active{background:var(--seal-deep);color:var(--paper);border-color:var(--seal-deep)}.ta-row{align-items:center;gap:var(--space-2);padding:var(--space-2) 0;border-bottom:1px solid var(--color-border);min-height:44px;display:flex}.ta-row:last-child{border-bottom:none}.ta-row__rank{width:1.4em;font-family:var(--font-num);font-variant-numeric:tabular-nums;font-size:var(--text-xs);color:var(--color-text-faint);text-align:right;flex:none;font-weight:700}.ta-row:first-child .ta-row__rank{color:var(--paper);background:var(--seal-deep);border-radius:3px;width:auto;padding:0 5px}.ta-row__art{border-radius:var(--cover-radius);background:var(--color-canvas-bg);width:36px;height:36px;box-shadow:0 0 0 1px var(--color-border-strong);flex:none;overflow:hidden}.ta-row__art img{object-fit:cover;width:100%;height:100%}.ta-row__meta{flex:auto;min-width:0}.ta-row__name{font-size:var(--text-sm);color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.ta-row__genres{font-size:var(--text-xs);color:var(--color-text-faint);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.main{justify-content:flex-end;align-items:center;gap:var(--space-3);min-height:0;padding-top:calc(var(--topbar-h) + var(--safe-top) + var(--space-3));padding-left:calc(var(--space-4) + var(--safe-left));padding-right:calc(var(--space-4) + var(--safe-right));padding-bottom:calc(var(--tabbar-height) + var(--safe-bottom) + var(--space-4));flex-direction:column;flex:auto;width:100%;display:flex;position:relative;overflow:hidden}@media (width>=900px){.main{padding-top:calc(var(--topbar-h) + var(--space-4));padding-bottom:var(--space-4)}}.icon-btn{appearance:none;border-radius:var(--radius-pill);min-width:44px;min-height:44px;color:var(--color-text);font-size:var(--text-xl);cursor:pointer;transition:background var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard);background:0 0;border:none;justify-content:center;align-items:center;line-height:1;display:flex}.icon-btn:hover{background:#1d274814}.icon-btn:active{transform:scale(.94)}.district-readout{text-align:center;min-width:0;max-width:46vw;padding:0 var(--space-1);flex-direction:column;align-items:center;display:flex}.district-readout__genre{font-size:var(--text-xs);color:var(--color-text-muted)}.district-readout__name{font-family:var(--font-display);font-size:var(--text-sm);color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;max-width:100%;overflow:hidden}.village-caption{z-index:var(--z-floating);font-size:var(--text-xs);color:var(--color-text-muted);text-align:center;background:var(--color-glass);border:1px solid var(--wood);padding:4px var(--space-2);border-radius:var(--radius-pill);opacity:1;max-width:100%;transition:opacity var(--duration-base) var(--ease-standard);flex:none;align-self:center;line-height:1.3;position:relative}.village-caption.is-dismissed{opacity:0}.village-caption:empty{display:none}@media (width>=900px){.village-caption{font-size:var(--text-sm);padding:6px var(--space-3)}}.stage-area{justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow:hidden}#game{box-sizing:content-box;background:var(--color-canvas-bg);image-rendering:pixelated;image-rendering:crisp-edges;touch-action:none;cursor:grab;border:none;display:block}#game:active{cursor:grabbing}#game:focus-visible{outline-color:var(--paper)}.caption-layer{pointer-events:none;image-rendering:auto;position:absolute}.zoom-controls{right:var(--space-3);bottom:var(--space-3);background:var(--color-glass);border:1px solid var(--wood);border-radius:8px;flex-direction:column;display:flex;position:absolute;overflow:hidden;box-shadow:0 16px 32px -18px #0009}.zoom-btn{appearance:none;min-width:44px;min-height:44px;color:var(--color-text);font-size:var(--text-lg);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;line-height:1;display:flex}.zoom-btn+.zoom-btn{border-top:1px solid var(--color-border)}.zoom-btn:hover{background:#1d274814}.zoom-btn:active{transform:scale(.94)}@media (width<=899px){.zoom-btn{font-size:var(--text-base)}.topbar-actions{flex:0 auto;min-width:0}}.hud-top-band{z-index:var(--z-now-playing);top:calc(var(--topbar-h) + var(--safe-top) + var(--space-2));left:calc(var(--space-3) + var(--safe-left));right:calc(var(--space-3) + var(--safe-right));justify-content:space-between;align-items:flex-start;gap:var(--space-2);pointer-events:none;flex-wrap:wrap;display:flex;position:fixed}.media-controls{pointer-events:auto;align-items:center;gap:var(--space-2);flex-wrap:wrap;max-width:100%;display:flex}.media-btn{appearance:none;min-height:44px;padding:0 var(--space-3);border-radius:var(--radius-pill);border:1px solid var(--wood);background:var(--color-glass);color:var(--color-text);font-family:var(--font-body);font-size:var(--text-xs);cursor:pointer;white-space:nowrap;transition:background var(--duration-fast) var(--ease-standard);font-weight:700;box-shadow:0 16px 32px -18px #0009}.media-btn:hover{background:#1d274814}.media-btn:active{transform:scale(.96)}.media-btn[aria-pressed=true]{background:var(--seal-deep);border-color:var(--seal-deep);color:var(--paper)}.media-controls__indicator{min-height:44px;padding:0 var(--space-2);font-size:var(--text-xs);font-variant-numeric:tabular-nums;color:var(--seal-deep);background:var(--color-glass);border:1px solid var(--seal-deep);border-radius:var(--radius-pill);align-items:center;gap:6px;font-weight:700;display:inline-flex}.media-controls__indicator:before{content:"";background:var(--seal-deep);border-radius:50%;width:7px;height:7px;animation:1s ease-in-out infinite media-rec-pulse}@keyframes media-rec-pulse{0%,to{opacity:1}50%{opacity:.35}}.sidebar-backdrop{z-index:var(--z-backdrop);opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--duration-base) var(--ease-standard);background:#05080c8c;position:fixed;inset:0}.sidebar-backdrop.is-open{opacity:1;visibility:visible;pointer-events:auto}.sidebar{top:calc(var(--safe-top) + var(--topbar-h) + var(--space-4));z-index:var(--z-sidebar);background:repeating-linear-gradient(0deg, #1d274809 0 1px, transparent 1px 5px), var(--color-glass-panel);border-top:14px solid var(--wood);border-bottom:14px solid var(--wood);box-shadow:0 0 0 2px var(--wood-dark), 0 -20px 60px #00000080;padding:var(--space-2) var(--space-4) calc(var(--space-4) + var(--safe-bottom));visibility:hidden;opacity:0;transition:transform var(--duration-base) var(--ease-standard), opacity var(--duration-base) var(--ease-standard), visibility 0s linear var(--duration-base);flex-direction:column;display:flex;position:fixed;bottom:0;left:0;right:0;transform:translateY(100%)}.sidebar.is-open{visibility:visible;opacity:1;transition:transform var(--duration-base) var(--ease-standard), opacity var(--duration-base) var(--ease-standard);animation:sidebar-unroll .6s var(--ease-standard);transform:translateY(0)}@keyframes sidebar-unroll{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}.sidebar__grabber{border-radius:var(--radius-pill);background:var(--color-border-strong);width:36px;height:4px;margin:0 auto var(--space-2);flex:none}.sidebar__close{top:var(--space-2);right:var(--space-2);border-radius:var(--radius-sm);border:1px solid var(--color-border);width:30px;height:30px;color:var(--color-text-muted);font-size:var(--text-lg);cursor:pointer;background:0 0;justify-content:center;align-items:center;display:flex;position:absolute}.sidebar__close:hover{color:var(--color-text)}.sidebar__header{align-items:center;row-gap:var(--space-2);gap:var(--space-3);padding-right:var(--space-6);flex-wrap:wrap;flex:none;display:flex}.sidebar__enter{appearance:none;min-height:36px;padding:0 var(--space-3);background:var(--ink);color:var(--paper);font-family:var(--font-body);font-size:var(--text-xs);cursor:pointer;white-space:nowrap;transition:background var(--duration-fast) var(--ease-standard);border:none;border-radius:3px;flex:none;margin-left:auto;font-weight:700}.sidebar__enter:hover{background:var(--wood-dark)}.sidebar__portrait{background:var(--paper-2);width:56px;height:56px;box-shadow:0 0 0 2px var(--ink);image-rendering:pixelated;border-radius:3px;flex:none}.sidebar__header-text{flex:1 1 0;min-width:0}.sidebar__name{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-text);white-space:normal;line-height:1.1}.sidebar__meta{margin-top:var(--space-1);align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.pill{font-size:var(--text-xs);color:var(--color-text);background:var(--paper-2);border:1px solid var(--color-border-strong);padding:2px var(--space-2);white-space:nowrap;border-radius:3px;font-weight:500}.sidebar__location{font-size:var(--text-sm);color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sidebar__dialogue{font-size:var(--text-sm);color:var(--color-text-muted);overflow-wrap:break-word;margin:2px 0 0;font-style:italic}.sidebar__footer{margin-top:var(--space-2);padding-top:var(--space-2);border-top:1px solid var(--color-border);font-size:var(--text-xs);color:var(--color-text-faint);flex:none;align-items:center;gap:6px;min-width:70px;display:flex}.sidebar__footer:before{content:"";background:var(--color-text-faint);opacity:.7;border-radius:50%;flex:none;width:6px;height:6px}.sidebar__spotify-badge{background:var(--ink);border-radius:3px;flex:none;align-items:center;padding:4px 8px;display:flex}.sidebar__spotify-logo{flex:none;width:78px;height:auto;display:block}.village-today{margin-top:var(--space-2);padding:6px var(--space-3);background:var(--paper-2);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);flex-direction:column;flex:none;gap:2px;display:flex}.village-today__line{font-size:var(--text-xs);color:var(--color-text-muted);margin:0}.village-today__line--summary{color:var(--color-text);font-weight:600}.village-today__line--festival{color:var(--seal-deep);font-weight:600}.sidebar-tablist{gap:var(--space-1) var(--space-2);margin-top:var(--space-3);border-bottom:2px solid var(--ink);flex-wrap:wrap;flex:none;padding-bottom:4px;display:flex}.sidebar--village .sidebar-tablist{display:none}.sidebar-tab{appearance:none;color:var(--color-text-muted);font-family:var(--font-body);font-size:var(--text-sm);cursor:pointer;background:0 0;border:none;border-radius:3px;flex:none;align-items:center;min-height:44px;padding:4px 8px;font-weight:700;display:inline-flex}.sidebar-tab:hover{color:var(--color-text)}.sidebar-tab[aria-selected=true]{background:var(--ink);color:var(--paper)}.sidebar-panel{min-height:0;padding-top:var(--space-3);flex:auto;overflow-y:auto}.sidebar-heading{font-family:var(--font-display);font-size:var(--text-sm);color:var(--color-text);margin:var(--space-4) 0 var(--space-2);align-items:center;gap:8px;display:flex}.sidebar-heading:after{content:"";background:var(--ink);opacity:.8;clip-path:polygon(0 30%,100% 0,98% 100%,0 80%);border-radius:2px;flex:auto;min-width:12px;height:3px}.sidebar-heading:first-of-type{margin-top:2px}.sidebar-empty{font-size:var(--text-sm);color:var(--color-text-faint);padding:var(--space-3) 0}.sidebar-empty--error{align-items:flex-start;gap:var(--space-2);flex-direction:column;display:flex}.sidebar-retry-btn{appearance:none;border:1.5px solid var(--ink);color:var(--ink);font-family:var(--font-body);padding:3px var(--space-3);font-size:var(--text-xs);cursor:pointer;background:0 0;border-radius:3px;min-height:32px;font-weight:700}.sidebar-retry-btn:hover{background:#1d274814}.character-personality{font-size:var(--text-sm);color:var(--color-text);margin:0;line-height:1.5}.character-dialogue{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.character-dialogue li{padding:6px var(--space-3) 6px 10px;border-left:2px solid var(--color-border-strong);font-size:var(--text-sm);color:var(--color-text-muted);font-style:italic;position:relative}.activity-pill{font-size:var(--text-xs);padding:4px var(--space-2) 4px 8px;border-radius:var(--radius-pill);border:1px solid var(--color-border-strong);color:var(--color-text);background:0 0;align-items:center;gap:6px;font-weight:500;display:inline-flex}.activity-pill:before{content:"";background:var(--dot);width:6px;height:6px;box-shadow:0 0 8px var(--dot);border-radius:50%}.activity-pill--dormant{--dot:var(--color-activity-dormant)}.activity-pill--quiet{--dot:var(--color-activity-quiet)}.activity-pill--active{--dot:var(--color-activity-active)}.activity-pill--festival{--dot:var(--color-activity-festival)}.activity-source-note{font-size:var(--text-xs);color:var(--color-text-faint);margin:6px 0 0}.festival-chip{margin-top:var(--space-2);font-size:var(--text-xs);color:var(--seal-deep);border:1px solid var(--seal-deep);padding:2px var(--space-2);background:#b8321f1f;border-radius:3px;font-weight:600;display:inline-block}.overview-stats{gap:var(--space-5);margin-top:var(--space-3);display:flex}.overview-stat{flex-direction:column;display:flex}.overview-stat strong{font-family:var(--font-num);font-variant-numeric:tabular-nums;font-size:var(--text-xl);color:var(--color-text);font-weight:700}.overview-stat span{font-size:var(--text-xs);color:var(--color-text-faint)}.artist-list{flex-direction:column;display:flex}.artist-row{appearance:none;justify-content:space-between;align-items:center;gap:var(--space-2);width:100%;min-height:44px;padding:var(--space-2) 0;border:none;border-bottom:1px solid var(--color-border);cursor:pointer;text-align:left;background:0 0;display:flex}.artist-row:last-child{border-bottom:none}.artist-row__name{color:var(--color-text);font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.artist-row__plays{color:var(--color-text-faint);font-family:var(--font-num);font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--text-xs);flex:none}.artist-list .artist-row:first-child:not(.artist-row--faded) .artist-row__plays{color:var(--paper);background:var(--seal-deep);border-radius:3px;padding:1px 6px}.artist-row--faded .artist-row__name,.artist-row--faded .artist-row__plays{opacity:.55}.history-caption{font-size:var(--text-xs);color:var(--color-text-faint);margin:0 0 var(--space-2)}.history-bars{border-bottom:1px solid var(--color-border);align-items:flex-end;gap:2px;height:72px;padding-bottom:1px;display:flex}.history-bar{background:var(--color-activity-active);border-radius:2px 2px 0 0;flex:1 1 0;min-width:2px}.history-bar--zero{background:var(--color-border-strong);height:3px}.history-bar--unplaced{background:var(--color-secondary);opacity:.6;height:3px}.history-bar--nodata{background:repeating-linear-gradient(45deg, var(--color-border), var(--color-border) 2px, transparent 2px, transparent 6px);height:100%}.nowplaying-card{align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-panel);background:var(--color-surface-raised);border:1px solid var(--color-border);margin-top:var(--space-2);display:flex}.np-cover{border-radius:var(--cover-radius);background:var(--color-canvas-bg);flex:none;width:40px;height:40px;overflow:hidden}.np-cover-img{object-fit:contain;width:100%;height:100%}.np-meta{flex:auto;min-width:0}.np-title{font-size:var(--text-sm);color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;font-weight:700;overflow:hidden}.np-sub{font-size:var(--text-xs);color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;overflow:hidden}.eq{flex:none;align-items:flex-end;gap:2px;height:16px;display:flex}.eq i{background:var(--color-accent);border-radius:1px;width:3px;animation:.9s ease-in-out infinite eq-pulse;display:block}.eq i:first-child{animation-delay:-.6s}.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:0s}@keyframes eq-pulse{0%,to{height:4px}50%{height:14px}}.songs-controls{gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap;display:flex}.songs-search{min-height:40px;padding:0 var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface-raised);color:var(--color-text);flex:160px}.songs-search::placeholder{color:var(--color-text-faint)}.songs-filter{min-height:40px;padding:0 var(--space-2);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface-raised);color:var(--color-text);flex:120px}.song-list{flex-direction:column;display:flex}.song-row{align-items:center;gap:var(--space-3);padding:var(--space-2) 0;border-bottom:1px solid var(--color-border);color:inherit;min-height:44px;text-decoration:none;display:flex}.song-row:last-child{border-bottom:none}.song-row__cover{border-radius:var(--cover-radius);background:var(--color-canvas-bg);width:44px;height:44px;box-shadow:0 0 0 1px var(--color-border-strong);flex:none;overflow:hidden}.song-row__cover-img{object-fit:contain;width:100%;height:100%}.song-row__info{flex:auto;min-width:0}.song-row__title{font-size:var(--text-sm);color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.song-row__meta{font-size:var(--text-xs);color:var(--color-text-faint);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;overflow:hidden}.song-row__plays{font-family:var(--font-num);font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--text-xs);color:var(--color-text-faint);flex:none}.song-list .song-row:first-child .song-row__plays{color:var(--paper);background:var(--seal-deep);border-radius:3px;padding:1px 6px}.song-list--unranked .song-row:first-child .song-row__plays{color:var(--color-text-faint);background:0 0;border-radius:0;padding:0}.playlist-row{appearance:none;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-2) 0;border:none;border-bottom:1px solid var(--color-border);cursor:pointer;text-align:left;font:inherit;color:inherit;background:0 0;min-height:44px;display:flex}.playlist-row:last-child{border-bottom:none}.playlist-back{appearance:none;color:var(--color-text-muted);font:inherit;font-size:var(--text-sm);padding:0 0 var(--space-2);cursor:pointer;background:0 0;border:none}.playlist-back:hover{color:var(--color-text)}.ta-row__art canvas{width:100%;height:100%;image-rendering:pixelated;display:block}.notice-board-headline{font-family:var(--font-display);font-size:var(--text-md);line-height:var(--leading-tight);color:var(--color-text);margin:0 0 var(--space-1)}.hokage-panel{flex-direction:column;height:100%;min-height:0;display:flex}.hokage-log{gap:var(--space-2);min-height:120px;padding-bottom:var(--space-2);flex-direction:column;flex:auto;display:flex;overflow-y:auto}.hokage-bubble{max-width:85%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-lg);font-size:var(--text-sm);line-height:var(--leading-normal);white-space:pre-wrap;overflow-wrap:break-word}.hokage-bubble--user{background:var(--ink);color:var(--paper);border-bottom-right-radius:var(--radius-sm);align-self:flex-end}.hokage-bubble--model{background:var(--color-surface-raised);color:var(--color-text);border-bottom-left-radius:var(--radius-sm);align-self:flex-start}.hokage-bubble--thinking{color:var(--color-text-faint);font-style:italic}.hokage-note{font-size:var(--text-xs);margin:var(--space-1) 0 0}.hokage-note--error{color:var(--seal-deep)}.hokage-note--limited{color:var(--color-text-faint)}.hokage-chips{gap:var(--space-1);margin:var(--space-2) 0;flex-wrap:wrap;flex:none;display:flex}.hokage-chip{appearance:none;border:1.5px solid var(--color-border-strong);color:var(--color-text);font-family:var(--font-body);border-radius:var(--radius-pill);padding:6px var(--space-3);font-size:var(--text-xs);cursor:pointer;min-height:32px;transition:border-color var(--duration-fast) var(--ease-standard);background:0 0}.hokage-chip:hover{border-color:var(--ink)}.hokage-remaining{font-size:var(--text-xs);color:var(--color-text-faint);margin:0 0 var(--space-2);flex:none}.hokage-inputrow{gap:var(--space-2);padding-bottom:var(--space-1);flex:none;display:flex}.hokage-input{min-width:0;min-height:40px;padding:0 var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface-raised);color:var(--color-text);font-family:var(--font-body);font-size:var(--text-sm);flex:auto}.hokage-input::placeholder{color:var(--color-text-faint)}.hokage-input:disabled{opacity:.6}.hokage-send{appearance:none;min-height:40px;padding:0 var(--space-4);border-radius:var(--radius-md);background:var(--ink);color:var(--paper);font-family:var(--font-body);font-size:var(--text-sm);cursor:pointer;transition:background var(--duration-fast) var(--ease-standard);border:none;flex:none;font-weight:700}.hokage-send:hover:not(:disabled){background:var(--wood-dark)}.hokage-send:disabled{opacity:.6;cursor:default}.chronicle-day{padding:var(--space-3) 0;border-bottom:1px solid var(--color-border)}.chronicle-day:last-child{border-bottom:none}.chronicle-day__head{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.chronicle-day__date{font-family:var(--font-display);font-size:var(--text-sm);color:var(--color-text);margin:0}.chronicle-day__badge{font-size:var(--text-xs);color:var(--color-text-faint);border:1px solid var(--color-border-strong);border-radius:var(--radius-pill);padding:1px 8px;font-weight:600}.chronicle-day__summary{font-size:var(--text-sm);color:var(--color-text-muted);line-height:var(--leading-normal);margin:var(--space-1) 0 var(--space-2)}.chronicle-events{gap:var(--space-2);margin-bottom:var(--space-2);flex-direction:column;display:flex}.chronicle-event{padding:6px var(--space-2) 6px 10px;border-left:2px solid var(--color-border-strong);transition:background var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard);border-radius:2px}.chronicle-event__line{font-size:var(--text-sm);color:var(--color-text);margin:0;font-weight:600}.chronicle-event__reasoning{font-size:var(--text-xs);color:var(--color-text-muted);margin:2px 0 0;font-style:italic}.chronicle-event--active{border-left-color:var(--seal-deep);background:#b8321f14}.chronicle-replay-btn{appearance:none;min-height:36px;padding:0 var(--space-3);border:1.5px solid var(--ink);color:var(--ink);font-family:var(--font-body);font-size:var(--text-xs);cursor:pointer;transition:background var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);background:0 0;border-radius:3px;font-weight:700}.chronicle-replay-btn:hover:not(:disabled){background:var(--ink);color:var(--paper)}.chronicle-replay-btn:disabled{opacity:.5;cursor:default}.chronicle-replay-btn--active{background:var(--seal-deep);border-color:var(--seal-deep);color:var(--paper)}@media (width>=900px){.sidebar-backdrop{display:none}.sidebar{top:calc(var(--topbar-h) + var(--sidebar-inset));right:var(--sidebar-inset);bottom:var(--sidebar-inset);width:var(--sidebar-width);box-shadow:0 0 0 2px var(--wood-dark), 0 30px 70px #00000080;padding:var(--space-3) var(--space-4) var(--space-4);position:absolute;left:auto}.sidebar__grabber{display:none}.top-artists-panel{left:auto;right:var(--sidebar-inset);width:320px}}.now-playing-card{opacity:0;min-width:0;transition:opacity var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard);pointer-events:none;flex:0 0 min(240px,100%);margin-left:auto;transform:translateY(-6px)}.now-playing-card.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}.now-playing-card__link{align-items:center;gap:var(--space-2);padding:var(--space-2);background:repeating-linear-gradient(0deg, #1d274809 0 1px, transparent 1px 5px), var(--color-glass-panel);border:1px solid var(--color-glass-border);border-left:4px solid var(--seal);color:inherit;border-radius:4px;text-decoration:none;display:flex;box-shadow:0 24px 48px -20px #00000080}.now-playing-card__cover{border-radius:var(--cover-radius);background:var(--color-canvas-bg);width:40px;height:40px;box-shadow:0 0 0 1px var(--color-border-strong);flex:none;overflow:hidden}.now-playing-card__cover-img{object-fit:contain;width:100%;height:100%}.now-playing-card__meta{min-width:0}.now-playing-card__label{font-size:var(--text-xs);color:var(--seal-deep);text-overflow:ellipsis;white-space:nowrap;font-weight:700;overflow:hidden}.now-playing-card__title{font-size:var(--text-sm);color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;font-weight:700;overflow:hidden}.now-playing-card__artist{font-size:var(--text-xs);color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media (width>=900px){.hud-top-band{left:calc(var(--space-4) + var(--safe-left));right:calc(var(--space-4) + var(--safe-right))}}.now-playing-card--idle .now-playing-card__link{cursor:default}.now-playing-card--idle .now-playing-card__cover{opacity:.5}.now-playing-card--idle .now-playing-card__title{color:var(--color-text-muted);font-weight:500}.history-readout{z-index:var(--z-floating);left:calc(var(--space-2) + var(--safe-left));bottom:calc(var(--space-2) + var(--safe-bottom));padding:4px var(--space-2);font-size:var(--text-xs);color:var(--color-text-muted);background:var(--color-glass);border:1px solid var(--wood);border-radius:var(--radius-pill);pointer-events:none;max-width:calc(100vw - 2 * var(--space-2));text-overflow:ellipsis;white-space:nowrap;margin:0;position:fixed;overflow:hidden}@media (width>=900px){.history-readout{left:calc(var(--space-3) + var(--safe-left));bottom:calc(var(--space-3) + var(--safe-bottom))}}.onboarding-backdrop{z-index:var(--z-onboarding);background:#1d274873;position:fixed;inset:0}.onboarding-modal{z-index:calc(var(--z-onboarding) + 1);width:min(360px, calc(100vw - 2 * var(--space-4)));max-height:calc(100dvh - 2 * var(--space-5));padding:var(--space-5) var(--space-4) var(--space-4);background:repeating-linear-gradient(0deg, #1d274809 0 1px, transparent 1px 5px), var(--color-glass-panel);border:1px solid var(--wood);border-radius:6px;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%);box-shadow:0 24px 48px -20px #0000008c}.onboarding-header{justify-content:space-between;align-items:flex-start;gap:var(--space-2);margin-bottom:var(--space-3);display:flex}.onboarding-title{font-family:var(--font-display);font-size:var(--text-md);color:var(--color-text);margin:var(--space-1) 0 0}.onboarding-body{font-size:var(--text-sm);line-height:var(--leading-normal);color:var(--color-text-muted);margin:0 0 var(--space-4)}.onboarding-dots{margin-bottom:var(--space-4);gap:6px;display:flex}.onboarding-dot{background:var(--color-border-strong);border-radius:50%;width:8px;height:8px}.onboarding-dot.is-active{background:var(--seal-deep)}.onboarding-actions{justify-content:flex-end;gap:var(--space-2);display:flex}.onboarding-btn{appearance:none;min-height:44px;padding:0 var(--space-4);border:1.5px solid var(--ink);color:var(--ink);font-family:var(--font-body);font-size:var(--text-sm);cursor:pointer;background:0 0;border-radius:3px;font-weight:700}.onboarding-btn:hover{background:#1d274814}.onboarding-btn--primary{background:var(--ink);color:var(--paper)}.onboarding-btn--primary:hover{background:var(--wood-dark)}
