.df{--ink:#02040c;--cyan:#5cf0e0;--pink:#ff4fd8;--lime:#7dff6a;--gold:#ffe45c;--pixel:"Courier New", ui-monospace, Menlo, monospace;background:var(--ink);color:var(--cyan);font:700 1rem/1.4 var(--pixel);letter-spacing:.08em;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:fixed;inset:0;overflow:hidden}.df:after{content:"";z-index:40;pointer-events:none;background:repeating-linear-gradient(0deg,#00000012 0 1px,#0000 1px 3px);position:absolute;inset:0}.back-link{color:#5cf0e0;letter-spacing:.08em;background:#02040c;font-family:Courier New,ui-monospace,monospace}body:has(#df[data-state=INTRO]) .back-link,body:has(#df[data-state=PLAYING]) .back-link{display:none}.df-canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.df[data-state=PLAYING] .df-canvas{cursor:none}.screen{z-index:10;padding:max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;display:none;position:absolute;inset:0}.df[data-state=TITLE] #screen-title,.df[data-state=PHOTO_SELECT] #screen-select,.df[data-state=VALIDATING] #screen-select,.df[data-state=GENERATING] #screen-loading,.df[data-state=PAUSED] #screen-pause,.df[data-state=VICTORY] #screen-end,.df[data-state=DEFEAT] #screen-end,.df[data-state=NOGL] #screen-nogl{display:flex}.panel{background:#02040c9e}.df #end-title{font-size:clamp(2rem,8vw,3.5rem)}.df h2{color:#e8fffb;margin:0;font-size:clamp(1.1rem,3.4vw,1.8rem)}.small,.msg,.privacy,.rotate-hint{color:#7fb8b2;margin:0;font-size:.8rem}.msg{min-height:1.4em;color:var(--gold);font-size:.95rem}.logo{font:900 clamp(2.6rem, 11vw, 6.5rem) / 1 var(--pixel);letter-spacing:.02em;color:#e8fffb;text-shadow:0 0 .4em #5cf0e08c,.05em .05em #0b6e66,.1em .1em #04302d;margin:0}.logo span{color:var(--cyan)}.df .slogan{color:var(--pink);margin:0 0 1.25rem;font-size:clamp(.7rem,2.2vw,1rem)}.privacy{bottom:max(1rem, env(safe-area-inset-bottom));position:absolute}.panel .privacy{position:static}.rotate-hint{display:none}.btn{border:2px solid var(--cyan);min-width:11rem;min-height:3.25rem;color:var(--cyan);font:inherit;letter-spacing:.12em;cursor:pointer;touch-action:manipulation;background:#02040ccc;padding:.6rem 1.5rem;font-size:1.05rem}.btn:hover,.btn:focus-visible{background:var(--cyan);color:var(--ink);outline:none}.btn.ghost{color:#7fb8b2;border-color:#3b6f6a}.btn.start{letter-spacing:.28em;min-width:0;min-height:0;color:var(--gold);text-shadow:0 0 .55em #ffe45c80;background:0 0;border:0;font-size:1.6rem;animation:2.4s ease-in-out infinite start-glow}.btn.start:hover,.btn.start:focus-visible{color:#fff8c4;background:0 0;animation:none}.row{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.df[data-state=VALIDATING] #screen-select .btn{opacity:.4;pointer-events:none}@keyframes blink{50%{opacity:.15}}.loading{background:#02040cf0}.stage{color:var(--gold);margin:0}.radar{border:2px solid var(--cyan);background:conic-gradient(#5cf0e08c,#0000 35%),repeating-radial-gradient(circle,#0000 0 1.1rem,#5cf0e059 1.1rem 1.2rem);border-radius:50%;width:7rem;height:7rem;animation:1.4s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.score{color:var(--gold);margin:0;font-size:1.4rem}.rotate{z-index:30;background:var(--ink);color:var(--gold);text-align:center;justify-content:center;align-items:center;padding:2rem;display:none;position:absolute;inset:0}@media (pointer:coarse) and (orientation:portrait){.rotate-hint{display:block}.df[data-state=INTRO] .rotate,.df[data-state=PLAYING] .rotate,.df[data-state=PAUSED] .rotate{display:flex}}@media (prefers-reduced-motion:reduce){.btn.start,.warn,.radar{animation:none}}@media (height<=460px){.logo{font-size:clamp(2rem,14vh,4rem)}.df .slogan{margin-bottom:.25rem}}.sound,.gear{top:.75rem;right:max(1rem, env(safe-area-inset-right));z-index:12;color:var(--cyan);font:inherit;cursor:pointer;background:#02040c;border:0;padding:.25rem .5rem;font-size:.85rem;position:fixed}.sound:hover,.sound:focus-visible,.gear:hover,.gear:focus-visible{color:var(--gold);outline:none}.df[data-state=INTRO] .sound,.df[data-state=PLAYING] .sound,.df[data-state=INTRO] .gear,.df[data-state=PLAYING] .gear{display:none}.hud{z-index:5;padding:max(.75rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) 0 max(1rem, env(safe-area-inset-left));pointer-events:none;opacity:0;justify-content:space-between;align-items:flex-start;transition:opacity .6s;display:flex;position:absolute;inset:0}.df[data-hud=on] .hud{opacity:1}.hud-score{color:var(--gold);margin:0;font-size:1.15rem}.bar{--hp:100%;--hue:120;border:2px solid hsl(var(--hue), 75%, 46%);background:#00000059;width:min(42vw,14rem);height:.85rem}.bar i{width:var(--hp);background:hsl(var(--hue), 78%, 50%);height:100%;display:block}.warn{color:var(--gold);white-space:nowrap;animation:.6s step-end infinite blink;position:absolute;top:24%;left:50%;transform:translate(-50%)}.warn[hidden]{display:none}.reticle{border:2px solid var(--lime);border-radius:50%;width:2.2rem;height:2.2rem;margin:-1.1rem 0 0 -1.1rem;position:absolute;top:0;left:0;transform:translate(50vw,40vh)}.reticle:before{content:"";background:var(--lime);position:absolute;inset:calc(50% - 2px)}.reticle.hit{animation:.18s ease-out hit}@keyframes hit{0%{border-color:#ff4a4a;width:3.2rem;height:3.2rem;margin:-1.6rem 0 0 -1.6rem}}.damage{position:absolute;inset:0;box-shadow:inset 0 0 14vmin #ff282800}.damage.on{animation:.4s ease-out damage}.minimap{right:max(1rem, env(safe-area-inset-right));bottom:max(1rem, env(safe-area-inset-bottom));border:2px solid var(--cyan);background:#02080e9e;border-radius:50%;width:7.75rem;height:7.75rem;position:absolute}@media (pointer:coarse){.minimap{display:none}}@keyframes damage{0%{box-shadow:inset 0 0 14vmin #ff2828d9}}.df[data-state=INTRO],.df[data-state=PLAYING],.df[data-state=PAUSED]{touch-action:none}.touch{z-index:6;pointer-events:none;display:none;position:absolute;inset:0}.touch>*{pointer-events:auto;touch-action:none;user-select:none;-webkit-tap-highlight-color:transparent;position:absolute}.stick{left:max(1.5rem, env(safe-area-inset-left));bottom:max(1.25rem, env(safe-area-inset-bottom));background:#5cf0e014;border:2px solid #5cf0e099;border-radius:50%;width:9.5rem;height:9.5rem}.knob{pointer-events:none;background:#5cf0e08c;border-radius:50%;position:absolute;inset:3.1rem}.fire,.mini{border:2px solid var(--pink);color:#ffd6f5;font:inherit;background:#ff4fd82e;border-radius:50%}.fire{right:max(1.5rem, env(safe-area-inset-right));bottom:max(1.25rem, env(safe-area-inset-bottom));width:6.75rem;height:6.75rem;font-size:1.1rem}.mini{border-color:var(--gold);width:3.6rem;height:3.6rem;color:var(--gold);letter-spacing:0;background:#ffe45c1f;font-size:.6rem}.boost{right:calc(max(1.5rem, env(safe-area-inset-right)) + 7.5rem);bottom:max(1.25rem, env(safe-area-inset-bottom))}.brake{right:calc(max(1.5rem, env(safe-area-inset-right)) + 7.5rem);bottom:calc(max(1.25rem, env(safe-area-inset-bottom)) + 4.3rem)}.fire.held,.mini.held{background:#ffffff59}@media (pointer:coarse){.df[data-state=PLAYING] .touch{display:block}.df[data-state=PLAYING] .df-canvas{cursor:auto}}.pause{cursor:pointer;background:#02040c59}.pause .btn{min-width:10rem;min-height:2.75rem;font-size:1rem}.veil{z-index:7;pointer-events:none;background:#02060e6b;display:none;position:absolute;inset:0}.df[data-depart=on] .veil{display:block}.df[data-depart=on] #df-canvas{filter:saturate(.55)brightness(.78)}.df[data-depart=on] .reticle{visibility:hidden}@keyframes start-glow{50%{opacity:.55}}.pause-word{font:900 clamp(2rem, 9vw, 4.5rem) / 1 var(--pixel);letter-spacing:.3em;color:#e8fffb;text-shadow:0 0 .4em #5cf0e099;margin:0;padding-left:.3em;animation:1.8s step-end infinite flicker}@keyframes flicker{0%,to{opacity:1}8%{opacity:.25}14%{opacity:1}52%{opacity:.85}58%{opacity:.2}62%{opacity:1}80%{opacity:.6}84%{opacity:1}}.gear{top:2.5rem}.df[data-settings=open] #screen-settings{z-index:20;display:flex}.settings{background:#02040cf7;justify-content:safe center;gap:1.25rem;overflow-y:auto}.tabs{gap:.5rem;display:flex}.tab{color:#7fb8b2;min-width:6.5rem;font:inherit;letter-spacing:.12em;cursor:pointer;background:0 0;border:2px solid #3b6f6a;padding:.5rem 1rem}.tab[aria-selected=true]{border-color:var(--cyan);background:var(--cyan);color:var(--ink)}.tab:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.pane{flex-direction:column;gap:1rem;width:min(22rem,86vw);display:flex}.pane[hidden]{display:none}.field{flex-direction:column;gap:.5rem;display:flex}.field label{color:#e8fffb;justify-content:space-between;display:flex}.field output{color:var(--gold)}.field input[type=range]{width:100%;height:2rem;accent-color:var(--cyan)}.check{color:#e8fffb;text-align:left;cursor:pointer;align-items:center;gap:.75rem;min-height:2.75rem;display:flex}.check input{width:1.4rem;height:1.4rem;accent-color:var(--cyan)}.keys{flex-direction:column;gap:.35rem;display:flex}.key-row{color:#e8fffb;text-align:left;grid-template-columns:1fr 6.5rem 6.5rem;align-items:center;gap:.5rem;display:grid}.slot{color:var(--cyan);font:inherit;cursor:pointer;background:0 0;border:2px solid #3b6f6a;padding:.35rem .25rem;font-size:.85rem}.slot:hover,.slot:focus-visible{border-color:var(--cyan);outline:none}.slot.waiting{border-color:var(--gold);color:var(--gold);animation:.8s step-end infinite blink}.scale{color:#7fb8b2;grid-template-columns:1fr auto 1fr;margin:0;font-size:.7rem;display:grid}.scale span:last-child{text-align:right}@media (prefers-reduced-motion:reduce){.pause-word,.slot.waiting{animation:none}}.end{gap:.9rem}.end .score{margin-top:-.4rem}.end-actions{grid-template-columns:1fr 1fr;gap:.6rem;width:min(24rem,92vw);display:grid}.end-actions .btn{letter-spacing:.1em;min-width:0;min-height:3rem;padding:.5rem .4rem;font-size:.95rem}.end-actions #retry{grid-column:1/-1;min-height:3.4rem;font-size:1.2rem}.board{background:#02040cb3;border:2px solid #3b6f6a;gap:.4rem;width:min(24rem,92vw);padding:.7rem .9rem;display:grid}.board .small{text-align:center;letter-spacing:.16em}.scores{font-variant-numeric:tabular-nums;gap:.1rem;margin:0;padding:0;font-size:1.05rem;list-style:none;display:grid}.scores li{color:#7fb8b2;text-align:left;border-left:2px solid #0000;grid-template-columns:2rem 1fr auto;align-items:center;padding:.1rem .6rem;display:grid}.scores .name{letter-spacing:.2em;color:#e8fffb}.scores .mine{border-color:var(--gold);color:var(--gold);background:#ffe45c1f}.scores .mine .name{color:var(--gold)}.scores input.name{border:0;border-bottom:1px dotted var(--gold);width:4.2ch;font:inherit;text-transform:uppercase;caret-color:var(--gold);background:0 0;outline:none;padding:0}.scores .editing{animation:1.6s ease-in-out infinite board-breathe}@keyframes board-breathe{50%{opacity:.5}}@media (prefers-reduced-motion:reduce){.scores .editing{animation:none}}@media (height<=560px){.end{gap:.5rem}.df #end-title{font-size:2rem}.end .score{margin-top:0;font-size:1.1rem}.end-actions .btn{min-height:2.4rem}.end-actions #retry{min-height:2.7rem;font-size:1rem}.board{gap:.2rem;padding:.4rem .7rem}.scores{font-size:.9rem}.scores li{padding-block:0}}