:root{--paper:#f3f6f5;--ink:#14213d;--jade:#14796b;--seal:#b8372b;--mist:#dfe7e5;--gold:#a8680f;--card:#fff}
@media(prefers-color-scheme:dark){:root{--paper:#0f1722;--ink:#e6edf3;--jade:#3fb8a3;--seal:#e5654f;--mist:#1d2a3a;--gold:#e0a84a;--card:#16212f}}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 Figtree,system-ui,sans-serif}
header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--mist);flex-wrap:wrap;gap:8px}
.logo{font-weight:700;font-size:20px;display:flex;align-items:center;gap:10px}
.logo i{font:700 22px 'Noto Serif SC',serif;background:var(--seal);color:#fff;width:38px;height:38px;display:grid;place-items:center;border-radius:4px;transform:rotate(-4deg)}
nav{display:flex;gap:4px}main{max-width:760px;margin:0 auto;padding:20px 16px 80px}
button,input,select,textarea{font:inherit;color:inherit}
button{background:var(--mist);border:0;border-radius:8px;padding:9px 14px;cursor:pointer}
button:hover{filter:brightness(.96)}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--jade);outline-offset:2px}
.pri{background:var(--jade);color:#fff;font-weight:600}.danger{color:var(--seal);margin-top:16px}.lnk{background:none;padding:4px 0;color:var(--jade)}
input,textarea,select{background:var(--card);border:1px solid var(--mist);border-radius:8px;padding:9px 12px;width:100%}
h2{font-size:26px;margin:.4em 0}h3{margin:1.4em 0 .5em}.muted{color:var(--ink);opacity:.6;margin:.2em 0}
.row{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.row input{flex:1;min-width:160px}.row input,.row select{width:auto}
.form{display:grid;gap:8px}.chk{display:flex;gap:8px;align-items:center}.chk input{width:auto}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:16px}
.deck{display:flex;flex-direction:column;align-items:flex-start;gap:4px;background:var(--card);border:1px solid var(--mist);border-left:5px solid var(--jade);padding:16px;text-align:left}
.deck span{opacity:.65;font-size:14px}
.list{list-style:none;padding:0}.list li{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--mist)}
.zh{font-family:'Noto Serif SC',serif}.big{font-size:56px;line-height:1.2;text-align:center;margin:12px 0}
.card{background:var(--card);border:1px solid var(--mist);border-radius:14px;padding:24px;margin-top:8px;text-align:center}
.card textarea,.card input{margin:8px 0}.ans{margin:16px 0;font-size:22px}
.rate{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.r{display:flex;flex-direction:column;color:#fff;font-weight:600}.r small{font-weight:400;opacity:.85}
.r1{background:var(--seal)}.r3{background:var(--gold)}.r4{background:var(--jade)}.r5{background:#2b5fa8}
.opt{display:block;width:100%;margin:6px 0;background:var(--paper);border:1px solid var(--mist)}.ok{background:var(--jade)!important;color:#fff}.bad{background:var(--seal)!important;color:#fff}
p.ok,p.bad{background:none!important;color:var(--jade);font-weight:700}p.bad{color:var(--seal)}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tile{min-height:64px;background:var(--card);border:1px solid var(--mist)}
.tile.sel{border-color:var(--jade);box-shadow:0 0 0 2px var(--jade)}.tile.done{opacity:.35}
.filebtn{display:inline-block;padding:12px 18px;border-radius:8px;cursor:pointer}
.read{font-size:28px;line-height:2.1;background:var(--card);border-radius:12px;padding:12px 16px;margin:12px 0;min-height:60px}
.w{cursor:pointer;border-bottom:2px dotted var(--jade)}.w:hover{background:var(--mist)}
.panel{position:sticky;bottom:8px;background:var(--card);border:1px solid var(--jade);border-radius:12px;padding:14px;text-align:center;box-shadow:0 6px 24px #0003}
.ai{white-space:pre-wrap;background:var(--card);border-radius:8px;padding:12px;margin-top:8px}
@media(max-width:520px){.rate{grid-template-columns:repeat(2,1fr)}.tiles{grid-template-columns:repeat(2,1fr)}.list li{grid-template-columns:1fr auto}.list li span:nth-child(2){grid-column:1}}
@media(prefers-reduced-motion:no-preference){button{transition:filter .15s}}
