:root{--cave-900: #0d1112;--cave-800: #151b1c;--cave-700: #1f2726;--cave-600: #2c3532;--lantern-500: #f3b84c;--lantern-600: #d7912d;--ember-500: #e8743b;--edge-gold: #c8994a;--edge-gold-soft: rgba(200, 153, 74, .45);--crystal-500: #56b8f0;--crystal-300: #9fe3ff;--fungus-500: #a56bf0;--fungus-300: #d1a8ff;--moss-500: #58b04a;--moss-700: #3a8f2f;--danger-500: #d9534f;--parchment-100: #f1dfb0;--parchment-300: #dcc38a;--ink-900: #2a1c0f;--text-primary: #fff2cf;--text-muted: #c6b58d;--need-hunger: #f08a2e;--need-thirst: #3fa7f5;--need-energy: #3fa7f5;--need-mood: #f5c542;--font-display: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;--font-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--text-xs: 12px;--text-sm: 14px;--text-md: 16px;--text-lg: 20px;--text-xl: 28px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-round: 999px;--tap-min: 48px;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--hud-height: 120px;--nav-height: 76px;--dur-fast: .12s;--dur-med: .24s;--panel-fill: linear-gradient(160deg, rgba(44, 53, 50, .96), rgba(21, 27, 28, .97));--panel-shadow: inset 0 1px rgba(255, 240, 192, .09), 0 6px 18px rgba(0, 0, 0, .45);--lantern-glow: 0 0 14px rgba(243, 184, 76, .45);--z-hud: 10;--z-panel: 20;--z-dialog: 30}@media (prefers-reduced-motion: reduce){:root{--dur-fast: 0ms;--dur-med: 0ms}}#ui{color:var(--text-primary);font-family:var(--font-ui);font-size:var(--text-sm);line-height:1.25}#ui *,#ui *:before,#ui *:after{box-sizing:border-box}:where(#ui) button{margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}#ui button:focus-visible{outline:2px solid var(--crystal-300);outline-offset:2px}.surface{pointer-events:auto;background:var(--panel-fill);border:1px solid var(--edge-gold-soft);border-radius:var(--radius-md);box-shadow:var(--panel-shadow)}.sprite{display:block;flex:0 0 auto;background-repeat:no-repeat}.icon{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.btn{pointer-events:auto;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--tap-min);padding:0 var(--space-4);border-radius:var(--radius-md);font-weight:700;font-size:var(--text-md);transition:transform var(--dur-fast) ease,filter var(--dur-fast) ease}.btn:active{transform:translateY(1px) scale(.98);filter:brightness(.9)}.btn--primary{background:linear-gradient(180deg,var(--moss-500),var(--moss-700));border:1px solid rgba(190,240,170,.5);color:#f6ffe9;text-shadow:0 1px 1px rgba(0,0,0,.5);box-shadow:inset 0 1px #ffffff4d,0 3px 8px #0006}.btn--secondary{background:var(--panel-fill);border:1px solid var(--edge-gold-soft);color:var(--text-primary);box-shadow:var(--panel-shadow)}.btn--danger{background:linear-gradient(180deg,#8a3a34,#5e2622);border:1px solid rgba(255,170,160,.45);color:#ffe9e4}.btn--block{width:100%}.btn:disabled{filter:grayscale(.8);opacity:.5;cursor:default}.icon-btn{pointer-events:auto;display:grid;place-items:center;width:var(--tap-min);height:var(--tap-min);border-radius:var(--radius-md);transition:transform var(--dur-fast) ease}.icon-btn:active{transform:scale(.94)}.chip{display:inline-flex;align-items:center;gap:var(--space-1);min-height:28px;padding:0 var(--space-3);border:1px solid var(--edge-gold-soft);border-radius:var(--radius-round);background:#0d111299;color:var(--lantern-500);font-size:var(--text-xs);font-weight:700;white-space:nowrap}.chip__icon{width:18px;height:18px}.chip--plain{border-color:#c8994a40;color:var(--text-muted)}.chip--missing{border-color:var(--danger-500);color:#ff9d94}.chip--done,.chip[data-state=active]{border-color:#9be07f80;color:#9be07f}.chip-row{display:flex;flex-wrap:wrap;gap:var(--space-1)}.tabs{display:flex;gap:var(--space-1)}.tab{pointer-events:auto;flex:1;min-height:var(--tap-min);border:1px solid transparent;border-radius:var(--radius-md);color:var(--text-muted);font-weight:700}.tab[aria-selected=true]{border-color:var(--lantern-500);background:#f3b84c1f;color:var(--lantern-500)}.segmented{pointer-events:auto;display:flex;overflow:hidden}.segmented__option{display:grid;place-items:center;min-width:var(--tap-min);height:var(--tap-min);color:var(--text-muted);font-weight:700;font-size:var(--text-md);font-variant-numeric:tabular-nums}.segmented__option+.segmented__option{border-left:1px solid rgba(200,153,74,.25)}.segmented__option[aria-pressed=true]{background:#f3b84c33;color:var(--lantern-500);text-shadow:var(--lantern-glow)}.progress{flex:1;height:8px;overflow:hidden;border-radius:var(--radius-round);background:#0d1112cc;box-shadow:inset 0 0 0 1px #c8994a4d}.progress__fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--lantern-600),var(--lantern-500));transition:width var(--dur-med) ease}.empty{display:grid;justify-items:center;gap:var(--space-3);padding:var(--space-6) var(--space-4);text-align:center}.empty__icon{width:72px;height:72px;opacity:.9}.empty__title{margin:0;font-family:var(--font-display);font-size:var(--text-lg);color:var(--parchment-100)}.empty__text{margin:0;max-width:28ch;color:var(--text-muted)}.card-list{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none}.card{display:flex;align-items:center;gap:var(--space-3);min-height:64px;padding:var(--space-2) var(--space-3);border:1px solid rgba(200,153,74,.28);border-radius:var(--radius-md);background:#0d111273}.card__body{flex:1;min-width:0}.card--wrap{flex-wrap:wrap;row-gap:var(--space-2)}.card__title{font-family:var(--font-display);font-size:var(--text-md);font-weight:700;color:var(--parchment-100)}.card__subtitle{color:var(--text-muted);font-size:var(--text-sm)}.portrait{width:48px;height:48px;border-radius:50%;background-color:var(--cave-900);box-shadow:0 0 0 2px var(--edge-gold),0 2px 6px #00000080}.section-heading{margin:0 0 var(--space-2);color:var(--lantern-500);font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase}.section-heading--spaced{margin-top:var(--space-5)}.stock-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2);margin:0;padding:0;list-style:none}.stock-item{display:grid;justify-items:center;gap:2px;padding:var(--space-2) var(--space-1);border:1px solid rgba(200,153,74,.28);border-radius:var(--radius-md);background:#0d111273;font-variant-numeric:tabular-nums}.stock-item .sprite{width:36px;height:36px}.stock-item b{font-size:var(--text-md)}.stock-item[data-full=true] b{color:var(--ember-500)}.section-note{margin:calc(var(--space-1) * -1) 0 var(--space-2);color:var(--text-muted);font-size:var(--text-xs)}.stock-item span:last-child{color:var(--text-muted);font-size:var(--text-xs)}.building-picture{display:block;height:56px;border-radius:var(--radius-sm);background:var(--cave-900) center / contain no-repeat;box-shadow:inset 0 0 0 1px #c8994a33}.build-card{pointer-events:auto;display:grid;gap:var(--space-1);width:100%;padding:var(--space-2);border:1px solid rgba(200,153,74,.28);border-radius:var(--radius-md);background:#0d111273;text-align:left}.build-card[aria-pressed=true]{border-color:var(--lantern-500);background:#f3b84c1a;box-shadow:var(--lantern-glow)}.build-card__title{margin-top:var(--space-1);font-family:var(--font-display);font-size:var(--text-md);font-weight:700;color:var(--parchment-100)}.build-card__text{color:var(--text-muted)}.build-card__problem{color:#ff9d94;font-weight:600}.needs{flex-basis:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2)}.need{display:grid;gap:2px;color:var(--text-muted);font-size:var(--text-xs)}.need .progress{flex:none;height:6px}.need[data-need=hunger] .progress__fill{background:var(--need-hunger)}.need[data-need=thirst] .progress__fill{background:var(--need-thirst)}.need[data-need=energy] .progress__fill{background:var(--crystal-300)}.need[data-need=mood] .progress__fill{background:var(--need-mood)}.need[data-state=low]{color:var(--lantern-500)}.need[data-state=critical]{color:#ff9d94;font-weight:700}.need[data-state=critical] .progress__fill{background:var(--danger-500)}.hud{position:absolute;top:0;left:0;right:0;z-index:var(--z-hud);display:grid;gap:var(--space-2);padding:calc(var(--safe-top) + var(--space-2)) calc(var(--safe-right) + var(--space-2)) var(--space-4) calc(var(--safe-left) + var(--space-2));background:linear-gradient(180deg,#050708d1,#05070800)}.hud__row{display:flex;align-items:center;gap:var(--space-2)}.hud__spacer{flex:1}.colony-chip{display:flex;align-items:center;gap:var(--space-2);height:var(--tap-min);padding:0 var(--space-3) 0 var(--space-1)}.colony-chip__crest{width:40px;height:40px;filter:drop-shadow(0 0 6px rgba(243,184,76,.55))}.colony-chip__label{display:block;color:var(--text-muted);font-size:var(--text-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase}.colony-chip__level{display:block;font-family:var(--font-display);font-size:var(--text-md);font-weight:700;color:var(--parchment-100)}.count-chip{display:flex;align-items:center;gap:var(--space-1);height:var(--tap-min);padding:0 var(--space-3) 0 var(--space-2);font-size:var(--text-md);font-weight:700;font-variant-numeric:tabular-nums}.count-chip .sprite{width:30px;height:30px}.resource-bar{display:flex;margin:0;padding:0;list-style:none}.resource{flex:1;display:grid;grid-template-columns:auto auto;justify-content:center;align-items:center;column-gap:2px;min-width:0;height:52px;padding:3px 0;font-size:var(--text-sm);font-weight:700;font-variant-numeric:tabular-nums}.resource[data-full=true] .resource__amount{color:var(--ember-500)}.resource__rate{grid-column:1 / -1;justify-self:center;color:var(--text-muted);font-size:var(--text-xs);font-weight:600;line-height:1;opacity:.7}.resource__rate[data-trend=up]{color:#9be07f;opacity:1}.resource__rate[data-trend=down]{color:var(--danger-500);opacity:1}.resource+.resource{border-left:1px solid rgba(200,153,74,.2)}.resource .sprite{width:26px;height:26px}.objective{position:absolute;top:calc(var(--safe-top) + var(--hud-height) + var(--space-1));left:calc(var(--safe-left) + var(--space-2));z-index:var(--z-hud);display:grid;gap:var(--space-1);width:min(72%,280px);padding:var(--space-2) var(--space-3);border-color:var(--lantern-500)}.objective[hidden]{display:none}.objective__title{font-size:var(--text-sm);font-weight:700;color:var(--parchment-100)}.objective__row{display:flex;align-items:center;gap:var(--space-2)}.objective__count{color:var(--lantern-500);font-size:var(--text-xs);font-weight:700;font-variant-numeric:tabular-nums}.objective__hint{color:var(--text-muted);font-size:var(--text-xs)}.toast-layer{position:absolute;left:calc(var(--safe-left) + var(--space-3));right:calc(var(--safe-right) + var(--space-3));bottom:calc(var(--safe-bottom) + var(--nav-height) + var(--tap-min) + var(--space-5));z-index:var(--z-dialog);display:flex;justify-content:center;pointer-events:none}.toast{max-width:100%;padding:var(--space-2) var(--space-4);border:1px solid var(--edge-gold);border-radius:var(--radius-round);background:#0d1112f0;box-shadow:0 6px 18px #00000080;color:var(--text-primary);font-size:var(--text-sm);font-weight:600;text-align:center}.toast[hidden]{display:none}.toast--in{animation:toast-in var(--dur-med) ease-out}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}.controls{position:absolute;right:calc(var(--safe-right) + var(--space-2));bottom:calc(var(--safe-bottom) + var(--nav-height) + var(--space-2));z-index:var(--z-hud);display:flex;align-items:flex-end;gap:var(--space-2)}.speed{display:flex;align-items:center}.speed__time{padding:0 var(--space-3);color:var(--text-muted);font-size:var(--text-sm);font-weight:700;font-variant-numeric:tabular-nums}.nav{position:absolute;left:0;right:0;bottom:0;z-index:calc(var(--z-panel) + 1);display:flex;gap:var(--space-1);height:calc(var(--nav-height) + var(--safe-bottom));padding:var(--space-1) calc(var(--safe-right) + var(--space-2)) calc(var(--safe-bottom) + var(--space-1)) calc(var(--safe-left) + var(--space-2));background:linear-gradient(180deg,rgba(13,17,18,.7),var(--cave-900) 45%);border-top:1px solid rgba(200,153,74,.25);pointer-events:auto}.nav__item{flex:1;display:grid;justify-items:center;align-content:center;gap:2px;min-width:0;border:1px solid transparent;border-radius:var(--radius-md);color:var(--text-muted);font-size:var(--text-xs);font-weight:700;transition:transform var(--dur-fast) ease,border-color var(--dur-fast) ease}.nav__item:active{transform:scale(.95)}.nav__item .sprite{width:38px;height:38px}.nav__item[aria-current=true]{border-color:var(--lantern-500);background:#f3b84c1f;box-shadow:var(--lantern-glow);color:var(--lantern-500)}.panel{position:absolute;top:calc(var(--safe-top) + var(--hud-height));left:calc(var(--safe-left) + var(--space-2));right:calc(var(--safe-right) + var(--space-2));bottom:calc(var(--safe-bottom) + var(--nav-height) + var(--space-2));z-index:var(--z-panel);display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(160deg,#27302c,#131819)}.panel[hidden]{display:none}.panel__header{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-2) var(--space-2) var(--space-4);border-bottom:1px solid rgba(200,153,74,.25)}.panel__title{flex:1;margin:0;font-family:var(--font-display);font-size:var(--text-xl);color:var(--parchment-100)}.panel__body{flex:1;overflow-y:auto;padding:var(--space-4);touch-action:pan-y;-webkit-overflow-scrolling:touch}.sheet{position:absolute;left:calc(var(--safe-left) + var(--space-2));right:calc(var(--safe-right) + var(--space-2));bottom:calc(var(--safe-bottom) + var(--nav-height) + var(--space-2));z-index:var(--z-panel);display:flex;flex-direction:column;max-height:52%;overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(160deg,#27302c,#131819);animation:sheet-in var(--dur-med) ease-out}.sheet[hidden]{display:none}@keyframes sheet-in{0%{opacity:0;transform:translateY(16px)}}.sheet__header{display:flex;align-items:center;gap:var(--space-2);padding:0 var(--space-1) 0 var(--space-4);border-bottom:1px solid rgba(200,153,74,.25)}.sheet__title{flex:1;margin:0;font-family:var(--font-display);font-size:var(--text-lg);color:var(--parchment-100)}.sheet__body{flex:1;display:grid;align-content:start;gap:var(--space-2);overflow-y:auto;padding:var(--space-2) var(--space-3);touch-action:pan-y;-webkit-overflow-scrolling:touch}.sheet__footer{padding:var(--space-2) var(--space-3) var(--space-3)}.sheet__text{margin:0;color:var(--text-muted)}.site-status{display:grid;gap:var(--space-2)}.site-status[hidden]{display:none}.site-status .section-heading{margin:var(--space-1) 0 0}.site-status [hidden]{display:none}.settings-row{display:grid;gap:var(--space-2);padding:var(--space-3) 0;border-bottom:1px solid rgba(200,153,74,.18)}.settings-row__buttons{display:flex;gap:var(--space-2)}.settings-row__buttons .btn{flex:1}.settings-row__hint{margin:0;color:var(--text-muted)}.settings-info{display:flex;justify-content:space-between;padding:var(--space-3) 0;color:var(--text-muted);font-variant-numeric:tabular-nums}.settings-info b{color:var(--text-primary)}.dialog-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:var(--z-dialog);display:grid;place-items:center;padding:var(--space-5);background:#0000009e;pointer-events:auto}.dialog-layer[hidden]{display:none}.dialog{width:min(100%,340px);padding:var(--space-5) var(--space-4) var(--space-4);border-radius:var(--radius-lg);text-align:center}.dialog__title{margin:0 0 var(--space-2);font-family:var(--font-display);font-size:var(--text-lg);color:var(--parchment-100)}.dialog__text{margin:0 0 var(--space-5);color:var(--text-muted);font-size:var(--text-md)}.dialog__actions{display:flex;gap:var(--space-2)}.dialog__actions .btn{flex:1}html,body{margin:0;height:100%;background:#050708;overscroll-behavior:none}body{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}#app{position:fixed;top:0;right:0;bottom:0;left:0;max-width:520px;margin:0 auto;overflow:hidden;background:#050708}#world{position:absolute;top:0;right:0;bottom:0;left:0}#world canvas{display:block;touch-action:none}#ui{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}