:root{--bg-top: #eef4ff;--bg-bottom: #f7f8f2;--panel: rgba(255, 255, 255, .86);--panel-strong: rgba(255, 255, 255, .95);--text: #0f1724;--muted: #4f6074;--border: rgba(128, 146, 168, .35);--accent: #0f7b7a;--accent-strong: #005f74;--focus: rgba(15, 123, 122, .25);--shadow: 0 20px 50px rgba(18, 29, 46, .12)}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:Space Grotesk,Avenir Next,Segoe UI,sans-serif;color:var(--text);background:radial-gradient(55rem 30rem at -10% -20%,rgba(15,123,122,.2),transparent 65%),radial-gradient(45rem 25rem at 110% -10%,rgba(255,142,90,.24),transparent 65%),linear-gradient(160deg,var(--bg-top),var(--bg-bottom))}.container{width:min(1280px,100%);margin:0 auto;padding:clamp(14px,2vw,28px);display:grid;gap:14px}.app-shell{animation:fadeIn .42s ease-out}.header{display:flex;justify-content:space-between;align-items:center;gap:12px}.title{margin:0;letter-spacing:.02em;font-size:clamp(1.35rem,2vw,1.8rem);font-weight:700}.chip,.status-pill{border:1px solid rgba(15,123,122,.2);background:#0f7b7a14;color:var(--accent-strong);border-radius:999px;padding:6px 12px;font-size:.78rem;letter-spacing:.02em}.footer{margin-top:2px;padding:8px 2px 2px;color:var(--muted);font-size:.82rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 14px}.socials{display:flex;flex-wrap:wrap;gap:10px 14px}.socials a{color:var(--accent-strong);text-decoration:none;border-bottom:1px solid transparent}.socials a:hover{border-bottom-color:color-mix(in srgb,var(--accent-strong) 45%,transparent)}.card{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:14px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:riseIn .36s ease both}.control-card{background:linear-gradient(180deg,var(--panel-strong),var(--panel))}.grid{display:grid;gap:14px}.main-layout{grid-template-columns:1fr}.side-stack{align-content:start}@media (min-width: 960px){.main-layout{grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);align-items:start}}.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.controls-grid .row{gap:9px}label{font-size:.77rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}select,input[type=number],input[type=range],button{font:inherit}select,input[type=number]{height:38px;padding:0 11px;border-radius:11px;border:1px solid var(--border);background:#fffc;color:var(--text);outline:none;transition:border-color .16s ease,box-shadow .16s ease}select:focus,input[type=number]:focus{border-color:color-mix(in srgb,var(--accent) 65%,#ffffff);box-shadow:0 0 0 4px var(--focus)}button{height:38px;padding:0 12px;border-radius:11px;border:1px solid var(--border);background:#fffc;color:var(--text);cursor:pointer;transition:transform .12s ease,border-color .12s ease,background .12s ease}button:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 45%,var(--border))}button.primary{border-color:color-mix(in srgb,var(--accent) 60%,var(--border));background:color-mix(in srgb,var(--accent) 10%,#ffffff)}button:disabled{opacity:.45;cursor:not-allowed;transform:none}input[type=range]{width:220px;accent-color:var(--accent)}.panel-title{font-size:.9rem;font-weight:700;letter-spacing:.03em}.kpi{margin-top:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.kpi>div{border:1px solid var(--border);border-radius:13px;padding:10px;background:#fff9}.kpi .name{color:var(--muted);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.kpi .val{font-size:1.02rem;margin-top:5px;font-weight:700}.codebox{border:1px solid var(--border);border-radius:13px;padding:12px;overflow:auto;max-height:380px;background:#edf3f8}pre{margin:0;font-family:IBM Plex Mono,Fira Code,SFMono-Regular,monospace;font-size:12.8px;line-height:1.55}@media (max-width: 720px){.header{align-items:flex-start;flex-direction:column}.status-pill{margin-left:0!important}input[type=range]{width:min(100%,220px)}.footer{flex-direction:column;gap:6px}}@keyframes riseIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}