@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap');
:root{--yellow:#fff989;--green:#59ac51;--red:#c75555}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#111;color:#fff;font-family:'Nunito',Arial,sans-serif}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}[hidden]{display:none!important}main,.arena{width:100%;height:100dvh;position:relative;overflow:hidden}.track{height:100%;display:flex;width:100%;transition:transform .4s ease-out}.track.sliding{transform:translateX(-50%)}.clip{flex:0 0 50%;height:100%;position:relative;overflow:hidden;background:#171717;border-right:1px solid #ffffff35}.ambient{position:absolute;inset:-18px;filter:blur(13px);pointer-events:none;transform:scale(1.04)}.ambient>img,.ambient-canvas{position:absolute;width:100%;height:100%;object-fit:cover;inset:0}.clip:after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.38);pointer-events:none}.clip-content{--player-width:min(340px,calc((100dvh - 300px)*9/16),calc(50vw - 130px));position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:24px 20px 45px}.portrait-player{position:relative;width:var(--player-width);aspect-ratio:9/16;background:#080808;border:1px solid #ffffff24;border-radius:22px;overflow:hidden;box-shadow:0 12px 35px #0005;flex-shrink:0}.short-video,.video-poster{display:block;width:100%;height:100%;object-fit:contain}.short-video::-webkit-media-controls{display:none!important}.video-toggle{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;color:#fff;display:grid;place-items:center;-webkit-tap-highlight-color:transparent}.video-toggle svg{width:58px;height:58px;filter:drop-shadow(0 2px 8px #0007);opacity:.9;transition:opacity .15s,transform .15s}.clip[data-playback="playing"] .video-toggle svg,.clip[data-playback="starting"] .video-toggle svg{opacity:0;transform:scale(1.2)}
input.video-scrubber{--progress:0%;appearance:none;-webkit-appearance:none;position:absolute;bottom:0;left:0;width:100%;height:16px;margin:0;padding:0;border:0;border-radius:0;z-index:4;cursor:ew-resize;background:transparent;color-scheme:normal;touch-action:none;transform:translateY(6px)}.video-scrubber::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,#ff303b 0 var(--progress),#ffffff50 var(--progress) 100%)}.video-scrubber::-moz-range-track{height:3px;background:#ffffff50}.video-scrubber::-moz-range-progress{height:3px;background:#ff303b}.video-scrubber::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:11px;height:11px;background:#ff303b;border:0;border-radius:50%;margin-top:-4px;opacity:0}.video-scrubber::-moz-range-thumb{width:11px;height:11px;border:0;border-radius:50%;background:#ff303b;opacity:0}.portrait-player:hover .video-scrubber::-webkit-slider-thumb,.video-scrubber:focus-visible::-webkit-slider-thumb,.video-scrubber:active::-webkit-slider-thumb{opacity:1}.portrait-player:hover .video-scrubber::-moz-range-thumb,.video-scrubber:focus-visible::-moz-range-thumb,.video-scrubber:active::-moz-range-thumb{opacity:1}.video-scrubber:focus-visible{outline:0}
.video-description{width:var(--player-width);font-size:14px;line-height:1.45;margin:12px 0 10px;min-height:41px;text-align:left;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 4px #0006}.answer-area{height:158px;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}.views{font-size:clamp(50px,6.2vw,88px);line-height:1.08;font-weight:800;color:var(--yellow);font-variant-numeric:tabular-nums;letter-spacing:-1.5px;white-space:nowrap;text-shadow:0 3px 15px #0004}.count-meta,.comparison{font-size:16px;color:#fff;margin-top:7px}.guess-controls{display:flex;flex-direction:column;gap:10px;width:200px;max-width:100%}.guess-controls button{height:52px;border:2px solid #fff;border-radius:32px;background:transparent;color:var(--yellow);font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;gap:22px;transition:background .15s,color .15s}.guess-controls button span{font-size:15px;color:#fff}.guess-controls button:hover{background:#fff;color:#222}.guess-controls button:hover span{color:#222}.comparison{font-size:14px;margin-top:8px}
.versus{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:132px;height:132px;border-radius:50%;overflow:hidden;background:#fff;color:#111;display:grid;place-items:center;z-index:4;font-size:42px;font-weight:900}.versus-text{position:relative;z-index:1}.versus-fill{position:absolute;bottom:0;left:0;width:100%;height:0}.versus-icon{position:absolute;left:50%;top:50%;width:48px;height:48px;transform:translate(-50%,-50%);opacity:0}.versus-icon svg{width:100%;height:100%;fill:none;stroke:white;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}.versus.new-round{animation:badge-in .3s cubic-bezier(.24,-.17,.45,1.99)}.versus.correct .versus-text,.versus.wrong .versus-text{visibility:hidden}.versus.correct .versus-fill{background:var(--green)}.versus.wrong .versus-fill{background:var(--red)}.versus.correct .versus-fill,.versus.wrong .versus-fill{animation:badge-fill .3s cubic-bezier(.26,0,.85,0) forwards}.versus.correct .versus-icon,.versus.wrong .versus-icon{animation:result-in .3s cubic-bezier(.24,-.17,.45,1.99) .5s forwards}.versus.correct{animation:badge-out .2s ease-out 1.2s forwards}.reveal{animation:count-reveal .5s ease-in forwards}@keyframes count-reveal{0%{opacity:0;transform:translateY(20px)}90%,100%{opacity:1;transform:translateY(0)}}@keyframes badge-fill{from{height:0}to{height:100%}}@keyframes badge-in{from{transform:translate(-50%,-50%) scale(0)}to{transform:translate(-50%,-50%) scale(1)}}@keyframes badge-out{from{transform:translate(-50%,-50%) scale(1)}to{transform:translate(-50%,-50%) scale(0)}}@keyframes result-in{0%{opacity:0;transform:translate(-50%,-50%) scale(0)}80%{opacity:.8;transform:translate(-50%,-50%) scale(1)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.score{position:fixed;bottom:20px;z-index:5;font-size:22px;font-weight:800;text-shadow:0 2px 6px #0007}.high-score{left:24px}.current-score{right:24px}.dataset-note{position:fixed;bottom:7px;left:50%;transform:translateX(-50%);z-index:5;font-size:9px;color:#ffffff80;white-space:nowrap}.menu-button{position:fixed;right:16px;top:12px;z-index:5;background:none;border:0;color:#ffffffb3;font-size:23px;line-height:1;padding:8px}.menu-button:hover{color:#fff}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Secondary controls stay inside the menu, off the game surface. */
dialog{border:0;border-radius:10px;padding:36px;max-width:470px;width:calc(100% - 30px);max-height:90dvh;overflow:auto;background:#242724;color:white;box-shadow:0 20px 80px #0008}dialog::backdrop{background:#000b}dialog h2{font-size:32px;line-height:1.2;margin:0 0 20px;font-weight:800}dialog p,dialog li{font-size:14px;line-height:1.6}dialog ol{padding-left:20px}.close{position:absolute;right:12px;top:8px;font-size:26px;border:0;background:none;color:#bbb}.primary{background:var(--green);color:white;border:0;border-radius:30px;padding:13px 20px;font-weight:800;width:100%;margin-top:16px}.secondary{background:transparent;border:1px solid #777;border-radius:6px;color:white;padding:10px;width:100%;font-size:12px;display:flex;justify-content:space-between}.text-button{display:block;margin:10px auto 0;border:0;background:none;color:#ddd;font-size:13px;padding:9px}.muted,.field-note{color:#aaa}.field-note{font-size:11px!important}.menu-options{display:grid;gap:10px}.menu-options button{border:1px solid #777;color:white;background:transparent;padding:11px;border-radius:25px}.menu-options button:hover{background:#ffffff15}.filters{display:flex;gap:7px;flex-wrap:wrap}.filters button{border:1px solid #777;border-radius:20px;padding:7px 13px;background:none;color:white;font-size:12px}.filters button.active{background:white;color:#222}.eyebrow{font-size:12px;letter-spacing:1px;color:#bbb;margin-bottom:14px}.wide-dialog{max-width:840px}.library-layout{display:grid;grid-template-columns:1fr 1fr;gap:28px}.library-right{border-left:1px solid #555;padding-left:24px}label{display:block;font-size:12px;margin-bottom:13px}input{display:block;width:100%;background:#171917;border:1px solid #666;color:white;border-radius:5px;padding:10px;font-size:13px;margin-top:6px;color-scheme:dark}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.collection-title{display:flex;justify-content:space-between;font-size:11px;color:#ccc}#clip-list{max-height:330px;overflow:auto;margin-top:16px}.library-empty{text-align:center;padding:30px 10px;border:1px dashed #666;color:#aaa;font-size:13px}.library-item{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #555}.library-item strong{display:block;font-size:13px}.library-item small{font-size:11px;color:#aaa}.library-item button{border:0;background:none;color:#ddd;font-size:20px}#form-message{font-size:12px;color:var(--yellow)}#result-dialog{text-align:center;background:#151815}.result-score{font-size:90px;font-weight:800;color:var(--yellow)}#result-summary{margin:0;color:#ccc}#player iframe{width:100%;height:480px;border:0;background:#111}#watch-dialog{max-width:510px}#source-link{color:var(--yellow);font-size:13px}#toast{position:fixed;bottom:70px;left:50%;transform:translateX(-50%);background:#222;color:#fff;padding:12px 20px;border-radius:5px;z-index:20;display:none;font-size:13px}#empty{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:30px}#empty .primary{max-width:220px}
textarea{display:block;width:100%;background:#171917;border:1px solid #666;color:white;border-radius:5px;padding:10px;font-size:13px;margin-top:6px;resize:vertical}
@media(max-width:620px){.clip-content{--player-width:min(calc(50vw - 52px),calc((100dvh - 260px)*9/16));padding:30px 10px 45px}.portrait-player{border-radius:16px}.video-description{font-size:11px;line-height:1.4;min-height:32px;margin:10px 0}.views{font-size:clamp(27px,7.4vw,44px);letter-spacing:-1px}.guess-controls{width:145px;gap:7px}.guess-controls button{height:38px;font-size:14px;gap:14px}.comparison{font-size:9px}.count-meta{font-size:12px}.answer-area{height:114px}.versus{width:76px;height:76px;font-size:26px}.versus-icon{width:32px;height:32px}.score{font-size:14px;bottom:22px}.high-score{left:12px}.current-score{right:12px}.dataset-note{font-size:7px;bottom:6px}.menu-button{font-size:20px;right:6px;top:8px}.video-toggle svg{width:39px;height:39px}.library-layout{grid-template-columns:1fr}.library-right{border-left:0;border-top:1px solid #555;padding:20px 0 0}dialog{padding:30px 24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.versus.correct .versus-fill,.versus.wrong .versus-fill{height:100%}.versus.correct .versus-icon,.versus.wrong .versus-icon{opacity:1}}

.youtube-player{display:block;width:100%;height:100%;border:0}.youtube-clip .portrait-player{overflow:hidden;border:0}.youtube-clip .video-scrubber{bottom:0;left:16px;width:calc(100% - 32px);transform:translateY(2px)}.youtube-clip .clip-content{--player-width:max(200px,min(340px,calc((100dvh - 300px)*9/16),calc(50vw - 130px)))}.youtube-clip .portrait-player{min-height:200px}select{width:100%;display:block;margin-top:6px;padding:10px;background:#171917;color:white;border:1px solid #666;border-radius:5px;font:inherit}#youtube-status{color:var(--yellow)}details{margin-top:24px;font-size:13px}summary{cursor:pointer}dialog a{color:var(--yellow)}dialog code{overflow-wrap:anywhere}@media(max-width:520px){.arena:has(.youtube-clip){overflow-x:auto}.track:has(.youtube-clip){min-width:520px}.arena:has(.youtube-clip) .versus{left:260px}}

.youtube-clip iframe{display:block;width:100%;height:100%;border:0;border-radius:inherit}

.add-clips-button{position:fixed;right:62px;top:14px;z-index:5;border:1px solid #ffffff45;border-radius:20px;background:#15151570;color:#fff;padding:7px 13px;font-size:12px;font-weight:700}
#downloads-dialog{max-width:1240px;width:calc(100% - 48px);padding:30px;background:#181b19;border:1px solid #ffffff20;border-radius:20px}
.db-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-right:24px;margin-bottom:24px}.db-eyebrow{font-size:10px;letter-spacing:2px;color:#a5afa6}.db-header h2{font-size:29px;margin:8px 0 0}.db-export{font-size:12px;text-decoration:none;color:#cbd2cc!important}
.db-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:28px}.db-add{border-right:1px solid #ffffff18;padding-right:26px}.db-add h3{margin:0 0 8px;font-size:19px}.db-add p{color:#aeb6ae;font-size:12px}.db-add textarea{padding:13px;min-height:240px;font-size:12px;line-height:1.7;border:1px solid #424b43;background:#101411;border-radius:10px}.db-add label{color:#c8cec8}.db-add .primary{background:var(--yellow);color:#222;border-radius:10px;margin:0;padding:13px}.db-file{margin-top:20px;font-size:12px}.db-file input{font-size:10px;border:0;padding:0;background:none}.db-add #download-status{color:var(--yellow);overflow-wrap:anywhere;max-height:110px;overflow:auto}
.db-collection{min-width:0}.db-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:0 0 22px}.db-stats strong{display:block;font-size:27px;font-weight:800}.db-stats span{font-size:10px;color:#aeb6ae}.db-stats>div:nth-child(2) strong{color:var(--yellow)}.db-toolbar{display:grid;grid-template-columns:minmax(140px,1fr) 125px 120px;gap:8px}.db-toolbar input,.db-toolbar select{margin:0;font-size:12px;padding:10px;border-color:#465048;border-radius:8px}.db-toolbar select{min-width:0}#db-worker-status{margin:12px 0}
#download-list{height:360px;overflow:auto;margin:0;border-top:1px solid #ffffff18;border-bottom:1px solid #ffffff18}.db-row{display:grid;grid-template-columns:42px minmax(100px,1fr) 90px 120px 54px;gap:12px;align-items:center;padding:15px 0;border-bottom:1px solid #ffffff12}.db-thumb{width:42px;height:68px;background:#303831;border-radius:6px;overflow:hidden;display:grid;place-items:center;color:#c3cbc4}.db-thumb img{width:100%;height:100%;object-fit:cover}.db-info{min-width:0}.db-info p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.5;margin:4px 0}.db-platform{font-size:9px;text-transform:uppercase;letter-spacing:.7px;color:#9aa79b}.db-info a{font-size:10px;color:#b9c3ba;text-decoration:none}.db-error{display:block;color:#f3aaa4;font-size:10px;line-height:1.5;margin-top:7px}.status-pill{display:inline-block;padding:4px 7px;border-radius:6px;font-size:10px;white-space:nowrap;background:#313833;color:#c5cec6}.status-ready{background:#243c28;color:#b5e8aa}.status-failed{background:#422725;color:#ffb7ad}.status-needs_views{background:#403c25;color:#f1df9b}.status-downloading{background:#28383d;color:#a9dbec}.db-state small{display:block;font-size:9px;color:#aab2ab;margin-top:5px}.db-count{display:flex;gap:4px}.db-count input{min-width:0;margin:0;padding:7px;font-size:11px;border-color:#475249;width:76px}.db-count button,.db-actions button,.db-pagination button{background:transparent;color:#c6d0c7;border:0;padding:5px;font-size:10px}.db-count button:hover,.db-actions button:hover{color:var(--yellow)}.db-empty{text-align:center;padding:85px 20px;color:#9daa9f;font-size:14px;line-height:1.8}.db-pagination{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 0}.db-pagination span{margin-right:auto;font-size:10px;color:#adb7af}.db-bottom{display:flex;gap:20px;align-items:center;justify-content:space-between}.db-bottom .primary{margin:0;width:auto;white-space:nowrap;padding:11px 20px;border-radius:9px}.db-bottom p{margin:0}
@media(max-width:1000px){.db-layout{grid-template-columns:240px minmax(0,1fr);gap:20px}.db-add{padding-right:18px}.db-row{grid-template-columns:32px minmax(90px,1fr) 80px 106px;gap:8px}.db-thumb{width:32px;height:54px}.db-actions{grid-column:2/5;display:flex;justify-content:flex-end;margin-top:-4px}.db-toolbar{grid-template-columns:1fr 1fr}.db-toolbar input{grid-column:1/3}.db-count input{width:65px}}
@media(max-width:720px){#downloads-dialog{width:calc(100% - 20px);padding:24px 18px}.db-layout{grid-template-columns:1fr}.db-add{border-right:0;border-bottom:1px solid #ffffff18;padding:0 0 22px}.db-add textarea{min-height:150px;height:150px}.db-header h2{font-size:23px}.db-header{gap:10px}.db-export{font-size:10px}.db-bottom{flex-wrap:wrap}.db-bottom .primary{width:100%}.db-stats strong{font-size:22px}.add-clips-button{right:42px;top:13px;font-size:10px;padding:6px 10px}#download-list{height:330px}}

#home-screen{height:100dvh;position:relative;isolation:isolate;overflow:auto;display:flex;align-items:flex-start;justify-content:center;text-align:center;padding:clamp(76px,17vh,170px) 24px 60px;background:#171a17}
#home-backdrop{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 58%;z-index:-2;pointer-events:none}
#home-screen:before{content:'';position:fixed;inset:0;background:linear-gradient(#0009,#000a);z-index:-1;pointer-events:none}
.home-content{width:min(100%,560px);display:flex;flex-direction:column;align-items:center}
#home-screen h1{position:relative;width:100%;margin:0;padding:30px 28px;font-family:Arial,Helvetica,sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:-2.5px;line-height:.94}
.home-title-top,.home-title-bottom{display:block;white-space:nowrap}.home-title-top{font-size:clamp(26px,6.8vw,65px);color:#75ac59}.home-title-bottom{font-size:clamp(24px,6.1vw,58px);color:#bf5c5e}
.home-arrow{position:absolute;width:27px;height:108px}.home-arrow-up{left:0;top:0;color:#75ac59}.home-arrow-down{right:0;bottom:0;color:#bf5c5e}
#home-screen h2{font-size:clamp(20px,2.5vw,26px);font-weight:800;line-height:1.3;margin:42px 0 18px;color:#fff;text-shadow:0 2px 8px #0005}
#home-screen .primary{width:200px;max-width:100%;height:56px;padding:0 27px;margin:0;border:0;border-radius:32px;background:#75ac59;color:#fff;font-size:18px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:36px;transition:background .15s,transform .15s}
#home-screen .primary:hover{background:#85ba69;transform:translateY(-1px)}#home-screen .primary:active{transform:translateY(0)}#home-screen .primary svg{width:14px;height:18px}
@media(max-width:620px){#home-screen{padding:clamp(80px,22vh,180px) 24px 40px}#home-screen h1{padding:23px 20px;letter-spacing:-1.3px}.home-arrow{width:18px;height:80px}#home-screen h2{margin-top:32px}#home-backdrop{object-position:63% center}}
@media(max-height:500px) and (min-width:621px){#home-screen{padding-top:36px}#home-screen h1{padding-block:18px}.home-arrow{height:90px}#home-screen h2{margin-top:22px}}
@font-face{font-family:GameDisplay;src:url('/assets/LilitaOne-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
#menu-dialog{width:calc(100% - 36px);max-width:400px;padding:0 7px 8px;border:2px solid #36332e;border-radius:13px;background:#5c5650;box-shadow:inset 0 2px 0 #c3bdb3,inset 3px 0 0 #8d8880,inset -3px 0 0 #423e37,0 3px 0 #25231f,0 14px 40px #0008;overflow:visible}
#menu-dialog::backdrop{background:#0008}
#menu-dialog h2{position:relative;margin:0 -1px;height:56px;padding:12px 48px 10px;text-align:center;border-radius:10px 10px 0 0;background:linear-gradient(#969089 0,#858078 36%,#5c5650 37%,#5c5650 100%);color:#fff;font-family:GameDisplay,'Arial Black',sans-serif;font-size:30px;font-weight:400;letter-spacing:.1px;line-height:1;-webkit-text-stroke:3px #292720;paint-order:stroke fill;text-shadow:0 3px 0 #211f1a}
#menu-dialog .close{z-index:2;top:5px;right:7px;width:40px;height:43px;padding:0 0 4px;border:2px solid #321e1a;border-radius:9px;background:linear-gradient(#ff696e 0 48%,#eb0911 49% 100%);box-shadow:inset 0 2px 0 #ffb8b9,inset 3px 0 0 #fc9296,inset -3px 0 0 #a30006,inset 0 -4px 0 #920007,0 2px 1px #211c19;color:#fff;font-family:GameDisplay,sans-serif;font-weight:400;line-height:34px;font-size:38px;-webkit-text-stroke:2px #631b20;paint-order:stroke fill;text-shadow:0 2px 0 #621318}
#menu-dialog .menu-options{gap:18px;justify-items:center;padding:32px 30px 36px;border-radius:3px 3px 6px 6px;background:#e9e9df;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #babbb0}
#menu-dialog .menu-options button{position:relative;display:flex;align-items:center;justify-content:center;width:100%;max-width:270px;min-height:56px;padding:9px 49px 12px 16px;border:2px solid #34332b;border-radius:12px;background:linear-gradient(#b6a0f3 0%,#a283eb 56%,#9065d5 100%);box-shadow:0 2px 1px #88887b,inset 0 0 0 2px #d3c7f1,inset 0 -5px 0 2px #624594,inset -3px 0 0 2px #7954b7;color:#fff;transition:filter .12s,transform .08s;letter-spacing:.1px}
#menu-dialog .menu-options button:before{content:'';position:absolute;inset:4px 5px auto;height:46%;border-radius:7px;background:linear-gradient(#e0d3ffb3,#bca2f978);pointer-events:none}
#menu-dialog .menu-options button span{position:relative;font-family:GameDisplay,'Arial Black',sans-serif;font-size:25px;font-weight:400;line-height:1;-webkit-text-stroke:2.5px #37332d;paint-order:stroke fill;text-shadow:0 2px 0 #37332d;transform:scaleX(1.04)}
#menu-dialog .menu-options button svg{position:absolute;right:12px;top:50%;width:31px;height:31px;transform:translateY(-55%);filter:drop-shadow(0 2px 0 #45335c66)}
#menu-dialog .menu-options #share-menu{background:linear-gradient(#9fdd3b 0%,#8acb2c 55%,#62a319 100%);box-shadow:0 2px 1px #88887b,inset 0 0 0 2px #c1d9a1,inset 0 -5px 0 2px #47731e,inset -3px 0 0 2px #608d2c}
#menu-dialog .menu-options #share-menu:before{background:linear-gradient(#d6ff88,#b7ef5d)}
#menu-dialog .menu-options button:hover{filter:brightness(1.07)}#menu-dialog .menu-options button:active,#menu-dialog .close:active{transform:translateY(2px);filter:brightness(.96)}
@media(max-width:380px){#menu-dialog .menu-options{padding:26px 20px 30px}#menu-dialog .menu-options button span{font-size:23px}}
@media(prefers-reduced-motion:reduce){#menu-dialog .menu-options button{transition:none}}

@font-face{font-family:GamePixel;src:url('/assets/Minecraft-Seven.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
#result-dialog{position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;padding:32px 24px;background:linear-gradient(rgba(93,12,12,.72),rgba(39,5,5,.88));border:0;border-radius:0;box-shadow:none;overflow:auto;outline:none;color:#fff;font-family:GamePixel,monospace;text-align:center}#result-dialog[open]{display:grid;place-items:center}#result-dialog::backdrop{background:#16000066}
.result-content{display:flex;flex-direction:column;align-items:center;gap:28px;width:100%;text-shadow:3px 3px 0 #302020}
#result-title{font:400 clamp(40px,5vw,56px)/1.2 GamePixel,monospace;letter-spacing:0;margin:0 0 18px;text-shadow:4px 4px 0 #352222}
#result-dialog .result-scoreline{font:400 20px/1.5 GamePixel,monospace;margin:0}.result-scoreline span{color:#ffff55}
.midwit-figure{width:min(560px,calc((100dvh - 420px)*1000/620),100%);min-width:min(260px,100%);margin:0}.midwit-figure figcaption{font:400 clamp(10px,1.4vw,14px)/1.6 GamePixel,monospace;white-space:nowrap;margin-bottom:8px}.midwit-figure svg{display:block;width:100%;height:auto;overflow:visible}.midwit-figure svg text{font-family:GamePixel,monospace;font-size:36px;font-weight:400}.midwit-figure svg [data-score]{font-size:40px}
.result-actions{display:grid;gap:10px;width:380px;max-width:100%}.result-replay{width:380px;max-width:100%;min-height:50px;padding:13px 24px;border:2px solid #141414;border-radius:0;background:repeating-linear-gradient(90deg,#ffffff03 0 4px,#00000003 4px 8px),#747474;box-shadow:inset 2px 2px 0 #b4b4b4,inset -2px -3px 0 #414141;color:#fff;font:400 20px/1.2 GamePixel,monospace;text-shadow:2px 2px 0 #303030;cursor:pointer}.result-replay:hover{background-color:#8888a4;color:#ffffa0}.result-replay:active{box-shadow:inset 2px 2px 0 #414141,inset -2px -2px 0 #b4b4b4}.result-replay:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media(max-width:620px){#result-dialog{padding:24px 20px}.result-content{gap:24px}#result-dialog .result-scoreline{font-size:18px}.result-replay{font-size:20px}}

.video-frame-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;background:#080808}.track{will-change:transform}.portrait-player{isolation:isolate}
/* Clipping must not create a scroll container: focus changes during a slide
   otherwise scroll retained cards and expose their dark backing. */
.clip{overflow:clip}
/* Move the three panels in layout, not one viewport-sized GPU surface. WebKit
   can discard that surface (including video and blur layers) on transform reset. */
.track{display:block;position:relative;transform:none!important;transition:none;will-change:auto}
.clip{position:absolute;top:0;width:50%;transition:left .4s ease-out}
.clip:nth-child(1){left:0}.clip:nth-child(2){left:50%}.clip:nth-child(3){left:100%}
.track.sliding .clip:nth-child(1){left:-50%}.track.sliding .clip:nth-child(2){left:0}.track.sliding .clip:nth-child(3){left:50%}
.track.resetting .clip{transition:none}
.video-still{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#080808;pointer-events:none;z-index:1}
.video-toggle{z-index:2}
@media(prefers-reduced-motion:reduce){.clip{transition:none}}
.loading-content{text-align:center;padding:24px}.loading-content h1{font-size:clamp(36px,6vw,64px);line-height:1.08;letter-spacing:-1.5px;color:var(--yellow);margin:0 0 32px;font-weight:900}.loading-content p{font-size:15px;color:#bdbdbd;margin:18px 0 0}.loading-spinner{display:block;width:28px;height:28px;margin:auto;border:3px solid #ffffff26;border-top-color:var(--yellow);border-radius:50%;animation:loading-spin .85s linear infinite}#loading-retry{margin-top:20px;border:1px solid #777;border-radius:24px;padding:10px 24px;background:none;color:#fff}@keyframes loading-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.loading-spinner{animation:none;border-color:var(--yellow)}}

#result-dialog .result-ranking{max-width:680px;margin:0 auto 18px;font:400 clamp(16px,1.8vw,20px)/1.5 GamePixel,monospace;text-wrap:balance}#result-percentile{color:#ffff55}

#result-dialog,#result-dialog button{font-synthesis:none;font-kerning:none}

.midwit-figure svg .rank-label{font-size:22px;text-shadow:1px 1px 0 #000}.rank-icons image{filter:drop-shadow(0 3px 4px #0006)}

.home-how{width:min(100%,460px);margin-top:48px;padding-top:28px;border-top:1px solid #ffffff30}
.home-how h3{margin:0 0 8px;font-size:22px;line-height:1.25;font-weight:900;text-wrap:balance}
.home-how>p{margin:0;color:#e0dedb;font-size:14px;line-height:1.55;text-wrap:balance}
.how-demo{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:64px;width:300px;max-width:100%;margin:24px auto 12px}
.how-clip{min-width:0}.how-clip>img{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;border:1px solid #ffffff50;border-radius:12px;box-shadow:0 6px 16px #0005}
.how-vs{position:absolute;top:calc((100% - 102px)/2);left:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;font-weight:900;font-size:16px}
.how-known{height:90px;margin-top:12px;display:flex;align-items:center;justify-content:center;flex-direction:column}
.how-known strong{font-size:32px;font-weight:900;line-height:1.1;color:var(--yellow)}.how-known span{font-size:13px;margin-top:4px}
@media(max-width:380px){.home-how h3{font-size:20px}.home-how>p{font-size:13px}.how-demo{gap:44px;width:270px}.how-vs{width:34px;height:34px;font-size:14px}}