/* OBSIDIAN CONTROL · active-view treatment only. Shell and chapter art live elsewhere. */
#view-body {
  --view-accent:#72e7f5;
  --view-accent-soft:rgba(94,220,237,.11);
  --view-glow:rgba(29,168,194,.12);
  --view-amber:#ffb878;
  position:relative;
  isolation:isolate;
  padding:clamp(12px,2.1vw,27px);
  background:
    linear-gradient(90deg,rgba(106,226,242,.055) 1px,transparent 1px),
    linear-gradient(rgba(106,226,242,.035) 1px,transparent 1px),
    radial-gradient(ellipse at 92% 0%,var(--view-glow),transparent 42%),
    #0a101b;
  background-size:36px 36px,36px 36px,auto,auto;
  border:1px solid rgba(130,187,210,.17);
  border-top:1px solid rgba(129,229,238,.38);
  box-shadow:0 28px 90px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.025);
}
#view-body > .panel,
#view-body .duo > .panel {
  --panel-accent:var(--view-accent);
  position:relative;
  min-width:0;
  overflow:hidden;
  margin:0 0 14px;
  padding:clamp(16px,2.15vw,27px);
  background:
    linear-gradient(118deg,var(--view-accent-soft),transparent 34%),
    linear-gradient(145deg,rgba(22,33,48,.98),rgba(13,21,33,.98));
  border:1px solid rgba(139,173,196,.17);
  border-radius:5px;
  box-shadow:0 12px 36px rgba(0,0,0,.19),inset 0 1px rgba(255,255,255,.035);
  transition:border-color .22s ease,transform .22s ease,box-shadow .22s ease;
}
#view-body > .panel::before,
#view-body .duo > .panel::before {
  position:absolute;
  content:"";
  inset:0 auto 0 0;
  width:2px;
  background:linear-gradient(180deg,var(--panel-accent),transparent 72%);
  opacity:.82;
}
#view-body > .panel:hover,
#view-body .duo > .panel:hover {
  border-color:color-mix(in srgb,var(--panel-accent),transparent 63%);
  box-shadow:0 15px 40px rgba(0,0,0,.25),0 0 28px color-mix(in srgb,var(--panel-accent),transparent 93%),inset 0 1px rgba(255,255,255,.045);
}
#view-body > .panel > h2,
#view-body .duo > .panel > h2 {
  display:flex;
  align-items:center;
  gap:.7rem;
  margin:0 0 1rem;
  color:#e6f1fb;
  font-size:clamp(1.02rem,1.55vw,1.27rem);
  font-weight:660;
  letter-spacing:-.035em;
}
#view-body > .panel > h2::before,
#view-body .duo > .panel > h2::before {
  content:"";
  width:7px;
  height:7px;
  flex:0 0 7px;
  background:var(--panel-accent);
  box-shadow:0 0 13px color-mix(in srgb,var(--panel-accent),transparent 24%);
  transform:rotate(45deg);
}
#view-body .panel > * + *,
#view-body .panel-body > * + * { margin-top:.9rem; }
#view-body :is(input,select,textarea) {
  color:#e6f2fb;
  background-color:#0a121e;
  border-color:rgba(140,182,208,.3);
}
#view-body :is(input,select,textarea):focus-visible,
#view-body button:focus-visible,
#view-body a:focus-visible,
#view-body iframe:focus-visible {
  outline:2px solid var(--view-accent);
  outline-offset:3px;
}
#view-body button,
#view-body .button {
  border-radius:4px;
  border-color:rgba(146,187,210,.32);
  background:linear-gradient(180deg,#1a2939,#121d2b);
  box-shadow:inset 0 1px rgba(255,255,255,.055);
  transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
#view-body button:hover,
#view-body .button:hover {
  border-color:color-mix(in srgb,var(--view-accent),transparent 38%);
  background:linear-gradient(180deg,#233a49,#172735);
  box-shadow:0 0 20px color-mix(in srgb,var(--view-accent),transparent 91%),inset 0 1px rgba(255,255,255,.08);
}
#view-body button.primary,
#view-body .button.primary {
  color:#07151b;
  border-color:#7ce8ef;
  background:linear-gradient(120deg,#8af2eb,#9cdaf5 58%,#b9cafa);
  box-shadow:0 5px 20px rgba(89,215,223,.15),inset 0 1px rgba(255,255,255,.72);
  font-weight:750;
}
#view-body button.danger,
#view-body [data-tone=bad] { --view-accent:#ff7882; }
#view-body .state,
#view-body progress { accent-color:var(--view-accent); }
#view-body .state { border-radius:3px; }
#view-body .state[data-tone=ok] { color:#8be1c7; border-color:rgba(91,210,171,.34); background:rgba(17,69,60,.27); }
#view-body .state[data-tone=warning] { color:#ffc17e; border-color:rgba(245,170,96,.38); background:rgba(87,52,23,.25); }
#view-body .state[data-tone=bad] { color:#ff9c9f; border-color:rgba(255,105,121,.38); background:rgba(83,29,42,.28); }
#view-body .note { color:#91a5b9; }
#view-body .stat {
  position:relative;
  padding:.85rem .9rem;
  border:1px solid rgba(130,180,204,.15);
  border-top:2px solid color-mix(in srgb,var(--view-accent),transparent 37%);
  background:linear-gradient(145deg,rgba(7,16,26,.55),rgba(19,31,45,.56));
}
#view-body .stat strong { color:#e9f7ff; font-size:clamp(1.2rem,2.2vw,1.8rem); }
#view-body .stat small { color:#9eb4c8; text-transform:uppercase; letter-spacing:.1em; font:600 .67rem/1.4 var(--mono); }
#view-body .stat meter { accent-color:var(--view-accent); }
#view-body .readout { align-items:stretch; gap:12px; }
#view-body .readout > .panel { margin:0; }
#view-body .readout .tunnel {
  border-color:rgba(111,221,232,.28);
  background:radial-gradient(ellipse at 50% 30%,rgba(61,192,208,.14),transparent 66%),#0e1925;
}
#view-body .tunnel .eyebrow { color:var(--view-accent); }
#view-body .wire-track::before { background:linear-gradient(90deg,transparent,var(--view-accent),transparent); }
#view-body .monitor-split { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(250px,.8fr); gap:14px; }
#view-body .priority-stack { display:grid; gap:14px; align-content:start; }
#view-body .priority-stack > .panel { margin:0; }
#view-body .monitor-toolbar,
#view-body .tools { gap:.55rem; }
#view-body .legend { color:#9ab0c4; }
#view-body .legend b:first-child { color:#ffb878; }
#view-body .legend b:last-child { color:#75e5f1; }
#view-body .chart { overflow:visible; filter:drop-shadow(0 0 5px rgba(108,220,232,.12)); }
#view-body .table-wrap { border-color:rgba(131,179,203,.2); border-radius:4px; }
#view-body table { font-variant-numeric:tabular-nums; }
#view-body th {
  color:#a8d7e2;
  background:linear-gradient(180deg,#1c2d3d,#172535);
  font:650 .7rem/1.4 var(--mono);
  text-transform:uppercase;
  letter-spacing:.055em;
}
#view-body td { color:#c5d3e0; }
#view-body tr:nth-child(even) td { background:rgba(111,155,184,.035); }
#view-body tr:hover td { background:rgba(93,210,226,.06); }
#view-body .term {
  border-color:rgba(105,203,223,.23);
  border-radius:4px;
  background:linear-gradient(140deg,rgba(5,14,23,.97),rgba(10,20,31,.98));
  box-shadow:inset 0 0 34px rgba(46,171,193,.045);
  color:#b8e2eb;
}
#view-body .terminal { min-height:300px; }
#view-body .pty-viewport { display:block; border-color:rgba(105,203,223,.42); border-radius:4px; }
#view-body .wide-frame { border-color:rgba(105,203,223,.29); border-radius:4px; }
#view-body .list li { border-color:rgba(135,174,197,.14); }
#view-body .list li::marker { color:var(--view-accent); }
#view-body progress { height:8px; }
#view-body dialog { border-radius:5px; border-color:rgba(110,219,230,.36); background:#101b28; }
#view-body .check-label { color:#b9cbd8; }

