*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#020812;color:#fff4ca;font-family:Georgia,"Times New Roman",serif}body{min-height:100dvh;background-image:linear-gradient(rgba(1,7,17,.30),rgba(1,7,17,.72)),url("assets/earth/space-background.png"),radial-gradient(circle at 50% 12%,#123b6a,#020812 70%);background-position:center;background-size:cover;background-attachment:fixed}.learning-hub{width:min(1500px,100%);margin:0 auto;padding:clamp(14px,2vw,28px)}.hub-topbar{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:14px 18px;border:1px solid rgba(241,199,100,.7);border-radius:18px;background:rgba(3,11,24,.9);backdrop-filter:blur(12px)}.hub-kicker,.section-kicker{display:block;color:#f3cc69;font:800 12px Arial,sans-serif;letter-spacing:.16em}.hub-topbar h1{margin:2px 0 0;font-size:clamp(30px,4vw,54px);line-height:1}.return-button{border:1px solid #f0c663;border-radius:999px;background:linear-gradient(#9b3f23,#6f2818);color:#fff0c9;padding:11px 18px;font:800 16px Georgia,serif;cursor:pointer}.hub-intro{margin:18px auto 8px;text-align:center;color:#e8eef8;font:clamp(15px,1.4vw,19px) Arial,sans-serif}.learning-section{margin-top:20px;padding:18px;border:1px solid rgba(94,159,224,.55);border-radius:22px;background:rgba(3,11,24,.83);backdrop-filter:blur(10px)}.geography-section{border-color:rgba(92,190,142,.55)}.section-heading{display:flex;align-items:center;gap:13px;margin-bottom:15px}.section-heading h2{margin:0;font-size:clamp(25px,3vw,38px)}.section-icon{position:relative;width:54px;height:54px;flex:0 0 54px;border:1px solid rgba(244,205,111,.65);border-radius:50%;background:#0c2f5b}.atom-icon i{position:absolute;left:23px;top:23px;width:8px;height:8px;border-radius:50%;background:#f4ca62}.atom-icon span{position:absolute;inset:10px;border:2px solid #74b8ff;border-radius:50%}.atom-icon span:nth-child(1){transform:rotate(60deg)}.atom-icon span:nth-child(2){transform:rotate(-60deg)}.globe-icon{background:radial-gradient(circle at 35% 30%,#3d95c9,#0e416d 56%,#08213a)}.globe-icon:before,.globe-icon:after,.globe-icon span{content:"";position:absolute;border:1px solid rgba(222,244,255,.8);border-radius:50%}.globe-icon:before{inset:7px 17px}.globe-icon:after{inset:7px}.globe-icon span{left:6px;right:6px;top:24px;height:1px;border-radius:0}.module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.geography-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.module-card{min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;padding:17px;border:1px solid rgba(240,198,99,.62);border-radius:18px;background:linear-gradient(180deg,rgba(18,50,91,.96),rgba(5,20,42,.96));color:#fff2c8;text-align:center;cursor:pointer;transition:transform .18s,border-color .18s,background .18s}.geography-section .module-card{background:linear-gradient(180deg,rgba(20,70,76,.96),rgba(4,29,39,.96))}.module-card:hover,.module-card:focus-visible{transform:translateY(-3px);border-color:#ffe08b;background:linear-gradient(180deg,rgba(29,79,132,.98),rgba(6,29,58,.98));outline:3px solid rgba(255,215,105,.22);outline-offset:2px}.geography-section .module-card:hover,.geography-section .module-card:focus-visible{background:linear-gradient(180deg,rgba(32,100,89,.98),rgba(5,43,46,.98))}.module-card strong{font-size:clamp(20px,2vw,28px)}.module-card>span:not(.module-visual){min-height:42px;color:#e1eaf5;font:15px/1.35 Arial,sans-serif}.module-card em{margin-top:auto;border-radius:999px;background:rgba(225,172,47,.2);color:#ffe08a;padding:6px 11px;font:800 13px Arial,sans-serif;font-style:normal;letter-spacing:.03em}.module-visual{height:82px;width:150px;display:flex;align-items:center;justify-content:center;position:relative}.periodic-visual{display:grid;grid-template-columns:repeat(4,34px);gap:4px}.periodic-visual b{display:grid;place-items:center;height:38px;border:1px solid #9cd1ff;border-radius:7px;background:#1f5a94;color:#fff7d2;font-size:17px}.molecule-visual i{position:absolute;width:34px;height:34px;border-radius:50%;background:#f4f1df;border:3px solid #bdd7ef;box-shadow:0 0 14px rgba(120,190,255,.35)}.molecule-visual i:nth-child(1){width:48px;height:48px;background:#df574b;border-color:#ff958b}.molecule-visual i:nth-child(2){transform:translate(-52px,30px)}.molecule-visual i:nth-child(3){transform:translate(52px,30px)}.molecule-visual:before,.molecule-visual:after{content:"";position:absolute;width:62px;height:7px;background:#a6c4df;top:51px;transform-origin:center}.molecule-visual:before{transform:translateX(-25px) rotate(-29deg)}.molecule-visual:after{transform:translateX(25px) rotate(29deg)}.earth-visual{width:82px;height:82px;border-radius:50%;background:radial-gradient(circle at 38% 34%,#61a45d 0 10%,transparent 11%),radial-gradient(circle at 62% 58%,#68a85f 0 16%,transparent 17%),radial-gradient(circle at 42% 68%,#78b467 0 10%,transparent 11%),radial-gradient(circle at 35% 30%,#57b5de,#17619a 60%,#0a3158);box-shadow:inset -13px -9px 22px rgba(0,0,0,.42),0 0 18px rgba(87,181,222,.35)}.states-visual{width:132px;height:72px;clip-path:polygon(2% 20%,18% 9%,34% 15%,46% 7%,59% 18%,75% 13%,96% 30%,88% 54%,74% 62%,60% 87%,47% 73%,34% 80%,22% 62%,8% 66%);background:linear-gradient(135deg,#e8d29a,#bd8d3f);color:#17345a;font:900 22px Arial,sans-serif;letter-spacing:.12em}.relief-visual{width:142px;height:75px;overflow:hidden;border-radius:12px;background:linear-gradient(#285c87 0 38%,#507a4d 39% 64%,#ad8d56 65%)}.relief-visual i{position:absolute;bottom:10px;width:56px;height:50px;background:linear-gradient(135deg,#435d43,#c5b17d);clip-path:polygon(50% 0,100% 100%,0 100%)}.relief-visual i:nth-child(1){left:10px}.relief-visual i:nth-child(2){left:48px;height:66px}.relief-visual i:nth-child(3){right:6px;height:42px}.north-america-visual{filter:saturate(.9)}.ancient-visual{font-size:62px;color:#f3cc69;text-shadow:0 0 15px rgba(243,204,105,.35)}.hub-footer{text-align:center;color:#b8c8da;font:13px Arial,sans-serif;padding:18px 8px 4px}@media(max-width:1050px){.geography-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.learning-hub{padding:8px}.hub-topbar{padding:12px}.hub-topbar h1{font-size:29px}.return-button{padding:9px 12px;font-size:13px}.learning-section{padding:12px}.module-grid,.geography-grid{grid-template-columns:1fr}.module-card{min-height:184px}.hub-intro{padding:0 8px}.section-icon{width:46px;height:46px;flex-basis:46px}.module-card>span:not(.module-visual){min-height:0}}

