:root{color-scheme:light;--bg:#f1f3ef;--panel:#fff;--ink:#22352f;--muted:#65756d;--line:#dbe2da;--accent:#24745d}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 system-ui,sans-serif}body.dark{color-scheme:dark;--bg:#17231f;--panel:#24342d;--ink:#edf2eb;--muted:#b7c8bd;--line:#46584d;--accent:#87c9ac}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:8px 12px;border-radius:7px}button:hover{border-color:var(--accent)}button:focus-visible,a:focus-visible{outline:3px solid #68b5a1}input,select,textarea{width:100%;padding:8px;border:1px solid var(--line);border-radius:5px;background:var(--panel);color:var(--ink)}textarea{resize:vertical}label{display:block;color:var(--muted);font-size:12px;margin:8px 0}h1,h2,p{margin:0 0 10px}h2{font-size:14px}h1{font:34px KaiTi,STKaiti,serif;margin-top:16px}h1 span{font:24px system-ui;color:var(--muted)}.app-header{padding:26px 36px;border-bottom:1px solid var(--line)}.app-header a{font-size:11px;letter-spacing:2px;color:var(--accent);text-decoration:none}#theme{float:right}.workspace{display:grid;grid-template-columns:300px 1fr;gap:28px;padding:28px;max-width:1800px;margin:auto}aside{background:var(--panel);padding:22px;border:1px solid var(--line);border-radius:12px}aside h2:not(:first-child){margin-top:26px}.pair,.buttons{display:flex;gap:8px;align-items:end}.pair>*{flex:1;min-width:0}.buttons{flex-wrap:wrap}.buttons button{font-size:12px;padding:6px}.check{display:flex;align-items:center;gap:8px}.check input{width:auto}.primary{width:100%;background:var(--accent);color:var(--bg);margin-top:12px}.preview-bar,.print-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.preview-bar p{color:var(--muted);font-size:12px}.print-bar{justify-content:flex-start;flex-wrap:wrap}.print-bar label{margin:0}.tabs{display:flex;gap:5px;margin:16px 0}#pages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}.sheet{background:white;color:#18251e;padding:24px;box-shadow:0 4px 18px #142d1810;min-width:0}.sheet h2{font:22px KaiTi,STKaiti,serif}.sheet .meta{display:flex;justify-content:space-between;font-size:11px;margin:16px 0}.sheet .instruction{font-size:11px}.word-bank{border:1px solid #7a8c7e;padding:10px;margin:14px 0;font:15px KaiTi,STKaiti,serif}.word-bank span{display:inline-block;margin-right:12px}.word-bank small{font:10px system-ui}.word-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 10px}.word{display:flex;flex-wrap:wrap;align-content:start;break-inside:avoid;gap:2px}.char{width:calc((100% - 4px)/3);min-width:30px;max-width:58px;position:relative}.pinyin{display:block;text-align:center;width:100%;padding:2px 0;font-size:10px;border:1px solid #b1c9b5;border-bottom:0;border-radius:0;color:#283e30;background:#f6faf5;min-height:20px}.glyph{display:block;width:100%;height:auto;border:1px solid #9ab69d;background:#fff}.guides{stroke:#a8c9aa;stroke-width:8;stroke-dasharray:20 18;fill:none}.stroke{fill:#171717}.stroke.missing{fill:transparent;pointer-events:all}.hint .stroke.missing{fill:#ededed}.key .stroke.missing{fill:#c62828}.badge{font-size:9px;color:#a34c13;display:block}.sheet footer{margin-top:22px;font-size:9px;color:#718071;text-align:center}.key{display:none}#pages[data-view=keys] .sheet{display:none}#pages[data-view=keys] .key{display:block}#pages[data-view=A] .sheet[data-version=B],#pages[data-view=B] .sheet[data-version=A]{display:none}#pages[data-view=A],#pages[data-view=B]{grid-template-columns:minmax(0,740px)}dialog{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:12px;max-width:440px}dialog::backdrop{background:#0008}#editGlyph{width:260px;margin:auto}#editGlyph .missing{fill:#dedede}#status{font-size:12px;margin-top:12px;white-space:pre-wrap}#board{position:fixed;inset:0;background:var(--bg);z-index:10;padding:12px;overflow:hidden}#board[hidden]{display:none}.board-controls{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.board-controls button{padding:6px;font-size:12px}.board-controls label{margin:0;max-width:120px}#winner{text-align:center;height:24px;margin:6px}.teams{display:grid;grid-template-columns:1fr 1fr;gap:14px;height:calc(100% - 100px)}.team{border:2px solid var(--team-color);border-radius:12px;min-height:0;padding:12px;display:flex;flex-direction:column;overflow:hidden}.team-heading{display:flex;gap:8px;align-items:center}.team-heading input[type=color]{width:45px;padding:2px}.team-heading output{font-size:28px;min-width:40px}.roster{display:flex;flex-wrap:wrap;gap:5px;overflow:auto;max-height:28%;padding:10px 0}.roster button{font:22px KaiTi,serif;padding:6px}.roster button.done{background:var(--team-color);color:white}.roster button.given{border-style:dashed;color:var(--muted)}.pad-area{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;gap:5px}.pad{position:relative;aspect-ratio:1;max-width:100%;height:calc(100% - 80px);min-height:100px;touch-action:none}.pad>svg{width:100%;height:100%}.ink{position:absolute;inset:0;touch-action:none}.ink polyline{fill:none;stroke:var(--team-color);stroke-width:22;stroke-linecap:round;stroke-linejoin:round}.ink polyline.wrong{stroke:#e33;animation:fade .6s forwards}.pad .completed{fill:var(--team-color)}.pad .next-hint{fill:var(--team-color);animation:pulse 1s 3}.pad-actions{display:flex;gap:5px;flex-wrap:wrap}.inactive{opacity:.45;pointer-events:none}.no-pinyin .board-pinyin{visibility:hidden}.animation{position:absolute;inset:0;background:white;pointer-events:none}.animation svg{max-width:100%;height:100%}@keyframes fade{to{opacity:0}}@keyframes pulse{50%{opacity:.15}}@media(max-width:1100px){.workspace{grid-template-columns:270px 1fr;padding:16px;gap:16px}#pages{grid-template-columns:1fr}.sheet{padding:24px}}@media(max-width:700px){.workspace{display:block}.preview{margin-top:20px}.app-header{padding:20px}.word-grid{gap:15px 8px}.sheet{padding:15px}.teams{gap:6px}.team{padding:5px}.board-controls{max-height:100px;overflow:auto}.teams{height:calc(100% - 135px)}}@media print{*{-webkit-print-color-adjust:exact;print-color-adjust:exact}body{background:white!important}.app-header,aside,.preview-bar,.print-bar,.tabs,dialog,#board{display:none!important}.workspace{display:block;padding:0;margin:0;max-width:none}.preview,#pages{display:block!important}.sheet{display:flex!important;flex-direction:column;box-shadow:none;margin:0;padding:0;width:100%;height:var(--page-height);break-after:page;overflow:hidden}.sheet:last-child{break-after:auto}.sheet.print-hidden{display:none!important}.sheet footer{margin-top:auto;padding-top:5mm}.word-grid{gap:5mm 3mm}.char{width:14mm;min-width:0;max-width:14mm}.pinyin{font-size:10pt;height:7mm}.sheet h2{font-size:19pt}.sheet .instruction{font-size:9pt}.word-bank{font-size:13pt}.badge{display:none}.key .stroke.missing{fill:#c62828!important}.sheet .stroke.missing{fill:transparent}.sheet.hint .stroke.missing{fill:#ededed}.sheet.key .stroke.missing{fill:#c62828}.sheet .meta{font-size:10pt}.word{break-inside:avoid}.sheet .pinyin{border-radius:0}}
.ink .hint-trace{stroke:#e49d21;stroke-width:18;stroke-dasharray:1600;stroke-dashoffset:1600;animation:trace 1s linear 3}@keyframes trace{to{stroke-dashoffset:0}}
.badge{border:0;background:transparent;padding:1px 3px;line-height:1.2}.word{position:relative}.char .badge{min-width:20px}.sheet .word-bank{overflow-wrap:anywhere}

/* Match the shared Teacher Toolkit theme; worksheet paper stays white. */
:root{--bg:#fff9e9;--panel:#fffdf7;--ink:#193d38;--muted:#5d7168;--line:#e5ddc9;--accent:#194f45}
.missing-parts-page{font-family:'Nunito','Noto Sans SC',system-ui,sans-serif}
.app-header{padding:30px max(28px,calc((100vw - 1744px)/2));border-bottom:5px solid #f8c63f}
.app-header a{color:#fff1ba;font-weight:800;letter-spacing:.04em}
.app-header h1{font-family:KaiTi,STKaiti,'Kaiti SC',serif!important;font-size:36px!important}
.app-header h1 span{color:#fff1ba;font-size:25px}
.app-header #theme{border-color:#adc4ab;background:#fffdf7;color:#194f45;border-radius:999px}
aside{border-radius:20px;box-shadow:0 14px 30px #18423712;border-top:5px solid #f8c63f}
aside h2{color:var(--accent);font-weight:900}
button{font-weight:800;border-radius:12px}
.primary,#whiteboard{background:#f8c63f;color:#193d38;border-color:#e7a81f;box-shadow:0 3px 0 #dfb135}
#print{background:#194f45;color:#fffdf7;border-color:#194f45}
.tabs button{border-radius:999px}
.tabs button[aria-selected=true]{background:#194f45;color:#fffdf7;border-color:#194f45}
.sheet{border:1px solid #e5ddc9;border-radius:6px}
.sheet footer{background:transparent!important;color:#718071!important}
.sheet button.pinyin,.sheet button.badge{font-weight:400;border-radius:0}
#board{z-index:200;background:var(--bg)}
body.dark{background-image:none}
body.dark aside h2{color:#87c9ac}
body.dark input,body.dark textarea,body.dark select{border-color:#46584d!important;background:#24342d!important;color:#edf2eb}
body.dark .sheet button{color:#283e30}
@media(max-width:700px){.app-header{padding:24px 18px}.app-header h1{font-size:29px!important}.app-header h1 span{display:block;font-size:21px}.preview-bar{flex-wrap:wrap}}
@media print{.sheet{border:0;border-radius:0}html body.missing-parts-page{background:white!important;background-image:none!important;padding-top:0!important}.site-main-nav,.milk-tea-site-footer,.site-legal-footer{display:none!important}}
@media screen and (max-width:900px){.workspace{display:block}.workspace>.preview{margin-top:24px}.workspace>aside{max-width:none}.tabs{flex-wrap:wrap}.tabs button{white-space:nowrap}}

.team-heading{flex-wrap:wrap}.team-heading>input:not([type=color]){flex:1;min-width:100px;width:0}.score-controls{display:flex;align-items:center;gap:6px;flex-shrink:0}.score-controls button{min-width:44px;min-height:44px;padding:6px}.score-controls output{text-align:center}.team.inactive .team-heading{pointer-events:auto}

.next-question{align-self:flex-end;min-height:44px;margin-top:8px;border-color:var(--team-color);color:var(--team-color)}.next-question:disabled{opacity:.45;cursor:default}