/* Every station receives its own instrument tint and background field. */
#view-body[data-view=dashboard] { --view-accent:#71e6f2; --view-accent-soft:rgba(89,211,229,.09); --view-glow:rgba(25,174,204,.17); }
#view-body[data-view=vps1] { --view-accent:#ffb674; --view-accent-soft:rgba(255,171,103,.09); --view-glow:rgba(181,92,50,.16); }
#view-body[data-view=vps2] { --view-accent:#76e5f1; --view-accent-soft:rgba(91,214,226,.1); --view-glow:rgba(31,146,177,.17); }
#view-body[data-view=docker] { --view-accent:#c5a0ff; --view-accent-soft:rgba(163,122,235,.1); --view-glow:rgba(113,72,175,.15); }
#view-body[data-view=routes] { --view-accent:#8fb8ff; --view-accent-soft:rgba(102,148,245,.1); --view-glow:rgba(68,105,189,.16); }
#view-body[data-view=dns] { --view-accent:#70e4d0; --view-accent-soft:rgba(76,210,178,.09); --view-glow:rgba(35,155,129,.14); }
#view-body[data-view=storage] { --view-accent:#f5bb79; --view-accent-soft:rgba(245,171,94,.09); --view-glow:rgba(173,108,48,.16); }
#view-body[data-view=logs] { --view-accent:#9bd9ff; --view-accent-soft:rgba(112,198,235,.09); --view-glow:rgba(51,128,178,.15); }
#view-body[data-view=accounts] { --view-accent:#f1a9d5; --view-accent-soft:rgba(219,126,186,.085); --view-glow:rgba(151,75,135,.15); }
#view-body[data-view=shell] { --view-accent:#7fe9c8; --view-accent-soft:rgba(82,210,164,.09); --view-glow:rgba(36,148,116,.14); }
#view-body[data-view=risks] { --view-accent:#ff8d92; --view-accent-soft:rgba(239,100,122,.1); --view-glow:rgba(170,50,79,.17); }
#view-body[data-view=updates] { --view-accent:#ffd078; --view-accent-soft:rgba(250,192,92,.09); --view-glow:rgba(180,123,42,.16); }
#view-body[data-view=settings] { --view-accent:#8acbff; --view-accent-soft:rgba(104,174,233,.09); --view-glow:rgba(55,106,168,.15); }
#view-body[data-view=ollama] { --view-accent:#d1a5ff; --view-accent-soft:rgba(172,118,235,.09); --view-glow:rgba(116,65,175,.16); }

