:root{color-scheme:light;--paper:#f8f7f2;--ink:#2e403a;--muted:#839087;--accent:#426851;--line:#e4e8de;--region-0:#edcfb4;--region-1:#c9dcd1;--region-2:#d7d0e9;--region-3:#bdd5e6;--region-4:#e8dba5;--region-5:#e7c5d1;--region-6:#bcd9d6;--region-7:#d7dcb6}
*{box-sizing:border-box}body{margin:0;background:#eaece5;color:var(--ink);font:14px/1.65 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}button,input{font:inherit}button{color:inherit;cursor:pointer;border:0;background:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #789c84;outline-offset:3px}button:hover:not(:disabled){filter:brightness(.97)}button:active:not(:disabled){transform:translateY(1px)}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}svg circle{fill:var(--paper)}.icon-library{position:absolute;width:0;height:0;overflow:hidden}img{object-fit:contain;user-select:none;pointer-events:none}h1,h2,h3,p{margin:0}button,a{-webkit-user-select:none;user-select:none}[hidden]{display:none!important}
.app-shell{width:100%;max-width:460px;min-height:100dvh;margin:auto;background:var(--paper);padding:max(12px,env(safe-area-inset-top)) 24px max(16px,env(safe-area-inset-bottom));box-shadow:0 0 90px #33483108}.topbar{display:flex;align-items:center;justify-content:space-between;height:48px;margin:0 -7px 20px}.icon-button{width:44px;height:44px;border-radius:50%;display:grid;place-items:center}.wordmark{display:flex;align-items:center;gap:8px;font-size:16px;letter-spacing:2px;font-weight:600}.game-heading{display:flex;align-items:center;justify-content:space-between;margin:0 2px 17px}.eyebrow{color:var(--muted);font-size:11px;letter-spacing:1px}.game-heading h1{font-size:28px;line-height:1.45;font-weight:600;letter-spacing:1px;margin-top:3px}.cat-counter{display:flex;align-items:center;gap:9px;padding:8px 13px;background:#ecefe6;border-radius:30px;font-size:14px;font-variant-numeric:tabular-nums}.rule-strip{display:flex;justify-content:center;gap:0;margin-bottom:23px;font-size:11px;color:#7d897f}.rule-strip span+span:before{content:'·';margin:0 12px;color:#b4bdb2}.board-wrap{width:100%;margin:0 auto}#board{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;aspect-ratio:1;background:#819082;border:2px solid #7c8c7d;border-radius:17px;overflow:hidden;box-shadow:0 5px 0 #334e3620}.cell{position:relative;display:flex;justify-content:center;align-items:center;min-width:0;min-height:0;aspect-ratio:1;padding:0;background:var(--tile);border-right:1px solid #60706838;border-bottom:1px solid #60706838;border-radius:0;isolation:isolate;line-height:1}.cell.region-right{border-right:2px solid #7c8c7d}.cell.region-bottom{border-bottom:2px solid #7c8c7d}.cell:active:not(:disabled){transform:none}.region-label{position:absolute;top:4px;left:4px;font-size:9px;color:#526657;display:none}.show-labels .region-label{display:block}.symbol{font-size:24px;color:#54715c;opacity:.4}.manual .symbol{opacity:.85}.cat .symbol{opacity:1;position:absolute;left:50%;top:50%;width:72%;height:72%;max-width:62px;max-height:62px;transform:translate(-50%,-46%)}.cat-avatar{display:block;width:100%;height:100%;object-fit:contain}.cell.proof-support:after,.cell.tutorial-source:after{content:'';position:absolute;inset:3px;border:2px dashed #456849;border-radius:5px;pointer-events:none}.cell.proof-target:after,.cell.tutorial-target:after{content:'';position:absolute;inset:3px;border:2px solid #30573d;border-radius:5px;pointer-events:none}.cell.error:after{content:'';position:absolute;inset:3px;border:2px solid #a3453a;border-radius:5px;pointer-events:none}.cell.tutorial-muted{background:color-mix(in srgb,var(--tile) 60%,var(--paper))}
.tool-switch{display:flex;gap:5px;padding:5px;background:#eceedf;border-radius:18px;margin-top:26px}.tool-switch button{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 4px;border-radius:13px;font-size:13px;color:#7c887a;transition:background .15s,color .15s}.tool-switch button.selected{background:var(--accent);color:#fff;box-shadow:0 2px 5px #24403115}.mark-icon{font-size:26px;line-height:25px;width:24px}.tool-switch .tutorial-tool{box-shadow:0 0 0 2px #729775 inset;color:#365740}.action-row{display:grid;grid-template-columns:1fr 1.55fr 1fr;gap:14px;margin-top:18px;align-items:center}.action-button{display:flex;justify-content:center;align-items:center;gap:7px;min-height:46px;color:#87917f;font-size:12px}.action-button svg{width:19px;height:19px}.hint-button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;background:#e9eddd;border:1px solid #dce4d1;border-radius:24px;color:#4a6849;font-size:13px}.hint-button svg{width:20px;height:20px}.notice{font-size:12px;color:#976251;text-align:center;min-height:20px;margin-top:10px}.continue-button{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;font-size:13px;color:var(--accent);min-height:44px}.continue-button svg{width:18px}
.coach,.hint-card{border:1px solid #dce4d1;background:#edf1e5;border-radius:15px;padding:13px 16px;margin-bottom:18px}.card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:5px}.card-top .eyebrow{font-size:10px}.text-button{color:var(--accent);font-size:12px;min-height:30px;padding:2px 0}.card-top .text-button{min-height:24px}.coach h2,.hint-card h2{font-size:16px;line-height:1.5;font-weight:600;margin-bottom:5px}.coach p,.hint-card p{font-size:12px;line-height:1.8;color:#64765c}.coach .small-copy{font-size:10px;color:#809078;margin-top:5px}.close-button{width:26px;height:26px;display:grid;place-items:center;padding:0}.close-button svg{width:15px;height:15px}.is-tutorial .rule-strip{display:none}.is-tutorial .board-wrap{max-width:300px}.is-tutorial .game-heading{margin-bottom:13px}.is-tutorial .tool-switch{margin-top:17px}.is-tutorial .action-row{margin-top:11px}.has-hint .board-wrap{max-width:320px}.has-hint .rule-strip{display:none}
dialog{color:var(--ink);background:var(--paper);border:0;padding:24px;box-shadow:0 20px 80px #1c35272e;overscroll-behavior:contain}dialog::backdrop{background:#22372e45;backdrop-filter:blur(3px)}.sheet{width:min(460px,calc(100% - 24px));max-height:85dvh;border-radius:24px;margin:auto}.sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.sheet-heading h2{font-size:21px;font-weight:600}.sheet-heading .eyebrow{margin-bottom:4px}.sheet-heading .icon-button{margin-right:-10px;flex-shrink:0}.level-group+.level-group{margin-top:18px}.level-group h3{font-size:11px;font-weight:400;color:var(--muted);margin-bottom:9px;letter-spacing:1px}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.level-grid button{position:relative;aspect-ratio:1;border-radius:14px;background:#eceedf;font-size:16px;min-width:0;font-variant-numeric:tabular-nums}.level-grid button.completed:after{content:'✓';position:absolute;bottom:3px;right:7px;font-size:9px;color:#70886c}.level-grid button.current{background:var(--accent);color:white}.level-grid button.current.completed:after{color:#d4e8cd}.setting{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}.setting small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.setting input{appearance:none;flex:0 0 auto;width:42px;height:25px;border-radius:20px;background:#d8dfd0;position:relative;cursor:pointer;margin:0}.setting input:checked{background:var(--accent)}.setting input:before{content:'';position:absolute;top:3px;left:3px;width:19px;height:19px;border-radius:50%;background:white;transition:transform .15s}.setting input:checked:before{transform:translateX(17px)}.setting input:disabled{opacity:.45;cursor:default}.how-to{margin:24px 0}.how-to h3{font-size:13px;font-weight:600;margin-bottom:10px}.how-to p{font-size:12px;color:#83907e;line-height:1.9;margin-top:6px}.secondary-button{width:100%;padding:12px;border:1px solid #dce3d3;border-radius:14px;font-size:13px}.lab-link{display:block;text-align:center;color:#84917d;text-decoration:none;font-size:12px;padding:18px 0 8px}.device-note{text-align:center;font-size:10px;color:#a4ada0;margin-top:10px}.win-dialog{width:min(360px,calc(100% - 40px));border-radius:26px;text-align:center;padding:34px 28px 24px}.win-close{position:absolute;top:8px;right:8px}.win-avatar{width:128px;height:128px;background:#e9eedf;border-radius:50%;display:grid;place-items:center;margin:0 auto 20px}.win-dialog h2{font-size:26px;font-weight:600;margin:6px 0 12px}.win-dialog p:not(.eyebrow){font-size:13px;color:var(--muted)}.primary-button{width:100%;display:flex;justify-content:center;align-items:center;gap:12px;border-radius:24px;background:var(--accent);color:white;min-height:48px;margin:26px 0 10px}
@media(min-width:640px){.app-shell{margin:24px auto;min-height:calc(100dvh - 48px);border:1px solid #dde2d5;border-radius:28px}.topbar{margin-bottom:16px}.board-wrap{max-width:360px}.tool-switch{margin-top:22px}}
@media(max-width:359px){.app-shell{padding-left:16px;padding-right:16px}.wordmark{font-size:15px}.topbar{margin-bottom:14px}.game-heading h1{font-size:25px}.cat-counter{padding:6px 9px;gap:6px}.rule-strip{font-size:10px;margin-bottom:18px}.rule-strip span+span:before{margin:0 8px}.action-row{gap:8px}.coach,.hint-card{padding:11px 13px}.coach h2{font-size:15px}.coach p{font-size:11px}.sheet{padding:20px}.is-tutorial .board-wrap{max-width:264px}}
.notice:empty{display:none}
@media(min-width:640px){.board-wrap{max-width:clamp(240px,calc(100dvh - 420px),360px)}.is-tutorial .board-wrap{max-width:clamp(224px,calc(100dvh - 500px),300px)}.has-hint .board-wrap{max-width:clamp(240px,calc(100dvh - 485px),320px)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}