:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color-scheme:dark}body,html,#root{margin:0;padding:0;height:100%;background:#05060a}.app-root{display:flex;flex-direction:column;height:100%;color:#f5f5f7}.app-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:radial-gradient(circle at 0 0,#1f2937,#020617);border-bottom:1px solid rgba(148,163,184,.3)}.title-block h1{margin:0;font-size:1.5rem}.title-block p{margin:4px 0 0;font-size:.9rem;color:#9ca3af}.header-actions{display:flex;align-items:center;gap:12px}.live-toggle{padding:8px 16px;border-radius:999px;border:1px solid #4b5563;background:transparent;color:#e5e7eb;cursor:pointer;font-size:.9rem;transition:all .15s ease-out}.live-toggle.on{border-color:#22c55e;background:#22c55e26;color:#bbf7d0}.app-layout{display:flex;flex:1;overflow:hidden}.left-panel{width:320px;padding:16px;background:#020617;border-right:1px solid rgba(148,163,184,.3);overflow-y:auto}.right-panel{flex:1;padding:16px;overflow-y:auto;background:radial-gradient(circle at top,#0f172a,#020617 60%)}.card{background:#0f172ae6;border-radius:12px;padding:16px;margin-bottom:16px;border:1px solid rgba(148,163,184,.25);box-shadow:0 10px 25px #0f172acc}.card h2,.card h3{margin:0 0 8px}.card p{margin:4px 0;font-size:.9rem}.card code{display:block;margin-top:4px;padding:6px 8px;background:#0f172ae6;border-radius:6px;font-size:.8rem;color:#e5e7eb}label{display:flex;flex-direction:column;font-size:.85rem;margin-bottom:8px;color:#d1d5db}input,select{margin-top:4px;padding:6px 8px;border-radius:6px;border:1px solid rgba(148,163,184,.6);background:#0f172ae6;color:#e5e7eb;font-size:.9rem}input:focus,select:focus{outline:none;border-color:#22c55e}.primary-btn{width:100%;margin-top:12px;padding:10px 0;border-radius:999px;border:none;background:linear-gradient(135deg,#22c55e,#22d3ee);color:#020617;font-weight:600;cursor:pointer;transition:transform .1s ease,box-shadow .1s ease}.primary-btn:hover{transform:translateY(-1px);box-shadow:0 10px 20px #22c55e66}.primary-btn:disabled{opacity:.6;cursor:default;transform:none;box-shadow:none}.metrics-row{display:flex;gap:16px;margin-bottom:16px;flex-wrap:wrap}.metric-card{flex:1 1 220px}.metric-value{font-size:1.8rem;font-weight:600}.metric-sub{font-size:.8rem;color:#9ca3af}.wide-card{margin-top:8px}svg{background:radial-gradient(circle at center,#020617 5%,#020617);border-radius:8px}