#game{--nq-ok:#1b7f4c;--nq-bad:#c62828}
@media (prefers-color-scheme:dark){#game{--nq-ok:#5fd39a;--nq-bad:#ff7b7b}}
#game [hidden]{display:none!important}
#game .nq-lv button{flex:0 1 auto;padding:7px 11px}
#game .nq-lv .nq-new{margin-left:auto}
#game .nq-stats{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:15px;color:var(--muted);margin:0 0 6px}
#game .nq-stats b{color:var(--fg);font-variant-numeric:tabular-nums}
#game .nq-track{height:6px;border-radius:999px;background:var(--line);overflow:hidden;margin:0 0 12px}
#game .nq-track i{display:block;height:100%;width:0;background:var(--accent);transition:width .2s ease}
#game .nq-card{position:relative;min-height:170px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--bg);margin:0 0 12px;overflow-wrap:anywhere;word-break:keep-all}
#game .nq-badge{display:inline-block;font-size:13px;font-weight:700;padding:2px 10px;border-radius:999px;background:var(--accent-soft);color:var(--fg);margin-bottom:10px}
#game .nq-badge.lv2{background:color-mix(in srgb,var(--accent2) 35%,transparent)}
#game .nq-badge.lv3{background:color-mix(in srgb,var(--nq-bad) 22%,transparent)}
#game .nq-q{font-size:clamp(20px,5.6vw,26px);font-weight:700;line-height:1.45;margin:0;color:var(--fg)}
#game .nq-hint{margin:12px 0 0;font-size:16px;color:var(--muted)}
#game .nq-hint b{color:var(--fg);font-size:18px}
#game .nq-ans{margin:14px 0 0;padding:12px 14px;border-radius:10px;background:var(--card);border:1px solid var(--line);line-height:1.5}
#game .nq-ans b{display:block;font-size:22px;color:var(--accent);margin-bottom:4px}
#game .nq-ans.miss b{color:var(--nq-bad)}
#game .nq-ans span{font-size:15px;color:var(--fg)}
#game .nq-form{display:flex;gap:8px;margin:0 0 10px}
#game .nq-in{flex:1 1 auto;min-width:0;font:inherit;font-size:18px;padding:9px 12px;min-height:46px;border:2px solid var(--line);border-radius:var(--r-ctl);background:var(--bg);color:var(--fg);user-select:text;-webkit-user-select:text}
#game .nq-in:focus{outline:none;border-color:var(--accent)}
#game .nq-in.bad{border-color:var(--nq-bad);animation:nq-shake .3s}
#game .nq-in:disabled{opacity:.6}
#game .nq-form button{flex:0 0 auto;min-height:46px;padding:7px 18px}
#game .nq-acts button{flex:1 1 0}
#game .status.ok{color:var(--nq-ok)}
#game .status.bad{color:var(--nq-bad)}
#game .nq-result{padding:18px 16px;border-radius:14px;border:2px solid var(--accent);background:var(--bg);text-align:center;margin:0 0 10px}
#game .nq-result .big{font-size:clamp(28px,8vw,40px);font-weight:800;margin:0 0 4px}
#game .nq-result p{margin:4px 0}
#game .nq-result ol{text-align:left;margin:12px 0 12px;padding-left:22px;font-size:15px;line-height:1.55}
#game .nq-result li.o::marker{color:var(--nq-ok)}
#game .nq-result li.x{color:var(--muted)}
#game .nq-result li{margin:0 0 6px}
#game .nq-result .nq-rq{display:block}
#game .nq-result details{margin:2px 0 0;font-size:14px;color:var(--fg)}
#game .nq-result summary{cursor:pointer;color:var(--accent);font-weight:600;display:inline-block;padding:4px 0;min-height:28px}
#game .nq-result details b{color:var(--fg)}
@keyframes nq-shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@media (prefers-reduced-motion:reduce){#game .nq-in.bad{animation:none}}
@media (max-width:420px){#game .nq-lv button{padding:7px 9px;font-size:14px}#game .nq-lv .nq-new{margin-left:0}}
