/* Oase Modern: calm surfaces, accessible contrast, one clear action. */
:root{--pine:#153f3b;--gold:#e8b65a;--paper:#f7f8f2;--muted:#556c68;--accent:#087f78;--aqua:#24b8a6;--line:#d8e5e0;--soft:#eaf4f0;color-scheme:light;font-family:Segoe UI,system-ui,sans-serif}
body{color:#183f3b}button,input,select{font-family:inherit}h1,h2,h3,#panelTitle,.lesson-role{font-family:Segoe UI,system-ui,sans-serif;letter-spacing:-.025em}button{background:#fff;color:#153f3b;border:1px solid var(--line);border-radius:12px;font-weight:600;min-height:44px;box-shadow:none;transition:background .15s,border-color .15s,transform .15s}button:hover{background:#eaf6f2;border-color:#70b8ac;box-shadow:none}button:active{transform:translateY(1px)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #087f78;outline-offset:3px}button:disabled{opacity:.55;transform:none}.primary,#start{background:#087f78;color:#fff;border:1px solid #087f78;box-shadow:0 3px 10px #153f3b12}.primary:hover,#start:hover{background:#066962;border-color:#066962}button.selected,[aria-pressed=true].lesson-option{background:#e1f5ee;border-color:#087f78;color:#153f3b}
header{inset:20px 24px auto;pointer-events:none}.brand{font-size:27px;letter-spacing:4px;text-shadow:0 2px 10px #173e3b90;color:#fff}.brand small{color:#eff8f3;font-size:8px;letter-spacing:2px}header nav{pointer-events:auto;position:fixed;right:22px;bottom:20px;display:flex;gap:5px;padding:5px;background:#153f3bf5;border:1px solid #ffffff32;border-radius:15px;box-shadow:0 5px 20px #133c3b24;backdrop-filter:blur(8px)}nav button{font-size:14px;min-height:44px;padding:10px 13px;color:#fff;background:transparent;border:0;border-radius:10px}nav button:hover{background:#ffffff19;color:#fff}nav span,#questBadge{background:#e8b65a;color:#173f3b}#missionTracker{left:24px;top:88px;width:330px;max-width:calc(100vw - 48px);padding:11px 13px;background:#153f3bf5;border:1px solid #ffffff35;border-radius:14px;backdrop-filter:blur(8px);box-shadow:0 5px 20px #133c3b22}#missionTracker h3{font-size:15px;color:#fff;font-weight:650}#missionTracker p{font-size:12px;color:#d7ece5}#missionTracker #trackBtn{background:#ffffff0c;border-color:#ffffff35;color:#e8b65a;border-radius:10px}#missionTracker #trackBtn:focus-visible{outline-color:#e8b65a}
#mapFrame{top:20px;bottom:auto;right:22px;padding:9px;width:160px;border-radius:18px;background:#153f3bf5;border:1px solid #ffffff40;box-shadow:0 5px 20px #133c3b22}#map{width:140px;height:140px;border-radius:11px}.mapcaption{color:#e8b65a;margin-bottom:5px}.mapcaption span{color:#e4f2ed;letter-spacing:1.4px}footer{left:24px;bottom:20px;background:#153f3bdd;color:#eef8f3;font-size:11px;border:1px solid #ffffff24;max-width:calc(100vw - 510px)}#interact{background:#fff;color:#153f3b;border:2px solid #24b8a6;font-weight:650;box-shadow:0 4px 18px #153f3b20}#toast{background:#153f3b;color:#fff;border-color:#4d9d8e;font-size:15px}.destination-marker{background:#fff5da;color:#153f3b;border-color:#e8b65a;box-shadow:0 4px 14px #153f3b25}.marker{background:#f7fbf8;color:#153f3b;border-color:#a9cfc3}.marker.done{background:#153f3b;color:#fff}
#panel{background:#103c3b66;backdrop-filter:blur(5px)}#panel section{background:#f7f8f2;border:1px solid #ffffffc0;border-radius:20px;box-shadow:0 18px 70px #102f3b35}#panel section:before{color:#557e75;border-color:#d8e5e0}#panelKicker{color:#08756e;font-weight:700;letter-spacing:1.5px}#panelTitle{color:#153f3b;font-weight:700;line-height:1.15}#panel .close{background:#edf3ef;color:#365e56;border:1px solid #d8e5e0;border-radius:50%;width:40px;min-height:40px;padding:0;font-size:24px;display:grid;place-items:center}#panel .close:hover{background:#dceee6}.lead,.note,.lesson-caption,.lesson-figure figcaption{color:#556c68}.card,.journey-brief-text{background:#eaf4ef;color:#224e46;border-left-color:#24b8a6}.success-card{background:#e2f4e9;color:#205a3d;border-color:#9bcbb0}.menu-grid button,.stationlist button,.class-chapter,.quest-card,.chapter-card{background:#fff;border:1px solid #d8e5e0;border-radius:15px;box-shadow:none}.class-chapter{border-top:4px solid #24b8a6}.class-chapter:nth-child(2){border-top-color:#e8b65a}.class-chapter:nth-child(3){border-top-color:#67a9bd}.class-chapter h3,.quest-card h3{color:#153f3b}.sheet-link{background:#e4f2eb;color:#15554a}
.lesson-source{background:#fff;border-color:#dce7e0;border-radius:15px}.lesson-role-card{background:#edf5ef;border-radius:12px}.lesson-context{color:#365e54}.lesson-step{color:#08756e;font-weight:700;letter-spacing:1px}.lesson-dots i{background:#dce7e1}.lesson-dots i.done{background:#48aa94}.lesson-dots i.current{background:#e8b65a}.lesson-task h3{font-family:inherit;font-weight:700;color:#153f3b;line-height:1.28}.lesson-instruction{color:#556c68}.lesson-footer{border-color:#d8e5e0}.lesson-option,.action-bank button,.action-slots button,.drag-token{background:#fff;border-color:#ccded5;color:#234b42}.lesson-option:before{color:#6e8b7f}.lesson-option.selected,.action-bank .selected,.diagram-layout .drag-token.selected{background:#e1f5ee;border-color:#087f78;outline-color:#087f78;color:#153f3b}.lesson-option.selected:before{color:#087f78}.lesson-option.correct,.diagram-layout .drag-token.placed{background:#e1f3e8;color:#20563e;border-color:#6eac8a}.lesson-feedback{color:#556c68}.lesson-feedback.hint{color:#755416}.lesson-feedback.retry{color:#9a4c23}.lesson-feedback.success{color:#17613e}.observation-info{color:#224e46}.observation-next{color:#556c68;border-color:#d8e5e0}.interview-answer{background:#eaf4ee;color:#244e43;border:1px solid #dce9e1}.interview-questions .asked{background:#e3f3ea;border-color:#72ab91}.interview-questions .asked:before{color:#08756e}.diagram-pins .picture-drop{background:#153f3b;border-color:#fff;color:white}.diagram-pins .picture-drop.filled{background:#087f78;border-color:#fff}.lesson-answers input,.lesson-practice select{background:#fff;border-color:#90baad;color:#153f3b}.lesson-waterrow,.city-budget,.city-consequence,.lesson-material{background:#e7f3ed;color:#244e43;border-color:#cadfd4}.water-reservoir i.full,.water-meter div{background:#24b8a6}.city-plans [aria-pressed=true],.city-reasons [aria-pressed=true]{background:#e0f3eb;border-color:#087f78}.lesson-map-tabs button[aria-pressed=true],.workshop-tabs button[aria-pressed=true]{background:#087f78;color:#fff}
#overlay{background:linear-gradient(90deg,#103c39ed,#103c39a8 58%,#103c3920);backdrop-filter:blur(2px)}#intro{color:#f7fbf8}#intro h1{font-family:inherit;font-weight:750;letter-spacing:-2px}#intro h1 em{color:#75dfc9;font-style:normal}#intro .lead{color:#e0eee8}.edition{color:#a6e4d3}.intro-mission{background:#ffffff0b;border-color:#ffffff25}.intro-mission p{color:#e1efe8}#intro .chips span{background:#ffffff10;border-color:#ffffff25;color:#e5f4ec}#intro details{color:#d7ebe1}#intro #reset,#classChapterStart{background:#ffffff0e;color:#f7fbf8;border:1px solid #ffffff45}#intro #reset:hover,#classChapterStart:hover{background:#ffffff20}#gardenShadowBtn{background:#153f3b;color:#fff;border-color:#82c9b5}
@media(max-height:720px){#panel.lesson-dialog #panelTitle{font-size:25px}.lesson-task h3{font-size:22px}.lesson-instruction,.lesson-feedback{font-size:16px}.observation-info{font-size:20px;line-height:1.5}}
@media(max-width:900px){header{left:16px;top:16px}.brand{font-size:24px}#missionTracker{left:16px;top:80px;width:295px;max-width:calc(100vw - 192px)}#mapFrame{right:16px;top:16px;width:142px}#map{width:122px;height:122px}header nav{right:16px;bottom:16px}nav button{padding:9px 11px;font-size:13px}footer{left:16px;max-width:calc(100vw - 440px);font-size:10px}}
@media(pointer:coarse){header nav{bottom:92px}footer{display:none}}
@media(max-width:650px){#missionTracker{top:70px;width:calc(100vw - 165px);max-width:none;padding:8px 10px}#missionTracker h3{font-size:13px}#missionTracker p{font-size:11px}#missionTracker #trackBtn{width:32px}#missionTracker{grid-template-columns:minmax(0,1fr) 32px;gap:4px}#mapFrame{width:120px;padding:7px;right:10px;top:12px}#map{width:104px;height:104px}.mapcaption{font-size:9px}.mapcaption span{font-size:6px}header nav{right:10px;max-width:calc(100vw - 20px);gap:0}nav button{font-size:12px;padding:8px 9px}.brand{font-size:23px}footer{display:none}.lesson-instruction,.lesson-feedback{font-size:15px}.observation-info{font-size:17px}.lesson-task h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Menu primary actions must retain their contrasting fill within card grids. */
.menu-grid button,.stationlist button{font-size:16px;min-height:54px;padding:14px 16px}.menu-grid button.primary,.stationlist button.primary{background:#087f78;color:#fff;border-color:#087f78}.menu-grid button.primary:hover,.stationlist button.primary:hover{background:#066962}#panel:not(.lesson-dialog):not(.world-action-dialog) section{height:auto;min-height:0;max-height:calc(100dvh - 28px)}.brand{font-family:Segoe UI,system-ui,sans-serif;font-weight:750}
/* Reserve enough space before the menu paginator measures its contents. */
#panel:not(.lesson-dialog):not(.world-action-dialog) section{height:min(620px,calc(100dvh - 28px));min-height:0}
/* Match the selected concept: separate icon buttons and a round compass map. */
header nav{background:transparent;border:0;box-shadow:none;backdrop-filter:none;padding:0;gap:9px;align-items:center}header nav button{display:flex;align-items:center;gap:9px;min-height:52px;padding:12px 17px;background:#153f3bf5;border:1px solid #72b8a48c;border-radius:14px;box-shadow:0 4px 14px #123b3a26;color:#fff;font-size:15px}header nav button:hover{background:#205650;border-color:#9bdecb}header nav button svg{width:23px;height:23px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}header nav #questsBtn{display:none}header nav #inventoryBtn{order:0}header nav #chaptersBtn{order:1}header nav #menuBtn{order:2}header nav #bagBadge{margin-left:0;width:20px;height:20px}header nav #bagBadge:empty{display:none}
#mapFrame{position:fixed;top:23px;right:24px;bottom:auto;width:170px;height:170px;padding:0;border:3px solid #e9f5edd9;border-radius:50%;background:#153f3b;box-shadow:0 4px 20px #143b3b38;overflow:visible}#map{width:164px;height:164px;border-radius:50%;display:block}.mapcaption{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#153f3b;color:#fff;border:1px solid #d7ece180;border-radius:7px;padding:3px 7px;line-height:1;font-weight:750;font-size:13px;margin:0;z-index:1}.mapcaption span{display:none}#missionTracker{border-radius:15px;border-color:#65b9a78c;box-shadow:0 4px 16px #153f3b26}#missionTracker .mission-copy{padding-left:25px;position:relative}#missionTracker .mission-copy:before{content:'◆';color:#e8b65a;position:absolute;left:0;top:0;font-size:17px}#missionTracker h3{font-size:15px;font-weight:650}#missionTracker #trackBtn{border:0;background:none;color:#e8b65a}footer{max-width:calc(100vw - 520px);background:#153f3bba}.destination-marker.offscreen{max-width:180px;min-width:0;width:auto;padding:10px 12px;font-size:13px;line-height:1.35;border-radius:12px;background:#fff7e0;border:2px solid #e8b65a}.brand{font-size:24px;letter-spacing:4px}.brand small{font-size:7px;letter-spacing:2px}
@media(max-width:900px){#mapFrame{width:142px;height:142px;top:18px;right:18px}#map{width:136px;height:136px}header nav button{min-height:48px;padding:11px 13px;font-size:14px}header nav{gap:7px}#missionTracker{max-width:calc(100vw - 195px)}}
@media(max-width:650px){#mapFrame{width:114px;height:114px;right:12px;top:18px}#map{width:108px;height:108px}header nav button{padding:10px;min-height:46px;font-size:12px;gap:6px}header nav button svg{width:20px;height:20px}header nav{gap:6px;right:12px}#missionTracker h3{font-size:13px}#missionTracker .mission-copy{padding-left:18px}#missionTracker .mission-copy:before{font-size:13px}.brand{font-size:21px}}
header nav .nav-label{display:inline;width:auto;height:auto;margin:0;background:none;border:0;border-radius:0;color:inherit;font:inherit;letter-spacing:normal}
