.cq{width:min(560px,94%);display:flex;flex-direction:column;gap:12px;background:#fffdf8;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 8px 18px rgba(70,40,10,.18)}
.cq-intro{text-align:center;padding:10px 0}.cq-intro p{color:var(--muted);margin:8px 0}.cq-best{font-weight:700;color:var(--ink)!important}.cq-intro button{font-size:18px;padding:12px 28px;margin-top:6px}
.cq-big,.cq-tiles{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.cq-big span,.cq-tiles span{width:68px;height:78px;border-radius:14px;background:#262320;color:#fff;font-size:42px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 0 #000}
.cq-big span{background:var(--cat-c,#7a4fc0);box-shadow:0 4px 0 #4f2f86}
.cq-tiles span.ok{background:#2f7a55;box-shadow:0 4px 0 #1d4f37}.cq-tiles span.no{background:#c0392b;box-shadow:0 4px 0 #85261c}
.cq-tiles.shake{animation:cqsh .35s}@keyframes cqsh{25%{transform:translateX(-8px)}50%{transform:translateX(8px)}75%{transform:translateX(-4px)}}
.cq-top{display:flex;justify-content:space-between;font-weight:700;color:var(--muted)}
.cq-hint{min-height:28px;text-align:center;font-size:15px}.cq-hint i{display:inline-block;width:1px;height:12px;background:#ccc;margin:0 10px}.cq-h0{color:var(--muted);font-size:13px}
.cq-timer{height:8px;border-radius:9px;background:#e9e0d0;overflow:hidden}.cq-timer i{display:block;height:100%;background:#2f7a55;transition:width .1s linear}.cq-timer i.hurry{background:#d0543a}
.cq-in{display:flex;gap:8px}.cq-in input{flex:1;min-width:0;font:inherit;font-size:22px;padding:12px 14px;border-radius:12px;border:2px solid var(--line);text-align:center}.cq-in input:focus{outline:none;border-color:var(--cat-c,#7a4fc0)}.cq-in button{font-size:17px;padding:0 20px}
.cq-msg{min-height:22px;text-align:center;font-size:14px}.cq-msg.bad{color:#c0392b;font-weight:700}.cq-msg.good{color:#2f7a55;font-weight:700}
.cq-btns{display:flex;justify-content:center;gap:8px}
.cq-end{text-align:center}.cq-end h3{font-size:24px;margin:4px 0}.cq-end p{color:var(--muted);margin:0 0 10px}
.cq-end ul{list-style:none;padding:0;margin:0 0 12px;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.cq-end li{padding:5px 10px;border-radius:99px;font-size:14px}.cq-end li.ok{background:#e3f1e9;color:#1d4f37}.cq-end li.no{background:#f8e3e0;color:#85261c}
.cq-end pre{white-space:pre-wrap;background:#f3ede2;border-radius:10px;padding:10px;font:13px/1.5 inherit;text-align:left;margin:0 0 10px}
@media(max-width:520px){.cq{padding:12px}.cq-big span,.cq-tiles span{width:52px;height:60px;font-size:32px}}