:root {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #e8eef8;
  background: #0a101b;
  font-synthesis: none;
}

* { box-sizing: border-box; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top left, #172846 0, #0a101b 42rem); }
header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem clamp(1rem, 4vw, 3rem); border-bottom: 1px solid #27354a; background: rgba(10, 16, 27, .86); position: sticky; top: 0; z-index: 5; backdrop-filter: blur(12px); }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: clamp(1.35rem, 4vw, 2rem); }
h2 { margin-bottom: .3rem; }
.eyebrow { margin: 0 0 .25rem; color: #6ee7c7; font-size: .68rem; font-weight: 750; letter-spacing: .16em; }
main { width: min(1180px, calc(100% - 2rem)); margin: 1.5rem auto 4rem; }
.hidden { display: none !important; }
.card { background: rgba(18, 28, 44, .96); border: 1px solid #2b3d56; border-radius: 16px; padding: 1.2rem; box-shadow: 0 14px 38px rgba(0,0,0,.2); }
#bootstrap, #login { max-width: 520px; margin: 8vh auto; }
#invitation { max-width: 520px; margin: 8vh auto; }
body[data-surface="login"] header.app-header { display: none; }
body[data-surface="login"] main {
  display: grid;
  place-items: center;
  width: min(100% - 2rem, 520px);
  min-height: 100svh;
  margin: 0 auto;
  padding: 1.25rem 0;
}
#login { width: 100%; margin: 0; padding: clamp(1.35rem, 4vw, 2rem); }
.login-brand { display: grid; justify-items: center; margin: 0 0 1.7rem; text-align: center; }
.login-brand-mark {
  width: clamp(96px, 22vw, 128px);
  height: clamp(96px, 22vw, 128px);
  margin-bottom: 1rem;
  border-radius: 30px;
  box-shadow: 0 22px 56px #45d9ef3b, 0 0 0 1px #9bdcff28;
}
.login-brand .eyebrow { margin-bottom: .45rem; color: #a7b7d4; }
.login-brand h1 { font-size: clamp(1.75rem, 7vw, 2.35rem); letter-spacing: -.055em; }
.login-brand h1 span { color: #6ee7c7; }
#login > h2 { margin-bottom: 1.2rem; text-align: center; }
#login form button, #login-button { width: 100%; }
#login input { min-width: 0; }
#login-button.passkey-login {
  color: #03150f;
  background: #43cf9e;
  box-shadow: 0 10px 28px #43cf9e24;
}
#login-button.passkey-login:hover, #login-button.passkey-login:focus-visible { background: #58ddb0; }
.account-application-entry { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #30435c; text-align: center; }
.account-application-entry > button { width: 100%; }
.account-application-entry form { margin-top: 1rem; text-align: left; }
.account-application-entry form h3 { margin-bottom: .25rem; }
.targeted-row { outline: 2px solid #6ee7c7; outline-offset: 2px; }
.otp-digit-control { position: relative; width: 100%; max-width: 28rem; }
.otp-digit-native {
  position: absolute;
  z-index: 2;
  inset: 0;
  min-height: 0;
  opacity: 0;
  cursor: text;
}
.otp-digit-cells { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(.3rem, 1.8vw, .6rem); }
.otp-digit-cells span {
  display: grid;
  height: clamp(3rem, 12vw, 3.6rem);
  min-width: 0;
  place-items: center;
  color: #eefcf8;
  background: #0d1625;
  border: 1px solid #405573;
  border-radius: 11px;
  font-size: clamp(1.25rem, 6vw, 1.65rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  box-shadow: inset 0 1px 0 #ffffff08;
}
.otp-digit-cells span.filled { border-color: #55cdb0; background: #10251f; }
.otp-digit-control:focus-within .otp-digit-cells span {
  border-color: #75d8c2;
  box-shadow: 0 0 0 2px #75d8c226;
}
.auth-mode-toggle { color: #9ee8dc; background: transparent; border: 1px solid #344864; }
label { display: grid; gap: .4rem; color: #b8c4d7; font-size: .88rem; }
input, select, textarea { width: 100%; color: #f4f7fb; background: #0c1422; border: 1px solid #344864; border-radius: 9px; padding: .78rem; font: inherit; }
textarea { resize: vertical; }
button, a.button { border: 0; border-radius: 9px; padding: .76rem 1rem; color: #07130f; background: #6ee7c7; font: inherit; font-weight: 750; cursor: pointer; }
a.button { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
button:hover, a.button:hover { filter: brightness(1.08); }
button:disabled { cursor: not-allowed; opacity: .55; }
button.secondary, button.quiet, a.button.secondary { color: #dbe7f6; background: #26364d; }
button.danger { color: #fff; background: #b9485b; }
form { display: grid; gap: 1rem; }
.tabs { display: flex; gap: .5rem; margin-bottom: 1.25rem; overflow-x: auto; }
.tabs .tab { background: #1c2a3e; color: #c4d1e3; }
.tabs .active { background: #6ee7c7; color: #07130f; }
.tabs .quiet { margin-left: auto; }
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 1rem 0; }
.toolbar p { color: #91a1b7; margin-bottom: 0; }
.session-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .8rem; }
.session-card { text-align: left; color: inherit; background: #121c2c; border: 1px solid #2b3d56; padding: 1rem; }
.session-card strong, .session-card span { display: block; }
.session-card span { color: #91a1b7; margin-top: .35rem; font-weight: 450; }
.session-storage { display: grid !important; gap: .35rem; margin-top: .75rem !important; }
.session-storage-label { margin: 0 !important; color: #aebdd0 !important; font-size: .75rem; }
.session-storage-bar {
  display: block !important;
  height: .72rem;
  overflow: hidden;
  margin: 0 !important;
  border: 1px solid #314a67;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #050b13 0%, #122033 52%, #09111d 100%);
  box-shadow: inset 0 2px 4px #02050aaa, inset 0 -1px 1px #58708b55, 0 1px 0 #ffffff0b;
}
.session-storage-bar > span {
  display: block;
  height: 100%;
  margin: 0 !important;
  border-radius: inherit;
  background: linear-gradient(180deg, #8af0d0 0%, #43c99f 45%, #239576 100%);
  box-shadow: inset 0 1px 1px #efffffb8, inset 0 -2px 3px #075b4b66, 2px 0 5px #55d6a977;
}
.session-storage[data-level="warning"] .session-storage-bar > span { background: linear-gradient(180deg, #ffe2a0 0%, #e6ad54 48%, #a96b20 100%); box-shadow: inset 0 1px 1px #fff8dbbf, inset 0 -2px 3px #78430d66, 2px 0 5px #e6ad5477; }
.session-storage[data-level="critical"] .session-storage-bar > span { background: linear-gradient(180deg, #ffadba 0%, #e35f72 48%, #9c3044 100%); box-shadow: inset 0 1px 1px #ffe8ecbf, inset 0 -2px 3px #741b2c66, 2px 0 5px #e35f7277; }
.session-storage[data-level="unlimited"] .session-storage-bar { background: repeating-linear-gradient(90deg, #28415d 0 8px, #17283d 8px 16px); }
.state { display: inline-flex !important; width: fit-content; border-radius: 999px; padding: .2rem .55rem; background: #26364d; color: #bfe9de !important; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .9rem; }
.form-grid .wide { grid-column: 1 / -1; }
.actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.meta { display: flex; flex-wrap: wrap; gap: .6rem; color: #9cacbf; margin-bottom: .8rem; }
.meta span { background: #172438; border-radius: 999px; padding: .3rem .7rem; }
.terminal-status { min-height: 1.2rem; margin: 0 0 .45rem; color: #91a1b7; font-size: .8rem; }
.terminal-controls { display: grid; gap: .55rem; margin: 0 0 .65rem; padding: .65rem; border: 1px solid #344864; border-radius: 10px; background: #101a29; }
.terminal-controls.keyboard-active { border-color: #4fbfa5; box-shadow: 0 0 0 1px #4fbfa544; }
.keyboard-status { margin: 0; color: #aebdd0; font-size: .8rem; }
.sharing { margin-top: 1rem; }
.share-user-field { display: grid; gap: .4rem; color: #b8c4d7; font-size: .88rem; }
.share-user-combobox { position: relative; }
.share-user-options {
  position: absolute;
  z-index: 30;
  top: calc(100% + .35rem);
  left: 0;
  right: 0;
  display: grid;
  max-height: min(18rem, 45vh);
  overflow-y: auto;
  padding: .35rem;
  border: 1px solid #49637d;
  border-radius: 10px;
  background: #101a29;
  box-shadow: 0 14px 30px #0009;
}
.share-user-option {
  display: grid;
  gap: .16rem;
  width: 100%;
  padding: .65rem .7rem;
  color: #e8eef8;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
}
.share-user-option small { color: #9fb0c6; font-weight: 550; }
.share-user-option:hover, .share-user-option.active { border-color: #6ee7c7; background: #183246; filter: none; }
.share-user-options-empty { padding: .65rem .7rem; color: #9fb0c6; }
.session-agents { margin: 0 0 1rem; }
.session-agents .toolbar { margin-top: 0; }
.agent-row { display: grid; gap: .2rem; padding: .7rem; border: 1px solid #344864; border-radius: 9px; background: #101a29; overflow-wrap: anywhere; }
.agent-row small { color: #aebdd0; }
.session-files { margin-top: 1rem; }
.memory-export-button { gap: .45rem; }
.memory-export-button svg { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.memory-guidance { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: .75rem 0 1rem; padding: .8rem 1rem; border: 1px solid #49637d; border-radius: 12px; background: #14243a; }
.memory-guidance > div { display: grid; gap: .25rem; }
.memory-guidance span { color: var(--muted); font-size: .84rem; }
.memory-guidance button { flex: 0 0 auto; }
.memory-health { display: grid; gap: .2rem; margin: -.35rem 0 1rem; padding: .65rem .85rem; border: 1px solid #49637d; border-radius: 12px; background: #102035; }
.memory-health span, .memory-health small { color: var(--muted); }
.memory-health.healthy { border-color: #3eaa94; background: #11332f; }
.memory-health.healthy strong { color: #83efd5; }
.memory-health.attention { border-color: #b68737; background: #352b19; }
.memory-health.attention strong { color: #ffd27d; }
.artifact-backlinks { display: grid; gap: .3rem; max-height: 12rem; overflow: auto; padding: .55rem .7rem; border: 1px solid #38536e; border-radius: 10px; }
.artifact-backlinks:empty { display: none; }
#file-preview-panel { margin-top: 1rem; }
#file-preview-panel .toolbar { margin-top: 0; }
#file-preview-text { max-height: 24rem; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; margin: .35rem 0 1rem; padding: .8rem; color: #dce7d9; background: #05080d; border: 1px solid #344864; border-radius: 9px; font: .82rem/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; }
.session-changes { margin-top: 1rem; }
.session-changes .toolbar { margin-top: 0; }
.session-changes pre { max-height: 24rem; overflow: auto; margin: .35rem 0 1rem; padding: .8rem; color: #dce7d9; background: #05080d; border: 1px solid #344864; border-radius: 9px; font: .82rem/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; tab-size: 4; }
.project-files-list { display: grid; gap: .45rem; margin: .6rem 0; }
.project-file-button { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; text-align: left; color: #dbe7f6; background: #172438; overflow-wrap: anywhere; }
.project-file-button small { color: #aebdd0; }
.session-jobs { margin-top: 1rem; }
.session-jobs .toolbar { margin-top: 0; }
.job-row { display: grid; gap: .6rem; min-width: 0; padding: .8rem; border: 1px solid #344864; border-radius: 9px; background: #101a29; }
.job-auto-retry, .job-approval-retry { display: flex; align-items: center; gap: .7rem; }
.job-auto-retry input, .job-approval-retry input { width: auto; min-width: 1.1rem; min-height: 1.1rem; }
.field-note { margin: -.15rem 0 .2rem; color: #9fb0c6; font-size: .82rem; }
.job-row strong, .job-row small, .job-run span { overflow-wrap: anywhere; }
.job-row small { color: #aebdd0; }
.job-runs { display: grid; gap: .35rem; color: #aebdd0; font-size: .84rem; }
.job-run { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .4rem .55rem; border-radius: 7px; background: #172438; }
.job-run button { flex: 0 0 auto; padding: .42rem .65rem; }
.job-run { flex-wrap: wrap; }
#job-approval-dialog, #job-schedule-dialog { width: min(92vw, 780px); max-height: 85vh; overflow: auto; color: inherit; background: #101a29; border: 1px solid #536987; border-radius: 12px; }
#job-approval-dialog::backdrop, #job-schedule-dialog::backdrop { background: #000b; }
#job-approval-question { max-height: 48vh; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
#job-snapshot-dialog { width: min(96vw, 980px); max-height: 90vh; overflow: auto; color: inherit; background: #101a29; border: 1px solid #536987; border-radius: 12px; }
#job-snapshot-dialog::backdrop { background: #000b; }
#job-snapshot-summary { overflow-wrap: anywhere; }
#job-snapshot-dialog pre { max-height: 35vh; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: .7rem; color: #dce7d9; background: #05080d; border: 1px solid #344864; border-radius: 9px; font: .82rem/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; }
.snapshot-metadata { display: grid; gap: .45rem; padding: .7rem; border: 1px solid #344864; border-radius: 9px; background: #142238; overflow-wrap: anywhere; }
.snapshot-metadata p { margin: 0; }
.snapshot-metadata code { font-size: .78rem; color: #dce7d9; word-break: break-all; }
.snapshot-explanation { color: #aebdd0; font-size: .84rem; }
.snapshot-metadata .snapshot-path { padding: .35rem .45rem; border-radius: 6px; background: #0c1728; }
.destructive-dialog { width: min(92vw, 520px); }
.destructive-dialog::backdrop { background: #02050bd9; backdrop-filter: blur(4px); }
.destructive-dialog form { display: grid; gap: .85rem; }
.destructive-dialog h2, .destructive-dialog p { margin: 0; }
.destructive-dialog label { display: grid; gap: .45rem; }
.form-error { color: #ff9dad; }
#job-snapshot-untracked { max-height: 38vh; overflow: auto; }
.snapshot-untracked-item { border: 1px solid #344864; border-radius: 9px; padding: .6rem; margin: .5rem 0; overflow-wrap: anywhere; }
.snapshot-untracked-item small { display: block; margin: .25rem 0; }
.snapshot-untracked-item pre { max-height: 18vh; }
.job-secret { display: grid; gap: .55rem; margin-top: 1rem; padding: 1rem; border: 1px solid #e6ad54; border-radius: 9px; background: #322a1c; }
.job-secret p { margin: 0; }
.session-files .toolbar { margin-top: 0; }
#more-files { margin-top: .7rem; }
.file-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; margin-top: .7rem; }
.file-controls .wide { grid-column: 1 / -1; }
.section-heading { margin-top: 1.35rem; padding-top: 1.1rem; border-top: 1px solid #344864; }
.section-heading h4 { margin: 0 0 .25rem; }
.section-heading p { margin: 0; color: #aebdd0; }
.workspace-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin: .75rem 0 .25rem; }
.workspace-breadcrumbs button { padding: .42rem .58rem; color: #9ee8dc; background: transparent; border-color: transparent; }
.workspace-breadcrumbs button:hover { background: #1b3048; }
.workspace-breadcrumbs span { color: #71839a; }
.workspace-breadcrumbs .workspace-breadcrumb-current { padding: .42rem .58rem; color: #9ee8dc; background: #14263a; border: 1px solid #31506f; border-radius: .7rem; font-weight: 750; }
.workspace-browser-list { display: grid; gap: .45rem; margin-top: .65rem; }
.workspace-browser-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .7rem; padding: .65rem .75rem; border: 1px solid #344864; border-radius: 10px; background: #101a29; }
.workspace-browser-name { min-width: 0; display: flex; align-items: center; gap: .55rem; color: #e7eef8; overflow-wrap: anywhere; }
.workspace-browser-name button { min-width: 0; padding: 0; color: #9ee8dc; text-align: left; background: transparent; border: 0; overflow-wrap: anywhere; }
.workspace-browser-name small { display: block; color: #91a1b7; }
.workspace-browser-kind { flex: 0 0 auto; width: 1.3rem; color: #8fc7ff; text-align: center; }
#workspace-browser-more { margin-top: .7rem; }
.file-row { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .6rem; padding: .7rem; border: 1px solid #344864; border-radius: 9px; }
.file-row small { display: block; color: #aebdd0; overflow-wrap: anywhere; }
.file-row a { color: #7dd3fc; }
.rename-session, .recovery { margin: 1rem 0; }
.access-list { display: grid; gap: .65rem; margin-top: 1rem; }
.access-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem; border: 1px solid #344864; border-radius: 9px; background: #101a29; }
.access-row p { margin: 0; color: #aebdd0; }
.access-row strong { display: block; color: #f2f6fb; }
.preview-row { flex-wrap: wrap; }
.preview-row > div:first-child { min-width: min(22rem, 100%); flex: 1; }
.preview-row .actions { margin-left: auto; }
.session-previews form { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #344864; }
.user-activity-row { align-items: center; gap: 1rem; }
.user-row-actions { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }
.user-row-actions input { width: 9rem; min-height: 42px; }
.user-entitlement-controls { display: flex; align-items: end; gap: .55rem; flex-wrap: wrap; padding-inline-start: .65rem; border-inline-start: 1px solid #344864; }
.user-entitlement-controls label { display: grid; gap: .25rem; color: #9eb0c7; font-size: .76rem; font-weight: 700; }
.user-entitlement-controls select { min-width: 9.5rem; }
.user-entitlement-controls .user-entitlement-vpn { display: flex; align-items: center; min-height: 42px; color: #dce6f3; font-size: .84rem; }
.user-entitlement-controls .user-entitlement-vpn input { width: auto; min-height: auto; }
.user-directory-card { display: grid; gap: .8rem; }
.user-directory-search { display: grid; width: min(100%, 34rem); gap: .3rem; color: #b8c4d7; font-size: .8rem; font-weight: 750; }
.user-directory-search input { margin: 0; }
.user-directory-list { display: grid; gap: .55rem; }
.user-directory-row { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(10rem, .75fr) minmax(9rem, .55fr); align-items: center; gap: 1rem; width: 100%; padding: .85rem 1rem; color: #dce8f7; text-align: left; border: 1px solid #344864; border-radius: 12px; background: #101a29; }
.user-directory-row:hover { border-color: #54718f; background: #142238; }
.user-directory-row.selected { border-color: #72e5c8; background: #153028; box-shadow: 0 0 0 2px #72e5c822; }
.user-directory-identity { min-width: 0; }
.user-directory-identity strong, .user-directory-identity small { display: block; overflow-wrap: anywhere; }
.user-directory-identity strong { color: #f2f6fb; font-size: .96rem; }
.user-directory-identity small, .user-directory-usage { color: #aebdd0; font-size: .8rem; }
.user-directory-package { justify-self: end; width: fit-content; padding: .28rem .55rem; color: #c8e8df; border: 1px solid #3f7066; border-radius: 999px; background: #173129; font-size: .75rem; font-weight: 750; }
.user-settings-panel { scroll-margin-top: 1rem; }
.user-settings-heading { padding-bottom: 1rem; border-bottom: 1px solid #344864; }
.user-settings-heading .eyebrow { display: block; margin-bottom: .2rem; color: #82e7d0; font-size: .7rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.user-settings-heading h3, .user-settings-heading p { margin: 0; }
.user-settings-heading p { margin-top: .25rem; color: #aebdd0; }
.user-settings-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 1rem; margin-top: 1rem; }
.user-setting-group { display: grid; align-content: start; gap: .8rem; min-width: 0; padding: 1rem; border: 1px solid #344864; border-radius: 13px; background: #101a29; }
.user-setting-group h4, .user-setting-group p { margin: 0; }
.user-setting-group > div:first-child > p, .user-setting-group .toolbar p { margin-top: .2rem; color: #9eb0c7; }
.user-setting-group > button { justify-self: start; }
.user-setting-group .runtime-profile-summary { margin: 0; }
.user-account-controls { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.user-account-controls .actions { justify-content: flex-end; }
.client-download-card { display: grid; gap: 1rem; }
.client-release-versions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.client-release-versions > div { display: grid; gap: .2rem; padding: .8rem .9rem; border: 1px solid #344864; border-radius: 12px; background: #0d1828; }
.client-release-versions span { color: #9eb0c7; font-size: .72rem; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.client-release-versions strong { color: #f0f6ff; overflow-wrap: anywhere; }
.client-deployment-notice { margin: 0; padding: .8rem .9rem; color: #f3d999; border: 1px solid #8a681e; border-radius: 11px; background: #2b220e; }
.client-download-card[data-state="failed"] .client-deployment-notice,
.client-download-card[data-state="invalid"] .client-deployment-notice { color: #ffc1ca; border-color: #934151; background: #32151c; }
.client-install-workflow { display: grid; gap: 1.1rem; }
.client-install-heading h3, .client-install-heading p { margin: 0; }
.client-install-heading .eyebrow { margin-bottom: .25rem; }
.client-install-heading p:last-child { margin-top: .25rem; color: #aebdd0; }
.client-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.client-choice-grid fieldset { min-width: 0; margin: 0; padding: .75rem; border: 1px solid #344864; border-radius: 12px; }
.client-choice-grid legend { padding: 0 .35rem; color: #aebdd0; font-size: .78rem; font-weight: 750; }
.client-segmented { display: flex; gap: .4rem; }
.client-segmented button { min-width: 0; flex: 1 1 0; padding: .6rem .7rem; color: #c7d5e7; border: 1px solid #405570; background: #19283d; }
.client-segmented button.active { color: #082019; border-color: #6ee7c7; background: #6ee7c7; box-shadow: 0 0 0 2px #6ee7c722; }
.client-selected-package { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border: 1px solid #44705f; border-radius: 14px; background: linear-gradient(120deg, #10251f, #101d2d); }
.client-selected-package > div { display: grid; min-width: 0; gap: .3rem; }
.client-selected-package strong { color: #f0f7ff; font-size: 1.05rem; }
.client-selected-package span:not(.eyebrow) { color: #aebdd0; }
.client-selected-package code { color: #9db2cc; font-size: .72rem; overflow-wrap: anywhere; }
.client-selected-package > a { flex: 0 0 auto; }
.client-install-steps { display: grid; gap: .7rem; counter-reset: client-step; }
.client-install-steps > section { min-width: 0; overflow: hidden; border: 1px solid #344864; border-radius: 13px; background: #101a29; }
.client-step-title { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .75rem; padding: .85rem .9rem; }
.client-step-title > span { display: grid; place-items: center; width: 2rem; height: 2rem; color: #082019; border-radius: 999px; background: #6ee7c7; font-weight: 850; }
.client-step-title h4, .client-step-title p { margin: 0; }
.client-step-title h4 { color: #eef5ff; }
.client-step-title p { margin-top: .15rem; color: #9eb0c7; font-size: .82rem; }
.client-step-title button { min-height: 36px; padding: .45rem .7rem; }
.client-install-steps pre, .client-help-disclosure pre {
  width: 100%;
  max-height: none;
  overflow: visible;
  margin: 0;
  padding: .9rem 1rem;
  color: #dce7d9;
  border: 0;
  border-top: 1px solid #344864;
  border-radius: 0;
  background: #070d16;
  font: .82rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  tab-size: 4;
  user-select: all;
}
.client-install-steps pre code, .client-help-disclosure pre code { display: block; min-width: 0; white-space: inherit; }
.client-platform-security { padding: 0 .9rem .9rem 3.65rem; color: #b9c7d8; line-height: 1.5; }
.client-selected-raw { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: 0 .9rem .85rem; color: #aebdd0; }
.client-selected-raw span { min-width: 0; overflow-wrap: anywhere; }
.client-selected-raw a { flex: 0 0 auto; margin: 0; }
.client-help-separator { margin: 1.15rem 0; border: 0; border-top: 1px solid #344864; }
.client-help-disclosure { margin: .65rem 0; border: 1px solid #344864; border-radius: 12px; background: #101a29; }
.client-help-disclosure summary { padding: .8rem .9rem; color: #dce8f7; font-weight: 750; cursor: pointer; }
.client-help-disclosure[open] summary { border-bottom: 1px solid #344864; }
.client-help-disclosure p { margin: 0; padding: .85rem .9rem; color: #aebdd0; }
.device-code { display: block; margin: 1rem 0; padding: .8rem; text-align: center; font: 700 1.7rem/1.2 ui-monospace, monospace; letter-spacing: .16em; color: var(--mint); background: #08111d; border-radius: 12px; }
.settings-page { display: grid; gap: 1rem; }
.settings-page > .toolbar, .settings-page > .card { margin: 0; }
.settings-page > .toolbar + .toolbar { margin-top: .25rem; }
.advanced-settings { border-top: 1px solid #344864; padding-top: .75rem; }
.advanced-settings summary { color: #cfe0f4; font-weight: 800; cursor: pointer; }
.advanced-settings-body { display: grid; gap: .75rem; padding-top: .85rem; }
.advanced-settings-body > p { margin: 0; color: #aebdd0; }
.cache-maintenance-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.cache-maintenance-card, .audit-recheck-control { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem; border: 1px solid #344b68; border-radius: 12px; background: #0c1727; }
.cache-maintenance-card > div, .audit-recheck-control > div { display: grid; gap: .3rem; min-width: 0; }
.cache-maintenance-card h4, .audit-recheck-control strong { margin: 0; color: #eef5ff; }
.cache-maintenance-card p, .audit-recheck-control p { margin: 0; color: #9fb0c5; font-size: .82rem; line-height: 1.45; }
.cache-maintenance-card button, .audit-recheck-control button { flex: 0 0 auto; }
.session-runtime-advanced { margin-top: .75rem; }
.provider-compatibility-evidence { display: grid; gap: .65rem; padding-top: 1rem; border-top: 1px solid var(--border, #344864); }
.provider-compatibility-evidence > h4,
.provider-compatibility-evidence > p { margin: 0; }
.compatibility-evidence-row { display: grid; grid-template-columns: minmax(12rem, 1fr) repeat(4, minmax(5rem, auto)); gap: .65rem; align-items: center; }
.compatibility-evidence-row small { color: var(--muted, #aebdd0); }
@media (max-width: 760px) { .compatibility-evidence-row { grid-template-columns: 1fr 1fr; } }
.provider-release-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.provider-release-heading p, .provider-release-schedule, .upgrade-release-guidance { margin-bottom: 0; color: #aebdd0; }
.provider-release-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.provider-release-row { display: grid; gap: .55rem; padding: 1rem; border: 1px solid #435873; border-radius: 13px; background: #101a29; }
.provider-release-row[data-state="current"], .provider-release-row[data-state="verified_ahead"] { border-color: #51b99d; background: #102923; }
.provider-release-row[data-state="update_available"] { border-color: #e6ad54; background: #332817; box-shadow: 0 0 0 2px #e6ad5422; }
.provider-release-row[data-state="error"], .provider-release-row[data-state="unchecked"], .provider-release-row[data-state="unverified"] { border-color: #b98548; }
.provider-release-title { display: flex; align-items: center; justify-content: space-between; gap: .7rem; }
.provider-release-title strong { font-size: 1.02rem; }
.release-summary, .provider-release-state { display: inline-flex; width: fit-content; align-items: center; border: 1px solid #526984; border-radius: 999px; padding: .25rem .6rem; color: #dce8f7; background: #203149; font-size: .74rem; font-weight: 800; }
.release-summary.current, .provider-release-state.current, .provider-release-state.verified_ahead { border-color: #51b99d; color: #bff6e5; background: #153a31; }
.release-summary.update_available, .provider-release-state.update_available { border-color: #e6ad54; color: #ffe3aa; background: #45351d; }
.release-summary.error, .provider-release-state.error { border-color: #e06f7d; color: #ffd0d6; background: #431f27; }
.provider-release-versions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.provider-release-version { display: grid; gap: .15rem; padding: .6rem .7rem; border-radius: 9px; background: #0b1422; }
.provider-release-version span { color: #91a1b7; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; }
.provider-release-version code { color: #eef5ff; overflow-wrap: anywhere; }
.provider-release-row p, .provider-release-row small { margin: 0; color: #aebdd0; }
.provider-release-schedule { margin-top: .8rem; font-size: .8rem; }
#upgrade-form { margin-bottom: 1rem; }
.upgrade-release-guidance { margin-top: .35rem; }
.runtime-tools-selector { min-width: 0; margin: 0; padding: .8rem; border: 1px solid #344864; border-radius: 12px; }
.runtime-tools-selector legend { padding: 0 .35rem; color: #eef5ff; font-weight: 800; }
.runtime-tools-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; margin-bottom: .55rem; }
.runtime-tools-heading span { color: #9ee8dc; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.runtime-tools-heading small { color: #91a1b7; text-align: right; }
.runtime-profile-summary { margin: .65rem 0; padding: .7rem .8rem; color: #c8d7e8; background: #0b1625; border: 1px solid #2f4865; border-radius: 9px; line-height: 1.45; }
.runtime-tool-included { color: #72e5c8; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
.runtime-profile-dialog { width: calc(100vw - clamp(1rem, 4vw, 3rem)); max-width: none; max-height: calc(100dvh - clamp(1rem, 4vw, 3rem)); margin: auto; overflow: auto; }
.runtime-profile-dialog > section { display: grid; gap: 1rem; }
.runtime-profile-comparison { max-width: 100%; overflow: hidden; border: 1px solid #344864; border-radius: 10px; }
.runtime-profile-comparison table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.runtime-profile-comparison th, .runtime-profile-comparison td { padding: clamp(.45rem, .8vw, .7rem); border-bottom: 1px solid #2f425b; border-inline-end: 1px solid #2f425b; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.runtime-profile-comparison thead th { position: sticky; top: 0; color: #08121c; background: #72e5c8; z-index: 1; }
.runtime-profile-comparison thead th:first-child, .runtime-profile-comparison tbody th { width: 15%; }
.runtime-profile-comparison tbody th { color: #eef5ff; background: #152238; }
.runtime-profile-comparison td { color: #c9d6e6; }
.runtime-profile-mobile-comparison { display: none; }
.settings-list { display: grid; gap: .45rem; }
.setting-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-width: 0; padding: .68rem .75rem; border: 1px solid #344864; border-radius: 11px; background: #101a29; }
.setting-row > span:first-child { min-width: 0; }
.setting-row strong, .setting-row small { display: block; }
.setting-row small { margin-top: .18rem; color: #91a1b7; line-height: 1.35; }
.switch-control { position: relative; display: block; width: 48px; height: 28px; flex: 0 0 48px; }
.switch-control input { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.switch-track { position: absolute; inset: 0; border: 1px solid #4c6079; border-radius: 999px; background: #26364d; transition: background .16s ease, border-color .16s ease; }
.switch-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #dbe7f6; box-shadow: 0 2px 5px #0008; transition: transform .16s ease; }
.switch-control input:checked + .switch-track { border-color: #4ac7a5; background: #2ba984; }
.switch-control input:checked + .switch-track::after { transform: translateX(20px); background: #fff; }
.switch-control input:focus-visible + .switch-track { outline: 3px solid #7dd3fc66; outline-offset: 2px; }
.switch-control input:disabled { cursor: not-allowed; }
.switch-control input:disabled + .switch-track { opacity: .62; }
.image-audit-controls { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-top: 1rem; }
.pagination-status { color: #aebdd0; font-size: .82rem; }
.pagination-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .55rem; margin-top: .8rem; }
.pagination-controls button { min-width: 6.5rem; }
.adapter-capabilities { color: #aebdd0; font-size: .86rem; line-height: 1.45; }
.image-audit-row { flex-wrap: wrap; overflow-wrap: anywhere; }
.image-audit-row[data-status="clean"] { border-color: #51b99d; }
.image-audit-row[data-status="remediating"] { border-color: #74dec9; }
.image-audit-row[data-status="critical"] { border-color: #e06f7d; }
.image-audit-row[data-status="pending"], .image-audit-row[data-status="error"],
.image-audit-row[data-status="drift"], .image-audit-row[data-status="overdue"] { border-color: #e6ad54; }
.image-audit-row[data-operator-action="true"] { border-color: #ad73e7; background: #211431; box-shadow: inset 4px 0 #b97af2; }
.image-audit-row[data-operator-action="true"] > div { min-width: min(100%, 34rem); }
.operator-action-heading { display: flex; align-items: center; gap: .45rem; margin-bottom: .35rem; color: #ddbaff; font-size: .78rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.operator-action-symbol { display: inline-grid; flex: 0 0 1.5rem; width: 1.5rem; height: 1.5rem; place-items: center; border-radius: 50%; color: #1c0b2e; background: #c795f5; font-weight: 950; }
.operator-guidance { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .8rem; padding: .8rem; border: 1px solid #a970e8; border-radius: 12px; color: #ead6ff; background: #251536; box-shadow: 0 0 0 1px #a970e822; }
.operator-guidance p { margin: .2rem 0 0; color: #ccb4df; }
.operator-action-button, .image-audit-force-upgrade { color: #1c0b2e; border-color: #c795f5; background: #c795f5; }
.operator-action-button:hover, .operator-action-button:focus-visible,
.image-audit-force-upgrade:hover, .image-audit-force-upgrade:focus-visible { background: #ddbaff; }
#image-audits-view.operator-action-required > .toolbar,
.image-audit-card.operator-action-required { border-color: #8e58c3; box-shadow: 0 0 0 1px #a970e822; }
@media (max-width: 700px) {
  .operator-guidance { grid-template-columns: auto minmax(0, 1fr); }
  .operator-guidance .operator-action-button { grid-column: 1 / -1; width: 100%; }
}
.session-operation-note { position: fixed; inset: calc(max(.65rem, env(safe-area-inset-top)) + 4.5rem) auto auto 50%; z-index: 1900; width: max-content; max-width: min(560px, calc(100% - 1.8rem)); margin: 0; padding: .75rem .9rem; transform: translateX(-50%); border: 1px solid #4d7596; border-radius: 10px; color: #dce8f7; background: #112238f5; box-shadow: 0 14px 34px #0009; overflow-wrap: anywhere; }
.session-operation-note[data-state="completed"] { border-color: #51b99d; color: #baf7df; background: #102d29; }
.session-operation-note[data-state="failed"] { border-color: #e06f7d; color: #ffd0d6; background: #351923; }
.session-operation-note[data-state="waiting_safe_boundary"] { border-color: #e6ad54; color: #ffe2a8; background: #342716; }
.session-runtime-status { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: .7rem 0; padding: .8rem 1rem; border: 1px solid #c57b28; border-radius: 11px; color: #ffe2b6; background: #352616; }
.session-runtime-status > div { display: grid; gap: .25rem; }
.session-runtime-status strong, .session-runtime-status p { margin: 0; }
.session-runtime-status p { color: inherit; }
.session-runtime-status[data-state="updating"] { border-color: #4d7596; color: #dce8f7; background: #112238; }
.session-runtime-status[data-state="repair_required"] { border-color: #d4586d; color: #ffdce2; background: #351923; }
.session-runtime-status[data-state="repair_required"] button { background: #f3cf69; color: #211800; }
@media (max-width: 700px) { .session-runtime-status { align-items: stretch; flex-direction: column; } .session-runtime-status button { width: 100%; } }
.upgrade-status { display: grid; gap: .75rem; margin-top: 1rem; }
.upgrade-status-item { display: grid; gap: .65rem; padding: .8rem; border: 1px solid #344864; border-radius: 12px; background: #101a29; }
.upgrade-status-item[data-state="failed"] { border-color: #8f4350; }
.upgrade-status strong { font-size: 1.05rem; }
.upgrade-status p, .upgrade-status small { margin: 0; color: var(--muted); }
.upgrade-progress { height: .65rem; overflow: hidden; border-radius: 999px; background: #091321; border: 1px solid #31455f; }
.upgrade-progress span { display: block; height: 100%; background: linear-gradient(90deg, #67dfca, #82b9ff); transition: width .3s ease; }
.upgrade-status-item[data-state="failed"] .upgrade-progress span { background: #e06f7d; }
.upgrade-status-item[data-state="waiting_safe_boundary"] .upgrade-progress span { background: #e6ad54; }
.upgrade-failure { display: grid; gap: .45rem; padding: .75rem; border: 1px solid #8f4350; border-radius: 10px; background: #27151d; }
.upgrade-failure strong { color: #ffd5db; }
.upgrade-failure p, .upgrade-failure small { color: #efbdc5; }
.upgrade-failure details { color: #efbdc5; }
.upgrade-failure details summary { cursor: pointer; font-weight: 700; }
.upgrade-failure details code { display: block; margin-top: .45rem; padding: .55rem; overflow-wrap: anywhere; white-space: pre-wrap; color: #ffdce1; border-radius: 7px; background: #110b0e; }
.update-operation-list { margin-top: 0; }
.update-operation-list:empty::before { content: "No update operations have been recorded."; color: var(--muted); }
.import-attestation { display: flex; align-items: center; gap: .65rem; }
.import-attestation input { width: auto; flex: 0 0 auto; }
#import-list .access-row { flex-wrap: wrap; overflow-wrap: anywhere; }
#invitation-result { margin-top: 1rem; }
#invitation-url { margin-bottom: .7rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
#terminal-output { height: min(62vh, 720px); min-height: 320px; overflow: hidden; margin: 0; padding: .65rem; color: #dce7d9; background: #05080d; border: 1px solid #4b6587; border-radius: 12px; font-variant-ligatures: none; }
#terminal-output .xterm { height: 100%; }
#terminal-output .xterm-viewport { scrollbar-color: #415a79 #05080d; }
.composer { grid-template-columns: minmax(0, 1fr) auto; align-items: end; margin-top: .8rem; }
.composer-message { min-width: 0; }
.composer-actions { display: flex; gap: .55rem; }
.speech-progress { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .65rem .8rem; border: 1px solid #46617f; border-radius: 9px; background: #111d2d; }
.speech-progress[aria-busy="true"] { border-color: #e6ad54; }
#speech-progress button { width: auto; min-width: 88px; min-height: 44px; flex: 0 0 auto; }
.skill-admin-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr); gap: 1rem; align-items: start; }
.skill-admin-grid > .card { margin: 0; }
.skill-adapters { display: flex; flex-wrap: wrap; gap: .55rem 1rem; margin: .8rem 0; }
.skill-adapters label { display: inline-flex; align-items: center; gap: .4rem; margin: 0; }
.skill-adapters input[type="checkbox"] {
  width: 1rem;
  min-width: 1rem;
  height: 1rem;
  margin: 0;
  padding: 0;
  accent-color: #6ee7c7;
}
.skill-row-metadata { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .7rem; margin-top: .45rem; color: var(--muted); font-size: .78rem; }
.skill-row-metadata code { overflow-wrap: anywhere; color: #addfd5; }
.skill-detail-dialog { width: min(900px, calc(100% - 1rem)); }
.skill-detail-dialog > section { display: grid; gap: .8rem; }
.skill-detail-dialog pre { max-height: min(48vh, 520px); overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.skill-detail-dialog .snapshot-metadata .skill-row-metadata { margin: 0; }
.skill-catalog-group { display: grid; gap: .65rem; }
.skill-catalog-group + .skill-catalog-group { margin-top: 1.1rem; }
.skill-catalog-group > h4 { margin: 0; color: #72e3cf; }
.skill-sharing { display: grid; gap: .75rem; padding: .85rem; border: 1px solid #38516f; border-radius: 14px; }
.skill-sharing > h3 { margin: 0; }
.skill-share-row > button { align-self: center; }
.tls-warning { margin: 0 0 1rem; padding: .8rem 1rem; border: 1px solid #e6ad54; border-radius: 9px; color: #ffe4ad; background: #30291c; overflow-wrap: anywhere; }
.docs-layout { display: grid; grid-template-columns: minmax(210px, 280px) minmax(0, 1fr); gap: 1rem; align-items: start; }
.docs-list { display: grid; gap: .4rem; position: sticky; top: 6.5rem; max-height: calc(100vh - 8rem); overflow-y: auto; }
.docs-list button { text-align: left; color: #c8d5e7; background: #121c2c; border: 1px solid #2b3d56; }
.docs-list button.active { color: #07130f; background: #6ee7c7; }
.docs-search { display: grid; gap: .35rem; margin: 0 0 1rem; padding: .8rem; border: 1px solid #304760; border-radius: 12px; background: #111c2c; }
.docs-search > div { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .55rem; }
.docs-search label { color: #dce8f7; font-weight: 750; }
.docs-search p { min-height: 1.2em; margin: 0; color: #93a8bf; font-size: .82rem; }
.docs-search-results { display: grid; gap: .7rem; }
.docs-search-result { display: grid; gap: .3rem; padding: .85rem; text-align: left; color: #d9e6f5; background: #111d2d; border: 1px solid #344864; }
.docs-search-result span { color: #9fb3c9; font-size: .82rem; font-weight: 450; }
.field-muted { opacity: .62; }
.docs-content { min-width: 0; line-height: 1.7; font-weight: 400; }
.docs-content > :is(p, ul, ol, blockquote) { max-width: 76ch; }
.docs-content p, .docs-content li { color: #cbd8e8; font-weight: 400; }
.docs-content li { margin-bottom: .35rem; }
.docs-content h1, .docs-content h2, .docs-content h3 { scroll-margin-top: 7rem; line-height: 1.25; }
.docs-content h2 { margin-top: 2.2rem; }
.docs-content a { color: #7dd3fc; }
.docs-content pre { overflow-x: auto; padding: 1rem; border-radius: 10px; background: #080d16; }
.docs-content code { color: #cae8df; }
.docs-content :not(pre) > code { padding: .12rem .32rem; border-radius: 5px; background: #18283c; }
.docs-content table { width: 100%; border-collapse: collapse; display: block; overflow-x: auto; }
.docs-content th, .docs-content td { padding: .55rem .7rem; border: 1px solid #344864; text-align: left; }
.docs-content blockquote { margin-left: 0; padding: .65rem 1rem; color: #bdc9d9; border-left: 4px solid #6ee7c7; background: #111d2d; }
.openapi-document-index { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: .65rem; margin-top: 1.25rem; }
.openapi-document-index button { min-height: 3.4rem; text-align: left; color: #c8d5e7; background: #111d2d; border-color: #344864; }
.openapi-document-index button:hover { color: #08151b; background: #6ee7c7; }
.rendered-diagram { display: grid; gap: .55rem; margin: 1.3rem 0; padding: 1rem; overflow-x: auto; border: 1px solid #344864; border-radius: 12px; background: #0b1320; }
.rendered-diagram figcaption { color: #6ee7c7; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.diagram-svg { width: max-content; min-width: 100%; }
.diagram-svg svg { display: block; max-width: none !important; height: auto; }

/* Workspace visual system */
:root {
  --surface: #121a2b;
  --surface-raised: #192438;
  --line: #30415c;
  --muted: #a9b7ca;
  --mint: #71e8ca;
  --violet: #a995ff;
  color: #edf4ff;
  background: #090e19;
  color-scheme: dark;
}
body {
  background:
    radial-gradient(ellipse at 14% -10%, #273a64 0, transparent 40%),
    radial-gradient(ellipse at 88% 10%, #20383c 0, transparent 30%),
    linear-gradient(180deg, #0b1120, #090e19 56%);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: linear-gradient(#c8d4ff05 1px, transparent 1px), linear-gradient(90deg, #c8d4ff05 1px, transparent 1px);
  background-size: 42px 42px;
}
header.app-header {
  min-height: 72px;
  padding: .72rem clamp(1rem, 3vw, 3.25rem);
  border-bottom: 1px solid #50648045;
  background: #0b1220df;
}
.brand { display: flex; align-items: center; gap: .85rem; min-width: 0; }
.brand-mark {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  border-radius: 14px;
  box-shadow: 0 10px 28px #45d9ef35;
}
.brand h1 { font-size: clamp(1.2rem, 2vw, 1.55rem); line-height: 1.1; letter-spacing: -.04em; }
.brand h1 span { color: var(--mint); }
.brand .eyebrow { margin-bottom: .28rem; color: #a7b7d4; font-size: .58rem; letter-spacing: .2em; }
main { width: min(1480px, calc(100% - clamp(1rem, 4vw, 5rem))); margin: 1.1rem auto 3rem; }
h2 { letter-spacing: -.035em; }
h3 { letter-spacing: -.02em; }
p { line-height: 1.5; }
.eyebrow { color: #87dfd0; }
button { min-height: 42px; transition: background-color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
button:hover:not(:disabled) { filter: none; transform: translateY(-1px); }
button:active:not(:disabled) { transform: translateY(0); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, #terminal-output:focus-visible {
  outline: 2px solid #9bdcff;
  outline-offset: 3px;
}
input, select, textarea {
  min-height: 43px;
  border: 1px solid #3d506c;
  background: #0d1625;
  border-radius: 11px;
}
input::placeholder, textarea::placeholder { color: #788da7; }
button.secondary, button.quiet { background: #24354a; color: #e6efff; }
button.danger { background: #a94359; }
.recovery-action { color: #2b2108; background: #f2d47a; box-shadow: inset 0 0 0 1px #ffe9a8; }
.recovery-action:hover:not(:disabled) { background: #ffe39a; }
.card {
  background: linear-gradient(155deg, #182437ef, #111b2bed);
  border-color: #354861;
  border-radius: 20px;
  box-shadow: 0 18px 48px #02070f25;
}
.tabs {
  position: sticky;
  top: 76px;
  z-index: 4;
  align-items: center;
  gap: .25rem;
  padding: .4rem;
  border: 1px solid #32445c;
  border-radius: 16px;
  background: #131f31ee;
  backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px #03091430;
  scrollbar-width: none;
}
.tabs::-webkit-scrollbar, .session-tabs::-webkit-scrollbar { display: none; }
.tabs .tab {
  flex: 0 0 auto;
  min-height: 42px;
  padding: .62rem .95rem;
  color: #aebfd4;
  background: transparent;
  border-radius: 11px;
  white-space: nowrap;
}
.tabs .tab:hover { background: #263850; color: #fff; }
.tabs .active, .tabs .active:hover { color: #08151b; background: var(--mint); box-shadow: 0 5px 14px #52d8bd30; }
.tabs .quiet { flex: 0 0 auto; min-height: 42px; background: transparent; white-space: nowrap; }
.tabs .quiet:hover { background: #263850; }
.connection {
  padding: .55rem .8rem;
  background: #172637;
  border: 1px solid #38516a;
  border-radius: 999px;
  white-space: nowrap;
}
.connection[data-state="ready"] { color: #b7f1dc; border-color: #3b8b70; background: #17392f; }
.connection[data-state="warning"] { color: #ffe3ad; border-color: #9d763d; background: #3a2e1e; }
.connection[data-state="error"] { color: #ffc5c5; border-color: #9e4d56; background: #3c222c; }
.header-status { display: flex; align-items: center; justify-content: flex-end; gap: .55rem; min-width: 0; }
.notification-inbox-button { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; padding: .48rem; color: #dbe7f6; background: #203149; }
.notification-inbox-button.operator-action-required { color: #e3c6ff; border-color: #a970e8; background: #2b183f; box-shadow: 0 0 0 1px #a970e855, 0 0 16px #a970e866; }
.notification-inbox-button svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.notification-unread-badge { position: absolute; top: -6px; right: -6px; min-width: 1.25rem; height: 1.25rem; padding: 0 .28rem; border: 2px solid #0d1727; border-radius: 999px; color: #07131b; background: #6ee7c7; font-size: .68rem; font-weight: 800; line-height: 1rem; }
.notification-inbox-dialog { width: min(680px, calc(100vw - 2rem)); max-width: 680px; max-height: min(90dvh, 760px); overflow-y: auto; }
.notification-inbox-dialog > section { display: grid; gap: .8rem; }
.notification-inbox-heading, .notification-actions { display: flex; align-items: center; justify-content: space-between; gap: .7rem; }
.notification-inbox-heading h2, .notification-inbox-heading p { margin: 0; }
#notification-inbox-status:empty { display: none; }
.notification-inbox-list, .notification-device-list { display: grid; gap: .55rem; }
.notification-inbox-list { display: flex; flex-direction: column; max-height: min(52vh, 520px); overflow-y: auto; }
.notification-row { display: block; box-sizing: border-box; flex: 0 0 auto; width: 100%; height: auto; padding: .78rem .85rem; text-align: left; text-decoration: none; white-space: normal; color: #dbe7f6; background: #17263a; border: 1px solid #38516e; border-radius: 9px; cursor: pointer; }
.notification-row:hover, .notification-row:focus-visible { transform: none; border-color: #7795b5; background: #1d3048; }
.notification-row[data-read="false"] { border-color: #61cdb3; }
.notification-row[data-read="false"]:hover, .notification-row[data-read="false"]:focus-visible { border-color: #8aedd4; }
.notification-row[data-resolved="true"] { border-color: #3f806e; background: #152c2a; }
.notification-row[data-resolved="true"]:hover, .notification-row[data-resolved="true"]:focus-visible { border-color: #62b69d; background: #193632; }
.notification-row-layout { display: grid; grid-template-columns: .65rem minmax(0, 1fr); align-items: start; gap: .7rem; width: 100%; min-width: 0; }
.notification-row-dot { width: .58rem; height: .58rem; margin-top: .3rem; border-radius: 999px; background: #8290a4; }
.notification-row[data-severity="success"] .notification-row-dot { background: #57dda9; }
.notification-row[data-severity="warning"] .notification-row-dot { background: #efbd58; }
.notification-row[data-severity="error"] .notification-row-dot { background: #ed6a78; }
.notification-row[data-resolved="true"] .notification-row-dot { background: #57dda9; }
.notification-row[data-operator-action="true"] { border-color: #a970e8; background: #251536; box-shadow: inset 4px 0 #b97af2; }
.notification-row[data-operator-action="true"]:hover,
.notification-row[data-operator-action="true"]:focus-visible { border-color: #c795f5; background: #321b48; }
.notification-row[data-operator-action="true"] .notification-row-dot { background: #bd7cff; }
.notification-row[data-operator-action="true"] .notification-row-action { color: #d9b5ff; }
.notification-inbox-button.operator-action-required .notification-unread-badge { color: #1c0b2e; border-color: #251536; background: #c795f5; }
.notification-row-content { min-width: 0; display: grid !important; gap: .32rem; color: inherit !important; font-size: inherit !important; }
.notification-row-header { min-width: 0; display: flex !important; align-items: baseline; justify-content: space-between; gap: .6rem; margin: 0 !important; color: inherit !important; font-size: inherit !important; }
.notification-row-header strong { min-width: 0; overflow-wrap: anywhere; }
.notification-row-message, .notification-row-time { display: block; margin: 0 !important; color: #a9b8cc; font-size: .82rem; line-height: 1.4; overflow-wrap: anywhere; }
.notification-row-action { display: block; color: #72dec2; font-size: .78rem; font-weight: 750; overflow-wrap: anywhere; }
.notification-row-time { font-size: .75rem; }
.notification-row-state { flex: 0 0 auto; display: block; margin: 0; color: #91a2b7; font-size: .69rem; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.notification-row[data-read="false"] .notification-row-state { color: #79e5c8; }
.notification-row[data-resolved="true"] .notification-row-state { color: #75dfbd; }
.notification-load-older { justify-self: center; min-width: 8rem; padding: .45rem .8rem; }
.notification-device { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .65rem; border: 1px solid #304761; border-radius: 10px; }
.notification-device span, .notification-device small { display: block; }
.notification-device small { color: #9dafc5; }
.notification-device-settings > summary { cursor: pointer; font-weight: 750; }
.notification-email-preferences { display: grid; gap: .65rem; margin-top: .65rem; }
.notification-email-preferences label { display: flex; flex-direction: row; align-items: center; gap: .55rem; }
.notification-email-preferences input { width: auto; }
.notification-email-preferences fieldset { display: grid; gap: .45rem; margin: 0; padding: .65rem; border: 1px solid #304761; border-radius: 10px; }
.notification-email-preferences p { margin: 0; color: #9dafc5; }
.provider-health { position: relative; }
.provider-health summary { list-style: none; cursor: pointer; }
.provider-health summary::-webkit-details-marker { display: none; }
.provider-health-chip { display: flex; align-items: center; gap: .35rem; min-height: 38px; padding: .45rem .65rem; color: #c4d0df; background: #152234; border: 1px solid #40516a; border-radius: 999px; font-size: .74rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.system-health-chip { width: auto; min-width: 38px; height: 38px; justify-content: center; gap: .45rem; padding: 0 .72rem; }
.system-health-label { color: currentColor; font-size: .78rem; font-weight: 750; }
.system-health-chip .provider-health-dot { width: .78rem; height: .78rem; flex-basis: .78rem; box-shadow: 0 0 12px currentColor; }
.provider-health-chip:hover, .provider-health-chip:focus-visible { color: #fff; border-color: #7188a5; background: #203149; }
.provider-health-dot { width: .55rem; height: .55rem; flex: 0 0 .55rem; border-radius: 50%; background: #8794a8; }
.provider-health-state { color: #91a2b7; font-size: .68rem; font-weight: 600; }
.provider-health-chip[data-state="operational"] { color: #b7f1dc; border-color: #3b8b70; background: #17392f; }
.provider-health-chip[data-state="operational"] .provider-health-dot { background: #5ee69c; }
.provider-health-chip[data-state="operational"] .provider-health-state { color: #93d9bf; }
.provider-health-chip[data-state="unknown"], .provider-health-chip[data-state="degraded"], .provider-health-chip[data-state="maintenance"] { color: #ffe3ad; border-color: #9d763d; background: #3a2e1e; }
.provider-health-chip[data-state="unknown"] .provider-health-dot, .provider-health-chip[data-state="degraded"] .provider-health-dot, .provider-health-chip[data-state="maintenance"] .provider-health-dot { background: #e6ad54; }
.provider-health-chip[data-state="unknown"] .provider-health-state, .provider-health-chip[data-state="degraded"] .provider-health-state, .provider-health-chip[data-state="maintenance"] .provider-health-state { color: #e8c98e; }
.provider-health-chip[data-state="outage"] { color: #ffc5c5; border-color: #9e4d56; background: #3c222c; }
.provider-health-chip[data-state="outage"] .provider-health-dot { background: #ed6a5a; }
.provider-health-chip[data-state="outage"] .provider-health-state { color: #efa6ab; }
.provider-health-chip[data-state="action_required"] { color: #ead4ff; border-color: #a970e8; background: #2b183f; }
.provider-health-chip[data-state="action_required"] .provider-health-dot { background: #bd7cff; }
.provider-health-chip[data-state="action_required"] .provider-health-state { color: #d9b5ff; }
.provider-health-details { position: absolute; z-index: 50; inset-block-start: calc(100% + .5rem); inset-inline-end: 0; width: min(360px, calc(100vw - 2rem)); padding: .55rem; border: 1px solid #40516a; border-radius: 14px; background: #111c2c; box-shadow: 0 18px 45px #0009; }
.provider-health:not([open]) > .provider-health-details { display: none; }
.provider-health:hover > .provider-health-details,
.provider-health:focus-within > .provider-health-details { display: block; }
.provider-health-details :is(a, .health-detail) { display: grid; grid-template-columns: 1fr auto; gap: .2rem .7rem; padding: .7rem; color: #dbe6f3; text-decoration: none; border-radius: 10px; }
.provider-health-details a:hover { background: #1d2d43; }
.provider-health-details small { grid-column: 1 / -1; color: #9dafc4; line-height: 1.35; }
.provider-health-details :is(a, .health-detail)[data-state="operational"] .provider-health-state { color: #67dda8; }
.provider-health-details a[data-state="degraded"] .provider-health-state,
.provider-health-details a[data-state="maintenance"] .provider-health-state { color: #e6ad54; }
.provider-health-details a[data-state="outage"] .provider-health-state { color: #ed7a85; }
.health-detail[data-state="ready"] .provider-health-state { color: #67dda8; }
.health-detail[data-state="warning"] .provider-health-state { color: #e6ad54; }
.health-detail[data-state="error"] .provider-health-state { color: #ed7a85; }
.health-detail[data-state="action"] { border: 1px solid #9e68d6; background: #251536; }
.health-detail[data-state="action"] .provider-health-state { color: #d9b5ff; }
.operator-action-link { grid-column: 1 / -1; justify-self: start; min-height: 34px; padding: .42rem .65rem; color: #190b28; border-color: #c795f5; background: #c795f5; }
.operator-action-link:hover, .operator-action-link:focus-visible { background: #ddbaff; }
.provider-card-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .55rem; }
.user-menu-shell { position: relative; flex: 0 0 auto; margin-left: 0; }
.user-menu-shell[open] { z-index: 70; }
.user-menu-shell summary { list-style: none; cursor: pointer; }
.user-menu-shell summary::-webkit-details-marker { display: none; }
.user-menu { display: grid; width: 42px; height: 42px; min-height: 42px; place-items: center; padding: 0; border-radius: 11px; color: #c4d1e3; background: #1c2a3e; }
.user-avatar-image, .user-avatar-fallback { width: 34px; height: 34px; border-radius: 9px; }
.user-avatar-image { display: block; object-fit: cover; }
.user-avatar-fallback { display: grid; place-items: center; color: #eef8ff; background: #30445f; font-size: 1rem; font-weight: 850; text-transform: uppercase; }
.user-menu:hover, .user-menu:focus-visible { color: #fff; background: #263850; }
.user-menu.authorized { color: #071d14; border-color: #54dfa9; background: #69e6b8; box-shadow: 0 0 0 1px #69e6b855, 0 0 16px #54dfa966; }
.user-menu.authorized .user-avatar-image, .user-menu.authorized .user-avatar-fallback { outline: 2px solid #69e6b8; outline-offset: 1px; }
.user-menu-panel { position: absolute; z-index: 60; inset-block-start: calc(100% + .5rem); inset-inline-end: 0; display: grid; width: min(250px, calc(100vw - 1rem)); gap: .35rem; padding: .55rem; border: 1px solid #40516a; border-radius: 14px; background: #111c2c; box-shadow: 0 18px 45px #0009; }
.user-menu-shell:not([open]) > .user-menu-panel { display: none; }
.user-menu-action { width: 100%; min-height: 42px; color: #dbe7f6; text-align: left; background: transparent; border-color: transparent; box-shadow: none; }
.user-menu-divider { border: 0; border-top: 1px solid #38506e; margin: .35rem .2rem; }
.user-menu-action:hover, .user-menu-action:focus-visible { background: #2a405d; }
.user-menu-action.danger { color: #fff; background: #a94359; }
.user-menu-action.danger:hover, .user-menu-action.danger:focus-visible { background: #bf5067; }
.avatar-preference-card .checkbox-line { max-width: 34rem; }
.about-dialog { width: min(520px, calc(100vw - 2rem)); }
.about-dialog > section { display: grid; justify-items: center; gap: .8rem; text-align: center; }
.about-dialog h2, .about-dialog p { margin: 0; }
.about-logo { width: 88px; height: 88px; border-radius: 24px; box-shadow: 0 18px 42px #45d9ef40; }
.about-release { display: grid; width: 100%; gap: .45rem; margin: .2rem 0; }
.about-release > div { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem .7rem; border: 1px solid #344864; border-radius: 9px; background: #0b1524; }
.about-release dt { color: #9aabc0; text-align: left; }
.about-release dd { margin: 0; color: #eef8ff; font-weight: 750; text-align: right; overflow-wrap: anywhere; }
.about-dialog a { color: #72e5c8; overflow-wrap: anywhere; }
.admin-menu-shell { position: relative; flex: 0 0 auto; margin-left: auto; }
.admin-menu-shell[open] { z-index: 65; }
.admin-menu-shell summary { list-style: none; cursor: pointer; }
.admin-menu-shell summary::-webkit-details-marker { display: none; }
.admin-menu-toggle { display: flex; min-height: 42px; align-items: center; justify-content: center; gap: .45rem; padding: .62rem .95rem; color: #b7c5d8; border: 1px solid transparent; border-radius: 11px; background: transparent; box-shadow: none; font-weight: 800; white-space: nowrap; }
.admin-menu-toggle:hover, .admin-menu-toggle:focus-visible, .admin-menu-shell[open] > .admin-menu-toggle { color: #241b05; background: #ffd66b; box-shadow: 0 6px 18px #f2c14e66; }
.admin-menu-toggle.active { color: #241b05; background: #f2c14e; box-shadow: 0 5px 16px #f2c14e45; }
.admin-menu-toggle.active:hover, .admin-menu-toggle.active:focus-visible,
.admin-menu-shell[open] > .admin-menu-toggle:hover,
.admin-menu-shell[open] > .admin-menu-toggle:focus-visible { color: #241b05; border-color: #ffe59a; background: #ffe59a; box-shadow: 0 7px 20px #ffd66b70; }
.admin-menu-panel { position: absolute; z-index: 60; inset-block-start: calc(100% + .5rem); inset-inline-start: 0; display: grid; width: min(250px, calc(100vw - 1rem)); gap: .35rem; padding: .55rem; border: 1px solid #40516a; border-radius: 14px; background: #111c2c; box-shadow: 0 18px 45px #0009; }
.admin-menu-shell:not([open]) > .admin-menu-panel { display: none; }
.admin-menu-action { width: 100%; min-height: 42px; color: #dbe7f6; text-align: left; background: transparent; border-color: transparent; box-shadow: none; }
.admin-menu-action:hover, .admin-menu-action:focus-visible { background: #2a405d; }
.admin-menu-action.active { color: #241b05; background: #f2c14e; }
.operator-action-badge { display: inline-grid; min-width: 1.3rem; height: 1.3rem; place-items: center; padding: 0 .3rem; border: 1px solid #d5a8ff; border-radius: 999px; color: #1c0a2e; background: #c795f5; font-size: .68rem; font-weight: 900; line-height: 1; }
.admin-menu-shell.operator-action-required > .admin-menu-toggle { border-color: #a970e8; box-shadow: 0 0 0 1px #a970e844, 0 0 15px #a970e84d; }
.admin-menu-shell.operator-action-required > .admin-menu-toggle:hover,
.admin-menu-shell.operator-action-required[open] > .admin-menu-toggle,
.admin-menu-shell.operator-action-required > .admin-menu-toggle.active { border-color: #9c5eda; box-shadow: 0 0 0 2px #a970e877, 0 7px 20px #ffd66b55; }
.admin-menu-action.operator-action-required { display: flex; align-items: center; justify-content: space-between; gap: .65rem; border-color: #905ac5; color: #ead4ff; background: #28193a; }
.admin-menu-action.operator-action-required:hover, .admin-menu-action.operator-action-required:focus-visible { color: #fff; background: #3a2252; }
.admin-menu-divider { width: calc(100% - .4rem); margin: .25rem .2rem; border: 0; border-top: 1px solid #38506e; }
.provider-card-actions #upgrade-all-providers.updates-available { color: #291903; background: #f4a340; box-shadow: 0 5px 16px #f4a34040; }
.provider-card-actions #upgrade-all-providers.updates-available:hover:not(:disabled) { background: #ffb75b; }
.host-monitoring-card { display: grid; gap: 1rem; }
.host-service-status { display: grid; gap: .7rem; padding-block: .2rem .8rem; border-bottom: 1px solid #344b68; }
.host-service-status h3, .host-service-status p { margin: 0; }
.host-service-status p { color: #9eb0c7; }
.host-service-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.host-service-item { display: flex; align-items: center; justify-content: space-between; gap: .7rem; min-width: 0; padding: .75rem .8rem; border: 1px solid #344b68; border-radius: 12px; background: #0c1727; }
.host-service-description { display: grid; min-width: 0; gap: .18rem; }
.host-service-description small { color: #9eb0c7; line-height: 1.3; }
.host-service-item strong { overflow-wrap: anywhere; }
.host-service-state { flex: 0 0 auto; padding: .18rem .5rem; border: 1px solid #4b617c; border-radius: 999px; color: #c9d5e5; font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.host-service-state.running, .host-service-state.healthy { color: #8df5d5; border-color: #2f997b; background: #103b31; }
.host-service-state.unhealthy, .host-service-state.stopped, .host-service-state.missing, .host-service-state.unavailable { color: #ffc1ce; border-color: #a94359; background: #3e1c27; }
.host-service-state.starting { color: #ffe09b; border-color: #ad781d; background: #3b2c13; }
.host-service-state.empty { color: #aebdd0; border-color: #52657e; background: #172438; }
.host-monitoring-controls { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.host-monitoring-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .65rem; }
.host-monitoring-metrics > div { display: grid; gap: .15rem; min-width: 0; padding: .8rem; border: 1px solid #344b68; border-radius: 12px; background: #0c1727; }
.host-monitoring-metrics strong { color: #eef8ff; font-size: 1.05rem; line-height: 1.25; overflow-wrap: anywhere; }
.host-monitoring-metrics span { color: #9eb0c7; font-size: .76rem; }
.host-operational-status { display: grid; gap: .7rem; padding-block: .2rem .8rem; border-bottom: 1px solid #344b68; }
.host-operational-status h3, .host-operational-status p { margin: 0; }
.host-operational-status p { color: #9eb0c7; }
.host-operational-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .65rem; }
.host-operational-grid > div { display: grid; gap: .18rem; min-width: 0; padding: .8rem; border: 1px solid #344b68; border-radius: 12px; background: #0c1727; }
.host-operational-grid strong { color: #eef8ff; font-size: 1.05rem; overflow-wrap: anywhere; }
.host-operational-grid span { color: #9eb0c7; font-size: .76rem; font-weight: 750; }
.host-operational-grid small { color: #8296ae; line-height: 1.35; overflow-wrap: anywhere; }
.host-monitoring-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.host-metric-chart { display: grid; min-width: 0; gap: .55rem; padding: .85rem; border: 1px solid #344b68; border-radius: 13px; background: #0a1422; }
.host-metric-chart-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.host-metric-chart h3 { margin: 0; font-size: 1rem; }
.host-metric-chart-legend { display: flex; gap: .7rem; flex-wrap: wrap; color: #aebfd4; font-size: .72rem; }
.host-metric-chart-legend span::before { display: inline-block; width: .55rem; height: .55rem; margin-inline-end: .3rem; border-radius: 50%; background: var(--series-color); content: ""; }
.host-metric-chart svg { display: block; width: 100%; min-height: 175px; border-radius: 9px; background: linear-gradient(180deg, #101f32, #08111e); }
.host-chart-grid { stroke: #30445f; stroke-width: 1; stroke-dasharray: 3 4; }
.host-chart-axis { stroke: #7187a2; stroke-width: 1.3; }
.host-chart-axis-label { fill: #b8c7d9; font-size: 12px; font-variant-numeric: tabular-nums; }
.host-chart-latest-point { stroke: #08111e; stroke-width: 2; vector-effect: non-scaling-stroke; }
.host-metric-chart-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem .8rem; color: #b8c7d9; font-size: .72rem; font-variant-numeric: tabular-nums; }
.host-metric-chart-values span { min-width: 0; overflow-wrap: anywhere; }
.host-metric-chart-values span::before { display: inline-block; width: .55rem; height: .18rem; margin: 0 .35rem .15rem 0; border-radius: 4px; background: var(--series-color); content: ""; }
.host-metric-chart-scale { display: flex; justify-content: space-between; gap: .5rem; color: #8396ae; font-size: .68rem; }
.host-metric-chart-scale span:nth-child(2) { color: #b8c7d9; text-align: center; }
@media (max-width: 1050px) {
  .host-monitoring-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .host-operational-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .host-monitoring-charts { grid-template-columns: 1fr; }
  .host-monitoring-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .host-service-list { grid-template-columns: 1fr; }
  .host-operational-grid { grid-template-columns: 1fr; }
  .host-metric-chart-values { grid-template-columns: 1fr; }
}
@media (min-width: 641px) {
  .tabs { overflow: visible; }
}
.passkey-details { display: grid; min-width: 0; gap: .2rem; }
.passkey-details strong, .passkey-details small { overflow-wrap: anywhere; }
.passkey-details small { color: #9aabc0; }
.passkey-actions { flex: 0 0 auto; }
.passkey-rename-form { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) auto auto; gap: .55rem; }
.passkey-rename-form input { min-width: 0; }
.auth-divider { display: flex; align-items: center; gap: .6rem; color: #8596ac; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; flex: 1; background: #30435c; }
.login-auth-divider { margin: 1.8rem 0; gap: .85rem; }
.login-auth-divider span {
  display: grid;
  place-items: center;
  min-width: 44px;
  min-height: 32px;
  padding: .3rem .7rem;
  color: #b9c7d9;
  background: #18263a;
  border: 1px solid #344864;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
}
.secondary-link { display: inline-block; margin: .35rem 0 1rem; color: #7fdccb; }
.auth-dialog { max-width: min(560px, calc(100vw - 2rem)); color: #e6edf6; border: 1px solid #46617e; border-radius: 16px; background: #111c2c; }
.auth-dialog::backdrop { background: #040811cc; backdrop-filter: blur(4px); }
.auth-dialog pre { max-height: 45vh; overflow: auto; padding: 1rem; color: #d7ffe8; background: #070d16; border-radius: 10px; user-select: all; }
.welcome-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.4rem;
  padding: clamp(1.15rem, 2.2vw, 1.65rem);
  margin: 1rem 0 1.35rem;
  border: 1px solid #47617a;
  border-radius: 24px;
  background: linear-gradient(115deg, #1c3150 0%, #182c42 52%, #15372f 100%);
  box-shadow: inset 0 1px #ffffff18, 0 22px 45px #03080f36;
}
.welcome-panel h2 { max-width: 680px; margin: .2rem 0 .45rem; font-size: clamp(1.5rem, 2.4vw, 2.2rem); line-height: 1.12; }
.welcome-panel p:not(.eyebrow) { max-width: 640px; margin: 0; color: #b9cadd; }
.workspace-stats { display: flex; align-items: stretch; gap: .55rem; flex: 0 0 auto; }
.workspace-stats > div { min-width: 104px; padding: .7rem .9rem; border: 1px solid #bddbdf2b; border-radius: 14px; background: #08162250; }
.workspace-stats strong { display: block; color: #fff; font-size: 1.35rem; line-height: 1.1; }
.workspace-stats span { display: block; margin-top: .35rem; color: #b3c5d4; font-size: .78rem; }
.session-list-heading { margin: 0 0 .9rem; }
.session-list-heading h2 { margin: 0; font-size: 1.55rem; }
.session-list-heading .eyebrow { margin-bottom: .2rem; }
.session-filters { display: flex; align-items: end; flex-wrap: wrap; gap: .7rem; margin: 0 0 1.1rem; }
.session-search { flex: 1 1 310px; max-width: 440px; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.session-search input { margin-top: .1rem; text-transform: none; letter-spacing: normal; font-size: .9rem; font-weight: 450; }
.session-filter-select { min-width: 170px; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.session-filter-select select { min-height: 43px; margin-top: .1rem; padding-block: .55rem; text-transform: none; letter-spacing: normal; font-size: .84rem; font-weight: 650; }
.refresh-button { min-height: 43px; padding: .62rem .8rem; border: 1px solid #354b65; color: #bdcce0; background: #1a293c; font-size: .84rem; }
.session-grid { grid-template-columns: repeat(auto-fill, minmax(min(620px, 100%), 1fr)); align-items: start; gap: 1rem; }
.session-card {
  display: grid;
  align-content: start;
  align-self: start;
  gap: .35rem;
  min-height: 164px;
  padding: 1rem 1.1rem;
  color: inherit;
  text-align: left;
  cursor: pointer;
  border: 1px solid #39516b;
  border-radius: 18px;
  background: linear-gradient(145deg, #1b2a3e, #131e2e);
  box-shadow: 0 10px 25px #02081222;
}
.session-card:hover, .session-card.selected { border-color: #78d9c5; background: linear-gradient(145deg, #223b49, #17283a); box-shadow: 0 16px 32px #02081240; }
.session-card strong { font-size: 1.12rem; line-height: 1.3; }
.session-card .session-selector { margin-top: 0; color: #a4b6cd; font: .8rem/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; }
.session-card .session-terminal-thumbnail { position: relative; display: grid; place-items: center; width: 100%; min-height: 9rem; max-height: 19rem; aspect-ratio: 9 / 4; margin: .45rem 0 .2rem; overflow: hidden; color: #a9d6c8; border: 1px solid #2d4d56; border-radius: 11px; background: #05080d; contain: layout paint; font: .72rem/1.28 ui-monospace, SFMono-Regular, Menlo, monospace; text-align: center; }
.session-terminal-thumbnail-stage { position: absolute; top: 0; left: 0; display: block; overflow: hidden; pointer-events: none; transform-origin: top left; text-align: left; }
.session-terminal-thumbnail-stage .xterm { width: 100%; height: 100%; padding: 0; pointer-events: none; }
.session-terminal-thumbnail-stage .xterm-viewport { overflow: hidden !important; }
.session-terminal-thumbnail.stopped { cursor: default; }
.session-thumbnail-start { display: grid; place-items: center; width: 3.4rem; min-width: 3.4rem; height: 3.4rem; padding: 0; border: 1px solid #5dd9bd; border-radius: 50%; color: #071511; background: #70e0c5; box-shadow: 0 0 0 8px #70e0c51c, 0 10px 28px #0008; }
.session-thumbnail-start svg { width: 1.5rem; height: 1.5rem; }
.session-thumbnail-start:hover, .session-thumbnail-start:focus-visible { background: #8ce9d2; transform: translateY(-1px); }
.session-card-top, .session-card-foot { display: flex !important; align-items: center; justify-content: space-between; gap: .6rem; margin: 0 !important; }
.session-card-states { display: flex !important; align-items: flex-end; flex-direction: column; gap: .3rem; margin: 0 !important; }
.session-card-foot { align-self: end; padding-top: .65rem; border-top: 1px solid #46576c88; font-size: .78rem; }
.session-card-foot .session-uptime { color: #b7c5d8; font-variant-numeric: tabular-nums; }
.session-card-foot span:last-child { color: var(--mint); }
.session-card-controls { display: flex !important; align-items: center; justify-content: flex-end; gap: .45rem; margin: .25rem 0 0 !important; padding-top: .65rem; border-top: 1px solid #46576c88; }
.session-card-controls .session-card-action { width: 38px; min-width: 38px; height: 38px; margin: 0; padding: 0; }
.session-card-controls .session-card-action svg { width: 1.05rem; height: 1.05rem; }
.session-layout-switch { display: inline-flex; align-self: end; gap: .2rem; margin-left: auto; padding: .2rem; border: 1px solid #354b65; border-radius: 11px; background: #101a29; }
.session-layout-switch button { display: grid; place-items: center; width: 36px; min-width: 36px; height: 34px; min-height: 34px; padding: 0; border-radius: 8px; }
.session-layout-switch svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.session-layout-switch circle { fill: currentColor; stroke: none; }
.session-layout-switch button.active { color: #07130f; background: var(--mint); }
.session-grid.list-layout { grid-template-columns: 1fr; gap: .55rem; }
.session-grid.list-layout .session-card {
  grid-template-columns: 34px minmax(150px, 1.35fr) auto minmax(150px, 1fr) minmax(150px, 1fr) auto;
  grid-template-areas: "provider title state storage memory controls" "provider selector profiles storage memory controls";
  align-items: center;
  min-height: 0;
  gap: .15rem .9rem;
  padding: .72rem .85rem;
}
.session-grid.list-layout .session-card-top,
.session-grid.list-layout .session-provider-profiles { display: contents !important; }
.session-grid.list-layout .provider-mark { grid-area: provider; align-self: center; }
.session-grid.list-layout .session-card-states { grid-area: state; align-items: flex-start; align-self: center; }
.session-grid.list-layout .session-profile-summary { grid-area: profiles; align-self: start; }
.session-grid.list-layout .session-card > strong { grid-area: title; align-self: end; }
.session-grid.list-layout .session-selector { grid-area: selector; align-self: start; }
.session-grid.list-layout .project-storage { grid-area: storage; }
.session-grid.list-layout .memory-storage { grid-area: memory; }
.session-grid.list-layout .session-card-foot { display: none !important; }
.session-grid.list-layout .session-card-controls { grid-area: controls; align-self: stretch; padding: 0 0 0 .8rem; border-top: 0; border-left: 1px solid #46576c88; }
.session-grid.list-layout .session-storage { align-self: center; margin-top: 0 !important; }
.host-capacity-card { --capacity-color: #5bd9b7; overflow: hidden; }
.host-capacity-card[data-state="yellow"] { --capacity-color: #e2cc5f; }
.host-capacity-card[data-state="orange"] { --capacity-color: #e79c4d; }
.host-capacity-card[data-state="red"] { --capacity-color: #e16d7d; }
.capacity-state { padding: .3rem .65rem; color: var(--capacity-color); border: 1px solid var(--capacity-color); border-radius: 999px; font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.host-capacity-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .65rem; margin: 1rem 0; }
.host-capacity-metrics > div { min-width: 0; padding: .85rem; border: 1px solid #334a64; border-radius: 13px; background: #0c1624; }
.host-capacity-metrics strong, .host-capacity-metrics span { display: block; }
.host-capacity-metrics strong { color: #f0fff9; font-size: clamp(1.05rem, 2vw, 1.45rem); overflow-wrap: anywhere; }
.host-capacity-metrics span { margin-top: .25rem; color: #9fb0c5; font-size: .72rem; }
.capacity-limit-heading label { color: #dce7f7; font-weight: 750; }
.capacity-limit-status { min-height: 1.15em; margin: .55rem 0 0; }
.capacity-limit-status.warning { color: #efb65f; }
.host-pressure-heading { display: flex; justify-content: space-between; margin: 1rem 0 .4rem; color: #bdcbe0; font-size: .82rem; }
.host-pressure-heading strong { color: var(--capacity-color); }
.host-pressure-heading small { margin-left: .55rem; color: #aebbd0; font-size: .7rem; font-weight: 600; }
.host-pressure-heading small i { display: inline-block; width: 4px; height: .85rem; margin-right: .25rem; vertical-align: -.15rem; border-radius: 3px; background: #b47cff; box-shadow: 0 0 7px #b47cff; }
.host-pressure-heading small b { display: inline-block; width: 3px; height: .85rem; margin: 0 .25rem 0 .4rem; vertical-align: -.15rem; border-radius: 3px; background: #b47cff; box-shadow: 0 0 7px #b47cff; }
.host-capacity-scale { position: relative; height: 17px; overflow: visible; border: 1px solid #425872; border-radius: 999px; background: linear-gradient(#07101b, #111d2d); box-shadow: inset 0 2px 5px #0009; }
.host-capacity-scale span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(180deg, #82d9f0, #2b8fae 58%, #176077); box-shadow: inset 0 1px #fff8, 0 0 10px #52b9d766; transition: width .35s ease; }
.host-capacity-scale > b { position: absolute; z-index: 2; top: -5px; bottom: -5px; transform: translateX(-50%); border-radius: 4px; transition: left .35s ease; }
.host-capacity-scale > b { width: 3px; border: 1px solid #e0c9ff; background: #b47cff; box-shadow: 0 0 8px #b47cff; }
.host-capacity-limit-slider { position: absolute; z-index: 3; inset: -8px 0; width: 100%; height: 31px; min-height: 0; margin: 0; padding: 0; appearance: none; -webkit-appearance: none; border: 0; border-radius: 0; background: transparent; box-shadow: none; cursor: ew-resize; }
.host-capacity-limit-slider::-webkit-slider-runnable-track { height: 17px; background: transparent; }
.host-capacity-limit-slider::-webkit-slider-thumb { width: 7px; height: 25px; margin-top: -4px; appearance: none; -webkit-appearance: none; border: 1px solid #ffc0c8; border-radius: 4px; background: #e44f63; box-shadow: 0 0 8px #e44f63aa; }
.host-capacity-limit-slider::-moz-range-track { height: 17px; border: 0; background: transparent; }
.host-capacity-limit-slider::-moz-range-thumb { width: 5px; height: 23px; border: 1px solid #ffc0c8; border-radius: 4px; background: #e44f63; box-shadow: 0 0 8px #e44f63aa; }
.host-capacity-scale:focus-within { outline: 2px solid #8ddcf2; outline-offset: 4px; }
.host-pressure-bar { position: relative; height: 17px; overflow: visible; border: 1px solid #425872; border-radius: 999px; background: linear-gradient(#07101b, #111d2d); box-shadow: inset 0 2px 5px #0009; }
.host-pressure-bar span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(180deg, color-mix(in srgb, var(--capacity-color), white 28%), var(--capacity-color) 58%, color-mix(in srgb, var(--capacity-color), black 28%)); box-shadow: inset 0 1px #fff8, 0 0 12px color-mix(in srgb, var(--capacity-color), transparent 50%); transition: width .35s ease; }
.capacity-observed { margin: .65rem 0 0; color: #9fb0c5; font-size: .78rem; }
.capacity-session-heading { margin-top: 1.3rem; padding-top: 1.1rem; border-top: 1px solid #344860; }
.capacity-session-heading h3, .capacity-session-heading p { margin: 0; }
.capacity-session-heading p { margin-top: .25rem; color: #9fb0c5; }
.capacity-session-list { display: grid; gap: .5rem; margin-top: .8rem; }
.capacity-session-row { display: grid; grid-template-columns: minmax(180px, 1.4fr) repeat(7, minmax(82px, 1fr)); align-items: center; gap: .65rem; padding: .75rem; border: 1px solid #334a64; border-radius: 12px; background: #0c1624; }
.capacity-session-row > div { min-width: 0; }
.capacity-session-row strong, .capacity-session-row small { display: block; overflow-wrap: anywhere; }
.capacity-session-row strong { color: #eef8ff; font-size: .82rem; }
.capacity-session-row small { margin-top: .16rem; color: #93a6bd; font-size: .68rem; }
.provider-mark { display: grid !important; place-items: center; box-sizing: border-box; flex: 0 0 34px; width: 34px; min-width: 34px; max-width: 34px; height: 34px; min-height: 34px; max-height: 34px; margin: 0 !important; border: 1px solid #52647c; border-radius: 10px; color: #eef7ff !important; background: #101a28; }
.provider-mark img { display: block; width: 22px; height: 22px; margin: 0; object-fit: contain; }
.session-provider-profiles { display: flex !important; align-items: center; min-width: 0; gap: .55rem; }
.session-profile-summary { display: flex !important; align-items: center; min-width: 0; gap: .35rem; flex-wrap: wrap; }
.session-profile-control { display: inline-flex; align-items: stretch; max-width: 100%; min-height: 25px; padding: 0; overflow: hidden; border: 1px solid #4f647d; border-radius: 999px; background: #111e30; color: #cbd8ea; font-size: .66rem; font-weight: 750; letter-spacing: .01em; line-height: 1; }
.session-profile-control:hover, .session-profile-control:focus-visible { border-color: #6ee7c7; background: #172d38; color: #e8fffa; }
.session-profile-value { display: inline-flex !important; align-items: center; min-width: 0; margin: 0 !important; padding: .32rem .48rem; color: inherit !important; white-space: nowrap; }
.session-profile-value + .session-profile-value { border-left: 1px solid #40536c; }
.session-profile-runtime { color: #eadcff !important; background: #2a2040; }
.session-profile-resource { background: #142b3b; }
.session-profile-cache { background: #222b1b; }
.session-profile-pending { display: inline-flex; align-items: center; min-height: 22px; padding: .15rem .42rem; border: 1px solid #b98b31; border-radius: 999px; background: #3d2d11; color: #ffe09a; font-size: .65rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.session-profile-request-dialog { width: min(920px, calc(100vw - 2rem)); }
.session-profile-request-dialog > form { display: grid; gap: 1rem; }
.session-profile-choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.session-profile-choice-grid label { display: grid; gap: .4rem; min-width: 0; }
.session-profile-choice-grid small { color: #9eacc2; font-size: .76rem; line-height: 1.35; }
.profile-request-row { align-items: center; }
.profile-request-row small { display: block; margin-top: .3rem; color: #91a1b8; }
.session-card[data-provider="claude"] .provider-mark { border-color: #8b5a45; background: #251b19; }
.session-card[data-provider="codex"] .provider-mark { border-color: #52647c; background: #eef3f7; color: #111820 !important; }
.session-card[data-provider="gemini"] .provider-mark { border-color: #74639b; background: #201c32; }
.session-card[data-provider="opencode"] .provider-mark { border-color: #6c7888; background: #f1f5f8; color: #101820 !important; }
.session-card .state { align-items: center; box-sizing: border-box; flex: 0 0 24px; height: 24px; min-height: 24px; max-height: 24px; margin: 0; color: #cdd9e9 !important; border: 1px solid #56667d; background: #28394c; line-height: 1; }
.session-card[data-state="running"] .state { color: #a5f4d4 !important; border-color: #32755d; background: #173e35; }
.session-card[data-state="starting"] .state,
.session-card[data-state="restarting"] .state,
.session-card[data-state="stopping"] .state { color: #ffe2a1 !important; border-color: #94723d; background: #3b301d; }
.session-card[data-state="recovery_required"] .state { color: #ffe2a1 !important; border-color: #94723d; background: #3b301d; }
.session-card .state.login-required { color: #ffdce2 !important; border-color: #d4586d; background: #4b1822; }
.runtime-update-tag.response-needed { color: #fff0b5; border-color: #c8952e; background: #3b2b10; }
.runtime-update-tag.login-required { color: #ffdce2 !important; border-color: #d4586d !important; background: #4b1822 !important; }
.runtime-update-tag {
  display: inline-flex !important;
  align-items: center;
  box-sizing: border-box;
  flex: 0 0 24px;
  height: 24px;
  min-height: 24px;
  max-height: 24px;
  width: fit-content;
  margin: 0 !important;
  padding: .2rem .55rem;
  border: 1px solid #b27b2d !important;
  border-radius: 999px !important;
  color: #ffdc9a !important;
  background: #423018 !important;
  font-size: .75rem !important;
  line-height: 1;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.runtime-update-tag.updating { border-color: #c5a126 !important; background: #403817 !important; color: #fff0a3 !important; }
.runtime-update-tag.restart_required { border-color: #c57b28 !important; background: #4a3017 !important; color: #ffd09a !important; }
.runtime-update-tag.repair_required { border-color: #d4586d !important; background: #4b1822 !important; color: #ffdce2 !important; }
.runtime-update-tag.current,
.runtime-update-tag.ready { border-color: #32755d !important; background: #173e35 !important; color: #a5f4d4 !important; }
.runtime-update-tag.unavailable { border-color: #94723d !important; background: #3b301d !important; color: #ffe2a1 !important; }
.provider-upgrade-launcher { display: grid; gap: .8rem; }
.upgrade-default-summary { margin: 0; color: #b8c7da; }
.provider-advanced-upgrade { border-top: 1px solid #344864; padding-top: .75rem; }
.provider-advanced-upgrade summary { color: #cfe0f4; font-weight: 800; cursor: pointer; }
.provider-advanced-upgrade form { display: grid; gap: .85rem; padding-top: .85rem; }
.session-empty { grid-column: 1 / -1; padding: 2rem; border: 1px dashed #526782; border-radius: 18px; text-align: center; color: var(--muted); background: #14223799; }
.session-empty strong { display: block; margin-bottom: .45rem; color: #eef6ff; font-size: 1.1rem; }
.session-empty p { margin: 0; }
#new-session-form { margin: 1rem 0; }
#sessions-view.workspace-open .welcome-panel,
#sessions-view.workspace-open .session-list-heading,
#sessions-view.workspace-open .session-filters,
#sessions-view.workspace-open .session-grid,
#sessions-view.workspace-open #new-session-form { display: none !important; }
#session-detail { margin-top: 2rem; scroll-margin-top: 10rem; }
#sessions-view.workspace-open #session-detail { margin-top: 1.2rem; }
.workspace-heading { margin: .5rem 0 .7rem; }
.workspace-heading h2 { margin: .2rem 0; font-size: clamp(1.55rem, 2.6vw, 2.25rem); overflow-wrap: anywhere; }
.workspace-heading .eyebrow { overflow-wrap: anywhere; }
.workspace-heading .actions { justify-content: flex-end; }
.session-action { display: inline-flex; align-items: center; justify-content: center; gap: .42rem; }
.session-action svg { width: 1.05rem; height: 1.05rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.session-action-edit { color: #f4f7ff; border-color: #f4f7ff; }
.session-action-start { color: #69e6b8; background: #173b33; box-shadow: inset 0 0 0 1px #3d806d; }
.session-action-stop { color: #83bfff; background: #172f4a; box-shadow: inset 0 0 0 1px #365f8c; }
.session-action-restart { color: #ffd166; background: #3a321c; box-shadow: inset 0 0 0 1px #7a672c; }
.session-action-switch { color: #ff9f5b; background: #402a1c; box-shadow: inset 0 0 0 1px #87522c; }
.session-actions { align-items: center; }
.icon-action { width: 42px; min-width: 42px; height: 42px; padding: 0; }
.icon-action > span { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.icon-action svg { width: 1.15rem; height: 1.15rem; }
.compact-action { display: inline-flex; align-items: center; justify-content: center; width: 42px; min-width: 42px; height: 42px; padding: 0; }
.compact-action svg { width: 1.3rem; height: 1.3rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.compact-action.action-download svg { width: 1.5rem; height: 1.5rem; stroke-width: 2.35; }
.agent-history { display: grid; gap: .25rem; padding: .5rem .75rem; border-left: 2px solid var(--border); }
.agent-history small { display: block; }
.session-fullscreen-toggle { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; }
.session-fullscreen-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.meta { gap: .45rem; margin: .4rem 0 1rem; }
.meta span { border: 1px solid #3e5268; background: #1b2c3d; color: #d6e4f3; font-size: .78rem; }
.session-tabs {
  display: flex;
  gap: .25rem;
  margin: 0 0 1rem;
  padding: .35rem;
  overflow-x: auto;
  border: 1px solid #344a60;
  border-radius: 14px;
  background: #172536;
  scrollbar-width: none;
}
.session-tab { flex: 1 0 auto; min-height: 44px; padding: .7rem .95rem; border-radius: 10px; color: #aebfd4; background: transparent; white-space: nowrap; }
.session-tab.active, .session-tab.active:hover { color: #08151b; background: var(--mint); }
.session-tab:hover { background: #293c51; color: #fff; }
.panel-stack { display: grid; gap: 1rem; }
.panel-stack .session-agents { margin: 0; }
.console-panel { min-width: 0; padding: 1rem; border: 1px solid #3d526b; border-radius: 20px; background: #121b2b; box-shadow: 0 18px 40px #0208122e; }
.panel-intro { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin: .1rem .25rem .8rem; }
.panel-intro h3 { margin: 0; font-size: 1.2rem; }
.panel-intro .eyebrow { margin-bottom: .18rem; }
.panel-intro > p { max-width: 420px; margin: 0; color: var(--muted); font-size: .8rem; text-align: right; }
#terminal-output { height: min(66vh, 760px); min-height: 340px; border-color: #49637d; border-radius: 13px; box-shadow: inset 0 0 0 1px #0006; }
.terminal-shell { position: relative; overflow: hidden; border-radius: 13px; }
.session-stopped-overlay { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; padding: 1rem; background: #05080d; }
.session-stopped-overlay #start-session-overlay { width: 48px; min-width: 48px; height: 48px; }
.session-stopped-overlay #start-session-overlay svg { width: 1.35rem; height: 1.35rem; }
.session-overlay-spinner { width: 32px; height: 32px; border: 3px solid #30445c; border-top-color: var(--mint); border-radius: 50%; animation: session-overlay-spin .8s linear infinite; }
@keyframes session-overlay-spin { to { transform: rotate(360deg); } }
#session-detail:not([data-state="running"]) #terminal-output { height: min(40vh, 400px); min-height: 240px; }
#session-detail:not([data-state="running"]) .composer { display: none; }
#session-detail[data-lifecycle="busy"] #terminal-output { height: min(66vh, 760px); min-height: 340px; }
#session-detail[data-lifecycle="busy"] .composer { display: none; }
.terminal-status { margin-left: .25rem; }
.terminal-controls { border-color: #3c526d; background: #1a2a3d; }
.terminal-control-heading { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem 1rem; }
#keyboard-control.keyboard-toggle { flex: 0 0 11rem; width: 11rem; min-height: 44px; color: #2b220b; background: #f5d990; box-shadow: 0 3px 12px #f5d99024; }
#keyboard-control.keyboard-toggle:hover:not(:disabled) { background: #ffe5a5; }
#keyboard-control.keyboard-toggle[aria-pressed="true"] { color: #fff; background: #c94f64; box-shadow: 0 3px 12px #c94f642e; }
#keyboard-control.keyboard-toggle[aria-pressed="true"]:hover:not(:disabled) { background: #db5a70; }
.terminal-keyboard { display: none; grid-template-columns: max-content max-content max-content minmax(12rem, 1fr); justify-content: start; align-items: end; gap: .75rem 1rem; padding-top: .35rem; border-top: 1px solid #3c526d; }
.terminal-controls.keyboard-active .terminal-keyboard { display: grid; }
.terminal-key-group { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; }
.terminal-keyboard button { min-width: 44px; min-height: 44px; padding: .55rem .7rem; }
.terminal-key.caution { color: #2b220b; background: #f5d990; }
.terminal-key.caution:hover:not(:disabled) { background: #ffe5a5; }
.action-keys { justify-self: start; flex-wrap: nowrap; }
.arrow-pad { display: grid; grid-template-columns: repeat(3, 44px); grid-template-rows: repeat(2, 44px); gap: .32rem; }
.arrow-pad button { min-width: 44px; width: 44px; padding: .35rem; font-size: 1.15rem; }
.arrow-up { grid-column: 2; grid-row: 1; }
.arrow-left { grid-column: 1; grid-row: 2; }
.arrow-down { grid-column: 2; grid-row: 2; }
.arrow-right { grid-column: 3; grid-row: 2; }
.terminal-more { align-self: end; min-width: 12rem; }
.terminal-more summary { min-height: 44px; display: grid; place-items: center; padding: .55rem .8rem; color: #dce9f8; font-weight: 750; cursor: pointer; border: 1px solid #49617b; border-radius: 10px; background: #20344e; list-style: none; }
.terminal-more summary::-webkit-details-marker { display: none; }
.terminal-more summary::before { content: "⌨"; margin-right: .4rem; }
.terminal-more[open] { grid-column: 1 / -1; }
.terminal-key-palette { display: grid; grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)); gap: .4rem; margin-top: .5rem; padding: .55rem; border: 1px solid #344e69; border-radius: 12px; background: #102036; }
.terminal-key-palette .terminal-key { display: grid; place-items: center; gap: .05rem; }
.terminal-key-palette small { color: #a9bdd5; font-size: .7rem; font-weight: 600; }
.composer { margin-top: .75rem; }
.composer textarea { min-height: 70px; }
.composer button { min-width: 100px; }
#record-speech[aria-pressed="true"] { color: #fff; background: #c94f64; }
.session-files, .session-changes, .session-jobs, .sharing { margin-top: 0; }
.project-snapshots { margin: .8rem 0 1rem; padding: .8rem; border: 1px solid #3b5069; border-radius: 12px; background: #101b2b; }
.snapshot-create-controls { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.snapshot-row { align-items: flex-start; flex-wrap: wrap; }
.snapshot-row .actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.session-files .toolbar, .session-changes .toolbar, .session-jobs .toolbar { margin-top: 0; }
.access-row, .agent-row, .job-row, .file-row { border-color: #3b5069; background: #142235; border-radius: 12px; }
.docs-list button { border-color: #39516b; border-radius: 10px; background: #172538; }
.docs-list button.active { color: #08151b; background: var(--mint); }
.docs-content { background: #152134; }
.notice-stack { position: fixed; inset: max(.65rem, env(safe-area-inset-top)) max(.65rem, env(safe-area-inset-right)) auto max(.65rem, env(safe-area-inset-left)); z-index: 2100; display: grid; gap: .42rem; pointer-events: none; }
.notice-bar { width: 100%; min-height: 44px; padding: .72rem 1rem; color: #fff1f4; text-align: center; border: 1px solid #dc7185; border-radius: 10px; background: #a64558e8; box-shadow: 0 10px 26px #0007; backdrop-filter: blur(12px); overflow-wrap: anywhere; pointer-events: auto; }
.notice-bar[data-tone="info"] { color: #eff8ff; border-color: #80bde9; background: #3d8fc9e8; }
.notice-bar[data-tone="success"] { color: #ecfff8; border-color: #6edbb8; background: #27866de8; }
.notice-bar[data-tone="warning"] { color: #fff8e5; border-color: #e4b76b; background: #a6782be8; }

.web-update-banner {
  position: fixed;
  inset: max(.65rem, env(safe-area-inset-top)) max(.65rem, env(safe-area-inset-right)) auto max(.65rem, env(safe-area-inset-left));
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  width: auto;
  margin-inline: 0;
  padding: .8rem 1rem;
  color: #f4fbff;
  border: 1px solid #8dcbf2;
  border-radius: 10px;
  background: #4d9ed4e8;
  box-shadow: 0 18px 45px #000b;
  backdrop-filter: blur(14px);
}
.web-update-banner > div { display: grid; gap: .15rem; }
.web-update-banner strong { color: #fff; }
.web-update-banner span { color: #e5f5ff; }
.web-update-banner button { flex: 0 0 auto; color: #10324a; background: #d9f1ff; }
.web-update-banner button:hover { background: #effaff; }

@media (max-width: 640px) {
  .session-profile-choice-grid { grid-template-columns: 1fr; }
  .session-profile-request-dialog { width: calc(100vw - .5rem); padding: .8rem; }
  .session-profile-summary { gap: .25rem; }
  .session-profile-control { font-size: .6rem; }
  .session-profile-value { padding: .29rem .38rem; }
  .web-update-banner { align-items: stretch; flex-direction: column; gap: .65rem; font-size: .86rem; }
  .web-update-banner button { width: 100%; }
}

body.session-full-page { overflow: hidden; }
body.session-full-page #session-detail {
  position: fixed;
  inset: 0;
  z-index: 1000;
  width: 100%;
  height: var(--mobile-viewport-height, 100dvh);
  margin: 0 !important;
  padding: max(.75rem, env(safe-area-inset-top)) max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left));
  display: flex;
  min-height: 0;
  flex-direction: column;
  overflow: hidden;
  overscroll-behavior: contain;
  background: #090f1b;
}
body.session-full-page .workspace-heading {
  position: sticky;
  top: -.75rem;
  z-index: 8;
  margin: 0 0 .65rem;
  padding: .7rem 0;
  background: #090f1bf2;
  backdrop-filter: blur(12px);
}
body.session-full-page .console-panel { display: flex; min-height: 0; flex: 1 1 auto; flex-direction: column; }
body.session-full-page .terminal-shell { min-height: 0; flex: 1 1 auto; }
body.session-full-page #terminal-output,
body.session-full-page #session-detail:not([data-state="running"]) #terminal-output {
  height: 100%;
  min-height: 0;
}
body.session-full-page .composer { flex: 0 0 auto; }
#session-detail:fullscreen { overflow: hidden; background: #090f1b; }
.console-fullscreen-toggle { margin-left: auto; }
.primary-menu-toggle { display: none; width: 38px; height: 38px; padding: .48rem; color: #dbe7f6; background: #203149; }
.primary-menu-toggle svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }

@media (max-width: 640px) {
  .provider-release-heading { display: grid; }
  .provider-release-grid, .provider-release-versions { grid-template-columns: 1fr; }
  .client-release-versions, .client-choice-grid { grid-template-columns: 1fr; }
  .client-segmented { flex-wrap: wrap; }
  .client-segmented button { flex: 1 1 8rem; }
  .client-selected-package { align-items: stretch; flex-direction: column; }
  .client-selected-package > a { width: 100%; }
  .client-step-title { grid-template-columns: auto minmax(0, 1fr); }
  .client-step-title button { grid-column: 1 / -1; width: 100%; }
  .client-platform-security { padding-left: .9rem; }
  .client-selected-raw { align-items: stretch; flex-direction: column; }
  .user-activity-row { align-items: stretch; }
  .user-row-actions { width: 100%; }
  .user-row-actions input { flex: 1 1 8rem; }
  .user-directory-row { grid-template-columns: 1fr; gap: .35rem; }
  .user-directory-package { justify-self: start; }
  .user-settings-grid { grid-template-columns: 1fr; }
  .user-account-controls { grid-column: auto; grid-template-columns: 1fr; align-items: stretch; }
  .user-account-controls .actions { justify-content: stretch; }
  .user-account-controls .actions button { flex: 1 1 100%; }
  header { position: static; }
  main { width: min(100% - 1rem, 1180px); margin-top: .75rem; }
  .toolbar { align-items: flex-start; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .wide { grid-column: auto; }
  .composer { grid-template-columns: 1fr; }
  .snapshot-create-controls { grid-template-columns: 1fr; }
  .composer-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .composer-actions button { width: 100%; min-height: 44px; }
  .file-controls { grid-template-columns: 1fr; }
  .file-controls .wide { grid-column: auto; }
  .workspace-browser-row { grid-template-columns: 1fr; }
  .workspace-browser-row .actions { padding-left: 1.85rem; }
  .job-run { align-items: flex-start; flex-direction: column; }
  #terminal-output { height: 56vh; min-height: 280px; padding: .35rem; }
  .docs-layout { grid-template-columns: 1fr; }
  .docs-list { position: static; display: flex; max-height: none; overflow-x: auto; }
  .docs-list button { min-width: 180px; }
  .cache-maintenance-grid { grid-template-columns: 1fr; }
  .cache-maintenance-card, .audit-recheck-control { align-items: stretch; flex-direction: column; }
  .cache-maintenance-card button, .audit-recheck-control button { width: 100%; min-height: 44px; }
  .runtime-profile-dialog { width: calc(100vw - .5rem); max-height: calc(100dvh - .5rem); padding: .7rem; }
  .runtime-profile-dialog .toolbar { position: sticky; top: -.7rem; z-index: 3; padding: .55rem 0; background: #121a2bf5; }
  .runtime-profile-dialog .toolbar p { font-size: .8rem; }
  .runtime-profile-comparison { overflow: visible; border: 0; }
  .runtime-profile-comparison > table { display: none; }
  .runtime-profile-mobile-comparison { display: grid; gap: .7rem; }
  .runtime-profile-mobile-comparison > section { padding: .8rem; border: 1px solid #344864; border-radius: 12px; background: #0c1727; }
  .runtime-profile-mobile-comparison h3 { margin: 0 0 .65rem; color: #72e5c8; }
  .runtime-profile-mobile-comparison dl { display: grid; gap: 0; margin: 0; }
  .runtime-profile-mobile-comparison dl > div { display: grid; grid-template-columns: minmax(7rem, 42%) minmax(0, 1fr); gap: .65rem; padding: .5rem 0; border-top: 1px solid #2f425b; }
  .runtime-profile-mobile-comparison dt { color: #aebdd0; font-size: .78rem; font-weight: 750; }
  .runtime-profile-mobile-comparison dd { margin: 0; color: #eef5ff; font-size: .82rem; overflow-wrap: anywhere; }
}

@media (max-width: 980px) {
  .tabs { top: 0; }
  .workspace-heading { align-items: flex-start; flex-wrap: wrap; }
  .workspace-heading .actions { justify-content: flex-start; }
  .welcome-panel { align-items: flex-start; }
}

@media (max-width: 640px), (hover: none) and (pointer: coarse) {
  #client-tab { display: none; }
}

@media (max-width: 640px) {
  body { overflow-x: clip; }
  header.app-header { position: relative; z-index: 100; min-height: 54px; padding: .42rem max(.55rem, env(safe-area-inset-right)) .42rem max(.55rem, env(safe-area-inset-left)); overflow: visible; flex-wrap: nowrap; gap: .35rem; }
  .header-status { position: relative; width: auto; margin-left: auto; justify-content: flex-end; gap: .22rem; min-width: 0; }
  .notification-inbox-button:not(.hidden) { width: 34px; height: 34px; flex: 0 0 34px; }
  .notification-inbox-dialog { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); padding: .8rem; overflow-y: auto; }
  .notification-inbox-list { max-height: min(52dvh, 520px); }
  .notification-row { padding: .75rem; }
  .notification-row-layout { gap: .62rem; }
  .notification-actions { align-items: stretch; flex-direction: column; }
  .provider-health { position: static; gap: .3rem; }
  .provider-health-chip { min-height: 31px; padding: .28rem .42rem; font-size: .63rem; }
  .system-health-chip { width: 31px; min-width: 31px; height: 31px; padding: 0; }
  .provider-health-chip .provider-health-state { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .system-health-chip { width: auto; min-width: 34px; height: 34px; padding: 0 .55rem; gap: .35rem; }
  .system-health-label { font-size: .7rem; }
  .provider-health-details { position: fixed; inset: calc(54px + env(safe-area-inset-top) + .45rem) max(.55rem, env(safe-area-inset-right)) auto max(.55rem, env(safe-area-inset-left)); width: auto; max-height: calc(100dvh - 66px - env(safe-area-inset-top)); overflow-y: auto; }
  .brand { min-width: 0; gap: .38rem; }
  .brand-mark { width: 31px; height: 31px; border-radius: 9px; font-size: 1.25rem; }
  .brand h1 { font-size: .92rem; white-space: nowrap; }
  .brand .eyebrow { display: none; }
  .connection { min-height: 31px; padding: .28rem .42rem; font-size: .63rem; }
  .primary-menu-toggle:not(.hidden) { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; }
  main {
    width: auto;
    min-width: 0;
    margin: .55rem max(.9rem, env(safe-area-inset-right)) 1.5rem max(.9rem, env(safe-area-inset-left));
  }
  body[data-surface="login"] main {
    width: min(100% - 1.8rem, 520px);
    min-height: 100svh;
    margin: 0 auto;
    padding: max(.4rem, env(safe-area-inset-top)) 0 max(.4rem, env(safe-area-inset-bottom));
  }
  #login { padding: clamp(.85rem, 4.5vw, 1.25rem); overflow: hidden; }
  #login input { width: 100%; max-width: 100%; font-size: 16px; }
  .login-brand { margin-bottom: 1rem; }
  .login-brand-mark { width: clamp(78px, 24vw, 104px); height: clamp(78px, 24vw, 104px); margin-bottom: .65rem; border-radius: 24px; }
  .login-brand h1 { font-size: clamp(1.55rem, 9vw, 2rem); }
  .login-brand .eyebrow { font-size: .55rem; letter-spacing: .13em; }
  #login > h2 { margin-bottom: .85rem; font-size: 1.15rem; }
  #login form { gap: .75rem; }
  .login-auth-divider { margin: 1.15rem 0; }
  .otp-digit-cells { gap: clamp(.22rem, 1.8vw, .45rem); }
  .otp-digit-cells span { height: clamp(2.75rem, 14vw, 3.3rem); border-radius: 9px; }
  #application, #sessions-view, .welcome-panel, .welcome-panel > div { min-width: 0; max-width: 100%; }
  .tabs { display: none; position: fixed; top: calc(54px + env(safe-area-inset-top)); right: max(.55rem, env(safe-area-inset-right)); z-index: 105; width: min(18rem, calc(100vw - 1.1rem)); max-height: calc(100dvh - 66px); grid-template-columns: 1fr; gap: .3rem; margin: 0; padding: .55rem; overflow-y: auto; border: 1px solid #405873; border-radius: 14px; background: #101b2bea; box-shadow: 0 22px 60px #000c; backdrop-filter: blur(18px); }
  body.mobile-nav-open .tabs { display: grid; }
  .tabs .tab, .tabs .quiet { width: 100%; min-height: 40px; padding: .48rem .7rem; font-size: .78rem; text-align: left; }
  .tabs > .admin-menu-shell { width: 100%; margin-left: 0; }
  .admin-menu-toggle { width: 100%; min-height: 40px; place-items: center start; padding: .48rem .7rem; font-size: .78rem; }
  .admin-menu-panel, .admin-menu-shell:not([open]) > .admin-menu-panel { position: static; width: 100%; padding: .25rem 0 .1rem .6rem; border: 0; background: transparent; box-shadow: none; }
  .admin-menu-action { min-height: 38px; padding: .42rem .7rem; font-size: .76rem; }
  .tabs > .user-menu-shell { display: block !important; width: 100%; margin: .35rem 0 0; padding-top: .45rem; border-top: 1px solid #344a63; }
  .user-menu-shell > summary { display: none; }
  .user-menu-panel, .user-menu-shell:not([open]) > .user-menu-panel { position: static; display: grid; width: 100%; padding: 0; border: 0; background: transparent; box-shadow: none; }
  .user-menu-action { min-height: 40px; padding: .48rem .7rem; font-size: .78rem; }
  .welcome-panel { display: block; margin: 0 0 .7rem; padding: .55rem; border-radius: 13px; }
  .welcome-panel > div:first-child { display: none; }
  .workspace-stats { width: 100%; }
  .workspace-stats > div { flex: 1 1 0; min-width: 0; padding: .38rem .55rem; border-radius: 10px; }
  .workspace-stats strong { font-size: 1rem; }
  .workspace-stats span { margin-top: .08rem; font-size: .64rem; }
  .session-list-heading { align-items: center; }
  .session-list-heading h2 { font-size: 1.2rem; }
  .session-list-heading #new-session-button { min-height: 38px; padding: .45rem .6rem; font-size: .78rem; white-space: nowrap; }
  .session-filters { gap: .55rem; }
  .session-search { flex-basis: 100%; max-width: none; }
  .session-filter-select { flex: 1 1 10rem; min-width: 0; }
  .refresh-button { width: auto; min-height: 36px; padding: .4rem .6rem; }
  .session-layout-switch { flex: 0 0 auto; margin-left: auto; }
  .session-grid { grid-template-columns: 1fr; }
  .session-card { min-height: 0; padding: .72rem; border-radius: 13px; }
  .session-terminal-thumbnail { min-height: 8rem; max-height: 13rem; aspect-ratio: 9 / 4; }
  .session-card-foot { display: none !important; }
  .session-grid.list-layout .session-card { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; grid-template-areas: "provider title state" "provider selector state" "profiles profiles profiles" "storage storage storage" "memory memory memory" "controls controls controls"; gap: .2rem .55rem; }
  .session-grid.list-layout .session-card > strong,
  .session-grid.list-layout .session-selector { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .session-grid.list-layout .session-profile-summary { margin-top: .35rem !important; }
  .session-grid.list-layout .session-card-controls { justify-content: flex-end; padding: .45rem 0 0; border-left: 0; border-top: 1px solid #46576c88; }
  .host-capacity-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capacity-session-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capacity-session-row > div:first-child { grid-column: 1 / -1; }
  #session-detail { margin-top: 1.4rem; scroll-margin-top: 5rem; }
  .workspace-heading { gap: .6rem; }
  .workspace-heading .actions { display: flex; width: auto; margin-left: auto; }
  .workspace-heading .actions button { padding: 0; }
  .workspace-heading .session-action { width: 38px; min-width: 38px; height: 38px; }
  .session-tabs { margin-inline: -.1rem; }
  .session-tab { padding: .65rem .8rem; }
  .panel-intro { display: block; }
  .panel-intro > p { margin-top: .35rem; text-align: left; }
  .console-panel { padding: .6rem; border-radius: 15px; }
  #terminal-output { height: 56svh; min-height: 280px; padding: .35rem; }
  #session-detail:not([data-state="running"]) #terminal-output { height: 36svh; min-height: 220px; }
  .terminal-controls { padding: .5rem; }
  .terminal-control-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem; }
  #keyboard-control.keyboard-toggle { width: 100%; min-width: 0; flex-basis: auto; }
  .keyboard-status { grid-column: 1 / -1; grid-row: 2; }
  .console-fullscreen-toggle { grid-column: 2; grid-row: 1; margin-left: 0; min-height: 44px; padding-inline: .65rem; }
  .terminal-keyboard { grid-template-columns: minmax(0, 1fr) auto; gap: .45rem; }
  .utility-keys { grid-column: 1; grid-row: 1; }
  .arrow-pad { grid-column: 2; grid-row: 1; }
  .action-keys { grid-column: 1 / -1; grid-row: 2; justify-self: end; }
  .terminal-more { grid-column: 1 / -1; grid-row: 3; width: 100%; }
  .terminal-more[open] { grid-column: 1 / -1; }
  .terminal-key-palette { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: min(36svh, 260px); overflow-y: auto; }
  .terminal-keyboard button { padding: .5rem .55rem; }
  .composer button { width: 100%; }
  .card { padding: .8rem; border-radius: 14px; }
  .runtime-tools-heading { display: grid; gap: .2rem; }
  .runtime-tools-heading small { text-align: left; }
  .setting-row { padding: .58rem .62rem; }
  .file-row, .access-row { align-items: flex-start; }
  .passkey-row { display: grid; grid-template-columns: minmax(0, 1fr); }
  .passkey-actions { width: 100%; }
  .passkey-actions button { flex: 1 1 0; }
  .passkey-rename-form { grid-template-columns: 1fr 1fr; }
  .passkey-rename-form input { grid-column: 1 / -1; font-size: 16px; }
  .memory-guidance { align-items: stretch; flex-direction: column; }
  .memory-guidance button { width: 100%; }
  body.session-full-page #session-detail { padding: max(.2rem, env(safe-area-inset-top)) max(.2rem, env(safe-area-inset-right)) max(.2rem, env(safe-area-inset-bottom)) max(.2rem, env(safe-area-inset-left)); }
  body.session-full-page .workspace-heading,
  body.session-full-page #session-meta,
  body.session-full-page #session-operation-note,
  body.session-full-page .session-tabs,
  body.session-full-page .panel-intro,
  body.session-full-page .terminal-status { display: none; }
  body.session-full-page .console-panel { height: 100%; min-height: 0; padding: .25rem; border: 0; border-radius: 0; }
  body.session-full-page .terminal-controls { order: 2; margin: .25rem 0 0; padding: .3rem; }
  body.session-full-page .terminal-control-heading { grid-template-columns: minmax(0, 1fr) auto; }
  body.session-full-page .keyboard-status { display: none; }
  body.session-full-page .terminal-keyboard { display: none; }
  body.session-full-page .terminal-controls.keyboard-active .terminal-keyboard { display: grid; }
  body.session-full-page .terminal-shell { order: 1; flex: 1 1 0; min-height: 0; }
  body.session-full-page #terminal-output,
  body.session-full-page #session-detail:not([data-state="running"]) #terminal-output {
    height: 100%;
    min-height: 0;
    border-radius: 8px;
  }
  body.session-full-page .composer { order: 3; margin-top: .25rem; }
  body.session-full-page .composer textarea { min-height: 42px; max-height: 72px; padding: .55rem; }
  body.session-full-page .composer button { width: auto; min-width: 66px; padding: .5rem .7rem; }

  body.mobile-terminal-keyboard-open #session-detail { overflow: hidden; }
  body.mobile-terminal-keyboard-open .composer { display: none; }
  body.mobile-terminal-keyboard-open .console-panel {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    padding: .3rem;
  }
  body.mobile-terminal-keyboard-open .terminal-controls { order: 2; flex: 0 0 auto; margin: .2rem 0 0; padding: .25rem; }
  body.mobile-terminal-keyboard-open .keyboard-status { display: none; }
  body.mobile-terminal-keyboard-open .terminal-controls.keyboard-active .terminal-keyboard {
    display: flex;
    gap: .3rem;
    overflow-x: auto;
    padding-top: .3rem;
  }
  body.mobile-terminal-keyboard-open .terminal-key-group,
  body.mobile-terminal-keyboard-open .arrow-pad { display: flex; flex: 0 0 auto; gap: .25rem; }
  body.mobile-terminal-keyboard-open .terminal-more { flex: 0 0 auto; min-width: 92px; }
  body.mobile-terminal-keyboard-open .terminal-more[open] { flex-basis: 100%; }
  body.mobile-terminal-keyboard-open .terminal-more summary { min-height: 36px; padding: .35rem .45rem; }
  body.mobile-terminal-keyboard-open .terminal-key-palette { grid-template-columns: repeat(2, minmax(105px, 1fr)); max-height: 32svh; }
  body.mobile-terminal-keyboard-open .terminal-keyboard button,
  body.mobile-terminal-keyboard-open .arrow-pad button { width: auto; min-width: 36px; min-height: 36px; padding: .35rem .45rem; }
  body.mobile-terminal-keyboard-open #terminal-output { flex: 1 1 auto; height: auto; min-height: 110px; }
}

@media (max-width: 390px) {
  .brand h1 span { display: none; }
  .provider-health-chip { padding-inline: .34rem; }
  .provider-health-chip .provider-health-dot { margin-right: .12rem; }
  .system-health-chip { padding: 0; }
  .system-health-chip .provider-health-dot { margin-right: 0; }
  main { margin-inline: max(.55rem, env(safe-area-inset-left)); }
}

@media (hover: none) {
  .provider-health:not([open]) > .provider-health-details { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
  button { transition: none !important; }
}

/* File selection, project browsing, and credential enrollment */
.file-dropzone {
  position: relative;
  display: flex;
  min-height: 112px;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 1.15rem;
  color: #dce8f8;
  text-align: left;
  border: 1px dashed #537394;
  border-radius: 15px;
  background: linear-gradient(145deg, #132237, #101a2a);
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.file-dropzone:hover, .file-dropzone:focus-within, .file-dropzone.drag-active {
  border-color: var(--mint);
  background: linear-gradient(145deg, #173047, #11253a);
  box-shadow: 0 0 0 3px #71e8ca1c;
}
.file-dropzone.drag-active { transform: translateY(-1px); }
.file-drop-input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  opacity: 0;
  overflow: hidden;
  clip-path: inset(50%);
}
.file-drop-icon {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  color: #09151c;
  border-radius: 14px;
  background: var(--mint);
  box-shadow: 0 8px 24px #71e8ca28;
}
.file-drop-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.file-drop-copy { display: grid; min-width: 0; gap: .28rem; }
.file-drop-copy strong { color: #f1f6ff; font-size: 1rem; }
.file-drop-copy strong span { color: #91a8c1; font-weight: 550; }
.file-drop-copy small { color: #8fa1b8; overflow-wrap: anywhere; }
.file-dropzone.has-file .file-drop-icon { color: #062117; background: #7ff0b7; }
.file-dropzone.has-file .file-drop-copy small { color: #9cebd2; }

.workspace-explorer {
  display: grid;
  grid-template-columns: minmax(210px, 270px) minmax(0, 1fr);
  align-items: start;
  gap: .8rem;
  margin-top: .9rem;
}
.workspace-tree-shell {
  overflow: hidden;
  border: 1px solid #354b66;
  border-radius: 15px;
  background: #0e1827;
}
.workspace-tree-heading { display: grid; gap: .2rem; padding: .75rem .85rem; border-bottom: 1px solid #30435c; background: #142238; }
.workspace-tree-heading strong { color: #edf5ff; }
.workspace-tree-heading span { color: #8fa2bb; font-size: .75rem; }
.workspace-tree { max-height: 560px; overflow: auto; padding: .45rem 0; }
.workspace-tree-row { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; min-height: 34px; padding: .12rem .45rem .12rem calc(.45rem + var(--tree-depth) * .85rem); }
.workspace-tree-row:hover, .workspace-tree-row.selected { background: #182b41; }
.workspace-tree-row.selected .workspace-tree-name { color: var(--mint); }
.workspace-tree-toggle, .workspace-tree-name { min-height: 28px; padding: .15rem; color: #a5b7ca; text-align: left; border: 0; background: transparent; }
.workspace-tree-toggle { font: 800 1rem/1 monospace; text-align: center; }
.workspace-tree-name { overflow: hidden; font-size: .82rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.workspace-tree-note { display: block; padding: .3rem .55rem .3rem calc(2.15rem + var(--tree-depth) * .85rem); color: #778ca5; font-size: .73rem; }
.workspace-tree-note.warning { color: #e6c671; }
.workspace-browser-shell {
  overflow: hidden;
  border: 1px solid #354b66;
  border-radius: 15px;
  background: #0e1827;
}
.workspace-breadcrumbs {
  min-height: 50px;
  margin: 0;
  padding: .55rem .75rem;
  border-bottom: 1px solid #30435c;
  background: #142238;
}
.workspace-breadcrumbs::before {
  content: "";
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2371e8ca' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 7.5h6l2-2h9v13h-17z'/%3E%3C/svg%3E");
}
.workspace-breadcrumbs button,
.workspace-breadcrumbs .workspace-breadcrumb-current {
  min-height: 32px;
  padding: .3rem .45rem;
  border: 0;
  border-radius: 7px;
  background: transparent;
  font-size: .86rem;
}
.workspace-breadcrumbs button { color: #a9dcd4; }
.workspace-breadcrumbs button:hover { color: #07130f; background: var(--mint); }
.workspace-breadcrumbs .workspace-breadcrumb-current { color: #edf5ff; font-weight: 700; }
.workspace-browser-status { min-height: 0; margin: 0; padding: .65rem .9rem; color: #8fa2bb; font-size: .8rem; border-bottom: 1px solid #293b52; }
.workspace-browser-list { gap: 0; margin: 0; }
.workspace-browser-row {
  min-height: 64px;
  padding: .7rem .9rem;
  border: 0;
  border-bottom: 1px solid #293b52;
  border-radius: 0;
  background: transparent;
}
.workspace-browser-row:last-child { border-bottom: 0; }
.workspace-browser-row:hover { background: #14243a; }
.workspace-browser-kind {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  color: #8edaca;
  border-radius: 10px;
  background: #1d3349;
}
.workspace-browser-kind svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.workspace-browser-name button { color: #eaf2ff; font-weight: 750; }
.workspace-browser-name button:hover { color: var(--mint); }
.workspace-browser-row .compact-action {
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
}
.workspace-browser-row .compact-action svg,
.workspace-browser-row .compact-action.action-download svg {
  display: block;
  width: 26px;
  height: 26px;
  stroke-width: 2.25;
}
.workspace-browser-empty {
  display: grid;
  min-height: 180px;
  place-items: center;
  align-content: center;
  gap: .4rem;
  padding: 2rem;
  color: #91a3ba;
  text-align: center;
}
.workspace-browser-empty svg { width: 48px; height: 48px; margin-bottom: .25rem; fill: none; stroke: #6685a6; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.workspace-browser-empty strong { color: #e2ebf8; font-size: 1rem; }
.workspace-browser-empty span { max-width: 38rem; font-size: .86rem; }

.memory-quota { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 38%); align-items: center; gap: 1rem; margin: .8rem 0; padding: .85rem 1rem; border: 1px solid #304760; border-radius: 14px; background: #0d1928; }
.memory-quota div { display: grid; gap: .2rem; }
.memory-quota span { color: #92a6bd; font-size: .8rem; }
.memory-quota progress { width: 100%; height: .72rem; accent-color: var(--mint); }
.memory-quota progress.warning { accent-color: #efc75e; }
.memory-quota progress.danger { accent-color: #ef7184; }
.memory-search { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(160px, .3fr) auto auto; align-items: end; gap: .65rem; margin-bottom: .85rem; }
.memory-layout { display: grid; grid-template-columns: minmax(220px, 30%) minmax(0, 1fr); min-height: 440px; border: 1px solid #304760; border-radius: 14px; overflow: hidden; background: #09131f; }
.memory-layout aside { max-height: 620px; overflow: auto; border-right: 1px solid #304760; }
.memory-entry-list { display: grid; }
.memory-entry { display: grid; gap: .25rem; width: 100%; padding: .8rem .9rem; color: #eaf2ff; text-align: left; background: transparent; border: 0; border-bottom: 1px solid #253a52; border-radius: 0; }
.memory-entry:hover, .memory-entry:focus-visible { background: #17283c; }
.memory-entry.selected { color: #061711; background: var(--mint); }
.memory-entry.selected span { color: #173c35; }
.memory-entry span { color: #90a2b9; font-size: .75rem; overflow-wrap: anywhere; }
.memory-editor-shell { padding: 1rem; min-width: 0; }
.memory-note-form { display: grid; gap: .75rem; }
.memory-note-form textarea { min-height: 330px; font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; line-height: 1.5; resize: vertical; }
.memory-readonly input, .memory-readonly textarea, .memory-readonly button { pointer-events: none; opacity: .75; }
.memory-empty { display: grid; place-content: center; min-height: 340px; gap: .35rem; color: #91a5bd; text-align: center; }
.memory-empty strong { color: #e6effb; font-size: 1.1rem; }
.memory-empty-list { padding: 1rem; color: #91a5bd; }
.memory-history { display: grid; gap: .45rem; margin-top: 1rem; }
.memory-history-row { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .55rem .7rem; border: 1px solid #293f58; border-radius: 10px; color: #aebed0; font-size: .78rem; }
.memory-history-row button { padding: .4rem .65rem; }
.memory-history-diff { max-height: 320px; margin-top: .7rem; overflow: auto; color: #c9d8e8; background: #07111d; border: 1px solid #293f58; }
.memory-section { margin-top: 1rem; padding: .85rem 1rem; border: 1px solid #304760; border-radius: 14px; background: #0d1928; }
.memory-section > summary { color: #eaf2ff; font-weight: 800; cursor: pointer; }
.memory-graph-toolbar { display: flex; align-items: center; gap: .5rem; margin-top: .7rem; }
.memory-graph-toolbar button { padding: .45rem .7rem; font-size: .78rem; }
.memory-graph-toolbar #memory-graph-zoom-in, .memory-graph-toolbar #memory-graph-zoom-out { width: 36px; min-width: 36px; padding-inline: 0; font-size: 1.05rem; }
#memory-graph { display: block; width: 100%; min-height: 390px; margin-top: .55rem; border: 1px solid #31506b; border-radius: 16px; touch-action: none; cursor: grab; background: radial-gradient(circle at 50% 45%, #112d3b 0, #081724 43%, #050b13 100%); box-shadow: inset 0 0 80px #01070dc7, 0 16px 36px #0208123d; }
#memory-graph.is-panning { cursor: grabbing; }
.memory-graph-edge { fill: none; stroke: #4eb9bd; stroke-width: 1.1; stroke-opacity: .48; stroke-dasharray: 2 7; animation: memory-flow 9s linear infinite; }
.memory-graph-edge-glow { fill: none; stroke: #5eead4; stroke-width: 3.5; stroke-opacity: .11; filter: url(#memory-edge-glow); }
.memory-graph-node { cursor: grab; outline: none; }
.memory-graph-node.dragging { cursor: grabbing; }
.memory-graph-node .node-halo { fill: #5eead4; fill-opacity: .08; stroke: #65ead0; stroke-opacity: .18; animation: memory-pulse 3.8s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.memory-graph-node .node-core { fill: url(#memory-node-core); stroke: #baffef; stroke-width: 1.5; filter: url(#memory-node-glow); }
.memory-graph-node text { fill: #e6f4ff; paint-order: stroke; stroke: #06111d; stroke-width: 3px; stroke-linejoin: round; font-size: 12px; font-weight: 700; pointer-events: none; }
.memory-graph-node:hover .node-halo, .memory-graph-node:focus .node-halo { fill-opacity: .22; stroke-opacity: .65; }
.memory-graph-root .node-halo { fill: #8aa7ff; stroke: #a9bcff; fill-opacity: .16; stroke-opacity: .55; }
.memory-graph-root .node-core { fill: #8aa7ff; stroke: #e4eaff; }
.memory-node-artifact .node-core { fill: #efb95e; stroke: #ffe4ad; }
.memory-node-artifact .node-halo { fill: #efb95e; stroke: #ffd384; }
.memory-type-deleted .node-core { fill: #a15a67; stroke: #ffc4ce; }
.memory-graph-edge.relation-contradicts { stroke: #ff718b; stroke-width: 2; }
.memory-graph-edge.relation-supersedes { stroke: #f5bd62; }
.memory-graph-edge.relation-produced, .memory-graph-edge.relation-requested-by { stroke: #aa8cff; }
.workspace-browser-row.selected { outline: 2px solid var(--accent); outline-offset: -2px; background: #193348; }
.memory-graph-legend { margin-left: auto; color: #93a8bf; font-size: .8rem; }
@keyframes memory-flow { to { stroke-dashoffset: -90; } }
@keyframes memory-pulse { 50% { transform: scale(1.22); opacity: .55; } }
@media (prefers-reduced-motion: reduce) {
  .memory-graph-edge, .memory-graph-node .node-halo { animation: none; }
}
.checkbox-line { display: flex; align-items: center; justify-content: space-between; gap: .7rem; }
.checkbox-line input { order: 2; }
.checkbox-line input[type="checkbox"] {
  appearance: none;
  width: 48px;
  min-width: 48px;
  height: 28px;
  margin: 0;
  padding: 3px;
  border: 1px solid #4c6079;
  border-radius: 999px;
  background: #26364d;
  cursor: pointer;
}
.checkbox-line input[type="checkbox"]::after { content: ""; display: block; width: 20px; height: 20px; border-radius: 50%; background: #dbe7f6; box-shadow: 0 2px 5px #0008; transition: transform .16s ease; }
.checkbox-line input[type="checkbox"]:checked { border-color: #4ac7a5; background: #2ba984; }
.checkbox-line input[type="checkbox"]:checked::after { transform: translateX(20px); background: #fff; }
#workspace-browser-more { margin: .75rem; }

.decision-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin: 1rem 0 1.2rem;
}
.decision-form .wide { grid-column: 1 / -1; }
.decision-form small { margin-top: .3rem; color: #8fa2bb; }
.decision-disclosure { display: grid; gap: .25rem; padding: .8rem 1rem; color: #9fb0c5; border: 1px solid #3e536e; border-radius: 12px; background: #101b2b; }
.decision-disclosure strong { color: #dce8f6; }
.decision-result { display: grid; gap: .3rem; margin: .8rem 0 1rem; padding: 1rem; border: 1px solid #4fc39d; border-radius: 14px; background: #123028; }
.decision-result strong { color: #cffff0; }
.decision-result span { color: #9ed8c8; font-size: .84rem; }
.decision-row { cursor: pointer; }
.decision-row:hover { border-color: #5c7898; background: #192a40; }

.credential-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin: 1rem 0;
  padding: 0;
  list-style: none;
}
.credential-steps li { display: flex; align-items: center; gap: .7rem; min-width: 0; padding: .8rem; border: 1px solid #354a65; border-radius: 13px; background: #111d2e; }
.credential-steps li > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; color: #071711; border-radius: 50%; background: var(--mint); font-weight: 800; }
.credential-steps li div { display: grid; gap: .12rem; }
.credential-steps small, .field-help { color: #91a3ba; }
.credential-form, .credential-totp-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.credential-form .wide, .credential-totp-form .wide { grid-column: 1 / -1; }
.field-help { margin: -.25rem 0 0; font-size: .8rem; }
.field-help[data-state="error"] { color: #ff9ba9; }
.field-help[data-state="valid"] { color: #87e7c9; }
.credential-next-step { display: grid; gap: .25rem; margin-top: 1rem; padding: .9rem 1rem; color: #8fa1b8; border: 1px dashed #405672; border-radius: 13px; background: #0f1928; }
.credential-next-step strong { color: #cdd9e8; }
#credential-summary[data-state="active"] { color: #8ff0c5; font-weight: 750; }
.credential-active {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .9rem;
  padding: 1rem;
  border: 1px solid #4fc39d;
  border-radius: 15px;
  background: linear-gradient(145deg, #15362f, #112a29);
  box-shadow: 0 0 0 3px #65deb516;
}
.credential-active-icon { display: grid; width: 42px; height: 42px; place-items: center; color: #052117; border-radius: 50%; background: #72e4b7; }
.credential-active-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; }
.credential-active > div:not(.actions) { display: grid; gap: .25rem; min-width: 0; }
.credential-active strong { color: #dffff2; }
.credential-active span:not(.credential-active-icon) { color: #9fd9c9; overflow-wrap: anywhere; }
.credential-active .actions { justify-content: flex-end; }
#cancel-credential-setup { margin-top: .8rem; }
.totp-enrollment { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 1.2rem; margin: .5rem 0; padding: 1rem; border: 1px solid #3a506b; border-radius: 15px; background: #0e1928; }
.totp-enrollment h3, .totp-enrollment h4 { margin: 0 0 .35rem; }
.totp-enrollment p { margin-bottom: .65rem; color: #9aabc0; }
.totp-enrollment details { color: #9ee8dc; }
.totp-enrollment details[open] summary { margin-bottom: .7rem; }
.totp-enrollment .secondary-link { display: inline-block; margin-top: .55rem; color: #88d8ff; }
.totp-qr { display: grid; width: 224px; height: 224px; place-items: center; padding: 12px; border-radius: 14px; background: #fff; box-shadow: 0 10px 28px #0005; }
.totp-qr canvas { display: block; width: 200px !important; height: 200px !important; image-rendering: pixelated; }
.credential-code { max-width: 28rem; }
.credential-code input { font-size: 1.25rem; letter-spacing: .28em; font-variant-numeric: tabular-nums; }
.credential-create-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0; }
.credential-create-card { display: grid; align-content: start; gap: .75rem; margin: 0; }
.credential-create-card > div p { margin: .2rem 0 0; color: #9aabc0; }
.credential-create-card .wide { grid-column: 1 / -1; }
.credential-entry { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .7rem 1rem; align-items: center; }
.credential-entry > div:first-child { display: grid; min-width: 0; gap: .2rem; }
.credential-entry small, .credential-public-key { overflow-wrap: anywhere; }
.credential-public-key { max-height: 4.5rem; overflow: auto; color: #9fd7cd; font-size: .72rem; }
.credential-grant-actions { justify-content: flex-end; }
.credential-grant-actions select { width: min(260px, 100%); }
.credential-grants { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .45rem; color: #91a3ba; font-size: .8rem; }
.credential-grant-chip { display: inline-flex; min-height: 30px; padding: .35rem .6rem; align-items: center; color: #cce7df; border: 1px solid #3c6f66; border-radius: 999px; background: #173029; font-size: .75rem; }
.storage-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin: .8rem 0; }
.storage-summary > div { display: grid; gap: .15rem; padding: .75rem; border: 1px solid #354a65; border-radius: 12px; background: #111d2e; }
.storage-summary strong { color: #80ead0; font-size: 1.25rem; }
.storage-summary span { color: #9aabc0; font-size: .78rem; }

@media (max-width: 640px) {
  .skill-admin-grid { grid-template-columns: 1fr; }
  .skill-row { align-items: flex-start; }
  .skill-row > .actions { width: 100%; }
  .docs-search > div { grid-template-columns: 1fr 1fr; }
  .docs-search input { grid-column: 1 / -1; }
  .memory-quota, .memory-search, .memory-layout { grid-template-columns: 1fr; }
  .memory-layout aside { max-height: 260px; border-right: 0; border-bottom: 1px solid #304760; }
  .memory-search button { width: 100%; }
  #memory-graph { min-height: 340px; }
  .memory-graph-toolbar { flex-wrap: wrap; }
  .memory-graph-legend { width: 100%; margin-left: 0; }
  .file-dropzone { min-height: 100px; justify-content: flex-start; padding: .9rem; }
  .file-drop-copy strong span { display: none; }
  .workspace-explorer { grid-template-columns: 1fr; }
  .workspace-tree { max-height: 240px; }
  .workspace-browser-row .actions { padding-left: 3rem; }
  .credential-steps, .credential-form, .credential-totp-form { grid-template-columns: 1fr; }
  .credential-active { grid-template-columns: auto minmax(0, 1fr); }
  .credential-active .actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; width: 100%; }
  .credential-form .wide, .credential-totp-form .wide { grid-column: auto; }
  .totp-enrollment { grid-template-columns: 1fr; justify-items: center; }
  .totp-enrollment > div:last-child { width: 100%; }
  .totp-qr { width: min(224px, 100%); height: auto; aspect-ratio: 1; }
  .totp-qr canvas { width: 100% !important; height: auto !important; }
  .decision-form { grid-template-columns: 1fr; }
  .decision-form .wide { grid-column: auto; }
  .credential-create-grid, .storage-summary { grid-template-columns: 1fr; }
  .credential-entry { grid-template-columns: 1fr; }
  .credential-grant-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .credential-grant-actions select { width: 100%; }
}

/* Per-account light theme. The terminal canvas and code/diff previews deliberately
   retain their reviewed dark palettes so provider ANSI colors remain legible. */
:root[data-theme="light"] {
  --surface: #f7f9fc;
  --surface-raised: #ffffff;
  --line: #aebed0;
  --muted: #52647a;
  --mint: #087b69;
  --violet: #6546bd;
  color: #152338;
  background: #e9eff6;
  color-scheme: light;
}
:root[data-theme="light"] body {
  color: #152338;
  background:
    radial-gradient(ellipse at 14% -10%, #d9e7fb 0, transparent 40%),
    radial-gradient(ellipse at 88% 10%, #d8eee8 0, transparent 30%),
    linear-gradient(180deg, #f5f8fc, #e9eff6 56%);
}
:root[data-theme="light"] body::before {
  background-image: linear-gradient(#49637d0a 1px, transparent 1px), linear-gradient(90deg, #49637d0a 1px, transparent 1px);
}
:root[data-theme="light"] header.app-header {
  border-bottom-color: #a8b9cc;
  background: #f8fbffed;
}
:root[data-theme="light"] :is(.eyebrow, .brand h1 span, .docs-content a, .secondary-link,
  .workspace-browser-name button, .workspace-breadcrumbs button, .workspace-breadcrumb-current,
  .about-dialog a) { color: #087b69; }
:root[data-theme="light"] :is(.brand .eyebrow, .toolbar p, .meta, .terminal-status,
  .keyboard-status, .field-note, .pagination-status, .snapshot-explanation,
  .host-service-description small, .host-service-status p, .host-monitoring-metrics span,
  .host-operational-status p, .host-operational-grid span, .host-operational-grid small,
  .host-metric-chart-legend, .host-metric-chart-values, .host-metric-chart-scale,
  .notification-row span, .notification-row time, .notification-row-state,
  .notification-device small, .notification-email-preferences p, .provider-health-details small,
  .passkey-details small, .docs-search p, .docs-content p, .docs-content li,
  .docs-content blockquote, .credential-create-card > div p, .totp-enrollment p,
  .workspace-browser-status, .workspace-browser-name small, .file-row small,
  .job-row small, .job-runs, .project-file-button small, .session-card span,
  .session-storage-label, .share-user-option small, .share-user-options-empty,
  .agent-row small, .storage-summary span, .credential-grants, .memory-graph-legend) {
  color: #52647a !important;
}
:root[data-theme="light"] :is(input, select, textarea) {
  color: #14233a;
  border-color: #9fb1c5;
  background: #ffffff;
  box-shadow: inset 0 1px 2px #52647a12;
}
:root[data-theme="light"] :is(input, textarea)::placeholder { color: #687c94; }
:root[data-theme="light"] :is(label, .share-user-field) { color: #30445d; }
:root[data-theme="light"] :is(button.secondary, button.quiet, a.button.secondary, .refresh-button) {
  color: #213550;
  border-color: #9bafc5;
  background: #e1e9f2;
}
:root[data-theme="light"] :is(button.secondary, button.quiet, a.button.secondary, .refresh-button):hover:not(:disabled) {
  color: #10243a;
  background: #d2deeb;
}
:root[data-theme="light"] :is(.card, .session-card) {
  color: #152338;
  border-color: #a9bbce;
  background: linear-gradient(155deg, #fffffffa, #f2f6fbf5);
  box-shadow: 0 15px 38px #36506f18;
}
:root[data-theme="light"] :is(.tabs, .session-tabs) {
  border-color: #a9bbce;
  background: #f8fbfff2;
  box-shadow: 0 9px 25px #36506f18;
}
:root[data-theme="light"] .tabs .tab { color: #445a73; }
:root[data-theme="light"] :is(.tabs .tab:hover, .tabs .quiet:hover) { color: #142338; background: #dce6f1; }
:root[data-theme="light"] :is(.tabs .active, .tabs .active:hover) { color: #06261f; background: #64d7bd; }
:root[data-theme="light"] :is(.user-menu-panel, .admin-menu-panel, .provider-health-details,
  .share-user-options, dialog, .auth-dialog, #job-approval-dialog, #job-schedule-dialog,
  #job-snapshot-dialog) {
  color: #152338;
  border-color: #98aec4;
  background: #f8fbff;
  box-shadow: 0 18px 42px #263c552b;
}
:root[data-theme="light"] :is(.user-menu-action, .admin-menu-action,
  .provider-health-details :is(a, .health-detail), .share-user-option) { color: #1f334d; }
:root[data-theme="light"] :is(.user-menu-action:hover, .user-menu-action:focus-visible,
  .admin-menu-action:hover, .admin-menu-action:focus-visible, .provider-health-details a:hover,
  .share-user-option:hover, .share-user-option.active) { background: #dce7f2; }
:root[data-theme="light"] :is(.user-menu-divider, .admin-menu-divider) { border-color: #aebed0; }
:root[data-theme="light"] .user-menu { color: #354b64; background: #dfe8f2; }
:root[data-theme="light"] .user-avatar-fallback { color: #fff; background: #526d8a; }
:root[data-theme="light"] :is(.provider-health-chip, .notification-inbox-button) {
  color: #344a63;
  border-color: #9eb1c5;
  background: #e1e9f2;
}
:root[data-theme="light"] .provider-health-chip:hover { color: #152338; background: #d3dfeb; }
:root[data-theme="light"] :is(.agent-row, .job-row, .access-row, .workspace-browser-row,
  .upgrade-status-item, .notification-row, .notification-device, .image-audit-row,
  .storage-summary > div, .credential-next-step, .credential-entry, .skill-row,
  .snapshot-metadata, .job-run, .meta span, .project-file-button, .memory-guidance,
  .memory-health, .docs-search, .docs-search-result, .openapi-document-index button,
  .user-directory-row, .user-setting-group, .client-release-versions > div,
  .client-choice-grid fieldset, .client-install-steps > section, .client-help-disclosure) {
  color: #1c3049;
  border-color: #afc0d1;
  background: #eef3f8;
}
:root[data-theme="light"] .client-release-versions strong,
:root[data-theme="light"] :is(.client-selected-package strong, .client-step-title h4) { color: #142338; }
:root[data-theme="light"] :is(.client-release-versions span, .client-install-heading p:last-child,
  .client-choice-grid legend, .client-step-title p, .client-platform-security,
  .client-selected-raw) { color: #52647a; }
:root[data-theme="light"] .client-selected-package { border-color: #78aa9c; background: linear-gradient(120deg, #e6f5f0, #edf3f9); }
:root[data-theme="light"] .client-segmented button { color: #29415c; border-color: #9aafc5; background: #e6edf5; }
:root[data-theme="light"] .client-segmented button.active { color: #06261f; border-color: #289f83; background: #72dfc4; }
:root[data-theme="light"] .client-deployment-notice { color: #654600; border-color: #c69a38; background: #fff4d6; }
:root[data-theme="light"] .client-download-card[data-state="failed"] .client-deployment-notice,
:root[data-theme="light"] .client-download-card[data-state="invalid"] .client-deployment-notice { color: #7d1d30; border-color: #ca8794; background: #ffedf0; }
:root[data-theme="light"] .notification-row[data-resolved="true"] {
  border-color: #79ad9d;
  background: #e3f3ed;
}
:root[data-theme="light"] .notification-row[data-operator-action="true"] {
  color: #4f246f; border-color: #9a63cc; background: #f3e9fc;
}
:root[data-theme="light"] .notification-row[data-resolved="true"]:hover,
:root[data-theme="light"] .notification-row[data-resolved="true"]:focus-visible {
  border-color: #438b76;
  background: #d9eee7;
}
:root[data-theme="light"] .user-directory-row:hover { border-color: #718aa4; background: #e4ecf4; }
:root[data-theme="light"] .user-directory-row.selected { border-color: #289f83; background: #d9f2eb; box-shadow: 0 0 0 2px #289f8322; }
:root[data-theme="light"] .user-directory-identity strong { color: #142338; }
:root[data-theme="light"] :is(.user-directory-identity small, .user-directory-usage,
  .user-settings-heading p, .user-setting-group > div:first-child > p,
  .user-setting-group .toolbar p) { color: #52647a; }
:root[data-theme="light"] .user-directory-package { color: #175b4d; border-color: #6aab9b; background: #dff3ed; }
:root[data-theme="light"] :is(.docs-search-result span, .credential-next-step,
  .snapshot-metadata code) { color: #52647a; }
:root[data-theme="light"] :is(.welcome-panel) {
  border-color: #95afc3;
  background: linear-gradient(115deg, #e4eefb 0%, #eef4fa 52%, #dcefe9 100%);
  box-shadow: inset 0 1px #fff, 0 18px 38px #36506f1f;
}
:root[data-theme="light"] .welcome-panel p:not(.eyebrow) { color: #4e6279; }
:root[data-theme="light"] .workspace-stats > div { border-color: #a6bacd; background: #ffffffa6; }
:root[data-theme="light"] .workspace-stats strong { color: #142338; }
:root[data-theme="light"] .workspace-stats span { color: #52647a; }
:root[data-theme="light"] :is(.host-service-item, .host-monitoring-metrics > div,
  .host-operational-grid > div, .host-metric-chart, .cache-maintenance-card,
  .audit-recheck-control, .runtime-profile-mobile-comparison > section) {
  border-color: #adbed0;
  background: #f6f9fc;
}
:root[data-theme="light"] :is(.cache-maintenance-card h4, .audit-recheck-control strong,
  .runtime-profile-mobile-comparison dd) { color: #17283f; }
:root[data-theme="light"] :is(.cache-maintenance-card p, .audit-recheck-control p,
  .runtime-profile-mobile-comparison dt) { color: #52647a; }
:root[data-theme="light"] .runtime-profile-dialog .toolbar { background: #f8fbfff5; }
:root[data-theme="light"] .session-profile-control { background: #edf3fa; color: #26384d; border-color: #9babc0; }
:root[data-theme="light"] .session-profile-control:hover,
:root[data-theme="light"] .session-profile-control:focus-visible { background: #e3f7f1; color: #143c31; border-color: #258b70; }
:root[data-theme="light"] .session-profile-value + .session-profile-value { border-left-color: #b7c4d3; }
:root[data-theme="light"] .session-profile-runtime { background: #f1ebfb; color: #4c3472 !important; }
:root[data-theme="light"] .session-profile-resource { background: #e8f4f8; }
:root[data-theme="light"] .session-profile-cache { background: #f0f4e8; }
:root[data-theme="light"] .session-profile-pending { background: #fff3d6; color: #6c4900; }
:root[data-theme="light"] :is(.host-monitoring-metrics, .host-operational-grid) strong { color: #17283f; }
:root[data-theme="light"] .runtime-profile-summary { color: #30445d; border-color: #aebed0; background: #edf3f8; }
:root[data-theme="light"] .runtime-profile-comparison { border-color: #aebed0; }
:root[data-theme="light"] .runtime-profile-comparison thead th { color: #06261f; background: #64d7bd; }
:root[data-theme="light"] .runtime-profile-comparison tbody th { color: #17283f; background: #e5edf5; }
:root[data-theme="light"] .runtime-profile-comparison td { color: #30445d; }
:root[data-theme="light"] .runtime-profile-comparison th,
:root[data-theme="light"] .runtime-profile-comparison td { border-color: #b8c7d6; }
:root[data-theme="light"] .host-metric-chart svg { background: linear-gradient(180deg, #f8fbfe, #e8eef5); }
:root[data-theme="light"] .host-chart-grid { stroke: #b1c0d0; }
:root[data-theme="light"] .host-chart-axis { stroke: #687e96; }
:root[data-theme="light"] .host-chart-axis-label { fill: #40566f; }
:root[data-theme="light"] .host-chart-latest-point { stroke: #f8fbfe; }
:root[data-theme="light"] :is(.docs-content pre, .docs-content :not(pre) > code) {
  color: #1e3852;
  background: #e3ebf3;
}
:root[data-theme="light"] :is(.docs-content th, .docs-content td) { border-color: #aabdd0; }
:root[data-theme="light"] .docs-content blockquote { border-left-color: #087b69; background: #edf4f6; }
:root[data-theme="light"] :is(.rendered-diagram, .diagram-svg) { border-color: #aebed0; background: #ffffff; }
:root[data-theme="light"] :is(.connection, .state) { color: #314860 !important; border-color: #9cafc4; background: #e2eaf2; }
:root[data-theme="light"] :is(.connection[data-state="ready"], .provider-health-chip[data-state="operational"]) {
  color: #075d4c; border-color: #4f9b87; background: #d8f0e8;
}
:root[data-theme="light"] :is(.connection[data-state="warning"],
  .provider-health-chip[data-state="unknown"], .provider-health-chip[data-state="degraded"],
  .provider-health-chip[data-state="maintenance"]) { color: #694a08; border-color: #b28b38; background: #fff0c9; }
:root[data-theme="light"] :is(.connection[data-state="error"], .provider-health-chip[data-state="outage"]) {
  color: #842b3b; border-color: #c66d7c; background: #fde1e6;
}
:root[data-theme="light"] :is(.provider-health-chip[data-state="action_required"],
  .notification-inbox-button.operator-action-required) {
  color: #55267a; border-color: #8f56c4; background: #f0e3fc;
}
:root[data-theme="light"] .provider-health-chip[data-state="action_required"] .provider-health-dot { background: #8f50c9; }
:root[data-theme="light"] :is(.health-detail[data-state="action"], .operator-guidance,
  .image-audit-row[data-operator-action="true"], .admin-menu-action.operator-action-required) {
  color: #4f246f; border-color: #9a63cc; background: #f3e9fc;
}
:root[data-theme="light"] :is(.operator-guidance p, .image-audit-row[data-operator-action="true"] p) { color: #694d7d; }
:root[data-theme="light"] :is(.operator-action-button, .operator-action-link,
  .image-audit-force-upgrade, .operator-action-badge) { color: #210d31; border-color: #9a63cc; background: #d3a7f6; }
:root[data-theme="light"] :is(.memory-health.healthy, .credential-active) {
  border-color: #57a590;
  background: #dff3ec;
}
:root[data-theme="light"] :is(.memory-health.healthy strong, .credential-active strong) { color: #075d4c; }
:root[data-theme="light"] :is(.memory-health.attention, .job-secret) {
  border-color: #bd933f;
  background: #fff1cc;
}
:root[data-theme="light"] .memory-health.attention strong { color: #694a08; }
:root[data-theme="light"] :is(.totp-enrollment, .about-release > div) {
  border-color: #aebed0;
  background: #eef3f8;
}
:root[data-theme="light"] :is(.about-release dt, .totp-enrollment p) { color: #52647a; }
:root[data-theme="light"] .about-release dd { color: #17283f; }
:root[data-theme="light"] :is(.terminal-controls, .console-shell) {
  border-color: #8299b0;
  background: #e5edf5;
}
:root[data-theme="light"] .terminal-controls.keyboard-active { border-color: #168873; box-shadow: 0 0 0 1px #16887355; }
:root[data-theme="light"] :is(#terminal-output, .session-terminal-thumbnail, #file-preview-text,
  .session-changes pre, #job-snapshot-dialog pre, .auth-dialog pre) {
  color: #dce7d9;
  border-color: #5f748b;
  background: #05080d;
}
:root[data-theme="light"] #memory-graph {
  border-color: #7995ab;
  background: radial-gradient(circle at 50% 45%, #163848 0, #0a1d2c 43%, #050b13 100%);
}
:root[data-theme="light"] .session-storage-bar {
  border-color: #839ab1;
  background: linear-gradient(180deg, #d6e0ea 0%, #f7f9fc 52%, #c9d5e1 100%);
  box-shadow: inset 0 2px 4px #6b7f942e, inset 0 -1px 1px #fff, 0 1px 0 #fff;
}
:root[data-theme="light"] :is(button:focus-visible, a:focus-visible, input:focus-visible,
  select:focus-visible, textarea:focus-visible, #terminal-output:focus-visible) {
  outline-color: #075f9b;
}
.appearance-preference-card label { max-width: 22rem; }