@font-face { font-family:"Staggering Bob"; src:url("original-assets/level1/fonts/43_Staggering Bob.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"Force Majeure"; src:url("original-assets/start/fonts/8_Force Majeure.ttf") format("truetype"); font-display:swap; }
@font-face { font-family:"Start Verdana"; src:url("original-assets/start/fonts/17_Verdana.ttf") format("truetype"); font-display:swap; }
:root { color-scheme: dark; --cyan:#61e8ff; --green:#78ffb6; --pink:#ff4f91; --ink:#030711; }
* { box-sizing:border-box; }
html,body { width:100%; min-width:320px; height:100%; margin:0; overflow:hidden; overscroll-behavior:none; }
body { background:#02040a; color:#eaffff; font-family:"Courier New",ui-monospace,monospace; }
body::before { content:""; position:fixed; inset:-10%; background:
  radial-gradient(ellipse at 18% 22%,rgba(25,114,160,.35),transparent 35%),
  radial-gradient(ellipse at 78% 70%,rgba(133,20,91,.2),transparent 38%),
  linear-gradient(145deg,#09182b 0%,#030711 48%,#10051b 100%); background-size:cover; }
.game-shell { position:relative; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:8px; width:min(100vw,1200px); height:min(100dvh,900px); margin:auto; padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); }
.topbar,footer { display:flex; align-items:center; justify-content:space-between; gap:14px; min-width:0; }
.home-link { color:inherit; text-decoration:none; }
.home-link:hover strong,.home-link:focus-visible strong { color:var(--cyan); }
.home-link:focus-visible { border-radius:4px; outline:2px solid var(--cyan); outline-offset:4px; }
.brand { display:grid; line-height:1; text-transform:uppercase; }
.brand span { color:#68808d; font-size:clamp(7px,1.5vmin,10px); letter-spacing:.16em; }
.brand strong { color:var(--green); font-size:clamp(19px,3.5vmin,34px); letter-spacing:-.06em; text-shadow:0 0 18px rgba(120,255,182,.22); }
.stats { display:flex; gap:clamp(10px,3vw,34px); font-size:clamp(9px,1.7vmin,13px); text-transform:uppercase; color:#7f98a3; }
.stats span { display:grid; text-align:right; }
.stats b { color:#eaffff; font-size:1.25em; }
.stage { position:relative; min-height:0; overflow:hidden; border:1px solid rgba(97,232,255,.35); border-radius:clamp(4px,1.5vmin,14px); background:#020713; box-shadow:0 24px 90px #000; touch-action:none; }
.stage::before { content:""; position:absolute; inset:0; background:
  radial-gradient(circle at 50% 120%,rgba(25,119,173,.38),transparent 45%),
  linear-gradient(rgba(3,9,20,.2),rgba(2,5,13,.78)),
  radial-gradient(#c5f7ff 0.7px,transparent .9px); background-size:auto,auto,31px 31px; }
canvas { position:absolute; inset:0; width:100%; height:100%; display:block; }
.panel { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:space-evenly; gap:clamp(7px,1.5vmin,16px); padding:clamp(10px,2.8vmin,28px) clamp(12px,6vw,70px); text-align:center; background:url("original-assets/start/images/12.jpg") center/cover no-repeat; }
.panel[hidden] { display:none; }
.panel h1 { flex:0 0 auto; margin:0; color:#050505; font:900 italic clamp(54px,12vmin,128px)/.82 Impact,"Arial Black",sans-serif; white-space:nowrap; letter-spacing:-.035em; word-spacing:.08em; text-transform:uppercase; transform:skewX(-4deg); }
.briefing,.instructions { width:min(100%,1040px); border:2px solid rgba(50,82,83,.64); border-radius:clamp(8px,1.5vmin,16px); color:#080808; background:rgba(228,255,247,.72); box-shadow:0 2px 0 rgba(255,255,255,.55) inset; }
.briefing { padding:clamp(12px,2.5vmin,28px) clamp(12px,2.8vw,34px); text-align:left; }
.instructions { padding:clamp(12px,2.2vmin,24px); background:rgba(235,255,241,.7); }
.panel p { margin:0; color:inherit; font:400 clamp(12px,2.7vmin,25px)/1.35 "Courier New",monospace; }
.briefing p+p { margin-top:clamp(8px,2.5vmin,28px); }
.instructions p { font-weight:700; }
.instructions p+p { margin-top:clamp(5px,1.5vmin,14px); }
.panel button { min-width:clamp(140px,32vw,310px); padding:clamp(8px,1.8vmin,18px); border:1px solid rgba(255,255,255,.9); border-radius:8px; color:#fff; background:linear-gradient(105deg,rgba(248,52,33,.94),rgba(159,0,38,.94)); box-shadow:0 5px 18px rgba(35,0,4,.35); font:900 italic clamp(34px,7vmin,72px)/1 Impact,"Arial Black",sans-serif; letter-spacing:.035em; text-transform:uppercase; }
.touch-copy { display:none; }
.message { position:absolute; inset:0; display:grid; place-items:center; padding:20px; color:#fff; background:rgba(2,5,13,.62); font:900 clamp(28px,8vmin,72px)/1 Impact,sans-serif; text-align:center; text-transform:uppercase; text-shadow:3px 3px 0 #a41d4a; pointer-events:none; }
.message[hidden] { display:none; }
.end-panel { position:absolute; inset:0; z-index:3; display:grid; place-items:center; padding:20px; background:rgba(0,0,0,.7); text-align:center; }
.end-panel[hidden] { display:none; }
.end-card { width:min(88%,560px); padding:clamp(24px,6vmin,58px); border:2px solid rgba(255,255,255,.82); border-radius:12px; background:rgba(5,5,5,.88); box-shadow:0 18px 60px #000; }
.end-card h2 { margin:0; color:#fff; font:900 italic clamp(42px,10vmin,92px)/.9 Impact,"Arial Black",sans-serif; letter-spacing:.02em; text-transform:uppercase; }
.end-card p { margin:clamp(15px,3vmin,28px) 0; color:#fff; font:bold clamp(18px,3.4vmin,30px)/1.2 "Courier New",monospace; text-transform:uppercase; }
.end-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.end-actions button { min-width:clamp(120px,28vw,210px); padding:12px 18px; border:1px solid #fff; border-radius:7px; color:#fff; background:linear-gradient(105deg,#ef392b,#9f0026); font:900 italic clamp(19px,3.5vmin,30px)/1 Impact,"Arial Black",sans-serif; letter-spacing:.035em; text-transform:uppercase; }
.end-actions button:last-child { background:linear-gradient(#46545b,#18232a); }
.touch-guide { position:absolute; inset:auto 0 8px; display:none; justify-content:space-between; padding:0 12px; color:rgba(213,251,255,.58); font-size:9px; letter-spacing:.1em; text-transform:uppercase; pointer-events:none; }
footer { min-height:20px; color:#708992; font-size:clamp(8px,1.5vmin,11px); }
footer button { padding:4px 8px; border:1px solid #345463; border-radius:5px; color:#9db6bf; background:#07111d; font:inherit; }
@media (hover:none),(pointer:coarse) { .desktop-copy { display:none; } .touch-copy,.touch-guide { display:flex; } }
@media (max-width:520px) { .game-shell { padding-inline:0; gap:5px; } .topbar,footer { padding-inline:8px; } .brand strong { font-size:20px; } .stats { gap:9px; } .stage { border-inline:0; border-radius:0; } .panel { justify-content:center; padding:10px 12px; } .panel h1 { white-space:normal; font-size:clamp(43px,18vw,72px); line-height:.82; } .briefing { max-height:39%; overflow:auto; } }
@media (max-height:440px) { .game-shell { grid-template-rows:minmax(0,1fr); padding:0; } .topbar,footer { display:none; } .stage { border:0; border-radius:0; } }
@media (prefers-reduced-motion:reduce) { * { transition:none!important; } }