:root{--bg:#0b0f16;--panel:#121826;--muted:#9fb0cc;--fg:#e9f0ff;}
*{box-sizing:border-box;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;}
body{margin:0;background:radial-gradient(1200px 700px at 20% 0%, #18223a 0%, var(--bg) 60%);color:var(--fg);}
.wrap{max-width:1100px;margin:24px auto;padding:0 16px;}
.top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
h1{margin:0;font-size:28px;}
.stats{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:14px}
.panel{display:grid;grid-template-columns:360px 1fr;gap:16px;margin-top:16px}
.card{background:rgba(18,24,38,.75);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px;backdrop-filter: blur(6px);}
.row{display:flex;gap:10px;align-items:center;margin:10px 0;}
label{color:var(--muted);min-width:60px}
input{width:100%;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.25);color:var(--fg)}
button{padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:var(--fg);cursor:pointer}
button:hover{background:rgba(255,255,255,.06)}
.hidden{display:none}
.msg{color:#ffdf85;margin-top:8px;font-size:13px}

.board{
  width: 520px; max-width: 100%;
  aspect-ratio: 1/1;
  display:grid;
  grid-template-columns: repeat(24, 1fr);
  grid-template-rows: repeat(24, 1fr);
  gap:2px;
  background:rgba(255,255,255,.06);
  padding:10px;border-radius:16px;
}
.cell{background:rgba(255,255,255,.05);border-radius:6px}
.apple{background:rgba(255,90,90,.95)}
.wall{background:rgba(255,255,255,.18)}
.p1{background:rgba(120,255,180,.9)}
.p2{background:rgba(255,240,120,.9)}
.head{position:relative}
.head::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 35% 40%, rgba(0,0,0,.7) 0 3px, transparent 4px),
    radial-gradient(circle at 65% 40%, rgba(0,0,0,.7) 0 3px, transparent 4px),
    radial-gradient(circle at 50% 72%, rgba(0,0,0,.55) 0 2px, transparent 3px);
  border-radius:6px;
}
.help{color:var(--muted);font-size:13px;margin-top:10px}
ul{margin:8px 0 0;padding-left:18px;color:var(--muted)}
li{margin:6px 0}
.small{color:var(--muted);font-size:13px}
