.wqr{--navy:#1b2a5e;--red:#c8102e;--line:#e2e6ef;--tint:#eef2fa;--mut:#505a6e;max-width:1180px;margin:0 auto;font-size:16px;color:#1a1f2e}
.wqr [hidden]{display:none!important}
.wqr button{font:inherit;cursor:pointer}
.wqr-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 18px}
.wqr-tabs button{border:0;border-radius:999px;padding:10px 20px;min-height:46px;font-weight:700;background:var(--tint);color:var(--navy)}
.wqr-tabs button.on{background:var(--navy);color:#fff}
.wqr-tabs small{font-size:.8em;font-weight:600;opacity:.85}
.wqr-cols{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:start}
.wqr-card{border:1px solid var(--line);border-radius:18px;padding:18px 20px;background:#fff}
.wqr-lb{display:block;font-weight:700;font-size:.92em;color:var(--red);margin:14px 0 6px}
.wqr-card>.wqr-lb:first-child{margin-top:0}
.wqr-seg{display:flex;gap:6px;flex-wrap:wrap}
.wqr-seg button{padding:9px 14px;min-height:44px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font-weight:600;color:var(--mut)}
.wqr-seg button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.wqr-in{width:100%;box-sizing:border-box;border:1.5px solid var(--line);border-radius:12px;padding:11px 13px;font:inherit;font-size:16px;background:#fff;color:#1a1f2e}
.wqr-in:focus,.wqr-pre:focus-within{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px var(--tint)}
.wqr-f .wqr-lb:not(:first-child){margin-top:10px}
.wqr-sw{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.wqr-sw button{width:34px;height:34px;border-radius:50%;border:3px solid #fff;background:var(--c);box-shadow:0 0 0 1px var(--line);padding:0}
.wqr-sw button.on{box-shadow:0 0 0 3px var(--navy)}
.wqr-own{display:inline-flex;align-items:center;gap:6px;font-size:.9em;color:var(--mut);cursor:pointer}
.wqr-own input{width:34px;height:34px;border:0;padding:0;background:none;cursor:pointer}
.wqr-prev{display:flex;flex-direction:column;align-items:center;gap:12px;background:#f6f8fc;position:sticky;top:90px}
.wqr-box{background:#fff;border-radius:16px;padding:12px;box-shadow:0 6px 18px rgba(27,42,94,.12);width:100%;max-width:320px}
.wqr-box canvas{display:block;width:100%;height:auto}
.wqr-empty{color:var(--mut);font-size:.9em;margin:0}
.wqr-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.wqr-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 18px;border-radius:12px;border:0;background:var(--navy);color:#fff;font-weight:700}
.wqr-btn.g{background:#fff;color:var(--navy);border:1.5px solid var(--navy)}
.wqr-btn:disabled{opacity:.45;cursor:not-allowed}
.wqr-btn:focus-visible,.wqr-seg button:focus-visible,.wqr-tabs button:focus-visible{outline:3px solid #f2b705;outline-offset:2px}
.wqr-full{width:100%;margin-top:14px}
.wqr-note{font-size:.82em;color:var(--mut);text-align:center;margin:0}
.wqr-f .wqr-note{text-align:left;margin-top:8px}
.wqr-hist{margin-top:22px}
.wqr-hist h3{color:var(--navy);margin:0 0 6px;font-size:1.1em}
.wqr-hi{display:flex;gap:12px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line)}
.wqr-hi canvas{width:44px;height:44px;flex:none;border-radius:6px;background:#fff}
.wqr-hi .t{flex:1;min-width:0}.wqr-hi .t b{display:block;font-size:.95em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wqr-hi .t span{font-size:.8em;color:var(--mut)}
.wqr-link{border:0;background:none;color:var(--navy);font-weight:600;text-decoration:underline;padding:6px}
.wqr-link.red{color:#a40d26}
.wqr-gate{max-width:420px;margin:0 auto;text-align:center}
.wqr-lock{font-size:42px}
.wqr-gate h3{color:var(--navy);margin:6px 0}
.wqr-gate p{color:var(--mut);margin:0 0 12px}
.wqr-pin{text-align:center;font-size:22px;letter-spacing:.25em;margin-bottom:10px}
.wqr-msg{font-weight:600;min-height:24px;margin-top:10px!important}
.wqr-pre{display:flex;align-items:stretch;border:1.5px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.wqr-pre span{background:#f3f5fa;padding:11px 8px;font-size:.85em;color:var(--mut);white-space:nowrap;display:flex;align-items:center;max-width:55%;overflow:hidden;text-overflow:ellipsis}
.wqr-pre input{flex:1;min-width:0;border:0;padding:11px 10px;font:inherit;font-size:16px;outline:none}
.wqr-res{border:2px solid #137a3f;background:#e9f7ef;border-radius:16px;padding:14px;display:flex;gap:12px;align-items:center;margin-top:14px}
.wqr-res canvas{width:92px;height:92px;flex:none;border-radius:8px;background:#fff}
.wqr-res b{color:#137a3f;display:block}
.wqr-res code{display:block;font-weight:700;color:var(--navy);word-break:break-all;font-size:.95em;margin:2px 0 8px;user-select:all}
.wqr-res .r{display:flex;gap:6px;flex-wrap:wrap}.wqr-res .wqr-btn{min-height:38px;padding:0 12px;font-size:.88em}
.wqr-lh{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.wqr-lh b{color:var(--navy);font-size:1.05em}
.wqr-li{border:1px solid var(--line);border-radius:14px;padding:11px 13px;margin-top:8px}
.wqr-li.off{opacity:.6;background:#fafafa}
.wqr-li .h{display:flex;gap:8px;align-items:flex-start}
.wqr-li .h div{flex:1;min-width:0}
.wqr-li b{color:var(--navy);display:block}
.wqr-li code{display:block;color:var(--red);font-size:.88em;word-break:break-all}
.wqr-li .d{font-size:.8em;color:var(--mut);word-break:break-all}
.wqr-ct{flex:none;background:var(--tint);color:var(--navy);font-weight:700;font-size:.85em;border-radius:999px;padding:2px 10px;white-space:nowrap}
.wqr-li .a{display:flex;gap:2px;flex-wrap:wrap;margin-top:4px}
.wqr-edit{display:flex;gap:6px;margin-top:8px}.wqr-edit .wqr-in{padding:8px 10px}.wqr-edit .wqr-btn{min-height:40px;padding:0 12px}
.wqr-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#1a1f2e;color:#fff;padding:12px 18px;border-radius:14px;z-index:9999;max-width:92vw;box-shadow:0 8px 24px rgba(0,0,0,.25)}
@media(max-width:820px){.wqr-cols{grid-template-columns:1fr}.wqr-prev{position:static}}