@layer theme,base;@layer components{.page-band .band-body{gap:var(--s-3);padding-top:var(--s-2);padding-bottom:var(--s-5);display:grid}.page-band h1{max-width:14ch;font-size:clamp(34px,10vw,48px)}.page-band .lede{color:var(--on-field-2);max-width:44ch;font-size:var(--fs-md)}.page-band .back{color:var(--on-field);font:700 var(--fs-sm)/1 var(--font-body);align-items:center;gap:6px;width:fit-content;min-height:44px;text-decoration:none;display:inline-flex}.page-band .back:hover{text-decoration:underline}@media (width>=900px){.page-band .back{display:none}}.page-band .eyebrow[data-phase=closed]{color:var(--on-field-2)}.vstrip{margin-top:var(--s-2);grid-template-columns:repeat(10,1fr);gap:4px;display:grid}.vstrip .s{justify-items:center;gap:4px;display:grid}.vstrip .s i{aspect-ratio:1;border:2px dashed color-mix(in srgb, var(--on-field) 50%, transparent);border-radius:50%;width:100%;display:block;overflow:hidden}.vstrip .s i img{object-fit:cover;width:100%;height:100%;display:block}.vstrip .s[data-filled] i{border:2px solid var(--on-field)}.vstrip .s b{font:800 12px/1 var(--font-body);color:var(--on-field-2);font-variant-numeric:tabular-nums}.vstrip .s[data-p="12"] b{color:var(--accent-2)}.vstrip .s[data-p="12"] i{border-color:var(--accent-2)}.vote-grid{gap:var(--s-2);padding-bottom:calc(190px + env(safe-area-inset-bottom));display:grid}.vstate{gap:var(--s-3);padding-top:var(--s-4);display:grid}.vstate .section-title{margin:var(--s-4) 0 0}.vnext{gap:var(--s-3);margin:0;padding:0;list-style:none;display:grid}.vnext li.card{justify-content:space-between;align-items:center;gap:var(--s-3);padding:var(--s-3) var(--s-4);display:flex}.vpick{align-items:center;gap:var(--s-3);padding:var(--s-4);min-height:80px;color:var(--text);transition:transform var(--dur-1) var(--ease-out);grid-template-columns:1fr auto;text-decoration:none;display:grid}.vpick:hover{transform:translateY(-2px)}.vpick .tx{gap:6px;min-width:0;display:grid}.vpick .ti{font:800 var(--fs-lg)/1.15 var(--font-display)}.vpick .go{min-height:44px;padding:0 var(--s-4);border-radius:var(--radius-pill);background:var(--accent);color:var(--accent-contrast);font:700 var(--fs-sm)/1 var(--font-body);align-items:center;display:inline-flex}.songs-col{min-width:0}.gate{gap:var(--s-3);padding:var(--s-4);margin-top:var(--s-5);border-radius:var(--radius-md);border:2px dashed var(--border-strong);background:var(--surface-sunk);flex-wrap:wrap;align-items:center;display:flex}.gate .lock{width:32px;height:32px;color:var(--accent-text);flex:none}.gate>div{flex:200px;min-width:0}.gate .btn{flex:none}.gate strong{font:800 var(--fs-md)/1.2 var(--font-display);display:block}.gate span{font-size:var(--fs-sm);color:var(--text-muted)}.gate[data-open=true]{border:2px solid var(--status-approved);background:color-mix(in srgb, var(--success) 14%, var(--surface-raised))}.gate[data-open=true] .lock{display:none}.gate[data-open=true] strong:before{content:"✓ ";color:var(--status-approved-text)}.gate[data-nudge]{animation:nudge .4s var(--ease-out)}@keyframes nudge{20%{transform:translate(-8px)}50%{transform:translate(7px)}80%{transform:translate(-3px)}}.songs-col .section-title{margin-top:var(--s-5)}.vlist{gap:var(--s-3);margin:0;padding:0;list-style:none;display:grid}.vsong{background:var(--surface-raised);border-radius:var(--radius-md);box-shadow:var(--shadow-1);padding:var(--s-3);transition:background var(--dur-2)}.vsong[data-pts]{background:color-mix(in srgb, var(--accent) 14%, var(--surface-raised))}.vsong[data-pts="12"]{background:color-mix(in srgb, var(--rank-1) 24%, var(--surface-raised))}.vsong[data-pts="10"]{background:color-mix(in srgb, var(--rank-2) 20%, var(--surface-raised))}.vsong[data-pts="8"]{background:color-mix(in srgb, var(--rank-3) 22%, var(--surface-raised))}.vsong[data-just]{animation:pop var(--dur-3) var(--ease-pop)}.vc-main{position:relative}.vsong .sel{gap:var(--s-3);width:100%;min-height:56px;color:inherit;text-align:left;cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:0;grid-template-columns:56px minmax(0,1fr) 44px 52px;align-items:center;padding:0;display:grid}.vsong .sel[aria-disabled=true]{cursor:default}.vsong .grip{display:none}.vsong .cover{width:var(--cs,56px);height:var(--cs,56px);display:block;position:relative}.vsong .cover .cv{border-radius:var(--radius-sm);object-fit:cover;width:100%;height:100%;display:block}.cv-ph{background:var(--accent-soft);color:var(--accent-text);font:800 24px/1 var(--font-display);place-items:center;display:grid}.vsong .cover .cv-ph{display:grid}.vsong .cover .flag{--ring:var(--surface-raised);position:absolute;bottom:-8px;right:-8px}.vsong .meta{gap:1px;min-width:0;display:grid}.vsong .country{font:800 var(--fs-xs)/1.2 var(--font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-text)}.vsong .ti{font:800 var(--fs-md)/1.15 var(--font-display);letter-spacing:-.01em;overflow-wrap:anywhere}.vsong .ar{font-size:var(--fs-sm);color:var(--text-muted);line-height:1.25}.vsong .play{top:50%;right:calc(52px + var(--s-3));background:var(--accent);width:44px;height:44px;color:var(--accent-contrast);transition:transform var(--dur-1) var(--ease-out);border:0;border-radius:50%;place-items:center;display:grid;position:absolute;translate:0 -50%}.vsong .play svg{width:22px;height:22px}.vsong a.play:hover{transform:scale(1.06)}.vsong .play[data-none]{box-shadow:inset 0 0 0 2px var(--border-strong);color:var(--text-muted);background:0 0}.vsong .play[data-none]:after{content:"–";font:800 20px/1 var(--font-body)}.slot{--sz:52px;transition:transform var(--dur-2) var(--ease-pop), background var(--dur-1);grid-column:4}.slot:not([data-p]){box-shadow:inset 0 0 0 2px var(--border-strong);color:var(--text-muted);background:0 0;font-size:26px}.sel:not([aria-disabled=true]):active .slot{transform:scale(.94)}.slot[data-locked]{opacity:.55}.slot[data-locked]:after{content:"";border-radius:3px;width:14px;height:14px;box-shadow:inset 0 0 0 2px}.vsong[data-open] .slot{box-shadow:0 0 0 3px var(--text)}.vsong .sel:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.picker{gap:var(--s-2);padding:var(--s-4) 0 var(--s-1);animation:open var(--dur-2) var(--ease-out);grid-template-columns:repeat(5,1fr);justify-items:center;display:grid}@keyframes open{0%{opacity:0;transform:translateY(-6px)}}.pick{--sz:52px;cursor:pointer;transition:transform var(--dur-1) var(--ease-out);border:0;position:relative}.pick:hover{transform:scale(1.08)}.pick:focus-visible,.rung:focus-visible,.clear:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.pick[data-taken]{opacity:.5}.pick[data-mine]{box-shadow:0 0 0 3px var(--text)}.pick .who{--sz:22px;--ring:var(--surface-raised);position:absolute;bottom:-5px;right:-5px}.pick[data-p="12"] .who{--sz:16px;bottom:3px;right:4px}.picker-foot{justify-content:center;gap:var(--s-2);flex-wrap:wrap;grid-column:1/-1;display:flex}.clear{min-height:44px;padding:0 var(--s-4);color:var(--accent-text);font:700 var(--fs-sm)/1 var(--font-body);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;text-decoration:underline}.rungs{gap:6px;margin:0;padding:0;list-style:none;display:grid}.rung{align-items:center;gap:var(--s-3);width:100%;min-height:56px;padding:6px var(--s-4) 6px 6px;border-radius:var(--radius-pill);background:var(--accent-soft);color:var(--text);text-align:left;cursor:pointer;transition:box-shadow var(--dur-1);border:0;grid-template-columns:auto auto minmax(0,1fr);display:grid}.rung[aria-disabled=true]{cursor:default}.rungs li:not([data-filled]) .rung{box-shadow:inset 0 0 0 2px var(--border);background:0 0;grid-template-columns:auto 1fr}.rung[data-over]{box-shadow:0 0 0 3px var(--accent-text)}.rung[data-just]{animation:pop var(--dur-3) var(--ease-pop)}.rung .free{color:var(--text-muted);font-size:var(--fs-sm);font-weight:600}.rungs li[data-p="12"][data-filled] .rung{background:var(--rank-1);color:var(--on-bright)}.rungs li[data-p="10"][data-filled] .rung{background:var(--rank-2);color:var(--on-bright)}.rungs li[data-p="8"][data-filled] .rung{background:var(--rank-3);color:var(--on-bright)}.rungs li[data-filled] .pt[data-p="12"]{background:var(--on-bright);color:var(--rank-1)}.rungs li[data-p="10"][data-filled] .pt,.rungs li[data-p="8"][data-filled] .pt{background:var(--on-bright);color:var(--on-field)}.rung .who{min-width:0;display:grid}.rung .who strong{font:800 var(--fs-md)/1.1 var(--font-display)}.rung .who span{font-size:var(--fs-sm);opacity:.78;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.rung .pt{--sz:44px}.flag-none{background:color-mix(in srgb, currentColor 14%, transparent);box-shadow:inset 0 0 0 2px color-mix(in srgb, currentColor 30%, transparent);display:block}.board,.board-card{display:contents}.board-head,.board-scale,.board .rungs{display:none}.votebar{left:0;right:0;bottom:calc(68px + env(safe-area-inset-bottom));z-index:25;background:var(--surface-raised);border-top:1px solid var(--border);gap:6px;padding:10px 16px;display:grid;position:fixed}.vb-row{justify-content:space-between;align-items:center;gap:var(--s-3);display:flex}.vb-info{line-height:1.1;display:grid}.vb-info b{font:800 26px/1 var(--font-display);letter-spacing:-.03em}.vb-info>span{font-size:var(--fs-sm);color:var(--text-muted)}.votebar .btn{min-width:156px}.vb-error{font:700 var(--fs-sm)/1.3 var(--font-body);color:var(--danger-text)}@media (width<=899px){html:has(.votebar) [data-sonner-toaster]{top:auto!important;bottom:calc(150px + env(safe-area-inset-bottom))!important;height:0!important}html:has(.votebar) [data-sonner-toast]{top:auto!important;bottom:0!important}}.sent{padding-top:var(--s-5)}.sent-card{gap:var(--s-4);padding:var(--s-5);border-radius:var(--radius-lg);background:var(--surface-raised);box-shadow:var(--shadow-1);justify-items:start;display:grid}.sent-card h2{font-size:var(--fs-3xl)}.sent-card p{color:var(--text-muted)}.sent-card .rungs{width:100%}.sent-card .rung{cursor:default}.sent-actions{gap:var(--s-3);flex-wrap:wrap;display:flex}.stamp{background:var(--status-approved);width:64px;height:64px;color:var(--on-bright);font:800 32px/1 var(--font-display);animation:slap var(--dur-3) var(--ease-pop);border-radius:50%;place-items:center;display:grid;transform:rotate(-8deg)}.drag-ghost{z-index:60;pointer-events:none;border-radius:var(--radius-md);background:var(--surface-raised);color:var(--text);box-shadow:var(--shadow-lift);font:700 var(--fs-sm)/1.1 var(--font-body);align-items:center;gap:10px;padding:6px 14px 6px 6px;display:flex;position:fixed;top:0;left:0}.drag-ghost .cv{border-radius:var(--radius-sm);object-fit:cover;width:40px;height:40px}body.dragging{-webkit-user-select:none;user-select:none;cursor:grabbing}}@layer utilities;@media (prefers-reduced-motion:reduce){@layer components{.gate[data-nudge],.picker,.vsong[data-just],.rung[data-just],.stamp{animation:none}}}@media (width>=900px){@layer components{.page-band .band-body{padding-top:var(--s-3);padding-bottom:var(--s-7)}.page-band h1{max-width:none;font-size:64px}.vstrip{display:none}.vote-grid{gap:var(--s-7);padding-top:var(--s-2);grid-template-columns:minmax(0,1fr) 400px;align-items:start;padding-bottom:80px}.vote-grid[data-sent]{grid-template-columns:minmax(0,640px);justify-content:center}.vlist{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.vsong{padding:var(--s-4)}.board{margin-top:var(--s-5);display:block;position:sticky;top:96px}.board-card{gap:var(--s-4);padding:var(--s-5);border-radius:var(--radius-lg);background:var(--surface-raised);box-shadow:var(--shadow-1);display:grid}.board-head{justify-content:space-between;align-items:baseline;display:flex}.board-head h2{font-size:var(--fs-2xl)}.board-scale{margin-top:calc(-1 * var(--s-3));font:600 var(--fs-sm)/1.3 var(--font-body);color:var(--text-muted);display:block}.board .rungs{display:grid}.tally{font:700 var(--fs-md)/1 var(--font-body);color:var(--text-muted)}.tally b{font:800 var(--fs-2xl)/1 var(--font-display);color:var(--text)}.votebar{background:0 0;border:0;padding:0;position:static}.vb-info{display:none}.votebar .btn{width:100%}.gate{margin-top:var(--s-5)}.vstate .vnext{max-width:720px}}}@media (width>=900px) and (pointer:fine){@layer components{.vsong .sel{gap:var(--s-2) var(--s-3);grid-template-columns:16px 56px minmax(0,1fr) 44px 52px}.vsong .grip{touch-action:none;cursor:grab;width:16px;height:44px;color:var(--text-muted);opacity:.45;place-items:center;margin-left:-4px;display:grid}.vsong .sel:hover .grip{opacity:1}.vsong .grip i{background-image:radial-gradient(circle,currentColor 1.4px,#0000 1.8px);background-size:5px 6px;width:10px;height:18px}.slot{grid-column:5}.vsong[data-locked] .grip{visibility:hidden}}}
