:root { --ink:#142033; --muted:#637087; --line:#dce3ed; --paper:#f5f7fa; --panel:#fff; --blue:#155eef; --blue-dark:#0b3d91; --green:#13865b; --amber:#b85c00; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.45 Inter,Segoe UI,Arial,sans-serif; }
button { font:inherit; }
.workspace { min-height:100vh; display:grid; grid-template-columns:244px minmax(0,1fr); }
.sidebar { background:#101d32; color:#dce7fb; padding:24px 16px; display:flex; flex-direction:column; gap:34px; }
.brand { color:white; text-decoration:none; letter-spacing:.1em; font-size:20px; font-weight:700; }
.brand strong { color:#7eb0ff; margin-left:5px; }
.primary-nav { display:grid; gap:5px; }
.nav-item { text-align:left; border:0; border-radius:8px; padding:10px 12px; background:transparent; color:#dce7fb; cursor:pointer; }
.nav-item:hover,.nav-item.active { background:#223552; color:white; }
.nav-item.disabled { opacity:.48; cursor:not-allowed; }
.nav-item small { float:right; color:#9fb5d7; }
.read-only { margin-top:auto; color:#a8b9d3; font-size:13px; border-top:1px solid #31415d; padding:18px 4px 0; }
.content { min-width:0; padding:0 38px 38px; }
.topbar { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); }
.breadcrumbs { display:flex; gap:9px; align-items:center; color:var(--muted); font-size:13px; flex-wrap:wrap; }
.breadcrumbs span:not(:first-child)::before { content:"/"; margin-right:9px; color:#aab4c3; }
.breadcrumbs strong { color:var(--ink); font-weight:600; }
.topbar-actions { display:flex; gap:8px; }
.mode-chip,.read-only-chip { border-radius:999px; padding:5px 9px; font-size:11px; font-weight:700; letter-spacing:.05em; }
.mode-chip { color:#734200; background:#fff1d5; }.read-only-chip { color:#185a42; background:#ddf7ea; }
.object-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:34px 0 24px; }
.eyebrow { color:var(--blue); font-weight:700; font-size:12px; letter-spacing:.1em; margin:0 0 4px; }.object-head h1 { font-size:30px; margin:0; letter-spacing:-.03em; }.object-meta { color:var(--muted); margin:7px 0 0; }
.object-state { padding:8px 12px; border:1px solid #a7e4c7; color:var(--green); background:#edfff5; border-radius:7px; font-weight:600; white-space:nowrap; }
.section-tabs { display:flex; gap:22px; border-bottom:1px solid var(--line); overflow:auto; }.section-tabs button { padding:0 1px 12px; border:0; color:var(--muted); background:transparent; cursor:pointer; white-space:nowrap; }.section-tabs button.active { color:var(--blue); font-weight:700; border-bottom:2px solid var(--blue); }
.screen { padding-top:25px; }.loading,.notice { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:22px; color:var(--muted); }
.summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }.card,.panel { background:var(--panel); border:1px solid var(--line); border-radius:10px; }.card { padding:17px; }.metric-label { color:var(--muted); font-size:13px; }.metric-value { margin-top:7px; font-size:24px; font-weight:700; letter-spacing:-.03em; }.metric-unit { color:var(--muted); font-size:13px; font-weight:500; }.panel { margin-top:16px; padding:20px; }.panel h2 { font-size:17px; margin:0 0 12px; }.panel p { margin:7px 0; }.source-note { color:var(--muted); font-size:13px; }.state-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.state-row { padding:14px; border:1px solid var(--line); border-radius:8px; }.state-row span { display:block; color:var(--muted); font-size:13px; }.state-row strong { display:block; font-size:20px; margin-top:4px; }
.equipment-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.equipment { padding:16px; }.equipment h2 { margin:0 0 5px; font-size:16px; }.equipment p { margin:3px 0; color:var(--muted); font-size:13px; }.equipment .state { margin-top:11px; color:var(--green); font-weight:600; }
.parameter-toolbar { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:12px; color:var(--muted); }.parameter-table { width:100%; border-collapse:collapse; background:var(--panel); border:1px solid var(--line); border-radius:10px; overflow:hidden; }.parameter-table th,.parameter-table td { padding:12px 14px; text-align:left; border-bottom:1px solid var(--line); }.parameter-table th { color:var(--muted); font-size:12px; font-weight:600; background:#fafbfd; }.parameter-table tr:last-child td { border-bottom:0; }.parameter-table .value { font-weight:700; }.quality { color:var(--green); font-size:13px; }.error { border-color:#f0b6b1; color:#942923; background:#fff5f4; }
@media (max-width:900px) { .content { padding:0 22px 28px; }.summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.equipment-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:680px) { .workspace { display:block; }.sidebar { padding:13px 16px; gap:12px; }.primary-nav { display:flex; overflow:auto; gap:4px; }.nav-item { white-space:nowrap; padding:8px 10px; }.read-only { display:none; }.content { padding:0 16px 24px; }.topbar { min-height:56px; }.breadcrumbs span { display:none; }.breadcrumbs strong { display:block; }.object-head { padding:24px 0 17px; }.object-head h1 { font-size:24px; }.object-state { font-size:12px; padding:6px 8px; }.section-tabs { gap:17px; }.summary-grid,.equipment-grid,.state-list { grid-template-columns:1fr; }.parameter-table thead { display:none; }.parameter-table,.parameter-table tbody,.parameter-table tr,.parameter-table td { display:block; width:100%; }.parameter-table tr { padding:10px 0; border-bottom:1px solid var(--line); }.parameter-table td { padding:3px 14px; border:0; }.parameter-table td::before { content:attr(data-label); color:var(--muted); font-size:12px; display:block; }.topbar-actions { display:none; } }
/* A future verified Mini App launcher may use ?embed=1. No host API is assumed. */
.embedded .sidebar { display:none; }.embedded.workspace { grid-template-columns:1fr; }.embedded .content { padding-left:20px; padding-right:20px; }.embedded .topbar { min-height:48px; }