:root{color:#263442;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#f5f0e7;font-family:PingFang TC,Microsoft JhengHei,system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0}html,body{overscroll-behavior:none;overflow:hidden}button{font:inherit;cursor:pointer}button:focus-visible{outline-offset:2px;outline:3px solid #397dbc}[hidden]{display:none!important}.app-shell{width:100%;height:100dvh;min-height:0;padding:max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));background:radial-gradient(circle at 14% 10%,#fffdf8 0,#f5f0e7 42%,#e8ddcc 100%);flex-direction:column;display:flex;overflow:hidden}.topbar{background:#fffdf8de;border:1px solid #e4d8c8;border-radius:16px;flex:0 0 50px;align-items:center;gap:12px;min-height:0;padding:0 10px;display:flex;box-shadow:0 4px 18px #5b462012}.game-topbar{z-index:5;position:relative}.tool-menu{z-index:10;background:#fffdf8;border:1px solid #d9c8ae;border-radius:14px;gap:6px;width:176px;padding:8px;display:grid;position:absolute;top:48px;right:0;box-shadow:0 9px 28px #5b462030}.tool-menu .quiet-button{text-align:left;width:100%}.home-topbar strong{letter-spacing:.03em;font-size:17px}.brand-dot{background:#47aca0;border-radius:5px;width:16px;height:16px;margin-right:7px;box-shadow:7px 0 #f0b64b,3px 7px #e78670}.quiet-button,.tool-button{color:#344454;background:#fffdf8;border:1px solid #d9c8ae;border-radius:12px;min-width:48px;min-height:44px;padding:0 12px;font-weight:700}.quiet-button:hover,.tool-button:hover{background:#f4ebdd}.home-topbar .quiet-button,.game-topbar [data-action=menu]{margin-left:auto}.home-content{flex:1;grid-template-columns:minmax(260px,.9fr) minmax(360px,1.1fr);align-items:center;gap:clamp(16px,4vw,64px);width:min(100%,1020px);min-height:0;margin:auto;display:grid}.home-intro{padding:clamp(8px,3vw,42px)}.eyebrow{color:#6d7b84;letter-spacing:.08em;font-size:13px;font-weight:800;display:block}.home-intro h1{letter-spacing:-.04em;margin:14px 0 10px;font-size:clamp(32px,4.5vw,66px);line-height:1.12}.home-intro p{margin:0;font-size:clamp(16px,1.8vw,20px)}.chapter-list{gap:12px;min-height:0;display:grid}.chapter-card{color:#263442;text-align:left;background:#fffdf8;border:1px solid #e0d5c7;border-radius:20px;align-items:center;gap:18px;width:100%;min-height:92px;padding:13px 18px;display:flex;box-shadow:0 8px 22px #5b462015}.chapter-card.available{background:linear-gradient(130deg,#fffef9,#e5f5ed);border-color:#79b6a7}.chapter-card.available:hover{transform:translateY(-2px);box-shadow:0 13px 27px #5b462025}.chapter-card.locked{opacity:.62;cursor:not-allowed;background:#f7f2ea}.chapter-card.finished .chapter-number{color:#b97719}.teacher-flag{color:#94601c;background:#fff3dc;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800}.chapter-number{color:#3c8c70;font-variant-numeric:tabular-nums;font-size:25px;font-weight:900}.chapter-copy{gap:4px;min-width:0;display:grid}.chapter-copy strong{font-size:20px}.chapter-copy small{font-size:13px}.chapter-arrow,.chapter-tag{white-space:nowrap;margin-left:auto;font-size:13px;font-weight:800}.chapter-arrow{color:#236e5d}.chapter-tag{color:#65727a;white-space:normal;text-align:right;max-width:9em}.home-tools{align-items:center;gap:8px;min-height:44px;padding:2px 4px;font-size:13px;font-weight:700;display:flex}.home-tools a{color:#236e5d}.home-tools .text-button{color:#94601c;min-height:44px;margin-left:auto}.home-tools select{min-width:0;min-height:44px;font:inherit;background:#fffdf8;border:1px solid #d9c8ae;border-radius:10px;flex:1}.game-topbar{margin-bottom:8px}.progress-label{white-space:nowrap;min-width:0;font-size:15px;font-weight:900}.game-topbar .quiet-button{white-space:nowrap;flex-shrink:0}.activity-layout{flex:1;grid-template-columns:minmax(0,1.65fr) minmax(310px,.9fr);gap:8px;min-height:0;display:grid}.scene-panel,.task-panel{border-radius:24px;min-width:0;min-height:0}.scene-panel{background:radial-gradient(circle at 50% 40%,#fffdf8 0,#f6eddf 68%,#e9dac4 100%);border:1px solid #d6c6ae;position:relative;overflow:hidden;box-shadow:inset 0 5px 25px #a9885620,0 8px 23px #5b462016;container-type:size}.scene-mount,.fallback-scene{position:absolute;inset:0}.scene-canvas{touch-action:none;width:100%;height:100%;display:block}.scene-canvas.is-viewing{cursor:grab}.scene-canvas.is-viewing:active{cursor:grabbing}.scene-retry{z-index:3;position:absolute;top:12px;right:12px}.scene-badge,.box-summary{z-index:2;background:#fffdf8e8;border:1px solid #dfcfb8;border-radius:999px;font-weight:800;position:absolute;box-shadow:0 4px 16px #5b462018}.scene-badge{padding:8px 11px;font-size:12px;top:12px;left:12px}.box-summary{white-space:nowrap;padding:8px 13px;font-size:13px;bottom:10px;left:50%;transform:translate(-50%)}.scene-tools{z-index:2;gap:6px;display:flex;position:absolute;top:9px;right:9px}.tool-button{min-height:44px;padding:0 10px;font-size:13px}.zoom-button{width:44px;min-width:44px;padding:0;font-size:20px;line-height:1}.grid-navigation{z-index:3;background:#fffdf8e8;border-radius:12px;align-items:center;gap:6px;padding:4px;font-size:13px;font-weight:800;display:flex;position:absolute;bottom:57px;right:10px}.grid-navigation .tool-button{min-width:44px;padding:0}#page-label{white-space:nowrap}.task-panel{background:#fffdf8;border:1px solid #e3d6c4;flex-direction:column;justify-content:center;gap:10px;padding:clamp(14px,2vw,30px);display:flex;box-shadow:0 8px 23px #5b462015}.task-eyebrow{color:#3c8c70}.task-title{margin:0;font-size:clamp(19px,2.2vw,28px);line-height:1.32}.math-line{color:#24394a;font-variant-numeric:tabular-nums;white-space:pre-line;background:#f2eadc;border-radius:14px;align-self:flex-start;max-width:100%;padding:7px 14px;font-size:clamp(23px,2.8vw,32px);font-weight:900}.math-line.multi-line{font-size:clamp(15px,1.6vw,19px);font-weight:800;line-height:1.5}.task-note{color:#5d6b72;margin:0;font-size:14px;line-height:1.45}.choice-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.choice-row.two{grid-template-columns:repeat(2,minmax(0,1fr))}.choice-row.wide{grid-template-columns:1fr}.choice-row.wide .answer-button{min-height:46px;font-size:16px}.choice-row:empty,.action-area:empty{display:none}.answer-button,.primary-button{border:1px solid #338270;border-radius:14px;min-height:50px;font-size:18px;font-weight:900}.answer-button{color:#235a4f;background:#f2faf5}.answer-button:hover,.answer-button:focus-visible{background:#dff2e7}.answer-button.selected{color:#fff;background:#3c8c70;border-color:#276b54}.primary-button{color:#fff;background:#327f6c;width:100%;padding:4px 16px;box-shadow:0 4px #20614e}.primary-button:hover{background:#276f5d}.primary-button:active{transform:translateY(3px);box-shadow:0 1px #20614e}.secondary-button{color:#235a4f;background:#f2faf5;border:1px solid #b9d3c7;border-radius:14px;min-height:46px;padding:4px 12px;font-size:16px;font-weight:800}.secondary-button:hover{background:#dff2e7}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.action-area{gap:8px;display:grid}.action-area.lab-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.action-area.lab-buttons .primary-button{grid-column:1/-1}.feedback.tone-good{color:#2d7a5f}.feedback.tone-hint{color:#a3561a}.finish-badge{color:#6b4608;background:linear-gradient(135deg,#fff4d2,#f4cf6c);border:2px solid #e1a93a;border-radius:999px;align-items:center;gap:8px;margin:8px 0;padding:8px 16px 8px 8px;font-weight:900;display:inline-flex;box-shadow:0 6px 16px #b9771933}.finish-badge span{color:#fff;background:#b97719;border-radius:50%;place-items:center;width:34px;height:34px;display:grid}.feedback{color:#94601c;min-height:20px;margin:0;font-size:14px;font-weight:700;line-height:1.45}.task-bottom{color:#6b777d;border-top:1px solid #ede4d5;justify-content:space-between;gap:6px;padding-top:10px;font-size:12px;display:flex}.task-bottom span:last-child{text-align:right}.text-button{color:#236e5d;background:0 0;border:0;min-height:28px;padding:2px 6px;font-size:12px;font-weight:800}.box-count-picker{align-items:center;gap:6px;font-size:13px;font-weight:800;display:flex}.box-count-picker select{min-width:0;min-height:44px;font:inherit;background:#fffdf8;border:1px solid #d9c8ae;border-radius:10px;flex:1}.box-count-picker .quiet-button{min-height:44px}.fallback-scene{background:linear-gradient(135deg,#f7e9d6,#e7d2b5);place-items:center;display:grid}.flat-board{grid-template-columns:repeat(var(--columns,2), 1fr);background:#e6c49e;border:7px solid #bb9167;border-radius:22px;gap:6px;width:min(78%,420px);height:min(66%,300px);padding:12px;display:grid;box-shadow:0 10px 18px #73533535}.flat-tray{background:#fff5e3;border:5px solid #d8b184;border-radius:13px;grid-template-columns:repeat(2,1fr);gap:5px;min-height:0;padding:7px;display:grid}.flat-tray.dense{grid-template-columns:repeat(3,1fr);gap:3px;padding:4px}.flat-block{background:#47aca0;border-radius:7px;min-height:0;box-shadow:inset 0 -4px #286f67}.flat-block:nth-child(2){background:#f0b64b;box-shadow:inset 0 -4px #a87523}.flat-block:nth-child(3){background:#e78670;box-shadow:inset 0 -4px #a64e3f}.flat-block:nth-child(4){background:#7f9cc8;box-shadow:inset 0 -4px #526e9c}.loose-blocks{z-index:1;color:#a75d1c;background:#fffdf8;border-radius:10px;padding:5px 8px;font-weight:900}.flat-number-grid{grid-template-columns:repeat(5,1fr);gap:6px;width:min(76%,330px);display:grid}.flat-number{background:#fffaf0;border:2px solid #d1b58b;border-radius:10px;place-items:center;min-height:42px;font-weight:900;display:grid}.flat-number.marked{background:#72c5ac;border-color:#317b64}.flat-number{position:relative}.flat-number.marked-a{background:#cfe2f1;border-color:#397dbc}.flat-number.marked-b{background:#f6e3a8;border-color:#c9981f}.flat-number.common{background:#bfe3d2;border-color:#3c8c70}.flat-number i{margin-left:2px;font-size:10px;font-style:normal}.mark-a{color:#397dbc}.mark-b{color:#b08212}.mark-c{color:#b97719}.fallback-scene{padding:12px;overflow:hidden}.flat-pile{flex-wrap:wrap;justify-content:center;gap:5px;width:min(80%,360px);display:flex}.flat-pile .flat-block{width:22px;height:22px}.flat-track{gap:10px;width:min(92%,560px);font-weight:800;display:grid}.flat-lane{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.flat-lane b{min-width:5.5em;font-size:13px}.flat-step{text-align:center;color:#9aa3a8;background:#fffaf0;border:2px solid #e2d3bc;border-radius:9px;min-width:34px;padding:5px 6px}.flat-step.step-a{color:#1f4e7c;background:#e3eef8;border-color:#397dbc}.flat-step.step-b{color:#6b4b06;background:#fbefcc;border-color:#c9981f}.flat-step.common{box-shadow:0 0 0 3px #e8b749}.flat-gears{flex-wrap:wrap;justify-content:center;align-items:center;gap:18px;font-weight:800;display:flex}.flat-gears p{text-align:center;width:100%;margin:0}.flat-gear{text-align:center;border:10px dotted #fffaf0;border-radius:50%;place-content:center;width:120px;height:120px;display:grid;position:relative}.flat-gear:after{content:"";transform-origin:7px 52px;width:14px;height:14px;transform:rotate(var(--turn));background:#db6254;border-radius:50%;margin-left:-7px;position:absolute;top:8px;left:50%}.flat-gear.gear-a{color:#fff;background:#379e9c}.flat-gear.gear-b{color:#3b2b05;background:#eeb34e}.flat-gear.home{box-shadow:0 0 0 5px #ffc94d}.flat-square{aspect-ratio:1;background:#eadcc3;border:6px solid #d9b27c;border-radius:8px;width:min(58vmin,280px);position:relative}.flat-tile{box-sizing:border-box;border:2px solid #eadcc3;border-radius:5px;position:absolute}.flat-tile.placed{background:#5fb7aa}.flat-cell{cursor:pointer;background:0 0;border-style:dashed;padding:0}.flat-cell:hover,.flat-cell:focus-visible{outline-offset:-3px;background:#5fb7aa47;outline:3px solid #2f8f83}.flat-gap{color:#7a3f0c;background:repeating-linear-gradient(45deg,#f6d59a 0 8px,#e39a3b 8px 12px);place-items:center;font-weight:900;display:grid;position:absolute;top:0;bottom:0}.flat-caption{text-align:center;margin:8px 0 0;font-weight:800}.fallback-scene:has(.flat-square){flex-direction:column;justify-content:center;align-items:center;display:flex}@media (width<=760px){.home-content{grid-template-rows:auto 1fr;grid-template-columns:1fr;align-items:start;gap:8px;padding-top:10px}.home-intro{padding:4px 8px}.home-intro h1{margin:5px 0;font-size:clamp(28px,8vw,42px)}.home-intro p{font-size:15px}.chapter-list{gap:7px}.chapter-card{border-radius:15px;gap:13px;min-height:72px;padding:9px 12px}.chapter-copy strong{font-size:17px}.chapter-number{font-size:21px}.activity-layout{grid-template-rows:minmax(120px,1fr) auto;grid-template-columns:1fr}.scene-panel,.task-panel{border-radius:17px}.task-panel{justify-content:flex-start;gap:6px;padding:11px 13px}.task-title{font-size:18px;line-height:1.25}.math-line{padding:5px 11px;font-size:24px}.math-line.multi-line{padding:5px 10px;font-size:15px}.task-note{font-size:13px}.secondary-button{min-height:44px;font-size:15px}.task-bottom{padding-top:5px}.flat-number-grid{grid-template-columns:repeat(5,1fr);gap:4px;width:min(84%,330px)}.flat-number{min-height:27px;font-size:13px}.scene-panel:has(#page-navigation:not([hidden])) .box-summary{display:none}.grid-navigation{bottom:8px;right:50%;transform:translate(50%)}}@media (width<=760px) and (orientation:portrait) and (height<=700px){.task-eyebrow{display:none}.task-panel{gap:5px;padding:9px 11px}.task-title{font-size:16px}.answer-button,.primary-button,.secondary-button{min-height:44px;font-size:16px}.choice-row,.action-area{gap:6px}.math-line{padding:3px 9px;font-size:21px}.math-line.multi-line{font-size:14px}.feedback{font-size:13px}}@media (orientation:landscape) and (height<=500px){.topbar{flex-basis:42px}.task-eyebrow{display:none}.action-area.lab-buttons{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.action-area.lab-buttons .primary-button{grid-column:auto}.action-area.lab-buttons button{padding:2px 4px;font-size:13px;line-height:1.2}.math-line.multi-line{padding:3px 8px;font-size:13px;line-height:1.35}.task-note{display:none}.activity-layout{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.task-panel{gap:4px;padding:8px 11px}.task-title{font-size:16px}.math-line{padding:2px 8px;font-size:20px}.answer-button,.primary-button{min-height:44px;font-size:15px}.secondary-button{min-height:44px;font-size:14px}.feedback{min-height:16px;font-size:12px}.task-bottom{display:none}.home-content{grid-template-rows:1fr;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center}.chapter-card{min-height:57px;padding:5px 10px}.chapter-copy small{display:none}.home-intro h1{font-size:30px}.home-tools{min-height:38px}.grid-navigation{padding:2px}.box-summary{font-size:11px;left:10px;transform:none}.choice-row:not(.wide):not(.two){grid-template-columns:repeat(auto-fit,minmax(44px,1fr));gap:4px}}@media (orientation:landscape) and (height<=500px) and (width<=700px){.activity-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}}@media (width<=760px) and (orientation:portrait) and (height<=530px){.activity-layout{grid-template-rows:minmax(0,1fr) auto}.topbar{flex-basis:43px}.task-panel{gap:3px;padding:7px 10px}.task-title{font-size:16px}.math-line{padding:2px 9px;font-size:21px}.answer-button,.primary-button{min-height:44px;font-size:16px}.secondary-button{min-height:44px;font-size:14px}.math-line.multi-line{font-size:14px}.feedback{min-height:16px;font-size:12px}.task-bottom{display:none}.chapter-card{min-height:62px}.home-intro h1{font-size:26px}.choice-row{gap:5px}.answer-button,.primary-button{min-height:44px}.task-panel{gap:3px}.grid-navigation{padding:2px}.flat-number{min-height:22px}.action-area.lab-buttons{gap:5px}.action-area.lab-buttons .primary-button{grid-column:auto}.action-area.lab-buttons button{padding:2px 6px;font-size:14px}}@media (width<=460px){.game-topbar{gap:6px;padding:0 6px}.game-topbar .quiet-button{padding:0 9px}.progress-label{white-space:normal;flex:1;font-size:13px;line-height:1.2}}@container (width<=380px){.scene-badge[data-mode="3d"]{display:none}}@container (height<=119px){.scene-tools,.grid-navigation,.box-summary{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}