:root{--navy:#061b49;--blue:#073cba;--gold:#ffc400;--green:#08723d;--ink:#172033;--line:#cbd9ef}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,"Trebuchet MS",sans-serif;color:var(--ink);background:linear-gradient(#f9fbff,#edf4ff);min-height:100vh}
.academy-header{background:linear-gradient(110deg,#031538,#062765);color:#fff;padding:12px 4vw;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;border-bottom:5px solid var(--gold)}
.academy-brand{display:flex;align-items:center;gap:12px}
.academy-brand img{width:78px;height:78px;object-fit:cover;border-radius:50%;border:3px solid #fff}
.academy-brand strong{font-size:clamp(20px,3vw,35px)}
.academy-brand span,.academy-title span{display:block;color:var(--gold);font-weight:800}
.academy-title{text-align:center}
.academy-title h1{margin:0;font-size:clamp(25px,4vw,48px)}
.academy-nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.academy-nav a{background:#0b50c9;color:#fff;text-decoration:none;padding:11px 14px;border-radius:12px;border:2px solid #fff;font-weight:800}
.academy-nav a:hover,.academy-nav a:focus{background:var(--gold);color:#071b47}
.academy-shell{width:min(1500px,96%);margin:22px auto}
.map-hero,.lesson-intro{background:#fff;border:2px solid #f2b500;border-radius:18px;padding:24px;box-shadow:0 10px 28px #18366c18}
.map-hero{text-align:center}
.map-hero h2,.lesson-intro h2{color:var(--blue);margin:0 0 8px;font-size:clamp(27px,4vw,44px)}
.progress-box{display:flex;gap:18px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:15px}
.progress-track{width:min(560px,80vw);height:20px;background:#dfe8f8;border-radius:99px;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(90deg,#10a651,#ffd000);width:0;transition:.5s}
.level{margin-top:26px}
.level-heading{background:linear-gradient(90deg,#073b9f,#46149e);color:#fff;padding:14px 20px;border-radius:14px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.level-heading h2{margin:0}
.lesson-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:16px;margin-top:16px}
.lesson-card{background:#fff;border:2px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 7px 18px #13367114;display:flex;flex-direction:column}
.lesson-card img{width:100%;aspect-ratio:16/9;object-fit:cover}
.lesson-card .card-body{padding:15px;display:flex;flex:1;flex-direction:column}
.lesson-card h3{color:var(--blue);margin:0 0 8px}
.lesson-card p{margin:0 0 14px;line-height:1.45}
.lesson-card a,.lesson-card button,.primary-btn{margin-top:auto;display:inline-block;text-align:center;background:var(--blue);color:#fff;border:0;border-radius:9px;padding:11px 14px;font-weight:800;text-decoration:none;cursor:pointer}
.lesson-card.coming{filter:saturate(.7)}
.lesson-card.coming button{background:#75829a;cursor:not-allowed}
.lesson-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,.8fr);gap:20px;align-items:start}
.lesson-main{display:grid;gap:18px;align-content:start;grid-auto-rows:max-content}
.lesson-intro{display:grid;grid-template-columns:130px 1fr;align-items:center}
.lesson-intro img{width:115px;height:115px;border-radius:50%;object-fit:cover;border:4px solid #ffbf00}
.story-card,.activity-card,.tool-card,.side-card{background:#fff;border:2px solid var(--line);border-radius:16px;overflow:hidden}
.card-title{margin:0;background:linear-gradient(90deg,#0d319d,#0752d1);color:#fff;padding:12px 16px}
.story-body{display:grid;grid-template-columns:minmax(220px,.9fr) 1.5fr}
.story-copy{padding:18px;font-size:18px;line-height:1.55}
.story-photo{width:100%;height:100%;min-height:300px;object-fit:cover}
.activity-card{padding-bottom:18px}
.activity-card .card-title{background:linear-gradient(90deg,#075529,#098b4b)}
.choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:16px}
.choice{border:2px solid var(--line);border-radius:12px;padding:13px;background:#f9fbff;font-size:16px;font-weight:700;cursor:pointer;text-align:left}
.choice:hover{border-color:#1f65db}
.choice.correct{background:#e0f8e8;border-color:#079343}
.choice.wrong{background:#ffe5e4;border-color:#e92e2a}
.feedback{text-align:center;font-size:18px;font-weight:800;min-height:24px;color:#075c31}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.lesson-awards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lesson-awards .side-card{height:100%}
.certificate-card{display:flex;flex-direction:column;text-align:center}
.certificate-card p{margin:0 0 14px;line-height:1.45}
.certificate-card .primary-btn{margin-top:auto}
.tool-card{padding:17px;text-align:center}
.tool-card h3{color:var(--blue)}
.tool-card button{display:block;width:100%;background:#073fc3;color:#fff;padding:10px;border-radius:8px;border:0;font-weight:800;cursor:pointer}
.lesson-side{display:grid;align-content:start;gap:16px}
.side-card{padding:16px}
.side-card h3{margin:-16px -16px 15px;background:#3514a6;color:#fff;padding:12px 16px}
.progress-list{list-style:none;padding:0;margin:0}
.progress-list li{padding:8px;border-bottom:1px solid #dde5f2}
.progress-list .current{background:#fff5ca;border:1px solid #e5b900;border-radius:8px}
.badge{text-align:center}
.badge-medal{width:145px;height:145px;margin:auto;border-radius:50%;background:radial-gradient(circle,#e9fbff 45%,#073ba3 46% 61%,#ffd000 62% 70%,#08327e 71%);display:grid;place-items:center}
.badge-medal img{width:83px;height:83px;border-radius:50%;object-fit:cover}
.site-footer p {margin: 4px 0;}
.site-footer a {color: #fff;font-weight: 800;}
.site-footer {margin-top:44px;padding:28px 8px; background: var(--navy);color: #dbeaf6;text-align: center;}
.lesson-footer-nav{display:flex;justify-content:space-between;gap:12px;margin:18px 0}
.lesson-footer-nav a{background:#093fc3;color:#fff;padding:12px 18px;border-radius:10px;text-decoration:none;font-weight:800}
.modal{position:fixed;inset:0;background:#03102ddd;display:none;align-items:center;justify-content:center;padding:18px;z-index:20}
.modal.open{display:flex}
.modal-panel{background:#fff;width:min(760px,96vw);max-height:92vh;overflow:auto;border-radius:18px;padding:22px;position:relative}
.modal-close{position:absolute;right:12px;top:10px;border:0;background:#e52b28;color:#fff;width:38px;height:38px;border-radius:50%;font-size:22px;cursor:pointer}
.puzzle-board{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;aspect-ratio:16/9;background:#071a40}
.puzzle-piece{border:0;background-size:300% 300%;filter:brightness(.18);cursor:pointer}
.puzzle-piece.revealed{filter:none}
.certificate{border:12px double #e5b600;padding:35px;text-align:center;background:#fffdf2}
.certificate h2{color:#073fc3;font-size:34px}
.certificate .name{font-family:cursive;font-size:42px}
.toast{position:fixed;right:18px;bottom:18px;background:#063f22;color:white;padding:14px 20px;border-radius:10px;display:none;z-index:30}
.toast.show{display:block}
.lesson-layout{gap:16px}
.lesson-main{gap:10px}
.lesson-intro{grid-template-columns:110px 1fr;padding:14px 18px}
.lesson-intro img{width:96px;height:96px}
.lesson-intro p{margin:0 0 6px;line-height:1.4}
.card-title{padding:9px 14px}
.story-copy{padding:12px 15px;line-height:1.45}
.story-copy p{margin:0 0 8px}
.story-copy p:last-child{margin-bottom:0}
.story-photo{min-height:260px}
.activity-card{padding-bottom:8px}
.activity-card>h3{margin:10px 0 0!important;padding:0 12px!important}
.choice-grid{gap:9px;padding:10px 12px}
.choice{padding:11px}
.feedback{min-height:20px;margin:0}
.tools,.lesson-awards{gap:10px}
.tool-card{padding:12px}
.tool-card h3{margin:0 0 7px}
.tool-card p{margin:0 0 10px;line-height:1.35}
.lesson-side{gap:12px}
@media(max-width:950px){.academy-header{grid-template-columns:1fr;text-align:center}
.academy-brand,.academy-nav{justify-content:center}
.academy-title{order:-1}
.lesson-layout{grid-template-columns:1fr}
.story-body{grid-template-columns:1fr}
.story-photo{max-height:430px}
.tools{grid-template-columns:1fr 1fr}
.lesson-awards{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){.academy-brand img{width:58px;height:58px}
.academy-nav a{padding:8px}
.lesson-intro{grid-template-columns:80px 1fr}
.lesson-intro img{width:70px;height:70px}
.choice-grid,.tools{grid-template-columns:1fr}
.lesson-awards{grid-template-columns:1fr}
.academy-shell{width:94%}
.story-copy{font-size:16px}
}
@media print{.academy-header,.lesson-footer-nav,.modal-close,.primary-btn{display:none!important}
.modal{position:static;display:block;background:#fff}
.modal-panel{max-height:none}
.certificate{page-break-inside:avoid}
}