:root{--caret: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");--gradient: radial-gradient(95% 75% at 8% 2%, rgba(47, 111, 224, .16) 0%, transparent 64%), radial-gradient(85% 65% at 96% 10%, rgba(210, 74, 137, .18) 0%, transparent 62%), radial-gradient(90% 70% at 4% 104%, rgba(58, 168, 138, .16) 0%, transparent 64%), radial-gradient(95% 72% at 96% 106%, rgba(196, 112, 79, .2) 0%, transparent 66%), linear-gradient(168deg, #f4f1ee 0%, #ebe6e1 55%, #e3dcd6 100%);--gradient-stops: #f4f1ee, #ece8e3, #e6e0da;--ink: #2a2724;--ink-soft: rgba(42, 39, 36, .78);--ink-faint: rgba(42, 39, 36, .55);--edge: rgba(42, 39, 36, .16);--edge-strong: rgba(42, 39, 36, .42);--wash: rgba(42, 39, 36, .06);--wash-strong: rgba(42, 39, 36, .11);--sunk: rgb(0 0 0 / 6%);--mark-sat: 38%;--mark-light: 40%;--buy: #1f5fbf;--buy-ink: #ffffff;--pick: #2f7a6f;--solid-bg: #2a2724;--solid-fg: #f2efec;--glass-bg: rgba(255, 255, 255, .5);--popover: #f6f3f0;--glass-edge: rgba(42, 39, 36, .14);--logo-top: #7b4bc4;--logo-middle: #d24a89;--logo-tip: #c45238;--logo-fm: #d24a89}:root[data-palette=dark]{--buy: #d1503f;--buy-ink: #ffffff;--pick: #56b8a6;--gradient: radial-gradient(95% 75% at 8% 2%, rgba(47, 111, 224, .34) 0%, transparent 64%), radial-gradient(85% 65% at 96% 10%, rgba(210, 74, 137, .3) 0%, transparent 62%), radial-gradient(90% 70% at 4% 104%, rgba(58, 168, 138, .26) 0%, transparent 64%), radial-gradient(95% 72% at 96% 106%, rgba(196, 112, 79, .32) 0%, transparent 66%), linear-gradient(168deg, #141319 0%, #191720 55%, #1e1a25 100%);--gradient-stops: #16151a, #1a181f, #1f1c24;--ink: #e7e3de;--ink-soft: rgba(231, 227, 222, .78);--ink-faint: rgba(231, 227, 222, .55);--edge: rgba(231, 227, 222, .18);--edge-strong: rgba(231, 227, 222, .44);--wash: rgba(231, 227, 222, .08);--wash-strong: rgba(231, 227, 222, .14);--sunk: rgb(0 0 0 / 22%);--mark-sat: 34%;--mark-light: 68%;--solid-bg: #e7e3de;--solid-fg: #17161a;--glass-bg: rgba(0, 0, 0, .3);--popover: #171512;--glass-edge: rgba(231, 227, 222, .18);--logo-top: #a07ae6;--logo-middle: #e2609c;--logo-tip: #e57e52;--logo-fm: #e2609c}:root[data-genre]{--logo-top: var(--ink);--logo-middle: var(--logo-tint);--logo-tip: var(--logo-tint);--logo-fm: var(--logo-tint)}:root[data-genre=dreampop]{--gradient: radial-gradient(42% 38% at 84% 12%, rgba(255, 231, 214, .7) 0%, transparent 100%), radial-gradient(34% 32% at 12% 86%, rgba(240, 226, 255, .55) 0%, transparent 100%), radial-gradient(110% 85% at 78% 6%, #f6b8cd 0%, transparent 60%), radial-gradient(120% 95% at 8% 40%, #b9a3e8 0%, transparent 62%), linear-gradient(162deg, #c3a6e6 0%, #efa8c2 48%, #f7c79a 100%);--gradient-stops: #c3a6e6, #b9a3e8, #f6b8cd, #efa8c2, #f7c79a;--pick: var(--ink);--ink: #2a1b3d;--ink-soft: rgba(42, 27, 61, .8);--ink-faint: rgba(42, 27, 61, .58);--edge: rgba(42, 27, 61, .26);--edge-strong: rgba(42, 27, 61, .52);--wash: rgba(42, 27, 61, .1);--wash-strong: rgba(42, 27, 61, .17);--mark-sat: 42%;--mark-light: 42%;--solid-bg: #2a1b3d;--solid-fg: #fff;--glass-bg: rgba(255, 255, 255, .26);--popover: #efe7f6;--glass-edge: rgba(42, 27, 61, .22);--logo-tint: color-mix(in oklab, var(--ink), #d24a89 40%)}:root[data-genre=synthpop]{--gradient: radial-gradient(42% 38% at 84% 12%, rgba(255, 234, 214, .7) 0%, transparent 100%), radial-gradient(34% 32% at 12% 86%, rgba(228, 248, 255, .7) 0%, transparent 100%), radial-gradient(110% 85% at 78% 6%, #f5b39c 0%, transparent 60%), radial-gradient(120% 95% at 8% 40%, #7fa6f0 0%, transparent 62%), linear-gradient(160deg, #8eb1f1 0%, #b9bdf0 50%, #f2bca8 100%);--gradient-stops: #7fa6f0, #8eb1f1, #b9bdf0, #f2bca8, #f5b39c;--pick: var(--ink);--ink: #061543;--ink-soft: rgba(6, 21, 67, .8);--ink-faint: rgba(6, 21, 67, .58);--edge: rgba(6, 21, 67, .26);--edge-strong: rgba(6, 21, 67, .52);--wash: rgba(6, 21, 67, .1);--wash-strong: rgba(6, 21, 67, .17);--mark-sat: 42%;--mark-light: 42%;--solid-bg: #061543;--solid-fg: #fff;--glass-bg: rgba(255, 255, 255, .28);--popover: #edf2fb;--glass-edge: rgba(6, 21, 67, .22);--logo-tint: color-mix(in oklab, var(--ink), #2f6fe0 45%)}:root[data-genre=janglepop]{--gradient: radial-gradient(40% 36% at 92% 4%, rgba(255, 250, 222, .75) 0%, transparent 100%), radial-gradient(32% 34% at 6% 58%, rgba(226, 250, 255, .55) 0%, transparent 100%), radial-gradient(115% 88% at 82% 6%, #ffd97a 0%, transparent 58%), radial-gradient(125% 95% at 10% 38%, #7fd4e8 0%, transparent 62%), linear-gradient(164deg, #86d9e6 0%, #b6e79f 50%, #ffd97a 100%);--gradient-stops: #86d9e6, #7fd4e8, #b6e79f, #a8e6a3, #ffd97a;--pick: var(--ink);--ink: #123a33;--ink-soft: rgba(18, 58, 51, .8);--ink-faint: rgba(18, 58, 51, .58);--edge: rgba(18, 58, 51, .26);--edge-strong: rgba(18, 58, 51, .52);--wash: rgba(18, 58, 51, .1);--wash-strong: rgba(18, 58, 51, .17);--mark-sat: 40%;--mark-light: 40%;--solid-bg: #123a33;--solid-fg: #fff;--glass-bg: rgba(255, 255, 255, .28);--popover: #eef2f7;--glass-edge: rgba(18, 58, 51, .22);--logo-tint: color-mix(in oklab, var(--ink), #3aa88a 45%)}:root[data-genre=bedroompop]{--gradient: radial-gradient(36% 34% at 78% 40%, rgba(255, 240, 214, .7) 0%, transparent 100%), radial-gradient(30% 30% at 12% 92%, rgba(255, 226, 206, .5) 0%, transparent 100%), radial-gradient(120% 90% at 14% 8%, #a9bfa3 0%, transparent 58%), radial-gradient(130% 100% at 86% 24%, #efd9b4 0%, transparent 62%), linear-gradient(166deg, #b8c7a6 0%, #e8c9a4 48%, #d99a86 100%);--gradient-stops: #a9bfa3, #b8c7a6, #efd9b4, #e8c9a4, #d99a86;--pick: var(--ink);--ink: #2e2119;--ink-soft: rgba(46, 33, 25, .8);--ink-faint: rgba(46, 33, 25, .58);--edge: rgba(46, 33, 25, .26);--edge-strong: rgba(46, 33, 25, .52);--wash: rgba(46, 33, 25, .1);--wash-strong: rgba(46, 33, 25, .17);--mark-sat: 42%;--mark-light: 42%;--solid-bg: #2e2119;--solid-fg: #fff;--glass-bg: rgba(255, 255, 255, .26);--popover: #f5ecdf;--glass-edge: rgba(46, 33, 25, .22);--logo-tint: color-mix(in oklab, var(--ink), #c4704f 45%)}:root{--space-1: 5px;--space-2: 10px;--space-3: 16px;--space-4: 24px;--space-6: 40px;--space-8: 64px;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 22px;--radius-pill: 999px;--font-heading: "Bricolage Grotesque", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-body: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--font-condensed: "Barlow Condensed", "IBM Plex Sans", Impact, sans-serif;--weight-display: 600;--weight-heading: 600;--weight-label: 600;--blur-glass: 14px;--ease: .16s ease}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--gradient);background-attachment:fixed;color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.65;font-weight:400;-webkit-font-smoothing:antialiased}.grain{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.16;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:var(--weight-heading);line-height:1.2;letter-spacing:-.015em;margin:0 0 var(--space-2);text-wrap:balance}h2{margin-top:var(--space-4);margin-bottom:var(--space-3)}h3{margin-top:var(--space-4)}h4,h5{margin-top:var(--space-3)}:is(h1,h2,h3,h4,h5,h6):first-child{margin-top:0}h1{font-size:44px;font-weight:var(--weight-display);letter-spacing:-.025em;margin-bottom:var(--space-3)}h2{font-size:27px;font-weight:var(--weight-display)}h3{font-size:21px}h4{font-size:17px}h5{font-size:15px}h6{font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-weight:var(--weight-label);color:var(--ink-soft)}.h2{font-size:27px;font-weight:var(--weight-display)}.h3{font-size:21px;font-weight:var(--weight-heading)}.h4{font-size:17px;font-weight:var(--weight-heading)}.h5{font-size:15px;font-weight:var(--weight-heading);margin-top:0}p{margin:0 0 var(--space-3)}a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}a:hover{text-decoration-thickness:2px}img{display:block;max-width:100%}figure{margin:0}figcaption{font-size:12px;margin-top:var(--space-2);color:var(--ink-faint)}code,kbd,samp{font-family:var(--font-mono);font-size:.92em}.text-muted{color:var(--ink-soft)}.text-faint{color:var(--ink-faint)}:focus{outline:none}:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:var(--radius-sm)}::selection{background:var(--wash-strong)}:root{--ok: color-mix(in srgb, #2f9e63 62%, var(--ink));--info: color-mix(in srgb, #3d7fbf 62%, var(--ink));--warn: color-mix(in srgb, #c08a3e 62%, var(--ink));--bad: color-mix(in srgb, #d4544a 62%, var(--ink))}.said{font-size:14px;line-height:1.5;margin:0;padding:var(--space-3);border-radius:var(--radius-md);background:var(--wash);border:1px solid var(--edge);color:var(--ink)}.said.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 40%,transparent);background:color-mix(in srgb,var(--ok) 9%,transparent)}.said.info{color:var(--info);border-color:color-mix(in srgb,var(--info) 40%,transparent);background:color-mix(in srgb,var(--info) 9%,transparent)}.said.warn{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 40%,transparent);background:color-mix(in srgb,var(--warn) 9%,transparent)}.said.bad{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 40%,transparent);background:color-mix(in srgb,var(--bad) 9%,transparent)}.hr{height:1px;border:0;margin:var(--space-6) 0;background:var(--edge)}.stack>*+*{margin-top:var(--space-4)}.glass{background:var(--glass-bg);border:1px solid var(--glass-edge);border-radius:var(--radius-md);padding:var(--space-4);backdrop-filter:blur(var(--blur-glass));-webkit-backdrop-filter:blur(var(--blur-glass))}.glass:has(dg-term.asking),.glass:has(.tip:hover),.glass:has(.tip:focus-visible){position:relative;z-index:5}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;text-decoration:none;font-family:var(--font-heading);font-weight:500;font-size:14px;line-height:1.2;color:var(--ink);background:transparent;border:1px solid transparent;padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);transition:background var(--ease),border-color var(--ease),filter var(--ease)}.btn svg{display:block}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--solid-bg);color:var(--solid-fg);border-color:var(--solid-bg)}.btn-primary:hover{filter:brightness(1.08)}.btn-buy{background:var(--buy);color:var(--buy-ink);border-color:var(--buy);font-weight:500}.btn-buy:hover{filter:brightness(1.1)}.btn-buy:disabled{opacity:1;cursor:default;background:color-mix(in srgb,var(--buy) 16%,transparent);color:var(--buy);border-color:color-mix(in srgb,var(--buy) 40%,transparent)}.btn-buy:disabled:hover{filter:none}.btn-secondary{background:var(--wash);border-color:var(--edge)}.btn-secondary:hover{background:var(--wash-strong);border-color:var(--edge-strong)}.btn-ghost{padding-inline:var(--space-2)}.btn-ghost:hover{background:var(--wash)}.btn-icon{width:34px;height:34px;padding:0;border-color:var(--edge);color:var(--ink-soft)}.btn-icon:hover{color:var(--ink);border-color:var(--ink);background:var(--wash)}.field>label{display:block;font-size:11px;margin-bottom:var(--space-1);letter-spacing:.15em;text-transform:uppercase;font-weight:var(--weight-label);color:var(--ink-soft)}.input{width:100%;min-height:38px;padding:8px 14px;font:inherit;font-size:14px;color:var(--ink);caret-color:var(--ink);background:var(--wash);border:1px solid var(--edge);border-radius:var(--radius-sm);font-variant-numeric:tabular-nums;transition:border-color var(--ease),background var(--ease)}select.input{-webkit-appearance:none;appearance:none;padding-right:36px}.picker{position:relative;display:block}.picker:after{content:"";position:absolute;right:14px;top:50%;margin-top:-3px;width:10px;height:6px;pointer-events:none;background:var(--ink-soft);-webkit-mask:var(--caret) no-repeat center / 10px 6px;mask:var(--caret) no-repeat center / 10px 6px}.picker:has(select:disabled):after{background:var(--ink-faint);opacity:.55}.input::placeholder{color:var(--ink-faint);opacity:.55}.input:disabled{opacity:.55;cursor:not-allowed;color:var(--ink-faint);background:transparent;border-style:dashed}.input:disabled:hover{border-color:var(--edge)}.input:hover:not(:disabled){border-color:var(--edge-strong)}.input:focus-visible{border-color:var(--ink);outline:none}textarea.input{min-height:96px;resize:vertical;line-height:1.6}.radio{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:14px}.radio input,.seg-opt input,.chip input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.radio .dot{width:15px;height:15px;flex:none;border-radius:50%;border:1.5px solid var(--edge-strong);transition:all var(--ease)}.radio:hover .dot{border-color:var(--ink)}.radio input:checked+.dot{border-color:var(--ink);background:var(--solid-bg);box-shadow:inset 0 0 0 4px var(--solid-fg)}.radio input:focus-visible+.dot{outline:2px solid var(--ink);outline-offset:3px}.seg{display:inline-flex;padding:3px;gap:2px;background:var(--wash);border:1px solid var(--edge);border-radius:var(--radius-pill)}.seg-opt{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;font-size:13px;cursor:pointer;color:var(--ink-soft);border-radius:var(--radius-pill);transition:background var(--ease),color var(--ease)}.seg-opt:has(input:checked){background:var(--solid-bg);color:var(--solid-fg)}.seg-opt:not(:has(input:checked)):hover{background:var(--wash);color:var(--ink)}.seg-opt:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:2px}.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 13px;font-size:13px;cursor:pointer;color:var(--ink);background:var(--wash);border:1px solid var(--edge);border-radius:var(--radius-pill);transition:all var(--ease)}.chip:hover{border-color:var(--edge-strong);background:var(--wash-strong)}.chip:has(input:checked){background:color-mix(in srgb,var(--pick) 14%,transparent);color:var(--pick);border-color:var(--pick)}.chip:has(input:checked):hover{background:color-mix(in srgb,var(--pick) 22%,transparent)}.chip:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:2px}.chip-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}.card{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);border-radius:var(--radius-sm);background:var(--wash);border:1px solid transparent;transition:border-color var(--ease),background var(--ease)}.card-kicker{font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:var(--weight-label);color:var(--ink-soft)}.card-title{font-family:var(--font-heading);font-weight:500;font-size:16px;line-height:1.25;margin:0;letter-spacing:-.015em}.card-body{margin:0;font-size:13px;color:var(--ink-soft);flex:1}.card-meta{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--ink-faint)}.card-pick{cursor:pointer}.card-pick:hover{border-color:var(--edge-strong)}.card-pick[aria-pressed=true]{border-color:var(--ink);background:var(--wash-strong)}.tag{display:inline-flex;align-items:center;font-size:11px;letter-spacing:.03em;padding:3px 11px;border-radius:var(--radius-pill);background:var(--wash);color:var(--ink);border:1px solid var(--edge)}.tag-solid{background:var(--solid-bg);color:var(--solid-fg);border-color:var(--solid-bg)}.nav{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-6)}.nav-brand{display:flex;align-items:center;gap:var(--space-2);margin-right:auto}.nav-brand svg{display:block;color:var(--ink)}.nav a{color:var(--ink-soft);text-decoration:none;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:var(--weight-label)}.nav a:hover,.nav a[aria-current=page]{color:var(--ink)}.glass:has(>.table){margin-block:var(--space-4)}.table{width:100%;border-collapse:collapse;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums}.table th{text-align:left;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:var(--weight-label);color:var(--ink-soft);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--edge)}.table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--edge)}.table tbody tr:last-child td{border-bottom:0}.table tbody tr:hover{background:var(--wash)}.slider{position:relative;height:4px;border-radius:var(--radius-pill);background:var(--edge)}.slider .fill{position:absolute;inset:0 42% 0 0;border-radius:var(--radius-pill);background:var(--ink);display:block}.slider .knob{position:absolute;left:58%;top:50%;width:13px;height:13px;display:block;margin:-6.5px 0 0 -6.5px;border-radius:50%;background:var(--solid-bg);box-shadow:0 0 0 5px var(--wash)}.dialog-backdrop{position:fixed;inset:0;display:grid;place-items:center;padding:var(--space-4);background:var(--glass-bg);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.dialog{width:min(460px,100%);display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6);border-radius:var(--radius-lg);background:var(--gradient);border:1px solid var(--glass-edge)}.dialog-title{font-family:var(--font-heading);font-weight:var(--weight-display);font-size:21px}.dialog-body{font-size:14px;color:var(--ink-soft)}.dialog-actions{display:flex;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-2)}@media(prefers-reduced-motion:reduce){*{transition:none!important}}.head{max-width:68ch;padding:var(--space-4) 0 0;margin-bottom:var(--space-4)}.head>:last-child{margin-bottom:0}.lede{font-size:17px}.narrow{max-width:72ch}.onward{margin-top:var(--space-6);font-size:15px}
