
/* Layout: control-room tool — summary rail left, plan canvas center (edge to edge), element dossier right; drawers below 1024px. */
:root{
  --bg:#e9edf0; --panel:#ffffff; --panel-2:#f4f6f8; --line:#d5dce2; --fg:#16212a; --muted:#5a6976;
  --accent:#0e6b75; --accent-fg:#ffffff; --accent-soft:#d9eef0; --canvas:#dfe4e8; --halo:#ffffff;
  --ok:#0b875b; --danger:#b42318; --warn:#a65d07;
  --s0:#6b7785; --s1:#d97706; --s2:#ea580c; --s3:#c026d3; --s4:#7c3aed; --s5:#2563eb; --s6:#0891b2; --sdone:#059669;
  --plan-filter:none; --fondo:#cdd4da; --lote:#b9c2ca; --exist:#8a6fa3; --shadow:0 1px 2px rgba(16,33,42,.08),0 6px 20px rgba(16,33,42,.10);
  --f-display:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0d1215; --panel:#141b20; --panel-2:#1a232a; --line:#28343c; --fg:#e4ecf1; --muted:#93a4b0;
  --accent:#43b9c4; --accent-fg:#04201f; --accent-soft:#123238; --canvas:#0a0e11; --halo:#0a0e11;
  --ok:#34c38f; --danger:#f0766a; --warn:#e3a14a;
  --s0:#8a96a3; --s1:#f59e0b; --s2:#fb7a3c; --s3:#e05ce8; --s4:#a37cf7; --s5:#5b8ef7; --s6:#22b8d6; --sdone:#2ec98d;
  --plan-filter:none; --fondo:#2f3b44; --lote:#3a4852; --exist:#a58cc0; --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.45);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0d1215; --panel:#141b20; --panel-2:#1a232a; --line:#28343c; --fg:#e4ecf1; --muted:#93a4b0;
  --accent:#43b9c4; --accent-fg:#04201f; --accent-soft:#123238; --canvas:#0a0e11; --halo:#0a0e11;
  --ok:#34c38f; --danger:#f0766a; --warn:#e3a14a;
  --s0:#8a96a3; --s1:#f59e0b; --s2:#fb7a3c; --s3:#e05ce8; --s4:#a37cf7; --s5:#5b8ef7; --s6:#22b8d6; --sdone:#2ec98d;
  --plan-filter:none; --fondo:#2f3b44; --lote:#3a4852; --exist:#a58cc0; --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.45);
  color-scheme:dark}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:14px;overflow:hidden}
#root{height:100%}
.f-display{font-family:var(--f-display);letter-spacing:.01em}
.f-mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.tnum{font-variant-numeric:tabular-nums}
.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.btn{display:inline-flex;align-items:center;gap:6px;border-radius:6px;padding:7px 11px;font-weight:500;border:1px solid var(--line);background:var(--panel);color:var(--fg);transition:background .15s,border-color .15s}
.btn:hover:not(:disabled){border-color:var(--accent)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn-primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.btn-primary:hover:not(:disabled){filter:brightness(1.08)}
.btn-danger{color:var(--danger)}
.btn-ghost{border-color:transparent;background:transparent}
.tool{width:38px;height:38px;display:grid;place-items:center;border-radius:6px;color:var(--fg);position:relative}
.tool:hover:not(:disabled){background:var(--panel-2)}
.tool[aria-pressed="true"]{background:var(--accent);color:var(--accent-fg)}
.tool:disabled{opacity:.35;cursor:not-allowed}
.tool kbd{position:absolute;right:2px;bottom:1px;font-size:9px;font-family:var(--f-mono);opacity:.6}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.seg button{padding:6px 10px;font-size:12px;font-weight:500;color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--accent-soft);color:var(--fg)}
.input{width:100%;border:1px solid var(--line);background:var(--panel);color:var(--fg);border-radius:6px;padding:7px 9px;font-size:13px}
.input:focus,.btn:focus-visible,.tool:focus-visible,.seg button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.bar{height:6px;border-radius:3px;background:var(--panel-2);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line)}
.bar>i{display:block;height:100%;border-radius:3px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px}
.float{background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}
.chk{display:grid;grid-template-columns:22px 1fr auto;gap:8px;align-items:center;padding:8px 10px;border-radius:6px;cursor:pointer}
.chk:hover{background:var(--panel-2)}
.chk input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent)}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block;flex:none;box-shadow:0 0 0 1.5px var(--halo),0 0 0 2.5px color-mix(in srgb,var(--fg) 25%,transparent)}
.scroll{overflow-y:auto;scrollbar-width:thin}
.toast{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:40}
svg text{paint-order:stroke;stroke:var(--halo);stroke-width:3px;stroke-linejoin:round}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

.boot{height:100%;display:grid;place-items:center;color:var(--muted);font-family:var(--f-body)}
.login-bg{background:radial-gradient(1200px 600px at 80% -10%, var(--accent-soft), transparent 60%), var(--bg)}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:10px 14px;border-radius:6px;border:1px solid var(--line);background:var(--panel);color:var(--fg);font-weight:500}
.gbtn:hover{border-color:var(--accent)}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:8px;border-bottom:1px solid var(--line)}
.tbl td{padding:8px;border-bottom:1px solid var(--line);vertical-align:middle}
.pill{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid var(--line)}
