
:root{color-scheme:dark;--bg:#050816;--panel:rgba(255,255,255,.07);--line:rgba(255,255,255,.14);--text:#f8fafc;--muted:#b6c2d2;--gold:#f7d774;--blue:#93c5fd}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(circle at top left,#1d2b64 0,#050816 42%,#02030a 100%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}
.scos-pro-main{max-width:1180px;margin:0 auto;padding:42px 22px 80px}
.scos-pro-hero{border:1px solid var(--line);background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.035));border-radius:32px;padding:38px;box-shadow:0 24px 90px rgba(0,0,0,.35)}
.scos-pro-kicker{color:var(--gold);letter-spacing:.16em;text-transform:uppercase;font-size:12px;font-weight:800}
.scos-pro-title{font-size:clamp(34px,6vw,72px);line-height:.95;margin:14px 0}
.scos-pro-subtitle{font-size:18px;line-height:1.65;color:var(--muted);max-width:880px}
.scos-pro-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:22px}
.scos-pro-card{border:1px solid var(--line);background:var(--panel);border-radius:24px;padding:22px;min-height:150px}
.scos-pro-card h3{margin-top:0}
.scos-pro-pill{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:#dbeafe;border:1px solid var(--line);border-radius:999px;padding:10px 14px;margin:6px;background:rgba(255,255,255,.06)}
.scos-pro-pill.primary{background:linear-gradient(135deg,#2563eb,#7c3aed);color:white}
.scos-pro-pill.gold{color:#111827;background:linear-gradient(135deg,#fde68a,#f59e0b)}
.scos-status{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:#cbd5e1}


.scos-product-table{width:100%;border-collapse:separate;border-spacing:0 10px;margin-top:22px}
.scos-product-table td,.scos-product-table th{padding:14px;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);vertical-align:top}
.scos-product-table th{color:#f7d774;text-align:left;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.scos-product-table td:first-child,.scos-product-table th:first-child{border-left:1px solid rgba(255,255,255,.12);border-radius:16px 0 0 16px}
.scos-product-table td:last-child,.scos-product-table th:last-child{border-right:1px solid rgba(255,255,255,.12);border-radius:0 16px 16px 0}
.scos-mini{font-size:12px;color:#94a3b8}
.scos-ok{color:#86efac}
.scos-warn{color:#fde68a}

html[data-scos-demo-mode="false"] .scos-demo-only{display:none!important}
.scos-vrender-scene{border:1px solid rgba(255,255,255,.14);border-radius:24px;overflow:hidden;background:#020617;box-shadow:0 20px 70px rgba(0,0,0,.35)}
.scos-vrender-scene svg{width:100%;display:block}
.scos-vrender-meta code{display:block;margin:10px 0;color:#f7d774;white-space:normal}
.scos-vrender-controls{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.scos-vrender-controls button{border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.08);color:#e5e7eb;padding:8px 10px;text-transform:capitalize}

.scos-webgl-host{position:relative;border:1px solid rgba(255,255,255,.16);border-radius:28px;overflow:hidden;background:#020617;min-height:360px;box-shadow:0 30px 90px rgba(0,0,0,.42)}
.scos-webgl-host canvas{display:block;width:100%;height:100%}
.scos-webgl-overlay{position:absolute;left:18px;top:18px;z-index:4;background:rgba(2,6,23,.72);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:12px 14px;backdrop-filter:blur(14px)}
.scos-webgl-overlay strong{display:block;color:#fff}
.scos-webgl-overlay code{display:block;color:#f7d774;margin-top:6px;white-space:normal}
.scos-webgl-controls{position:absolute;left:18px;right:18px;bottom:18px;z-index:5;display:flex;gap:8px;flex-wrap:wrap}
.scos-webgl-controls button{border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(15,23,42,.82);color:#e5e7eb;padding:9px 12px;text-transform:capitalize;cursor:pointer}
.scos-webgl-controls button:hover{background:rgba(37,99,235,.8)}
.scos-webgl-label{position:absolute;right:18px;top:18px;z-index:5;color:#dbeafe;background:rgba(15,23,42,.72);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:8px 12px;font-size:12px}
.scos-webgl-error{padding:28px;border:1px solid rgba(239,68,68,.4);border-radius:18px;background:rgba(127,29,29,.35);color:#fecaca}
