:root{--bg: #141210;--panel: rgba(22, 19, 17, .94);--panel-solid: #1b1816;--panel-border: #34302c;--text: #ddd6cb;--text-dim: #aca397;--accent: #9b8b78;--accent-hover: #bcab96;--accent-cool: #88a8c0;--led-on: #9ac98d;--danger: #ca8d7d;--input-track: #37322d;--input-thumb: #ddd2c1;--ease-out: cubic-bezier(.2, 0, 0, 1);--ease-standard: cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15px;line-height:1.45;overflow:hidden}body{overscroll-behavior:none}#app{position:relative;width:100vw;height:100vh;overflow:hidden;background:radial-gradient(circle at 30% 24%,rgba(120,128,138,.08),transparent 38%),#141210}#three-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}.ui-panel{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:.9rem;padding:1rem;border-top:1px solid var(--panel-border);background:linear-gradient(180deg,#1c1815d6,#161311f7);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 -20px 60px #00000047;z-index:10}.ui-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.eyebrow{margin:0 0 .2rem;color:var(--accent-cool);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}.ui-header h1{margin:0;color:var(--text);font-size:1.24rem;font-weight:650;letter-spacing:.04em;text-transform:lowercase}.status-cluster{display:flex;align-items:center;gap:.6rem}.mode-pill{display:inline-flex;align-items:center;min-height:32px;padding:.35rem .7rem;border-radius:999px;border:1px solid rgba(154,201,141,.28);background:#9ac98d14;color:#d7e8d0;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}.mode-pill.paused{color:#f0d2c7;border-color:#ca8d7d52;background:#ca8d7d14}.status-led{width:8px;height:8px;border-radius:50%;background:var(--led-on);box-shadow:0 0 10px #9ac98db3;animation:pulse-led 2.5s ease-in-out infinite}.status-led.paused{background:var(--danger);box-shadow:0 0 10px #ca8d7db3;animation:none}@keyframes pulse-led{0%,to{opacity:1}50%{opacity:.4}}.intro-block,.ui-hint{border-radius:14px;border:1px solid rgba(136,168,192,.1);background:linear-gradient(180deg,#88a8c00f,#ffffff04)}.intro-block{padding:.9rem 1rem}.intro-copy,.ui-hint p{margin:0}.intro-copy{color:var(--text);font-size:.92rem}.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.stat-card{padding:.8rem .85rem;border-radius:12px;border:1px solid rgba(255,255,255,.035);background:#ffffff06}.stat-label{display:block;margin-bottom:.35rem;color:var(--text-dim);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}.stat-value{color:var(--text);font-size:1.1rem;font-weight:650;font-variant-numeric:tabular-nums}.ui-controls{display:grid;grid-template-columns:1fr;gap:.85rem}.control-group{display:flex;flex-direction:column;gap:.38rem;padding:.8rem .9rem;border-radius:12px;border:1px solid rgba(255,255,255,.03);background:#ffffff05}.control-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}.control-group label{color:#d4ccbf;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.control-group .value{display:inline-flex;align-items:center;justify-content:center;min-width:3rem;min-height:1.8rem;padding:.15rem .45rem;color:var(--text);font-size:.76rem;text-align:center;font-variant-numeric:tabular-nums;border-radius:999px;border:1px solid rgba(136,168,192,.14);background:#88a8c01a}.control-group input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:44px;background:transparent;outline:none;cursor:pointer}.control-group input[type=range]::-webkit-slider-runnable-track{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--accent-cool) 0%,var(--accent-cool) var(--percent, 50%),#3b3631 var(--percent, 50%),#4b453e 100%)}.control-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:28px;height:28px;margin-top:-9px;border-radius:50%;border:3px solid var(--panel-solid);background:var(--input-thumb);box-shadow:0 8px 18px #0000004d;transition:transform .15s var(--ease-standard),background .15s var(--ease-standard)}.control-group input[type=range]::-webkit-slider-thumb:active{transform:scale(.97);background:var(--accent-hover)}.control-group input[type=range]::-moz-range-track{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--accent-cool) 0%,var(--accent-cool) var(--percent, 50%),#3b3631 var(--percent, 50%),#4b453e 100%)}.control-group input[type=range]::-moz-range-thumb{width:28px;height:28px;border-radius:50%;border:3px solid var(--panel-solid);background:var(--input-thumb)}.control-group input[type=range]:focus-visible{outline:2px solid rgba(136,168,192,.75);outline-offset:4px;border-radius:14px}.ui-actions{display:flex;gap:.75rem}.ui-actions button{flex:1;min-height:44px;padding:.75rem 1rem;border-radius:10px;border:1px solid #474138;background:linear-gradient(180deg,#2e2925eb,#1f1c19eb);color:var(--text);font-size:.92rem;font-weight:600;cursor:pointer;touch-action:manipulation;transition:transform .15s var(--ease-standard),border-color .15s var(--ease-standard),background .15s var(--ease-standard)}.ui-actions button:hover{border-color:var(--accent);background:linear-gradient(180deg,#39332ef0,#26221ef0)}.ui-actions button:active{transform:scale(.97)}.ui-actions button:focus-visible{outline:2px solid rgba(136,168,192,.85);outline-offset:3px}.ui-hint{padding:.8rem .9rem;color:var(--text);font-size:.84rem;text-align:center}@media (min-width: 768px){.ui-panel{top:0;right:0;left:auto;bottom:auto;width:360px;height:100vh;gap:.68rem;padding:.9rem;border-top:none;border-left:1px solid var(--panel-border);overflow-y:auto}.ui-header h1{font-size:1.32rem}.intro-block{padding:.75rem .85rem}.intro-copy{font-size:.84rem;line-height:1.4}.stats-grid{gap:.55rem}.stat-card{padding:.68rem .72rem}.stat-label{margin-bottom:.22rem;font-size:.68rem}.stat-value{font-size:.98rem}.ui-controls{gap:.58rem}.control-group{padding:.62rem .75rem}.control-group input[type=range]{height:36px}.control-group input[type=range]::-webkit-slider-thumb{margin-top:-9px}.ui-actions{gap:.6rem}.ui-actions button{min-height:40px;padding:.65rem .85rem}.ui-hint{padding:.68rem .8rem;font-size:.76rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}