:root{font-family:ui-rounded,'Noto Sans TC',system-ui,-apple-system,sans-serif;color:#213f3d;background:#102f31;--ink:#213f3d;--cream:#f3efd9;--mint:#b8d6b4;--gold:#eabc64}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 70% 20%,#31584b 0,transparent 52%),repeating-linear-gradient(120deg,transparent 0 84px,#ffffff02 85px 86px),#102f31;display:flex;justify-content:center;align-items:flex-start;gap:64px;padding:28px 20px}button{font:inherit;font-size:14px;cursor:pointer;border:1px solid #b8c4a8;border-radius:10px;background:#faf8e9;color:var(--ink);font-weight:700;padding:10px 12px;touch-action:manipulation;transition:background .15s,transform .15s}button:hover{background:#e5eaca}button:active{transform:translateY(1px)}button:focus-visible{outline:3px solid #d5863c;outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}.game{width:520px;max-width:100%;background:var(--cream);border:1px solid #ffffff30;border-radius:20px;overflow:hidden;box-shadow:0 30px 90px #0005}header{display:flex;justify-content:space-between;align-items:center;padding:17px 22px 13px}.brand{display:flex;gap:10px;align-items:center}.sigil{font-size:44px;color:#a97834;line-height:1}h1{font-size:25px;letter-spacing:3px;margin:0}.brand small{font-size:9px;letter-spacing:2.2px;font-weight:800}nav{display:flex;gap:5px}nav button{padding:4px;width:34px;height:34px;font-size:20px;background:transparent}.status{padding:0 22px 13px;display:flex;justify-content:space-between;font-size:13px;font-weight:750;align-items:center}.coins{color:#846329;font-size:18px}.battle{position:relative;background:#6b9074;overflow:hidden}canvas{display:block;width:100%;height:auto}.chapter{position:absolute;left:18px;right:18px;top:12px;display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px;color:#edf0d8;text-shadow:0 1px 2px #16382c}.chapter small{font-size:11px;letter-spacing:0}.banner{position:absolute;bottom:37px;left:10%;right:10%;text-align:center;color:#fff9db;font-size:13px;font-weight:700;text-shadow:0 2px 3px #102f31}.wall{height:34px;background:#d4c7a4;display:flex;align-items:center;gap:10px;padding:0 17px;box-shadow:inset 0 5px #eae2bd,inset 0 -3px #b4a781;font-size:11px;font-weight:800}.wall>div{height:9px;flex:1;border-radius:5px;background:#9c9d7f;overflow:hidden}.wall i{display:block;background:#4e9877;width:100%;height:100%;transition:width .2s}.wall b{min-width:28px;text-align:right}.workshop{padding:15px 20px 13px}.board-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.eyebrow{font-size:9px;letter-spacing:2px;color:#8b916f;font-weight:800}h2{margin:0;font-size:18px;letter-spacing:2px}.board-heading>span{font-size:12px;border:1px solid #b6c29f;padding:5px 10px;border-radius:20px}.board-wrap{position:relative;background:#dfddc4;border-radius:14px;border:1px solid #c4c8ac;box-shadow:inset 0 3px 10px #213f3d0e}#board{display:block;width:100%;max-height:350px;touch-action:none;user-select:none}#toast{position:absolute;left:8%;right:8%;bottom:10px;background:#213f3ded;color:#fff8da;padding:10px;text-align:center;border-radius:8px;font-size:13px;pointer-events:none;opacity:0;transition:opacity .2s}#toast.show{opacity:1}#hint{font-size:12px;min-height:19px;margin:9px 0;color:#637259}.tools{display:flex;gap:6px;margin-bottom:10px}.tools button{flex:1;font-size:12px;padding:8px 3px}kbd{font:inherit;font-size:10px;opacity:.6}.shop{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.shop button{padding:6px 2px 9px;position:relative;border:1.5px solid #c4c8ac;background:#f8f5df}.shop button.active{border-color:#487b66;background:#e0ead1;box-shadow:0 0 0 2px #487b6620}.shop svg{width:52px;height:49px;display:block;margin:auto}.shop strong{display:block;font-size:13px}.shop small{font-size:11px;display:block;margin-top:4px;color:#6f795d}.selected-info{font-size:12px;color:#596c56;line-height:1.5;min-height:39px;padding-top:9px}.bottom{display:flex;gap:8px;margin-top:7px}.bottom>button{padding:13px 10px;font-size:13px}.primary{background:#264f45;color:#fff5cf;border-color:#264f45;flex:1;text-align:left;display:flex;justify-content:space-between;align-items:center}.primary:hover{background:#356552}.primary span{font-size:22px;line-height:10px}.footer{display:flex;justify-content:space-between;font-size:10px;color:#859074;margin-top:12px}.desktop-note{color:#e4e8cb;width:220px;margin-top:130px}.note-mark{font-size:78px;color:#d8b169}.desktop-note h2{font-size:42px;letter-spacing:5px;line-height:1.5;margin:20px 0}.desktop-note p{color:#afc4ad;line-height:2;font-size:15px;letter-spacing:2px}.note-line{width:45px;height:2px;background:#c6a55e;margin:35px 0}.desktop-note small{font-size:11px;color:#8faa98;line-height:2;letter-spacing:2px}dialog{border:1px solid #bcc6aa;border-radius:18px;max-width:min(440px,92vw);background:#f5f0d9;color:var(--ink);padding:27px;box-shadow:0 20px 90px #0007}dialog::backdrop{background:#102a2cd9;backdrop-filter:blur(4px)}dialog h2{font-size:24px;margin-bottom:15px}dialog p,dialog li{font-size:14px;line-height:1.8}dialog ul{padding-left:20px}dialog button{margin:5px 5px 0 0}dialog .primary{display:inline-block;text-align:center}dialog .big-mark{font-size:54px;color:#b48a39}.setting-row{display:flex;justify-content:space-between;align-items:center;margin:15px 0;font-size:14px}input[type=checkbox]{width:20px;height:20px}.danger{color:#a44933}.star-row{color:#c08c32;font-size:30px;letter-spacing:10px}@media(min-width:1100px){body{padding-top:25px}.game{width:490px}.workshop{padding:12px 19px}#board{max-height:310px}.battle canvas{max-height:235px}header{padding-top:14px}.selected-info{min-height:34px}.shop svg{height:44px}.desktop-note{margin-top:120px}}@media(max-width:800px){body{padding:0;display:block;background:#f3efd9}.desktop-note{display:none}.game{width:520px;margin:auto;border:0;border-radius:0;box-shadow:none}header{padding:13px 17px 11px}.status{padding:0 17px 10px}.workshop{padding:12px 13px 14px}#board{max-height:315px}.battle canvas{max-height:240px}.shop svg{height:43px}.footer{font-size:10px}.selected-info{font-size:12px}.tools button{min-height:35px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
