/* Seven chapter gateways together on desktop; native swipe on phones. */
body[data-screen=grade9] .chapter-map{
 display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));
 gap:12px 28px;max-width:1500px;overflow:visible;scroll-snap-type:none;padding:5px 15px 10px;
 position:relative;background:radial-gradient(ellipse at 50% 60%,#3769493b,transparent 72%);
}
body[data-screen=grade9] .chapter-map:before{content:'';position:absolute;inset:20% 9% 22%;border:1px dashed #9baf7055;border-radius:50%;transform:rotate(-9deg);pointer-events:none}
body[data-screen=grade9] .chapter-node{
 grid-column:span 3;flex:none;width:100%;height:100%;max-height:100%;min-height:0;
 border:0;border-radius:0;background:none;box-shadow:none;padding:0 12px;justify-content:flex-start;
 position:relative;isolation:isolate;overflow:visible;transition:filter .2s,transform .2s;
}
body[data-screen=grade9] .chapter-node:nth-child(n+5){grid-column:span 4}
body[data-screen=grade9] .chapter-node:before{content:'';position:absolute;inset:10% 0 0;border-radius:50%;background:radial-gradient(ellipse,#91c39a12,transparent 70%);z-index:-1;opacity:.5;transition:opacity .2s}
body[data-screen=grade9] .chapter-node:hover{transform:translateY(-4px);filter:brightness(1.16)}
body[data-screen=grade9] .chapter-node:hover:before{opacity:1}
body[data-screen=grade9] .portal-art{width:100%;height:clamp(90px,15dvh,175px);display:flex;align-items:center;justify-content:center;flex-shrink:1;min-height:65px;filter:saturate(.65);transition:filter .2s}
.portal-art img{width:100%;height:100%;object-fit:contain;display:block}
body[data-screen=grade9] .chapter-node>span:not(.portal-art){margin-top:-3px;width:100%;display:flex;flex-direction:column;align-items:center;min-height:0}
body[data-screen=grade9] .chapter-node small{font-size:11px;letter-spacing:1.5px;color:#a8c1a3;line-height:1.4}
body[data-screen=grade9] .chapter-node strong{font-size:clamp(17px,1.2vw,23px);line-height:1.35;margin:5px 0;max-width:370px;color:#d4dfbd}
body[data-screen=grade9] .chapter-node i{font-size:12px;color:#8fae91;line-height:1.5}
body[data-screen=grade9] .chapter-node .portal-action{display:flex;align-items:center;gap:12px;border-top:1px solid #8ba27155;font-size:10px;letter-spacing:1px;padding:6px 12px 0;margin:8px 0 0;color:#b6c79b;line-height:1.5}
.portal-action>span{font-size:17px}
body[data-screen=grade9] .chapter-node.available{border:0;background:none;box-shadow:none}
body[data-screen=grade9] .chapter-node.available:before{opacity:1;background:radial-gradient(ellipse,#d9b96928,transparent 70%)}
body[data-screen=grade9] .chapter-node.available .portal-art{filter:drop-shadow(0 0 13px #d5b65c55)}
body[data-screen=grade9] .chapter-node.available strong{color:#f0d38e}
body[data-screen=grade9] .chapter-node.available .portal-action{color:#f1d28b;border-color:#c0a45d}
body[data-screen=grade9] .chapter-controls{display:none}
body[data-screen=grade9] .guide-strip{padding:9px 18px;margin-top:4px}
body[data-screen=grade9] .guide-strip p{font-size:13px}
body[data-screen=grade9] .guide-strip .mascot{width:28px;height:28px;font-size:25px}
@media(min-width:901px) and (max-height:760px){
 body[data-screen=grade9] .portal-art{height:13dvh;min-height:55px}
 body[data-screen=grade9] .chapter-map{gap:8px 20px}
 body[data-screen=grade9] .chapter-node strong{font-size:17px;margin:3px 0}
 body[data-screen=grade9] .chapter-node i{font-size:11px}
 body[data-screen=grade9] .chapter-node .portal-action{margin-top:5px;padding-top:4px;font-size:9px}
}
@media(max-width:900px){
 body[data-screen=grade9] .chapter-map{display:flex;gap:18px;padding:8px 10px 18px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;align-items:stretch;touch-action:pan-x pinch-zoom}
 body[data-screen=grade9] .chapter-map:before{display:none}
 body[data-screen=grade9] .chapter-node{flex:0 0 calc(100% - 25px);height:100%;max-height:none;padding:15px 20px;justify-content:center;scroll-snap-align:start;scroll-snap-stop:always}
 body[data-screen=grade9] .portal-art{height:clamp(130px,26dvh,260px);min-height:100px;flex-shrink:1}
 body[data-screen=grade9] .chapter-node strong{font-size:26px;line-height:1.4;margin:10px 0;max-width:430px}
 body[data-screen=grade9] .chapter-node small{font-size:12px}
 body[data-screen=grade9] .chapter-node i{font-size:14px}
 body[data-screen=grade9] .chapter-node .portal-action{font-size:12px;margin-top:17px;padding-top:11px}
 body[data-screen=grade9] .chapter-node:hover{transform:none}
 body[data-screen=grade9] .chapter-controls{display:grid;grid-template-columns:44px 1fr 44px;gap:5px;max-width:500px}
 .chapter-controls>button{min-height:40px;height:40px;width:40px;padding:0;border:1px solid #b7ac6e88;border-radius:50%;background:#365543;color:#e5d19a;font-size:27px;line-height:1;box-shadow:none}
 .chapter-controls .chapter-dots{gap:0}
 .chapter-controls .chapter-dots button{width:30px;height:36px;border:0;border-radius:0;padding:0;background:transparent;font-size:0;display:grid;place-items:center}
 .chapter-dots button>span{width:7px;height:7px;border-radius:50%;background:#64826d;transition:width .2s,background .2s}
 .chapter-dots button.active>span{width:23px;height:6px;background:#d9bc73;border-radius:5px;box-shadow:0 0 9px #d9bc7340}
 #chapter-position{font-size:11px;color:#91ad93;letter-spacing:.4px}
 body[data-screen=grade9] .guide-strip{display:none}
}
@media(max-width:600px) and (max-height:740px){
 body[data-screen=grade9] .portal-art{height:24dvh;min-height:80px}
 body[data-screen=grade9] .chapter-node{padding:8px 12px}
 body[data-screen=grade9] .chapter-node strong{font-size:22px;margin:7px 0}
 body[data-screen=grade9] .chapter-node .portal-action{margin-top:10px;padding-top:7px}
}
@media print{body[data-screen=grade9] .chapter-map{display:grid;grid-template-columns:repeat(2,1fr)}body[data-screen=grade9] .chapter-node,body[data-screen=grade9] .chapter-node:nth-child(n+5){grid-column:auto;height:300px}}

