@font-face{font-family:senti;src:url(../fonts/senti.woff2) format("woff2");font-display:swap}:root{--bg: #0e1110;--surface: #171b19;--surface-2: #202624;--line: #2c3431;--fg: #eef3f0;--muted: #92a19a;--accent: #1ed760;--accent-ink: #06120a;--happy: #f6b93b;--angry: #f0604d;--sad: #5b8cff;--relaxed: #31c9a3;--grid-glow: .22;--font-display: "Bricolage Grotesque", "Avenir Next", system-ui, sans-serif;--font-body: "Figtree", "Helvetica Neue", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;--font-brand: "senti", "Figtree", system-ui, sans-serif;color-scheme:dark}@media (prefers-color-scheme: light){:root:not([data-theme=dark]){--bg: #f4f6f4;--surface: #ffffff;--surface-2: #eaefec;--line: #d5ddd8;--fg: #121815;--muted: #5a6962;--accent: #13a84a;--accent-ink: #ffffff;--happy: #d99410;--angry: #d9412e;--sad: #3a6be0;--relaxed: #129c7b;--grid-glow: .16;color-scheme:light}}:root[data-theme=light]{--bg: #f4f6f4;--surface: #ffffff;--surface-2: #eaefec;--line: #d5ddd8;--fg: #121815;--muted: #5a6962;--accent: #13a84a;--accent-ink: #ffffff;--happy: #d99410;--angry: #d9412e;--sad: #3a6be0;--relaxed: #129c7b;--grid-glow: .16;color-scheme:light}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--fg);font:15px/1.5 var(--font-body);-webkit-font-smoothing:antialiased}.app{max-width:1080px;margin:0 auto;padding-inline:16px;padding-block:28px 48px;display:flex;flex-direction:column;gap:28px}.app.is-embed{padding-block:12px;gap:0}.masthead{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px}.wordmark{display:flex;align-items:center;gap:10px;font:800 2.1rem/1 var(--font-display);letter-spacing:-.03em}.wordmark-glyph{width:26px;height:26px;border-radius:50%;background:conic-gradient(from 45deg,var(--happy),var(--relaxed),var(--sad),var(--angry),var(--happy));box-shadow:0 0 18px color-mix(in srgb,var(--accent) 40%,transparent)}.tagline{margin:0;color:var(--muted)}.explainer{flex-basis:100%;margin:4px 0 0;max-width:68ch;color:var(--muted);font-size:.9rem}.explainer b{color:var(--fg);font-weight:600}.stage{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:start}@media (max-width: 820px){.stage{grid-template-columns:minmax(0,1fr)}}.map-col,.list-col{min-width:0;display:flex;flex-direction:column;gap:14px}.grid-wrap{position:relative;padding:26px 30px}.axis-label{position:absolute;font:500 .7rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.axis-top{top:6px;left:50%;transform:translate(-50%)}.axis-bottom{bottom:6px;left:50%;transform:translate(-50%)}.axis-left,.axis-right{top:50%;writing-mode:vertical-rl}.axis-left{left:6px;transform:translateY(-50%) rotate(180deg)}.axis-right{right:6px;transform:translateY(-50%)}.grid{position:relative;aspect-ratio:1;max-width:100%;border-radius:20px;border:1px solid var(--line);background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--happy) calc(var(--grid-glow) * 100%),transparent) 0 55%,transparent 72%),radial-gradient(circle at 0% 0%,color-mix(in srgb,var(--angry) calc(var(--grid-glow) * 100%),transparent) 0 55%,transparent 72%),radial-gradient(circle at 0% 100%,color-mix(in srgb,var(--sad) calc(var(--grid-glow) * 100%),transparent) 0 55%,transparent 72%),radial-gradient(circle at 100% 100%,color-mix(in srgb,var(--relaxed) calc(var(--grid-glow) * 100%),transparent) 0 55%,transparent 72%),var(--surface);cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none;overflow:hidden}.grid:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.sections{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.rule{stroke:var(--line);stroke-width:.004}.rule-axis{stroke:var(--muted);stroke-opacity:.45;stroke-width:.006}.mixed-ring{fill:var(--bg);fill-opacity:.35;stroke:var(--muted);stroke-opacity:.5;stroke-width:.005;stroke-dasharray:.02 .02}.wedge{fill-opacity:.16;transition:d .12s ease}.wedge-happy{fill:var(--happy)}.wedge-angry{fill:var(--angry)}.wedge-sad{fill:var(--sad)}.wedge-relaxed{fill:var(--relaxed)}.section-label{position:absolute;transform:translate(-50%,-50%);font:600 clamp(.62rem,1.9vw,.8rem)/1 var(--font-body);letter-spacing:.01em;white-space:nowrap;opacity:.55;pointer-events:none;transition:opacity .12s ease,transform .12s ease}.section-label.is-active{opacity:1;font-family:var(--font-display);font-weight:800;transform:translate(-50%,-50%) scale(1.25)}.mixed-label{color:var(--muted);font-size:.68rem}.dot{position:absolute;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;transition:transform .16s ease,box-shadow .16s ease}.dot-happy{background:var(--happy)}.dot-angry{background:var(--angry)}.dot-sad{background:var(--sad)}.dot-relaxed{background:var(--relaxed)}.dot.is-match{box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px currentColor;color:var(--fg)}.dot.is-hovered{transform:scale(1.8);opacity:1!important;z-index:2}.puck{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:radial-gradient(circle,#ffffff 0 28%,color-mix(in srgb,var(--accent) 80%,#fff) 45%,transparent 72%);box-shadow:0 0 22px 6px color-mix(in srgb,var(--accent) 45%,transparent);pointer-events:none;z-index:3;animation:pulse 2.4s ease-in-out infinite}.spark{position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px;border-radius:50%;background:#fff;box-shadow:0 0 6px 1px color-mix(in srgb,var(--accent) 70%,#fff);animation:orbit 3.2s linear infinite}.s2{animation-delay:-.8s;animation-duration:2.6s}.s3{animation-delay:-1.6s;animation-duration:3.8s}.s4{animation-delay:-2.4s;animation-duration:2.9s}@keyframes orbit{0%{transform:rotate(0) translate(20px) scale(1);opacity:1}50%{opacity:.35}to{transform:rotate(360deg) translate(20px) scale(.6);opacity:1}}@keyframes pulse{50%{box-shadow:0 0 30px 10px color-mix(in srgb,var(--accent) 30%,transparent)}}@media (prefers-reduced-motion: reduce){.puck,.spark{animation:none}.spark{display:none}}.readout{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));align-items:end;gap:10px;margin:0;padding-inline:30px}.readout div{display:flex;flex-direction:column;gap:2px}.readout dt{font:500 .68rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.readout dd{margin:0;font:600 1.05rem/1.3 var(--font-mono);font-variant-numeric:tabular-nums}.mood-happy{color:var(--happy)}.mood-angry{color:var(--angry)}.mood-sad{color:var(--sad)}.mood-relaxed{color:var(--relaxed)}.list-col{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px}.list-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.list-head h2{margin:0;font:700 1.2rem/1.2 var(--font-display);letter-spacing:-.01em}.toggle{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--muted);cursor:pointer}.toggle input{accent-color:var(--accent);width:16px;height:16px}.notice{margin:0;padding:8px 12px;border-radius:10px;background:var(--surface-2);color:var(--muted);font-size:.82rem}.tracks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.track{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:12px;padding:9px 8px;border-radius:10px;transition:background .12s ease}.track.is-hovered,.track:hover{background:var(--surface-2)}.track-rank{font:500 .85rem/1 var(--font-mono);color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}.track-main{min-width:0;display:flex;flex-direction:column;gap:1px}.track-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-artist{font-size:.85rem;color:var(--muted)}.probbar{display:flex;height:4px;margin-top:5px;border-radius:2px;overflow:hidden;gap:1px;max-width:180px}.seg{display:block;min-width:0;flex-basis:0}.seg-happy{background:var(--happy)}.seg-angry{background:var(--angry)}.seg-sad{background:var(--sad)}.seg-relaxed{background:var(--relaxed)}.track-side{display:flex;align-items:center;gap:8px}.chip{font:500 .66rem/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;padding:4px 6px;border-radius:6px;border:1px solid var(--line);color:var(--muted)}.play{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font-weight:700;font-size:.82rem;text-decoration:none;transition:transform .12s ease,filter .12s ease}.play:hover{transform:scale(1.04);filter:brightness(1.08)}.play:focus-visible{outline:2px solid var(--fg);outline-offset:2px}.legend{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.78rem;color:var(--muted)}.legend li{display:flex;align-items:center;gap:6px}.swatch{width:10px;height:4px;border-radius:2px;display:inline-block}.method{max-width:68ch;display:flex;flex-direction:column;gap:10px}.method h2{margin:0;font:700 1.25rem/1.2 var(--font-display);text-wrap:balance}.method p{margin:0;color:var(--muted)}.method em{color:var(--fg);font-style:normal;font-family:var(--font-mono);font-size:.85em}.formula{margin:0;padding:12px 14px;border-radius:10px;overflow-x:auto;background:var(--surface);border:1px solid var(--line);font:.85rem/1.6 var(--font-mono);color:var(--fg)}.fine{font-size:.82rem}@media (max-width: 480px){.grid-wrap{padding:22px}.readout{padding-inline:22px}.list-col{padding:12px}}.label-ok{color:var(--muted)}.label-miss{color:var(--angry)}.feeling dd{display:flex;align-items:center;gap:8px}.feeling-emoji{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:1.6rem;line-height:1}.method a{color:inherit;text-decoration-color:var(--accent);text-underline-offset:2px}.method a:hover{color:var(--accent)}.dot-sm{width:5px;height:5px;margin:-2.5px 0 0 -2.5px}.dot-sm.is-match{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;z-index:1}.collection{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}.chip-btn{font:500 .8rem/1 var(--font-body);padding:7px 11px;border-radius:999px;border:1px solid color-mix(in srgb,var(--fg) 18%,transparent);background:transparent;color:var(--muted);cursor:pointer}.chip-btn:hover{color:var(--fg)}.chip-btn[aria-pressed=true]{background:var(--fg);color:var(--bg);border-color:var(--fg)}.chip-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.decades{display:flex;flex-wrap:wrap;gap:4px;margin:-4px 0 12px}.decades .chip-btn{padding:5px 9px;font-size:.75rem}.preview{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:1px solid color-mix(in srgb,var(--fg) 22%,transparent);background:transparent;color:var(--fg);cursor:pointer;font-size:.7rem;line-height:1;transition:transform .12s ease,background .12s ease}.preview:hover{transform:scale(1.06)}.preview:focus-visible{outline:2px solid var(--fg);outline-offset:2px}.preview.is-playing{background:var(--accent);color:var(--accent-ink);border-color:transparent}.preview:disabled{cursor:progress;opacity:.7}.apple{font-size:.72rem;color:var(--muted);text-decoration:none;white-space:nowrap}.apple:hover{color:var(--fg);text-decoration:underline}.section-count{margin:0;font-size:.8rem;color:var(--muted)}.chip-btn:disabled{opacity:.45;cursor:default}.map-toggle{margin:-4px 0 12px}.rate-card{border:1px solid color-mix(in srgb,var(--fg) 14%,transparent);border-radius:14px;padding:16px;margin-bottom:12px}.rate-song{display:flex;align-items:center;justify-content:space-between;gap:12px}.rate-song .track-title,.rate-song .track-artist{display:block}.rate-prompt{margin:12px 0 10px;font-size:.9rem}.rate-actions{display:flex;flex-wrap:wrap;gap:8px}.rate-privacy{margin:12px 0 0;font-size:.75rem;color:var(--muted)}