.cof-game{--cof-top:max(12px, env(safe-area-inset-top));--cof-right:max(12px, env(safe-area-inset-right));--cof-bottom:max(14px, env(safe-area-inset-bottom));--cof-left:max(12px, env(safe-area-inset-left));--cof-bar:80px;-webkit-tap-highlight-color:transparent;height:100dvh;color:var(--hud-ink);font-family:var(--hud-body);-webkit-user-select:none;user-select:none;background:#a9cfd8;position:relative;overflow:hidden}.cof-game :is(button,a):focus-visible{outline:3px solid var(--hud-accent);outline-offset:3px}.cof-canvas{position:absolute;inset:0}.cof-canvas canvas{touch-action:none;width:100%;height:100%;display:block}.cof-game .cof-topbar{z-index:30;color:var(--hud-ink);pointer-events:none;position:absolute;top:0;left:0;right:0}.cof-topbar>*{pointer-events:auto}.cof-mark{background:var(--hud-accent);color:var(--hud-ink);border-radius:13px;margin-right:3px;padding:9px;display:flex;transform:rotate(-7deg)}.cof-topbar .wordmark .title-dot{color:var(--hud-accent-strong);margin-left:-6px}.cof-corner{top:calc(var(--cof-bar) + 8px);z-index:20;align-items:center;gap:8px;display:flex;position:absolute;right:24px}.cof-icon-btn{border:1px solid var(--hud-edge);background:var(--hud-card);min-width:44px;height:44px;box-shadow:var(--hud-shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--hud-ink);font:600 14px/1 var(--hud-body);cursor:pointer;touch-action:manipulation;border-radius:14px;align-items:center;gap:8px;padding:0 8px 0 13px;display:inline-flex}.cof-icon-btn:hover{background:var(--hud-card-strong)}.cof-hud{top:calc(var(--cof-bar) + 8px);z-index:10;pointer-events:none;flex-wrap:wrap;align-items:stretch;gap:10px;display:flex;position:absolute;left:24px;right:190px}.cof-hud-badge{background:var(--hud-card);border:1px solid var(--hud-edge);border-radius:var(--hud-radius);box-shadow:var(--hud-shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--hud-ink);align-items:center;gap:10px;padding:9px 15px;display:flex}.cof-hud-badge>svg,.cof-meter>svg{color:var(--hud-muted);flex:none}.cof-hud-badge strong{font:600 22px/1 var(--hud-display);color:var(--hud-ink);display:block}.cof-hud-badge small{color:var(--hud-muted);font:700 10px/1.2 var(--hud-body);letter-spacing:.12em;text-transform:uppercase;margin-top:4px;display:block}.cof-timer{font-variant-numeric:tabular-nums;min-width:48px}.cof-track-badge{flex-direction:column;flex:260px;justify-content:center;align-items:stretch;min-width:220px;max-width:520px}.cof-track{height:20px;margin:0 12px 0 6px;position:relative}.cof-track-rail{background:repeating-linear-gradient(90deg, var(--hud-accent) 0 8px, var(--hud-muted) 8px 16px);border-radius:2px;height:3px;position:absolute;top:9px;left:0;right:0}.cof-track-flag{background:var(--hud-edge-strong);border-radius:2px;width:3px;height:13px;margin-left:-1px;position:absolute;top:4px}.cof-track-flag.banked{background:var(--hud-good)}.cof-track-finish{color:var(--hud-danger);margin-left:-2px;position:absolute;top:2px}.cof-track-dot{border:2px solid var(--hud-card-solid);width:11px;height:11px;box-shadow:0 1px 3px color-mix(in srgb, var(--hud-ink) 35%, transparent);border-radius:50%;margin-left:-5px;transition:left .12s linear;position:absolute;top:4px}.cof-track-dot.me{z-index:2;width:15px;height:15px;margin-left:-7px;top:1px}.cof-track-dot.dangling,.cof-track-dot.limp{border-color:var(--hud-danger);animation:.5s infinite alternate cof-blink}.cof-meters{flex-direction:column;justify-content:center;align-items:stretch;gap:6px;min-width:160px}.cof-meter{grid-template-columns:16px 1fr 44px;align-items:center;gap:7px;display:grid}.cof-hud-badge .cof-meter small{margin:0}.cof-meter-bar{background:var(--hud-edge);border-radius:4px;height:7px;position:relative;overflow:hidden}.cof-meter-bar>span{background:var(--hud-muted);border-radius:4px;transition:width .1s linear;position:absolute;inset:0 auto 0 0}.cof-meter.hot .cof-meter-bar>span{background:var(--hud-danger)}.cof-meter.grip .cof-meter-bar>span{background:var(--hud-good)}.cof-meter.grip.on .cof-meter-bar>span{background:var(--hud-accent)}.cof-meter.grip.out .cof-meter-bar>span{background:var(--hud-danger);animation:.35s infinite alternate cof-blink}.cof-prompt{z-index:12;border:1px solid var(--hud-edge);background:var(--hud-card);max-width:calc(100vw - 32px);box-shadow:var(--hud-shadow-strong);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--hud-ink);font:600 15px/1.3 var(--hud-body);text-align:center;pointer-events:none;border-radius:999px;align-items:center;gap:8px;padding:10px 18px;display:flex;position:absolute;bottom:96px;left:50%;transform:translate(-50%)}.cof-prompt.urgent{border-color:var(--hud-accent-strong);background:var(--hud-accent);color:var(--hud-ink);animation:.7s infinite alternate cof-nudge}.cof-prompt.self{border-color:var(--hud-danger);background:var(--hud-danger);color:var(--hud-card-solid)}.cof-welcome{top:calc(var(--cof-bar) + 16px);z-index:20;width:400px;max-width:calc(100vw - 32px);max-height:calc(100dvh - var(--cof-bar) - 110px);background:var(--hud-card);border:1px solid var(--hud-edge);box-shadow:var(--hud-shadow-strong);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:18px;flex-direction:column;display:flex;position:absolute;left:32px;overflow:hidden}.cof-welcome-body{overscroll-behavior:contain;flex:auto;min-height:0;padding:24px 24px 6px;overflow-y:auto}.cof-welcome-foot{background:linear-gradient(to top, var(--hud-card) 75%, transparent);flex:none;padding:12px 24px 22px}.cof-kicker{color:var(--hud-accent-ink);font:700 11px/1.4 var(--hud-body);letter-spacing:.14em;align-items:center;gap:8px;margin-bottom:12px;display:flex}.cof-kicker>svg{flex:none}.cof-welcome h1{font:600 40px/1 var(--hud-display);letter-spacing:-.5px;color:var(--hud-ink);filter:none;margin:0 0 10px;display:block}.cof-welcome h1 span{color:var(--hud-accent-strong);display:inline}.cof-desc{color:var(--hud-muted);margin:0 0 14px;font-size:14px;line-height:1.6}.cof-rules{gap:6px;margin:0 0 16px;padding:0;list-style:none;display:grid}.cof-rules li{border:1px solid var(--hud-edge);border-radius:var(--hud-radius-small);background:var(--hud-card-solid);color:var(--hud-ink);padding:8px 11px 8px 32px;font-size:13px;line-height:1.4;position:relative}.cof-rules li:before{content:"";border:2px solid var(--hud-accent-strong);border-radius:4px;width:10px;height:6px;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.cof-crew{flex-wrap:wrap;gap:6px;margin-bottom:4px;display:flex}.cof-crew-chip{border:1px solid var(--hud-edge);background:var(--hud-card-solid);color:var(--hud-ink);font:700 12px/1.2 var(--hud-body);border-radius:999px;align-items:center;gap:6px;padding:5px 11px 5px 6px;display:inline-flex}.cof-crew-chip i{border-radius:50%;width:14px;height:14px}.cof-crew-chip+.cof-crew-chip:before{content:"";background:var(--hud-edge-strong);width:10px;height:2px;margin-left:-14px;margin-right:2px}.cof-btn{font-family:var(--hud-body);cursor:pointer;justify-content:center;align-items:center;gap:8px;display:flex}.cof-btn.primary{width:100%;padding:14px 18px;font-size:16px}.cof-ended-banner .cof-btn.primary svg{margin-left:0}.cof-ended-banner{z-index:30;background:var(--hud-card-solid);border:1px solid var(--hud-edge);width:420px;max-width:calc(100vw - 32px);box-shadow:0 18px 70px color-mix(in srgb, var(--hud-ink) 24%, transparent);color:var(--hud-ink);text-align:center;border-radius:20px;padding:30px;animation:.3s cubic-bezier(.175,.885,.32,1.275) cof-pop;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cof-ended-banner h2{font:500 34px/1.13 var(--hud-display);letter-spacing:-.5px;color:var(--hud-danger);margin:0 0 8px}.cof-ended-banner.crew h2{color:var(--hud-good)}.cof-ended-banner p{color:var(--hud-muted);margin:0 0 16px;font-size:14px;line-height:1.65}.cof-score{border-top:1px solid var(--hud-edge);border-bottom:1px solid var(--hud-edge);margin:0 auto 20px;padding:14px 10px}.cof-score small{color:var(--hud-muted);font:700 11px/1.2 var(--hud-body);letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px;display:block}.cof-score strong{font:500 34px/1 var(--hud-display);color:var(--hud-ink)}.cof-game .cof-hint-bar{z-index:10;white-space:nowrap;pointer-events:none;gap:2px;padding:6px 8px;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.cof-hint-bar>span{color:var(--hud-ink);font:600 12.5px/1 var(--hud-body);align-items:center;gap:8px;padding:7px 10px;display:flex}.cof-hint-bar>span+span{border-left:1px solid var(--hud-edge)}.cof-game .house-key,.game-dialog .cof-help-keys .house-key{font-family:var(--hud-body);margin:0}.cof-icon-btn .house-key{margin-left:2px}.game-dialog .cof-rules{margin:4px 0 0}.cof-help-keys{color:var(--hud-muted);grid-template-columns:1fr 1fr;gap:9px 14px;margin:4px 0 0;padding:0;font-size:13.5px;list-style:none;display:grid}.cof-help-keys li{align-items:center;gap:9px;display:flex}.cof-help-keys .house-key{min-width:48px}.cof-stick,.cof-dock{display:none}@media (pointer:coarse),(max-width:900px){.cof-game{--cof-bar:calc(80px + env(safe-area-inset-top));--cof-hud-top:calc(var(--cof-bar) + 4px)}.cof-game .cof-topbar.topbar{height:var(--cof-bar);padding-top:env(safe-area-inset-top);padding-right:var(--cof-right);padding-left:var(--cof-left)}.cof-game .cof-hint-bar{display:none}.cof-corner{top:var(--cof-hud-top);right:var(--cof-right)}.cof-icon-btn{border-radius:50%;justify-content:center;min-width:42px;height:42px;padding:0}.cof-icon-btn span,.cof-icon-btn .house-key{display:none}.cof-hud{top:var(--cof-hud-top);right:var(--cof-right);left:var(--cof-left);grid-template-rows:42px auto;grid-template-columns:auto auto 1fr;align-items:stretch;gap:6px;display:grid}.cof-hud-badge{border-radius:14px;gap:7px;padding:6px 11px}.cof-hud-badge strong{font-size:17px}.cof-hud-badge small{letter-spacing:.1em;margin-top:2px;font-size:9px}.cof-badge-timer{grid-area:1/1}.cof-badge-wipes{grid-area:1/2}.cof-track-badge{grid-area:2/1/auto/-1;min-width:0;max-width:none;padding:6px 12px 5px}.cof-meters{display:none}.cof-prompt{top:calc(var(--cof-hud-top) + 112px);max-width:calc(100vw - var(--cof-left) - var(--cof-right));padding:9px 14px;font-size:14px;line-height:1.25;bottom:auto}.cof-welcome{top:auto;right:var(--cof-right);bottom:var(--cof-bottom);left:var(--cof-left);width:auto;max-width:520px;max-height:calc(100dvh - var(--cof-hud-top) - var(--cof-bottom) - 56px);margin:0 auto}.cof-welcome-body{padding:20px 20px 4px}.cof-welcome-foot{padding:10px 20px 18px}.cof-welcome h1{font-size:32px}.cof-desc{font-size:13.5px}.cof-rules li{padding:6px 10px 6px 30px;font-size:12.5px}.cof-crew{grid-template-columns:1fr 1fr;display:grid}.cof-crew-chip+.cof-crew-chip:before{display:none}.cof-ended-banner{width:calc(100vw - var(--cof-left) - var(--cof-right));max-width:420px;max-height:calc(100dvh - var(--cof-top) - var(--cof-bottom));padding:24px 20px;overflow-y:auto}.cof-ended-banner h2{font-size:30px}.cof-stick{display:block}.cof-game .touch-controls{left:var(--cof-left);bottom:var(--cof-bottom);z-index:25;display:block;position:absolute}.cof-game .touch-controls[data-touch-controls] .joystick{border:2px solid var(--hud-card-solid);background:color-mix(in srgb, var(--hud-card) 45%, transparent);width:122px;height:122px;box-shadow:var(--hud-shadow);color:var(--hud-ink);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border-radius:50%}.cof-game .touch-controls[data-touch-controls] .joystick>span{border:1px solid var(--hud-edge);background:var(--hud-card-strong);width:48px;height:48px;box-shadow:var(--hud-shadow);color:var(--hud-good);border-radius:50%;place-items:center;display:grid}.cof-game .touch-controls[data-touch-controls] .touch-jump{right:var(--cof-right);bottom:var(--cof-bottom);border:3px solid var(--hud-card-solid);background:var(--hud-accent);width:86px;height:86px;color:var(--hud-ink);font:700 12px/1.2 var(--hud-body);box-shadow:var(--hud-shadow-strong);border-radius:50%;position:fixed}.cof-stick.jump-lit .touch-jump{animation:.8s infinite alternate cof-glow}.cof-dock{right:var(--cof-right);bottom:var(--cof-bottom);z-index:25;pointer-events:none;width:200px;height:196px;display:block;position:absolute}.cof-dock-btn{border:2px solid var(--hud-card-solid);background:var(--hud-card);width:64px;height:64px;box-shadow:var(--hud-shadow-strong);color:var(--hud-ink);font:700 11px/1 var(--hud-body);pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:0;display:flex;position:absolute}.cof-dock-btn.brace{background:linear-gradient(to top, color-mix(in srgb, var(--hud-good) 55%, var(--hud-card-solid)) calc(var(--grip,1) * 100%), transparent 0), var(--hud-card);bottom:4px;right:98px}.cof-dock-btn.help{bottom:86px;right:86px}.cof-dock-btn.clip{bottom:104px;right:12px}.cof-dock-btn:active,.cof-dock-btn.on{border-color:var(--hud-accent-strong);background:var(--hud-accent)}.cof-dock-btn.brace.on{background:linear-gradient(to top, var(--hud-accent) calc(var(--grip,1) * 100%), var(--hud-card) 0)}.cof-dock-btn.brace.out{border-color:var(--hud-danger);background:var(--hud-danger);color:var(--hud-card-solid);animation:.35s infinite alternate cof-blink}.cof-dock-btn.lit.urgent{border-color:var(--hud-accent);animation:.7s infinite alternate cof-glow}.cof-dock-btn.lit.info{border-color:var(--hud-accent)}}@media (max-width:700px){.cof-game{--cof-bar:calc(64px + env(safe-area-inset-top))}.cof-game .cof-topbar.topbar{padding-right:max(10px, env(safe-area-inset-right));padding-left:max(10px, env(safe-area-inset-left))}}@media (pointer:coarse) and (max-height:500px) and (orientation:landscape),(max-width:900px) and (max-height:500px) and (orientation:landscape){.cof-game{--cof-bar:calc(56px + env(safe-area-inset-top))}.cof-topbar .game-toolbar-volume{display:none}.cof-hud{right:calc(var(--cof-right) + 48px);grid-template-columns:auto auto 1fr}.cof-track-badge{grid-area:1/3}.cof-prompt{top:calc(var(--cof-hud-top) + 56px)}.cof-welcome{top:var(--cof-hud-top);bottom:var(--cof-bottom);left:var(--cof-left);width:min(460px, calc(100vw - var(--cof-left) - var(--cof-right) - 170px));max-height:none;margin:0;right:auto}.cof-welcome-body{padding:16px 18px 4px}.cof-welcome h1{font-size:28px}.cof-game .touch-controls[data-touch-controls] .joystick{width:112px;height:112px}}@media (max-width:400px){.cof-badge-timer small,.cof-badge-wipes small{display:none}.cof-badge-timer,.cof-badge-wipes{padding:6px 10px}}@keyframes cof-pop{0%{opacity:0;transform:translate(-50%,-46%)scale(.92)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@keyframes cof-blink{0%{opacity:1}to{opacity:.45}}@keyframes cof-glow{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--hud-accent) 90%, transparent)}to{box-shadow:0 0 0 9px color-mix(in srgb, var(--hud-accent) 0%, transparent)}}@keyframes cof-nudge{0%{transform:translate(-50%)scale(1)}to{transform:translate(-50%)scale(1.04)}}