.shell {
 --glass-panel: rgba(249, 253, 254, .88);
 --glass-panel-strong: rgba(252, 254, 255, .96);
 --glass-edge: rgba(255, 255, 255, .98);
 --glass-rim: rgba(69, 116, 136, .18);
 --glass-depth: rgba(39, 82, 101, .16);
 position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; overflow: hidden;
 background:
 radial-gradient(740px 420px at 30% -12%, rgba(255,255,255,.96), transparent 72%),
 radial-gradient(620px 440px at 78% 18%, rgba(117,203,211,.10), transparent 72%);
}
html.dark .shell {
 --glass-panel: rgba(16, 24, 35, .86);
 --glass-panel-strong: rgba(19, 28, 40, .95);
 --glass-edge: rgba(157, 194, 211, .14);
 --glass-rim: rgba(155, 190, 207, .17);
 --glass-depth: rgba(0, 0, 0, .38);
}
.stale-bar {
 flex: none; padding: 6px 16px; font-size: 12px; text-align: center; cursor: pointer;
 background: var(--warn-bg, rgba(230, 160, 30, .16)); color: var(--warn, #c98a12);
 border-bottom: 1px solid rgba(230, 160, 30, .35);
}
.stale-bar:hover { text-decoration: underline; text-underline-offset: 2px; }
.topbar {
 flex: none; display: flex; align-items: center; gap: 12px;
 height: 52px; padding: 0 16px;
 background: linear-gradient(180deg, rgba(var(--glass-rgb), .94), rgba(var(--glass-rgb), .76));
 border-bottom: 1px solid rgba(64, 105, 122, .15); backdrop-filter: blur(18px) saturate(1.12); z-index: 30;
 box-shadow: 0 1px 0 rgba(255,255,255,.9), 0 8px 28px -24px rgba(29,73,91,.65);
}
.brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.brand .mark {
 width: 30px; height: 30px; border-radius: 9px; flex: none; display: grid; place-items: center;
 color: #fff; background: linear-gradient(145deg, var(--accent-grad-a), var(--accent-grad-b));
 border: 1px solid rgba(4, 91, 98, .48);
 box-shadow:
 inset 0 1px 0 rgba(255,255,255,.42),
 inset 0 -2px 4px rgba(1,58,65,.22),
 0 1px 1px rgba(255,255,255,.72),
 0 8px 18px -10px rgba(var(--accent-rgb),.76);
}
.brand .n { font-weight: 640; letter-spacing: -.02em; font-size: 14px; line-height: 1.1; white-space: nowrap; }
.brand .n small { display: block; font-size: 10px; color: var(--text-2); font-weight: 400; font-family: var(--mono); letter-spacing: 0; }
.topbar .spacer { flex: 1; }
.sum-wrap { display: flex; align-items: center; gap: 14px; margin-right: 4px; }
.sum { display: flex; align-items: baseline; gap: 5px; white-space: nowrap; }
.sum b { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 15px; font-weight: 620; }
.sum span { font-size: 11px; color: var(--text-2); }
.host-meter {
 display: inline-flex; align-items: center; gap: 8px; flex: none;
 height: 28px; padding: 0 8px 0 10px;
 border: 1px solid var(--glass-rim); border-radius: 9px;
 background: linear-gradient(180deg, rgba(224,235,239,.72), rgba(243,248,250,.66));
 box-shadow: inset 0 1px 2px rgba(31,71,88,.08), 0 1px 0 rgba(255,255,255,.9);
 user-select: none;
}
html.dark .host-meter {
 background: linear-gradient(180deg, var(--surface-0), var(--surface-2));
}
.host-meter .hm-lab {
 flex: none; width: 3.2em; text-align: left;
 font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase;
 color: var(--text-3); font-weight: 700; white-space: nowrap;
}
.host-meter .hm-item {
 display: inline-flex; align-items: baseline; gap: 4px; flex: none;
 white-space: nowrap; color: var(--text-1);
}
.host-meter .hm-item + .hm-item {
 padding-left: 8px;
 border-left: 1px solid rgba(64, 105, 122, .16);
}
html.dark .host-meter .hm-item + .hm-item { border-left-color: rgba(155, 190, 207, .18); }
.host-meter .hm-k {
 flex: none; width: 2.4em;
 font-size: 9.5px; letter-spacing: .04em; text-transform: uppercase;
 color: var(--text-2); font-weight: 620;
}
.host-meter .hm-gpu .hm-k { width: 2.6em; } 
.host-meter .hm-wait .hm-k { width: 2.6em; letter-spacing: 0; }
.host-meter .hm-v,
.host-meter .hm-sub {
 display: inline-block; flex: none;
 font-variant-numeric: tabular-nums; text-align: right;
 font-family: var(--mono);
}
.host-meter .hm-item b.hm-v {
 font-size: 11.5px; font-weight: 620;
}
.host-meter .hm-sub {
 font-size: 10.5px; color: var(--text-2); font-weight: 500;
}
.host-meter .hm-cpu .hm-v { min-width: 5ch; }
.host-meter .hm-wait .hm-v { min-width: 5ch; }
.host-meter .hm-avg .hm-v { min-width: 5ch; }
.host-meter .hm-mem .hm-v { min-width: 13ch; }
.host-meter .hm-gpu .hm-v { min-width: 4ch; }
.host-meter .hm-gpu .hm-pwr { min-width: 6ch; }
.host-meter .hm-gpu .hm-vram { min-width: 11ch; }
.host-meter .hm-v.host-ok,
.host-meter .hm-sub.host-ok { color: var(--success); }
.host-meter .hm-v.host-mid,
.host-meter .hm-sub.host-mid { color: var(--warning); }
.host-meter .hm-v.host-hot,
.host-meter .hm-sub.host-hot { color: var(--danger); }
.host-meter .hm-item.hm-na .hm-v { color: var(--text-3); }
html[data-density="compact"] .host-meter {
 height: 22px; padding: 0 6px 0 8px; gap: 6px; border-radius: 7px;
}
html[data-density="compact"] .host-meter .hm-lab,
html[data-density="compact"] .host-meter .hm-k { font-size: 9px; }
html[data-density="compact"] .host-meter .hm-item b.hm-v { font-size: 10.5px; }
html[data-density="compact"] .host-meter .hm-sub { font-size: 9.5px; }
html[data-density="compact"] .host-meter .hm-item + .hm-item { padding-left: 6px; }
.seg {
 display: inline-flex; padding: 3px; gap: 3px; flex: none;
 border: 1px solid var(--glass-rim); border-radius: 11px;
 background: linear-gradient(180deg, rgba(224,235,239,.88), rgba(243,248,250,.82));
 box-shadow: inset 0 1px 3px rgba(31,71,88,.10), 0 1px 0 rgba(255,255,255,.95);
}
html.dark .seg { background: linear-gradient(180deg, var(--surface-0), var(--surface-2)); }
.seg button {
 border: 0; background: transparent; color: var(--text-2); height: 26px; padding: 0 12px;
 border-radius: 8px; cursor: pointer; font-size: 12px; font-weight: 560; font-family: var(--sans);
 transition: background .16s, color .16s;
}
.seg button:hover { color: var(--text-1); }
.seg button.on {
 color: #fff; background: linear-gradient(145deg, var(--accent-grad-a), var(--accent-grad-b));
 box-shadow: inset 0 1px 0 rgba(255,255,255,.34), 0 3px 8px rgba(var(--accent-rgb),.28);
}
html.dark .seg button.on { color: #03161B; }
.seg button:disabled { opacity: .55; cursor: not-allowed; }
.ui-scale {
 display: inline-flex; align-items: center; gap: 6px; flex: none;
 height: 28px; padding: 0 8px 0 10px;
 border: 1px solid var(--glass-rim); border-radius: 9px;
 background: linear-gradient(180deg, rgba(224,235,239,.72), rgba(243,248,250,.66));
 box-shadow: inset 0 1px 2px rgba(31,71,88,.08), 0 1px 0 rgba(255,255,255,.9);
 user-select: none;
}
html.dark .ui-scale {
 background: linear-gradient(180deg, var(--surface-0), var(--surface-2));
}
.ui-scale-lab {
 font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase;
 color: var(--text-2); font-weight: 620; white-space: nowrap;
}
.ui-scale input[type="range"] {
 width: 88px; height: 4px; margin: 0; padding: 0;
 accent-color: var(--accent, #087F88); cursor: pointer;
}
.ui-scale-val {
 min-width: 38px; text-align: right;
 font-size: 11.5px; font-variant-numeric: tabular-nums;
 color: var(--text-1); font-weight: 560;
}
html[data-density="compact"] .ui-scale {
 height: 22px; padding: 0 6px 0 8px; gap: 5px; border-radius: 7px;
}
html[data-density="compact"] .ui-scale-lab { font-size: 9.5px; }
html[data-density="compact"] .ui-scale input[type="range"] { width: 72px; }
html[data-density="compact"] .ui-scale-val { font-size: 10.5px; min-width: 34px; }
.content {
 flex: 1; min-width: 0; min-height: 0; overflow: hidden;
 width: 100%; padding: 10px 12px;
 display: flex; flex-direction: column; gap: 10px;
}
.workspace {
 flex: 1; min-height: 0;
 display: flex; align-items: stretch; gap: 0;
}
.main-pane {
 flex: 1 1 auto; min-width: 0; min-height: 0;
 display: flex; flex-direction: column; gap: 10px;
}
.shell .card {
 border-color: var(--glass-edge);
 background: linear-gradient(180deg, var(--glass-panel-strong), var(--glass-panel));
 box-shadow:
 0 2px 5px rgba(29,67,84,.10),
 0 18px 42px -31px rgba(28,70,89,.54),
 inset 0 0 0 1px var(--glass-rim),
 inset 0 2px 0 rgba(255,255,255,.62);
 backdrop-filter: blur(18px) saturate(1.12);
}
.shell .card::before {
 inset: 3px;
 border-color: rgba(72,111,128,.055);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.66);
}
.shell .card::after {
 content: "";
 position: absolute; z-index: 3; pointer-events: none;
 top: 1px; left: 14px; right: 14px; height: 1px;
 background: linear-gradient(90deg, transparent, rgba(255,255,255,.98) 18%, rgba(255,255,255,.64) 78%, transparent);
}
html.dark .shell .card::after { opacity: .18; }
.toolbar {
 flex: none;
 display: flex; flex-direction: column;
 background:
 linear-gradient(112deg, rgba(255,255,255,.72), transparent 42%),
 linear-gradient(180deg, var(--glass-panel-strong), var(--glass-panel));
}
.tb-row {
 display: flex; align-items: center; gap: 10px;
 flex-wrap: nowrap;
 padding: 6px 12px;
 min-width: 0; height: 40px;
 overflow-x: auto; overflow-y: hidden;
 scrollbar-gutter: stable;
}
.tb-row + .tb-row { border-top: 1px solid var(--border); }
.tb-r1 { gap: 10px; }
.tb-r2 {
 gap: 8px; height: 34px; padding-top: 5px; padding-bottom: 5px;
 overflow: visible; position: relative; z-index: 8;
}
.tb-r3 { gap: 16px; height: 34px; padding-top: 5px; padding-bottom: 5px; }
.tb-r4,
.tb-r5 { gap: 8px; height: 34px; padding-top: 5px; padding-bottom: 5px; }
.f { display: inline-flex; align-items: center; gap: 6px; flex: none; min-width: 0; }
.f > label {
 font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase;
 color: var(--text-2); font-weight: 600; white-space: nowrap; flex: none;
}
.f.f-veh select { width: 88px; }
.f.f-vid select { width: 148px; }
.f.f-map { flex: none; }
.f.f-map select { width: 148px; }
.f.f-bundle { flex: none; }
.bundle-dd { position: relative; flex: none; }
.bundle-dd-btn {
 display: inline-flex; align-items: center; justify-content: space-between; gap: 6px;
 width: 168px; cursor: pointer; appearance: none; font-family: inherit;
}
.bundle-dd-cur { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bundle-dd.open .bundle-dd-btn { border-color: var(--accent); box-shadow: var(--ring); }
.bundle-dd-panel {
 position: fixed; z-index: 85;
 min-width: 188px; max-width: min(280px, calc(100vw - 16px));
 overflow: auto;
 padding: 4px; border-radius: 10px;
 background: var(--surface-1);
 border: 1px solid var(--border-strong);
 box-shadow: 0 16px 40px -18px var(--glass-depth), 0 1px 0 rgba(255,255,255,.9);
}
html.dark .bundle-dd-panel { box-shadow: 0 16px 40px -14px rgba(0,0,0,.55); }
.bundle-dd-item,
.bundle-dd-row {
 display: flex; align-items: center; gap: 4px;
 width: 100%; min-height: 28px;
}
.bundle-dd-item {
 border: 0; background: transparent; color: var(--text-1);
 padding: 4px 8px; border-radius: 7px; text-align: left;
 font: inherit; cursor: pointer; white-space: nowrap;
}
.bundle-dd-item.is-new { color: var(--accent); font-weight: 620; }
.bundle-dd-item:hover,
.bundle-dd-row:hover { background: var(--surface-2); }
.bundle-dd-row { padding: 0 2px 0 4px; border-radius: 7px; }
.bundle-dd-row.on { background: var(--accent-dim); }
.bundle-dd-row.off .bundle-dd-pick { color: var(--text-3); }
.bundle-dd-pick {
 flex: 1 1 auto; min-width: 0;
 border: 0; background: transparent; color: inherit;
 padding: 4px 6px; text-align: left;
 font: inherit; cursor: pointer;
 overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.bundle-dd-del {
 flex: none; width: 22px; height: 22px;
 border: 0; border-radius: 6px;
 background: transparent; color: var(--text-3);
 font: inherit; line-height: 1; cursor: pointer;
 white-space: nowrap;
}
.bundle-dd-del:hover { color: var(--danger); background: rgba(217,71,84,.10); }
.f-bundle-n {
 flex: none; min-width: 2.2em;
 font-size: 11px; font-weight: 620; color: var(--text-2);
 text-align: right; white-space: nowrap;
}
.f.f-prof { flex: 1 1 auto; min-width: 0; max-width: none; }
.prof-dd { position: relative; flex: none; }
.prof-dd-btn {
 display: inline-flex; align-items: center; justify-content: space-between; gap: 6px;
 width: 86px; cursor: pointer; appearance: none; font-family: inherit;
}
.prof-dd-caret { color: var(--text-3); font-size: 10px; line-height: 1; }
.prof-dd.open .prof-dd-btn { border-color: var(--accent); box-shadow: var(--ring); }
.prof-dd-panel {
 position: fixed; z-index: 80;
 display: flex; align-items: stretch; gap: 0;
 min-width: 420px; max-width: min(560px, calc(100vw - 16px));
 overflow: hidden;
 padding: 0; border-radius: 10px;
 background: var(--surface-1);
 border: 1px solid var(--border-strong);
 box-shadow: 0 16px 40px -18px var(--glass-depth), 0 1px 0 rgba(255,255,255,.9);
}
html.dark .prof-dd-panel {
 box-shadow: 0 16px 40px -14px rgba(0,0,0,.55);
}
.prof-dd-cat,
.prof-dd-sel {
 display: flex; flex-direction: column; min-width: 0; min-height: 0;
 overflow-x: hidden; overflow-y: auto;
}
.prof-dd-cat { flex: 1 1 220px; padding: 4px; }
.prof-dd-sel {
 flex: 1 1 180px; padding: 4px;
 border-left: 1px solid var(--border);
 background: var(--surface-2);
}
.prof-dd-col-h {
 display: flex; align-items: center; justify-content: space-between; gap: 8px;
 flex: none; padding: 4px 8px 6px;
 font-size: 10px; letter-spacing: .06em; text-transform: uppercase;
 color: var(--text-3); font-weight: 700;
}
.prof-dd-clear {
 appearance: none; border: 0; background: transparent;
 color: var(--text-2); font-size: 11px; letter-spacing: 0; text-transform: none;
 font-weight: 500; cursor: pointer; padding: 0;
}
.prof-dd-clear:hover { color: var(--accent); }
.prof-dd-clear:disabled { opacity: .55; cursor: not-allowed; }
.prof-dd-sel-empty {
 padding: 10px 8px; font-size: 11px; color: var(--text-3); font-family: var(--mono);
}
.prof-dd-group {
 appearance: none; border: 0; width: 100%; text-align: left;
 display: flex; align-items: center; gap: 6px;
 flex: none; min-height: 24px; padding: 3px 8px; margin-top: 2px;
 border-radius: 6px; background: transparent; cursor: pointer;
 font-size: 11px; font-weight: 700; color: var(--text-2);
}
.prof-dd-group:hover { background: var(--surface-3); }
.prof-dd-group-caret { flex: none; width: 12px; color: var(--text-3); font-size: 10px; }
.prof-dd-group-name { min-width: 0; }
.prof-dd-group-n {
 margin-left: auto; font-size: 10px; color: var(--text-3);
 font-family: var(--mono); font-weight: 500;
}
.prof-dd-group + .prof-dd-item { margin-top: 1px; }
.prof-dd-cat .prof-dd-item { padding-left: 22px; }
.prof-dd-item,
.prof-sel-row {
 display: flex; align-items: center; gap: 8px;
 min-height: 28px; padding: 4px 8px; border-radius: 6px;
 cursor: pointer; white-space: nowrap;
}
.prof-dd-item:hover,
.prof-sel-row:hover { background: var(--surface-3); }
.prof-dd-item.off { opacity: .45; cursor: not-allowed; }
.prof-dd-item input { width: 14px; height: 14px; accent-color: var(--accent); flex: none; }
.prof-dd-name { font-family: var(--mono); font-size: 12px; color: var(--text-1); min-width: 0; }
.prof-dd-bad { margin-left: auto; font-size: 10px; color: var(--text-3); }
.prof-sel-row { cursor: grab; user-select: none; }
.prof-sel-row.drag { opacity: .45; cursor: grabbing; }
.prof-sel-grip {
 flex: none; width: 10px; color: var(--text-3); font-size: 10px; letter-spacing: -2px;
}
.prof-hint {
 flex: none; font-size: 11px; color: var(--text-3); white-space: nowrap;
 font-family: var(--mono);
}
.prof-on {
 display: inline-flex; align-items: center; gap: 5px;
 flex: 1 1 auto; min-width: 0; overflow-x: auto; overflow-y: hidden;
 scrollbar-gutter: stable; cursor: pointer;
}
.prof-on-chip {
 flex: none; display: inline-flex; align-items: center; gap: 5px;
 height: 22px; padding: 0 8px 0 7px;
 border-radius: 999px;
 font-family: var(--mono); font-size: 11px; font-weight: 620;
 color: var(--accent);
 background: var(--accent-dim);
 border: 1px solid color-mix(in srgb, var(--accent) 38%, transparent);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
 white-space: nowrap;
}
.prof-on-chip::before {
 content: ""; width: 6px; height: 6px; border-radius: 50%; flex: none;
 background: var(--accent);
 box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent);
}
html.dark .prof-on-chip {
 box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.prof-dd-item.on {
 background: var(--accent-dim);
 box-shadow: inset 3px 0 0 var(--accent);
}
.prof-dd-item.on .prof-dd-name { color: var(--accent); font-weight: 620; }
.prof-dd-item.part {
 box-shadow: inset 3px 0 0 color-mix(in srgb, var(--accent) 50%, transparent);
}
.prof-dd-item.bundle .prof-dd-sub {
 margin-left: auto;
 max-width: 48%;
 overflow: hidden;
 text-overflow: ellipsis;
 font-family: var(--sans);
 font-size: 10px;
 font-weight: 500;
 letter-spacing: 0;
 text-transform: none;
 color: var(--text-3);
}
.prof-hint-btn {
 appearance: none; border: 0; background: transparent;
 padding: 0; cursor: pointer; text-align: left;
}
.prof-hint-btn:hover { color: var(--accent); }
.prof-hint-btn:disabled { opacity: .55; cursor: not-allowed; }
.prof-chip-x {
 appearance: none; border: 0; background: transparent; color: inherit;
 font: inherit; line-height: 1; padding: 0 0 0 2px; cursor: pointer; margin-left: auto;
}
.prof-chip-x:disabled { opacity: .55; cursor: not-allowed; }
.f.fgrow { flex: 1 1 240px; }
.f.fgrow select { flex: 1; min-width: 0; }
.inp, select.inp {
 font-family: var(--sans); font-size: 12.5px; color: var(--text-1);
 background: linear-gradient(180deg, rgba(246,250,252,.94), rgba(231,240,244,.82));
 border: 1px solid var(--glass-rim); border-radius: 8px;
 padding: 4px 8px; min-height: 30px;
 box-shadow: inset 0 1px 2px rgba(36,74,91,.08), 0 1px 0 rgba(255,255,255,.92);
 transition: border-color .16s, box-shadow .16s, background .16s;
}
html.dark .inp, html.dark select.inp { background: linear-gradient(180deg, var(--surface-1), var(--surface-2)); }
.inp.mono { font-family: var(--mono); font-size: 12px; }
.inp:focus { outline: none; border-color: var(--accent); box-shadow: var(--ring); }
.inp:disabled { opacity: .55; cursor: not-allowed; }
.check { display: flex; align-items: center; gap: 7px; cursor: pointer; min-height: 30px; white-space: nowrap;
 font-size: 12.5px; font-family: var(--sans); font-weight: 500; color: var(--text-1); flex: none; }
.check input { width: 15px; height: 15px; accent-color: var(--accent); flex: none; }
.check .off-note { font-size: 11px; color: var(--text-3); font-weight: 400; }
.chip {
 display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px;
 border-radius: 7px; font-size: 11px; font-family: var(--mono);
 background: linear-gradient(180deg, rgba(255,255,255,.84), rgba(237,244,247,.76));
 border: 1px solid rgba(70,111,129,.14); color: var(--text-2);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.88), 0 1px 2px rgba(32,67,82,.05);
 max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; flex: none;
}
html.dark .chip { background: linear-gradient(180deg, var(--surface-1), var(--surface-2)); }
.chip b { color: var(--text-1); font-weight: 560; }
.chip.ok::before, .chip.bad::before, .chip.warn::before {
 content: ""; width: 7px; height: 7px; border-radius: 50%; flex: none;
}
.chip.ok::before { background: var(--st-online); }
.chip.bad::before { background: var(--st-alarm); }
.chip.warn::before { background: var(--st-pending); }
.chip.bad { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 35%, transparent); }
.chip.warn { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 32%, transparent); }
.chip .chip-sub {
 color: var(--text-3); font-size: 10px; letter-spacing: .04em;
 padding-left: 5px; margin-left: 1px; border-left: 1px solid var(--border);
}
.chip.chip-map { max-width: 180px; }
.chip.chip-map b {
 overflow: hidden; text-overflow: ellipsis;
}
.chip.path {
 flex: 1 1 auto; min-width: 0; max-width: none; width: 100%;
}
.chip.path b {
 font-weight: 500; color: var(--text-3);
 overflow: hidden; text-overflow: ellipsis;
}
.btn {
 display: inline-flex; align-items: center; justify-content: center; gap: 6px;
 height: 32px; padding: 0 13px; border-radius: 10px; cursor: pointer;
 font-size: 12.5px; font-weight: 560; font-family: var(--sans); white-space: nowrap; user-select: none;
 border: 1px solid var(--glass-rim);
 background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(232,240,244,.88)); color: var(--text-1);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 0 1px 2px rgba(25,62,79,.10);
 transition: transform .3s var(--ease-premium), box-shadow .3s var(--ease-premium), border-color .2s, background .2s, color .2s;
}
.btn:hover { transform: translateY(-1px); border-color: var(--accent); box-shadow: inset 0 1px 0 #fff, 0 4px 9px -5px rgba(28,75,92,.42); }
.btn:active { transform: translateY(1px) scale(.985); box-shadow: inset 0 1px 3px rgba(25,62,79,.14); }
html.dark .btn { background: linear-gradient(180deg, var(--surface-2), var(--surface-1)); }
.btn[disabled] { opacity: .5; cursor: not-allowed; transform: none; border-color: var(--border-strong); }
.btn.sm { height: 26px; padding: 0 9px; font-size: 12px; border-radius: 8px; }
.btn.xs { height: 22px; padding: 0 8px; font-size: 11px; border-radius: 7px; }
.btn.icon { padding: 0; width: 32px; }
.btn.sm.icon { width: 26px; }
.btn.primary { color: #fff; border-color: var(--accent);
 background: linear-gradient(145deg, var(--accent-grad-a), var(--accent-grad-b));
 box-shadow: inset 0 1px 0 rgba(255,255,255,.42), inset 0 -2px 4px rgba(0,65,72,.18), 0 5px 12px -7px rgba(var(--accent-rgb),.82); }
html.dark .btn.primary { color: #03161B; }
.btn.danger {
 color: var(--danger);
 border-color: color-mix(in srgb, var(--danger) 34%, transparent);
 background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(250,237,239,.86));
}
html.dark .btn.danger { background: color-mix(in srgb, var(--danger) 8%, var(--surface-1)); }
.btn.danger:hover { border-color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface-1)); }
.btn.ghost { background: transparent; border-color: transparent; color: var(--text-2); }
.btn.ghost:hover { background: var(--surface-2); color: var(--text-1); border-color: transparent; }
.spin { width: 13px; height: 13px; border-radius: 50%; border: 2px solid currentColor; border-top-color: transparent; animation: spin .7s linear infinite; flex: none; }
@keyframes spin { to { transform: rotate(360deg); } }
.mods-card {
 flex: 1 1 auto; min-width: 0; min-height: 0; display: flex; flex-direction: column;
 container-type: inline-size; 
 container-name: modscard;
 background:
 linear-gradient(112deg, rgba(255,255,255,.66), transparent 38%),
 linear-gradient(180deg, var(--glass-panel-strong), var(--glass-panel));
}
.mods-card .card-title {
 flex: none; height: 38px; padding: 0 14px; gap: 10px;
 justify-content: flex-start; align-items: center; flex-wrap: nowrap;
 background: linear-gradient(180deg, rgba(255,255,255,.34), rgba(230,240,244,.18));
}
.card-title .title-text {
 flex: 1 1 auto; min-width: 0;
 display: flex; flex-wrap: nowrap; align-items: center; gap: 8px 10px;
 overflow: hidden;
}
.card-title .title-acts {
 flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px;
}
.card-title .tt { flex: none; white-space: nowrap; }
.card-title .sub {
 min-width: 0; flex: 0 1 auto;
 overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.card-title .sum-wrap { flex: none; }
.card-title .btn { flex: none; }
.mods-body {
 flex: 1 1 auto; min-height: 0; min-width: 0;
 display: flex; align-items: stretch;
}
.mods-scroll {
 flex: 1 1 auto; min-width: 0; min-height: 0;
 overflow: auto;
}
.mods-scroll.is-grabbing { cursor: grabbing; user-select: none; }
.mods-scroll.is-grabbing * { cursor: grabbing; user-select: none; }
.mods-ops {
 flex: 0 0 auto;
 width: 333px;
 display: flex; flex-direction: column;
 min-height: 0;
 background: var(--glass-panel);
 border-left: 1px solid var(--border);
 box-shadow: -6px 0 12px -10px rgba(25, 62, 79, .28);
}
html.dark .mods-ops { background: var(--surface-1); }
.ops-head {
 flex: none; height: 28px;
 display: flex; align-items: flex-end;
 color: var(--text-2); font: 540 10px/1 var(--mono); letter-spacing: .07em; text-transform: uppercase;
 background: rgba(244,249,251,.96);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.96), inset 0 -1px 0 var(--border);
}
html.dark .ops-head { background: rgba(17,24,36,.96); }
.ops-head .col-lvl,
.ops-head .col-acts {
 display: flex; align-items: flex-end; height: 100%;
 padding: 0 10px 5px; box-sizing: border-box;
}
.ops-head .col-lvl { width: 82px; flex: none; }
.ops-head .col-acts { width: 251px; flex: none; }
.ops-clip { flex: 1 1 auto; min-height: 0; overflow: hidden; }
.ops-track { will-change: transform; }
.ops-grp {
 height: 23px;
 background: linear-gradient(90deg, rgba(var(--accent-rgb),.075), rgba(231,240,244,.58));
 border-bottom: 1px solid var(--border);
}
html.dark .ops-grp { background: linear-gradient(90deg, rgba(var(--accent-rgb),.10), var(--surface-2)); }
.ops-row {
 height: 31px; box-sizing: border-box;
 display: flex; align-items: center;
 border-bottom: 1px solid var(--border);
}
.ops-row .col-lvl {
 width: 82px; flex: none; padding: 0 10px; box-sizing: border-box;
 display: flex; align-items: center;
}
.ops-row .col-acts {
 width: 251px; flex: none; padding: 0 10px; box-sizing: border-box;
 display: flex; align-items: center; justify-content: flex-end;
}
.ops-row.off { color: var(--text-2); }
.ops-row.dis { color: var(--text-3); }
.ops-row.exited-warn { background: color-mix(in srgb, var(--warning) 10%, transparent); }
html.dark .ops-row.exited-warn { background: color-mix(in srgb, var(--warning) 14%, var(--surface-1)); }
.ops-row.param-on { background: rgba(var(--accent-rgb), .04); }
.ops-param-spacer {
 flex: none; flex-shrink: 0;
 box-sizing: border-box;
 border-bottom: 1px solid var(--border);
}
table.mods {
 width: 100%;
 min-width: 36em;
 border-collapse: separate; border-spacing: 0;
 table-layout: fixed; 
}
table.mods col.c-idx { width: 2.4em; }
table.mods col.c-stat { width: 5.8em; }
table.mods col.c-pid { width: 8.2ch; }
table.mods col.c-up { width: 9.2ch; }
table.mods col.c-thr { width: 5.2ch; }
table.mods col.c-mem { width: 6.2ch; }
table.mods col.c-cpu { width: 6.8ch; }
table.mods col.c-wait { width: 6.8ch; }
table.mods col.c-load { width: 6.8ch; }
table.mods thead th {
 position: sticky; top: 0; z-index: 2;
 height: 28px; padding: 0 8px 5px; text-align: left; white-space: nowrap;
 box-sizing: border-box; vertical-align: bottom;
 color: var(--text-2); font: 540 10px/1 var(--mono); letter-spacing: .07em; text-transform: uppercase;
 background: rgba(244,249,251,.94);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.96), inset 0 -1px 0 var(--border);
}
table.mods thead th.right { text-align: right; }
html.dark table.mods thead th { background: rgba(17,24,36,.96); }
table.mods td {
 height: 31px; padding: 1px 8px; box-sizing: border-box;
 border-bottom: 1px solid var(--border); font-size: 12.5px; white-space: nowrap;
}
table.mods tr:last-child td { border-bottom: 0; }
table.mods tbody tr:hover td { background: rgba(var(--accent-rgb), .035); }
table.mods tbody tr.row-jump { cursor: pointer; }
table.mods tbody tr.row-jump:hover td { background: rgba(var(--accent-rgb), .06); }
table.mods tr.grp td {
 height: 23px;
 background: linear-gradient(90deg, rgba(var(--accent-rgb),.075), rgba(231,240,244,.58)) !important;
 color: var(--accent); font: 620 10.5px/1 var(--mono); letter-spacing: .09em; text-transform: uppercase;
}
html.dark table.mods tr.grp td { background: linear-gradient(90deg, rgba(var(--accent-rgb),.10), var(--surface-2)) !important; }
table.mods tr.off td { color: var(--text-2); }
table.mods tr.dis td { color: var(--text-3); }
td.right, th.right { text-align: right; }
.mod-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sw {
 --sw-w: 28px; --sw-h: 16px;
 position: relative; display: inline-block; flex: none;
 width: var(--sw-w); height: var(--sw-h); cursor: pointer;
}
.sw input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.sw i {
 display: block; width: 100%; height: 100%; border-radius: 99px;
 background: var(--surface-3); border: 1px solid var(--border-strong);
 box-shadow: inset 0 1px 1px rgba(16, 35, 45, .06);
 transition: background .16s cubic-bezier(.16,1,.3,1), border-color .16s;
}
.sw i::after {
 content: ""; position: absolute; top: 2px; left: 2px;
 width: 10px; height: 10px; border-radius: 50%;
 background: #fff; box-shadow: 0 1px 2px rgba(16, 35, 45, .22);
 transition: transform .16s cubic-bezier(.16,1,.3,1);
}
.sw input:checked + i {
 background: var(--accent); border-color: transparent;
}
.sw input:checked + i::after { transform: translateX(12px); }
.sw input:disabled + i { opacity: .38; }
.sw input:focus-visible + i { box-shadow: var(--ring); }
.sw.off i { background: var(--surface-2); }
.mod-name b { font-weight: 560; color: var(--text-1); }
.mod-name small { font-family: var(--mono); font-size: 10.5px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; }
tr.dis .mod-name b { color: var(--text-3); }
.stat-cell { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; min-width: 0; }
.stat-cell .txt {
 font-size: 12px; min-width: 0;
 overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.txt-on { color: var(--success); }
.txt-off { color: var(--text-3); }
.txt-busy { color: var(--st-pending); }
.txt-exited { color: var(--warning); font-weight: 600; }
.txt-exited-err { color: var(--danger); font-weight: 600; }
table.mods tr.exited-warn td {
 background: color-mix(in srgb, var(--warning) 10%, transparent);
}
table.mods tr.exited-warn .mod-name b { color: var(--warning); }
html.dark table.mods tr.exited-warn td {
 background: color-mix(in srgb, var(--warning) 14%, var(--surface-1));
}
.cpu-ok,
table.mods td.cpu-ok,
.sum b.cpu-ok { color: var(--success); }
.cpu-mid,
table.mods td.cpu-mid,
.sum b.cpu-mid { color: var(--warning); }
.cpu-hot,
table.mods td.cpu-hot,
.sum b.cpu-hot { color: var(--danger); }
select.lvl {
 font-family: var(--mono); font-size: 11.5px; color: var(--text-1);
 background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(231,240,244,.82));
 border: 1px solid var(--glass-rim); border-radius: 7px;
 box-shadow: inset 0 1px 1px rgba(37,74,91,.06);
 padding: 2px 5px; min-height: 24px; cursor: pointer;
}
html.dark select.lvl { background: linear-gradient(180deg, var(--surface-1), var(--surface-2)); }
select.lvl:focus { outline: none; border-color: var(--accent); box-shadow: var(--ring); }
select.lvl.warnish { color: var(--warning); }
select.lvl.errish { color: var(--danger); }
select.lvl:disabled { opacity: .38; cursor: not-allowed; color: var(--text-3); }
.col-name { min-width: 88px; }
.col-name .mod-name { max-width: 100%; overflow: hidden; }
.col-name .mod-name b {
 flex: 0 1 auto; min-width: 0; max-width: 100%;
 overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.col-stat { min-width: 72px; overflow: hidden; }
table.mods thead th.col-m,
table.mods td.col-m {
 font-family: var(--mono);
 font-variant-numeric: tabular-nums;
 letter-spacing: -.02em;
 box-sizing: border-box;
 white-space: nowrap;
 overflow: hidden;
 padding-left: 0.6ch;
 padding-right: 0.6ch;
 text-align: right;
 vertical-align: middle;
}
table.mods thead th.col-m { vertical-align: bottom; }
table.mods thead th.col-load,
table.mods td.col-load { padding-right: 1.2ch; }
table.mods td.col-load.warm { opacity: .55; font-style: italic; }
.mod-name .pc-mark {
 flex: none; font-style: normal; cursor: help;
 font-family: var(--mono); font-size: 9.5px; line-height: 1;
 padding: 2px 4px; border-radius: 3px;
 color: var(--text-3); border: 1px solid var(--border);
}
.mod-name .pc-mark.oom { color: var(--danger); border-color: currentColor; }
.mod-name .pc-mark.host {
 color: var(--accent); border-color: rgba(var(--accent-rgb), .38);
 background: rgba(var(--accent-rgb), .07);
}
@container modscard (max-width: 1040px) {
 .mods-card .card-title { gap: 8px; padding: 0 12px; }
 .card-title .title-text { gap: 6px 8px; }
 .card-title .title-acts { gap: 6px; }
 .sum-wrap { gap: 10px; margin-right: 0; }
 table.mods thead th,
 table.mods td { padding-left: 7px; padding-right: 7px; }
 .ops-head .col-lvl,
 .ops-row .col-lvl,
 .ops-head .col-acts,
 .ops-row .col-acts { padding-left: 7px; padding-right: 7px; }
 .row-acts { gap: 3px; }
}
@container modscard (max-width: 920px) {
 .mods-card .card-title { gap: 6px; padding: 0 10px; }
 .card-title .title-text { gap: 4px 6px; }
 .card-title .title-acts { gap: 5px; }
 .sum-wrap { gap: 8px; }
 table.mods thead th,
 table.mods td { padding-left: 5px; padding-right: 5px; }
 .ops-head .col-lvl,
 .ops-row .col-lvl,
 .ops-head .col-acts,
 .ops-row .col-acts { padding-left: 5px; padding-right: 5px; }
 table.mods thead th.col-m,
 table.mods td.col-m { padding-left: 0.5ch; padding-right: 0.5ch; }
 table.mods thead th.col-load,
 table.mods td.col-load { padding-right: 1ch; }
 .mod-name .pc-mark { padding: 1px 3px; }
 .row-acts {
 gap: 2px;
 grid-template-columns: 60px 24px 24px 24px 24px 24px;
 }
 .row-acts .act-main { width: 60px; min-width: 60px; padding: 0 4px; }
 .row-acts .btn.sm.icon { width: 24px; }
 .mods-ops { width: 306px; }
 .ops-head .col-lvl, .ops-row .col-lvl { width: 76px; }
 .ops-head .col-acts, .ops-row .col-acts { width: 230px; }
 select.lvl { padding: 2px 3px; }
}
@container modscard (max-width: 720px) {
 .card-title .sum-wrap { display: none; }
 .param-panel-body { grid-template-columns: 1fr; }
 .mods-ops { width: 292px; }
 .ops-head .col-lvl, .ops-row .col-lvl { width: 72px; }
 .ops-head .col-acts, .ops-row .col-acts { width: 220px; }
 .row-acts { grid-template-columns: 56px 22px 22px 22px 22px 22px; }
 .row-acts .act-main { width: 56px; min-width: 56px; }
 .row-acts .btn.sm.icon { width: 22px; }
}
@container modscard (max-width: 560px) {
 .card-title .sub { display: none; }
}
.col-params { min-width: 0; }
.param-row { display: none; }
tr.param-on td { background: rgba(var(--accent-rgb), .04); }
tr.param-expand td {
 padding: 0 12px 10px !important;
 background: rgba(var(--accent-rgb), .03);
 border-bottom: 1px solid var(--border);
}
.param-panel {
 margin: 2px 0 4px;
 padding: 10px 12px;
 border: 1px solid var(--glass-rim);
 border-radius: 12px;
 background: linear-gradient(180deg, var(--glass-panel-strong), var(--glass-panel));
 box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
}
.param-panel-hd {
 display: flex; align-items: center; gap: 10px; margin-bottom: 8px;
}
.param-panel-hd .t { font-weight: 620; font-size: 12.5px; }
.param-panel-hd .sub { font-size: 11px; color: var(--warning); }
.param-panel-hd .spacer { flex: 1; }
.param-panel-body {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 column-gap: 24px;
 row-gap: 8px;
 align-items: stretch;
}
.param-field {
 display: grid;
 grid-template-columns: 7em minmax(0, 1fr);
 align-items: center;
 column-gap: 10px;
 margin: 0; min-width: 0; min-height: 28px;
 font-size: 12px; color: var(--text-2);
}
.param-field .plab {
 min-width: 0; white-space: nowrap;
}
.param-field .sw { justify-self: start; }
select.param-sel,
input.param-inp {
 width: 100%; min-width: 0; max-width: 100%;
 height: 28px; padding: 0 8px; font-size: 12px;
 box-sizing: border-box;
}
input.param-inp.wide { width: 100%; }
input.param-inp:disabled { opacity: .38; cursor: not-allowed; color: var(--text-3); }
.param-field:has(:disabled) .plab { opacity: .55; }
.row-acts {
 display: inline-grid;
 grid-template-columns: 64px 26px 26px 26px 26px 26px;
 gap: 5px;
 align-items: center;
 justify-items: stretch;
 flex: none;
 width: max-content;
}
.row-acts .act-main {
 width: 64px;
 min-width: 64px;
 padding: 0 6px;
 justify-content: center;
 box-sizing: border-box;
 white-space: nowrap;
}
.row-acts .btn.icon.on {
 color: var(--accent);
 background: rgba(var(--accent-rgb), .12);
}
.row-acts .btn[disabled],
.row-acts .btn[disabled]:hover {
 opacity: .38;
 color: var(--text-3);
 background: transparent;
 border-color: transparent;
 cursor: not-allowed;
 transform: none;
 box-shadow: none;
}
.dock {
 flex: none; z-index: 25; width: min(480px, 36vw); max-width: 70vw; min-width: 0;
 display: flex; align-items: stretch; margin: 0 0 0 8px;
 background:
 linear-gradient(112deg, rgba(255,255,255,.72), transparent 40%),
 linear-gradient(180deg, var(--glass-panel-strong), var(--glass-panel));
 border: 1px solid var(--glass-edge); border-radius: 14px;
 box-shadow:
 0 2px 5px rgba(29,67,84,.10),
 0 20px 45px -31px rgba(28,70,89,.58),
 inset 0 0 0 1px var(--glass-rim),
 inset 0 2px 0 rgba(255,255,255,.62);
 backdrop-filter: blur(18px) saturate(1.12);
}
.dock-main {
 flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden;
 border-radius: 13px;
}
.dock .dbar { flex: none; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; padding: 6px 10px 4px; }
.dock .dbar .t { font-weight: 580; font-size: 12.5px; flex: none; }
.dock .dbar .spacer { flex: 1; }
.term-tabs {
 flex: none; display: flex; align-items: center; flex-wrap: wrap;
 gap: 6px; min-width: 0; overflow: visible; padding: 2px 10px 7px;
}
.term-tab {
 display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 7px 0 10px;
 border-radius: 8px; flex: none; cursor: pointer; user-select: none;
 font-size: 12px; font-weight: 540; color: var(--text-2);
 background: linear-gradient(180deg, rgba(255,255,255,.86), rgba(229,239,243,.78));
 border: 1px solid var(--glass-rim);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.82);
 transition: background .16s, color .16s, border-color .16s;
}
html.dark .term-tab { background: linear-gradient(180deg, var(--surface-2), var(--surface-1)); }
.term-tab:hover { color: var(--text-1); border-color: var(--border-strong); }
.term-tab.on { color: var(--accent); background: var(--accent-dim); border-color: color-mix(in srgb, var(--accent) 32%, transparent); }
.term-tab:focus-visible { outline: none; border-color: var(--accent); box-shadow: var(--ring); }
.term-tab .lab { display: flex; flex-direction: column; justify-content: center; gap: 2px; min-width: 0; line-height: 1.1; }
.term-tab .lc {
 display: inline-flex; align-items: center; gap: 5px;
 font: 600 12px/1 var(--mono); font-variant-numeric: tabular-nums; letter-spacing: .02em;
}
.term-tab .lc .sv.ok { color: #0B7B54; }
.term-tab .lc .sv.warn { color: #E6B422; }
.term-tab .lc .sv.err { color: #C62828; }
html.dark .term-tab .lc .sv.ok { color: #57C7A0; }
html.dark .term-tab .lc .sv.warn { color: #FFD08A; }
html.dark .term-tab .lc .sv.err { color: #FF6B74; }
.term-tab .nm { white-space: nowrap; }
.term-tab .x {
 width: 16px; height: 16px; border-radius: 5px; display: grid; place-items: center;
 font-size: 13px; line-height: 1; color: var(--text-3);
}
.term-tab .x:hover { background: color-mix(in srgb, var(--danger) 14%, transparent); color: var(--danger); }
.dock .term {
 flex: 1; min-height: 0;
 background: #0A0C10; color: #C9D6DE; font-family: var(--mono); font-size: 12px; line-height: 18px;
 padding: 10px 12px; margin: 0 7px 7px; overflow: auto; white-space: normal;
 border: 1px solid rgba(49,88,105,.44); border-radius: 8px; cursor: text;
 box-shadow:
 inset 0 1px 8px rgba(0,0,0,.78),
 inset 0 0 0 1px rgba(255,255,255,.025),
 0 1px 0 rgba(255,255,255,.68);
}
.dock .term:focus { outline: none; box-shadow: inset 0 0 0 1px rgba(var(--accent-rgb), .45); }
.dock .term-pad { flex: none; pointer-events: none; }
.dock .term-chunk {
 margin: 0; padding: 0; border: 0; background: transparent; color: inherit;
 font: inherit; line-height: 18px; white-space: pre; word-break: normal;
 overflow: visible; min-height: 0;
}
.dock .term.idle { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; cursor: default; }
.dock .term.idle::before {
 content: '暂无终端\A点模块行的「终端」图标查看输出\A启动 / 重启模块时会自动打开对应终端';
 white-space: pre-line; text-align: center; color: #5F7285; font-size: 12px; line-height: 2;
}
.term-search { flex: none; display: flex; align-items: center; gap: 6px; padding: 0 7px 7px; }
.term-search .inp { flex: 1; min-width: 0; min-height: 26px; font-size: 12px; padding: 2px 8px; }
.term-search .cnt {
 flex: none; min-width: 46px; text-align: center;
 font: 500 11px/1 var(--mono); font-variant-numeric: tabular-nums; color: var(--text-2);
}
.dock .term mark.tsr {
 background: rgba(255, 203, 90, .22); color: #FFE3A8;
 outline: 1px solid rgba(255, 203, 90, .38); border-radius: 2px;
}
.dock .term mark.tsr.cur { background: #FFC94D; color: #081018; outline-color: #FFC94D; }
.term-exit {
 flex: none; display: flex; align-items: center; gap: 8px;
 margin: 0 7px 7px; padding: 4px 10px; border-radius: 7px;
 font: 500 11.5px/1.5 var(--mono); color: var(--text-2);
 background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(232,240,244,.8));
 border: 1px solid var(--glass-rim);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}
.term-exit .spacer { flex: 1; }
.term-exit.err {
 color: var(--danger);
 border-color: color-mix(in srgb, var(--danger) 38%, transparent);
 background: linear-gradient(180deg, rgba(255,255,255,.92), color-mix(in srgb, var(--danger) 9%, #fff));
}
html.dark .term-exit { background: linear-gradient(180deg, var(--surface-2), var(--surface-1)); }
html.dark .term-exit.err { background: color-mix(in srgb, var(--danger) 14%, var(--surface-1)); }
.tty-badge {
 flex: none; height: 18px; padding: 0 7px; border-radius: 5px;
 display: inline-flex; align-items: center; font: 500 10.5px/1 var(--mono); letter-spacing: .04em;
}
.tty-badge.ok { color: #0B7B54; background: color-mix(in srgb, var(--st-online) 16%, transparent); }
html.dark .tty-badge.ok { color: var(--st-online); }
.tty-badge.ro { color: var(--text-3); background: var(--surface-2); }
.tty-badge.pause { color: #9A6B00; background: color-mix(in srgb, #FFC94D 22%, transparent); }
html.dark .tty-badge.pause { color: #FFC94D; }
.dock .drag { flex: none; width: 10px; margin-left: -5px; margin-right: -5px; cursor: ew-resize; position: relative; z-index: 3; touch-action: none; }
.dock .drag::after {
 content: ""; position: absolute; top: 50%; left: 1px; width: 7px; height: 56px;
 transform: translateY(-50%); border-radius: 5px;
 border: 1px solid rgba(63,103,120,.28);
 background: linear-gradient(90deg, rgba(255,255,255,.94), rgba(173,199,209,.86), rgba(255,255,255,.9));
 box-shadow: 0 2px 6px rgba(26,65,82,.18), inset 0 0 0 1px rgba(255,255,255,.54);
 transition: border-color .16s, box-shadow .16s;
}
.dock .drag:hover::after, .dock .drag:active::after {
 border-color: var(--accent);
 box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.10), 0 2px 6px rgba(26,65,82,.20);
}
.hl-btn.on { color: var(--accent); background: var(--accent-dim); }
.dock .term .lg-err { color: #FF8C92; }
.dock .term .lg-warn { color: #FFD08A; }
.dock .term .lg-dbg { color: #66788B; }
.dock .term .lg-meta { color: #69B7C4; }
.dock .term .lg-node { color: #7E93A8; }
.dock .term .tk-info { color: #57C7A0; }
.dock .term .tk-warn { color: #FFB84D; font-weight: 600; }
.dock .term .tk-err { color: #FF6B74; font-weight: 600; }
.dock .term .tk-dbg { color: #8B9AAB; }
.overlay { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 24px;
 background: rgba(25,45,55,.42); backdrop-filter: blur(2px); }
html.dark .overlay { background: rgba(4,6,10,.6); }
.modal { width: min(860px, 94vw); max-height: 86vh; display: flex; flex-direction: column; border-radius: 18px;
 background: var(--surface-1); border: 1px solid var(--border-highlight); box-shadow: var(--shadow-pop), inset 0 0 0 1px var(--border); }
.modal .m-head { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--border); }
.modal .m-head .t { font-weight: 620; font-size: 14px; white-space: nowrap; }
.modal .m-head .sub { font-family: var(--mono); font-size: 11.5px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.modal .m-head .spacer { flex: 1; }
.modal pre {
 margin: 0; flex: 1; min-height: 200px; overflow: auto; padding: 14px 18px;
 background: #0A0C10; color: #C9D6DE; font-family: var(--mono); font-size: 12px; line-height: 1.5;
 white-space: pre; border-radius: 0 0 18px 18px;
}
.modal .m-loading { display: flex; align-items: center; gap: 10px; justify-content: center; padding: 60px 0; color: var(--text-2); font-size: 13px; }
.modal.wide { width: 100%; max-width: none; height: 90vh; }
.modal.thr .m-head .sub { white-space: normal; }
.thr-body { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 12px 18px 16px; }
.thr-note { font-size: 11.5px; color: var(--text-3); line-height: 1.6; padding-bottom: 10px; }
.thr-grp { min-height: 0; display: flex; flex-direction: column;
 border: 1px solid var(--border); border-radius: 12px; background: var(--surface-0); overflow: hidden; }
.thr-tree { flex: 1; }
.thr-grp h4 { margin: 0; display: flex; align-items: center; gap: 8px; flex: none;
 padding: 7px 12px; font-size: 12.5px; font-weight: 620; border-bottom: 1px solid var(--border);
 min-width: 0; }
.thr-grp h4 small { font-weight: 500; font-size: 10.5px; color: var(--text-3);
 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.thr-grp h4 .grow { flex: 1; min-width: 8px; }
.thr-sort { display: flex; gap: 6px; flex: none; flex-wrap: nowrap; overflow-x: auto;
 scrollbar-gutter: stable; }
.thr-sort .seg.xs { padding: 2px; gap: 2px; border-radius: 9px; }
.thr-sort .seg.xs button { height: 22px; padding: 0 8px; font-size: 11px; border-radius: 7px; }
.thr-scroll { flex: 1; min-height: 0; overflow: auto; }
table.thr-tab { width: 100%; border-collapse: collapse; table-layout: fixed; }
table.thr-tab th { position: sticky; top: 0; z-index: 1; background: var(--surface-2);
 padding: 6px 8px; font-size: 10px; font-weight: 620; letter-spacing: .04em;
 text-transform: uppercase; color: var(--text-3); text-align: left; border-bottom: 1px solid var(--border); }
table.thr-tab col.c-lv { width: 4.5em; } 
table.thr-tab col.c-tid { width: 11ch; } 
table.thr-tab col.c-st { width: 9em; } 
table.thr-tab col.c-mem { width: 7.5ch; } 
table.thr-tab col.c-num { width: 9ch; } 
table.thr-tab col.c-wchan { width: 8em; } 
table.thr-tab col.c-sw { width: 7ch; } 
table.thr-tab col.c-core { width: 5.5ch; }
table.thr-tab td { padding: 4px 8px; font-size: 11.5px; border-bottom: 1px solid var(--border-faint, rgba(128,128,128,.12));
 white-space: nowrap; }
table.thr-tab th.right, table.thr-tab td.right { text-align: right; }
table.thr-tab td.right.mono {
 font-variant-numeric: tabular-nums lining-nums;
 padding-left: 12px; 
}
table.thr-tab .thr-comm { white-space: nowrap; }
table.thr-tab td.thr-empty { text-align: center; color: var(--text-3); padding: 22px 0; }
table.thr-tab.tree { table-layout: fixed; width: 100%; }
table.thr-tab.tree th, table.thr-tab.tree td { white-space: nowrap; }
table.thr-tab.tree th {
 text-transform: none; letter-spacing: 0;
}
table.thr-tab.tree th:nth-child(1),
table.thr-tab.tree td:nth-child(1),
table.thr-tab.tree th:nth-child(3),
table.thr-tab.tree th:nth-child(4),
table.thr-tab.tree td:nth-child(3),
table.thr-tab.tree td:nth-child(4) { text-align: right; }
table.thr-tab.tree th.sort { cursor: pointer; user-select: none; }
table.thr-tab.tree th.sort:hover, table.thr-tab.tree th.sort.on { color: var(--text-1); }
table.thr-tab.tree tr.thr-subhead td {
 padding: 2px 8px; font-size: 10px; color: var(--accent-strong, var(--accent));
 background: var(--accent-dim); border-bottom: 1px dashed var(--border-faint, rgba(128,128,128,.18));
 font-weight: 560;
}
table.thr-tab.tree tr.thr-subhead td.sub-lab { padding-left: 30px; }
table.thr-tab.tree tr.thr-subhead td.sort { cursor: pointer; user-select: none; }
table.thr-tab.tree tr.thr-subhead td.sort:hover,
table.thr-tab.tree tr.thr-subhead td.sort.on { color: var(--text-1); }
table.thr-tab td.tree-cell {
 white-space: nowrap; overflow: hidden;
 display: flex; align-items: baseline; gap: 10px; min-width: 0;
}
table.thr-tab .thr-name { flex: none; }
table.thr-tab td.thr-lv {
 font-family: var(--mono); font-size: 11px; color: var(--text-3);
 font-variant-numeric: tabular-nums lining-nums;
}
table.thr-tab .thr-cmd {
 flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis;
 color: var(--text-3); font-weight: 400; font-family: var(--mono);
}
table.thr-tab.tree tr.proc-row { cursor: pointer; background: var(--surface-1, rgba(128,128,128,.05)); }
table.thr-tab.tree tr.proc-row:hover { background: var(--surface-2); }
table.thr-tab.tree tr.proc-row td { border-top: 1px solid var(--border); }
table.thr-tab.tree tr.proc-row td.tree-cell b { font-weight: 620; }
table.thr-tab.tree .caret { display: inline-block; width: 12px; margin-right: 4px;
 color: var(--text-3); font-style: normal; transition: transform .12s ease; }
table.thr-tab.tree .caret::before { content: '\25B8'; }
table.thr-tab.tree tr.proc-row.open .caret { transform: rotate(90deg); }
table.thr-tab.tree tr.thr-row td.tree-cell { padding-left: 30px; color: var(--text-2); }
table.thr-tab.tree tr.thr-row td {
 background: color-mix(in srgb, var(--accent) 7%, var(--surface-0));
}
table.thr-tab.tree tr.thr-row td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
table.thr-tab.tree tr.thr-row.rs-st-run td {
 background: color-mix(in srgb, var(--success) 14%, var(--surface-1));
}
table.thr-tab.tree tr.thr-row.rs-st-run td:first-child { box-shadow: inset 3px 0 0 var(--success); }
table.thr-tab.tree tr.thr-row.rs-st-ready td,
table.thr-tab.tree tr.thr-row.rs-st-iowait td,
table.thr-tab.tree tr.thr-row.rs-st-pause td {
 background: color-mix(in srgb, var(--warning) 14%, var(--surface-1));
}
table.thr-tab.tree tr.thr-row.rs-st-ready td:first-child,
table.thr-tab.tree tr.thr-row.rs-st-iowait td:first-child,
table.thr-tab.tree tr.thr-row.rs-st-pause td:first-child { box-shadow: inset 3px 0 0 var(--warning); }
table.thr-tab.tree tr.thr-row.rs-st-io td,
table.thr-tab.tree tr.thr-row.rs-st-starve td,
table.thr-tab.tree tr.thr-row.rs-st-dead td {
 background: color-mix(in srgb, var(--danger) 12%, var(--surface-1));
}
table.thr-tab.tree tr.thr-row.rs-st-io td:first-child,
table.thr-tab.tree tr.thr-row.rs-st-starve td:first-child,
table.thr-tab.tree tr.thr-row.rs-st-dead td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
table.thr-tab.tree tr.thr-row.rs-st-sleep td { background: var(--surface-0); }
table.thr-tab.tree tr.thr-row.rs-st-sleep td:first-child { box-shadow: inset 3px 0 0 var(--text-3); }
table.thr-tab.tree tr.thr-row.prof-able:hover td { filter: brightness(.97); }
html.dark table.thr-tab.tree tr.thr-row.prof-able:hover td { filter: brightness(1.12); }
table.thr-tab.tree tr.thr-row.open td {
 filter: none;
 background: color-mix(in srgb, var(--accent) 16%, var(--surface-1));
}
table.thr-tab.tree tr.thr-row.prof-able { cursor: pointer; }
table.thr-tab.tree td.copy-id,
table.mods td.copy-id {
 cursor: pointer; overflow: visible; position: relative;
 border-radius: 6px;
 transition: color .15s, background .15s, box-shadow .15s;
}
table.thr-tab.tree td.copy-id:hover,
table.mods td.copy-id:hover {
 color: var(--accent);
 background: color-mix(in srgb, var(--accent) 12%, transparent);
 box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent);
}
table.thr-tab.tree td.copy-id.copied,
table.mods td.copy-id.copied {
 color: var(--success);
 background: color-mix(in srgb, var(--success) 16%, transparent);
 box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--success) 38%, transparent);
}
.copy-wrap { position: relative; display: inline-block; }
.copy-hint {
 position: absolute; left: calc(100% + 10px); top: 50%;
 transform: translateY(-50%) translateX(-4px);
 opacity: 0; pointer-events: none; z-index: 8;
 padding: 4px 8px; border-radius: 8px;
 font-style: normal; font-family: var(--sans); font-size: 11px; font-weight: 560;
 letter-spacing: .02em; color: #F4FBFC; background: #10232D;
 white-space: nowrap; box-shadow: var(--shadow-2);
 transition: opacity .14s var(--ease-premium), transform .14s var(--ease-premium);
}
.copy-hint::before { content: '复制'; }
.copy-hint::after {
 content: ''; position: absolute; right: 100%; top: 50%;
 transform: translateY(-50%);
 border: 5px solid transparent; border-right-color: #10232D;
}
td.copy-id:hover .copy-hint,
td.copy-id.copied .copy-hint { opacity: 1; transform: translateY(-50%); }
td.copy-id.copied .copy-hint { color: #03161B; background: var(--success); }
td.copy-id.copied .copy-hint::before { content: '已复制'; }
td.copy-id.copied .copy-hint::after { border-right-color: var(--success); }
td.copy-id:hover,
td.copy-id.copied { z-index: 5; }
table.thr-tab.tree .prof-caret { opacity: .55; }
table.thr-tab.tree .prof-caret.off { visibility: hidden; }
table.thr-tab.tree tr.thr-row.open .prof-caret { transform: rotate(90deg); opacity: 1; }
table.thr-tab.tree .wk-lock { color: var(--warning); }
table.thr-tab.tree .wk-io { color: var(--danger); }
table.thr-tab.tree .wk-poll, table.thr-tab.tree .wk-net { color: var(--text-2); }
table.thr-tab.tree .wk-timer, table.thr-tab.tree .wk-none,
table.thr-tab.tree .wk-child, table.thr-tab.tree .wk-idle { color: var(--text-3); }
table.thr-tab.tree .wk-other {
 color: var(--text-3); font-family: var(--mono); font-size: 10.5px;
 overflow: hidden; text-overflow: ellipsis;
}
table.thr-tab.tree tr.prof-row > td { background: var(--surface-0); padding: 6px 8px 8px 30px; }
.prof-wait, .prof-err, .prof-meta { font-size: 10.5px; color: var(--text-3); padding: 2px 0; }
.prof-err { color: var(--warning); }
.prof-warn { color: var(--danger); margin-left: 8px; }
.prof-item { display: flex; align-items: baseline; gap: 8px; padding: 1px 0; min-width: 0; }
.prof-pct {
 flex: none; width: 5ch; text-align: right; font-family: var(--mono); font-size: 11px;
 font-variant-numeric: tabular-nums lining-nums; color: var(--text-2);
}
.prof-bar { flex: none; width: 110px; height: 7px; border-radius: 3px; background: var(--surface-2); overflow: hidden; }
.prof-bar i { display: block; height: 100%; background: var(--accent, #4a9eff); }
.prof-bar i.kern { background: var(--text-3); } 
.prof-sym {
 flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
 font-family: var(--mono); font-size: 11px; color: var(--text-1);
}
.prof-dso { flex: none; font-size: 10px; color: var(--text-3); }
table.thr-tab.tree tr.diag-row > td {
 padding: 6px 10px 8px 26px;
 background: var(--surface-0);
 border-bottom: 1px solid var(--border);
}
table.thr-tab.tree tr.diag-row.dg-io > td { box-shadow: inset 3px 0 0 var(--danger); }
table.thr-tab.tree tr.diag-row.dg-cpu > td { box-shadow: inset 3px 0 0 var(--warning); }
.diag-lab { font-size: 11px; color: var(--text-3); margin-bottom: 4px; }
.diag-none { font-size: 11px; color: var(--text-3); font-style: italic; }
.diag-warn { font-size: 11px; color: var(--danger); margin-bottom: 4px; }
.diag-stack { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 2px 0; }
.diag-stack li {
 font-family: var(--mono); font-size: 11px; color: var(--text-2);
 padding: 1px 6px; border-radius: 3px; white-space: nowrap;
}
.diag-stack li::after { content: '←'; color: var(--text-3); margin-left: 6px; }
.diag-stack li:last-child::after { content: ''; }
.diag-stack li.top { color: var(--danger); font-weight: 600; }
.diag-stack li.sys { color: var(--text-3); }
.diag-hog { display: flex; align-items: center; gap: 8px; font-size: 11px; line-height: 1.7; }
.diag-cpu { flex: none; width: 58px; text-align: right; font-family: var(--mono); color: var(--warning); }
.diag-bar { flex: none; width: 90px; height: 6px; background: var(--surface-2); border-radius: 3px; overflow: hidden; }
.diag-bar i { display: block; height: 100%; background: var(--warning); }
.diag-sym { font-family: var(--mono); color: var(--text-1); }
.diag-dso { font-size: 10px; color: var(--text-3); }
table.thr-tab.tree td.memx-cell { cursor: pointer; }
table.thr-tab.tree td.memx-cell:hover,
table.thr-tab.tree td.memx-cell.open { color: var(--accent); text-decoration: underline dotted; }
table.thr-tab.tree tr.memx-row > td { background: var(--surface-0); padding: 6px 8px 8px 30px; }
.memx-sum { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; padding: 2px 0 5px; font-size: 11px; color: var(--text-2); }
.memx-chip b { margin-left: 4px; color: var(--text-1); }
.memx-chip::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 5px; background: var(--text-3); }
.memx-chip.mx-anon::before { background: var(--warning); }
.memx-chip.mx-file::before { background: var(--accent); }
.memx-chip.mx-shm::before { background: var(--success); }
.memx-chip.mx-swap::before { background: var(--danger); }
.memx-total { color: var(--text-2); font-size: 11px; }
.memx-total b { color: var(--text-1); }
.memx-chip.mx-swap { margin-left: auto; }
.memx-stack { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: var(--surface-2); margin: 0 0 6px; }
.memx-stack i { display: block; height: 100%; }
.memx-stack i.mx-anon, .memx-bar i.mx-anon { background: var(--warning); }
.memx-stack i.mx-file, .memx-bar i.mx-file { background: var(--accent); }
.memx-stack i.mx-shm, .memx-bar i.mx-shm { background: var(--success); }
.memx-ghead { display: flex; align-items: baseline; gap: 6px; margin: 7px 0 2px; font-size: 11px; font-weight: 600; color: var(--text-1); }
.memx-ghead:first-of-type { margin-top: 2px; }
.memx-ghead i { width: 8px; height: 8px; border-radius: 2px; align-self: center; background: var(--text-3); }
.memx-ghead i.mx-anon { background: var(--warning); }
.memx-ghead i.mx-file { background: var(--accent); }
.memx-ghead i.mx-shm { background: var(--success); }
.memx-ghead small { font-weight: 400; color: var(--text-3); }
.memx-gmore { padding-left: 21px; }
.memx-item { display: flex; align-items: baseline; gap: 8px; padding: 1px 0; min-width: 0; font-size: 11px; }
.memx-sz { flex: none; width: 7ch; text-align: right; font-size: 11px; color: var(--text-2); }
.memx-bar { flex: none; width: 110px; height: 7px; border-radius: 3px; background: var(--surface-2); overflow: hidden; }
.memx-bar i { display: block; height: 100%; }
.memx-path { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--mono); color: var(--text-1); }
.memx-path small { margin-left: 6px; color: var(--text-3); }
.memx-del { margin-left: 6px; color: var(--danger); font-style: normal; font-size: 10px; }
.memx-disk { flex: none; margin-left: auto; color: var(--text-3); font-size: 10.5px; padding-right: 4px; }
table.thr-tab.tree .st-run { color: var(--success); }
table.thr-tab.tree .st-ready { color: var(--warning); }
table.thr-tab.tree .st-io { color: var(--danger); font-weight: 600; }
table.thr-tab.tree .st-iowait { color: var(--warning); }
table.thr-tab.tree .st-starve { color: var(--danger); font-weight: 600; }
.m-head .st-starve, .m-head .st-io { color: var(--danger); }
table.thr-tab.tree .st-sleep { color: var(--text-3); }
table.thr-tab.tree .st-pause { color: var(--warning); }
table.thr-tab.tree .st-dead { color: var(--danger); }
table.thr-tab.tree .io-badge { margin-left: 6px; padding: 0 5px; border-radius: 6px;
 font-size: 10px; background: var(--warn-bg, rgba(230,160,30,.16)); color: var(--warn, #c98a12); }
table.mods td.drill { cursor: pointer; }
table.mods td.drill:hover { text-decoration: underline; text-underline-offset: 2px; }
.modal.confirm { width: min(440px, 92vw); }
.modal.confirm .m-body { padding: 18px; font-size: 13px; line-height: 1.7; }
.modal.confirm .m-body .warn { color: var(--warning); font-weight: 560; }
.modal.confirm .m-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 0 18px 16px; }
.modal.bundle-form .form-hint { margin: 0 0 10px; color: var(--text-2); font-size: 12px; line-height: 1.55; }
.modal.bundle-form .inp { width: 100%; box-sizing: border-box; }
.modal.bundle-form .form-err { margin: 8px 0 0; color: var(--danger); font-size: 12px; }
.toasts { position: fixed; right: 16px; bottom: 42px; z-index: 70; display: grid; gap: 8px; }
.toast {
 min-width: 260px; max-width: 400px; display: flex; align-items: center; gap: 9px;
 padding: 10px 14px 10px 12px; border-radius: 10px;
 background: var(--surface-1); border: 1px solid var(--border);
 border-left: 3px solid var(--success);
 box-shadow: var(--shadow-pop, var(--shadow-2));
 font-size: 13px; font-weight: 520;
 animation: toast-in .28s var(--ease-premium) both;
}
.toast .toast-mark {
 flex: none; width: 8px; height: 8px; border-radius: 50%;
 background: var(--success); box-shadow: 0 0 0 1px color-mix(in srgb, var(--success) 35%, transparent);
}
.toast .msg { min-width: 0; }
.toast.ok { border-left-color: var(--success); }
.toast.err { border-left-color: var(--danger); }
.toast.err .toast-mark { background: var(--danger); box-shadow: 0 0 0 1px color-mix(in srgb, var(--danger) 35%, transparent); }
.toast.warn { border-left-color: var(--warning); color: var(--warning); }
.toast.warn .toast-mark { background: var(--warning); }
.toast.info { border-left-color: var(--accent); }
.toast.info .toast-mark { background: var(--accent); }
@keyframes toast-in { from { opacity: 0; transform: translateX(28px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
 .toast { animation: none; }
}
html[data-density="compact"] body {
 font-size: 12px;
 line-height: 18px;
}
html[data-density="compact"] .topbar {
 height: 40px; padding: 0 12px; gap: 8px;
}
html[data-density="compact"] .brand { gap: 8px; }
html[data-density="compact"] .brand .mark { width: 24px; height: 24px; border-radius: 7px; }
html[data-density="compact"] .brand .n { font-size: 12.5px; }
html[data-density="compact"] .brand .n small { font-size: 9px; }
html[data-density="compact"] .sum-wrap { gap: 10px; }
html[data-density="compact"] .sum b { font-size: 13px; }
html[data-density="compact"] .sum span { font-size: 10px; }
html[data-density="compact"] .seg { padding: 2px; gap: 2px; border-radius: 9px; }
html[data-density="compact"] .seg button {
 height: 22px; padding: 0 9px; font-size: 11px; border-radius: 7px;
}
html[data-density="compact"] .content { padding: 8px 10px; gap: 8px; }
html[data-density="compact"] .main-pane { gap: 8px; }
html[data-density="compact"] .tb-row { gap: 8px; padding: 4px 10px; height: 34px; }
html[data-density="compact"] .tb-r1 { gap: 8px; }
html[data-density="compact"] .tb-r2 { height: 28px; padding-top: 3px; padding-bottom: 3px; gap: 6px; }
html[data-density="compact"] .tb-r3 { height: 28px; padding-top: 3px; padding-bottom: 3px; gap: 12px; }
html[data-density="compact"] .tb-r4,
html[data-density="compact"] .tb-r5 { height: 28px; padding-top: 3px; padding-bottom: 3px; gap: 6px; }
html[data-density="compact"] .f.f-veh select { width: 78px; }
html[data-density="compact"] .f.f-vid select { width: 132px; }
html[data-density="compact"] .f.f-map select { width: 132px; }
html[data-density="compact"] .prof-dd-btn { width: 78px; }
html[data-density="compact"] .prof-hint { font-size: 10.5px; }
html[data-density="compact"] .f { gap: 5px; }
html[data-density="compact"] .f > label { font-size: 9.5px; }
html[data-density="compact"] .inp,
html[data-density="compact"] select.inp {
 font-size: 11.5px; min-height: 26px; padding: 2px 7px; border-radius: 7px;
}
html[data-density="compact"] .inp.mono { font-size: 11px; }
html[data-density="compact"] .check {
 min-height: 26px; font-size: 11.5px; gap: 5px;
}
html[data-density="compact"] .check input { width: 13px; height: 13px; }
html[data-density="compact"] .check .off-note { font-size: 10px; }
html[data-density="compact"] .chip {
 height: 18px; padding: 0 7px; gap: 4px; font-size: 10px; border-radius: 6px;
}
html[data-density="compact"] .chip.ok::before,
html[data-density="compact"] .chip.bad::before,
html[data-density="compact"] .chip.warn::before { width: 6px; height: 6px; }
html[data-density="compact"] .chip .chip-sub { font-size: 9px; padding-left: 4px; }
html[data-density="compact"] .btn {
 height: 26px; padding: 0 10px; font-size: 11.5px; border-radius: 8px; gap: 4px;
}
html[data-density="compact"] .btn.sm { height: 22px; padding: 0 7px; font-size: 11px; border-radius: 7px; }
html[data-density="compact"] .btn.icon { width: 26px; }
html[data-density="compact"] .btn.sm.icon { width: 22px; }
html[data-density="compact"] .spin { width: 11px; height: 11px; }
html[data-density="compact"] .mods-card .card-title {
 height: 32px; padding: 0 10px; gap: 8px;
}
html[data-density="compact"] .card-title .title-text { gap: 6px 8px; }
html[data-density="compact"] .card-title .title-acts { gap: 6px; }
html[data-density="compact"] .card-title .tt { font-size: 12.5px; }
html[data-density="compact"] .card-title .sub { font-size: 10.5px; }
html[data-density="compact"] table.mods thead th {
 height: 24px; padding: 0 8px 4px; font-size: 9.5px;
}
html[data-density="compact"] table.mods td {
 height: 26px; padding: 0 8px; font-size: 11.5px;
}
html[data-density="compact"] table.mods tr.grp td {
 height: 20px; font-size: 9.5px;
}
html[data-density="compact"] .ops-head { height: 24px; }
html[data-density="compact"] .ops-grp { height: 20px; }
html[data-density="compact"] .ops-row { height: 26px; }
html[data-density="compact"] .mods-ops { width: 292px; }
html[data-density="compact"] .ops-head .col-lvl,
html[data-density="compact"] .ops-row .col-lvl { width: 72px; padding-left: 8px; padding-right: 8px; }
html[data-density="compact"] .ops-head .col-acts,
html[data-density="compact"] .ops-row .col-acts { width: 220px; padding-left: 8px; padding-right: 8px; }
html[data-density="compact"] .ops-head .col-lvl,
html[data-density="compact"] .ops-head .col-acts { padding-bottom: 4px; }
html[data-density="compact"] .mod-name { gap: 6px; }
html[data-density="compact"] .mod-name small { font-size: 9.5px; }
html[data-density="compact"] .stat-cell { gap: 5px; }
html[data-density="compact"] .stat-cell .txt { font-size: 11px; }
html[data-density="compact"] table.mods thead th.col-m,
html[data-density="compact"] table.mods td.col-m { padding-left: 0.5ch; padding-right: 0.5ch; }
html[data-density="compact"] table.mods thead th.col-load,
html[data-density="compact"] table.mods td.col-load { padding-right: 1ch; }
html[data-density="compact"] .mod-name .pc-mark { font-size: 9px; padding: 1px 3px; }
html[data-density="compact"] select.lvl {
 font-size: 10.5px; min-height: 20px; padding: 1px 4px; border-radius: 6px;
}
html[data-density="compact"] .row-acts {
 gap: 2px;
 grid-template-columns: 56px 22px 22px 22px 22px 22px;
}
html[data-density="compact"] .row-acts .act-main { width: 56px; min-width: 56px; }
html[data-density="compact"] .param-panel-hd .t { font-size: 11.5px; }
html[data-density="compact"] .param-panel-hd .sub { font-size: 10px; }
html[data-density="compact"] select.param-sel {
 min-width: 112px; height: 24px; padding: 0 6px; font-size: 11px;
}
html[data-density="compact"] input.param-inp {
 width: 96px; min-width: 80px; height: 24px; padding: 0 6px; font-size: 11px;
}
html[data-density="compact"] .dock {
 width: min(420px, 34vw); margin-left: 6px; border-radius: 12px;
}
html[data-density="compact"] .dock-main { border-radius: 11px; }
html[data-density="compact"] .dock .dbar { padding: 4px 8px 2px; gap: 3px 6px; }
html[data-density="compact"] .dock .dbar .t { font-size: 11.5px; }
html[data-density="compact"] .term-tabs { gap: 4px; padding: 1px 8px 5px; flex-wrap: wrap; }
html[data-density="compact"] .term-tab {
 height: 28px; padding: 0 5px 0 8px; gap: 5px;
 font-size: 11px; border-radius: 7px;
}
html[data-density="compact"] .term-tab .lab { gap: 1px; }
html[data-density="compact"] .term-tab .lc {
 gap: 4px; font-size: 10.5px;
}
html[data-density="compact"] .term-tab .x {
 width: 14px; height: 14px; font-size: 11px; border-radius: 4px;
}
html[data-density="compact"] .dock .term {
 font-size: 11px; line-height: 16px; padding: 8px 10px; margin: 0 5px 5px;
}
html[data-density="compact"] .dock .term-chunk { line-height: 16px; }
html[data-density="compact"] .dock .term.idle::before { font-size: 11px; line-height: 1.8; }
html[data-density="compact"] .term-search { gap: 5px; padding: 0 5px 5px; }
html[data-density="compact"] .term-search .inp { min-height: 22px; font-size: 11px; padding: 1px 6px; }
html[data-density="compact"] .term-search .cnt { font-size: 10px; min-width: 40px; }
html[data-density="compact"] .term-exit {
 margin: 0 5px 5px; padding: 3px 8px; font-size: 10.5px; border-radius: 6px;
}
html[data-density="compact"] .tty-badge { font-size: 9.5px; }
html[data-density="compact"] .topbar-icon-btn { width: 28px; height: 28px; border-radius: 7px; }
html[data-density="compact"] .toast { font-size: 12px; }
html[data-density="compact"] .modal .m-head { padding: 10px 14px; gap: 8px; }
html[data-density="compact"] .modal .m-head .t { font-size: 13px; }
html[data-density="compact"] .modal .m-head .sub { font-size: 10.5px; }
html[data-density="compact"] .modal .m-body pre { font-size: 11px; }
html[data-density="compact"] .modal.confirm .m-body { padding: 14px; font-size: 12px; }
@media (max-width: 900px) {
 .shell { height: auto; min-height: 100%; overflow: visible; }
 .shell.has-dock { padding-bottom: calc(min(240px, 45vh) + 100px); }
 .content { overflow: visible; padding: 12px; }
 .workspace { flex-direction: column; }
 .main-pane { flex: none; }
 .mods-card { flex: none; display: block; }
 .mods-body { max-height: min(70vh, 640px); }
 .topbar { flex-wrap: wrap; height: auto; padding: 10px 12px; row-gap: 8px; }
 .mods-card .card-title { height: auto; min-height: 38px; padding: 6px 12px; }
 .tb-row { padding: 8px 12px; gap: 10px; }
 .f.fgrow { flex: 1 1 100%; }
 .dock {
 position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
 width: auto !important; max-width: none;
 margin: 0; border-radius: 14px 14px 0 0;
 border-left: 0; border-top: 1px solid var(--border);
 box-shadow: 0 -10px 30px -18px rgba(22, 58, 76, .35);
 }
 .dock.no-tabs { display: none; }
 .dock .drag { display: none; }
 .dock .term { flex: none; height: min(240px, 45vh); }
}
@media (max-width: 640px) {
 .brand .n small { display: none; }
}