:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:#08070a;color:#e0ddd8}#root{display:flex;flex-direction:column;align-items:center;min-height:100vh}.game-container{width:100%;max-width:720px;min-height:100vh;display:flex;flex-direction:column;padding:1.5rem;position:relative}.hud{display:flex;gap:1.2rem;align-items:center;padding:.75rem 1rem;background:#ffffff06;border:1px solid rgba(255,255,255,.07);border-radius:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.hud-stat{display:flex;align-items:center;gap:.4rem;font-size:.85rem}.hud-stat .label{color:#ffffff59;text-transform:uppercase;font-size:.6rem;letter-spacing:.1em}.hud-stat .value{font-weight:600;font-variant-numeric:tabular-nums}.stat-hp .value{color:#f87171}.stat-o2 .value{color:#38bdf8}.stat-atk .value{color:#fb923c}.stat-def .value{color:#60a5fa}.stat-gold .value{color:#facc15}.stat-floor .value{color:#a78bfa}.bar-container{width:80px;height:7px;background:#ffffff14;border-radius:4px;overflow:hidden}.bar-fill{height:100%;border-radius:4px;transition:width .4s ease}.bar-hp{background:linear-gradient(90deg,#b91c1c,#f87171)}.bar-o2{background:linear-gradient(90deg,#0369a1,#38bdf8)}.title-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2rem}.title-screen h1{font-size:2.6rem;font-weight:800;letter-spacing:-.04em;background:linear-gradient(135deg,#d97706,#dc2626,#7c2d12);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.title-screen .subtitle{color:#fff6;font-size:1.05rem;max-width:380px;line-height:1.6}.city-anim{width:160px;height:160px;position:relative;display:flex;align-items:center;justify-content:center}.city-anim .layer{position:absolute;border-radius:.5rem;border:2px solid rgba(217,119,6,.3);animation:crumble 2s ease-in-out infinite}.city-anim .layer:nth-child(1){width:100px;height:50px;bottom:10px;background:#d9770614;animation-delay:0s}.city-anim .layer:nth-child(2){width:80px;height:40px;bottom:50px;background:#dc262614;animation-delay:.3s}.city-anim .layer:nth-child(3){width:60px;height:30px;bottom:82px;background:#7c2d121f;animation-delay:.6s}.city-anim .rubble{position:absolute;bottom:0;width:120px;height:8px;background:linear-gradient(90deg,transparent,rgba(217,119,6,.15),rgba(220,38,38,.1),transparent);border-radius:50%}@keyframes crumble{0%,to{transform:translateY(0) rotate(0);opacity:.8}25%{transform:translateY(-3px) rotate(.5deg);opacity:1}50%{transform:translateY(2px) rotate(-.3deg);opacity:.6}75%{transform:translateY(-1px) rotate(.2deg);opacity:.9}}.district-overview{flex:1;display:flex;flex-direction:column;gap:1rem}.district-overview h2{font-size:1.3rem;font-weight:700;margin-bottom:.25rem}.district-progress{display:flex;gap:.4rem;margin-bottom:.5rem}.district-pip{flex:1;height:6px;border-radius:3px;background:#ffffff0f;overflow:hidden}.district-pip.active{background:#d9770633}.district-pip.done{background:#4ade8066}.district-pip-fill{height:100%;background:#d97706;border-radius:3px;transition:width .3s}.district-grid{display:flex;flex-direction:column;gap:.65rem}.district-card{position:relative;padding:1.1rem 1.25rem;border-radius:.65rem;cursor:pointer;transition:all .25s;border:1px solid rgba(255,255,255,.07);overflow:hidden;display:flex;gap:1rem;align-items:center}.district-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.1;transition:opacity .25s}.district-card:hover{transform:translateY(-1px);border-color:#ffffff2e}.district-card:hover:before{opacity:.18}.district-card.locked{opacity:.35;cursor:default;pointer-events:none}.district-card.completed{opacity:.5;cursor:default;pointer-events:none}.district-card .district-icon{font-size:2rem;flex-shrink:0;position:relative}.district-card .district-body{position:relative;flex:1}.district-card h3{font-size:1rem;font-weight:700;margin-bottom:.15rem}.district-card .district-floor{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;opacity:.5}.district-card .district-desc{font-size:.78rem;color:#ffffff73;margin-top:.3rem;line-height:1.4}.district-card .district-status{position:relative;font-size:.75rem;color:#ffffff4d}.district-card .district-status.available{color:#d97706}.district-card .district-status.done{color:#4ade80}.dist-warrens:before{background:linear-gradient(135deg,#78350f,#92400e)}.dist-warrens{border-color:#78350f4d}.dist-fungal:before{background:linear-gradient(135deg,#166534,#15803d)}.dist-fungal{border-color:#1665344d}.dist-industrial:before{background:linear-gradient(135deg,#4a5568,#718096)}.dist-industrial{border-color:#4a55684d}.dist-market:before{background:linear-gradient(135deg,#92400e,#d97706)}.dist-market{border-color:#92400e4d}.dist-gates:before{background:linear-gradient(135deg,#7f1d1d,#dc2626)}.dist-gates{border-color:#7f1d1d4d}.btn{padding:.65rem 1.4rem;border:1px solid rgba(255,255,255,.12);border-radius:.5rem;background:#ffffff0a;color:#e0ddd8;font-size:.92rem;cursor:pointer;transition:all .2s;font-family:inherit}.btn:hover{background:#ffffff17;border-color:#ffffff38}.btn-primary{background:linear-gradient(135deg,#b45309,#dc2626);border:none;font-weight:600}.btn-primary:hover{filter:brightness(1.15)}.btn-danger{border-color:#ef444459;color:#f87171}.btn-danger:hover{background:#ef44441f}.btn-row{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:1rem}.world-view{flex:1;display:flex;flex-direction:column;gap:1.15rem}.world-header{text-align:center;padding:1.25rem;border-radius:.65rem;position:relative;overflow:hidden}.world-header:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.12}.world-header h2{font-size:1.35rem;font-weight:800;position:relative}.world-header .world-desc{font-size:.82rem;color:#ffffff80;margin-top:.25rem;position:relative}.narrative-box{padding:1.15rem;background:#ffffff06;border:1px solid rgba(255,255,255,.05);border-radius:.65rem;min-height:90px;font-size:.9rem;line-height:1.7;color:#ffffffb3}.narrative-box .narrative-icon{font-size:1.4rem;margin-bottom:.4rem}.narrative-box strong{color:#e0ddd8}.encounter-panel{padding:1.15rem;border-radius:.65rem;border:1px solid rgba(255,255,255,.07)}.encounter-enemy{display:flex;align-items:center;gap:.85rem;margin-bottom:.85rem}.enemy-icon{font-size:2.2rem;width:52px;height:52px;display:grid;place-items:center;border-radius:.5rem;background:#ffffff0a}.enemy-info h3{font-size:1.05rem;font-weight:700}.enemy-info .enemy-hp-bar{width:130px;height:6px;background:#ffffff14;border-radius:3px;overflow:hidden;margin-top:.3rem}.enemy-info .enemy-hp-fill{height:100%;background:linear-gradient(90deg,#b91c1c,#ef4444);border-radius:3px;transition:width .3s}.enemy-stats{font-size:.78rem;color:#ffffff73;margin-top:.15rem}.combat-log{padding:.7rem;background:#0000004d;border-radius:.5rem;margin:.65rem 0;max-height:110px;overflow-y:auto;font-size:.8rem;line-height:1.7}.combat-log p{color:#ffffff80}.combat-log p.dmg-dealt{color:#fbbf24}.combat-log p.dmg-taken{color:#f87171}.combat-log p.heal-msg{color:#4ade80}.combat-log p.special-msg{color:#f59e0b}.inventory-panel{padding:.85rem;background:#ffffff05;border:1px solid rgba(255,255,255,.05);border-radius:.65rem}.inventory-panel h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:#ffffff59;margin-bottom:.6rem}.inventory-grid{display:flex;gap:.4rem;flex-wrap:wrap}.inv-item{padding:.35rem .6rem;border-radius:.35rem;font-size:.78rem;border:1px solid rgba(255,255,255,.08);background:#ffffff06;display:flex;align-items:center;gap:.25rem;cursor:pointer}.inv-item.rarity-common{border-color:#ffffff1f}.inv-item.rarity-uncommon{border-color:#22c55e59;color:#4ade80}.inv-item.rarity-rare{border-color:#3b82f659;color:#60a5fa}.inv-item.rarity-epic{border-color:#a855f759;color:#c084fc}.inv-item.rarity-legendary{border-color:#eab30859;color:#fbbf24}.game-over{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:1.5rem}.game-over h2{font-size:2rem;font-weight:800}.game-over .death-text{color:#ffffff73;max-width:360px;line-height:1.6}.game-over .stats-summary{display:flex;gap:1.4rem;padding:.85rem 1.3rem;background:#ffffff06;border:1px solid rgba(255,255,255,.07);border-radius:.5rem}.stats-summary .ss-item{text-align:center}.stats-summary .ss-label{font-size:.6rem;text-transform:uppercase;letter-spacing:.1em;color:#ffffff4d}.stats-summary .ss-value{font-size:1.3rem;font-weight:700}.victory-text{color:#4ade80}.reward-popup{padding:1.15rem;border:1px solid rgba(234,179,8,.25);background:#eab3080a;border-radius:.65rem;text-align:center}.reward-popup h3{color:#fbbf24;font-size:1.05rem;margin-bottom:.4rem}.reward-popup .reward-item{font-size:1.1rem;margin:.4rem 0}.warning-bar{padding:.5rem .8rem;border-radius:.4rem;font-size:.78rem;text-align:center;font-weight:600;letter-spacing:.02em;animation:pulse-warn 1.5s ease-in-out infinite}.warning-bar.danger{background:#dc26261f;border:1px solid rgba(220,38,38,.3);color:#f87171}.warning-bar.urgent{background:#eab3081a;border:1px solid rgba(234,179,8,.25);color:#fbbf24}@keyframes pulse-warn{0%,to{opacity:1}50%{opacity:.7}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:2px}@media(max-width:520px){.hud{gap:.6rem}.title-screen h1{font-size:1.9rem}.bar-container{width:60px}}