:root {
  color-scheme:light;
  --canvas:#f7f8fb; --surface:#fff; --soft:#f8f9fc; --ink:#20232d; --muted:#626876; --quiet:#696f7c;
  --border:rgb(39 46 68 / 9%); --control:#8991a0; --brand:#535bcf; --brand-hover:#434ab1; --brand-soft:#f0f1fc;
  --success:#18734b; --success-soft:#eef8f2; --danger:#b33243; --danger-soft:#fdf0f2; --warning:#8c610c; --warning-soft:#fbf5e8;
  --glass-border:rgb(255 255 255 / 80%); --log-divider:rgb(39 46 68 / 6%); --log-highlight:#fff0b8;
  --sans:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
  --mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace;
  --radius:12px; --shadow:0 1px 2px rgb(26 32 55 / 3%),0 4px 14px rgb(26 32 55 / 2%); --rail-width:232px;
  --ease:cubic-bezier(.2,.65,.3,1); --motion-fast:160ms; --motion-medium:200ms;
}
* { box-sizing:border-box; }
body { margin:0; background:radial-gradient(ellipse 700px 440px at 85% 0%,rgb(108 124 221 / 5%),transparent 75%),linear-gradient(160deg,#fafbfe,var(--canvas) 65%); color:var(--ink); font:16px/1.5 var(--sans); -webkit-font-smoothing:antialiased; min-height:100dvh; }
html { scroll-padding-top:84px; scrollbar-gutter:stable; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button,select,input[type=checkbox] { cursor:pointer; }
button { color:inherit; touch-action:manipulation; }
a { color:inherit; text-decoration:none; }
button:disabled { opacity:.45; cursor:not-allowed; }
button,a,input,select,textarea,summary { transition:background-color var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease),color var(--motion-fast) var(--ease),box-shadow var(--motion-medium) var(--ease); }
:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
[hidden] { display:none !important; }
h1,h2,p { margin:0; }
h1 { font-size:26px; line-height:1.35; letter-spacing:-.65px; font-weight:650; text-wrap:balance; }
h2 { font-size:16px; font-weight:600; line-height:1.5; }
.icon { width:20px; height:20px; flex-shrink:0; vertical-align:middle; }
.mono { font-family:var(--mono); overflow-wrap:anywhere; }
.muted { color:var(--muted); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; left:8px; top:8px; z-index:100; padding:12px; background:var(--surface); border:1px solid var(--border); border-radius:6px; transform:translateY(-150%); }
.skip-link:focus { transform:none; }
.sidebar { width:var(--rail-width); position:fixed; inset:0 auto 0 0; height:100dvh; display:flex; flex-direction:column; border-right:1px solid var(--border); background:var(--surface); padding:24px 16px 16px; z-index:20; box-shadow:1px 0 0 rgb(255 255 255 / 80%); }
.brand { display:flex; align-items:center; gap:10px; font-size:19px; font-weight:650; letter-spacing:-.5px; }
.sidebar .brand { padding:0 8px; font-size:17px; gap:10px; }
.brand-symbol { display:grid; place-items:center; width:34px; height:34px; background:var(--ink); color:white; border:1px solid rgb(255 255 255 / 15%); border-radius:10px; box-shadow:0 2px 3px rgb(26 32 55 / 10%); }
.brand-symbol .icon { width:19px; height:19px; }
.brand-caption { display:block; font-size:12px; font-weight:400; color:var(--muted); letter-spacing:0; margin-top:2px; }
.sidebar-server { display:flex; align-items:center; gap:10px; margin:28px 0; padding:12px; border:1px solid var(--border); background:rgb(255 255 255 / 65%); border-radius:10px; box-shadow:0 1px 2px rgb(26 32 55 / 2%); }
.server-symbol { display:grid; place-items:center; width:30px; height:30px; flex-shrink:0; background:var(--soft); border:1px solid var(--border); border-radius:8px; color:var(--muted); }
.server-symbol .icon { width:16px; height:16px; }
.sidebar-server > span { font-size:12px; color:var(--muted); }
.sidebar-server strong { display:block; color:var(--ink); font-size:12px; font-weight:500; font-variant-numeric:tabular-nums; margin-top:3px; }
.sidebar-note { display:flex; align-items:center; gap:8px; padding:12px 8px 20px; color:var(--muted); font-size:12px; }
.sidebar-note .icon { width:16px; height:16px; }
.navigation { display:flex; flex-direction:column; gap:4px; }
.nav-label { color:var(--quiet); font-size:12px; font-weight:500; padding:0 12px 6px; }
.nav-label-secondary { margin-top:24px; }
.nav-item { display:flex; align-items:center; gap:11px; width:100%; min-height:44px; border:1px solid transparent; background:transparent; border-radius:8px; padding:10px 12px; color:var(--muted); font-size:13px; text-align:left; }
.nav-item .icon { width:18px; height:18px; }
.nav-item:hover { background:rgb(39 46 68 / 4%); color:var(--ink); }
.nav-item.active { color:var(--ink); background:var(--surface); font-weight:600; border-color:var(--border); box-shadow:var(--shadow); }
.nav-item.active > .icon { color:var(--brand); }
.nav-count { margin-left:auto; min-width:22px; text-align:center; padding:1px 6px; font:12px/18px var(--sans); background:var(--brand-soft); color:var(--brand); border-radius:5px; }
.sidebar-bottom { margin-top:auto; padding-top:24px; }
.account { display:flex; align-items:center; gap:10px; padding:16px 4px 0; border-top:1px solid var(--border); }
.avatar,.topbar-avatar { display:grid; place-items:center; width:32px; height:32px; border-radius:9px; border:1px solid var(--border); background:var(--surface); color:var(--muted); font-size:12px; font-weight:600; }
.account strong { display:block; font-size:13px; font-weight:550; }
.account div > span { display:block; font-size:12px; color:var(--muted); }
.account .icon-button { margin-left:auto; color:var(--muted); }
.icon-button { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; background:transparent; border:1px solid transparent; border-radius:6px; }
.icon-button:hover { background:rgb(39 46 68 / 5%); color:var(--ink); }
.main { margin-left:var(--rail-width); min-width:0; }
.topbar { height:64px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 32px; border-bottom:1px solid var(--border); background:var(--surface); position:sticky; top:0; z-index:10; box-shadow:0 1px 0 rgb(255 255 255 / 70%); }
.topbar-left,.topbar-right { display:flex; align-items:center; gap:20px; }
.breadcrumb { display:flex; align-items:center; gap:12px; font-size:13px; color:var(--muted); }
.breadcrumb .icon { width:12px; height:12px; color:var(--control); }
.breadcrumb strong { font-weight:500; color:var(--ink); }
.connection { display:flex; align-items:center; gap:7px; font-size:12px; color:var(--muted); padding:5px 0; }
.status-dot { width:6px; height:6px; border-radius:50%; display:inline-block; background:var(--success); flex-shrink:0; }
.connection.stale { color:var(--warning); }
.connection.stale .status-dot { background:var(--warning); }
.mobile-only { display:none; }
.content { max-width:1504px; margin:auto; padding:32px; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:28px; }
.page-heading p { font-size:14px; color:var(--muted); margin-top:7px; }
.heading-meta { display:flex; flex-direction:column; align-items:end; gap:8px; flex-shrink:0; }
.heading-meta > span:last-child { font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
.subtle-tag { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border:1px solid var(--border); border-radius:6px; background:rgb(255 255 255 / 75%); color:var(--muted); font-size:12px; line-height:1.5; white-space:nowrap; }
.subtle-tag .icon { width:14px; height:14px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:9px 14px; border:1px solid rgb(39 46 68 / 15%); border-radius:8px; background:var(--surface); color:var(--ink); font-size:13px; font-weight:500; white-space:nowrap; line-height:1.4; box-shadow:0 1px 2px rgb(26 32 55 / 3%); }
.button .icon { width:16px; height:16px; }
.button:hover:not(:disabled) { border-color:rgb(39 46 68 / 25%); background:var(--soft); box-shadow:0 2px 4px rgb(26 32 55 / 5%); }
.button:active:not(:disabled) { background:#eef0f6; box-shadow:none; }
.button.primary { color:white; background:var(--brand); border-color:var(--brand); box-shadow:inset 0 1px 0 rgb(255 255 255 / 12%),0 1px 2px rgb(26 32 55 / 8%); }
.button.primary:hover:not(:disabled) { background:var(--brand-hover); border-color:var(--brand-hover); }
.danger-text { color:var(--danger); }
.button.danger-text:hover { background:var(--danger-soft); border-color:#e3b6bd; }
.stats-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:24px; }
.panel { border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); min-width:0; }
.metric { position:relative; padding:16px 20px; min-width:0; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.metric-label { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; font-weight:500; color:var(--muted); }
.metric-label .icon { width:17px; height:17px; color:var(--quiet); }
.metric-value { display:flex; align-items:baseline; gap:6px; margin:10px 0 8px; font-variant-numeric:tabular-nums; }
.metric-value strong { font-size:28px; font-weight:600; line-height:1.2; letter-spacing:-.8px; }
.metric-value small { font-size:13px; color:var(--muted); }
.metric p { color:var(--muted); font-size:12px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px; min-height:18px; }
.metric progress { width:100%; height:4px; margin:10px 0 1px; border-radius:3px; }
.metric-footnote { margin-top:8px; font-size:12px; color:var(--quiet); }
.metric-percentage { color:var(--muted); }
.program-metric .metric-value strong { color:var(--ink); }
.panel { overflow:hidden; }
.panel-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:24px; }
.panel-heading p { color:var(--muted); font-size:12px; margin-top:4px; }
.panel-heading > .icon { color:var(--muted); }
progress { width:100%; display:block; height:10px; border:none; border-radius:3px; appearance:none; background:#eef0f7; overflow:hidden; }
progress::-webkit-progress-bar { background:#eef0f7; }
progress::-webkit-progress-value { background:var(--brand); border-radius:3px; }
progress::-moz-progress-bar { background:var(--brand); border-radius:3px; }
.program-panel { overflow:visible; }
.program-heading { padding:20px 24px 14px; }
.program-heading h2 { font-size:17px; font-weight:600; letter-spacing:-.2px; }
.program-heading p { margin-top:5px; font-size:12px; }
.title-with-count { display:flex; align-items:center; gap:8px; }
.count-tag { display:inline-block; min-width:24px; text-align:center; padding:1px 7px; background:var(--soft); color:var(--muted); border:1px solid var(--border); font-size:12px; font-weight:500; border-radius:6px; font-variant-numeric:tabular-nums; }
.panel-caption { font-size:12px; color:var(--muted); }
.program-toolbar,.toolbar { display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:16px 24px; }
.program-toolbar { border-bottom:1px solid var(--border); padding:0 24px 14px; justify-content:space-between; gap:12px; }
.state-filters { display:flex; align-items:center; gap:3px; padding:3px; background:var(--soft); border:1px solid var(--border); border-radius:9px; }
.state-filter { display:flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:8px 11px; border:1px solid transparent; border-radius:6px; color:var(--muted); background:transparent; font-size:13px; white-space:nowrap; }
.state-filter > span { font-size:12px; min-width:14px; font-variant-numeric:tabular-nums; }
.state-filter:hover { background:#eef1f5; color:var(--ink); }
.state-filter.active { background:var(--surface); color:var(--ink); border-color:var(--border); box-shadow:0 1px 3px rgb(26 32 55 / 5%); font-weight:600; }
.state-filter.active > span { color:var(--brand); }
.filter-dot { width:5px; height:5px; border-radius:50%; background:var(--success); }
.program-toolbar .search-field { max-width:250px; }
.program-toolbar input { background:var(--surface); font-size:13px !important; }
.input-wrap { position:relative; display:flex; align-items:center; min-width:0; }
.input-wrap > .icon { position:absolute; left:12px; width:17px; height:17px; color:var(--muted); pointer-events:none; }
.input-wrap input { padding-left:38px !important; }
.search-field { flex:1; max-width:300px; }
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select { min-height:44px; width:100%; min-width:0; padding:10px 12px; border:1px solid var(--control); border-radius:8px; background:var(--surface); color:var(--ink); font-size:14px; line-height:1.4; box-shadow:0 1px 2px rgb(26 32 55 / 2%); }
input:not([type=checkbox]):not([type=radio]):not([type=hidden]):hover,select:hover,textarea:hover { border-color:#747d90; }
input:not([type=checkbox]):not([type=radio]):not([type=hidden]):focus,select:focus,textarea:focus { border-color:var(--brand); box-shadow:0 0 0 3px rgb(83 91 207 / 9%); }
input:disabled,select:disabled,textarea:disabled { opacity:.65; background:var(--soft); cursor:not-allowed; }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:1; }
input[type=checkbox] { width:16px; height:16px; margin:0; accent-color:var(--brand); flex-shrink:0; }
input[type=radio] { width:16px; height:16px; margin:0; accent-color:var(--brand); flex-shrink:0; cursor:pointer; }
body:has(dialog[open]) { overflow:hidden; }
.filter-field { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted); }
.filter-field select { width:120px; font-size:13px; }
.filter-summary { margin-left:auto; font-size:12px; color:var(--muted); }
.program-table { border-collapse:collapse; width:100%; text-align:left; table-layout:auto; }
.program-table th { background:var(--soft); color:var(--muted); font-size:12px; font-weight:500; padding:11px 12px; border-bottom:1px solid var(--border); white-space:nowrap; }
.program-table td { padding:10px 12px; border-bottom:1px solid rgb(39 46 68 / 6%); vertical-align:middle; font-size:14px; }
.program-table tbody tr { transition:background-color var(--motion-fast) var(--ease); }
.program-table tr:last-child td { border-bottom:0; }
.program-table tr:hover { background:var(--soft); }
.program-table tr.selected { background:var(--brand-soft); }
.program-table tr.is-running { background:var(--surface); }
.program-table tr.is-running:hover { background:var(--soft); }
.program-table tr.is-running > .select-cell { box-shadow:none; }
.program-table tr.is-running.selected { background:var(--brand-soft); }
.program-table .select-cell { width:44px; padding:0 0 0 8px; }
.checkbox-target { display:flex; align-items:center; justify-content:center; width:44px; min-height:44px; cursor:pointer; }
.program-identity { display:flex; align-items:center; gap:12px; min-width:170px; }
.bot-monogram { display:grid; place-items:center; flex-shrink:0; width:36px; height:36px; border:1px solid var(--border); background:var(--soft); border-radius:10px; color:var(--muted); font:500 12px var(--mono); box-shadow:0 1px 2px rgb(26 32 55 / 2%); }
.is-running .bot-monogram { color:var(--brand); background:var(--brand-soft); border-color:rgb(83 91 207 / 14%); }
.program-name { display:flex; flex-direction:column; align-items:start; gap:3px; background:transparent; border:0; padding:4px 0; min-height:44px; text-align:left; max-width:210px; }
.program-name strong { font-size:14px; font-weight:550; overflow-wrap:anywhere; }
.program-name small { font-size:12px; color:var(--muted); font-weight:400; overflow-wrap:anywhere; }
.program-name:hover strong { color:var(--brand); }
.status-pill { display:inline-flex; align-items:center; gap:6px; border:1px solid transparent; background:#f3f4f7; color:var(--muted); padding:4px 8px; border-radius:6px; font-size:12px; font-weight:500; white-space:nowrap; }
.status-pill span { display:inline-block; width:5px; height:5px; border-radius:50%; background:currentColor; }
.status-pill.active,.status-pill.success { color:var(--success); background:var(--success-soft); }
.status-pill.failed { color:var(--danger); background:var(--danger-soft); }
.status-pill.activating,.status-pill.deactivating,.status-pill.reloading { color:var(--warning); background:var(--warning-soft); }
.resource-text { display:flex; flex-direction:column; gap:4px; color:var(--ink); font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.resource-idle { color:var(--quiet); }
.resource-text small { color:var(--muted); font-size:12px; }
.uptime-cell { color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; font-size:12px !important; }
.switch { display:grid; place-items:center; min-width:44px; min-height:44px; padding:0 4px; border:none; background:transparent; }
.switch-track { display:block; width:30px; height:18px; padding:2px; border-radius:12px; background:#8c94a4; transition:background-color var(--motion-fast) var(--ease); }
.switch-track::after { content:''; display:block; width:14px; height:14px; border-radius:50%; background:white; box-shadow:0 1px 2px rgb(0 0 0 / 10%); transition:transform var(--motion-fast) var(--ease); }
.switch.on .switch-track { background:var(--brand); }
.switch.on .switch-track::after { transform:translateX(12px); }
.row-actions { display:flex; align-items:center; justify-content:end; gap:7px; }
.row-actions .button { padding:8px 10px; font-size:12px; min-width:66px; }
.row-actions .button.start-action { color:var(--ink); background:var(--surface); border-color:rgb(39 46 68 / 15%); }
.row-actions .button.start-action:hover { color:var(--brand); background:var(--brand-soft); border-color:rgb(83 91 207 / 25%); }
.row-actions .button.stop-action { color:var(--ink); }
.row-actions .button.stop-action:hover { color:var(--danger); border-color:#e3b6bd; background:var(--danger-soft); }
.row-actions .log-action { color:var(--muted); background:transparent; border-color:transparent; box-shadow:none; }
.row-menu { position:relative; }
.row-menu summary { list-style:none; cursor:pointer; }
.row-menu summary::-webkit-details-marker { display:none; }
.row-menu[open] > summary { color:var(--brand); background:var(--brand-soft); }
.row-menu-content { position:absolute; top:calc(100% + 6px); right:0; width:200px; padding:6px; background:var(--surface); border:1px solid var(--border); border-radius:10px; box-shadow:0 4px 8px rgb(26 32 55 / 4%),0 12px 32px rgb(26 32 55 / 10%); z-index:30; }
.bot-card:nth-last-child(-n+2) .row-menu-content { top:auto; bottom:calc(100% + 5px); }
.row-menu-label { display:block; font-size:12px; color:var(--muted); padding:8px 10px; border-bottom:1px solid var(--border); margin-bottom:4px; overflow-wrap:anywhere; }
.row-menu-content button { width:100%; min-height:44px; display:flex; align-items:center; gap:9px; padding:10px; border:0; background:transparent; border-radius:6px; text-align:left; font-size:13px; }
.row-menu-content button:hover:not(:disabled) { background:var(--soft); color:var(--brand); }
.row-menu-content .compact-autostart { display:none; }
.row-menu-content .menu-danger { color:var(--danger); border-top:1px solid var(--border); border-radius:0 0 6px 6px; margin-top:4px; }
.row-menu-content .menu-danger:hover:not(:disabled) { color:var(--danger); background:var(--danger-soft); }
.program-management-actions { display:flex; gap:8px; flex-wrap:wrap; }
.program-dialog { width:min(660px,calc(100vw - 32px)); padding:0; max-height:calc(100dvh - 32px); }
.program-dialog form { display:flex; flex-direction:column; max-height:calc(100dvh - 34px); }
.management-dialog-header { display:flex; justify-content:space-between; gap:16px; padding:24px; border-bottom:1px solid var(--border); }
.management-dialog-header h2 { margin-top:5px; font-size:20px; letter-spacing:-.3px; }
.management-dialog-header p { color:var(--muted); font-size:13px; margin-top:7px; }
.dialog-eyebrow { font-size:12px; letter-spacing:.5px; font-weight:500; color:var(--muted); }
.management-dialog-header > .icon-button { align-self:start; }
.management-dialog-body { padding:24px; overflow-y:auto; }
.management-dialog-body > .form-error:first-child { margin:0 0 20px; }
.management-dialog-body > p { font-size:14px; color:var(--muted); line-height:1.8; }
.management-dialog-body fieldset { padding:0; margin:0 0 20px; border:0; }
.management-dialog-body legend { font-size:13px; font-weight:600; margin-bottom:10px; }
.source-options { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.source-options label { padding:14px; display:flex; align-items:start; gap:9px; border:1px solid var(--border); border-radius:9px; cursor:pointer; min-width:0; }
.source-options label:has(input:checked) { border-color:var(--brand); background:var(--brand-soft); }
.source-options input { margin:4px 0 0; accent-color:var(--brand); }
.source-options label > span { font-size:13px; font-weight:600; }
.source-options label .icon { width:16px; height:16px; margin-right:5px; }
.source-options span > span { display:block; font-size:12px; color:var(--muted); font-weight:400; margin-top:5px; }
.upload-field { padding:16px; border:1px dashed var(--control); border-radius:9px; background:var(--soft); margin-bottom:20px; }
.upload-field label { display:block; font-size:13px; font-weight:600; margin-bottom:10px; }
.upload-field input { border:0 !important; padding:0 !important; background:transparent !important; font-size:13px !important; }
.upload-field input::file-selector-button { padding:10px 12px; margin-right:10px; min-height:44px; border:1px solid var(--border); border-radius:7px; background:white; color:var(--ink); cursor:pointer; font:inherit; }
.upload-field p { font-size:12px; color:var(--muted); line-height:1.8; margin-top:8px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.management-field { display:block; margin:0 0 18px; color:var(--ink); font-size:13px; font-weight:550; }
.management-field input,.management-field textarea { display:block; margin-top:8px; width:100%; }
.management-field small { display:block; color:var(--muted); font-size:12px; line-height:1.7; margin-top:6px; font-weight:400; }
.management-field textarea { min-height:100px; resize:vertical; font:13px/1.8 var(--mono); padding:10px 12px; border:1px solid var(--control); border-radius:8px; background:var(--surface); }
.management-field input[readonly] { background:var(--soft); color:var(--muted); cursor:default; }
.required-mark { color:var(--brand); }
.advanced-options { border-block:1px solid var(--border); margin:4px 0 18px; }
.advanced-options > summary { min-height:48px; padding:12px 0; font-size:13px; cursor:pointer; font-weight:600; }
.advanced-options > summary span { color:var(--muted); font-size:12px; font-weight:400; margin-left:6px; }
.advanced-options .management-field { margin-top:12px; }
.setup-note { display:flex; align-items:start; gap:9px; color:var(--muted); font-size:12px; line-height:1.8; }
.setup-note .icon { width:17px; height:17px; margin-top:2px; color:var(--brand); }
.management-dialog-footer { display:flex; align-items:center; justify-content:end; gap:10px; padding:16px 24px; border-top:1px solid var(--border); flex-shrink:0; background:var(--soft); }
.management-dialog-footer > span { margin-right:auto; color:var(--muted); font-size:12px; }
.remove-dialog,.archive-dialog { padding:0; width:min(600px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow-y:auto; }
.remove-dialog[open] { display:flex; flex-direction:column; overflow:hidden; }
.remove-dialog > .management-dialog-header { flex-shrink:0; padding:20px 24px; }
.remove-dialog form { display:flex; flex-direction:column; min-height:0; }
.remove-dialog .management-dialog-body { min-height:0; padding:20px 24px; }
.remove-dialog .management-dialog-footer { padding:12px 24px; }
.management-dialog-body .removal-options { display:flex; flex-direction:column; gap:8px; margin:16px 0; }
.removal-options label { display:flex; gap:10px; align-items:start; border:1px solid var(--border); padding:12px; border-radius:9px; cursor:pointer; }
.removal-options label:has(input:checked) { border-color:var(--brand); background:var(--brand-soft); }
.removal-options input { margin:4px 0 0; accent-color:var(--brand); }
.removal-options strong { font-size:14px; font-weight:550; }
.removal-options small { display:block; color:var(--muted); font-size:12px; line-height:1.6; margin-top:4px; }
.remove-dialog .info-note { margin:0 0 20px; }
.removal-options .delete-option:has(input:checked) { border-color:var(--danger); background:var(--danger-soft); }
.delete-option strong { color:var(--danger); }
.delete-scope { border:1px solid var(--danger); border-radius:9px; background:var(--danger-soft); padding:14px; }
.delete-scope h3 { color:var(--danger); font-size:14px; margin-bottom:12px; }
.delete-scope dl > div + div { margin-top:12px; }
.delete-scope dt { font-size:12px; color:var(--muted); margin-bottom:5px; }
.delete-scope dd { margin:0; font-size:13px; overflow-wrap:anywhere; }
.delete-scope p { color:var(--danger); font-size:12px; line-height:1.8; margin-top:14px; }
.button.danger-solid { color:white; background:var(--danger); border-color:var(--danger); }
.button.danger-solid:hover { filter:brightness(.94); }
.archive-item-actions { display:flex; flex-direction:column; gap:8px; flex-shrink:0; }
.archive-list { padding:8px 24px 24px; }
.archive-item { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 0; border-bottom:1px solid var(--border); }
.archive-item:last-child { border-bottom:0; }
.archive-item > div { min-width:0; }
.archive-item strong { display:block; font-size:14px; overflow-wrap:anywhere; }
.archive-item span { display:block; font-size:12px; color:var(--muted); margin-top:3px; }
.archive-item p { font-size:12px; color:var(--muted); margin-top:7px; overflow-wrap:anywhere; }
.archive-item small { display:block; font-size:12px; color:var(--muted); margin-top:6px; }
.archive-dialog > .form-error { margin:16px 24px 0; }
.row-actions .icon-button { min-width:44px; color:var(--muted); }
.row-actions .icon { width:16px; height:16px; }
.actions-heading { text-align:right; padding-right:24px !important; }
.actions-cell { padding-right:20px !important; }
.panel-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid var(--border); padding:14px 24px; color:var(--muted); font-size:12px; }
.batch-bar { display:flex; align-items:center; gap:12px; padding:12px 24px; flex-wrap:wrap; background:var(--brand-soft); border-bottom:1px solid rgb(83 91 207 / 14%); }
.batch-bar strong { font-size:12px; font-weight:500; margin-right:auto; color:var(--brand); }
.batch-actions { display:flex; flex-wrap:wrap; gap:8px; }
.batch-actions .button { font-size:12px; padding:8px 10px; }
.workspace-footer { display:flex; justify-content:space-between; gap:16px; margin-top:20px; font-size:12px; color:var(--muted); }
.host-note { display:flex; align-items:center; gap:7px; }
.host-note .icon { width:14px; height:14px; }
.workspace-footer > span:first-child { font-weight:500; }
.field { display:flex; flex-direction:column; gap:8px; min-width:0; color:var(--muted); font-size:12px; }
.field select { min-width:150px; }
.toolbar:has(.field) { align-items:end; padding:20px 24px; }
.inline-check { min-height:44px; display:flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; cursor:pointer; }
.toolbar .muted { font-size:12px; }
.logs-panel { overflow:hidden; }
.logs-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:20px 24px; }
.logs-heading-identity { display:flex; align-items:center; gap:12px; min-width:0; }
.logs-symbol { display:grid; place-items:center; width:40px; height:40px; border:1px solid var(--border); background:var(--soft); border-radius:10px; color:var(--muted); flex-shrink:0; }
.logs-heading-identity > div { min-width:0; }
.logs-heading h2 { font-size:15px; }
.logs-heading p { display:flex; align-items:center; gap:8px; margin-top:2px; font-size:12px; color:var(--muted); overflow-wrap:anywhere; }
.logs-heading p .mono { padding:1px 6px; background:var(--soft); border:1px solid var(--border); border-radius:4px; font-size:11px; }
.logs-heading-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.logs-filters { display:grid; grid-template-columns:minmax(180px,230px) minmax(0,1fr) 170px; gap:16px; padding:0 24px; }
.logs-filters .field { gap:7px; }
.logs-filters select,.logs-filters input { width:100%; min-width:0; font-size:13px; }
.logs-filters select { text-overflow:ellipsis; }
.logs-noise-filter { display:flex; align-items:center; gap:12px; padding:6px 24px 12px; color:var(--muted); font-size:12px; }
.logs-noise-filter .inline-check { color:var(--ink); }
.logs-noise-hint { margin-left:auto; }
.logs-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:10px 24px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--soft); color:var(--muted); font-size:12px; }
.logs-refresh-control { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.logs-controls .inline-check { color:var(--ink); }
.logs-control-separator { width:1px; height:14px; background:var(--border); margin-inline:4px; }
.logs-read-status { display:inline-flex; align-items:center; gap:6px; }
.logs-read-status.failed { color:var(--danger); }
.logs-read-status .status-dot.paused { background:var(--control); }
.logs-read-status .status-dot.failed { background:var(--danger); }
.logs-updated { font-variant-numeric:tabular-nums; }
.logs-tools { display:flex; align-items:center; gap:6px; margin-left:auto; }
.logs-display-switch { display:flex; gap:2px; padding:3px; background:rgb(39 46 68 / 4%); border-radius:8px; }
.logs-display-switch button { min-height:36px; padding:6px 12px; border:1px solid transparent; border-radius:6px; color:var(--muted); font-size:12px; background:transparent; white-space:nowrap; }
.logs-display-switch button:hover { color:var(--ink); }
.logs-display-switch button.active { background:var(--surface); border-color:var(--border); color:var(--ink); font-weight:500; box-shadow:0 1px 2px rgb(26 32 55 / 4%); }
.logs-tools .icon-button { color:var(--muted); }
.logs-tools .icon-button.active { color:var(--brand); background:var(--brand-soft); }
.logs-tools .icon { width:17px; height:17px; }
.logs-viewer { position:relative; background:var(--surface); }
.logs-scroll { height:clamp(320px,calc(100dvh - 555px),640px); overflow:auto; scrollbar-gutter:stable; overscroll-behavior:contain; scroll-padding-top:42px; }
.logs-scroll:focus-visible { outline-offset:-3px; }
.logs-table { width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; font-size:12px; }
.logs-table th { position:sticky; top:0; z-index:1; padding:10px 12px; background:var(--soft); border-bottom:1px solid var(--border); color:var(--muted); font-weight:500; text-align:left; }
.logs-table th:nth-child(1) { width:46px; }
.logs-table th:nth-child(2) { width:88px; }
.logs-table th:nth-child(3) { width:76px; }
.logs-table th:nth-child(4) { width:138px; }
.logs-table td { padding:9px 12px; border-bottom:1px solid var(--log-divider); vertical-align:top; }
.logs-table tr:last-child td { border-bottom:0; }
.logs-table tbody tr:hover td { background:var(--soft); }
.logs-table .logs-line-number { padding-inline:8px; text-align:right; color:var(--quiet); font:11px/22px var(--mono); user-select:none; }
.logs-table th.logs-line-number { line-height:18px; }
.logs-time { font:12px/22px var(--mono); font-variant-numeric:tabular-nums; white-space:nowrap; color:var(--muted); }
.logs-source { color:var(--muted); font:12px/22px var(--mono); }
.logs-source > span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.logs-message { font:13px/22px var(--mono); white-space:pre-wrap; overflow-wrap:anywhere; tab-size:4; }
.logs-message mark { color:var(--ink); background:var(--log-highlight); border-radius:2px; }
.log-level { display:inline-flex; align-items:center; justify-content:center; padding:1px 6px; min-width:40px; font-size:11px; line-height:20px; border-radius:4px; color:var(--muted); background:var(--soft); white-space:nowrap; }
.log-level.error { color:var(--danger); background:var(--danger-soft); }
.log-level.warning { color:var(--warning); background:var(--warning-soft); }
.log-level.info { color:var(--brand-hover); background:var(--brand-soft); }
.log-level.debug,.log-level.unknown { background:transparent; }
.logs-table .level-error .logs-message { color:var(--danger); }
.logs-table .level-warning .logs-message { color:var(--warning); }
.logs-table .level-error td:first-child { box-shadow:inset 2px 0 var(--danger); }
.logs-table .level-warning td:first-child { box-shadow:inset 2px 0 var(--warning); }
.logs-raw { margin:0; padding:16px 20px 56px; font:13px/1.8 var(--mono); white-space:pre-wrap; overflow-wrap:anywhere; tab-size:4; }
.logs-viewer.unwrapped .logs-table { table-layout:auto; }
.logs-viewer.unwrapped .logs-message,.logs-viewer.unwrapped .logs-raw { white-space:pre; overflow-wrap:normal; }
.logs-latest { position:absolute; right:20px; bottom:16px; min-height:36px; padding:7px 12px; color:var(--brand-hover); border-color:rgb(83 91 207 / 20%); border-radius:8px; box-shadow:0 2px 8px rgb(26 32 55 / 10%); font-size:12px; z-index:2; }
.logs-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:100%; padding:40px 24px; color:var(--muted); text-align:center; }
.logs-empty h3 { margin:0; color:var(--ink); font-size:15px; font-weight:550; }
.logs-empty p { max-width:400px; font-size:13px; line-height:1.8; }
.logs-empty .button { margin-top:4px; }
.logs-empty-icon { display:grid; place-items:center; width:44px; height:44px; margin-bottom:4px; border:1px solid var(--border); border-radius:12px; color:var(--muted); background:var(--soft); }
.logs-empty-icon.failed { color:var(--danger); background:var(--danger-soft); }
.logs-empty > .spinner { width:24px; height:24px; margin-bottom:8px; color:var(--brand); }
.logs-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 20px; padding:6px 24px; border-top:1px solid var(--border); color:var(--muted); font-size:12px; }
.logs-result-summary { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.logs-result-summary strong { font-weight:500; color:var(--ink); }
.logs-clear { padding:6px 4px; min-height:32px; border:0; border-radius:4px; background:transparent; color:var(--brand); font-size:12px; }
.logs-clear:hover { background:var(--brand-soft); }
.logs-panel .panel-error { margin-block:0 16px; }
.configuration-layout { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:28px; align-items:start; }
.configuration-layout .panel-heading { border-bottom:1px solid var(--border); }
.editor-top { display:flex; justify-content:space-between; padding:0 24px 10px; font-size:12px; }
.editor-type { color:var(--muted); font:12px var(--mono); }
#env-content { display:block; width:calc(100% - 48px); margin:0 24px; padding:20px; resize:vertical; min-height:350px; font:13px/1.9 var(--mono); background:var(--soft); border:1px solid var(--control); border-radius:6px; color:var(--ink); tab-size:4; }
.editor-actions { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 24px; border-top:1px solid var(--border); margin-top:20px; }
.editor-actions > span { font-size:12px; color:var(--muted); }
.config-guide { padding:24px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.guide-icon { display:grid; place-items:center; width:36px; height:36px; background:var(--soft); color:var(--muted); border:1px solid var(--border); border-radius:9px; margin-bottom:16px; }
.config-guide h2 { font-size:15px; }
.config-guide p { color:var(--muted); font-size:12px; line-height:1.9; margin-top:8px; }
.config-guide code { padding:2px 4px; border:1px solid var(--border); background:var(--surface); border-radius:4px; font-size:12px; }
.guide-section { margin-top:24px; }
.guide-section strong { font-size:12px; font-weight:600; }
.info-note { display:flex; gap:10px; padding:12px; border:1px solid rgb(83 91 207 / 14%); background:var(--brand-soft); color:var(--brand-hover); border-radius:8px; font-size:12px; line-height:1.8; margin-top:24px; }
.info-note .icon { width:16px; height:16px; margin-top:2px; }
.environment-banner { display:flex; align-items:center; gap:12px; padding:16px 24px; border-block:1px solid var(--border); background:var(--soft); }
.environment-banner > .icon { color:var(--brand); }
.environment-banner div span { display:block; color:var(--muted); font-size:12px; }
.environment-banner strong { display:block; font-size:12px; font-weight:500; margin-top:2px; }
.environment-banner .subtle-tag { margin-left:auto; }
.table-wrap { overflow:auto; }
.data-table { border-collapse:collapse; width:100%; text-align:left; font-size:13px; }
.data-table th { padding:12px 24px; background:var(--soft); color:var(--muted); border-block:1px solid var(--border); font-size:12px; font-weight:500; white-space:nowrap; }
.data-table td { padding:14px 24px; border-bottom:1px solid var(--border); font-variant-numeric:tabular-nums; }
.data-table tbody tr:hover { background:var(--soft); }
.data-table tbody tr:last-child td { border-bottom:0; }
.data-table .mono { font-size:12px; }
.package-identity,.audit-operation { display:flex; align-items:center; gap:10px; }
.package-icon,.audit-icon { display:grid; place-items:center; width:28px; height:28px; background:var(--soft); color:var(--muted); border:1px solid var(--border); border-radius:7px; }
.package-icon svg,.audit-icon svg { width:14px; height:14px; }
.audit-table { min-width:590px; }
.pagination { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 24px; border-top:1px solid var(--border); font-size:12px; color:var(--muted); }
.pagination > div { display:flex; align-items:center; gap:12px; }
.pagination .button { font-size:12px; padding:8px 12px; }
.empty-cell { padding:48px 24px !important; text-align:center; color:var(--muted); font-size:13px !important; }
.toast-region { position:fixed; right:24px; bottom:24px; z-index:70; display:flex; flex-direction:column; gap:8px; max-width:min(400px,calc(100vw - 32px)); }
.toast { background:var(--surface); border:1px solid #c9d5f7; border-left:3px solid var(--brand); box-shadow:0 8px 24px rgb(24 37 62 / 12%); border-radius:8px; padding:16px 20px; color:var(--ink); font-size:13px; overflow-wrap:anywhere; }
.toast.error { border-color:#eab9c1; border-left-color:var(--danger); color:var(--danger); }
.toast.pending { border-left-color:var(--control); }
dialog { width:min(440px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow-y:auto; padding:28px; border:1px solid rgb(39 46 68 / 12%); border-radius:14px; background:var(--surface); color:var(--ink); box-shadow:0 8px 20px rgb(26 32 55 / 8%),0 24px 64px rgb(26 32 55 / 16%); }
dialog::backdrop { background:rgb(32 35 45 / 28%); }
dialog h2 { font-size:20px; font-weight:600; }
dialog > p { font-size:14px; line-height:1.8; color:var(--muted); margin:12px 0 28px; overflow-wrap:anywhere; }
.dialog-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:var(--warning-soft); color:var(--warning); margin-bottom:20px; }
.dialog-actions { display:flex; justify-content:end; gap:10px; }
.detail-dialog { width:min(600px,calc(100vw - 32px)); padding:0; }
.detail-header { display:flex; align-items:center; gap:12px; padding:24px; border-bottom:1px solid var(--border); }
.detail-monogram { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; background:var(--brand-soft); color:var(--brand); border:1px solid rgb(83 91 207 / 14%); border-radius:10px; font:500 15px var(--mono); }
.detail-header h2 { font-size:18px; }
.detail-header p { font-size:12px; color:var(--muted); margin-top:4px; }
.detail-header .icon-button { margin-left:auto; }
.detail-summary { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:20px 24px 0; font-size:12px; color:var(--muted); }
.detail-facts { margin:0; padding:8px 24px 20px; }
.detail-facts > div { display:grid; grid-template-columns:110px minmax(0,1fr); gap:16px; padding:12px 0; border-bottom:1px solid var(--border); font-size:12px; }
.detail-facts > div:last-child { border-bottom:0; }
.detail-facts dt { color:var(--muted); }
.detail-facts dd { margin:0; overflow-wrap:anywhere; }
.detail-facts code { display:block; font:12px/1.8 var(--mono); padding:8px 10px; border:1px solid var(--border); border-radius:5px; background:var(--soft); white-space:pre-wrap; overflow-wrap:anywhere; }
.detail-actions { display:flex; justify-content:end; gap:10px; padding:20px 24px; border-top:1px solid var(--border); background:var(--soft); }
.mobile-menu { margin:0; width:min(300px,calc(100vw - 48px)); height:100dvh; max-height:100dvh; border-radius:0; padding:20px 16px; }
.menu-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.mobile-menu .navigation { margin-bottom:24px; }
.mobile-menu > .button { width:100%; }
.login-page { min-height:100dvh; display:flex; flex-direction:column; }
.login-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:24px 32px; }
.login-header .brand { font-size:18px; }
.login-layout { flex:1; display:grid; place-items:center; width:100%; padding:32px 24px 64px; }
.login-form-wrap { width:min(420px,100%); padding:32px; border:1px solid var(--border); background:var(--surface); border-radius:16px; box-shadow:var(--shadow); }
.login-form-heading { margin-bottom:24px; }
.login-form-mark { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--border); border-radius:12px; background:var(--soft); color:var(--ink); margin-bottom:20px; }
.login-form-mark .icon { width:21px; height:21px; }
.login-form h1 { font-size:24px; }
.login-intro { font-size:13px; color:var(--muted); margin-top:8px; line-height:1.7; }
.login-context { display:flex; align-items:center; gap:8px; padding:12px; border:1px solid var(--border); border-radius:8px; background:var(--soft); font-size:12px; color:var(--muted); margin-bottom:24px; }
.login-context .icon { width:16px; height:16px; }
.login-context code { color:var(--ink); margin-left:auto; font-family:var(--mono); }
.login-form label { display:block; font-size:13px; font-weight:500; margin:20px 0 8px; }
.login-form input { min-height:46px !important; }
.login-submit { display:flex; width:100%; justify-content:center; margin-top:28px; min-height:46px; font-size:14px; }
.login-note { display:flex; align-items:center; justify-content:center; gap:6px; margin-top:20px; font-size:12px; color:var(--muted); }
.login-note .icon { width:14px; height:14px; }
.login-footer { display:flex; justify-content:space-between; gap:16px; padding:20px 32px; font-size:12px; color:var(--muted); }
.form-error { display:flex; align-items:center; gap:8px; padding:12px; margin-top:16px; border:1px solid #f0cbd0; border-radius:6px; background:var(--danger-soft); color:var(--danger); font-size:12px; }
.form-error .icon { width:16px; height:16px; }
input[aria-invalid=true] { border-color:var(--danger) !important; }
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .sidebar { background:rgb(255 255 255 / 82%); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
  .topbar { background:rgb(255 255 255 / 88%); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
  .metric { background:rgb(255 255 255 / 92%); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); box-shadow:inset 0 1px 0 var(--glass-border),var(--shadow); }
}
@media (prefers-reduced-transparency:reduce) {
  .sidebar,.topbar,.metric { background:var(--surface); backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@media (max-width:1280px) {
  .uptime-column,.uptime-cell { display:none; }
  .program-table th,.program-table td { padding-inline:8px; }
  .content { padding:28px 24px; }
  .row-actions .icon-button { min-width:44px; }
}
@media (max-width:1050px) {
  :root { --rail-width:212px; }
  .sidebar { padding-inline:12px; }
  .brand { font-size:17px; }
  .metric { padding:16px; }
  .metric progress { width:100%; }
  .metric-value strong { font-size:23px; }
  .program-identity { min-width:145px; gap:8px; }
  .program-name { max-width:150px; }
  .program-toolbar { gap:12px; }
  .program-toolbar .search-field { max-width:220px; }
  .state-filter { padding-inline:8px; }
  .autostart-column,.autostart-cell { display:none; }
  .row-menu-content .compact-autostart { display:flex; }
  .panel-caption { display:none; }
  .configuration-layout { grid-template-columns:1fr; gap:24px; }
  .config-guide { padding:20px; background:var(--surface); border:1px solid var(--border); border-radius:10px; }
  .config-guide .guide-icon { display:none; }
  .guide-section { margin-top:16px; }
  .heading-meta .subtle-tag { display:none; }
  .login-form-wrap { padding:28px; }
}
@media (max-width:850px) {
  :root { --rail-width:0px; }
  .sidebar { display:none; }
  .mobile-only { display:inline-flex; }
  .topbar { padding:0 20px; height:68px; }
  .topbar-left { gap:8px; }
  .topbar-right { gap:16px; }
  .content { padding:28px 24px; }
  .stats-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .autostart-column,.autostart-cell { display:table-cell; }
  .row-menu-content .compact-autostart { display:none; }
  .uptime-column,.uptime-cell { display:none; }
  .login-layout { padding:32px; }
  .login-header,.login-footer { padding-inline:32px; }
}
@media (max-width:650px) {
  .program-management-actions { width:100%; margin-top:12px; }
  .program-management-actions .primary { flex:1; }
  .management-dialog-header { padding:20px; }
  .management-dialog-body { padding:20px; }
  .management-dialog-footer { padding:16px 20px; flex-wrap:wrap; }
  .management-dialog-footer > span:not(:empty) { width:100%; }
  .form-grid,.source-options { grid-template-columns:1fr; gap:10px; }
  .form-grid { gap:0; }
  .source-options label { padding:12px; }
  .source-options span > span { margin-top:3px; }
  .management-field textarea { font-size:16px; }
  .archive-list { padding:4px 20px 20px; }
  .archive-item { flex-wrap:wrap; gap:12px; }
  .topbar { height:64px; padding:0 12px; }
  .breadcrumb { font-size:12px; gap:6px; }
  .breadcrumb > span,.breadcrumb > .icon { display:none; }
  .topbar-avatar { display:none; }
  .topbar-right { gap:8px; }
  .topbar .button { padding-inline:10px; font-size:12px; }
  .connection { font-size:12px; }
  .content { padding:24px 16px; }
  .page-heading { align-items:start; gap:12px; margin-bottom:24px; }
  h1 { font-size:25px; }
  .page-heading p { font-size:13px; line-height:1.8; }
  .heading-meta { display:none; }
  .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:20px; }
  .metric { padding:15px 16px; }
  .metric-label { font-size:12px; }
  .metric-value strong { font-size:24px; }
  .metric p { font-size:12px; }
  .panel-heading { padding:16px; gap:12px; flex-wrap:wrap; }
  .program-toolbar,.toolbar { padding:16px; gap:12px; }
  .program-heading { padding:20px 16px 0; }
  .program-heading h2 { font-size:18px; }
  .state-filters { width:100%; }
  .state-filter { padding-inline:6px; gap:4px; flex:1; font-size:12px; }
  .state-filter > span { min-width:10px; }
  .program-toolbar .search-field { max-width:none; }
  .program-toolbar input { font-size:16px !important; }
  .program-toolbar .search-field { flex-basis:100%; max-width:none; }
  .filter-summary { font-size:12px; }
  .filter-field select { font-size:14px; }
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select { font-size:16px; }
  .program-table,.program-table tbody { display:block; }
  .program-table thead { display:block; }
  .program-table thead tr { display:flex; align-items:center; padding:0 8px; border-bottom:1px solid var(--border); background:var(--soft); }
  .program-table thead th { display:none; border:0; }
  .program-table thead .select-cell { display:block; }
  .program-table thead th:nth-child(2) { display:block; font-size:12px; }
  .program-table tbody tr { display:grid; grid-template-columns:32px minmax(0,1fr) auto; padding:16px 12px; gap:10px 0; border-bottom:1px solid var(--border); }
  .program-table tr.is-running { box-shadow:inset 3px 0 var(--brand); }
  .program-table tr.is-running > .select-cell { box-shadow:none; }
  .program-table td { border:0; padding:0 4px; }
  .program-table tbody .select-cell { grid-column:1; grid-row:1; width:36px; padding:0; }
  .program-table .checkbox-target { width:32px; }
  .identity-cell { grid-column:2; grid-row:1; }
  .status-cell { grid-column:3; grid-row:1; padding-top:10px !important; }
  .program-identity { min-width:0; gap:8px; }
  .program-name { max-width:none; }
  .program-name strong { font-size:14px; }
  .program-name small { font-size:12px; }
  .bot-monogram { width:32px; height:32px; font-size:12px; border-radius:8px; }
  .resource-cell { grid-column:2; grid-row:2; align-self:center; }
  .resource-text { flex-direction:row; gap:12px; font-size:12px; }
  .resource-text small { font-size:12px; }
  .autostart-cell { display:flex !important; grid-column:3; grid-row:2; align-items:center; gap:4px; }
  .autostart-cell::before { content:'自启'; color:var(--muted); font-size:12px; }
  .actions-cell { grid-column:2 / 4; grid-row:3; padding-right:4px !important; }
  .row-actions { justify-content:start; gap:8px; padding-top:12px; border-top:1px solid var(--border); }
  .row-actions .button { min-width:64px; font-size:12px; }
  .row-actions .icon-button { min-width:44px; }
  .row-menu { margin-left:auto; }
  .program-table .empty-cell { display:block; grid-column:1 / -1; }
  .batch-bar { padding:12px 16px; }
  .batch-actions { order:3; width:100%; }
  .batch-bar .icon-button { margin-left:auto; }
  .panel-footer { padding:14px 16px; flex-wrap:wrap; gap:8px; }
  .workspace-footer { font-size:12px; flex-wrap:wrap; gap:8px; }
  .toolbar .field { flex:1; }
  .toolbar .search-field { flex-basis:100%; max-width:none; }
  .toolbar:has(.field) { padding:16px; }
  .logs-heading { flex-wrap:wrap; gap:16px; padding:16px; }
  .logs-heading-actions { width:100%; }
  .logs-heading-actions .button { flex:1; }
  .logs-filters { padding-inline:16px; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
  .logs-filters select,.logs-filters input { font-size:14px; }
  .logs-search-field { grid-row:2; grid-column:1 / -1; }
  .logs-noise-filter { padding:8px 16px 12px; flex-wrap:wrap; gap:0 12px; }
  .logs-noise-hint { display:none; }
  .logs-controls { padding:10px 16px; }
  .logs-refresh-control { gap:8px; width:100%; }
  .logs-updated { margin-left:auto; }
  .logs-read-status { margin-left:auto; }
  .logs-control-separator { display:none; }
  .logs-tools { margin:0; width:100%; }
  .logs-display-switch { margin-right:auto; }
  .logs-scroll { height:380px; }
  .logs-table { min-width:650px; }
  .logs-table th:nth-child(1) { width:36px; }
  .logs-table th:nth-child(4) { width:108px; }
  .logs-footer { padding:6px 16px; }
  .logs-result-summary { gap:8px; }
  .logs-panel .panel-error { margin-inline:16px; }
  .editor-top { padding:0 16px 8px; }
  #env-content { width:calc(100% - 32px); margin:0 16px; padding:16px; font-size:16px; min-height:300px; }
  .editor-actions { padding:16px; }
  .environment-banner { padding:16px; }
  .data-table th,.data-table td { padding:12px 16px; }
  .data-table .mono { font-size:12px; }
  .pagination { padding:16px; flex-wrap:wrap; gap:12px; }
  .pagination > div { margin-left:auto; gap:10px; }
  .detail-header { padding:20px; }
  .detail-summary { padding:20px 20px 0; }
  .detail-facts { padding-inline:20px; }
  .detail-facts > div { grid-template-columns:80px minmax(0,1fr); gap:12px; }
  .detail-actions { padding:16px 20px; }
  .toast-region { bottom:16px; right:16px; }
  .login-header { padding:24px; }
  .login-header .subtle-tag { display:none; }
  .login-layout { padding:16px 24px 32px; }
  .login-form-wrap { padding:24px; }
  .login-intro { font-size:12px; line-height:1.8; }
  .login-note { font-size:12px; }
  .login-footer { padding:24px; font-size:12px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; scroll-behavior:auto !important; } }

/* Shared component feedback for the Vue console. */
.boot-state,.loading-view { min-height:220px; display:flex; align-items:center; justify-content:center; gap:12px; color:var(--muted); font-size:14px; }
.spinner { display:inline-block; width:16px; height:16px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:spin .8s linear infinite; flex-shrink:0; }
@keyframes spin { to { transform:rotate(360deg); } }
.task-banner { display:flex; align-items:center; gap:12px; padding:16px 20px; margin-bottom:20px; background:var(--brand-soft); border:1px solid rgb(83 91 207 / 16%); border-radius:10px; color:var(--brand-hover); }
.task-banner > div { flex:1; }
.task-banner strong,.task-banner span:not(.spinner) { display:block; font-size:13px; }
.task-banner span:not(.spinner) { margin-top:3px; }
.panel-error { margin:0 24px 20px; }
.file-summary { display:flex; align-items:center; gap:10px; font-size:12px; padding:12px; margin-top:12px; background:var(--soft); border:1px solid var(--border); border-radius:8px; }
.file-summary strong { overflow-wrap:anywhere; }
.file-summary span { color:var(--muted); margin-left:auto; white-space:nowrap; }
.row-menu > .icon-button { list-style:none; }
.row-menu.is-open > .icon-button { background:var(--soft); }
.toast { display:flex; align-items:center; gap:12px; padding:12px 12px 12px 18px; }
.toast > span { flex:1; }
.toast .icon-button { min-width:32px; min-height:32px; }
@media (prefers-reduced-motion:reduce) { .spinner { animation:none; } }