@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--primary:#b4d000;--dark:#050505;--dark-green:#163425;--white:#fff;--warning:#ffc107;--danger:#e53935;--success:#7cb342;--muted:#a8b4a7;--orange:#ff9747;--line:rgba(255,255,255,.12)}
*{box-sizing:border-box}body{margin:0;background:#0b140f;color:var(--white);font:14px/1.65 'DM Sans',Arial,sans-serif}button,input{font:inherit}button{cursor:pointer;color:inherit;border:0}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--primary);outline-offset:4px}button:disabled{cursor:default;opacity:.6}button{touch-action:manipulation}h1,h2,h3,p{margin:0}h1,h2,.display{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;line-height:1.02;text-transform:uppercase;letter-spacing:.2px}h1{font-size:48px}h2{font-size:30px}h3{font-size:17px;line-height:1.4}p{color:#c4cec3}strong{color:white}svg.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.app{width:100%;max-width:430px;min-height:100dvh;margin:auto;position:relative;isolation:isolate;background:#13251b;overflow:hidden;box-shadow:0 0 100px #0009}.app:before{content:'';position:absolute;z-index:-2;inset:0;background:linear-gradient(180deg,#07150c42,#0c1b12e0 680px,#102017 1000px),url('assets/plantation.jpg') center top/auto 920px no-repeat;opacity:.95}.topbar{height:88px;padding:24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff15;background:#09120b30}.school,.wordmark{background:none;padding:0;display:flex;align-items:center;gap:8px}.school{font-size:7px;letter-spacing:1px;text-align:left;line-height:1.25}.school strong{display:block;font-size:14px;letter-spacing:2px}.school-mark{font:bold 28px Georgia;color:var(--primary);border:1px solid #b4d067;border-radius:50%;width:35px;height:35px;text-align:center;line-height:35px}.school img{width:85px;height:42px;object-fit:contain}.wordmark{font:bold 21px 'Barlow Condensed',Impact;letter-spacing:1px}.wordmark span{font-size:10px;color:var(--primary)}main{padding:28px 22px 112px;min-height:calc(100dvh - 88px)}main:focus{outline:none}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2px;color:var(--primary);display:block;margin-bottom:12px}.subtitle{font-size:13px;margin-top:16px;line-height:1.7}.page-heading{margin-bottom:26px}.page-heading h1{font-size:42px;max-width:340px}.page-heading .eyebrow{margin-bottom:10px}.row,.section-label{display:flex;align-items:center;justify-content:space-between;gap:10px}.section-label{margin:25px 0 13px}.section-label h2{font:600 16px 'DM Sans',Arial;text-transform:none}.section-label small,.muted{color:var(--muted);font-size:11px}.card{background:#070c09ed;border:1px solid var(--line);border-radius:23px;padding:22px;margin-bottom:14px;box-shadow:0 8px 25px #00000012;backdrop-filter:blur(12px)}.card p{margin-top:9px;font-size:13px}.card h3 .icon{vertical-align:middle;margin-right:8px;color:var(--primary)}.card ul{padding-left:19px;color:#c4cec3;font-size:13px}.card li{margin:7px 0}.primary,.secondary{min-height:52px;border-radius:14px;padding:14px 19px;font-weight:700;display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%}.primary{background:var(--primary);color:#142000}.secondary{background:#ffffff0b;border:1px solid var(--line)}.primary:hover{background:#c9e520}.secondary:hover,.menu-card:hover{background:#233322}.chip{font-size:9px;font-weight:700;letter-spacing:.7px;background:#b4d0001a;color:#c9dd78;border:1px solid #b4d00038;padding:5px 9px;border-radius:20px;white-space:nowrap}.chip:before{content:'●';margin-right:5px}.hero{padding:16px 0 28px}.hero h1{font-size:61px;line-height:.96;margin:18px 0}.hero h1 em{font-style:normal;color:var(--primary)}.hero p{max-width:295px;font-size:12px}.hero .row{justify-content:flex-start;margin-top:19px;gap:14px}.hero .row span{font-size:10px;color:#c6d0c4}.status-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-radius:18px;overflow:hidden}.status-tile{padding:16px;background:#0b130c}.status-tile .label{display:flex;gap:7px;align-items:center;font-size:10px;color:#a9b4a4}.status-tile .icon{width:15px;height:15px;color:var(--primary)}.status-tile b{display:block;font-size:22px;font-weight:500;margin:7px 0 0;line-height:1.2}.status-tile small{font-size:10px;color:#b8c9a8}.status-card{padding:19px}.status-card .row{margin-bottom:15px}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.menu-card{background:#070d09e8;border:1px solid var(--line);border-radius:19px;padding:17px;text-align:left;min-height:111px;position:relative}.menu-card>.icon{color:var(--primary);margin-bottom:12px;width:24px;height:24px}.menu-card b{display:block;font-size:12px;font-weight:500}.menu-card .arrow{position:absolute;right:15px;top:17px;font-size:15px;color:#798773}.menu-card small{font-size:9px;color:#86947f}.feature-card{background:var(--primary);color:#132109;margin-top:14px;display:flex;align-items:center;gap:15px;text-align:left;width:100%}.feature-card p{color:#334600;font-size:11px}.feature-card .icon{width:30px;height:30px}.feature-card b{font-size:16px}.feature-card>span:last-child{margin-left:auto}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,430px);display:flex;padding:12px 9px max(12px,env(safe-area-inset-bottom));background:#08110bf5;border-top:1px solid #ffffff17;backdrop-filter:blur(20px);z-index:20}.bottom-nav button{width:20%;background:none;display:flex;flex-direction:column;align-items:center;gap:5px;min-height:48px;font-size:9px;color:#899882}.bottom-nav button.active{color:var(--primary)}.bottom-nav button.active:after{content:'';height:3px;width:14px;border-radius:5px;background:var(--primary)}.bottom-nav[hidden]{display:none}.pager{display:flex;gap:10px;margin-top:28px}.pager button{font-size:11px}.pager .secondary{width:auto;flex:1}.pager .primary{flex:1}.fact-button{margin-top:18px}.splash{display:flex;flex-direction:column;justify-content:space-between;min-height:calc(100dvh - 144px);padding:48px 0 0}.splash .display{font-size:76px;letter-spacing:-1px}.splash .welcome{font-size:18px;letter-spacing:7px;font-weight:500}.splash .to{font:italic 23px Georgia;margin:10px 0}.splash .display span{color:var(--primary)}.splash p{max-width:275px;margin-top:24px;font-size:14px}.splash-bottom{margin-top:80px}.splash-bottom>small{display:block;text-align:center;color:#bec5b5;font-size:9px;letter-spacing:2px;margin:20px 0}.orbit-mark{width:66px;height:66px;border:1px solid #b4d00088;border-radius:50%;display:grid;place-items:center;margin-bottom:32px;background:#b4d00013}.orbit-mark .icon{height:30px;width:30px;color:var(--primary)}.splash-view{padding-bottom:20px}.image-card{padding:0;overflow:hidden}.image-card img{width:100%;height:145px;object-fit:cover;display:block}.image-card .image-content{padding:20px}.note{padding:16px 18px;border-left:3px solid var(--primary);background:#b4d0000b;border-radius:0 12px 12px 0;font-size:12px;color:#cbd4be;margin:17px 0}.note.warning{border-color:var(--warning);background:#ffc1070a}.steps{counter-reset:step}.step{position:relative;margin-left:19px;padding:0 0 24px 32px;border-left:1px dashed #768444}.step:last-child{border:0}.step-num{position:absolute;left:-19px;top:0;width:36px;height:36px;border-radius:50%;background:#26391c;color:var(--primary);display:grid;place-items:center;border:1px solid #819440;font-size:12px}.step h3{padding-top:5px;font-size:14px}.step p{font-size:12px;margin-top:5px}.step-num .icon{width:17px}.diagram{padding:24px;display:flex;justify-content:center;align-items:center;gap:18px;background:#101c12;border-radius:20px;margin-bottom:22px}.tank{border:2px solid #9aae7d;border-radius:15px 15px 28px 28px;width:145px;height:210px;overflow:hidden;position:relative;background:#c5d4b80c;box-shadow:inset 10px 0 20px #ffffff05}.tank-head{height:35%;display:grid;place-items:center;font-size:10px;color:#c5d98d;border-bottom:1px dashed #8da965}.tank-fill{height:65%;background:linear-gradient(#7b903f,#354a1d);display:grid;place-items:center;font-size:11px;text-align:center}.diagram-labels{font-size:11px;max-width:112px}.diagram-labels b{display:block;color:var(--primary);font-size:28px}.em4-bottle{border:2px solid #bea34e;border-top:12px solid #e8c536;border-radius:10px 10px 20px 20px;background:#392a14;width:95px;height:140px;display:grid;place-items:center;transform:rotate(-7deg);font:bold 30px 'Barlow Condensed',Impact;color:#fff26a}.gauge{--gauge-color:var(--primary);width:224px;height:224px;border-radius:50%;margin:20px auto;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:conic-gradient(from 225deg,var(--gauge-color) calc(var(--value,32)*.75%),#263027 0 75%,transparent 0);transition:background .3s}.gauge:before{content:'';position:absolute;inset:12px;border-radius:50%;background:#090e0a}.gauge>*{position:relative}.gauge small{font-size:10px;letter-spacing:2px;color:var(--muted)}.gauge b{font:64px 'Barlow Condensed',Impact;line-height:1.2}.gauge span{font-size:11px;color:#a6b79b}.gauge .gauge-limits{position:absolute;bottom:13px;width:150px;display:flex;justify-content:space-between;font-size:10px}.sensor-status{text-align:center;font-weight:700;font-size:12px;letter-spacing:1px;color:var(--primary);margin:10px 0}.tone-success{color:var(--success)!important}.tone-warning{color:var(--warning)!important}.tone-danger{color:var(--danger)!important}.tone-orange{color:var(--orange)!important}.range-label{display:flex;justify-content:space-between;font-size:12px;align-items:center;margin-top:24px}.range-label output{font-size:18px;color:var(--primary)}input[type=range]{width:100%;accent-color:var(--primary);height:40px;cursor:pointer;margin:8px 0}.range-ends{display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.ph-scale{height:8px;border-radius:20px;background:linear-gradient(90deg,#e53935,#ffa724,#b4d000,#6cbd69,#55aac6,#9574b9);margin-top:20px}.servo{display:flex;align-items:center;justify-content:center;gap:10px;background:#1a2816;padding:13px;border-radius:12px;font-size:10px;color:var(--primary);margin-top:16px}.servo.open .icon{animation:spin 1s ease-in-out infinite alternate}.threshold{border-left:3px solid currentColor;padding:12px 16px;margin:13px 0;background:#ffffff05;border-radius:0 12px 12px 0}.threshold b{font-size:12px}.threshold p{font-size:11px}.threshold small{display:block;color:#b7c6ad;margin-top:4px}details{background:#090f0bdd;border:1px solid var(--line);border-radius:16px;margin:10px 0;padding:0 17px}summary{cursor:pointer;padding:17px 0;font-weight:600;font-size:13px;min-height:50px}details p,details ul{padding-bottom:17px;font-size:12px;color:#c4cec3}details li{margin-bottom:6px}.progress{height:7px;background:#293321;border-radius:10px;overflow:hidden;margin:16px 0 9px}.progress>span{display:block;height:100%;background:var(--primary);transition:width .5s;border-radius:10px}.phase-buttons{display:flex;gap:5px;margin-bottom:16px}.phase-buttons button{flex:1;background:#1b2918;border:1px solid #4c5d35;border-radius:12px;padding:12px 4px;font-size:10px}.phase-buttons button.active{background:var(--primary);color:#162008}.flow-node{text-align:center;padding:14px;border:1px solid #425239;background:#0c160d;border-radius:14px;font-size:12px}.flow-arrow{height:32px;text-align:center;color:var(--primary);animation:flow 1.5s infinite}.flow-branch{display:grid;grid-template-columns:1fr 1fr;gap:10px}.flow-branch .flow-node{font-size:11px}.notification{display:flex;gap:12px}.notification>.icon{color:var(--primary);margin-top:4px}.notification h3{font-size:12px}.notification p{font-size:12px}.notification time{display:block;font-size:9px;color:var(--muted);margin-top:8px}.quiz-answer{width:100%;padding:16px;text-align:left;background:#172017;border:1px solid var(--line);border-radius:12px;margin-top:9px;font-size:13px}.quiz-answer.correct{border-color:var(--success);background:#7cb34224}.quiz-answer.wrong{border-color:var(--danger);background:#e5393524}.quiz-feedback{margin:18px 0;font-size:13px}.score{font:80px 'Barlow Condensed',Impact;color:var(--primary);text-align:center;margin:25px 0}.score small{font-size:28px;color:var(--muted)}dialog{width:calc(100% - 36px);max-width:386px;border:1px solid #556a35;border-radius:25px;padding:23px;background:#142013;color:white;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#000a;backdrop-filter:blur(5px)}dialog p{font-size:13px;margin:15px 0 23px}.modal-top{display:flex;align-items:center;gap:10px}.modal-top .eyebrow{font-size:8px;margin:0}.icon-btn{background:#ffffff12;border-radius:50%;min-width:40px;height:40px;font-size:25px;margin-left:auto}#toast{position:fixed;bottom:96px;left:50%;transform:translate(-50%,20px);width:min(370px,calc(100% - 40px));padding:14px 18px;border:1px solid #739345;border-radius:15px;background:#1c3119;color:white;font-size:12px;opacity:0;pointer-events:none;transition:.3s;z-index:50}#toast.visible{opacity:1;transform:translate(-50%,0)}.enter{animation:enter .35s ease both}.back-enter{animation:back .35s ease both}.fade{animation:fade .5s both}.footer{text-align:center;color:#8b9b7f;font-size:10px;letter-spacing:1px;margin-top:28px}.desktop-caption{display:none}@keyframes enter{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}@keyframes back{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:none}}@keyframes fade{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}@keyframes spin{to{transform:rotate(65deg)}}@keyframes flow{50%{opacity:.3;transform:translateY(3px)}}@media(min-width:700px){body{padding:35px 0;background:radial-gradient(ellipse at 50% 20%,#233a24,#0a130d 65%)}.app{border:1px solid #3b4b34;border-radius:32px;min-height:calc(100dvh - 70px)}.desktop-caption{display:flex;position:fixed;left:28px;top:30px;bottom:30px;flex-direction:column;justify-content:space-between;max-width:160px;font-size:9px;letter-spacing:2px;color:#71816d}.desktop-caption span:last-child{writing-mode:vertical-rl;transform:rotate(180deg)}.bottom-nav{bottom:0;border-radius:20px 20px 0 0}.splash{min-height:calc(100dvh - 214px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media(max-width:370px){main{padding-left:17px;padding-right:17px}.topbar{padding-left:18px;padding-right:18px}.splash .display{font-size:66px}.hero h1{font-size:55px}}
.accordion-body{padding-bottom:17px;font-size:12px;color:#c4cec3}.accordion-body ul{padding-bottom:0}.school img{width:82px;height:48px;object-position:left center}.step-num{animation:fade .4s both}.step:nth-child(2n) .step-num{animation-delay:.1s}