@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;600;700;800&display=swap');
:root{font-family:'DM Sans',system-ui,sans-serif;color:#193d43;background:#f3f6f5;font-size:16px;--ink:#153c42;--accent:#d4ef79;--line:#dce5e2}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #439f91;outline-offset:3px}header{background:var(--ink);color:white;padding:20px max(24px,calc((100vw - 1180px)/2));display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{font-family:Manrope,sans-serif;font-size:23px;font-weight:800;letter-spacing:-1px}.brand small{display:block;font:12px 'DM Sans',sans-serif;letter-spacing:2px;margin-top:3px;color:#b7d5d1}button{border:1px solid var(--line);background:white;border-radius:12px;padding:12px 18px;color:var(--ink);font-weight:700}.primary{background:var(--ink);color:white;border-color:var(--ink)}.lime{background:var(--accent);border-color:var(--accent);color:var(--ink)}.plain{background:none;border-color:transparent}.danger{color:#a13935}.shell{max-width:1180px;margin:auto;padding:26px 24px 50px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:26px}.stat{background:white;border:1px solid var(--line);padding:17px 20px;border-radius:15px}.stat small{display:block;color:#647b7f;font-size:13px;margin-bottom:5px}.stat strong{font-family:Manrope,sans-serif;font-size:25px}.topline,.row{display:flex;align-items:center;justify-content:space-between;gap:16px}.topline{margin-bottom:22px}h1{font:800 30px Manrope,sans-serif;letter-spacing:-1px;margin:0 0 6px}h2{font:800 21px Manrope,sans-serif;margin:0 0 14px}h3{margin:0 0 10px;font-size:18px}p{line-height:1.6;margin:8px 0 16px}.muted{color:#647b7f}.eyebrow{font-size:12px;letter-spacing:1.8px;font-weight:700;text-transform:uppercase;color:#67847e;margin-bottom:10px}.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px}.tabs button{background:transparent;border:0}.tabs .active{background:var(--ink);color:white}.layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:22px;align-items:start}.card{background:white;border:1px solid var(--line);border-radius:20px;padding:24px;margin-bottom:18px}.office-card{overflow:hidden;padding:0;background:#dfeae9}.room{position:relative;height:390px;background:linear-gradient(#dfeae9 0 58%,#b4cbc2 58% 60%,#d4bb98 60%);isolation:isolate}.room:after{content:'';position:absolute;inset:60% 0 0;background:repeating-linear-gradient(0deg,transparent 0 38px,#a58a6522 38px 40px);z-index:-1}.room-title{position:absolute;left:24px;top:23px;font-size:13px;letter-spacing:2px;font-weight:700;color:#53716f}.room-object{position:absolute;text-align:center;transform:translateX(-50%);font-size:64px;line-height:1.2;filter:drop-shadow(0 8px 3px #31453c1a)}.room-object small{display:block;font-size:12px;font-weight:600;background:#ffffffbc;border-radius:20px;padding:3px 9px;margin-top:5px;filter:none}.entrance{left:85%;top:22%;font-size:80px}.closet{left:20%;top:29%;font-size:80px}.desk{left:48%;top:47%;font-size:87px}.pet{left:78%;top:77%;font-size:42px}.plant0{left:12%;top:75%;font-size:39px}.plant1{left:31%;top:79%;font-size:39px}.plant2{left:91%;top:65%;font-size:39px}.office-foot{padding:18px 24px;background:white;display:flex;justify-content:space-between;gap:12px;font-size:14px}.badge{display:inline-block;background:#eef4ec;border:1px solid #d9e6d5;border-radius:30px;padding:6px 10px;font-size:12px;font-weight:700}.callout{background:#edf4f2;border-left:3px solid #7bada1;padding:14px 16px;border-radius:8px;margin:15px 0}.wide{width:100%}.progress{height:7px;border-radius:9px;background:#e4eae6;overflow:hidden;margin:12px 0}.progress span{display:block;height:100%;background:#6eab8d}.client{font-size:54px;background:#edf2eb;border-radius:18px;padding:12px;line-height:1}.doc{background:#fbfaf5;border:1px solid #e4e2d4;padding:20px;border-radius:10px;margin:16px 0}.doc .row{padding:9px 0;border-bottom:1px dashed #d8d8cf;align-items:start}.doc .row:last-child{border:0}label{display:block;font-weight:600;margin:17px 0 7px}input,select{width:100%;padding:13px;border:1px solid #baccc6;border-radius:10px;background:white;color:var(--ink)}.field.wrong input,.field.wrong select{border:2px solid #b36736}.hint{color:#945628;font-size:14px;line-height:1.5;margin-top:7px}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.shop-icon{font-size:42px}.notice{background:#e8f3d4;border:1px solid #cbdcae;padding:15px 20px;border-radius:12px;margin:0 0 20px;line-height:1.5}.bad{background:#fff0ea;border-color:#e5c7bd}.translation{color:#6a7c76;font-size:14px;font-weight:400;display:block;margin-top:4px}.history{padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}.footer{font-size:13px;color:#657d77;margin-top:25px}.license.locked{opacity:.75}dialog{border:1px solid var(--line);border-radius:20px;max-width:480px;width:calc(100% - 32px);padding:26px;color:var(--ink)}dialog::backdrop{background:#102f37aa}.result-icon{font-size:48px}a{color:inherit} @media(max-width:760px){header{padding:16px}.shell{padding:20px 14px}.layout{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr);gap:8px}.stat{padding:13px}.topline{align-items:start;flex-direction:column}.room{height:350px}.grid{grid-template-columns:1fr}h1{font-size:26px}.card{padding:19px}.office-card{padding:0}.room-object small{font-size:12px}.brand{font-size:21px}}
/* Keep paired English/Chinese labels readable in the compact office. */
.room-object small{max-width:88px;margin-left:auto;margin-right:auto;white-space:normal;line-height:1.35}
.plant0,.plant1,.plant2{width:66px}
.plant0{top:70%}.plant1{top:73%}.pet{top:70%}
.row>span,.row>strong,.stat{min-width:0;overflow-wrap:anywhere}
.stat strong{line-height:1.35}
header .lime{flex-shrink:0}
.doc .row>span,.doc .row>strong{flex:1}
.doc .row>strong{text-align:right}
.assignment-layout{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:20px;align-items:start}
.assignment-layout>.card{min-width:0}
.task-brief{font-size:17px;padding:12px 0;border-bottom:1px solid var(--line)}
.worksheet-section{margin:24px 0;padding:18px 0;border-top:1px solid var(--line)}
.worksheet-section h3{display:flex;align-items:center;gap:10px;flex-wrap:wrap;line-height:1.5}
.worksheet-section h3 .translation{flex-basis:100%;margin-left:40px}
.section-number{display:inline-grid;place-items:center;border-radius:50%;width:28px;height:28px;background:#edf4f2;font-size:14px;flex-shrink:0}
.worksheet-scroll{overflow-x:auto}
.worksheet-table,.journal-table{border-collapse:collapse;width:100%;font-size:15px}
.worksheet-table th,.worksheet-table td,.journal-table th,.journal-table td{padding:12px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.worksheet-table thead,.journal-table thead{background:#edf4f2;color:var(--ink)}
.worksheet-table tbody th{width:48%;font-weight:500}
.worksheet-table label{margin:0;font-weight:500;font-size:15px}
.worksheet-table input,.worksheet-table select,.journal-table input{margin:0;min-width:110px}
.journal-table{min-width:440px}.journal-table th:first-child{width:50%}
.t-account{border:1px solid #b7c9c2;border-radius:10px;overflow:hidden;background:#fffef9}
.ledger-title{text-align:center;font-weight:700;font-size:18px;padding:14px;border-bottom:3px solid var(--ink)}
.ledger-halves{display:grid;grid-template-columns:1fr 1fr}
.ledger-half{min-width:0}.ledger-half+ .ledger-half{border-left:3px solid var(--ink)}
.ledger-side{padding:10px;text-align:center;font-weight:700;background:#eef3ec;font-size:14px}
.ledger-half table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px}
.ledger-half th,.ledger-half td{padding:9px 5px;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
.ledger-half th:first-child{width:18%}.ledger-half th:nth-child(2){width:47%}.ledger-half th:last-child{width:35%}
.ledger-half input{font-size:14px;padding:10px 6px;min-width:0;border-radius:6px}
.ledger-empty{color:#76867f;height:90px;text-align:center;vertical-align:middle!important}
.section-advice{background:#fff4df;border-left:3px solid #b77c26;padding:12px;margin:12px 0;line-height:1.6}
.review-section{border-top-color:#b77c26}
.assignment-layout details{margin:18px 0}.assignment-layout summary,summary{cursor:pointer;padding:12px 0;font-weight:700}
@media(min-width:761px) and (max-width:1100px){.assignment-layout{grid-template-columns:minmax(0,1fr)}.assignment-layout>aside{display:grid;grid-template-columns:1fr 1fr;gap:16px}}
@media(max-width:760px){.assignment-layout{grid-template-columns:1fr}.ledger-halves{grid-template-columns:1fr}.ledger-half+.ledger-half{border-left:0;border-top:3px solid var(--ink)}.ledger-half th:first-child{width:19%}.ledger-half th:nth-child(2){width:48%}.ledger-half th:last-child{width:33%}.worksheet-table{min-width:320px}.worksheet-section{margin:18px 0}.assignment-layout>.card{padding:16px}.doc .row{flex-wrap:wrap}.doc .row>span,.doc .row>strong{flex-basis:42%}}
.client-dialogue p:last-child{margin-bottom:0}
.solution-answer{display:block;font-size:16px;font-weight:650;line-height:1.6;padding:6px 0;overflow-wrap:anywhere;color:#174c3d}
.answer-mistake{background:#fff1f0;border:2px solid #b42318;border-radius:8px;padding:10px;line-height:1.6;overflow-wrap:anywhere}
.answer-mistake>strong,.answer-mistake>small,.submitted-answer{display:block}
.answer-mistake>strong:first-child,.submitted-answer{color:#a11912}
.submitted-answer{font-weight:700;margin:4px 0 12px}.answer-mistake>small{margin-bottom:12px;color:#713d20}
.solution-reason{background:#edf4f2;border-left:4px solid #427966;padding:16px 20px;margin-top:18px;font-size:16px;line-height:1.8}
.solution-reason p{margin:8px 0 0}.worked-solution{margin:28px 0}.worked-solution .doc{font-size:16px;line-height:1.7}
.client-dialogue .loyalty-line{border-top:1px solid #cadcd5;padding-top:12px;font-size:14px}
/* Clay scene: independent transparent image layers, no flattened room artwork. */
.clay-card{background:#f8f2e8;max-width:760px;margin-left:auto;margin-right:auto}.clay-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:24px 24px 0}.clay-heading h2{font-size:20px;margin:5px 0 0}
.clay-stage{position:relative;aspect-ratio:1/1;width:100%;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 70%,#dfd2bd55,transparent 65%)}
.clay-sprite{display:block;background-image:var(--sheet);background-repeat:no-repeat;background-size:var(--sprite-size,300% 300%);background-position:var(--sx) var(--sy)}
.clay-layer{position:absolute;pointer-events:none;user-select:none}
.clay-floor{left:0;top:31%;width:100%;height:69%;z-index:0}
.clay-wall-left{left:-.5%;top:4%;width:55%;height:62%;z-index:1}
.clay-wall-right{left:45.5%;top:4%;width:55%;height:62%;z-index:2}
.clay-window{left:64%;top:19%;width:26%;height:30%;z-index:3}
.clay-object{position:absolute;padding:0;border:0;background:none!important;border-radius:12px;box-shadow:none;display:block;transition:filter .15s;min-width:0}
.clay-object>.clay-sprite{width:100%;height:100%;pointer-events:none;user-select:none}
.clay-object:hover{filter:drop-shadow(0 0 5px #fff6c4)}.clay-object:focus-visible{outline:3px solid #276554;outline-offset:-3px}
.clay-door{left:5%;top:22%;width:29%;height:42%;z-index:4}
.clay-door>.clay-sprite{transform:skewY(9deg) scaleX(-1);transform-origin:center bottom}
.clay-closet{left:39%;top:27%;width:25%;height:25%;z-index:5}
.clay-closet>.clay-sprite{transform:skewY(7deg);transform-origin:50% 95%}
.clay-habitat{position:absolute;inset:0;width:100%;height:100%}
.habitat-shell,.habitat-bird{position:absolute;display:block;padding:0;border:0;background:none!important;box-shadow:none;min-width:0;border-radius:0}
.habitat-shell{inset:0;width:100%;height:100%}
.habitat-shell>.clay-sprite,.habitat-bird>.clay-sprite{width:100%;height:100%}
.habitat-bird{z-index:1}
.habitat-bars{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.decor-slot{position:absolute;width:20%;height:20%;border:0;padding:0;background:none!important;box-shadow:none;min-width:0;overflow:visible}
.decor-slot-0{left:16%;top:59%;z-index:12}
.decor-slot-1{left:74%;top:51%;z-index:10}
.decor-slot-2{left:40%;top:70%;z-index:14}
.decor-slot-3{left:60%;top:60%;z-index:13}
.decor-slot .slot-number{position:absolute;bottom:0;left:44%;font-size:11px;padding:1px 5px;border-radius:10px;background:#fff9;color:#38504a;opacity:0}
.decor-slot:hover .slot-number,.decor-slot:focus-visible .slot-number{opacity:1}
.decor-slot .slot-plant{position:absolute;inset:0;width:100%;height:100%}
.decor-slot.is-pet:hover{filter:drop-shadow(0 0 6px #fff6c4)}
.decor-slot.is-pet:focus-visible{outline:3px solid #276554;outline-offset:3px}
.habitat-perch{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.slot-free-bird{position:absolute;left:25%;top:30%;width:50%;height:50%}
.slot-bed{position:absolute;left:-5%;top:30%;width:110%;height:70%;z-index:0}
.slot-pet{position:absolute;left:17%;top:5%;width:66%;height:66%;z-index:1}
.shop-categories,.slot-buttons{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.shop-categories button[aria-pressed=true],.slot-buttons button[aria-pressed=true]{background:#153c42;color:white;border-color:#153c42}
.shop-preview{margin:12px 0 20px}.shop-preview summary{cursor:pointer;padding:12px;border:1px solid #d4e1dd;border-radius:10px}
.slot-picker{background:#fff;border:1px solid #d4e1dd;border-radius:14px;padding:16px;margin-bottom:20px}
.slot-picker p{font-size:14px}.slot-buttons button{font-size:13px;padding:8px}
.shop-item{display:flex;flex-direction:column}.shop-item button{margin-top:auto}.shop-item h3{margin-top:15px}
.clay-cage{left:70%;top:27%;width:23%;height:35%}.clay-cage-back{z-index:8}.clay-cage-front{z-index:10;pointer-events:none}
.clay-cage.empty-slot{left:76%;top:58%;width:10%;height:10%}
.clay-desk{left:43%;top:28%;width:43%;height:43%;z-index:8}
.clay-desk>.clay-sprite{transform:scale(.9);transform-origin:center bottom}
.clay-bed{left:18%;top:59%;width:30%;height:24%}
.clay-bed-back{z-index:8}.clay-bed-front{z-index:10;pointer-events:none}
.clay-pet{left:23%;top:53%;width:20%;height:25%;z-index:9}
.clay-bird-in-cage{left:75%;top:32%;width:13%;height:23%;z-index:9}
.clay-plant0{left:8%;top:54%;width:16%;height:20%;z-index:7}
.clay-plant1{left:72%;top:65%;width:13%;height:18%;z-index:11}
.clay-plant2{left:54%;top:61%;width:17%;height:19%;z-index:10}
.clay-tooltip{position:absolute;bottom:0;left:50%;transform:translateX(-50%);background:#173e36;color:#fff;padding:5px 9px;border-radius:8px;font-size:12px;white-space:nowrap;opacity:0;pointer-events:none}
.clay-object:hover .clay-tooltip,.clay-object:focus-visible .clay-tooltip{opacity:1}
.slot-plus{display:grid;place-items:center;margin:auto;width:32px;height:32px;border:1px dashed #887458;border-radius:50%;background:#fff9;font-size:22px;color:#786749}
.clay-shop-image{width:130px;height:120px}.finish-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.finish-grid label{margin:0}.finish-grid select{margin-top:8px}
@media(max-width:600px){.clay-heading{padding:18px 16px 0}.clay-heading h2{font-size:17px}.clay-heading button{padding:10px}.clay-shop-image{width:85px;height:100px}.clay-card .office-foot{padding:12px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.clay-object{transition:none}}
/* Shared input/solution layouts for the chapter 7–10 expansion. */
.trial-table caption,.statement-table caption{padding:14px 12px;background:#edf3eb;color:#183f42;font-weight:700;text-align:left}
.trial-table{min-width:0;table-layout:fixed}
.trial-table th:first-child{width:38%}
.trial-table th:not(:first-child){width:31%}
.trial-table td input{width:100%;min-width:76px}
.trial-table .trial-total,.statement-table tbody tr:last-child{border-top:2px solid #52746a;font-weight:700}
.statement-table td{width:38%}
.statement-table .solution-answer{font-variant-numeric:tabular-nums}
.worksheet-table select[size]{height:auto;padding:4px;overflow-y:auto}
.worksheet-table select[size] option{padding:8px 10px}
.statement-table th,.trial-table th{font-weight:600}
.trial-table .answer-mistake{padding:7px;font-size:13px}
.trial-table th,.trial-table td{padding:10px 7px;overflow-wrap:anywhere}
.trial-table td input{min-width:0;padding:10px 7px}
@media(max-width:760px){
 .journal-table{min-width:0;table-layout:fixed}
 .journal-table:not(.trial-table) th:first-child{width:44%}
 .journal-table:not(.trial-table) th:not(:first-child){width:28%}
 .journal-table th,.journal-table td{padding:10px 7px;overflow-wrap:anywhere}
 .journal-table input{min-width:0;width:100%;padding:10px 6px}
 .journal-table .answer-mistake{padding:6px;font-size:13px}
}