/* 職安一點通 — 乙級術科電腦化模擬測驗
   首頁沿用主站視覺（黑字、紅色強調、警示斜紋）；作答畫面仿勞動部技能檢定中心電腦化術科測試介面 */
:root{
  --bg:#f6f5f2; --paper:#fff; --ink:#16191d; --ink2:#4a4f57; --muted:#80858d; --line:#e3e0d9;
  --red:#c8312b; --red-d:#9f241f; --red-l:#fbeceb; --hazard:#f2c230;
  --ok:#1f7a4d; --ok-bg:#e6f3ec; --bad:#b3261e; --bad-bg:#fbeceb;
  /* 官方作答畫面 */
  --ex-yellow:#ffeaa7; --ex-gray:#e9e9e9; --ex-bar:#a3a3a3; --ex-blue:#337ab7; --ex-blue-d:#286090; --ex-blue-l:#7ba7d0;
  --ex-red:#d9534f; --ex-badge:#777; --ex-teal:#1ec3d8; --ex-green:#8cc63f; --ex-blank:#d6f7a3; --ex-mint:#43d9b3;
  --sans:"Noto Sans TC","Microsoft JhengHei",-apple-system,"PingFang TC",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);color:var(--ink);line-height:1.75;font-size:16px;background:var(--bg);min-height:100vh}
button,input,select{font:inherit;color:inherit}
a{color:var(--red)}
[hidden]{display:none!important}
.sk-boot{padding:120px 20px;text-align:center;color:var(--ink2)}
:focus-visible{outline:3px solid var(--hazard);outline-offset:2px}

