:root{color-scheme:dark;--accent:#dabb79;--ink:#f4ead8;--panel:#10201fea;font-family:Georgia,"Songti TC","Noto Serif TC",serif;color:var(--ink);background:#132224}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;overflow:hidden}canvas{display:block;touch-action:none}button,a,select{-webkit-tap-highlight-color:transparent}button,select{font:14px/1.4 system-ui;border:1px solid #cbb88a59;border-radius:7px;background:#152725e8;color:var(--ink);min-height:44px;padding:10px 16px;cursor:pointer;transition:background .18s,border-color .18s}button:hover,select:hover{background:#34504a;border-color:var(--accent)}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.primary{background:var(--accent);color:#152724;border-color:var(--accent);font-weight:600}.primary:hover{background:#ebd9ac;color:#152724}.quiet{background:transparent}.text-button{border-color:transparent;background:transparent;padding:8px;font-size:12px}a{color:var(--accent);text-decoration:none;font:12px system-ui;min-height:32px;display:inline-flex;align-items:center}a:hover{text-decoration:underline}.overline{font:10px/1.6 system-ui;letter-spacing:2.3px;color:var(--accent)}#welcome{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:25px;background:linear-gradient(90deg,#10201fee,#10201f5c);overflow:auto}.welcome-card{width:min(590px,100%);padding:40px;background:#142623ef;border:1px solid #ae996950;border-radius:18px;box-shadow:0 30px 100px #0006}.welcome-card h1{font-size:33px;letter-spacing:3px;line-height:1.6;font-weight:400;margin:18px 0}.welcome-card #intro{font-size:18px;line-height:1.9;white-space:pre-line}.instructions{font:14px/1.9 system-ui;color:#c1cec4;border-top:1px solid #b59e6345;padding-top:18px}#loading{font:12px/1.7 system-ui;color:#d2c4a1}.welcome-card .primary{width:100%;margin:10px 0 22px}.welcome-card small{display:block;color:#95a99f;font:10px/1.8 system-ui}#hud header{position:fixed;top:26px;left:30px;padding:17px 22px;max-width:460px;border-left:1px solid var(--accent);background:linear-gradient(90deg,#132522dc,#13252200);pointer-events:none}header h1{font-size:31px;letter-spacing:7px;font-weight:400;margin:10px 0 5px}header p{font-size:13px;letter-spacing:4px;margin:0;color:#e3d8c0}.top-controls{position:fixed;top:28px;right:26px;display:flex;gap:8px;align-items:center}.quality-label{font:11px system-ui;display:flex;gap:6px;align-items:center}.mission{position:fixed;top:178px;left:30px;max-width:325px;background:#122421d4;border-radius:8px;padding:13px 16px;border:1px solid #bfaa7138}.mission p{font:13px/1.8 system-ui;margin:0 0 6px}.mission strong{font:12px system-ui;color:var(--accent)}.view-actions{position:fixed;right:26px;top:90px;display:flex;gap:8px}.view-actions button{font-size:12px;padding:8px 12px}#dock{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(0deg,#0c1d1bf5,#10211edb 85%,#10211e00);padding:35px 30px max(18px,env(safe-area-inset-bottom));z-index:3}#items{display:flex;gap:10px;justify-content:center;margin-bottom:13px}.letter-tab{padding:12px 22px;border-radius:8px;font:14px Georgia,serif;letter-spacing:1px}.letter-tab.done{color:#acd1b6;border-color:#86b59570}.letter-tab.done:after{content:' ✓'}.dock-bottom{display:flex;gap:16px;justify-content:center;align-items:center;flex-wrap:wrap}.dock-bottom #save-status{font:11px system-ui;color:#aabeb2}.dock-bottom .primary{min-height:36px;padding:8px 14px;font-size:12px}#touch{position:fixed;bottom:166px;right:24px;z-index:4;display:flex;gap:5px}#touch button{width:44px;padding:8px;background:#122421b8}#toast{position:fixed;bottom:185px;left:50%;transform:translate(-50%,10px);width:max-content;max-width:min(600px,90vw);padding:14px 22px;z-index:8;background:#e9dfc6;color:#263a33;border-radius:9px;font:14px/1.7 system-ui;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}#toast.show{opacity:1;transform:translate(-50%,0)}#paused{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:#12231fce;backdrop-filter:blur(5px)}#paused>div{text-align:center;padding:40px}#paused h2{font-size:32px;font-weight:400}#paused p{font-size:15px;margin-bottom:25px}dialog{color:#283a31;background:#eee6d4;width:min(620px,calc(100vw - 32px));max-height:calc(100dvh - 44px);border:1px solid #a68c60;border-radius:12px;padding:35px 40px 25px;box-shadow:0 25px 100px #0008;overflow:auto;overscroll-behavior:contain}dialog::backdrop{background:#071710b0;backdrop-filter:blur(4px)}dialog .overline{color:#776543;padding-right:25px}dialog h2{font-weight:400;font-size:27px;line-height:1.6;margin:15px 0 22px}#modal-body{white-space:pre-line;font-size:16px;line-height:1.95;margin-bottom:25px}#close-modal{position:absolute;top:10px;right:10px;font-size:26px;background:transparent;border:none;color:#4f5d4c;min-width:44px}#choices{display:grid;gap:9px}#choices button{background:#23463c;border-color:#23463c;color:#f4ead7;text-align:left;padding:12px 16px}#choices button:hover{background:#345e4d}#choices button.quiet{background:transparent;color:#455a4c;border-color:#a49b80}#choices .question{margin:0 0 5px;font:14px/1.8 system-ui;color:#56654f}#hint{color:#6d6149;margin-top:13px}#feedback{font:14px/1.8 system-ui;color:#5a654c;white-space:pre-line;border-left:2px solid #a89560;padding-left:12px;margin:18px 0 4px}#feedback:empty{display:none}#feedback.success{color:#295c43}#feedback.gentle{color:#886b36}
@media(max-width:800px){#hud header{left:14px;top:14px;padding:10px 12px;max-width:calc(100% - 28px)}header .overline{font-size:8px;letter-spacing:1px}header h1{font-size:24px;margin:5px 0;letter-spacing:4px}header p{font-size:11px}.top-controls{top:118px;left:14px;right:auto}.top-controls button,select{font-size:12px;padding:8px 12px}.view-actions{top:170px;left:14px;right:auto}.mission{top:224px;left:14px;max-width:260px;padding:9px 12px}.mission p{font-size:11px}.mission strong{font-size:11px}#dock{padding:20px 12px max(12px,env(safe-area-inset-bottom))}#items{gap:6px;display:grid;grid-template-columns:repeat(3,1fr)}.letter-tab{padding:9px 7px;font-size:11px;letter-spacing:0}.dock-bottom{gap:8px 14px}.dock-bottom #save-status{display:none}.dock-bottom a,.text-button{font-size:10px}#touch{bottom:144px;right:12px}#toast{bottom:199px;font-size:12px}dialog{padding:24px 23px 20px}dialog h2{font-size:23px;margin:12px 0 16px}#modal-body{font-size:15px;line-height:1.8}.welcome-card{padding:24px}.welcome-card h1{font-size:27px}.welcome-card #intro{font-size:16px}.welcome-card .instructions{font-size:13px}}
@media(max-height:600px) and (min-width:700px){.mission{top:145px;max-width:260px}.mission p{font-size:11px}header h1{font-size:25px}#hud header{top:10px}.welcome-card{padding:20px 28px}.welcome-card h1{font-size:25px;margin:10px 0}.welcome-card #intro{font-size:14px;line-height:1.5}.welcome-card .instructions{font-size:12px;padding-top:10px}.welcome-card .primary{margin:4px 0 10px}#dock{padding-top:20px}#touch{bottom:135px}}
#viewport{position:fixed;inset:0;overflow:hidden}#viewport canvas{width:100%!important;height:100%!important}#feedback.success:after{content:'收 訖';display:block;width:72px;margin:14px 0 0 auto;padding:10px 8px;text-align:center;border:2px solid #547d62;border-radius:50%;font:15px serif;transform:rotate(-12deg)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
