:root{--g:#7CFF4F;--bg:#0b1208;--panel:#101c0b}
*{box-sizing:border-box;margin:0;padding:0;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden}
body{background:var(--bg);color:var(--g);font-family:'Courier New',monospace;display:flex;justify-content:center;align-items:center;padding:8px;touch-action:manipulation}
.crt{position:fixed;inset:0;pointer-events:none;z-index:50;background:radial-gradient(circle,transparent 55%,rgba(0,0,0,.7)),repeating-linear-gradient(transparent 0 3px,rgba(0,0,0,.18) 3px 4px)}
.game{position:relative;width:100%;max-width:min(560px,100%);height:min(100%,780px);display:flex;flex-direction:column;gap:8px;background:var(--panel);border:3px solid var(--g);border-radius:12px;padding:12px;box-shadow:0 0 30px rgba(124,255,79,.35)}
header{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:clamp(10px,2.6vw,13px)}
h1{font-size:clamp(13px,4vw,20px);text-shadow:0 0 10px var(--g);text-align:center}
.hud{display:flex;justify-content:space-between;font-size:clamp(11px,3vw,14px);min-height:20px}
#lives{letter-spacing:3px;color:#ff5a5a}
#combo{color:#ffd24a}
.board{position:relative;flex:1;min-height:0;border:2px solid var(--g);border-radius:8px;overflow:hidden;background:#071004;display:grid;gap:6px;padding:6px}
.hole{position:relative;border-radius:50%/40%;background:radial-gradient(ellipse at 50% 70%,#000 0,#14240d 60%,#1c3112 100%);display:flex;justify-content:center;align-items:center;overflow:hidden;cursor:crosshair}
.fly{font-size:clamp(28px,9vw,56px);line-height:1;transform:translateY(120%);transition:transform .12s ease-out;pointer-events:none}
.hole.up .fly{transform:translateY(0)}
.hole.hit .fly{opacity:0;transition:none}
.hole.hit::after{content:'💥';position:absolute;font-size:clamp(28px,9vw,56px);animation:splat .26s forwards}
.hole.bad .fly{animation:shake .3s}
@keyframes splat{from{transform:scale(.6);opacity:1}to{transform:scale(1.5);opacity:0}}
@keyframes shake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
.float{position:absolute;pointer-events:none;font-weight:bold;animation:rise .7s forwards;z-index:5;text-shadow:0 0 6px #000}
@keyframes rise{to{transform:translateY(-40px);opacity:0}}
.screen{position:absolute;inset:0;background:rgba(5,10,3,.96);border-radius:9px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:20px;text-align:center;z-index:10;overflow:auto}
.screen h2{font-size:clamp(16px,5vw,24px);text-shadow:0 0 10px var(--g)}
.screen p{font-size:clamp(11px,3vw,14px);line-height:1.6;max-width:420px}
.small{opacity:.8;font-size:12px!important}
.hidden{display:none!important}
button{font:inherit;font-weight:bold;color:#071004;background:var(--g);border:0;border-radius:8px;padding:12px 22px;cursor:pointer;min-width:200px;font-size:15px}
button:active{transform:scale(.97)}
button.ghost{background:transparent;color:var(--g);border:2px solid var(--g)}
input{font:inherit;text-align:center;padding:10px;border-radius:8px;border:2px solid var(--g);background:#071004;color:var(--g);width:220px;user-select:text;-webkit-user-select:text}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;max-width:420px}
.opts button{min-width:0;padding:14px 8px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.tabs button{min-width:0;padding:6px 10px;font-size:12px;background:transparent;color:var(--g);border:1px solid var(--g)}
.tabs button.on{background:var(--g);color:#071004}
ol{width:100%;max-width:420px;text-align:left;font-size:14px;list-style:none;counter-reset:r;max-height:55%;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--g) transparent}
ol li{counter-increment:r;display:flex;gap:8px;padding:4px 6px;border-bottom:1px dashed rgba(124,255,79,.25)}
ol li::before{content:counter(r)'.';width:28px;opacity:.7}
ol li span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
ol li.me{color:#ffd24a}