/* ───────── 首頁（主站風格） ───────── */
.hz{height:8px;background:repeating-linear-gradient(-45deg,var(--hazard) 0 14px,var(--ink) 14px 28px)}
.top{background:#fff;border-bottom:1px solid var(--line)}
.top .in{max-width:1080px;margin:0 auto;padding:0 20px;min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.top img{height:44px;width:auto;display:block}
.top nav{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.top nav a{color:var(--ink);text-decoration:none;font-weight:500;padding:6px 10px;border-radius:6px;font-size:15px}
.top nav a:hover{background:var(--bg)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.hero{padding:40px 0 8px}
.eyebrow{font-size:12px;letter-spacing:.18em;color:var(--red);font-weight:700;margin:0 0 6px}
.hero h1{font-size:clamp(26px,4vw,38px);line-height:1.3;margin:0 0 10px;font-weight:900;letter-spacing:.02em}
.hero p{color:var(--ink2);margin:0;max-width:none}
.blk{margin:32px 0}
.blk h2{font-size:20px;margin:0 0 14px;display:flex;align-items:center;gap:10px}
.blk h2 .n{font-size:13px;color:var(--red);font-weight:900;letter-spacing:.1em}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:22px 22px 20px;display:flex;flex-direction:column;gap:10px}
.card h3{margin:0;font-size:20px}
.card p{margin:0;color:var(--ink2);font-size:15px}
.card .spec{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0}
.card .spec span{font-size:13px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:1px 10px;color:var(--ink2)}
.card.main{border-color:var(--ink);box-shadow:0 2px 0 var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--ink);background:#fff;color:var(--ink);border-radius:8px;padding:9px 18px;font-weight:700;cursor:pointer;text-decoration:none;line-height:1.4}
.btn:hover{background:var(--bg)}
.btn-primary{background:var(--red);border-color:var(--red);color:#fff}
.btn-primary:hover{background:var(--red-d);border-color:var(--red-d)}
.btn-sm{padding:5px 12px;font-size:14px}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:4px}
.cats label{display:flex;gap:8px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:8px 10px;cursor:pointer;background:#fff;font-size:15px}
.cats label small{color:var(--muted);margin-left:auto}
.cats input{accent-color:var(--red)}
.rules{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px 22px}
.rules ol{margin:0;padding-left:20px}
.rules li{margin:4px 0;color:var(--ink2)}
.tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:15px}
.tbl th,.tbl td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left}
.tbl th{background:#faf9f6;font-weight:700;font-size:14px;color:var(--ink2)}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.pass{color:var(--ok);font-weight:700}.fail{color:var(--bad);font-weight:700}
.note{background:#fff8dc;border:1px solid #efd98a;border-radius:8px;padding:12px 16px;font-size:15px;color:var(--ink2)}
.muted{color:var(--muted)}.small{font-size:14px}
.foot{margin:48px 0 0;padding:24px 0 40px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;text-align:center}

/* ───────── 試場登入畫面（仿官方） ───────── */
.lg-bg{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
  background:#a0592e radial-gradient(circle,rgba(255,255,255,.28) 5px,transparent 6px) 0 0/64px 64px}
.lg-card{background:#fff;width:min(560px,100%);padding:44px 40px 40px;box-shadow:0 10px 30px rgba(0,0,0,.25);position:relative}
.lg-card h1{text-align:center;font-size:26px;font-weight:500;line-height:1.6;margin:0 0 30px;letter-spacing:.06em}
.lg-row{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:10px;margin:14px 0;font-size:18px}
.lg-row .radios{display:flex;gap:40px}
.lg-row .radios label{display:flex;gap:6px;align-items:center;cursor:pointer}
.lg-cap{display:flex;gap:16px;align-items:center;margin-top:16px;position:relative}
.lg-cap input{flex:1;min-width:0;border:1px solid #ccc;padding:10px 14px;font-size:20px;background:#fff;cursor:pointer}
.lg-cap canvas{width:170px;height:56px;flex:none;cursor:pointer}
.lg-btns{display:flex;justify-content:center;gap:10px;margin-top:34px}
.lg-btns button{border:1px solid #ddd;background:#fff;font-size:18px;padding:10px 26px;cursor:pointer}
.lg-btns .go{background:#f0ad4e;border-color:#f0ad4e;color:#fff}
.lg-btns .go:hover{background:#ec971f}
.lg-in{border:1px solid #ccc;padding:8px 12px;font-size:18px;background:#fff;cursor:pointer;min-width:0;width:100%}
.lg-opt{margin:6px 0 10px;text-align:left}.lg-opt>summary{cursor:pointer;color:#555;font-size:14px;margin:4px 0 10px}.lg-optnote{font-size:13px;color:#777;margin:0 0 8px;line-height:1.6}
.lg-note{margin:4px 0 18px;padding:12px 14px;background:#fff8e1;border:1px solid #f0d78c;border-radius:6px;font-size:14px;line-height:1.7;color:#5a4a1a;text-align:left}
.lg-hint{margin:8px 0 2px 120px;font-size:13px;color:#888}
.lg-err{color:#c9302c;text-align:center;min-height:1.6em;margin-top:8px;font-size:15px}
.lg-back{position:absolute;top:10px;left:14px;font-size:13px;color:#888;text-decoration:none}

/* ───────── 數字鍵盤（填空／計算／驗證碼） ───────── */
.kp{position:absolute;z-index:60;background:#fff;border:1px solid #bbb;border-radius:4px;box-shadow:0 4px 14px rgba(0,0,0,.18);padding:5px;display:flex;flex-direction:column;gap:5px;width:max-content}
.kp .r{display:flex;gap:4px;flex-wrap:wrap}
.kp button{min-width:2.4em;height:2.1em;font-size:1.05em;background:linear-gradient(#fff,#e8e8e8);border:1px solid #999;border-radius:5px;cursor:pointer;padding:0 .4em}
.kp button:active{background:#ddd}
.kp .bk,.kp .cl{background:#7a7a7a;color:#fff;min-width:4.6em;font-weight:700;border-color:#666}
.kp .ok{background:#8b0000;color:#fff;min-width:4.6em;font-weight:700;border-color:#6d0000}

/* ───────── 作答畫面（仿官方） ───────── */
.ex{--fs:18px;min-height:100vh;background:var(--ex-yellow);display:flex;flex-direction:column;font-size:var(--fs);color:#333;font-family:"Microsoft JhengHei","Noto Sans TC",sans-serif;letter-spacing:.01em}
.ex-head{background:#fff;padding:12px 28px 10px;display:grid;grid-template-columns:auto 1fr;gap:10px 40px;align-items:start;position:relative}
.ex-seat{font-size:28px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.ex-seat b{background:var(--ex-red);color:#fff;font-weight:700;padding:0 10px;line-height:1.45;font-size:28px}
.ex-info{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:2px 22px;font-size:19px;align-items:baseline}
.ex-info dt{font-weight:700;white-space:nowrap}
.ex-info dd{margin:0 0 0 20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ex-time.warn{color:#d9534f;font-weight:700}
.ex-tr{position:absolute;right:12px;top:10px;display:flex;gap:6px}
.ex-pin{width:32px;height:32px;border-radius:50%;background:#eee;border:0;cursor:pointer;color:#777;font-size:14px;line-height:1}
.ex-pin.on{background:#cfe3f7;box-shadow:inset 0 0 0 2px var(--ex-blue)}
.ex.pinned .ex-head{position:sticky;top:0;z-index:30;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.ex.collapsed.pinned .ex-head{display:grid}
.ex-bar{background:var(--ex-gray);padding:12px 118px 14px 28px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:19px}
.ex-bar .l,.ex-bar .r{display:flex;flex-direction:column;gap:10px}
.ex-bar .r{align-items:flex-start}
.ex-bar .row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ex-bar select{font-size:17px;padding:4px 6px;border:1px solid #ccc;border-radius:4px;background:#fff;min-width:56px}
.xb{border:0;border-radius:2px;color:#fff;background:var(--ex-blue);font-size:18px;padding:7px 16px;cursor:pointer;line-height:1.35;font-family:inherit}
.xb:hover{background:var(--ex-blue-d)}
.xb[disabled]{background:var(--ex-blue-l);cursor:default}
.xb.red{background:var(--ex-red)}.xb.red:hover{background:#c9302c}
.xb.grn{background:#5cb85c}.xb.grn:hover{background:#449d44}
.ex-toggle{background:var(--ex-bar);color:#fff;text-align:center;font-size:15px;border:0;width:100%;padding:4px 0;cursor:pointer;font-family:inherit}
.ex-main{flex:1;padding:22px 118px 60px 28px;position:relative;max-width:100%}
.ex.collapsed .ex-head,.ex.collapsed .ex-bar{display:none}
.ex-float{position:fixed;right:0;top:250px;display:flex;flex-direction:column;gap:12px;z-index:40}
.ex.collapsed .ex-float{top:60px}
.ex-float button{width:88px;height:88px;border:0;cursor:pointer;display:grid;place-items:center;color:#fff}
.ex-float .fb-calc{background:var(--ex-teal)}.ex-float .fb-paint{background:var(--ex-green)}
.ex-float svg{width:54px;height:54px}

.gtitle{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;margin-bottom:12px}
.gbadge{background:var(--ex-badge);color:#fff;border-radius:4px;padding:2px 12px;font-weight:700;font-size:.92em;white-space:nowrap}
.gtitle .t{font-size:1.06em}
.gctx{white-space:pre-wrap;margin:6px 0 10px}
.tag{display:inline-block;border-radius:4px;color:#fff;font-weight:700;font-size:.85em;padding:2px 10px;margin:4px 0 2px}
.tag.type{background:var(--ex-blue)}.tag.stem{background:var(--ex-red)}
.item{padding:14px 0 18px;border-top:1px solid rgba(0,0,0,.07)}
.item:first-of-type{border-top:0}
.qline{display:flex;gap:14px;align-items:flex-start;margin:4px 0}
.qno{background:var(--ex-badge);color:#fff;border-radius:3px;min-width:1.9em;text-align:center;font-weight:700;line-height:1.75;flex:none}
.qtxt{white-space:pre-wrap;word-break:break-word}
.pct{margin:6px 0 0;display:flex;gap:10px;align-items:center}
.markbtn{background:#fff;border:1px solid #ccc;box-shadow:3px 3px 0 #aaa;padding:4px 14px;font-size:.88em;cursor:pointer;color:#666;font-family:inherit}
.markbtn.on{color:#e6a700;border-color:#e6a700;box-shadow:3px 3px 0 #e6a700}
.bl{display:inline-block;background:var(--ex-blank);border-bottom:2px solid #333;min-width:1.6em;padding:0 .35em;text-align:center;margin:0 .15em;line-height:1.5;color:#333}
.opts{display:flex;flex-direction:column;gap:12px;margin:12px 0 0}
.opts.row{flex-direction:row;gap:26px;flex-wrap:wrap}
.opt{display:flex;gap:8px;align-items:flex-start;cursor:pointer}
.opt input{width:1.15em;height:1.15em;margin-top:.3em;flex:none;cursor:pointer}
.opt b{font-weight:700}
.dtbl{border-collapse:collapse;margin:8px 0 12px;background:#fff;font-size:.92em;max-width:100%}
.dtbl caption{caption-side:top;text-align:left;font-weight:700;padding:2px 0 6px}
.dtbl th,.dtbl td{border:1px solid #999;padding:5px 12px;text-align:center}
.dtbl th{background:#f3f3f3}
.tblwrap{overflow-x:auto;max-width:100%}

/* 配合題 */
.pool{display:grid;grid-template-columns:repeat(auto-fill,minmax(9em,1fr));gap:18px;margin:22px 0 22px}
.tile{border:2px solid #333;background:transparent;text-align:center;padding:.55em .5em;cursor:grab;user-select:none;font-size:1em;font-family:inherit;line-height:1.4}
.tile.sel{background:#fff;outline:3px solid var(--ex-blue)}
.slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 40px}
.slot{display:grid;grid-template-columns:2.6em 1fr auto;gap:12px;align-items:center}
.slot>b{text-align:center;font-weight:700}
.sbox{min-height:2.4em;background:#f5f5f5;border:1px solid #ddd;border-radius:3px;padding:.35em .8em;cursor:pointer;display:flex;align-items:center}
.sbox.over{outline:3px dashed var(--ex-blue)}
.sbox.filled{min-height:3.6em}
.inp{background:#eee;border:1px solid #ccc;border-radius:3px;padding:.35em .7em;font-size:1em;min-height:2em;cursor:pointer;width:100%;font-family:inherit}
.inp:focus{outline:2px solid #66afe9;background:#fff}
.fillwrap{position:relative}
.unit{white-space:nowrap}
.calcbox{display:flex;gap:12px;align-items:center;margin-top:16px;max-width:900px}
.calcbox .fillwrap{flex:1}

/* 連連看 */
.cn{position:relative;background:#d3d3d3;padding:20px 50px;margin-top:16px;max-width:1040px;user-select:none}
.cn-grid{display:grid;gap:22px 0;position:relative;z-index:1}
.cn-card{background:#fff;min-height:7.5em;padding:.5em .7em;font-size:.82em;position:relative;margin:0 46px;line-height:1.5}
.cn-dot{position:absolute;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;background:#111;cursor:pointer;z-index:3;border:0;padding:0}
.cn-dot::after{content:"";position:absolute;inset:-10px}
.cn-dot.r{right:-24px}.cn-dot.l{left:-24px}
.cn-dot.sel{background:var(--ex-blue);box-shadow:0 0 0 4px rgba(51,122,183,.35)}
.cn svg{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.cn svg line{stroke:#111;stroke-width:2}
.cn svg line.hit{stroke:transparent;stroke-width:14;pointer-events:stroke;cursor:pointer}
.cn svg line.ok{stroke:#1f7a4d;stroke-width:3}.cn svg line.ng{stroke:#d9534f;stroke-width:3;stroke-dasharray:6 4}
.cn-tip{font-size:.8em;color:#666;margin-top:6px}

/* 排序 */
.ord h4{font-weight:400;margin:14px 0 6px;font-size:1em}
.ord .zone{background:#ececec;min-height:2.6em;padding:4px;display:flex;flex-direction:column;gap:2px}
.ord .zone.opts-z{background:#f2f2f2}
.ord .it{background:#fff;border:1px solid #ddd;padding:.3em .8em;cursor:grab;display:flex;gap:.6em;align-items:center}
.ord .it .k{color:#777;min-width:1.6em}
.ord .it.dragging{opacity:.4}
.ord .zone.over{outline:2px dashed var(--ex-blue)}

/* 練習模式：對答案 */
.gcheck{margin-top:18px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.res{border-radius:4px;padding:8px 12px;margin-top:8px;font-size:.92em;line-height:1.7}
.res.ok{background:#e3f4e8;border:1px solid #9fd3ad}
.res.ng{background:#fde8e7;border:1px solid #f0b4b0}
.res.part{background:#fff4d6;border:1px solid #f0d58a}
.res .h{font-weight:700}
.res .exp{margin-top:4px;color:#333;white-space:pre-wrap}
.opt.right{color:#1f7a4d;font-weight:700}.opt.wrong{color:#c9302c;text-decoration:line-through}
.locked .tile,.locked .sbox,.locked .inp,.locked .ord .it{cursor:default}

/* 作答總覽／對話框 */
#sk-modal{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
.dlg{background:#fff;border-radius:6px;max-width:760px;width:100%;max-height:90vh;overflow:auto;box-shadow:0 10px 40px rgba(0,0,0,.3);font-family:"Microsoft JhengHei","Noto Sans TC",sans-serif}
.dlg h3{margin:0;padding:14px 20px;border-bottom:1px solid #e5e5e5;font-size:20px}
.dlg .bd{padding:18px 20px;font-size:17px}
.dlg .ft{padding:12px 20px;border-top:1px solid #e5e5e5;display:flex;justify-content:flex-end;gap:10px}
.ovw{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.ovw button{border:1px solid #ccc;background:#f7f7f7;padding:10px 6px;cursor:pointer;font-size:16px;line-height:1.4;position:relative;font-family:inherit}
.ovw button.done{background:#dff0d8;border-color:#9fcf8f}
.ovw button.part{background:#fcf8e3;border-color:#e8d48b}
.ovw button .m{position:absolute;top:2px;right:6px;color:#e6a700}
.ovw button.cur{outline:3px solid var(--ex-blue)}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;color:#666;margin-top:14px}
.legend i{display:inline-block;width:14px;height:14px;border:1px solid #ccc;vertical-align:-2px;margin-right:4px}

/* 工具視窗：計算機、小畫家 */
.tw{position:fixed;z-index:70;font-family:"Microsoft JhengHei","Noto Sans TC",sans-serif}
.tw-h{display:flex;justify-content:space-between;align-items:center;padding:0 0 6px}
.tw-h button{width:36px;height:36px;border:2px solid #2c6fbb;border-radius:4px;background:#fff;color:#2c6fbb;cursor:pointer;display:grid;place-items:center;padding:0}
.tw-h .mv{cursor:move;border-color:#333;color:#333}
.tw-h svg{width:22px;height:22px}
.calc-wrap{display:flex;gap:10px}
.stash{width:225px;background:#fff;border-radius:6px;padding:10px 10px 12px;box-shadow:0 2px 10px rgba(0,0,0,.15);font-size:14px}
.stash .t{font-weight:700}.stash .t small{color:#888;font-weight:400;font-size:12px}
.stash ol{list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:5px}
.stash li{display:flex;gap:8px;align-items:center;color:#888;font-size:12px}
.stash li span{flex:1;border:1px dashed #ccc;border-radius:4px;text-align:center;padding:2px 4px;color:#bbb;cursor:pointer;min-height:24px;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stash li span.v{color:#222;border-style:solid;border-color:#aaa;background:#fafafa}
.stash .clr{width:100%;border:1px solid #d9534f;color:#d9534f;background:#fff;border-radius:4px;padding:3px;cursor:pointer;font-size:13px}
.calc{width:340px;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 2px 14px rgba(0,0,0,.25)}
.calc .disp{background:#222;color:#fff;padding:10px 16px 8px;text-align:right;min-height:118px;display:flex;flex-direction:column;justify-content:flex-end}
.calc .disp .ex1{font-size:15px;color:#aaa;min-height:22px;word-break:break-all}
.calc .disp .v{font-size:34px;font-weight:700;word-break:break-all;line-height:1.3}
.calc .keys{display:grid;grid-template-columns:repeat(7,1fr);gap:4px 0;padding:10px 6px}
.calc .keys button{border:0;background:none;height:56px;font-size:20px;cursor:pointer;color:#333;border-radius:28px;font-family:inherit}
.calc .keys button:hover{background:#f1f1f1}
.calc .keys .op{color:#19b48c;font-size:24px}
.calc .keys .del{background:#e5463f;color:#fff;border-radius:50%;width:52px;height:52px;margin:auto}
.calc .keys .eq{background:var(--ex-mint);color:#fff;grid-column:span 2;font-size:26px}
.calc .keys .eq:hover{background:#2fc79f}
.calc .save{display:block;width:100%;border:0;background:var(--ex-mint);color:#fff;font-weight:700;padding:11px;font-size:15px;cursor:pointer;font-family:inherit}
.paint{background:#e8e8e8;padding:8px;box-shadow:0 2px 14px rgba(0,0,0,.25);border-radius:4px;resize:both;overflow:hidden;width:560px;height:470px;min-width:320px;min-height:260px;display:flex;flex-direction:column}
.paint .tools{display:flex;gap:6px;align-items:center;padding:6px;background:#fff;border:1px solid #ddd;margin-bottom:6px;flex-wrap:wrap}
.paint .tools button{width:34px;height:30px;border:1px solid #ccc;background:#fff;cursor:pointer;border-radius:3px;font-size:16px}
.paint .tools button.on{background:#dbe9f7;border-color:#2c6fbb}
.paint .tools input[type=color]{width:34px;height:30px;border:0;padding:0;background:none;cursor:pointer}
.paint .cv{flex:1;background:#fff;border:1px solid #ddd;position:relative;min-height:0}
.paint canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}
.tw.min .paint{height:auto!important;resize:none}
.tw.min .paint .cv,.tw.min .paint .tools{display:none}

/* 成績頁 */
.score-hero{display:flex;gap:28px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px 28px}
.score-hero .big{font-size:64px;font-weight:900;line-height:1}
.score-hero .big small{font-size:22px;font-weight:700;margin-left:4px}
.score-hero .verdict{font-size:22px;font-weight:900}
.rv{margin:26px 0}
.rv .g{background:#fff;border:1px solid var(--line);border-radius:10px;margin:16px 0;overflow:hidden}
.rv .g>.h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;background:#faf9f6;border-bottom:1px solid var(--line);flex-wrap:wrap}
.rv .g>.h b{font-size:17px}
.rv .g .bd{padding:6px 18px 14px}
.rv .it{padding:12px 0;border-bottom:1px dashed var(--line)}
.rv .it:last-child{border-bottom:0}
.rv .q{white-space:pre-wrap}
.rv .row{display:grid;grid-template-columns:5.5em 1fr;gap:4px 10px;font-size:15px;margin-top:6px}
.rv .row dt{color:var(--muted)}
.rv .row dd{margin:0}
.rv .exp{background:#f6f8fb;border-left:3px solid #9bb7d6;padding:8px 12px;margin-top:8px;font-size:15px;white-space:pre-wrap}
.pts{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
.pts.ok{color:var(--ok)}.pts.ng{color:var(--bad)}.pts.part{color:#b07800}
.bl-r{display:inline-block;border-bottom:1.5px solid #333;padding:0 .3em;min-width:1.4em;text-align:center;background:#eef7e2;margin:0 .1em}

.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:#222;color:#fff;padding:10px 18px;border-radius:6px;z-index:200;font-size:15px}

@media (max-width:900px){
  .ex-head{grid-template-columns:1fr;padding:10px 14px}
  .ex-info{grid-template-columns:auto 1fr;font-size:16px}
  .ex-seat,.ex-seat b{font-size:22px}
  .ex-bar{padding:10px 14px;font-size:16px}
  .xb{font-size:15px;padding:6px 10px}
  .ex-main{padding:16px 14px 80px}
  .ex-bar{padding:10px 14px}
  .ex-float{top:auto;bottom:12px;right:8px;flex-direction:row}
  .ex-float button{width:56px;height:56px}
  .ex-float svg{width:34px;height:34px}
  .slots{grid-template-columns:1fr}
  .cn{padding:12px 8px}
  .cn-card{margin:0 26px;min-height:5em}
  .cn-dot.r{right:-21px}.cn-dot.l{left:-21px}
  .calc-wrap{flex-direction:column-reverse}
  .stash{width:340px}.stash ol{display:grid;grid-template-columns:1fr 1fr}
  .calc{width:min(340px,92vw)}
  .paint{width:94vw;height:60vh}
  .lg-card{padding:36px 20px 28px}
  .lg-row{grid-template-columns:80px 1fr}
  .lg-hint{margin-left:90px}
  .ovw{grid-template-columns:repeat(5,1fr)}
}
@media print{.ex-float,.ex-bar,.ex-toggle{display:none}}

/* 購買方案、兌換碼 */
.pkgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:6px 0}
.pkg{display:flex;flex-direction:column;gap:2px;align-items:flex-start;text-align:left;border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px 14px;cursor:pointer;font:inherit}
.pkg:hover{border-color:var(--red);box-shadow:0 0 0 2px var(--red-l)}
.pkg b{font-size:16px}.pkg .pr{font-size:22px;font-weight:900;color:var(--red)}.pkg small{color:var(--muted);font-size:13px}
.code-in{flex:1;min-width:180px;border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:17px;letter-spacing:.08em;text-transform:uppercase}
.res .exp,.rv .exp{white-space:pre-wrap}
.qimg{margin:10px 0;max-width:min(560px,100%)}
.qimg img{max-width:100%;border:1px solid #ccc;background:#fff}
.imgnote{font-size:12px;color:#8a8a8a;margin:10px 0 0}
.cn-card .oimg{display:block;max-width:100%;max-height:150px;margin:0 auto 4px;border:1px solid #ccc;background:#fff}
.opt .oimg{max-width:280px;border:1px solid #ccc;background:#fff;display:block;margin-top:4px}
