:root{color-scheme:dark;font-family:Space Grotesk,Avenir Next,IBM Plex Sans,Segoe UI,sans-serif;--panel-border: rgba(172, 213, 255, .38);--panel-bg-top: rgba(8, 22, 36, .9);--panel-bg-bottom: rgba(7, 13, 26, .82);--text-main: #e7f1ff;--text-subtle: #9eb5d2}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden;background:radial-gradient(circle at 18% 8%,#2f5c92,#2f5c9200 38%),radial-gradient(circle at 82% 12%,#6f4c1d,#6f4c1d00 34%),linear-gradient(170deg,#071123,#04060f)}body{color:var(--text-main)}.app-shell{position:relative;width:100%;height:100%;isolation:isolate}.viewport-wrap{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.viewport-wrap:before{content:"";position:absolute;top:-14%;right:-14%;bottom:-14%;left:-14%;pointer-events:none;background:radial-gradient(circle at 50% 16%,#ffcd7a38,#ffcd7a00 46%),radial-gradient(circle at 50% 78%,#16548842,#16548800 52%);mix-blend-mode:screen;animation:atmosphereDrift 17s ease-in-out infinite}.terrain-canvas{width:100%;height:100%;display:block}.cinematic-vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 55% 44%,#ffffff14,#fff0 48%),radial-gradient(circle at center,#04070c00 44%,#04070cb8)}.panel-toggle{position:absolute;left:16px;top:16px;z-index:12;border:1px solid rgba(184,218,255,.5);background:linear-gradient(180deg,#1a426eeb,#102845eb);color:#eff6ff;border-radius:999px;padding:7px 14px;font-size:.76rem;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;transition:transform .18s ease,filter .18s ease}.panel-toggle:hover{filter:brightness(1.08);transform:translateY(-1px)}.panel-toggle:active{transform:translateY(0)}.control-panel{position:absolute;top:58px;left:16px;z-index:11;width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 74px);overflow-y:auto;padding:16px;border-radius:16px;border:1px solid var(--panel-border);background:linear-gradient(170deg,var(--panel-bg-top),var(--panel-bg-bottom));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 18px 34px #00000061,inset 0 1px #ffffff17;transition:width .24s ease,max-height .24s ease,padding .24s ease}.control-panel.collapsed{width:min(294px,calc(100vw - 32px));max-height:306px;padding:14px}h1{margin:0;font-size:1.5rem;letter-spacing:.02em}.subtitle{margin:4px 0 14px;color:var(--text-subtle);font-size:.92rem}.live-preview{margin-bottom:14px;padding:11px;border-radius:12px;border:1px solid rgba(153,196,243,.28);background:linear-gradient(170deg,#0d2238c7,#0914239e),radial-gradient(circle at top right,#599ae629,#599ae600 52%)}.preview-row{display:flex;flex-direction:column;gap:5px;margin-bottom:9px}.preview-row:last-of-type{margin-bottom:0}.preview-header{display:flex;justify-content:space-between;align-items:baseline;font-size:.78rem;color:#c0d7f4}.preview-header strong{font-size:.79rem;color:#eef6ff;font-weight:600}.preview-track{height:8px;border-radius:999px;overflow:hidden;background:#102137cc;border:1px solid rgba(144,185,229,.2)}.preview-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2f9ae2,#56d5bf 52%,#f4c65f);box-shadow:0 0 10px #56d5bf66;transition:width .18s ease}.preview-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.preview-meta span{font-size:.7rem;color:#cde2fb;letter-spacing:.02em;padding:4px 7px;border-radius:999px;border:1px solid rgba(181,215,252,.23);background:#081625ad}.field,.toggle,.mode-selector,.stats,.legend{display:flex;flex-direction:column;gap:8px;margin-bottom:13px}.field>span,.legend>span{font-size:.86rem;color:#b9cfeb}.inline-row{display:flex;gap:8px}input[type=text]{width:100%;min-width:0;border:1px solid rgba(168,200,239,.38);background:#080f1bde;border-radius:9px;padding:8px 10px;color:#e5f0ff}input[type=range]{width:100%;accent-color:#56cfb8}button{border:1px solid rgba(160,195,237,.39);background:linear-gradient(180deg,#1b3e68,#123153);color:#e0eeff;border-radius:9px;padding:8px 10px;font-size:.82rem;cursor:pointer;transition:filter .16s ease}button:hover{filter:brightness(1.07)}.toggle{flex-direction:row;align-items:center;gap:10px;font-size:.88rem}.mode-selector button{width:100%;text-align:left}.mode-selector .active{background:linear-gradient(180deg,#2a5b8f,#1a426a);border-color:#c6e3ffbd}.stats{font-size:.85rem;padding:9px;border-radius:9px;background:#08111fba;border:1px solid rgba(140,180,232,.26)}.instructions{color:#9cb6d8;line-height:1.35}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{font-style:normal;padding:4px 8px;border-radius:999px;font-size:.74rem;border:1px solid rgba(240,246,255,.26)}.ocean{background:#12529894}.beach{background:#d4b05e85}.grass{background:#50ad5480}.forest{background:#215e2f9e}.snow{background:#d7e2f2a8;color:#0f1e33}@keyframes atmosphereDrift{0%,to{transform:translateZ(0) scale(1)}50%{transform:translate3d(-2%,1.8%,0) scale(1.045)}}@media(max-width:900px){.panel-toggle{left:12px;top:12px}.control-panel{left:12px;top:54px;width:calc(100vw - 24px);max-height:min(74vh,calc(100vh - 66px))}.control-panel.collapsed{width:calc(100vw - 24px);max-height:290px}}