:root{--bg:#f4f6fa;--card:#fff;--tx:#1b2433;--mu:#667085;--pr:#2457d6;--ok:#16794a;--okbg:#e5f6ec;--bad:#b42318;--badbg:#fdeceb;--bd:#dde2ea;--warn:#fff3bf}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#10151f;--card:#18202e;--tx:#e8edf5;--mu:#93a0b5;--pr:#6b95ff;--ok:#5fd39b;--okbg:#12301f;--bad:#ff8f86;--badbg:#3a1815;--bd:#2b3648;--warn:#4a4210}}
:root[data-theme=dark]{--bg:#10151f;--card:#18202e;--tx:#e8edf5;--mu:#93a0b5;--pr:#6b95ff;--ok:#5fd39b;--okbg:#12301f;--bad:#ff8f86;--badbg:#3a1815;--bd:#2b3648;--warn:#4a4210}
:root[data-theme=dark] button:not(.sec),:root[data-theme=dark] .btn:not(.sec){color:#0b1220}
*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--tx)}
a{color:var(--pr)}header{background:var(--card);border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:5}
header .top{display:flex;gap:10px;align-items:center;padding:10px 16px;max-width:860px;margin:0 auto}.grow{flex:1}.logo{font-size:20px;letter-spacing:.3px}
header form{margin:0}button.ico{padding:5px 11px;font-size:17px;line-height:1}.who{font-weight:600}
header nav{display:flex;gap:4px;padding:0 12px 8px;max-width:860px;margin:0 auto;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
header nav a{padding:6px 12px;border-radius:99px;text-decoration:none;color:var(--tx);font-size:15px}header nav a.on{background:var(--pr);color:#fff}:root[data-theme=dark] header nav a.on{color:#0b1220}
main{max-width:860px;margin:0 auto;padding:16px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:16px;margin:0 0 14px}
h1,h2,h3{margin:.2em 0 .5em}h1{font-size:22px}h2{font-size:18px}
button,.btn{font:inherit;background:var(--pr);color:#fff;border:0;border-radius:8px;padding:9px 16px;cursor:pointer;text-decoration:none;display:inline-block}
button.sec,.btn.sec{background:transparent;color:var(--pr);border:1px solid var(--pr)}button.red{background:var(--bad)}
button:disabled{opacity:.5}input[type=text],input[type=password],input[type=number],select,textarea{font:inherit;width:100%;padding:8px;border:1px solid var(--bd);border-radius:8px;background:var(--bg);color:var(--tx)}
textarea{min-height:80px}label{display:block;margin:6px 0}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.row>*{flex:0 0 auto}
.mu{color:var(--mu);font-size:14px}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:7px 6px;border-bottom:1px solid var(--bd);vertical-align:top}
.opt{display:flex;gap:10px;padding:10px 12px;border:1px solid var(--bd);border-radius:10px;margin:8px 0;cursor:pointer;align-items:flex-start}
.opt.sel{border-color:var(--pr);background:color-mix(in srgb,var(--pr) 12%,transparent)}
.opt.ok{border-color:var(--ok);background:var(--okbg)}.opt.bad{border-color:var(--bad);background:var(--badbg)}
.opt b{min-width:1.3em}.stem{white-space:pre-line;font-size:calc(17px*var(--qf))}.pl{color:var(--mu)}body[data-lang=pl] .pl{color:var(--tx)}
body[data-lang=en] .pl{display:none}body[data-lang=pl] .en:not(.nopl){display:none}
.bar{height:8px;background:var(--bd);border-radius:5px;overflow:hidden}.bar i{display:block;height:100%;background:var(--pr)}
.pill{font-size:12px;padding:2px 8px;border-radius:99px;background:var(--bd)}.good{color:var(--ok)}.badc{color:var(--bad)}
.flash{background:var(--warn);padding:10px;border-radius:8px;margin-bottom:12px}.lang button{padding:4px 10px}
.verify{background:var(--warn);padding:6px 10px;border-radius:6px;font-size:14px}.expl{white-space:pre-line;border-left:3px solid var(--pr);padding-left:10px;margin-top:8px}
img.qi{max-width:100%;border:1px solid var(--bd);border-radius:8px;margin:8px 0}
dialog{border:1px solid var(--bd);border-radius:12px;background:var(--card);color:var(--tx);max-width:520px;width:92%}
.nav{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0}.nav button{padding:3px 9px;background:var(--bd);color:var(--tx)}.nav button.done{background:var(--pr);color:#fff}.nav button.cur{outline:2px solid var(--tx)}
@media(max-width:600px){main{padding:10px}th:nth-child(n+5),td:nth-child(n+5){font-size:13px}}

.opt{padding:12px 14px;font-size:16px}.opt b{font-size:18px;min-width:1.5em;color:var(--pr)}.opt.sel b{color:var(--tx)}
button,.btn{padding:11px 18px;font-weight:500}.card{box-shadow:0 1px 2px rgba(16,24,40,.05)}
.score{font-size:46px;font-weight:700;line-height:1.1}.score.hi{color:var(--ok)}.score.mid{color:#b7791f}.score.lo{color:var(--bad)}
.login{text-align:center}.login .logo{font-size:30px;display:block;margin-bottom:6px}
@media(max-width:600px){header .top{padding:8px 12px}.opt{padding:14px}button,.btn{padding:12px 16px}.row>button,.row>.btn{flex:1 1 auto}.stem{font-size:calc(16px*var(--qf))}}
.row>label{max-width:100%;min-width:0}select{max-width:100%;text-overflow:ellipsis}header form button{padding:7px 12px}

:root{--qf:1}:root[data-fs="-2"]{--qf:.78}:root[data-fs="-1"]{--qf:.88}:root[data-fs="1"]{--qf:1.12}
.opt,.expl{font-size:calc(16px*var(--qf))}.opt b{font-size:calc(18px*var(--qf))}
.logo,header form button{white-space:nowrap}header .top{gap:6px}
@media(max-width:480px){.who{display:none}header .top{padding:8px 10px}button.ico{padding:5px 9px}.logo{font-size:18px}header form button{padding:7px 10px}}

@media(max-width:600px){table{font-size:13px}th,td{padding:6px 4px}.card{overflow-x:auto}table.rank{font-size:12.5px}table.rank th,table.rank td{padding:6px 3px}}
