:root{--bg:#050b15;--panel:rgba(8,18,32,.88);--panel2:rgba(14,28,46,.93);--line:rgba(143,207,239,.2);--text:#ecf7ff;--muted:#89a5b9;--cyan:#47cfff;--green:#70ed9a;--gold:#ffcf67;--danger:#ff7181;--purple:#cf9bff;--shadow:0 18px 55px rgba(0,0,0,.35)}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Noto Sans SC,system-ui,sans-serif}button{font:inherit;color:inherit;cursor:pointer;border:0}button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}#app{position:relative}.game-shell{position:relative;width:100%;height:100%;background:radial-gradient(circle at 50% 35%,#132b43 0,#07111f 43%,#030811)}.module-labels{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}.module-labels span{position:absolute;transform:translate(-50%,-100%);font-size:12px;font-weight:700;white-space:nowrap;text-shadow:0 2px 5px #000;background:#030c17bf;padding:3px 6px;border-radius:5px}#scene{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.vignette{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,transparent 40%,rgba(2,6,13,.42) 100%)}.topbar{position:absolute;z-index:4;left:18px;right:18px;top:16px;display:flex;align-items:center;justify-content:space-between;gap:14px;pointer-events:none}.brand{pointer-events:auto;display:flex;align-items:center;gap:12px}.brand-mark{width:34px;height:34px;border:1px solid rgba(111,224,255,.8);border-radius:50%;position:relative;box-shadow:0 0 18px #47cfff57,inset 0 0 12px #47cfff2e}.brand-mark:before,.brand-mark:after{content:"";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border:1px solid var(--cyan);border-radius:50%}.brand-mark:after{top:15px;right:15px;bottom:15px;left:15px;background:var(--cyan);border:0;box-shadow:0 0 10px var(--cyan)}.brand-title{font-family:Chakra Petch,sans-serif;letter-spacing:.12em;font-size:17px;font-weight:700}.brand-sub{font-size:10px;color:var(--muted);letter-spacing:.2em;margin-top:2px}.top-status{display:flex;align-items:center;gap:8px;pointer-events:auto}.status-pill{background:#07101dc7;border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:12px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.health-bar{display:inline-block;width:76px;height:5px;background:#263342;border-radius:5px;overflow:hidden;vertical-align:middle;margin-left:6px}.health-fill{display:block;height:100%;background:linear-gradient(90deg,#ff7181,#ffcf67,#70ed9a);transition:width .35s}.hud-panel{position:absolute;z-index:4;background:linear-gradient(145deg,#0a1828e6,#050d19d9);border:1px solid var(--line);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:14px}.left-panel{left:18px;top:76px;width:242px;max-height:calc(100% - 160px);padding:15px;overflow:auto}.right-panel{right:18px;top:76px;width:286px;max-height:calc(100% - 160px);padding:16px;overflow:auto}.bottom-panel{left:50%;bottom:17px;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:12px}.section-kicker{font-family:Chakra Petch;font-size:10px;color:var(--cyan);letter-spacing:.18em;text-transform:uppercase}.panel-title{font-size:18px;font-weight:800;margin:4px 0 12px}.minor{font-size:12px;color:var(--muted);line-height:1.6}.divider{height:1px;background:var(--line);margin:13px 0}.round-orbit{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.round-number{font-family:Chakra Petch;font-size:38px;line-height:1;color:var(--text)}.round-number small{display:block;font-family:Noto Sans SC;font-size:11px;color:var(--muted);font-weight:400;margin-top:5px}.round-dots{display:flex;gap:5px}.round-dot{width:14px;height:5px;border-radius:4px;background:#223447}.round-dot.done{background:var(--green);box-shadow:0 0 8px #70ed9a80}.round-dot.current{background:var(--cyan);box-shadow:0 0 8px #47cfff99}.resource-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:7px 0}.resource-label{color:var(--muted)}.resource-value{font-family:Chakra Petch;font-size:16px}.resource-value.cyan{color:var(--cyan)}.resource-value.green{color:var(--green)}.resource-value.gold{color:var(--gold)}.resource-value.danger{color:var(--danger)}.btn{border:1px solid rgba(142,215,242,.25);background:#183044bf;padding:9px 12px;border-radius:8px;transition:transform .15s,background .15s,border-color .15s;white-space:nowrap;font-size:12px}.btn:hover{background:#2c536ee6;border-color:#8ed7f2a6;transform:translateY(-1px)}.btn.primary{background:linear-gradient(135deg,#197d98,#16506a);border-color:#50d7ee;box-shadow:0 0 19px #47cfff2e}.btn.green{background:linear-gradient(135deg,#176f62,#19513e);border-color:#70ed9a}.btn.danger{border-color:#ff71818c;color:#ffabb4;background:#591c2b73}.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn.small{padding:6px 8px;font-size:11px}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.button-stack{display:flex;gap:7px;flex-wrap:wrap}.mode-btn.active{color:#fff;border-color:var(--cyan);box-shadow:0 0 12px #47cfff38;background:#175b76cc}.mode-strip{display:flex;gap:5px;margin:10px 0}.mode-btn{flex:1;padding:8px 4px;border:1px solid var(--line);background:#0c1c2dbf;border-radius:7px;font-size:11px}.mode-btn.water.active{border-color:var(--cyan);color:var(--cyan)}.mode-btn.nutrient.active{border-color:var(--green);color:var(--green)}.mode-btn.inspect.active{border-color:var(--gold);color:var(--gold)}.pipe-card{background:#050e198c;border:1px solid rgba(143,207,239,.12);padding:9px;border-radius:8px;margin:7px 0}.pipe-line{display:flex;align-items:center;gap:7px;font-size:12px}.pipe-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px currentColor}.pipe-dot.nutrient{background:var(--green)}.pipe-meta{color:var(--muted);font-size:10px;margin-top:5px;display:flex;justify-content:space-between}.pipe-actions{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px}.pipe-actions .btn{padding:5px 7px;font-size:10px}.log-list{display:flex;flex-direction:column;gap:7px;max-height:220px;overflow:auto;padding-right:2px}.log-item{font-size:11px;color:#c6d6e1;line-height:1.45;border-left:2px solid #5a7083;padding-left:8px}.log-item.good{border-color:var(--green)}.log-item.warn{border-color:var(--gold)}.log-item.bad{border-color:var(--danger);color:#ffb4bc}.log-time{color:#668295;font-family:Chakra Petch;font-size:9px;margin-right:4px}.instruction{padding:9px 10px;border-radius:8px;background:#1e4d6533;border:1px solid rgba(71,207,255,.18);font-size:11px;line-height:1.55;color:#bcecff;margin-bottom:10px}.warning-box{padding:10px;border-radius:8px;background:#682a2f40;border:1px solid rgba(255,113,129,.3);color:#ffc1c8;font-size:12px;line-height:1.5}.good-box{padding:10px;border-radius:8px;background:#1f664a38;border:1px solid rgba(112,237,154,.28);color:#baf8ce;font-size:12px;line-height:1.5}.modal-backdrop{position:absolute;z-index:10;top:0;right:0;bottom:0;left:0;background:#02070db8;display:grid;place-items:center;padding:18px;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.modal{width:min(500px,100%);max-height:calc(100% - 30px);overflow:auto;background:linear-gradient(145deg,#0c1d2ffa,#040c17fa);border:1px solid rgba(143,207,239,.38);border-radius:18px;padding:26px;box-shadow:0 25px 90px #0000008c}.modal.wide{width:min(720px,100%)}.modal h1{font-size:27px;margin:0 0 8px}.modal h2{font-size:20px;margin:0 0 7px}.modal p{color:#aac0cf;line-height:1.7;font-size:13px}.modal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.title-modal{text-align:left;max-width:530px}.title-kicker{color:var(--cyan);font-family:Chakra Petch;letter-spacing:.24em;font-size:12px}.title-modal h1{font-size:50px;line-height:1;margin:13px 0 8px;letter-spacing:.07em}.title-modal h1 span{color:var(--cyan);font-size:18px;font-family:Chakra Petch;display:block;letter-spacing:.22em;margin-top:13px}.title-rule{height:1px;background:linear-gradient(90deg,var(--cyan),transparent);margin:22px 0}.title-copy{max-width:410px;color:#c0d7e5!important}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}.feature{padding:10px;border:1px solid var(--line);border-radius:8px;background:#081625a6;font-size:11px;color:#a9bfd0}.feature strong{display:block;font-size:14px;color:var(--text);margin-bottom:4px}.progress-wrap{margin:10px 0 15px}.progress-label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:5px}.progress-track{height:6px;border-radius:5px;background:#1a2a39;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--cyan),var(--green));box-shadow:0 0 10px #47cfff73;transition:width .25s}.select-line{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(143,207,239,.1);font-size:12px}.select-line:last-child{border:0}.select-line button{padding:4px 8px;background:#2c536e99;border-radius:5px;font-size:11px}.module-detail{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);width:min(340px,calc(100% - 30px));padding:16px;background:#050f1bf0;border:1px solid rgba(143,207,239,.34);border-radius:13px;box-shadow:var(--shadow);pointer-events:auto}.module-detail h3{margin:0 0 5px}.detail-close{position:absolute;right:10px;top:8px;background:transparent;color:var(--muted);font-size:20px}.module-tag{font-size:10px;color:var(--muted);letter-spacing:.1em}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.stat{padding:9px;background:#152b3c8c;border-radius:7px}.stat b{display:block;font-family:Chakra Petch;font-size:17px;margin-top:2px}.stat span{font-size:10px;color:var(--muted)}.toast{position:absolute;z-index:20;left:50%;top:72px;transform:translate(-50%);padding:10px 15px;border-radius:8px;background:#071421f0;border:1px solid var(--cyan);font-size:12px;box-shadow:0 0 25px #47cfff33;animation:toast-in .25s ease-out}.toast.bad{border-color:var(--danger)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-7px)}to{opacity:1;transform:translate(-50%)}}@media(max-width:900px){.left-panel{width:210px}.right-panel{width:245px}.topbar{left:10px;right:10px}.status-pill{padding:7px 9px}.brand-title{font-size:14px}.bottom-panel{bottom:9px}}@media(max-width:700px){.module-labels span{font-size:10px}.prediction-copy,.prediction-heading{display:none}.right-panel .panel-title{margin-bottom:4px}.right-panel .mode-strip{margin:6px 0}.right-panel .minor{font-size:10px}.right-panel .divider{margin:8px 0}#scene{top:48px;height:calc(62% - 48px)}.left-panel{top:62%;bottom:66px;left:9px;width:calc(50% - 14px);max-height:none;padding:10px}.right-panel{top:62%;bottom:66px;right:9px;width:calc(50% - 14px);max-height:none;padding:10px}.hud-panel{border-radius:11px}.panel-title{font-size:15px;margin-bottom:7px}.topbar{top:9px}.brand-sub{display:none}.brand-mark{width:28px;height:28px}.brand-mark:before{top:5px;right:5px;bottom:5px;left:5px}.brand-mark:after{top:12px;right:12px;bottom:12px;left:12px}.status-pill{font-size:10px;padding:6px 7px}.bottom-panel{left:9px;right:9px;transform:none;justify-content:center;padding:6px;overflow:auto}.bottom-panel .btn{font-size:10px;padding:7px 8px}.title-modal h1{font-size:38px}.feature-grid{grid-template-columns:1fr}.modal{padding:20px}.log-list{max-height:110px}.instruction{font-size:10px}}
