:root{--navy:#12306b;--navy2:#1d4390;--bg:#eef1f8;--card:#fff;--ink:#17213a;--mute:#5d6784;--line:#d8deec;--green:#17803d;--greenbg:#e6f6ec;--red:#c62828;--redbg:#fdeaea;--amber:#b26a00;--amberbg:#fff3d6;--r:16px}@media (prefers-color-scheme:dark){:root{--bg:#0e1424;--card:#17203a;--ink:#e8ecf7;--mute:#9aa6c6;--line:#2b3860;--greenbg:#12301f;--redbg:#3a1a1a;--amberbg:#3a2c0c;--amber:#f0b44a;--green:#4cc27a;--red:#ff7a7a}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%;font-family:Sarabun,Noto Sans Thai,Thonburi,Tahoma,system-ui,sans-serif;font-size:18px;line-height:1.55}h1,h2,h3,p{margin:0}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.45;cursor:not-allowed}.boot{height:100vh;color:var(--mute);place-items:center;display:grid}.btn{border:2px solid var(--line);background:var(--card);border-radius:14px;min-height:56px;padding:0 22px;font-weight:600;transition:transform 80ms,background .15s}.btn:active:not(:disabled){transform:scale(.97)}.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}.btn.ghost{color:var(--mute);background:0 0;border-color:#0000}.btn.amber{background:var(--amberbg);border-color:var(--amber);color:var(--amber)}.chip{background:var(--bg);border:1px solid var(--line);color:var(--mute);border-radius:999px;padding:2px 12px;font-size:14px;font-weight:600;display:inline-block}.chip.amber{background:var(--amberbg);color:var(--amber);border-color:var(--amber)}.chip.green{background:var(--greenbg);color:var(--green);border-color:var(--green)}.chip.red{background:var(--redbg);color:var(--red);border-color:var(--red)}.page{max-width:1120px;margin:0 auto;padding:24px 28px 48px}.sub{color:var(--mute);font-size:16px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin-top:22px;padding:22px 24px}.card h3{margin-bottom:14px;font-size:20px}.hero{color:#fff;background:linear-gradient(135deg, var(--navy), var(--navy2));border-radius:20px;justify-content:space-between;align-items:center;gap:20px;padding:26px 28px;display:flex}.hero h1{font-size:30px;line-height:1.25}.hero .sub{color:#cdd8f5;margin-top:6px}.stat{text-align:center;background:#ffffff24;border-radius:14px;min-width:100px;padding:10px 14px}.stat b{font-size:34px;line-height:1.1;display:block}.stat span{font-size:14px}.resume{background:var(--amberbg);border:2px solid var(--amber);border-radius:var(--r);justify-content:space-between;align-items:center;gap:16px;margin-top:18px;padding:16px 20px;display:flex}.resume b{display:block}.resume span{color:var(--mute);font-size:15px}.rbtns{gap:10px;display:flex}.modes{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px;display:grid}.mode{text-align:left;background:var(--card);border:2px solid var(--line);border-radius:var(--r);flex-direction:column;gap:4px;min-height:148px;padding:20px 22px;transition:transform 80ms;display:flex}.mode:active:not(:disabled){transform:scale(.98)}.mode.big{background:var(--navy);border-color:var(--navy);color:#fff;grid-column:1/-1;min-height:130px}.mode.big span:last-child{color:#cdd8f5}.mode .mi{font-size:30px}.mode b{font-size:21px}.mode span{color:var(--mute);font-size:15px}.chips{flex-wrap:wrap;align-items:center;gap:10px;margin:10px 0;display:flex}.grp{min-width:52px;color:var(--navy2);font-weight:700}.chipbtn{border:2px solid var(--line);background:var(--bg);border-radius:999px;min-height:48px;padding:0 18px;font-size:16px}.chipbtn.on{background:var(--navy);border-color:var(--navy);color:#fff}.prow{flex-wrap:wrap;align-items:center;gap:10px;margin-top:16px;display:flex}.prow .btn{margin-left:auto}.hint{color:var(--mute);margin-top:10px;display:block}.hist{flex-direction:column;display:flex}.hrow{border-top:1px solid var(--line);grid-template-columns:150px 1fr 90px 64px;align-items:center;gap:10px;padding:10px 0;font-size:16px;display:grid}.hrow:first-child{border-top:0}.hd{color:var(--mute);font-size:14px}.hs{text-align:right;color:var(--mute)}b.g{color:var(--green)}b.r{color:var(--red)}.note{color:var(--mute);margin-top:26px;font-size:14px}.exam{flex-direction:column;height:100dvh;display:flex}.ehead{background:var(--card);border-bottom:1px solid var(--line);align-items:center;gap:14px;padding:10px 18px;display:flex}.etitle{flex-direction:column;flex:1;min-width:0;display:flex}.etitle b{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.etitle span{color:var(--mute);font-size:14px}.timer{background:var(--bg);border:2px solid var(--line);border-radius:12px;flex-direction:column;align-items:center;min-width:138px;padding:4px 16px;display:flex}.timer .tlabel{color:var(--mute);font-size:12px;line-height:1.2}.timer .tnum{font-variant-numeric:tabular-nums;font-size:28px;font-weight:700;line-height:1.1}.timer.free{color:var(--mute);justify-content:center;min-height:56px;font-size:14px}.timer.warn{background:var(--amberbg);border-color:var(--amber);color:var(--amber)}.timer.danger{background:var(--redbg);border-color:var(--red);color:var(--red);animation:1s steps(2,jump-none) infinite blink}@keyframes blink{50%{opacity:.55}}.ebody{flex:1;grid-template-columns:1fr 300px;min-height:0;display:grid}.qcol{-webkit-overflow-scrolling:touch;padding:22px 26px;overflow-y:auto}.qcard{max-width:860px;margin:0 auto}.qmeta{flex-wrap:wrap;gap:8px;margin-bottom:10px;display:flex}.qtext{margin-bottom:20px;font-size:24px;font-weight:600;line-height:1.55}.qno{color:var(--navy2)}.choices{flex-direction:column;gap:12px;display:flex}.choice{text-align:left;border:2px solid var(--line);background:var(--card);border-radius:14px;align-items:center;gap:16px;width:100%;min-height:68px;padding:12px 18px;font-size:20px;line-height:1.45;transition:transform 80ms,background .12s;display:flex}.choice:active:not(:disabled){transform:scale(.99)}.choice .ltr{background:var(--bg);border:2px solid var(--line);border-radius:50%;flex:none;place-items:center;width:42px;height:42px;font-weight:700;display:grid}.choice .ctext{flex:1}.choice .mark{flex:none;font-size:16px;font-weight:700}.choice.picked{border-color:var(--navy2);background:color-mix(in srgb, var(--navy2) 12%, var(--card))}.choice.picked .ltr{background:var(--navy2);border-color:var(--navy2);color:#fff}.choice.right{border-color:var(--green);background:var(--greenbg);color:var(--green)}.choice.right .ltr{background:var(--green);border-color:var(--green);color:#fff}.choice.wrong{border-color:var(--red);background:var(--redbg);color:var(--red)}.choice.wrong .ltr{background:var(--red);border-color:var(--red);color:#fff}.choice.static{cursor:default;min-height:0;font-size:17px}.choices.small{gap:8px}.choices.small .ltr{width:34px;height:34px}.expl{border-left:6px solid;border-radius:14px;margin-top:18px;padding:14px 18px}.expl.ok{background:var(--greenbg);border-color:var(--green)}.expl.no{background:var(--redbg);border-color:var(--red)}.expl p{margin-top:4px;font-size:18px}.palette{border-left:1px solid var(--line);background:var(--card);padding:16px;overflow-y:auto}.palhead{flex-direction:column;margin-bottom:12px;display:flex}.palhead span{color:var(--mute);font-size:14px}.palgrid{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.pn{border:2px solid var(--line);background:var(--bg);border-radius:10px;min-height:48px;padding:0;font-size:16px;font-weight:600;position:relative}.pn.done{background:var(--navy2);border-color:var(--navy2);color:#fff}.pn.right{background:var(--green);border-color:var(--green);color:#fff}.pn.wrong{background:var(--red);border-color:var(--red);color:#fff}.pn.flag{border-color:var(--amber);border-style:dashed}.pn.flag:after{content:"🚩";font-size:13px;position:absolute;top:-9px;right:-5px}.pn.cur{outline:3px solid var(--amber);outline-offset:1px}.legend{color:var(--mute);flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:16px;font-size:13px;display:flex}.legend .pn{vertical-align:middle;width:20px;height:20px;min-height:20px;display:inline-block}.efoot{background:var(--card);border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:10px 18px;display:flex}.efoot .mid{gap:10px;display:flex}.palbtn{display:none}@media (max-aspect-ratio:1),(max-width:900px){.ebody{grid-template-columns:1fr}.palette{border:1px solid var(--line);z-index:5;border-radius:18px 18px 0 0;max-height:55vh;transition:transform .2s;position:fixed;bottom:84px;left:0;right:0;transform:translateY(120%)}.palette.open{transform:translateY(0)}.palgrid{grid-template-columns:repeat(10,1fr)}.palbtn{display:inline-block}.modes{grid-template-columns:1fr 1fr}}.modalbg{z-index:10;background:#080e208c;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{background:var(--card);border-radius:20px;width:100%;max-width:520px;padding:26px 28px}.modal h3{margin-bottom:12px;font-size:24px}.modal ul{margin:0 0 18px;padding-left:22px}.modal li.red{color:var(--red)}.mbtns{justify-content:flex-end;gap:12px;display:flex}.rhead{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.rhead h1{font-size:30px}.scoregrid{grid-template-columns:1.3fr 1fr 1fr;gap:16px;display:grid}.bigscore{border-radius:var(--r);text-align:center;color:#fff;flex-direction:column;justify-content:center;padding:22px;display:flex}.bigscore.pass{background:linear-gradient(135deg,#167a3a,#22a352)}.bigscore.fail{background:linear-gradient(135deg,#a82323,#d14444)}.bigscore .pct{font-size:56px;font-weight:800;line-height:1.1}.bigscore .verdict{font-size:22px;font-weight:700}.bigscore small{opacity:.9}.partscore{background:var(--card);border:1px solid var(--line);border-radius:var(--r);flex-direction:column;justify-content:center;gap:6px;padding:18px;display:flex}.partscore b{font-size:34px}.partscore b small{color:var(--mute);font-size:16px;font-weight:500}.bars{flex-direction:column;gap:10px;margin-bottom:16px;display:flex}.bar{grid-template-columns:260px 1fr 56px;align-items:center;gap:12px;font-size:16px;display:grid}.bt{background:var(--bg);border:1px solid var(--line);border-radius:99px;height:14px;overflow:hidden}.bt i{height:100%;display:block}.bt i.g{background:var(--green)}.bt i.r{background:var(--red)}.bv{text-align:right;color:var(--mute)}.tabs{flex-wrap:wrap;gap:10px;margin:26px 0 14px;display:flex}.tab{border:2px solid var(--line);background:var(--card);border-radius:999px;min-height:52px;padding:0 20px;font-size:16px}.tab.on{background:var(--navy);color:#fff;border-color:var(--navy)}.empty{text-align:center;color:var(--mute);padding:30px}.rv{background:var(--card);border:1px solid var(--line);border-radius:var(--r);content-visibility:auto;contain-intrinsic-size:1px 420px;margin-bottom:14px;padding:20px 22px}.rv .qtext{margin-bottom:12px;font-size:20px}@media (max-width:900px){.scoregrid{grid-template-columns:1fr}.bar{grid-template-columns:1fr 90px 50px}.hrow{grid-template-columns:1fr 70px 50px}.hd{display:none}}@media (prefers-reduced-motion:reduce){.timer.danger{animation:none}*{transition:none!important}}.mode.study{border-color:var(--navy2);flex-direction:column;width:100%;min-height:0;margin-top:18px}.cheat summary{cursor:pointer;align-items:center;min-height:44px;font-size:18px;list-style:none;display:flex}.cheatrows{flex-direction:column;margin-top:8px;display:flex}.crow{border-top:1px solid var(--line);grid-template-columns:240px 1fr;gap:14px;padding:10px 0;font-size:17px;display:grid}.crow .ck{color:var(--navy2);font-weight:700}.search{width:100%;min-height:56px;font:inherit;border:2px solid var(--line);background:var(--bg);color:var(--ink);border-radius:14px;margin-top:8px;padding:0 18px;font-size:18px}@media (max-width:900px){.crow{grid-template-columns:1fr;gap:2px}}@media (max-width:640px){body{font-size:17px}.page{padding:14px 14px 36px}.hero{border-radius:16px;flex-direction:column;align-items:flex-start;gap:10px;padding:18px}.hero h1{font-size:23px}.hero .sub{font-size:14px}.stat{display:none}.resume{flex-direction:column;align-items:stretch}.rbtns .btn{flex:1}.modes{grid-template-columns:1fr;gap:12px}.mode,.mode.big{min-height:0;padding:16px 18px}.mode .mi{font-size:26px}.card{margin-top:16px;padding:16px}.prow .btn{width:100%;margin-left:0}.grp{width:100%;min-width:0}.chipbtn{min-height:44px;padding:0 14px;font-size:15px}.ehead{gap:8px;padding:8px 10px}.ehead .btn{min-height:48px;padding:0 14px}.etitle b{display:none}.etitle span{color:var(--ink);font-size:15px;font-weight:600}.timer{min-width:0;padding:2px 10px}.qcol{padding:14px}.qtext{margin-bottom:14px;font-size:20px}.choices{gap:10px}.choice{gap:12px;min-height:60px;padding:10px 12px;font-size:18px}.choice .ltr{width:36px;height:36px}.expl p{font-size:17px}.efoot{padding:8px 10px calc(8px + env(safe-area-inset-bottom));flex-wrap:wrap;gap:8px}.efoot .mid{order:-1;justify-content:space-between;width:100%}.efoot .mid .btn{flex:1;min-height:48px;padding:0 8px;font-size:16px}.efoot>.btn{flex:1;min-height:52px;padding:0 10px}.palette{bottom:calc(128px + env(safe-area-inset-bottom));max-height:50vh;padding:12px}.palgrid{grid-template-columns:repeat(6,1fr)}.modal{padding:20px}.mbtns .btn{flex:1}.rhead{flex-direction:column;align-items:stretch;gap:10px}.rhead h1{font-size:24px}.bigscore .pct{font-size:44px}.partscore b{font-size:28px}.bar{grid-template-columns:1fr 70px 44px;gap:8px;font-size:14px}.tab{min-height:46px;padding:0 14px;font-size:15px}.rv{padding:14px}.rv .qtext{font-size:18px}.choice.static{padding:8px 10px;font-size:16px}.search{min-height:50px;font-size:16px}.crow{font-size:16px}.ehead .btn{padding:0 10px;font-size:15px}.etitle{flex:1 0 auto}.etitle span{white-space:nowrap;font-size:14px}.ehead .btn{white-space:nowrap}.ehead .lbl,.timer .tlabel{display:none}.timer .tnum{font-size:20px}.timer{justify-content:center;min-height:44px}}.notice{border-radius:var(--r);background:var(--amberbg);border:2px solid var(--amber);margin-top:18px;padding:14px 18px;font-size:16px;line-height:1.7}.refline{color:var(--mute);word-break:break-word;margin-top:6px;font-size:14px}