:root {
  color-scheme: dark;
  --ink: #f2f6ef;
  --ink-soft: #d6e0dc;
  --muted: #a9b7b0;
  --base: #0a1312;
  --panel: #10211f;
  --panel-2: #0d1c1a;
  --panel-soft: #152b28;
  --line: rgba(214, 233, 223, .14);
  --line-strong: rgba(214, 233, 223, .24);
  --accent: #a8da5a;
  --accent-bright: #c9f47d;
  --accent-soft: rgba(168, 218, 90, .1);
  --accent-soft-2: rgba(168, 218, 90, .17);
  --amber: #f0b45f;
  --amber-soft: rgba(240, 180, 95, .12);
  --danger: #e87868;
  --danger-soft: rgba(232, 120, 104, .16);
  --radius: 16px;
  --shadow: 0 18px 48px rgba(0, 0, 0, .42);
  color: var(--ink);
  background: var(--base);
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--base); }
body { min-height: 100vh; margin: 0; background: radial-gradient(circle at 82% 11%, rgba(168, 218, 90, .08), transparent 27%), radial-gradient(circle at 13% 89%, rgba(102, 183, 220, .06), transparent 30%), var(--base); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
select { cursor: pointer; }
input[type="checkbox"], input[type="radio"] { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .68; }
button.is-busy, button.is-busy:disabled { cursor: progress; }
[hidden] { display: none !important; }

.brand { display: inline-flex; align-items: center; gap: .62rem; color: var(--ink); text-decoration: none; width: max-content; }
.brand-mark { display: grid; place-items: center; width: 2rem; height: 2rem; color: #0c1917; background: var(--accent); border-radius: 50%; font-size: 1.16rem; font-weight: 900; letter-spacing: -.12em; }
.brand-wordmark { display: grid; gap: .05rem; line-height: 1; letter-spacing: .13em; }
.brand-wordmark strong { font-size: .73rem; }
.brand-wordmark span { color: var(--accent); font-size: .47rem; font-weight: 800; letter-spacing: .21em; }
.top-actions { display: flex; justify-content: flex-end; align-items: center; gap: 1rem; min-width: 0; }
.user-identity { display: flex; align-items: center; min-width: 0; gap: .6rem; }
.user-avatar { display: grid; flex: none; place-items: center; width: 2.25rem; height: 2.25rem; color: var(--accent); background: var(--accent-soft); border-radius: 50%; }
.user-avatar .ui-icon { width: 1.2rem; height: 1.2rem; stroke-width: 2; }
.user-details { display: grid; min-width: 0; gap: .12rem; line-height: 1.1; }
.user-details strong { overflow: hidden; color: var(--ink); font-size: .78rem; font-weight: 620; text-overflow: ellipsis; white-space: nowrap; }
.user-details span { color: var(--muted); font-size: .68rem; font-weight: 560; text-transform: capitalize; }
.top-actions .quiet-button { display: inline-flex; align-items: center; gap: .38rem; padding: .5rem 0 .5rem 1rem; color: var(--accent); border-left: 1px solid var(--line); font-weight: 620; }
.top-actions .quiet-button .ui-icon { width: .92rem; height: .92rem; }

main { width: min(1180px, calc(100% - 3rem)); min-height: calc(100vh - 2rem); margin: 0 auto clamp(1rem, 4vw, 3.5rem); background: var(--panel-2); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); }
.access-view { display: grid; grid-template-columns: minmax(0, 460px); justify-content: center; align-items: center; min-height: calc(100vh - 68px); padding: clamp(2rem, 7vw, 5rem) 0; }
.access-card { padding: clamp(2rem, 5vw, 3rem); color: var(--ink); background: linear-gradient(155deg, #152b28 0%, #0b1d1a 100%); border: 1px solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow); }
.eyebrow { margin: 0 0 .7rem; color: var(--accent); font-size: .66rem; font-weight: 700; letter-spacing: .11em; line-height: 1.2; }
.access-card .eyebrow, .dark-card .eyebrow { color: var(--accent); }
.access-card h1 { margin: 0; font-size: clamp(2.15rem, 5vw, 3rem); font-weight: 620; line-height: 1.04; letter-spacing: -.052em; }
.access-copy { margin: .85rem 0 2rem; color: rgba(242, 246, 239, .72); font-size: .9rem; line-height: 1.55; }
.access-card form { display: grid; max-width: 430px; gap: 1rem; }
.secondary-form { margin-top: 1.15rem; padding-top: 1.15rem; border-top: 1px solid var(--line-strong); }
.setup-key { overflow-wrap: anywhere; margin: .25rem 0 1rem; padding: .75rem; color: var(--accent-bright); background: rgba(3, 12, 10, .55); border: 1px solid var(--line-strong); border-radius: 5px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .83rem; letter-spacing: .04em; }
.backup-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .42rem; margin: 0 0 1.35rem; }
.backup-codes span { padding: .48rem .55rem; color: rgba(242, 246, 239, .85); background: rgba(3, 12, 10, .35); border: 1px solid var(--line-strong); border-radius: 4px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .72rem; }
.denied-view { grid-template-columns: minmax(0, 760px); justify-content: center; }
.denied-view .access-card { border-radius: var(--radius); }

label { display: grid; gap: .45rem; color: var(--muted); font-size: .72rem; font-weight: 620; letter-spacing: .01em; }
input, select, textarea { width: 100%; padding: .83rem .9rem; color: var(--ink); background: rgba(255, 255, 255, .03); border: 1px solid var(--line-strong); border-radius: 5px; outline: none; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
select, textarea { color: var(--ink); background: rgba(255, 255, 255, .03); border: 1px solid var(--line-strong); border-radius: 5px; outline: none; }
textarea { min-height: 5.5rem; resize: vertical; }
input:hover, select:hover, textarea:hover { border-color: var(--line-strong); }
input:focus, select:focus, textarea:focus { background: rgba(255, 255, 255, .06); border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.primary-button, .secondary-button, .quiet-button { border-radius: 9px; font-size: .78rem; font-weight: 640; letter-spacing: 0; transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.primary-button { display: inline-flex; align-items: center; gap: .38rem; width: max-content; padding: .78rem .95rem; color: #0c1917; background: linear-gradient(101deg, var(--accent), var(--accent-bright)); border: 0; box-shadow: 0 7px 21px rgba(168, 218, 90, .2); }
.primary-button:hover { transform: translateY(-1px); box-shadow: 0 10px 27px rgba(168, 218, 90, .3); }
.primary-button:active, .secondary-button:active, .quiet-button:active { transform: translateY(1px); }
.primary-button:focus-visible, .secondary-button:focus-visible, .quiet-button:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.primary-button.is-busy, .secondary-button.is-busy, .quiet-button.is-busy { display: inline-flex; align-items: center; gap: .45rem; }
button.is-busy::before { width: .78rem; height: .78rem; flex: none; content: ""; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: button-spin .7s linear infinite; }
@keyframes button-spin { to { transform: rotate(360deg); } }
.access-card .primary-button { margin-top: .4rem; }
.quiet-button { padding: .45rem 0; color: var(--accent); background: transparent; border: 0; }
.quiet-button:hover { color: var(--accent-bright); }
.quiet-button.danger-button { color: var(--danger); }
.quiet-button.danger-button:hover { color: #f0a193; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; padding: 0; color: var(--accent); background: transparent; border: 1px solid var(--line); border-radius: 8px; transition: color .16s ease, border-color .16s ease, background .16s ease, transform .16s ease; }
.icon-button .ui-icon { width: 1rem; height: 1rem; }
.icon-button:hover { color: var(--accent-bright); border-color: var(--accent); background: var(--accent-soft); }
.icon-button:active { transform: translateY(1px); }
.icon-button:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.secondary-button { padding: .69rem .82rem; color: var(--ink); background: transparent; border: 1px solid var(--line-strong); }
.dark-card .secondary-button, dialog .secondary-button { color: var(--ink); border-color: var(--line-strong); }
.secondary-button:hover { background: var(--panel-soft); }
.dark-card .secondary-button:hover, dialog .secondary-button:hover { color: var(--ink); background: rgba(255, 255, 255, .08); }

.workspace-view { display: grid; grid-template-columns: 240px minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); grid-template-areas: "nav toolbar" "nav content"; align-items: stretch; min-height: calc(100vh - 2rem); gap: 0; padding: 0; }
.workspace-toolbar { grid-area: toolbar; display: flex; align-items: center; justify-content: flex-end; min-height: 4.5rem; padding: 1rem clamp(2rem, 4vw, 3.5rem) 0; }
#console-view { grid-area: content; padding: 1rem clamp(2rem, 4vw, 3.5rem) clamp(2rem, 4vw, 3.5rem); }
#console-view:focus { outline: none; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2.2rem; }
.page-heading h1 { margin: 0; color: var(--ink); font-size: clamp(2.35rem, 4vw, 3.8rem); font-weight: 620; line-height: 1.02; letter-spacing: -.058em; }
.page-heading p:not(.eyebrow) { max-width: 620px; margin: .85rem 0 0; color: var(--muted); line-height: 1.55; }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 1rem; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.metric { position: relative; min-height: 128px; padding: 1.15rem 1.25rem; color: var(--ink); border-right: 1px solid var(--line); }
.metric:last-child { border-right: 0; }
.metric::after { position: absolute; right: 1.25rem; bottom: 1.1rem; left: 1.25rem; height: 2px; content: ""; background: linear-gradient(90deg, var(--accent), var(--accent-bright)); }
.metric span { display: block; color: var(--muted); font-size: .69rem; font-weight: 620; letter-spacing: .055em; text-transform: uppercase; }
.metric strong { display: block; margin-top: .7rem; font-size: 2.3rem; font-weight: 620; letter-spacing: -.055em; line-height: 1; }
.dashboard-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 1rem; }
.card { min-width: 0; padding: clamp(1.25rem, 3vw, 1.7rem); background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 2px 0 rgba(0, 0, 0, .2); }
.card-heading { display: flex; align-items: center; gap: .72rem; margin-bottom: 1.15rem; }
.card-heading .eyebrow { margin-bottom: .38rem; }
.card h2 { margin: 0; color: var(--ink); font-size: 1.1rem; font-weight: 620; letter-spacing: -.025em; }
.section-icon { display: grid; flex: none; place-items: center; width: 2rem; height: 2rem; border-radius: 9px; }
.section-icon-alert { color: var(--amber); background: var(--amber-soft); }
.section-icon-history { color: var(--accent); background: var(--accent-soft); }
.card-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.dark-card { color: var(--ink); background: var(--panel-soft); border-color: var(--panel-soft); }
.dark-card h2 { color: var(--ink); }
.audit-card { margin-top: 1rem; }
.row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; align-items: center; padding: .92rem 0; border-top: 1px solid var(--line); }
.row:first-child { border-top: 0; }
.row strong { overflow: hidden; color: var(--ink); font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.row span { color: var(--muted); font-size: .74rem; white-space: nowrap; }
.dark-card .row { border-color: var(--line); }
.dark-card .row span { color: var(--muted); }
.empty { display: flex; align-items: center; gap: .68rem; margin: 1.15rem 0 .25rem; color: var(--muted); font-size: .82rem; }
.empty p { margin: 0; }
.empty-icon { display: grid; flex: none; place-items: center; width: 2rem; height: 2rem; color: var(--accent); background: var(--accent-soft); border-radius: 50%; }
.dark-card .empty { color: var(--muted); }

dialog { width: min(520px, calc(100% - 2rem)); max-height: calc(100vh - 2rem); padding: 0; overflow: auto; color: var(--ink); background: linear-gradient(155deg, #152b28 0%, #0b1d1a 100%); border: 1px solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(3, 12, 10, .66); backdrop-filter: blur(3px); }
dialog form { display: grid; gap: .9rem; padding: clamp(1.5rem, 4vw, 2.1rem); }
dialog h2 { margin: -.15rem 0 .4rem; font-size: 1.85rem; letter-spacing: -.055em; }
.dialog-copy { margin: .2rem 0; color: var(--ink-soft); font-size: .8rem; line-height: 1.5; }
dialog .dialog-copy { color: rgba(242, 246, 239, .78); }
.dialog-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: .35rem; }
.key-actions { display: flex; gap: .65rem; margin-top: -.5rem; }
.confirm-check { display: flex; gap: .6rem; align-items: baseline; font-size: .8rem; line-height: 1.45; }
.confirm-check input { width: auto; accent-color: var(--accent); }
.toast { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 4; max-width: min(380px, calc(100% - 2.5rem)); padding: .85rem 1rem; color: var(--ink); background: var(--panel-soft); border: 1px solid var(--line-strong); border-radius: 5px; box-shadow: var(--shadow); font-size: .8rem; font-weight: 620; opacity: 0; pointer-events: none; transform: translateY(1rem); transition: .2s ease; }
.toast.show { opacity: 1; transform: none; }
.toast.error { color: var(--ink); background: #3a201d; border-color: rgba(232, 120, 104, .45); }

.console-nav { grid-area: nav; position: sticky; top: 0; z-index: 2; display: flex; flex-direction: column; align-items: stretch; align-self: stretch; min-height: calc(100vh - 2rem); gap: .25rem; margin: 0; padding: 1.5rem .75rem; background: var(--panel); border: 0; border-right: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.console-nav .brand { margin: 0 .5rem 1.5rem; }
.console-nav a { display: inline-flex; align-items: center; gap: .44rem; padding: .66rem .76rem; color: var(--muted); border-radius: 9px; font-size: .78rem; font-weight: 620; text-decoration: none; }
.console-nav a:hover { color: var(--ink); background: var(--panel-soft); }
.console-nav a[aria-current="page"] { color: #0c1917; background: var(--accent); }
.console-nav .primary-button { margin-left: auto; }
.nav-icon { display: inline-grid; place-items: center; width: 1rem; color: var(--accent); font-size: .94rem; font-weight: 700; line-height: 1; }
.console-nav a[aria-current="page"] .nav-icon { color: #0c1917; }
.tenant-subnav { display: grid; gap: .08rem; margin: -.05rem 0 .55rem 1.5rem; padding: .42rem 0 .42rem .65rem; border-left: 1px solid var(--line-strong); }
.tenant-subnav strong { overflow: hidden; margin: 0 .5rem .2rem; color: var(--ink-soft); font-size: .68rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.console-nav .tenant-subnav a { padding: .38rem .5rem; border-radius: 7px; font-size: .7rem; }
.console-nav .tenant-subnav a[aria-current="page"] { color: var(--accent-bright); background: var(--accent-soft-2); }
.route-header { display: flex; align-items: end; justify-content: space-between; gap: 1.2rem; margin-bottom: 1rem; }
.route-header h1 { margin: 0; color: var(--ink); font-size: clamp(1.75rem, 2.7vw, 2.35rem); font-weight: 620; letter-spacing: -.048em; line-height: 1.05; }
.route-header p:not(.eyebrow) { max-width: 540px; margin: .65rem 0 0; color: var(--muted); font-size: .94rem; line-height: 1.55; }
.route-header-compact { margin-bottom: 1rem; }
.route-header-compact h1 { font-size: clamp(1.65rem, 2.5vw, 2.25rem); letter-spacing: -.042em; }
.route-header-compact p:not(.eyebrow) { margin-top: .35rem; font-size: .82rem; line-height: 1.45; }
.health-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.health-card { position: relative; display: grid; grid-template-columns: auto 1fr; align-content: start; column-gap: .68rem; min-height: 108px; padding: 1rem; color: var(--ink); background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 2px 0 rgba(0, 0, 0, .2); overflow: hidden; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.health-card::after { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; content: ""; background: var(--accent); opacity: .7; }
.health-card:nth-child(2)::after { background: var(--accent); }
.health-card:nth-child(3)::after { background: var(--accent); }
.health-card:nth-child(4)::after { background: var(--accent); }
.health-card:hover { border-color: var(--accent-soft-2); box-shadow: var(--shadow); transform: translateY(-2px); }
.health-card-icon { display: grid; grid-row: span 2; place-items: center; width: 2.3rem; height: 2.3rem; color: var(--accent); background: var(--accent-soft); border-radius: 10px; }
.health-card:nth-child(2) .health-card-icon,
.health-card:nth-child(3) .health-card-icon,
.health-card:nth-child(4) .health-card-icon { color: var(--accent); background: var(--accent-soft); }
.ui-icon { width: 1.15rem; height: 1.15rem; flex: none; }
.health-card-label { align-self: center; color: var(--muted); font-size: .68rem; font-weight: 620; letter-spacing: .055em; text-transform: uppercase; }
.health-card strong { grid-column: 2; margin-top: .1rem; color: var(--ink); font-size: 1.85rem; font-weight: 620; line-height: 1; letter-spacing: -.045em; }
.health-card-link { display: inline-flex; align-items: center; gap: .3rem; grid-column: 1 / -1; align-self: end; margin-top: auto; color: var(--ink-soft); font-size: .72rem; font-weight: 620; }
.health-card-link .ui-icon { width: .85rem; height: .85rem; }
.content-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 1rem; }
.attention-list, .event-list, .onboarding-checklist { display: grid; gap: .65rem; }
.attention-item, .event-item, .onboarding-step { display: flex; align-items: start; justify-content: space-between; gap: 1rem; padding: .86rem 0; border-top: 1px solid var(--line); }
.attention-item:first-child, .event-item:first-child, .onboarding-step:first-child { border-top: 0; }
.attention-item h3, .event-item h3, .onboarding-step h3 { margin: 0 0 .22rem; font-size: .84rem; font-weight: 620; }
.attention-item p, .event-item p, .onboarding-step p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.45; }
.attention-item a, .event-item a, .tenant-tabs a, .card-link { display: inline-flex; align-items: center; gap: .28rem; color: var(--accent); font-size: .77rem; font-weight: 620; text-decoration: none; }
.attention-item a .ui-icon, .card-link .ui-icon { width: .85rem; height: .85rem; }
.card-link { margin-top: .75rem; }
.attention-item a:hover, .event-item a:hover, .tenant-tabs a:hover { color: var(--ink); text-decoration: underline; }
.onboarding-recovery-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.status-badge { display: inline-flex; gap: .35rem; align-items: center; width: max-content; padding: .32rem .48rem; border-radius: 99px; font-size: .66rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; white-space: nowrap; }
.status-badge::before { width: .45rem; height: .45rem; content: ""; background: currentColor; border-radius: 50%; }
.status-active, .status-complete, .status-succeeded { color: #9bd16b; background: rgba(155, 209, 107, .14); }
.status-pending, .status-in_progress, .status-running, .status-queued { color: var(--amber); background: var(--amber-soft); }
.status-blocked, .status-expired, .status-failed, .status-cancelled, .status-rejected, .status-deactivated { color: #f0a193; background: var(--danger-soft); }
.status-suspended, .status-retired, .status-not_started { color: var(--muted); background: rgba(214, 233, 223, .08); }
.filter-bar { display: flex; flex-wrap: wrap; gap: .7rem; margin-bottom: 1rem; padding: .8rem; background: var(--panel-soft); border-radius: 7px; }
.filter-bar label { min-width: min(100%, 170px); color: var(--muted); font-size: .68rem; font-weight: 620; }
.filter-bar input, .filter-bar select { margin-top: .35rem; color: var(--ink); background: rgba(255, 255, 255, .03); border-color: var(--line-strong); }
.result-count { margin: 0 0 .8rem; color: var(--muted); font-size: .78rem; }
.loading-note { display: inline-flex; align-items: center; gap: .5rem; color: var(--muted); font-size: .9rem; }
.loading-note::before { width: .9rem; height: .9rem; flex: none; content: ""; border: 2px solid var(--muted); border-right-color: transparent; border-radius: 50%; animation: button-spin .7s linear infinite; }
.data-table { width: 100%; border-collapse: collapse; }
.data-table th { padding: 0 .7rem .65rem; color: var(--muted); font-size: .66rem; font-weight: 700; letter-spacing: .055em; text-align: left; text-transform: uppercase; }
.data-table td { padding: .78rem .7rem; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: .79rem; vertical-align: middle; }
.data-table td:first-child { color: var(--ink); font-weight: 620; }
.data-table a { color: inherit; text-decoration: none; }
.data-table a:hover { color: var(--accent); text-decoration: underline; }
.data-table select { min-width: 10.5rem; padding: .55rem .65rem; color: var(--ink); background: rgba(255, 255, 255, .03); border-color: var(--line-strong); }
.platform-user-summary { margin-top: 1rem; }
.operations-copy { margin: -.35rem 0 1rem; color: var(--muted); font-size: .8rem; line-height: 1.5; }
.operations-error { color: #f0a193; font-size: .82rem; font-weight: 620; }
.tenant-operations-site-selector { display: grid; grid-template-columns: auto minmax(180px, 320px); align-items: center; gap: .65rem; width: fit-content; margin: -.35rem 0 1rem; color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
.tenant-operations-site-selector select { width: 100%; color: var(--ink); background: rgba(255, 255, 255, .03); border-color: var(--line-strong); font-size: .8rem; letter-spacing: normal; text-transform: none; }
.site-workspace-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(220px, .55fr); gap: 1rem; }
.tenant-sites-map { min-height: 250px; padding: .75rem; background: var(--panel-soft); border: 1px solid var(--line); border-radius: 10px; }
.tenant-sites-map svg { display: block; width: 100%; height: auto; max-height: 360px; }
.tenant-sites-map path { fill: rgba(168, 218, 90, .28); stroke: var(--accent); stroke-width: 2.5; vector-effect: non-scaling-stroke; }
.map-fallback-label { margin: .2rem 0 .7rem; color: var(--muted); font-size: .76rem; }
.aoi-map-fallback { margin: 0; padding-left: 1.2rem; color: var(--ink-soft); font-size: .8rem; }
.selected-site { padding: 1rem; background: var(--panel-soft); border-radius: 10px; color: var(--ink); }
.selected-site .eyebrow { color: var(--accent); }
.selected-site h3 { margin: 0 0 1rem; font-size: 1.15rem; }
.selected-site dl { display: grid; gap: .8rem; margin: 0; }
.selected-site dl div { padding-top: .8rem; border-top: 1px solid var(--line); }
.selected-site dt { color: var(--muted); font-size: .65rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.selected-site dd { margin: .25rem 0 0; color: var(--ink); font-size: .82rem; overflow-wrap: anywhere; }
.geojson-editor { min-height: 9rem; color: var(--ink); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: .76rem; line-height: 1.5; }
.template-workspace-grid { display: grid; grid-template-columns: minmax(280px, .7fr) minmax(0, 1.3fr); gap: 1rem; align-items: start; }
.template-list { display: grid; gap: .65rem; }
.template-card { padding: .85rem; border: 1px solid var(--line); border-radius: 8px; }
.template-card.selected { border-color: var(--accent); box-shadow: inset 3px 0 var(--accent); }
.template-card h3 { margin: 0; font-size: .9rem; color: var(--ink); }
.template-card p { margin: .3rem 0 0; color: var(--muted); font-size: .72rem; }
.template-actions { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.template-graph { min-height: 180px; padding: 1rem; background: var(--panel-soft); border: 1px solid var(--line); border-radius: 10px; }
.template-graph > svg { display: block; width: 100%; height: auto; }
.template-graph line { stroke: var(--accent); stroke-width: 3; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.template-node-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .55rem; }
.template-node { min-width: 0; padding: .75rem; background: var(--panel); border: 1px solid var(--line); border-radius: 7px; }
.template-node strong, .template-node span { display: block; overflow-wrap: anywhere; }
.template-node strong { color: var(--ink); font-size: .8rem; }
.template-node span { margin-top: .3rem; color: var(--muted); font-size: .68rem; }
.template-editor-dialog { width: min(760px, calc(100% - 2rem)); }
.resource-heading, .resource-actions { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.resource-actions { justify-content: flex-start; flex-wrap: wrap; }
.template-json-editor { min-height: min(48vh, 420px); color: var(--ink); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: .76rem; line-height: 1.5; tab-size: 2; }
.catalog-exports { display: flex; flex-wrap: wrap; gap: .55rem; margin: 0 0 1rem; }
.catalog-exports .secondary-button { text-decoration: none; }
.catalog-table-wrap { overflow-x: auto; }
.catalog-object-key, .catalog-metadata { display: block; max-width: 18rem; overflow-wrap: anywhere; color: var(--ink-soft); font: .71rem/1.45 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.catalog-metadata { color: var(--muted); }
.catalog-record-form { display: grid; gap: .9rem; margin-top: 1.2rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.catalog-form-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.catalog-form-heading .eyebrow { margin-bottom: .35rem; }
.catalog-form-heading h3 { margin: 0; font-size: .95rem; color: var(--ink); }
.catalog-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.catalog-form-grid label { display: grid; gap: .35rem; color: var(--muted); font-size: .73rem; font-weight: 620; }
.catalog-form-grid input, .catalog-form-grid select, .catalog-form-grid textarea { width: 100%; color: var(--ink); background: rgba(255, 255, 255, .03); border-color: var(--line-strong); }
.catalog-form-grid textarea { min-height: 5.5rem; font: .75rem/1.5 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.catalog-metadata-field { grid-column: 1 / -1; }
.catalog-form-help { color: var(--muted); }
.tenant-context { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; margin-bottom: 1.35rem; }
.tenant-context a { color: var(--accent); font-size: .8rem; font-weight: 620; text-decoration: none; }
.tenant-context a:hover { color: var(--ink); text-decoration: underline; }
.tenant-context > span { color: var(--ink-soft); font-size: .8rem; font-weight: 620; }
.tenant-header { margin-bottom: 1.75rem; }
.tenant-header h1 { color: var(--ink); font-size: clamp(1.55rem, 2.4vw, 2.1rem); letter-spacing: -.038em; }
.tenant-header .eyebrow { margin-bottom: .55rem; }
.tenant-header p:not(.eyebrow) { margin-top: .5rem; color: var(--muted); font-size: .88rem; }
.tenant-tabs { display: none; overflow-x: auto; gap: .25rem; margin-bottom: 1.75rem; padding: .35rem; background: color-mix(in srgb, var(--panel) 92%, transparent); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }
.tenant-tabs a { justify-content: center; padding: .68rem .95rem; border-radius: 8px; color: var(--muted); font-size: .8rem; white-space: nowrap; }
.tenant-tabs a:hover { color: var(--ink); background: var(--panel-soft); text-decoration: none; }
.tenant-tabs a[aria-current="page"] { color: #0c1917; background: var(--accent); }
.overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.info-card { padding: 1rem; border: 1px solid var(--line); border-radius: 7px; }
.info-card span { display: block; margin-bottom: .4rem; color: var(--muted); font-size: .66rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.info-card strong { display: block; color: var(--ink); font-size: .9rem; font-weight: 620; }
.field-help { margin: -.4rem 0 0; color: rgba(242, 246, 239, .6); font-size: .72rem; }
.wizard-progress { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .35rem; margin: .1rem 0 .6rem; padding: 0; list-style: none; }
.wizard-progress li { padding: .42rem; color: var(--muted); border-bottom: 2px solid var(--line); font-size: .64rem; font-weight: 650; text-align: center; }
.wizard-progress li[aria-current="step"] { color: var(--accent); border-color: var(--accent); }
.wizard-step { display: grid; gap: .9rem; min-width: 0; margin: .35rem 0; padding: 0; border: 0; }
.wizard-step legend { margin-bottom: .3rem; color: var(--ink); font-size: 1rem; font-weight: 620; }
.wizard-review { display: grid; gap: .55rem; padding: .85rem; background: rgba(3, 12, 10, .35); border: 1px solid var(--line-strong); border-radius: 5px; color: rgba(242, 246, 239, .8); font-size: .8rem; line-height: 1.5; }
.wizard-review strong { color: var(--accent-bright); }
.form-error { margin: .2rem 0; color: #ffb3a8; font-size: .78rem; font-weight: 620; }
.job-tail-dialog { width: min(780px, calc(100% - 2rem)); }
.job-tail-dialog > div { display: grid; gap: .9rem; padding: clamp(1.5rem, 4vw, 2.1rem); }
.job-tail-output { min-height: 250px; max-height: min(54vh, 560px); margin: 0; padding: 1rem; overflow: auto; color: #c9f5dd; background: #07100e; border: 1px solid rgba(168, 218, 90, .24); border-radius: 6px; font: .75rem/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; white-space: pre-wrap; }

@media (max-width: 900px) {
  .workspace-view { display: block; }
  .workspace-toolbar { min-height: 0; padding: 0 1rem 1rem; }
  #console-view { padding: 0 1rem 2rem; }
  .console-nav { position: static; flex-direction: row; flex-wrap: wrap; align-items: center; margin: 0 0 1.25rem; }
  .tenant-subnav { display: none; }
  .tenant-tabs { display: flex; }
  .health-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .content-grid { grid-template-columns: 1fr; }
  .site-workspace-grid { grid-template-columns: 1fr; }
  .template-workspace-grid { grid-template-columns: 1fr; }
  .catalog-form-grid { grid-template-columns: 1fr; }
  .overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric:nth-child(2) { border-right: 0; }
  .metric:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .dashboard-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  main { width: min(100% - 2rem, 540px); }
  .user-details { display: none; }
  .top-actions .quiet-button { padding-left: .75rem; }
  .access-view { grid-template-columns: 1fr; min-height: calc(100vh - 68px); padding: 1.5rem 0 2.5rem; }
  .page-heading { align-items: start; flex-direction: column; gap: 1.2rem; }
  .card-heading-row { align-items: start; flex-direction: column; }
  .catalog-form-heading { align-items: start; flex-direction: column; }
  .console-nav { align-items: stretch; }
  .console-nav a { flex: 1 1 42%; text-align: center; }
  .console-nav .primary-button { width: 100%; margin-left: 0; }
  .route-header { align-items: start; flex-direction: column; }
  .health-grid, .overview-grid { grid-template-columns: 1fr; }
  .data-table thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .data-table tbody, .data-table tr { display: block; }
  .data-table tr { padding: .72rem 0; border-top: 1px solid var(--line); }
  .data-table td { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: .7rem; padding: .32rem 0; border: 0; }
  .data-table td::before { content: attr(data-label); color: var(--muted); font-size: .68rem; font-weight: 800; }
}
@media (max-width: 430px) {
  main { width: min(100% - 1.25rem, 540px); }
  .brand-wordmark { display: none; }
  .access-card { padding: 1.6rem; }
  .access-card h1 { font-size: 2.35rem; }
  .backup-codes { grid-template-columns: 1fr; }
  .metrics { grid-template-columns: 1fr; }
  .metric, .metric:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); }
  .metric:last-child { border-bottom: 0; }
  .row { grid-template-columns: 1fr; gap: .3rem; }
  .row span { white-space: normal; }
}