*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#12141a;color:#eef0f4}
header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #2a2e38}
header h1{font-size:22px;margin:0;letter-spacing:.5px}header h1 small{color:#9aa3b2;font-weight:400;font-size:14px;margin-left:6px}
header button{background:#2a2e38;color:#eef0f4;border:0;border-radius:50%;width:32px;height:32px;font-size:16px;cursor:pointer}
main{max-width:860px;margin:0 auto;padding:16px}
.intro{color:#b9c0cc;text-align:center;margin:4px 0 14px}
#help{display:none;background:#1c1f27;border-radius:10px;padding:10px 16px;margin-bottom:12px;color:#c9cfda;font-size:14px}#help.open{display:block}
#guess-wrap{position:relative;max-width:420px;margin:0 auto 16px}
#guess{width:100%;padding:13px 14px;font-size:17px;border-radius:10px;border:2px solid #3a4050;background:#1c1f27;color:#fff;outline:none}#guess:focus{border-color:#f2a541}
#suggest{list-style:none;margin:4px 0 0;padding:0;position:absolute;width:100%;z-index:5;background:#1c1f27;border-radius:10px;overflow:hidden;box-shadow:0 8px 20px #0008}
#suggest li{padding:11px 14px;cursor:pointer;border-bottom:1px solid #2a2e38}#suggest li:hover{background:#2a2e38}
#board{overflow-x:auto}.row{display:grid;grid-template-columns:1.6fr repeat(var(--cols),1fr);gap:5px;margin-bottom:5px;min-width:560px}
.cell{border-radius:7px;padding:10px 4px;text-align:center;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;min-height:52px;word-break:break-word}
.head .cell{background:none;color:#9aa3b2;font-weight:500;min-height:0;padding:4px;border-bottom:2px solid #3a4050;border-radius:0}
.ok{background:#3b9b4a}.no{background:#b5413a}.cell.name{background:#2a2e38}.cell.name.ok{background:#3b9b4a}
.pop{animation:pop .35s ease}@keyframes pop{from{transform:scale(.9);opacity:0}to{transform:none;opacity:1}}
#result{display:none;background:#1c1f27;border-radius:12px;padding:16px;margin:16px auto;max-width:460px;text-align:center}
#result h2{margin:4px 0 12px;font-size:20px}#share{background:#f2a541;color:#12141a;border:0;border-radius:10px;padding:13px 22px;font-size:17px;font-weight:700;cursor:pointer;width:100%}
.nums{display:flex;justify-content:space-around;margin:14px 0}.nums div{display:flex;flex-direction:column;font-size:12px;color:#9aa3b2}.nums b{font-size:24px;color:#fff}
.bar{display:flex;align-items:center;gap:6px;margin:3px 0;font-size:12px}.bar span{width:26px;text-align:right;color:#9aa3b2}.bar i{background:#3a4050;font-style:normal;text-align:right;padding:2px 6px;border-radius:4px}
#next{color:#9aa3b2;margin-top:12px;font-variant-numeric:tabular-nums}
.msg{text-align:center;color:#9aa3b2}footer{color:#6f7787;font-size:12px;text-align:center;padding:24px 16px}footer a{color:#9aa3b2}
.db-ad{margin:14px auto;text-align:center;max-width:728px}
.games{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.games a{background:#1c1f27;border-radius:12px;padding:18px;color:#fff;text-decoration:none;font-size:18px;font-weight:700}.games a span{display:block;color:#9aa3b2;font-size:13px;font-weight:400;margin-top:6px}
