*{margin:0;padding:0;box-sizing:border-box}
body{background:#20191d;font-family:'Segoe UI',system-ui,Arial,sans-serif;display:flex;flex-direction:column;align-items:center;min-height:100vh;overflow:hidden;color:#9a8892}
#splash{position:fixed;inset:0;background:radial-gradient(circle at 50% 35%,#2a2126 0%,#20191d 72%);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:50;transition:opacity .5s}
#splash.hide{opacity:0;pointer-events:none}
.sq{position:absolute;width:16px;height:16px;border-radius:3px;background:rgba(200,110,138,.12);animation:fd 5s ease-in-out infinite}
@keyframes fd{0%,100%{opacity:.1}50%{opacity:.45}}
.logo{font-size:clamp(2.2em,7.5vw,3.6em);font-weight:700;color:#c86e8a;letter-spacing:3px;z-index:1;text-shadow:0 0 28px rgba(200,110,138,.3)}
.tag{color:#5e4d55;letter-spacing:4px;font-size:.75em;margin-top:6px;text-transform:uppercase;z-index:1}
.card{background:#2a2126;border:1px solid #3a2e34;border-radius:10px;padding:18px 24px;margin:24px 0;font-size:.85em;line-height:2;color:#9a8892;text-align:center;z-index:1;max-width:320px}
.card b{color:#c86e8a}
.play{padding:14px 52px;font-size:1em;font-weight:600;background:#c86e8a;color:#20191d;border:none;border-radius:6px;cursor:pointer;letter-spacing:2px;z-index:1;text-transform:uppercase;transition:.2s}
.play:hover{box-shadow:0 0 26px rgba(200,110,138,.45)}
.foot{position:absolute;bottom:16px;font-size:.7em;color:#4c3f45;z-index:1}
.foot a{color:#c86e8a;text-decoration:none;margin:0 8px}
#hud{width:100%;max-width:420px;display:none;justify-content:space-between;padding:12px 20px;background:#2a2126;border-bottom:1px solid #3a2e34;font-weight:600;color:#8a7a83;font-size:.85em}
#hud b{color:#c86e8a}
#bar{display:none;width:100%;max-width:420px;height:4px;background:#3a2e34}
#fill{height:4px;background:#c86e8a;transition:width .1s}
#wrap{display:none;flex-direction:column;align-items:center;padding:24px;gap:14px}
#grid{display:grid;gap:6px}
.tl{border-radius:6px;cursor:pointer;transition:transform .08s}
.tl:active{transform:scale(.92)}
.msg{font-size:.8em;color:#6e5b64;height:18px;letter-spacing:1px}
#gf{display:none;width:100%;max-width:420px;text-align:center;padding:10px;font-size:.66em;color:#4c3f45}
#gf a{color:#c86e8a;text-decoration:none;margin:0 7px}
#over{display:none;position:fixed;inset:0;background:rgba(32,25,29,.96);z-index:60;flex-direction:column;align-items:center;justify-content:center;gap:14px}
#over h2{font-size:1.9em;color:#c86e8a;letter-spacing:2px}
#over .rb{padding:12px 40px;background:#c86e8a;color:#20191d;border:none;border-radius:6px;font-weight:600;cursor:pointer;text-transform:uppercase;letter-spacing:2px}