#view-body[data-view=dashboard] > .panel:first-child,
#view-body[data-view=risks] > .panel:first-child {
  border-top-color:color-mix(in srgb,var(--view-accent),transparent 18%);
}
#view-body[data-view=dashboard] .readout .stat strong { font-size:clamp(1.45rem,2.6vw,2.15rem); }
#view-body[data-view=dashboard] .monitor-split > .panel:first-child { min-height:300px; }
#view-body[data-view=logs] .terminal,
#view-body[data-view=shell] .pty-viewport { box-shadow:inset 0 0 42px rgba(53,180,152,.06); }
#view-body[data-view=storage] progress { accent-color:#f5bb79; }
#view-body[data-view=updates] .state[data-tone=warning],
#view-body[data-view=risks] .state[data-tone=bad] { box-shadow:0 0 16px rgba(255,132,123,.08); }

@media (max-width:900px) {
  #view-body .monitor-split { grid-template-columns:minmax(0,1fr); }
  #view-body .priority-stack { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
  #view-body { padding:9px; background-size:26px 26px,26px 26px,auto,auto; }
  #view-body > .panel,
  #view-body .duo > .panel { margin-bottom:10px; padding:14px 13px; }
  #view-body .priority-stack { grid-template-columns:1fr; }
  #view-body .readout { gap:9px; }
  #view-body .monitor-toolbar { align-items:stretch; }
  #view-body .monitor-toolbar .note { flex-basis:100%; }
  #view-body .tools { flex-wrap:wrap; }
  #view-body .pty-viewport { height:390px; }
  #view-body .wide-frame { min-height:62vh; }
  #view-body .chart { min-height:130px; }
  #view-body th,#view-body td { padding:.62rem .65rem; }
}
@media (prefers-reduced-motion:reduce) {
  #view-body *,#view-body *::before,#view-body *::after { transition:none !important; }
}