:root{color-scheme:dark;font:14px/1.5 system-ui,-apple-system,"Noto Sans TC","Microsoft JhengHei",sans-serif}
*{box-sizing:border-box}body{--bg:#081f1c;--surface:#10372f;--surface2:#17453b;--line:#397568;--ink:#f1faf4;--muted:#b1d1c4;--orange:#ff9835;--amber:#f6b45d;--warning:#ffb88e;min-height:100vh;margin:0;color:var(--ink);background:radial-gradient(ellipse at 80% -20%,#245342 0,transparent 58%),var(--bg)}button,a{font:inherit}a{color:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffe0a0;outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.5}
.sitebar{display:flex;gap:14px;justify-content:space-between;align-items:center;padding:10px clamp(16px,2vw,32px);background:linear-gradient(105deg,#0c4b3f,#1e483d 72%,#805024);border-bottom:1px solid #78a79366}
.brand{display:flex;gap:12px;align-items:center;text-decoration:none}.logo{background:#ff922f;color:#14281c;padding:11px 7px;border-radius:8px;font-weight:900;letter-spacing:-.04em}.brand strong{display:block;font-size:21px}.brand small{display:block;font-size:11px;color:#c4e6d7}.sitebar nav{display:flex;gap:14px;align-items:center}.sitebar nav a{padding:7px 10px;border:1px solid #8bac9b;border-radius:7px;text-decoration:none;white-space:nowrap;font-size:12px}.demo-mark{color:#f8d9af;font-size:12px}
main{max-width:1100px;margin:auto;padding:28px clamp(12px,2.5vw,28px) 35px}.head{margin:0 0 19px}.eyebrow,.step-tag{color:var(--orange);font-weight:850;letter-spacing:.06em;font-size:12px}.head h1{font-size:clamp(25px,3.5vw,39px);margin:8px 0 7px;line-height:1.3}.head p{color:var(--muted);margin:0;font-size:14px}.state-note{display:flex;align-items:center;gap:11px;background:#154338;border:1px solid var(--line);padding:10px 15px;border-radius:10px;margin:0 0 20px;font-weight:800}.status-indicator{width:10px;height:10px;background:#ffb044;border-radius:50%;box-shadow:0 0 0 4px #ff9b3031}.demo-chip{margin-left:auto;font-size:11px;color:#f8d09e;font-weight:600}
.stage{background:linear-gradient(145deg,#10352e,#0e2a27);border:1px solid var(--line);border-radius:18px;padding:clamp(20px,3vw,32px);box-shadow:0 18px 50px #0004}.stage[hidden]{display:none!important}.stage h2{font-size:clamp(22px,2.8vw,31px);line-height:1.3;margin:9px 0}.stage>p{color:var(--muted);font-size:14px;margin:8px 0 18px}.stage-icon{width:57px;height:57px;border-radius:16px;display:grid;place-items:center;background:#245c48;border:1px solid #6da48e;margin-bottom:12px}.stage-icon svg{fill:none;stroke:#ffb056;stroke-width:1.8;width:30px;height:30px}.login-status{background:#0d2a25;border:1px solid #326d5b;padding:13px 17px;border-radius:9px;max-width:520px;margin:22px 0;color:var(--muted)}.login-status strong{color:#ffc178}.btn-row{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin:19px 0 5px}.cta,.secondary,.quiet{min-height:45px;border-radius:10px;padding:11px 18px;font-weight:800}.cta{color:#212619;background:linear-gradient(115deg,#ffb449,#ff8b29);border:1px solid #ffc27b;box-shadow:0 5px 17px #f68b282b}.cta:hover{background:linear-gradient(115deg,#ffd18b,#ff9b3e)}.secondary{color:#f5faf2;border:1px solid var(--orange);background:#143d32}.quiet{color:var(--muted);background:transparent;border:1px solid #427965;padding:9px 13px;min-height:39px}.disclaimer{display:block;color:#a6c9bd;font-size:12px;margin-top:19px;line-height:1.7}
.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;margin:22px 0}.mode-card{display:flex;flex-direction:column;gap:8px;min-height:290px;padding:22px;border:1px solid #538375;border-radius:15px;background:#153f36}.mode-card.featured{border-color:var(--orange);background:linear-gradient(145deg,#1a493e,#453a24)}.mode-card .mode-symbol{font-size:25px;color:var(--orange)}.mode-card .overline{color:#e4bc7a;font-size:11px;font-weight:800}.mode-card h3{font-size:22px;margin:0}.mode-card .minor{font-size:12px;color:#f4b85d}.mode-card p{color:var(--muted);font-size:13px;line-height:1.65;margin:2px 0 19px}.mode-card button{margin-top:auto;width:100%}
.stage-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.topic-panel{margin-top:15px}.topic-label{font-size:14px;font-weight:800;margin:16px 0 8px}.muted{font-weight:500;color:var(--muted);font-size:12px}.group-options{display:flex;flex-wrap:wrap;gap:8px}.group-options label{cursor:pointer;border:1px solid #4e7d6b;border-radius:9px;padding:12px 15px;background:#153f36;display:flex;align-items:center;gap:10px;min-width:168px}.group-options label:has(input:checked){border-color:#ffa044;background:#224a3b}.group-options input{accent-color:#ff9e40}
.board-choices{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:7px}.board-choices label{cursor:pointer;display:flex;align-items:center;justify-content:center;min-height:56px;border-radius:9px;border:1px solid #55796a;background:#163e34;font-weight:900;font-size:17px}.board-choices label:has(input:checked){background:#ff9b39;color:#22291c;border-color:#ffcb7c}.board-choices label:has(input:focus-visible){outline:3px solid #ffde9b;outline-offset:2px}.board-choices input{position:absolute;opacity:0;pointer-events:none}
.bonus-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.bonus-grid label{border:1px solid #527d6b;border-radius:9px;padding:9px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px}.bonus-grid select{background:#0f3029;color:#e5f7eb;border-radius:7px;min-width:74px;min-height:40px;border:1px solid #6d957c;padding:7px}.bonus-heading{margin-top:24px!important}.caption{margin-top:10px;font-size:12px;line-height:1.65}.topic-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin-top:20px}.topic-actions .error{color:#ffbea2;font-weight:700;font-size:12px}.draw-idle{text-align:center;border:1px dashed #6a8e78;border-radius:12px;padding:20px;margin-top:19px;background:#163e35}.draw-idle h3{margin:5px 0}.draw-idle p{color:var(--muted)}.lottery-icon{font-size:35px;color:#ffab45}.drawn-content{margin-top:19px;border:1px solid var(--orange);background:#17392f;border-radius:11px;padding:18px}.drawn-content[hidden]{display:none}.drawn-content p{color:var(--muted);font-size:13px}.drawn-header{display:flex;align-items:center;justify-content:space-between;gap:8px}.running-label{font-size:12px;color:#f7d2a6}.running-label b{font-size:21px;font-variant-numeric:tabular-nums;color:#ffbb60}.drawn-boardlist{display:flex;flex-wrap:wrap;gap:8px;margin:13px 0}.drawn-boardlist span{border:1px solid #ffc47e;color:#ffc47e;border-radius:8px;padding:10px 15px;font-size:17px;font-weight:900}.drawn-points{color:#e2d7b3;font-size:13px}
.confirmed-summary{background:#153e34;border:1px solid #578570;border-radius:13px;padding:18px;margin:18px 0}.confirmed-summary h3{color:#ffb351;font-size:19px;margin:0 0 8px}.confirmed-summary p{margin:7px 0;color:#e4f5ee}.confirmed-summary span{color:#c4e3d2}.timing-note{border-left:3px solid #fa942e;background:#223d32;padding:12px 15px;border-radius:7px;line-height:1.7;font-size:13px;color:#ffe3bb}
footer{margin-top:20px;border-top:1px solid #3d6f60;padding:16px 8px;color:#aacabd;font-size:12px;line-height:1.7}footer strong{color:#fed49d}
@media(max-width:730px){.sitebar{flex-wrap:wrap}.demo-mark{display:none}main{padding:18px 12px 28px}.mode-grid{grid-template-columns:1fr}.mode-card{min-height:240px}.board-choices{grid-template-columns:repeat(5,minmax(0,1fr))}.bonus-grid{grid-template-columns:1fr}.stage-head{align-items:flex-start}.state-note{flex-wrap:wrap}.demo-chip{margin-left:0}}
@media(max-width:450px){.sitebar nav{width:100%;justify-content:flex-end}.sitebar .brand strong{font-size:18px}.head p{font-size:13px}.stage{padding:19px 15px}.group-options label{width:100%}.board-choices{grid-template-columns:repeat(3,minmax(0,1fr))}.board-choices label{min-height:48px}.stage-head{flex-wrap:wrap}.btn-row>button{width:100%}.drawn-header{align-items:flex-start;flex-direction:column}.topic-actions .cta{width:100%}}