body{margin:0;min-width:320px;min-height:100vh;background:#02050a}#root{min-height:100vh}.storm{position:fixed;inset:0;overflow:hidden;background:radial-gradient(120% 60% at 50% 115%,#0f2433,#08131f 45%,#03070d),linear-gradient(180deg,#1a2f45,#0d1826 45%,#04070c)}.cloud-layer{position:absolute;inset:-20% -10% 35%;background:radial-gradient(45% 35% at 20% 40%,rgb(210 227 255 / 12%) 0%,transparent 70%),radial-gradient(55% 45% at 70% 60%,rgb(199 217 245 / 10%) 0%,transparent 72%),radial-gradient(38% 30% at 50% 15%,rgb(212 227 255 / 10%) 0%,transparent 75%);filter:blur(16px);animation:cloudDrift 18s ease-in-out infinite alternate;z-index:1}.bolt-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}.lightning-bolt{fill:none;stroke:rgb(var(--bolt-rgb, 222 239 255));stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgb(var(--bolt-rgb, 222 239 255) / 95%)) drop-shadow(0 0 16px rgb(var(--bolt-rgb, 222 239 255) / 80%));animation:boltFlicker .18s steps(2,end) forwards}.lightning-flash{position:absolute;inset:0;background:linear-gradient(180deg,rgb(var(--flash-rgb, 190 225 255) / 35%) 0%,transparent 72%);mix-blend-mode:screen;pointer-events:none;transition:opacity 70ms linear;z-index:3}.mist{position:absolute;inset:auto 0 0;height:40vh;background:linear-gradient(180deg,transparent 0%,rgb(6 12 19 / 82%) 70%);z-index:4}@keyframes cloudDrift{0%{transform:translate(-2.5%) translateY(-1%)}to{transform:translate(2.5%) translateY(1%)}}@keyframes boltFlicker{0%{opacity:.1}18%{opacity:1}55%{opacity:.5}to{opacity:0}}.control-panel{position:fixed;top:50%;left:50%;width:min(420px,calc(100% - 2rem));transform:translate(-50%,-50%);padding:1.2rem 1.25rem 1rem;border-radius:16px;border:1px solid rgb(182 210 246 / 35%);background:linear-gradient(165deg,#0a1522bf,#050b13e0);box-shadow:0 18px 38px #02050a73,inset 0 1px #dcf0ff1f;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#dceaf8;z-index:10}.panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}.panel-title{display:flex;align-items:center;gap:.5rem}.panel-title p{margin:0;font-size:.95rem;letter-spacing:.04em;text-transform:uppercase}.panel-dot{width:10px;aspect-ratio:1;border-radius:50%;background:#9bc7ff;box-shadow:0 0 0 3px #9bc7ff33,0 0 16px #9bc7ffd9}.panel-toggle-btn,.show-controls-btn{border:1px solid rgb(173 205 245 / 45%);border-radius:999px;background:#0e1e2fb3;color:#daeafa;font-size:.82rem;letter-spacing:.03em;padding:.35rem .78rem;cursor:pointer}.panel-toggle-btn:hover,.show-controls-btn:hover{background:#182b41c7}.slider-label{display:block;margin-bottom:.45rem;font-size:.95rem;color:#cadef6}.slider{width:100%;accent-color:rgb(153 205 255);cursor:pointer}.slider-value{margin:.65rem 0 0;font-size:.9rem;color:#b8d4f5;text-align:right}.color-row{display:flex;align-items:center;gap:.75rem}.color-picker{width:48px;height:32px;border:1px solid rgb(182 210 246 / 40%);border-radius:8px;background:transparent;padding:2px;cursor:pointer}.color-value{margin:0;color:#b8d4f5;font-size:.85rem;letter-spacing:.08em}.show-controls-btn{position:fixed;top:1rem;left:1rem;z-index:11}