/* Sky-themed interface. Textbook geometry, canvas bounds and recording behavior are retained. */
:root{--ink:#253e55;--navy:#253e55;--muted:#637e90;--teal:#347da2;--cream:#f2f7fa;--gold:#f7d57c;--line:#dce8ef;--ui-blue:#326f96;--ui-deep:#245779;--ui-shadow:0 8px 30px #294b6b08}
body{background:#eef5f9;color:var(--ink);font-family:Arial,"Microsoft YaHei","PingFang SC",sans-serif;line-height:1.65}
.courseware-sky{opacity:.1;background:#f2f7fa}.courseware-sky svg{opacity:.5}
header.app-header,main{width:100%;max-width:1600px;margin-inline:auto;padding-inline:clamp(56px,5vw,88px)}
header.app-header{max-width:none;min-height:94px;padding-block:18px;background:#fffffff2;border-bottom:1px solid #dce8ef;gap:18px}
.app-header .brand{gap:12px;font-size:21px;line-height:1.2;letter-spacing:-.5px;font-family:inherit;font-weight:700}.brand b{font-weight:400}.brand small{display:block;font-size:11px;font-weight:400;letter-spacing:1.4px;margin-top:7px;color:#70889a}
.brand .brand-icon{display:grid;place-items:center;background:#e2eff6;color:#34799f;width:46px;height:46px;border-radius:15px;font-size:33px;flex-shrink:0}
.header-meta{display:flex;gap:22px;align-items:center}.header-subject{font-size:10px;letter-spacing:2px;color:#7890a2}.grade-badge{padding:7px 14px;border:1px solid #dbe7ee;border-radius:30px;color:#506e83;font-size:12px;background:#f8fbfd;white-space:nowrap}
.book-intro{position:relative;overflow:hidden;margin:26px 0 28px;padding:28px 36px;min-height:220px;gap:18px;background:#f9fcff;border:1px solid #dceaf3;border-radius:24px;box-shadow:var(--ui-shadow);display:flex;justify-content:space-between;align-items:center}
.intro-copy{position:relative;z-index:1;flex:1;min-width:0}.intro-eyebrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:#6e879a;font-size:11px;letter-spacing:.2px}.intro-eyebrow>span{font-size:10px;letter-spacing:1.8px;color:#467596;font-weight:700;background:#e8f2f8;border-radius:6px;padding:4px 9px}
.book-intro h1{display:flex;align-items:center;gap:18px;font:700 clamp(34px,3.8vw,52px)/1.15 Arial,sans-serif;letter-spacing:-1.7px;color:#2a5a79;margin:13px 0 10px}.title-spark{font-size:26px;color:#e7b658;font-weight:400;transform:rotate(12deg)}
.book-intro .intro-description{margin:0;font-size:14px;color:#5f7b8e;line-height:1.8}.intro-topics{display:flex;gap:19px;flex-wrap:wrap;margin-top:17px}.intro-topics span{display:flex;align-items:center;gap:6px;font-size:11px;color:#5d7b8d}.intro-topics span::before{content:'';width:5px;height:5px;border-radius:50%;background:#86b4cc}.intro-topics span:nth-child(2)::before{background:#dfb76c}.intro-topics span:nth-child(3)::before{background:#8eaf9b}
.intro-art{width:300px;max-width:35%;text-align:center;align-self:center;flex-shrink:0;margin:-16px -5px -14px 0}.intro-art svg{display:block;width:100%;height:183px}.art-caption{position:static;display:block;color:#81a0b1;font-size:9px;letter-spacing:1.3px;margin-top:-3px}
.learning-navigation{padding:23px 24px 0;background:#fffffff5;border:1px solid #dce8ef;border-radius:22px;margin-bottom:22px;box-shadow:var(--ui-shadow)}
.navigation-caption{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 16px}.navigation-caption h2{margin:0;font-size:17px;color:#355a73;font-weight:700;letter-spacing:.2px}.navigation-caption>span{font-size:11px;color:#7a91a1}
.page-tabs{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:0}.page-tabs button{position:relative;min-height:76px;padding:10px 5px 11px;border:1px solid #e0eaf0;border-radius:12px;background:#f7fafc;color:#56758b;font-size:22px;font-weight:700;line-height:1.3;transition:background .16s,border-color .16s,box-shadow .16s}.page-tabs button::before{content:'PAGE';display:block;margin-bottom:3px;font-size:8px;font-weight:400;letter-spacing:1.5px;color:#8a9eac}.page-tabs button:last-child{font-size:18px}.page-tabs button:last-child::before{content:'REVIEW'}.page-tabs small{display:block;font-size:10px;line-height:1.4;margin-top:5px;font-weight:400;overflow-wrap:anywhere;color:#758e9e}.page-tabs button:hover{border-color:#b3cfdf;background:#eef6fb}.page-tabs button[aria-current=page]{background:#326f96;color:white;border-color:#326f96;box-shadow:0 5px 12px #326f9622}.page-tabs button[aria-current=page]::before,.page-tabs button[aria-current=page] small{color:#e0edf6}
.unit-module-navigation{margin:20px 0 0;padding:15px 0 16px;background:none;border:0;border-top:1px solid #e9f0f5;border-radius:0;color:#55768d;box-shadow:none}.unit-module-label{font-size:10px;letter-spacing:.8px;color:#8499a8;margin-bottom:10px;font-weight:400}.unit-module-tabs{gap:6px;align-items:stretch;flex-wrap:wrap}.unit-module-tabs [role=tab]{font-size:13px;min-height:42px;padding:9px 17px;border:1px solid transparent;border-radius:9px;background:transparent;color:#617e92;font-weight:400}.unit-module-tabs [role=tab]:hover{background:#f0f6fa}.unit-module-tabs [role=tab][aria-selected=true]{background:#eaf3f9;color:#245b80;border-color:#d8e9f4;box-shadow:none;font-weight:700}.unit-module-status{font-size:12px;color:#8a5d35}
.book-spread.text-only{max-width:none}.book-readable,.text-only .book-readable{background:#fff;border-color:#dce8ef;border-radius:22px;box-shadow:var(--ui-shadow);padding:30px 36px;overflow-wrap:anywhere}
.book-readable h2{font-size:25px;font-weight:700;color:#2b5b7c;margin-top:0;line-height:1.4}.book-readable h3{color:#385f7b;font-size:20px}.book-note,.book-readable .book-note{font-size:12px;line-height:1.9;color:#718797}.lesson-tip{font-size:14px;color:#617d8e;margin-bottom:22px}.translation{font-size:13px;color:#718596}
.book-readable .unit-cover{min-height:400px;border-radius:15px;padding:36px;background-image:linear-gradient(90deg,#163b5bdf,#1a476146),url('assets/mini-project/unit-sky.png')}.unit-cover p{font-size:15px}.unit-cover h3{color:#fff}.book-readable .unit-cover h2{font-size:44px!important;margin:12px 0}.book-readable .unit-cover .primary{margin-top:8px}
.primary{background:#f5d281;color:#624b29;border:1px solid #eac36a;box-shadow:0 3px 0 #e5bc6255;font-size:14px;border-radius:11px;min-height:48px}.primary:hover{background:#f9dda0}.outline{background:#fff;border:1px solid #cedfe9;color:#446f8b;border-radius:11px;min-height:46px;font-size:14px}.outline:hover{background:#eff6fb;border-color:#adcbdc}
button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #d69c37!important;outline-offset:3px}button:disabled{box-shadow:none}
select{border:1px solid #d4e1e9;border-radius:10px;background:#f8fbfd;color:#355b74;min-height:46px;padding:10px 36px 10px 12px;max-width:100%;font-family:inherit;font-size:15px}audio{accent-color:#35779f;max-width:100%}
.page-audio{padding:20px;border:1px solid #dfeaf1;background:#f6fafd;border-radius:14px;margin-top:24px}.page-audio label{color:#476d86;font-size:12px;margin-bottom:10px}.page-audio select{width:100%;background:white}.page-audio p:empty{display:none}.tts-note{margin-bottom:0;color:#80929e;font-size:10px;line-height:1.8}
.readalong-practice,.study-extras{margin-top:0;border:1px solid #dce8ef;background:#fff;border-radius:22px;box-shadow:var(--ui-shadow)}.readalong-practice{padding:30px 36px}.readalong-practice>h2{margin-top:0;color:#2b5b7c}.readalong-practice>select{font-size:20px;min-height:56px;max-width:none;background:#f8fbfd}.readalong-practice>label{color:#52768d;font-size:13px}.readalong-practice>p{font-size:12px;color:#718797}.study-extras .assist-body{padding:28px 32px}.study-extras .assist-body>h2,.study-extras .assist-body>p{display:none}.assist-body>section>h3{margin-top:0;color:#2b5b7c;font-size:22px}
.word-grid{gap:12px}.word{background:#f6fafd;border:1px solid #dae8f0;border-radius:15px;box-shadow:none}.word:hover{background:#fff7df;transform:translateY(-2px)}.word strong{color:#355f7c}.word .hint{color:#7890a0}.choices{gap:12px}.choice{border-color:#d8e6ef;border-radius:13px;background:#f6fafd;color:#355d79}.choice:hover{background:#eaf4fb;border-color:#9cc2d9}.spelling-card{background:#f8fbfd;border-color:#e0eaf0;border-radius:16px;padding:24px}.spelling-card input{background:white;border-color:#c9deeb;color:#2d5776}.letter-bank button{background:white;border-color:#d3e3ee;color:#366585;border-radius:10px;box-shadow:0 3px 0 #d3e3ee55}.letter-bank button:hover{background:#fff4d6}
.review-group{margin-top:24px}.review-words{gap:12px}.book-readable .review-word[data-read]{background:#f5fafd;border-color:#d9e8f1;border-radius:16px;padding:20px;gap:8px}.review-word strong{color:#2e668d}.review-word span{color:#55758a}.review-word small{color:#7f96a6}.grammar-card{border-color:#dce8ef;background:#f8fbfd;border-radius:16px}.unit-grammar h2{color:#2b5b7c}.grammar-rule{color:#356b91}
.readalong-practice .sky-recorder{background:#f5f9fc;border-color:#dce8ef}.sky-recorder h3{color:#355f7c}.sky-recorder-context{border-left-color:#7eaac5;color:#355f7c}.sky-recorder-clock{color:#326f96}.sky-recording-row{border-color:#dce8ef}.sky-recorder-private{border-color:#dce8ef}.roleplay-actions button{border:1px solid #d5e4ed;border-radius:10px;color:#456e88;background:white}.roleplay-actions [aria-pressed=true]{background:#326f96;border-color:#326f96;color:white}
/* Canvas and image hotspot geometry deliberately inherit the established styles. */
.sky-drawing{border-color:#d7e6ed;border-radius:16px}.sky-drawing button.sky-drawing-enlarge{background:#3c7896;border-color:#3c7896}.sky-drawing button{border-radius:9px}.book-task{background:#f0f6fa;border-radius:12px;color:#456a83}.image-lesson{border-color:#e1eaf0;border-radius:15px}.image-lesson figcaption{background:#f9fbfd;color:#738b9c}.song-lesson{border-radius:16px}
.floating-page-nav button{background:#fffffff2;border:1px solid #d3e3ed;color:#49738e;box-shadow:0 4px 16px #36536d12;width:40px;min-width:40px;min-height:54px;border-radius:13px;font-size:30px}.floating-page-nav button:hover:not(:disabled){background:#326f96;color:#fff}.floating-page-nav button:disabled{background:#e5edf2;color:#a7bbc8;border-color:#dce7ee}.floating-page-nav span{background:#ffffffd9;color:#7a95a7;font-size:9px;width:40px;right:6px}.floating-page-nav #floatPrev{left:6px}.floating-page-nav #floatNext{right:6px}
footer{margin-top:28px;padding:24px 12px 14px;border-radius:0;background:transparent;border-top:1px solid #d8e5ed;color:#8499a7;text-align:center}footer .brand{justify-content:center;font:600 14px Arial,sans-serif;letter-spacing:.1px;color:#68869b}footer p{font-size:11px;margin:9px 0}footer .fine{max-width:850px;margin:8px auto;color:#8a9da9;font-size:10px;line-height:1.8}
@media(min-width:1100px){.floating-page-nav span{top:calc(50% + 34px)}.book-spread.text-only:is([data-book-page="35"],[data-book-page="36"],[data-book-page="37"]){max-width:1120px}}
@media(max-width:900px){.intro-art{width:220px;max-width:32%}.intro-art svg{height:160px}.intro-eyebrow{font-size:10px}.book-intro{padding:24px}.page-tabs small{font-size:9px}.page-tabs{gap:6px}.learning-navigation{padding:20px 18px 0}.unit-module-tabs [role=tab]{padding:9px 13px}.header-subject{display:none}.book-readable,.text-only .book-readable{padding:24px}.readalong-practice{padding:24px}.study-extras .assist-body{padding:24px}}
@media(max-width:600px){header.app-header,main{padding-inline:48px}header.app-header{padding-block:15px;min-height:82px;gap:8px}.app-header .brand{font-size:14px;gap:8px;letter-spacing:-.3px}.brand .brand-icon{width:34px;height:36px;font-size:26px;border-radius:11px}.brand small{font-size:9px;letter-spacing:.3px;margin-top:5px}.grade-badge{font-size:9px;padding:5px 7px}.header-meta{gap:0}.book-intro{margin:16px 0 18px;padding:23px 20px;min-height:0;border-radius:18px;display:block}.intro-eyebrow{display:block;font-size:9px;line-height:1.9}.intro-eyebrow>span{display:table;margin-bottom:6px}.book-intro h1{font-size:36px;gap:10px;margin:13px 0 8px}.title-spark{font-size:21px}.book-intro .intro-description{font-size:12px;max-width:24ch}.intro-art{display:none}.intro-topics{gap:10px;margin-top:15px}.intro-topics span{font-size:9px}.learning-navigation{padding:18px 12px 0;border-radius:17px;margin-bottom:16px}.navigation-caption{align-items:start;flex-direction:column;gap:3px;margin-bottom:13px}.navigation-caption h2{font-size:15px}.navigation-caption>span{font-size:9px}.page-tabs{display:flex;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;padding:0 1px 8px;gap:6px}.page-tabs button{flex:0 0 76px;min-width:0;min-height:77px;scroll-snap-align:start;font-size:21px}.page-tabs small{font-size:9px}.unit-module-navigation{margin-top:10px;padding-top:13px;padding-bottom:12px}.unit-module-label{font-size:9px}.unit-module-tabs{flex-wrap:nowrap;overflow-x:auto;padding:3px 2px 8px;scrollbar-width:thin;gap:5px}.unit-module-tabs [role=tab]{flex:0 0 auto;white-space:nowrap;font-size:12px;min-height:42px;padding:9px 12px}.book-readable,.text-only .book-readable{padding:18px 14px;border-radius:17px}.book-readable h2{font-size:22px}.book-readable h3{font-size:18px}.book-readable .unit-cover{min-height:330px;padding:24px 18px}.book-readable .unit-cover h2{font-size:35px!important}.unit-cover h3{font-size:23px!important}.unit-cover p{font-size:13px}.primary,.outline{padding:12px 14px;font-size:12px}.book-note,.book-readable .book-note{font-size:11px}.page-audio{padding:14px;margin-top:20px}.page-audio select{font-size:12px;padding-left:8px}.readalong-practice{padding:20px 14px;border-radius:17px}.readalong-practice>h2{font-size:20px}.readalong-practice>select{font-size:18px}.study-extras{border-radius:17px}.study-extras .assist-body{padding:20px 14px}.spelling-card{padding:16px}.word-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.word{padding:18px 8px}.word strong{font-size:20px}.page-tabs button:last-child{font-size:17px}.review-words{grid-template-columns:1fr}.floating-page-nav button{width:35px;min-width:35px;min-height:48px;border-radius:10px;font-size:27px}.floating-page-nav #floatPrev{left:4px}.floating-page-nav #floatNext{right:4px}.floating-page-nav span{right:3px;width:37px;font-size:8px;top:calc(50% + 29px)}footer .fine{font-size:9px}.song-play-actions button{min-width:0;flex-basis:100%}.book-readable .lesson-tip{font-size:12px}}
/* Instruction audio uses a standalone play arrow with an accessible name. */
.observe-instruction .project-read-button{display:inline-grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:8px;background:transparent;color:#fff;box-shadow:none;font-size:26px;line-height:1}
.observe-instruction .project-read-button:hover{background:transparent;color:#f7d57c}
/* Keep labels readable for young learners without enlarging the textbook artwork. */
.unit-module-tabs [role=tab]{font-size:15px}.page-tabs small{font-size:11px}.unit-module-label{font-size:11px}
@media(min-width:901px){header.app-header{min-height:82px;padding-block:14px}.book-intro{min-height:190px;padding-block:22px;margin-block:22px}.intro-art svg{height:166px}.learning-navigation{padding-top:20px}.page-tabs button{min-height:72px}.unit-module-navigation{margin-top:16px}}
@media(max-width:600px){.unit-module-tabs [role=tab]{font-size:14px}.page-tabs small{font-size:10px}.unit-module-label{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.app-header{flex-wrap:wrap}.all-unit-navigation{display:flex;gap:8px;flex-wrap:wrap;width:100%;padding-top:12px;border-top:1px solid #e5edf3}.all-unit-navigation a{font-size:12px;text-decoration:none;color:#607f93;padding:5px 14px;border:1px solid transparent;border-radius:18px}.all-unit-navigation a[aria-current=page]{background:#e7f2f9;border-color:#d1e4ef;color:#2f678a;font-weight:700}.unit-navigation-status{color:#865f24;font-size:14px;max-width:1200px;margin:12px auto;padding:0 32px}@media(max-width:700px){.all-unit-navigation{gap:5px}.all-unit-navigation a{font-size:11px;padding:5px 10px}}