@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@500;600;700&family=Share+Tech+Mono&display=swap');
:root{
  --bg:#0c0e11;--p1:#14181e;--p2:#1b2028;--border:#262d38;--bhi:#3a4452;
  --acc:#ff9d2e;--acc-dim:rgba(255,157,46,0.12);--acc-line:#b86f1e;
  --grn:#3ddc84;--grn-dim:rgba(61,220,132,0.12);
  --amb:#ffc857;--amb-dim:rgba(255,200,87,0.12);
  --red:#ff5d5d;--red-dim:rgba(255,93,93,0.12);
  --txt:#c9d2dc;--txd:#6b7785;--txb:#f4f7fa;
  --mono:'Share Tech Mono',monospace;--disp:'Chakra Petch',sans-serif;
  --chamfer:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);
}
body.light{
  --bg:#efe9df;--p1:#faf6ee;--p2:#f0eadf;--border:#d3c8b4;--bhi:#b5a78e;
  --acc:#c25e00;--acc-dim:rgba(194,94,0,0.10);--acc-line:#9a4d05;
  --grn:#1e7a45;--grn-dim:rgba(30,122,69,0.12);
  --amb:#8a5e00;--amb-dim:rgba(138,94,0,0.12);
  --red:#c0202e;--red-dim:rgba(192,32,46,0.10);
  --txt:#3c2f1d;--txd:#8a7a60;--txb:#1c130a;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;overflow:hidden;}
body{background:var(--bg);color:var(--txt);font-family:var(--disp);font-size:16px;display:flex;flex-direction:column;}
#hdr{flex-shrink:0;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:var(--p1);border-bottom:2px solid var(--acc-line);}
#hdr h1{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--acc);letter-spacing:5px;}
#hdr-right{font-family:var(--mono);font-size:11px;color:var(--txd);text-align:right;line-height:1.7;}
#hdr-right b{color:var(--acc);}
#ms-wrap{flex-shrink:0;display:flex;align-items:stretch;border-bottom:1px solid var(--border);background:var(--p1);}
#ms-stripe{width:10px;flex-shrink:0;background:repeating-linear-gradient(-45deg,var(--acc) 0 6px,#1a1208 6px 12px);}
#ms{flex:1;padding:7px 12px;font-family:var(--mono);font-size:12px;color:var(--amb);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
#scroll::-webkit-scrollbar{width:3px;}#scroll::-webkit-scrollbar-thumb{background:var(--bhi);}
#nav{position:fixed;bottom:0;left:0;right:0;height:56px;display:flex;background:var(--p1);border-top:2px solid var(--border);z-index:999;padding-bottom:env(safe-area-inset-bottom);}
.nb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:none;border:none;color:var(--txd);font-family:var(--mono);font-size:10px;letter-spacing:1px;cursor:pointer;touch-action:manipulation;}
.nb .ico{font-size:20px;}
.nb.active{color:var(--acc);box-shadow:inset 0 3px 0 var(--acc);}
.view{display:none;padding:12px 12px 76px;}
.view.active{display:block;}
.card{background:var(--p1);border:1px solid var(--border);margin-bottom:12px;clip-path:var(--chamfer);}
.card-hdr{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--border);border-left:3px solid var(--acc);font-family:var(--disp);font-weight:600;font-size:12px;color:var(--txb);letter-spacing:2px;}
.card-sub{font-family:var(--mono);font-size:10px;letter-spacing:0;color:var(--txd);font-weight:500;}
.empty{padding:20px;font-family:var(--mono);font-size:12px;color:var(--txd);text-align:center;line-height:1.9;}
.fcard{background:var(--p1);border:1px solid var(--border);margin-bottom:12px;cursor:pointer;clip-path:var(--chamfer);touch-action:manipulation;}
.fc-top{display:flex;align-items:center;gap:12px;padding:14px;}
.fc-eff{font-family:var(--mono);font-size:24px;font-weight:700;min-width:64px;text-align:right;}
.fc-meta{display:flex;align-items:center;gap:10px;padding:8px 14px;border-top:1px solid var(--border);background:rgba(0,0,0,0.18);}
body.light .fc-meta{background:rgba(0,0,0,0.05);}
.bar{flex:1;height:6px;background:var(--border);overflow:hidden;}
.bar-fill{height:100%;transition:width 0.4s,background 0.4s;}
.chips{display:flex;gap:6px;flex-wrap:wrap;padding:0 14px 12px;}
.chip{font-family:var(--mono);font-size:10px;color:var(--txd);background:var(--p2);border:1px solid var(--border);padding:3px 8px;}
.chip.on{color:var(--grn);border-color:var(--grn);}
#fd{display:none;flex-direction:column;position:fixed;top:0;left:0;right:0;bottom:56px;z-index:10;background:var(--bg);pointer-events:none;}
#fd.active{display:flex;pointer-events:auto;}
#fd-hdr{flex-shrink:0;display:flex;align-items:center;background:var(--p1);border-bottom:2px solid var(--acc-line);}
#fd-back{padding:14px;font-family:var(--mono);font-size:13px;color:var(--acc);cursor:pointer;font-weight:700;flex-shrink:0;touch-action:manipulation;}
#fd-title{flex:1;font-family:var(--disp);font-weight:700;font-size:17px;color:var(--txb);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#fd-strip{flex-shrink:0;height:72px;display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;background:var(--p2);border-bottom:1px solid var(--border);padding:8px 10px;gap:8px;align-items:center;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
#fd-strip::-webkit-scrollbar{display:none;}
#fd-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 12px 24px;}
.mnode{background:var(--p1);border:1px solid var(--border);clip-path:var(--chamfer);margin-bottom:4px;}
.mnode.starved{border-color:var(--amb);}.mnode.backed{border-color:var(--acc);}
.mnode.bottleneck{border-color:var(--red);box-shadow:0 0 8px var(--red-dim);}
.belt{display:flex;align-items:center;padding:2px 18px;}
.belt-line{flex:1;height:0;border-top:2px dashed var(--border);}
.belt-txt{font-family:var(--mono);font-size:10px;color:var(--txd);padding:0 10px;white-space:nowrap;}
.belt.flow .belt-line{border-top-color:var(--grn);border-top-style:solid;animation:beltFlow 0.8s linear infinite;}
.belt.flow .belt-txt{color:var(--grn);}
.belt.dry .belt-line{border-top-color:var(--amb);}
.belt.dry .belt-txt{color:var(--amb);}
@keyframes beltFlow{0%{border-top-width:2px;opacity:1}50%{opacity:0.6}100%{border-top-width:2px;opacity:1}}
.rrow{display:flex;align-items:center;gap:10px;padding:13px 14px;border-bottom:1px solid var(--border);}
.rrow:last-child{border-bottom:none;}
.rrow-info{flex:1;min-width:0;}
.rrow-name{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--txb);}
.rrow-name.done{color:var(--txd);text-decoration:line-through;}
.rrow-desc{font-size:12px;color:var(--txd);margin-top:3px;line-height:1.5;}
.rrow-cost{font-family:var(--mono);font-size:12px;margin-top:5px;line-height:1.9;}
.rrow-dur{font-family:var(--mono);font-size:11px;color:var(--txd);margin-top:3px;}
.rprog{height:5px;background:var(--border);margin-top:7px;overflow:hidden;}
.rprog-fill{height:100%;background:var(--acc);}
.done-badge{font-family:var(--mono);font-size:12px;color:var(--grn);border:1px solid var(--grn);padding:5px 10px;flex-shrink:0;}
.shop-row{display:flex;align-items:center;gap:10px;padding:13px 14px;border-bottom:1px solid var(--border);}
.shop-row:last-child{border-bottom:none;}
.shop-info{flex:1;min-width:0;}
.shop-name{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--txb);}
.shop-desc{font-size:12px;color:var(--txd);margin-top:3px;line-height:1.5;}
.shop-cost{font-family:var(--mono);font-size:12px;color:var(--amb);margin-top:4px;}
.hq-sec{padding:13px 14px;border-bottom:1px solid var(--border);}
.hq-sec:last-child{border-bottom:none;}
.hq-row{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.hq-lbl{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--txb);}
.hq-sub{font-family:var(--mono);font-size:11px;color:var(--txd);margin-top:3px;}
.toggle{position:relative;width:44px;height:24px;cursor:pointer;flex-shrink:0;}
.toggle input{opacity:0;width:0;height:0;}
.tslider{position:absolute;inset:0;background:var(--bhi);transition:background 0.2s;}
.tslider::before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background:var(--txd);transition:transform 0.2s,background 0.2s;}
.toggle input:checked + .tslider{background:var(--acc);}
.toggle input:checked + .tslider::before{transform:translateX(20px);background:#fff;}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:2000;display:none;align-items:center;justify-content:center;padding:16px;}
.overlay.show{display:flex;}
.ov-card{background:var(--p1);border:1px solid var(--acc);padding:20px;max-width:350px;width:100%;max-height:88vh;overflow-y:auto;clip-path:var(--chamfer);}
.ov-title{font-family:var(--disp);font-weight:700;font-size:13px;color:var(--acc);letter-spacing:3px;margin-bottom:16px;text-align:center;}
.item-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;}
.item-btn{padding:12px 8px;background:var(--p2);border:1px solid var(--border);cursor:pointer;text-align:center;touch-action:manipulation;-webkit-user-select:none;user-select:none;}
.item-btn.locked{opacity:0.25;cursor:default;}
.ob-step{display:flex;gap:12px;margin-bottom:13px;}
.ob-num{font-family:var(--mono);font-size:16px;color:var(--acc);font-weight:700;min-width:24px;}
.ob-txt{font-size:14px;color:var(--txt);line-height:1.55;}
.ob-txt b{color:var(--txb);}
.ob-txt small{display:block;font-family:var(--mono);font-size:10px;color:var(--txd);margin-top:3px;}
.ob-goal{background:var(--amb-dim);border:1px solid var(--amb);padding:12px;margin:14px 0;text-align:center;font-size:14px;color:var(--amb);line-height:1.7;}
.log-e{padding:5px 14px;font-family:var(--mono);font-size:12px;color:var(--txd);border-left:2px solid transparent;line-height:1.5;}
.log-e.good{border-left-color:var(--grn);color:var(--grn);}
.log-e.info{border-left-color:var(--acc);color:#9a7a4a;}
.log-e.warn{border-left-color:var(--amb);color:var(--amb);}
.log-e.win{color:var(--acc);}
.win-card{background:var(--acc-dim);border:1px solid var(--acc);padding:26px;text-align:center;margin:10px 0;clip-path:var(--chamfer);}
.win-title{font-family:var(--disp);font-weight:700;font-size:20px;color:var(--acc);letter-spacing:4px;margin-bottom:10px;}
.win-sub{font-size:14px;color:var(--txd);line-height:1.9;}
#save-ind{position:fixed;bottom:64px;right:10px;font-family:var(--mono);font-size:10px;color:var(--grn);background:var(--grn-dim);border:1px solid var(--grn);padding:3px 8px;opacity:0;transition:opacity 0.4s;pointer-events:none;z-index:300;}
#save-ind.show{opacity:1;}
#toast{position:fixed;top:62px;left:50%;transform:translateX(-50%) translateY(-8px);background:var(--p2);border:1px solid var(--acc);color:var(--acc);font-family:var(--mono);font-size:12px;padding:8px 18px;opacity:0;transition:all 0.2s;z-index:9999;pointer-events:none;white-space:nowrap;max-width:92vw;overflow:hidden;text-overflow:ellipsis;}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.btn{font-family:var(--mono);font-size:11px;padding:10px 16px;background:var(--p2);border:1px solid var(--border);color:var(--txt);cursor:pointer;letter-spacing:1px;touch-action:manipulation;}
.btn:active{opacity:0.8;}
.btn-acc{background:var(--acc-dim);border-color:var(--acc);color:var(--acc);}
.btn-danger{border-color:var(--red);color:var(--red);}
.btn-sm{padding:6px 10px;font-size:10px;flex-shrink:0;}
.btn-full{width:100%;margin-top:4px;}
.pwr-row{display:flex;justify-content:space-between;padding:6px 14px;font-family:var(--mono);font-size:11px;border-bottom:1px solid var(--border);}
.pwr-row .grn{color:var(--grn);}.pwr-row .red{color:var(--red);}.pwr-row .amb{color:var(--amb);}
.sky-panel{padding:10px 14px 14px;border-top:1px solid var(--border);}
.sky-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.sky-label{font-family:var(--disp);font-size:13px;font-weight:600;}
.sky-clock{font-family:var(--mono);font-size:12px;color:var(--txd);}
.sky-track{position:relative;height:28px;background:linear-gradient(90deg,#0a1628 0%,#1a3a5c 25%,#4a90c2 50%,#1a3a5c 75%,#0a1628 100%);border:1px solid var(--border);overflow:hidden;}
body.light .sky-track{background:linear-gradient(90deg,#1a2540 0%,#5a8ab0 25%,#87ceeb 50%,#5a8ab0 75%,#1a2540 100%);}
.sky-sun{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--amb);box-shadow:0 0 10px var(--amb);transition:left 0.3s;}
.sky-sub{font-family:var(--mono);font-size:10px;color:var(--txd);margin-top:6px;text-align:center;}
.net-row,.inv-row{display:flex;justify-content:space-between;padding:8px 14px;font-size:12px;border-bottom:1px solid var(--border);}
.net-row .mono,.inv-row .mono{font-family:var(--mono);color:var(--acc);}
.grade-A{color:var(--grn);}.grade-B{color:#7dd87d;}.grade-C{color:var(--amb);}.grade-D{color:var(--red);}.grade-E,.grade-F{color:var(--red);}
.sparkline{width:60px;height:16px;flex-shrink:0;}
.spark-wrap{display:flex;align-items:center;}
.node-actions{display:flex;gap:6px;padding:8px 14px 12px;flex-wrap:wrap;}
.spec-select{font-family:var(--mono);font-size:11px;background:var(--p1);border:1px solid var(--border);color:var(--txt);padding:8px;flex-shrink:0;}
#tutorial-overlay{position:fixed;inset:0;z-index:1500;pointer-events:none;display:none;}
#tutorial-overlay.show{display:block;}
.tut-arrow{position:fixed;width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-bottom:12px solid var(--acc);}
.tut-dismiss{position:fixed;top:12px;right:12px;font-family:var(--mono);font-size:10px;padding:6px 12px;background:var(--p1);border:1px solid var(--border);color:var(--txd);cursor:pointer;z-index:1501;pointer-events:auto;}
.tut-dismiss:active{opacity:0.8;}
.tut-text{position:fixed;background:var(--p1);border:1px solid var(--acc);color:var(--acc);font-family:var(--mono);font-size:11px;padding:8px 12px;max-width:260px;line-height:1.5;clip-path:var(--chamfer);pointer-events:none;}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;}}