/* Math Lab section — matches the science/geography card system. */
.math-section{border-color:rgba(240,198,99,.55)}
.math-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.math-section .module-card{background:linear-gradient(180deg,rgba(58,46,96,.96),rgba(18,10,42,.96))}
.math-section .module-card:hover,.math-section .module-card:focus-visible{background:linear-gradient(180deg,rgba(80,64,132,.98),rgba(26,15,58,.98))}
.sum-icon{display:grid;grid-template-columns:1fr 1fr;place-items:center;background:radial-gradient(circle at 35% 30%,#5c4a9c,#241a4d 60%,#120a24);font:800 15px Georgia,serif;color:#ffd875}
.sum-icon b{line-height:1}
.op-visual{display:flex;gap:14px;align-items:center;justify-content:center}
.op-visual i{width:52px;height:52px;display:grid;place-items:center;border-radius:12px;border:1px solid #b8a4ff;background:#2f2560;color:#ffe9a8;font:800 27px Georgia,serif;font-style:normal}
.frac-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#ffe9a8;font:800 26px Georgia,serif}
.frac-visual u{display:block;width:42px;height:3px;background:#ffd875;margin:3px 0}
.pct-visual{font:800 56px Georgia,serif;color:#ffd875;text-shadow:0 0 15px rgba(243,204,105,.35)}
.ruler-visual{width:150px;height:56px;border:2px solid #b8a4ff;border-radius:8px;background:#2f2560;display:flex;align-items:flex-end;justify-content:space-around;padding-bottom:0}
.ruler-visual i{width:3px;background:#ffd875;border-radius:2px}
.ruler-visual i:nth-child(1){height:30px}.ruler-visual i:nth-child(2){height:18px}
.ruler-visual i:nth-child(3){height:30px}.ruler-visual i:nth-child(4){height:18px}
.mixed-visual{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mixed-visual i{width:38px;height:38px;display:grid;place-items:center;border-radius:9px;border:1px solid #b8a4ff;background:#2f2560;color:#ffe9a8;font:800 19px Georgia,serif;font-style:normal}
@media(max-width:1050px){.math-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.math-grid{grid-template-columns:1fr}}