*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{background:#04060c;color:#dce8e2;font-family:Segoe UI,Ubuntu,system-ui,-apple-system,sans-serif;overflow:hidden;user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}.app{position:fixed;inset:0}#game-host{position:absolute;inset:0}#game-host canvas{display:block;touch-action:none}.glass{background:#08100e94;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(126,242,154,.18);border-radius:14px;box-shadow:0 6px 24px #00000059}.hud-top{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 10px;padding:8px 14px;font-size:13.5px;white-space:nowrap;max-width:min(96vw,1500px);z-index:10}.hud-top .title{display:inline-flex;align-items:center;gap:5px;font-weight:700;letter-spacing:.4px;color:#c9ffd9;margin-right:4px}.chip{display:inline-flex;align-items:center;gap:5px}.chip.dim{opacity:.75}.chip svg{flex:none}.chip.sugar{color:#ffd166}.chip.water{color:#7ae0ff}.chip.min{font-family:ui-monospace,monospace;font-size:12.5px}.chip.min.na{opacity:.9}.chip.stress{color:#ff9a8a;border:1px solid rgba(255,154,138,.45);border-radius:8px;padding:1px 7px}.rate{font-family:ui-monospace,monospace;font-size:11px;opacity:.9}.rate.pos{color:#7ef29a}.rate.neg{color:#ff9a8a}.chip.myco{color:#d9b8ff;border:1px solid rgba(217,184,255,.4);border-radius:8px;padding:1px 7px}.controls{display:inline-flex;gap:4px;margin-left:6px}.btn{pointer-events:auto;cursor:pointer;border:1px solid rgba(126,242,154,.25);background:#08100e8c;backdrop-filter:blur(10px);color:#dce8e2;border-radius:10px;padding:5px 10px;font-size:13px;font-family:inherit;transition:background .15s,border-color .15s,transform .05s}.btn:hover{border-color:#7ef29a}.btn:active{transform:scale(.96)}.btn.active{background:#7ef29a29;border-color:#7ef29a;color:#c9ffd9}.buildbar{position:absolute;bottom:14px;left:50%;transform:translate(-50%);display:flex;gap:8px;z-index:10}.btn.tool{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 14px;min-width:86px}.btn.tool .ticon{font-size:19px}.btn.tool .tname{font-size:13px}.btn.tool .cost{font-size:11px;opacity:.75}.btn .key{position:absolute;font-size:10px;opacity:.5;transform:translateY(15px)}.btn.tool{position:relative}.eventlog{position:absolute;bottom:16px;left:16px;display:flex;flex-direction:column;gap:6px;max-width:280px;z-index:9}@media(max-width:1240px){.eventlog{bottom:108px;max-width:300px}.hint{bottom:112px}.readout{top:96px}}.log-entry{display:flex;align-items:center;gap:8px;padding:7px 11px;font-size:13px;animation:fadeIn .3s ease-out}.log-entry .licon{font-size:15px}.readout{position:absolute;top:64px;right:16px;padding:8px 12px;font-size:13px;line-height:1.55;white-space:pre-line;text-align:left;z-index:10;pointer-events:none;min-width:180px}.hint{position:absolute;bottom:16px;right:16px;font-size:11.5px;opacity:.55;z-index:9;pointer-events:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.codex-overlay{position:fixed;inset:0;background:#02050aa8;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:50;animation:fadeIn .15s ease-out}.codex{display:flex;width:min(900px,94vw);height:min(640px,88vh);overflow:hidden}.codex-side{width:232px;flex:none;overflow-y:auto;border-right:1px solid rgba(126,242,154,.15);padding:12px 8px;background:#040a0880}.codex-side-title{display:flex;align-items:center;gap:7px;font-weight:700;color:#c9ffd9;padding:2px 8px 10px;letter-spacing:.4px}.codex-section{font-size:11px;text-transform:uppercase;letter-spacing:1px;opacity:.5;padding:10px 8px 4px}.codex-link{display:block;width:100%;text-align:left;background:none;border:none;color:#dce8e2;font-family:inherit;font-size:13px;padding:6px 10px;border-radius:8px;cursor:pointer}.codex-link:hover{background:#7ef29a1a}.codex-link.active{background:#7ef29a2e;color:#c9ffd9}.codex-body{flex:1;overflow-y:auto;padding:18px 22px;font-size:14px;line-height:1.6}.codex-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.codex-head h3{color:#c9ffd9;font-size:18px}.codex-body p{margin:8px 0;color:#cfe0d8}.codex-body ul{margin:8px 0 8px 18px}.codex-body li{margin:6px 0;color:#cfe0d8}.formula{display:block;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:12.5px;color:#b8f5c8;background:#7ef29a14;border:1px solid rgba(126,242,154,.15);border-radius:8px;padding:7px 10px;margin:8px 0;white-space:pre-wrap}@media(max-width:900px){.hud-top{font-size:12px;gap:6px 8px}}@media(max-width:760px){.hud-top{top:0;left:0;right:0;transform:none;border-radius:0;border-top:none;border-left:none;border-right:none;justify-content:center;gap:5px 7px;padding:calc(6px + env(safe-area-inset-top,0px)) 8px 6px;font-size:11.5px;max-width:none}.hud-top .title{margin-right:0}.title-text,.m-hide,.codex-btn-text{display:none}.chip{gap:4px}.chip.min{font-size:11px}.rate{font-size:10px}.controls{gap:3px;margin-left:0}.btn{padding:5px 8px;font-size:12px}.btn.codex-btn{padding:5px 7px}.readout{top:auto;bottom:calc(88px + env(safe-area-inset-bottom,0px));left:8px;right:8px;min-width:0;font-size:12px;line-height:1.5;padding:7px 10px}.eventlog{top:calc(86px + env(safe-area-inset-top,0px));bottom:auto;left:8px;right:auto;max-width:64vw}.eventlog .log-entry:nth-child(n+3){display:none}.log-entry{font-size:11.5px;padding:5px 9px}.buildbar{left:0;right:0;bottom:calc(6px + env(safe-area-inset-bottom,0px));transform:none;gap:6px;padding:0 8px}.btn.tool{flex:1 1 0;min-width:0;padding:6px 4px;gap:1px}.btn.tool .ticon svg{width:17px;height:17px}.btn.tool .tname{font-size:11.5px}.btn.tool .cost{font-size:9.5px;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1px 3px}.btn .key{display:none}.buildbar>.btn:not(.tool){flex:0 0 auto;padding:6px 10px}.hint{display:none}.codex{flex-direction:column;width:96vw;height:min(88vh,720px)}.codex-side{order:2;width:100%;max-height:36%;border-right:none;border-top:1px solid rgba(126,242,154,.15);padding:6px 8px}.codex-side-title{padding:2px 6px 6px}.codex-section{padding:6px 6px 2px}.codex-link{padding:5px 8px}.codex-body{order:1;flex:1;min-height:0;padding:12px 14px;font-size:13.5px}.codex-head h3{font-size:16px}}