/* Single showcase with simultaneous lesson list on large screens. */
body[data-screen=grade9] #screen{height:calc(100dvh - var(--hud-height));min-height:0;display:flex;flex-direction:column;padding:18px 28px;max-width:none}
body[data-screen=grade9] .screen-heading{margin-bottom:16px;flex-shrink:0}
body[data-screen=grade9] .screen-heading h1{font-size:clamp(28px,2.5vw,40px);margin-bottom:0}
.chapter-select-layout{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:32px}
.chapter-showcase{min-height:0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 45%,#48714c22,transparent 72%);position:relative}
.chapter-stage{width:100%;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;position:relative;touch-action:pan-y pinch-zoom}
.selected-portal{width:100%;height:100%;min-height:0;padding:8px 60px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;animation:portal-enter .3s ease-out}
.portal-status{font-size:12px;letter-spacing:2px;color:#9db89d;margin:0 0 7px;flex-shrink:0}
.portal-open .portal-status{color:#e2c47e}
.hero-portal-art{flex:1;min-height:80px;max-height:390px;width:100%;position:relative}
.hero-portal-art img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 20px #0003)}
.portal-open .hero-portal-art img{filter:drop-shadow(0 0 22px #d6b56233)}
.selected-chapter-number{font-size:12px;letter-spacing:2px;color:#a9bd9e;margin:8px 0 10px}
.selected-portal h2{font-size:clamp(25px,2.2vw,37px);line-height:1.35;margin:0;max-width:660px;color:#dce6c6}
.portal-open h2{color:#eacf92}
.selected-chapter-era{font-size:14px;color:#97b39b;margin:14px 0 5px}.selected-chapter-era span{padding:0 10px;color:#c3b978}
.chapter-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:46px;height:58px;display:grid;place-items:center;background:#26483d99;border:1px solid #a6ad6e88;color:#e3cd91;border-radius:8px;font:38px/1 var(--serif);cursor:pointer;transition:background .2s,box-shadow .2s}
.chapter-arrow:hover{background:#6e714133;box-shadow:0 0 22px #d2b46e33}
.arrow-prev{left:4px}.arrow-next{right:4px}
.selector-dots{display:flex;align-items:center;justify-content:center;gap:1px;flex-shrink:0;margin-top:9px}
.selector-dots button{border:0;background:none;width:34px;height:32px;display:grid;place-items:center;padding:0;cursor:pointer}
.selector-dots span{display:block;width:7px;height:7px;border-radius:50%;background:#577a68;transition:width .2s,background .2s}
.selector-dots .active span{width:24px;height:6px;border-radius:6px;background:#dec17b;box-shadow:0 0 12px #dac07944}
.selector-hint{font-size:12px;color:#829e87;margin:4px 0 0;flex-shrink:0}
.show-chapter-lessons{display:none}
.selected-lessons{display:flex;flex-direction:column;min-height:0;padding:25px;border:1px solid #ad9f6655;background:linear-gradient(135deg,#21413866,#102c30);border-radius:10px}
.selected-lessons>header{flex-shrink:0;padding-bottom:16px;border-bottom:1px solid var(--line)}
.selected-lessons h2{font-size:29px;margin:0 0 7px}.selected-lessons header .eyebrow{font-size:12px;margin-bottom:8px}.selected-lessons header>span{font-size:13px;color:#94ae96}
#selected-lessons-list{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;overflow:auto}
.selected-lessons .lesson-entry{padding:14px 8px;min-height:0;flex:0 1 auto}
.selected-lessons .lesson-entry strong{font-size:16px;line-height:1.6}
.selected-lessons .lesson-entry small{font-size:12px;line-height:1.5}
.selected-lessons .lesson-entry.available{margin-top:9px;padding:14px 10px}
.selected-lessons .lesson-number{font-size:23px}
.chapter-learning-note{font-size:12px;color:#809e87;line-height:1.7;margin:14px 0 0;flex-shrink:0}
.chapter-sheet{width:min(640px,100%);max-height:calc(100dvh - var(--hud-height) - 10px);border-radius:18px 18px 0 0;padding:18px 22px;margin:auto auto 0;animation:sheet-rise .25s ease-out}
.chapter-sheet>header{display:flex;gap:16px;justify-content:space-between;align-items:start}
.chapter-sheet h2{font-size:24px;line-height:1.4}
.chapter-sheet .lesson-entry{min-height:70px;padding:17px 4px}
.chapter-sheet .lesson-entry strong{font-size:16px}
.chapter-sheet .lesson-entry small{font-size:13px}
.sheet-handle{width:42px;height:4px;border-radius:4px;background:#8da78b66;margin:0 auto 20px}
@keyframes portal-enter{from{opacity:.5;transform:translateX(12px)}to{opacity:1;transform:none}}
@keyframes sheet-rise{from{transform:translateY(30px);opacity:.6}to{transform:none;opacity:1}}
@media(min-width:901px) and (max-height:780px){
 body[data-screen=grade9] #screen{padding:12px 24px}
 body[data-screen=grade9] .screen-heading{margin-bottom:10px}
 body[data-screen=grade9] .screen-heading .back-link{margin-bottom:4px}
 body[data-screen=grade9] .screen-heading .eyebrow{font-size:11px}
 body[data-screen=grade9] .screen-heading h1{font-size:30px}
 .selected-lessons{padding:17px 20px}.selected-lessons>header{padding-bottom:9px}
 .selected-lessons h2{font-size:24px}.selected-lessons .lesson-entry{padding:10px 6px}
 .selected-lessons .lesson-entry.available{padding:10px 8px}
 .selected-lessons .lesson-entry strong{font-size:15px;line-height:1.5}
 .selected-lessons .lesson-entry small{font-size:12px}
 .chapter-learning-note{margin-top:8px;font-size:11px}
 .selected-portal h2{font-size:28px}
 .selected-chapter-number{margin:4px 0 6px}.selected-chapter-era{margin-top:10px}
 .portal-status{font-size:11px}.selector-hint{font-size:11px}
}
@media(max-width:1100px) and (min-width:901px){
 .chapter-select-layout{gap:20px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .selected-portal{padding-left:50px;padding-right:50px}.selected-portal h2{font-size:27px}
 .selected-lessons{padding:18px}.selected-lessons .lesson-entry strong{font-size:15px}
}
@media(max-width:900px){
 .chapter-select-layout{display:flex;flex-direction:column;gap:0}
 .selected-lessons{display:none}.chapter-showcase{flex:1;width:100%;min-height:0}
 .show-chapter-lessons{display:inline-flex;flex-shrink:0;margin:13px 0 6px;min-width:230px}
 .hero-portal-art{max-height:400px}
 .selected-portal{max-width:700px}
 .selector-hint{font-size:12px}
}
@media(max-width:600px){
 body[data-screen=grade9] #screen{height:calc(100dvh - var(--hud-height) - 70px - env(safe-area-inset-bottom));padding:12px 12px 14px}
 body[data-screen=grade9] .screen-heading{margin-bottom:7px;gap:8px}
 body[data-screen=grade9] .screen-heading h1{font-size:28px}
 body[data-screen=grade9] .screen-heading .back-link{font-size:12px;margin-bottom:5px}
 body[data-screen=grade9] .screen-heading .eyebrow{font-size:10px;letter-spacing:.5px;margin-bottom:5px}
 body[data-screen=grade9] .screen-heading>[data-index]{font-size:12px;padding:5px 10px;min-height:34px}
 .selected-portal{padding:5px 38px}.hero-portal-art{min-height:65px;max-height:270px}
 .chapter-arrow{width:33px;height:47px;font-size:30px}.arrow-prev{left:0}.arrow-next{right:0}
 .portal-status{font-size:10px;letter-spacing:1px;margin-bottom:4px}
 .selected-chapter-number{font-size:11px;margin:6px 0}
 .selected-portal h2{font-size:24px;line-height:1.4}
 .selected-chapter-era{font-size:12px;margin:9px 0 0}
 .selector-dots{margin-top:5px}.selector-dots button{width:30px;height:25px}
 .show-chapter-lessons{font-size:14px;margin:9px 0 4px;min-height:42px}
 .selector-hint{font-size:11px;margin:4px 0 0}
 .chapter-sheet{padding:15px 18px;max-height:calc(100dvh - var(--hud-height) - 8px)}
}
@media(max-width:600px) and (max-height:740px){
 .selected-portal h2{font-size:21px}.selected-chapter-era{margin-top:6px}
 .show-chapter-lessons{min-height:37px;margin-top:6px;font-size:13px}
 .selector-hint{display:none}.hero-portal-art{max-height:24dvh}
}
@media(prefers-reduced-motion:reduce){.selected-portal,.chapter-sheet{animation:none}.selector-dots span,.chapter-arrow{transition:none}}
@media print{body[data-screen=grade9] #screen{height:auto}.chapter-select-layout{display:block}.selected-lessons{display:block}.chapter-arrow,.selector-dots,.selector-hint,.show-chapter-lessons{display:none}}