.outlier{--ol-bg: #0c0b12;--ol-ink: #fff;--ol-mute: rgb(255 255 255 / .68);--ol-glass: rgb(255 255 255 / .09);--ol-edge: rgb(255 255 255 / .16);--ol-lit: linear-gradient(100deg, #c9b6ff, #ff8fc7 45%, #ffc27a);--ol-go: linear-gradient(100deg, #7a5cff, #e0457b);position:relative;isolation:isolate;overflow:hidden;background:var(--ol-bg);color:var(--ol-ink);color-scheme:dark}.outlier [hidden]{display:none!important}.outlier :is(p,h1,h2,h3,ol){margin:0;max-width:none}.outlier button{font:inherit;color:inherit;cursor:pointer}.outlier :is(button,a,input):focus-visible{outline:3px solid #fff;outline-offset:3px}.outlier a{color:#fff}.tool-page:has(.outlier.full){max-width:none;padding:0}.tool-col:has(>.outlier.full){max-width:none}.tool-col:has(>.outlier.full)>.tool-back{display:none}.outlier.full{height:100svh;min-height:600px;max-height:1100px}.outlier.compact{height:620px;margin:0 0 var(--s7);border-radius:24px}.ol-arena{position:absolute;inset:0}.ol-track{display:flex;width:150%;height:100%;transition:transform .6s cubic-bezier(.65,0,.25,1);will-change:transform}.ol-track.go{transform:translate(-33.3333%)}.ol-track.still{transition:none}.ol-side{position:relative;flex:1 1 0;min-width:0;display:grid;place-items:center;overflow:hidden;padding:128px 40px 96px}.ol-side+.ol-side{box-shadow:inset 1px 0 0 var(--ol-edge)}.ol-bg{position:absolute;inset:0;z-index:0}.ol-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.4);filter:blur(22px) saturate(1.4);opacity:.55}.ol-bg:after{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 45%,#0c0b1259,#0c0b12e6 75%),linear-gradient(rgb(12 11 18 / .5),transparent 30%,rgb(12 11 18 / .7))}.ol-in{position:relative;z-index:1;display:grid;justify-items:center;gap:10px;width:100%;max-width:460px;text-align:center;transition:opacity .4s,transform .4s}.ol-thumb{width:min(100%,360px);aspect-ratio:16 / 9;margin-bottom:8px;overflow:hidden;border-radius:18px;box-shadow:0 24px 60px #00000080,0 0 0 1px var(--ol-edge)}.outlier[data-mode=short] .ol-thumb{width:min(56%,190px);aspect-ratio:4 / 5}.ol-thumb img{width:100%;height:100%;object-fit:cover;display:block}.ol-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font:700 clamp(18px,2vw,25px)/1.22 var(--sans);letter-spacing:-.015em;text-wrap:balance}.ol-ch{font:500 14px/1.3 var(--sans);color:var(--ol-mute)}.ol-q{margin-top:6px;font:500 15px/1.4 var(--sans);color:var(--ol-mute)}.ol-q b{color:#fff}.ol-x{font:800 clamp(52px,7vw,92px)/1 var(--sans);letter-spacing:-.04em;background:var(--ol-lit);-webkit-background-clip:text;background-clip:text;color:transparent}.ol-norm{min-height:1.3em;font:500 13px/1.3 var(--sans);color:var(--ol-mute)}.ol-btns{display:flex;gap:12px;margin-top:8px}.ol-btns button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:156px;height:58px;padding:0 24px;border:2px solid rgb(255 255 255 / .85);border-radius:999px;background:#ffffff0a;font-weight:750;font-size:18px;letter-spacing:.01em;transition:background-color .18s,color .18s,transform .18s}.ol-btns button span{font-size:13px}.ol-btns button:hover{background:#fff;color:var(--ol-bg);transform:translateY(-2px)}.ol-btns button:active{transform:scale(.97)}.ol-side.ask .ol-x,.ol-side.ask .ol-norm,.ol-side:not(.ask) .ol-btns{display:none}.ol-side.lose .ol-in{opacity:.45;transform:scale(.97)}.ol-side.win .ol-x{filter:drop-shadow(0 0 22px rgb(255 143 199 / .55))}.ol-vs{position:absolute;left:50%;top:50%;z-index:3;display:grid;place-items:center;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:#fff;color:var(--ol-bg);font:850 22px/1 var(--sans);letter-spacing:.02em;box-shadow:0 0 0 8px #ffffff1f,0 18px 40px #00000073;transition:background-color .25s,color .25s}.ol-vs>span{grid-area:1 / 1;transition:opacity .2s,transform .3s cubic-bezier(.3,1.6,.5,1)}.ol-vs :is(.ol-vs-ok,.ol-vs-no){opacity:0;transform:scale(.4);font-size:36px}.ol-vs:is(.ok,.no) .ol-vs-t{opacity:0;transform:scale(.4)}.ol-vs.ok{background:#22c55e;color:#fff}.ol-vs.ok .ol-vs-ok{opacity:1;transform:none}.ol-vs.no{background:#ef4444;color:#fff}.ol-vs.no .ol-vs-no{opacity:1;transform:none}.outlier:not([data-phase=play]) :is(.ol-vs,.ol-in){opacity:0}.ol-hud{position:absolute;z-index:6;top:76px;left:max(16px,(100% - 1080px) / 2);right:max(16px,(100% - 1080px) / 2);display:flex;flex-wrap:wrap;align-items:center;gap:8px;pointer-events:none}.outlier.compact .ol-hud{top:16px;left:16px;right:16px}.ol-hud>*{pointer-events:auto;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:999px;background:var(--ol-glass);box-shadow:inset 0 0 0 1px var(--ol-edge);font:600 14px/1 var(--sans)}.ol-back{text-decoration:none}.ol-cat{margin-right:auto}.ol-back+.ol-cat{margin-left:0}.ol-score b{font-size:17px;font-variant-numeric:tabular-nums}.ol-score b.pop{animation:ol-pop .42s cubic-bezier(.3,1.6,.5,1)}@keyframes ol-pop{40%{transform:scale(1.5)}}.outlier:not([data-phase=play]) .ol-hud>:not(.ol-back){display:none}.outlier :is(.ol-teach,.ol-move){position:absolute;z-index:6;left:50%;width:max-content;max-width:min(680px,calc(100% - 32px));padding:12px 20px;border-radius:18px;background:#0c0b12c7;box-shadow:inset 0 0 0 1px var(--ol-edge);font:500 15px/1.45 var(--sans);text-align:center}.ol-teach{bottom:24px;opacity:0;transform:translate(-50%,12px);transition:opacity .3s,transform .3s;pointer-events:none}.ol-teach.on{opacity:1;transform:translate(-50%)}.ol-move{top:128px;transform:translate(-50%)}.ol-screen{position:absolute;inset:0;z-index:5;isolation:isolate;overflow-y:auto;display:grid;grid-template-columns:minmax(0,580px) minmax(0,340px);justify-content:center;align-content:center;align-items:center;gap:40px;padding:120px 32px 56px}.ol-screen:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 60% at 30% 30%,rgb(122 92 255 / .35),transparent 70%),radial-gradient(50% 55% at 80% 75%,rgb(224 69 123 / .28),transparent 70%),#0c0b12d1}.ol-covers{position:absolute;inset:0;z-index:-2;display:grid;grid-template-columns:repeat(3,1fr)}.ol-covers img{width:100%;height:100%;object-fit:cover;transform:scale(1.35);filter:blur(10px) saturate(1.3);opacity:.7}.ol-over .ol-panel{justify-items:center;text-align:center}.ol-panel{display:grid;gap:14px}.ol-kick{font:700 12px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;background:var(--ol-lit);-webkit-background-clip:text;background-clip:text;color:transparent}.ol-h{font:850 clamp(64px,10vw,128px)/.92 var(--sans);letter-spacing:-.05em;background:linear-gradient(100deg,#fff 30%,#c9b6ff 60%,#ff8fc7);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.05em}.ol-lede{max-width:48ch;font:450 17px/1.5 var(--sans);color:var(--ol-mute)}.ol-lede b{color:#fff}.ol-modes{display:inline-flex;justify-self:start;gap:4px;padding:4px;border-radius:999px;background:var(--ol-glass);box-shadow:inset 0 0 0 1px var(--ol-edge)}.ol-modes button{display:inline-flex;gap:6px;align-items:center;height:38px;padding:0 16px;border:0;border-radius:999px;background:none;font-weight:600;font-size:14px}.ol-modes button[aria-pressed=true]{background:#fff;color:var(--ol-bg)}.ol-pick-h{margin-top:10px!important;font:600 13px/1.3 var(--sans);color:var(--ol-mute)}.ol-cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.ol-catbtn{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;min-height:68px;padding:12px 16px;border:0;border-radius:18px;background:var(--ol-glass);box-shadow:inset 0 0 0 1px var(--ol-edge);text-align:left;transition:transform .2s,background-color .2s,box-shadow .2s}.ol-catbtn>span{grid-row:1 / span 2;font-size:28px;line-height:1}.ol-catbtn b{font:700 16px/1.2 var(--sans)}.ol-catbtn small{font-size:12px;color:var(--ol-mute)}.ol-catbtn:hover{transform:translateY(-3px);background:#ffffff29;box-shadow:inset 0 0 0 1px #fff6,0 12px 30px #7a5cff4d}.ol-board{display:grid;gap:10px;align-self:center;padding:20px;border-radius:22px;background:#0c0b1299;box-shadow:inset 0 0 0 1px var(--ol-edge)}.ol-board-h{font:700 17px/1.3 var(--sans)}.outlier-board-mode{font-weight:500;color:var(--ol-mute)}.outlier-rows{display:grid;gap:2px;max-height:380px;overflow-y:auto;padding:0;list-style:none}.outlier-rows li{display:grid;grid-template-columns:30px minmax(0,1fr) auto 78px;align-items:center;gap:10px;min-height:36px;padding:0 10px;border-radius:10px;font-size:14px}.outlier-rows li:nth-child(odd){background:#ffffff0a}.outlier-rows li.me{background:#ff8fc733;box-shadow:inset 0 0 0 1px #ff8fc780}.outlier-rows b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.ol-rank{text-align:center;color:var(--ol-mute);font-variant-numeric:tabular-nums}.ol-pts{font-weight:800;font-variant-numeric:tabular-nums}.outlier-rows time{font-size:12px;color:var(--ol-mute);text-align:right}.outlier-board-msg{font-size:13px;color:var(--ol-mute)}.outlier-board-msg:empty{display:none}.ol-final{display:grid;justify-items:center}.ol-final b{font:850 clamp(96px,14vw,160px)/.9 var(--sans);letter-spacing:-.05em;background:var(--ol-lit);-webkit-background-clip:text;background-clip:text;color:transparent}.ol-final span{font:600 15px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ol-mute)}.ol-why{max-width:52ch;padding:12px 16px;border-radius:14px;background:var(--ol-glass);font-size:14px;line-height:1.45}.ol-why:empty{display:none}.ol-name{display:grid;gap:8px;width:min(100%,440px);text-align:left}.ol-name label{font:600 13px/1.3 var(--sans);color:var(--ol-mute)}.ol-name-row{display:flex;gap:8px}.ol-name input{flex:1;min-width:0;height:50px;padding:0 18px;border:0;border-radius:999px;background:#ffffff1a;box-shadow:inset 0 0 0 1px var(--ol-edge);color:#fff;font:500 16px var(--sans)}.ol-go{height:50px;padding:0 24px;border:0;border-radius:999px;background:var(--ol-go);font-weight:700!important;box-shadow:0 10px 30px #e0457b59;transition:transform .18s;white-space:nowrap}.ol-go:hover{transform:translateY(-2px)}.ol-go:disabled{opacity:.6}.ol-status{min-height:1.4em;font-size:14px}.ol-status:empty{display:none}.ol-nudge{max-width:46ch;font-size:14px;color:var(--ol-mute)}@media(max-width:760px){.outlier.full{height:100svh;min-height:640px}.outlier.compact{height:680px;border-radius:20px}.ol-arena{top:116px}.outlier.compact .ol-arena{top:60px}.ol-track{flex-direction:column;width:100%;height:150%}.ol-track.go{transform:translateY(-33.3333%)}.ol-side{padding:18px 16px}.outlier.full .ol-arena{bottom:52px}.ol-side+.ol-side{box-shadow:inset 0 1px 0 var(--ol-edge)}.ol-in{gap:6px}.ol-thumb{width:min(56%,200px);margin-bottom:2px;border-radius:12px}.outlier[data-mode=short] .ol-thumb{width:92px}.ol-title{font-size:16px}.ol-q{margin-top:2px;font-size:13px}.ol-x{font-size:46px}.ol-btns button{min-width:0;flex:1;height:50px;padding:0 18px;font-size:16px}.ol-btns{width:100%;max-width:340px}.ol-vs{width:60px;height:60px;margin:-30px 0 0 -30px;font-size:17px;top:calc(116px + (100% - 116px)/2);left:auto;right:16px}.outlier.compact .ol-vs{top:calc(60px + (100% - 60px)/2)}.ol-vs :is(.ol-vs-ok,.ol-vs-no){font-size:28px}.ol-hud{top:68px;left:16px;right:16px;gap:6px}.outlier.compact .ol-hud{top:12px;left:12px;right:12px}.ol-hud>*{height:34px;padding:0 12px;font-size:13px}.ol-teach{bottom:12px;font-size:14px;padding:10px 14px}.outlier.full .ol-teach{bottom:64px}.ol-move{top:116px}.ol-screen{grid-template-columns:minmax(0,1fr);align-content:start;gap:24px;padding:116px 16px 32px}.outlier.compact .ol-screen{padding-top:32px}.ol-covers{grid-template-columns:1fr}.ol-h{font-size:64px}.ol-lede{font-size:15px}.ol-cats{grid-template-columns:repeat(2,minmax(0,1fr))}.ol-final b{font-size:96px}}@media(max-width:760px)and (max-height:700px){.ol-thumb{display:none}}@media(min-width:761px)and (max-height:760px){.ol-thumb{width:min(100%,280px)}.ol-side{padding-top:116px}}@media(prefers-reduced-motion:reduce){.ol-track,.ol-in,.ol-vs>span,.ol-teach{transition:none}.ol-score b.pop{animation:none}}.ol-h-sub{display:block;margin-top:10px;font-size:.34em;letter-spacing:-.02em;line-height:1}.ol-btns button{gap:10px}.ol-btns .ol-arrow{flex:none;width:22px;height:22px}.ol-btns button:hover .ol-arrow circle{filter:brightness(1.05)}.ol-catbtn{grid-template-columns:1fr;grid-template-rows:auto auto auto;justify-items:start;row-gap:4px;padding:14px 14px 12px}.ol-catbtn>span{grid-row:auto;font-size:26px;margin-bottom:4px}