@font-face{font-family:PollDisplay;src:url('assets/BarlowCondensed-ExtraBold.ttf') format('truetype');font-weight:800;font-display:swap}
:root{--display:PollDisplay,'Arial Narrow',Arial,sans-serif;--visible-height:100dvh;--visible-top:0px}
svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.masthead .comparison-link{font-size:12px;font-weight:600;letter-spacing:0;text-decoration:underline;text-underline-offset:4px}
.player{min-height:0}.player-header{display:flex;align-items:center;gap:14px;padding:12px 20px;background:transparent;min-height:55px}.comparison-return{display:grid;place-items:center;min-width:36px;min-height:36px}.progress{flex:1;gap:4px}#progress-text{font-size:10px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.screen{animation:none;padding:24px;justify-content:center;gap:24px}.screen h2,.duel .choice:not(.both) .choice-label{font-family:var(--display);font-weight:800}.screen h2{font-size:44px;line-height:.98;letter-spacing:-.5px;margin:0;text-wrap:balance}.screen h2:focus-visible{outline:none}.screen>.kicker,.screen>.question-hint{display:none}
.choice-key{display:none}.choices{gap:12px}.choice{padding:15px 18px;gap:14px;min-height:64px;transition:background .15s,transform .15s,border-color .15s,box-shadow .15s}.choice:hover{transform:none;box-shadow:3px 3px 0 var(--ink)}.choice[aria-pressed=true]{transform:none;box-shadow:0 0 0 3px var(--wash),0 0 0 5px var(--ink)}.choice-label{flex:1;overflow-wrap:normal}.choice-check{width:23px;height:23px;border:1.5px solid currentColor;border-radius:50%;opacity:.4;display:grid;place-items:center;flex:none}.choice-check svg{width:15px;height:15px;opacity:0;stroke-width:2.5}.choice[aria-pressed=true] .choice-check{opacity:1;background:var(--ink);color:var(--wash);border-color:var(--ink)}.choice[aria-pressed=true] .choice-check svg{opacity:1}.duel .choice:not(.both){min-height:108px;padding:18px}.duel .choice:not(.both) .choice-label{font-size:40px;letter-spacing:0;max-width:none}.both{min-height:44px;padding:10px 18px}.both .choice-check{width:19px;height:19px}.both:hover,.text-skip:hover{background:transparent;box-shadow:none}.grid .choice{min-height:76px;flex-direction:row;align-items:center;font-size:15px;line-height:1.2}.list .choice{font-size:15px;min-height:62px}.reaction{margin:0;min-height:20px;padding:0;font-size:12px}.reaction.visible{animation:none}
.navigation{position:relative;display:flex;align-items:center;gap:10px;padding:8px 22px 14px;min-height:64px;background:transparent;border:0}.nav-button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;font-size:12px;padding:8px 10px;border-radius:30px}.nav-button.next{margin-left:auto}.nav-button svg{height:19px;width:19px}.nav-button:disabled{opacity:.45}.mobile-next{display:none}.profile-shortcut{font-size:11px;border:1px solid currentColor}.swipe-icon{transform:rotate(90deg)}
.text-form{gap:12px;margin:0}.text-form input{font-size:22px;line-height:1.3;min-height:64px;padding:16px;border-radius:12px;border:1.5px solid currentColor;background:rgba(255,255,255,.3)}.text-form input::placeholder{font-size:19px;color:inherit;opacity:.65}.text-form .sr-only{font-size:1px}.text-skip{margin:0;min-height:44px;font-size:12px}.text-skip[aria-pressed=true]{background:var(--ink);color:var(--wash);border-color:var(--ink)}.answer-note{margin:0;font-size:10px;line-height:1.4;opacity:.75}.music-suggestions{border-radius:12px}.suggestion-heading{padding:9px 12px}.suggestion-list{max-height:190px}.music-option{min-height:49px;padding:10px 14px}.music-option strong{font-size:14px}.music-option span:empty{display:none}.music-option:hover{background:transparent}.music-option[aria-selected=true]{background:#eee5f8}.empty-search{padding:12px;font-size:12px}.change-artist{min-height:44px}.search-note{display:none}.text-form:has(.music-suggestions:not([hidden])){gap:10px}
.reel-stage{overflow:hidden;touch-action:pan-y;scrollbar-width:none}.reel-track{height:100%;transform:translate3d(0,-100%,0);will-change:transform}.reel-pane{height:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;background:var(--wash)}.reel-pane[data-theme=peach]{--wash:var(--peach)}.reel-pane[data-theme=lilac]{--wash:var(--lilac)}.reel-pane[data-theme=mint]{--wash:var(--mint)}.reel-pane[data-theme=lemon]{--wash:var(--lemon)}.reel-pane[data-theme=pink]{--wash:var(--pink)}.reel-settling{transition:transform var(--slide-duration,240ms) cubic-bezier(.22,.75,.22,1)}.reel-dragging{user-select:none}.reel-dragging .choice{transition:none}
.loader-screen,.profile-screen,.review-screen{gap:16px}.loader-screen h2{font-size:44px}.loader-disc{margin:0 auto 10px}.disc-center:after{content:'';width:10px;height:10px;border-radius:50%;background:var(--ink)}.loading-track{margin:10px 0}.loading-track span{animation-duration:var(--reveal-duration,1000ms)}.profile-top{margin:0}.profile-screen h2{font-size:48px}.profile-line{margin:0;font-size:15px}.mix{margin:0}.profile-details{margin:0}.profile-details dt{font-size:10px}.profile-details dd{font-size:14px}.profile-actions{margin:0}.profile-fine{margin:0}.review-list{margin:0}.review-screen{justify-content:flex-start}.review-screen h2{font-size:40px}.intro h1{font-family:var(--display);font-size:100px;letter-spacing:-2px;font-weight:800}
/* Immersive version: the question occupies the browser's available canvas. */
:root[data-view=reel]{color-scheme:dark;--ink:#f7f7f2;--paper:#18251e;--peach:#263b32;--lilac:#332c46;--mint:#203f3a;--lemon:#3f3a22;--pink:#432d3e;background:var(--paper)}
[data-view=reel] body{background:var(--paper)}[data-view=reel] .masthead,[data-view=reel] .intro{display:none}[data-view=reel] .layout{width:100%;max-width:none;margin:0;padding:0;display:block}[data-view=reel] .player{border:0;border-radius:0;box-shadow:none;margin:0;width:100%;height:var(--visible-height);max-height:none;color:var(--ink);transition:none}[data-view=reel] .player-header{width:100%;padding:16px 5vw;min-height:68px}[data-view=reel] .progress span{background:#ffffff24}[data-view=reel] .progress .done{background:#d2ff85}[data-view=reel] .progress .current{box-shadow:none;background:#ffffffa6}[data-view=reel] .screen{width:100%;max-width:1160px;margin:auto;padding:30px 5vw 40px;gap:32px}[data-view=reel] .screen h2{font-size:clamp(52px,6.4vw,86px);max-width:950px;text-wrap:balance}[data-view=reel] .choices.duel{display:grid;grid-template-columns:1fr 1fr;gap:20px}[data-view=reel] .choice{--tile:#e4f2dd;color:#19271e;background:var(--tile);border:2px solid transparent;border-radius:20px;box-shadow:none;padding:25px;min-height:110px}[data-view=reel] .duel .choice:not(.both){min-height:230px;padding:32px}[data-view=reel] .duel .choice:first-child{--tile:#d2ff85;background:var(--tile)}[data-view=reel] .duel .choice:nth-child(2){--tile:#ceb7f9;background:var(--tile)}[data-view=reel] .duel .choice:not(.both) .choice-label{font-size:clamp(42px,5.5vw,74px);max-width:85%;line-height:.98}[data-view=reel] .choice-check{width:26px;height:26px;align-self:center}[data-view=reel] .choice[aria-pressed=true]{border-color:#fff;box-shadow:0 0 0 2px var(--wash),0 0 0 4px #fff}[data-view=reel] .choice[aria-pressed=true] .choice-check{background:#19271e;border-color:#19271e;color:var(--tile)}[data-view=reel] .choice.both{grid-column:1/-1;color:var(--ink);background:transparent;border:1px solid #ffffff55;min-height:48px;max-width:360px;width:100%;margin:0 auto;border-radius:30px;padding:10px 20px;font-size:13px}[data-view=reel] .both[aria-pressed=true] .choice-check{color:#19271e;background:#d2ff85;border-color:#d2ff85}[data-view=reel] .grid{grid-template-columns:repeat(3,1fr);gap:18px}[data-view=reel] .grid .choice{font-size:22px;min-height:130px}[data-view=reel] .list{display:grid;grid-template-columns:1fr 1fr;gap:18px}[data-view=reel] .list .choice{font-size:24px;min-height:130px}[data-view=reel] .reaction{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[data-view=reel] .navigation{padding:10px 5vw 20px;max-width:1160px;width:100%;margin:auto;min-height:74px}[data-view=reel] .nav-button{font-size:14px}[data-view=reel] .nav-button.next{background:#d2ff85;color:#19271e;min-width:130px;font-weight:800;padding:12px 20px}[data-view=reel] .nav-button:disabled{background:transparent;color:var(--ink)}[data-view=reel] .text-form,[data-view=reel] .text-skip,[data-view=reel] .answer-note{max-width:700px;width:100%}[data-view=reel] .text-form input{color:var(--ink);background:#ffffff0c;border:1px solid #ffffff90;min-height:76px;font-size:30px;padding:20px}[data-view=reel] .text-form input::placeholder{font-size:26px}[data-view=reel] .music-suggestions{color:#19271e;border:0;background:#f3f3ed}[data-view=reel] .music-option[aria-selected=true]{background:#d2ff85}[data-view=reel] .text-skip{border:1px solid #ffffff55;color:var(--ink)}[data-view=reel] .text-skip[aria-pressed=true]{background:#d2ff85;color:#19271e;border-color:#d2ff85}[data-view=reel] .answer-note{color:var(--ink)}[data-view=reel] button:focus-visible,[data-view=reel] a:focus-visible,[data-view=reel] input:focus-visible{outline-color:#d2ff85}[data-view=reel] .profile-screen,[data-view=reel] .review-screen,[data-view=reel] .loader-screen{max-width:760px;padding-top:20px;gap:22px}[data-view=reel] .profile-screen h2,[data-view=reel] .loader-screen h2{font-size:64px}[data-view=reel] .review-screen h2{font-size:56px}[data-view=reel] .mix span,[data-view=reel] .profile-details,[data-view=reel] .review-list li{border-color:#ffffff55}[data-view=reel] .profile-fine{color:var(--ink);opacity:.65}[data-view=reel] .primary-action{color:#19271e;background:#d2ff85;border-color:#d2ff85;box-shadow:none}[data-view=reel] .review-list strong{font-size:14px}[data-view=reel] .review-list p{font-size:16px}
@media(hover:hover) and (pointer:fine){.choice:hover{transform:translateY(-3px);box-shadow:4px 6px 0 var(--ink)}.choice.both:hover{box-shadow:none;background:#ffffff26}.text-skip:hover{background:#ffffff26}.music-option:hover{background:#eee5f8}[data-view=reel] .choice:hover{transform:translateY(-4px);box-shadow:0 7px 0 #0003}[data-view=reel] .choice.both:hover{box-shadow:none}[data-view=reel] .music-option:hover{background:#d2ff85}.nav-button:not(:disabled):hover{filter:brightness(1.08)}}
@media(max-width:740px){
  body{position:fixed;inset:auto 0;top:var(--visible-top);height:var(--visible-height);overflow:hidden}.masthead{display:none}.layout{height:100%;width:100%;max-width:none;padding:10px;margin:0}.player{width:100%;height:100%;min-height:0;margin:0;border-radius:20px;max-height:none}.player-header{min-height:50px;padding:6px 15px;gap:12px}.comparison-return{min-width:32px;min-height:36px}.comparison-return svg{width:20px}.screen{padding:18px 20px 20px;gap:22px}.screen h2{font-size:clamp(34px,10.8vw,47px)}.duel .choice:not(.both){min-height:100px;padding:18px}.duel .choice:not(.both) .choice-label{font-size:36px}.grid .choice{min-height:76px;font-size:15px}.reaction{min-height:18px;font-size:11px}.navigation{display:grid;grid-template-columns:1fr 2fr 1fr;padding:5px 16px max(10px,env(safe-area-inset-bottom));min-height:62px;gap:5px}.navigation #previous{justify-self:start}.navigation #next{grid-column:2;justify-self:center;margin:0}.navigation #profile-shortcut{justify-self:end;padding:7px}.nav-button{font-size:11px}.desktop-next{display:none}.mobile-next{display:inline}.swipe-icon{transform:none}.nav-button.next{flex-direction:column;gap:1px;padding:1px 15px;min-width:116px}.nav-button.next svg{height:23px;width:23px}.navigation.ready .swipe-icon{animation:swipe-cue 1.6s ease-in-out infinite}.text-form input{font-size:21px;min-height:62px}.text-form input::placeholder{font-size:18px}.suggestion-list{max-height:180px}.profile-screen{justify-content:flex-start;gap:18px}.profile-screen h2{font-size:43px}.loader-screen h2{font-size:40px}.review-screen h2{font-size:38px}
  [data-view=reel] .layout{padding:0}[data-view=reel] .player{height:100%;border-radius:0}[data-view=reel] .player-header{padding:5px 17px;padding-top:max(5px,env(safe-area-inset-top));min-height:53px}[data-view=reel] .screen{padding:20px 24px 24px;gap:28px;max-width:560px}[data-view=reel] .screen h2{font-size:clamp(40px,12.8vw,64px);line-height:.98;max-width:none;text-align:left}[data-view=reel] .choices.duel{grid-template-columns:1fr;gap:14px}[data-view=reel] .duel .choice:not(.both){min-height:119px;padding:24px;border-radius:18px}[data-view=reel] .duel .choice:not(.both) .choice-label{font-size:clamp(35px,11vw,56px);max-width:87%}[data-view=reel] .choice-check{width:23px;height:23px}[data-view=reel] .choice.both{max-width:none;min-height:45px;font-size:13px;margin-top:2px}[data-view=reel] .grid{grid-template-columns:1fr 1fr;gap:12px}[data-view=reel] .grid .choice{min-height:88px;font-size:17px;line-height:1.2;padding:16px;border-radius:14px}[data-view=reel] .grid .choice-check{width:19px;height:19px}[data-view=reel] .list{grid-template-columns:1fr;gap:12px}[data-view=reel] .list .choice{min-height:72px;font-size:18px;padding:18px;border-radius:14px}[data-view=reel] .navigation{min-height:69px;padding:4px 20px max(10px,env(safe-area-inset-bottom));max-width:560px}[data-view=reel] .nav-button{font-size:12px}[data-view=reel] .nav-button.next{position:relative;color:var(--ink);background:transparent;min-width:130px;padding:2px 15px}[data-view=reel] .navigation:not(.ready) .next .swipe-icon{opacity:.5}[data-view=reel] .navigation.ready .next{color:#d2ff85}[data-view=reel] .text-form input{min-height:68px;font-size:24px;padding:17px}[data-view=reel] .text-form input::placeholder{font-size:21px}[data-view=reel] .profile-screen,[data-view=reel] .review-screen{padding-top:20px;gap:20px}[data-view=reel] .profile-screen h2{font-size:54px}[data-view=reel] .review-screen h2{font-size:44px}[data-view=reel] .loader-screen h2{font-size:48px}
  [data-keyboard=true] .screen,[data-keyboard=true][data-view=reel] .screen{justify-content:flex-start;gap:12px;padding-top:6px;padding-bottom:12px}[data-keyboard=true] .screen h2,[data-keyboard=true][data-view=reel] .screen h2{font-size:28px;max-width:320px}[data-keyboard=true] .player-header{min-height:38px;padding-top:0;padding-bottom:0}[data-keyboard=true] .comparison-return{min-height:32px}[data-keyboard=true] .navigation{min-height:45px;padding-top:0;padding-bottom:2px}[data-keyboard=true] .nav-button.next{flex-direction:row;gap:5px}[data-keyboard=true] .text-form input,[data-keyboard=true][data-view=reel] .text-form input{min-height:50px;font-size:20px;padding:12px}[data-keyboard=true] .suggestion-list{max-height:138px}[data-keyboard=true] .text-skip{min-height:40px}[data-keyboard=true] .answer-note{display:none}
}
@media(max-width:740px) and (max-height:690px){.screen{gap:17px;padding-top:12px;padding-bottom:16px}.duel .choice:not(.both){min-height:86px}.duel .choice:not(.both) .choice-label{font-size:32px}.grid .choice{min-height:64px}.reaction{display:none}[data-view=reel] .screen{gap:22px;padding:12px 22px 20px}[data-view=reel] .screen h2{font-size:clamp(38px,11.5vw,48px)}[data-view=reel] .duel .choice:not(.both){min-height:97px;padding:20px}[data-view=reel] .duel .choice:not(.both) .choice-label{font-size:37px}[data-view=reel] .grid .choice{min-height:74px;font-size:16px}[data-view=reel] .list .choice{min-height:61px;font-size:16px}[data-view=reel] .navigation{min-height:62px}}
@keyframes swipe-cue{0%,75%,100%{transform:translateY(0)}40%{transform:translateY(-5px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}