.portal-root {
    color-scheme: light;
    --portal-ink: #0a0f1c;
    --portal-ink-soft: #172238;
    --portal-navy: #071120;
    --portal-navy-raised: #0d1a2c;
    --portal-blue: #2e8bff;
    --portal-blue-dark: #1267d4;
    --portal-cyan: #34e0ff;
    --portal-surface: #f5f7fa;
    --portal-panel: #ffffff;
    --portal-panel-subtle: #f9fbfd;
    --portal-border: #dce3ec;
    --portal-border-strong: #c7d1de;
    --portal-muted: #647086;
    --portal-muted-strong: #46536a;
    --portal-success: #18724a;
    --portal-success-bg: #e6f6ed;
    --portal-warning: #9b4d0d;
    --portal-warning-bg: #fff2df;
    --portal-danger: #a72f35;
    --portal-danger-bg: #fdebec;
    --portal-info: #1b5ea8;
    --portal-info-bg: #e9f3ff;
    --portal-shadow: 0 18px 50px rgba(10, 23, 44, .08);
    --portal-radius: 18px;
    --portal-sidebar: 248px;
    --portal-topbar: 76px;
    font-family: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-synthesis: none;
}

.portal-root, .portal-root * { box-sizing: border-box; }
html.portal-root { min-width: 320px; background: var(--portal-surface); }
.portal-root body { margin: 0; color: var(--portal-ink); background: var(--portal-surface); font-size: 14px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
.portal-root :where(a) { color: inherit; }
.portal-root :where(button, input, select, textarea) { color: inherit; font: inherit; }
.portal-root :where(button, a) { -webkit-tap-highlight-color: transparent; }
.portal-root :where(button) { cursor: pointer; }
.portal-root :where(img, canvas) { display: block; max-width: 100%; }
.portal-root h1, .portal-root h2, .portal-root h3, .portal-root p { margin-top: 0; }
.portal-root h1, .portal-root h2, .portal-root h3 { color: var(--portal-ink); font-family: "Space Grotesk", "Inter", sans-serif; }
.portal-root h1 { font-size: clamp(2rem, 4vw, 3.15rem); line-height: 1.02; letter-spacing: -.055em; }
.portal-root h2 { font-size: 1.18rem; line-height: 1.25; letter-spacing: -.025em; }
.portal-root h3 { font-size: 1rem; line-height: 1.35; letter-spacing: -.018em; }

.portal-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.portal-skip-link { position: fixed; top: 10px; left: 10px; z-index: 10000; padding: 10px 14px; border-radius: 8px; background: #fff; color: var(--portal-ink); font-weight: 750; transform: translateY(-150%); }
.portal-skip-link:focus { transform: translateY(0); outline: 3px solid var(--portal-cyan); }

.portal-app { min-height: 100dvh; display: grid; grid-template-columns: var(--portal-sidebar) minmax(0, 1fr); }
.portal-sidebar { position: sticky; top: 0; z-index: 50; display: flex; height: 100dvh; flex-direction: column; overflow-y: auto; border-right: 1px solid rgba(255,255,255,.08); background: radial-gradient(circle at 0 0, rgba(52,224,255,.09), transparent 26%), var(--portal-navy); color: #dbe8f7; }
.portal-sidebar__brand { display: grid; gap: 3px; min-height: var(--portal-topbar); align-content: center; padding: 0 22px; border-bottom: 1px solid rgba(255,255,255,.08); }
.portal-wordmark { color: var(--portal-ink); font-family: "Space Grotesk", sans-serif; font-size: 1.25rem; font-weight: 700; letter-spacing: -.045em; text-decoration: none; }
.portal-wordmark--inverse { color: #fff; }
.portal-product { color: #8fa3bb; font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.portal-command-trigger { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 14px 2px; padding: 0 12px; border: 1px solid rgba(255,255,255,.13); border-radius: 10px; background: rgba(255,255,255,.055); color: #dbe8f7; text-align: left; }
.portal-command-trigger:hover { border-color: rgba(52,224,255,.44); background: rgba(52,224,255,.07); }
.portal-command-trigger kbd { padding: 2px 6px; border: 1px solid rgba(255,255,255,.14); border-radius: 5px; color: #8fa3bb; font-family: "JetBrains Mono", monospace; font-size: 10px; box-shadow: none; }
.portal-nav { display: grid; gap: 2px; padding: 12px 10px 24px; }
.portal-nav__label { margin: 18px 10px 7px; color: #6f849e; font-family: "JetBrains Mono", monospace; font-size: 9px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; }
.portal-nav__item { position: relative; display: flex; min-height: 39px; align-items: center; padding: 8px 12px; border-radius: 9px; color: #9fb0c5; font-size: 13px; font-weight: 600; text-decoration: none; transition: color .16s ease, background .16s ease; }
.portal-nav__item:hover { background: rgba(255,255,255,.055); color: #fff; }
.portal-nav__item.is-active { background: linear-gradient(90deg, rgba(46,139,255,.2), rgba(46,139,255,.06)); color: #fff; }
.portal-nav__item.is-active::before { position: absolute; inset: 8px auto 8px 0; width: 3px; border-radius: 999px; background: var(--portal-cyan); content: ""; }
.portal-sidebar__support { display: grid; gap: 3px; margin: auto 14px 14px; padding: 14px; border: 1px solid rgba(255,255,255,.08); border-radius: 12px; background: rgba(255,255,255,.035); color: #7f93aa; font-size: 11px; }
.portal-sidebar__support a { color: #d8e6f7; font-weight: 650; text-decoration: none; }

.portal-workspace { min-width: 0; }
.portal-topbar { position: sticky; top: 0; z-index: 40; display: flex; min-height: var(--portal-topbar); align-items: center; justify-content: space-between; gap: 18px; padding: 0 28px; border-bottom: 1px solid var(--portal-border); background: rgba(255,255,255,.94); backdrop-filter: blur(14px); }
.portal-mobile-menu { display: none; width: 42px; height: 42px; place-content: center; gap: 4px; border: 1px solid var(--portal-border); border-radius: 10px; background: #fff; }
.portal-mobile-menu span:not(.portal-sr-only) { display: block; width: 18px; height: 2px; margin: 3px auto; background: var(--portal-ink); }
.portal-context { display: flex; min-width: 0; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.portal-context__mark { display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; border: 1px solid #cfe0f6; border-radius: 9px; background: #edf5ff; color: var(--portal-blue-dark); font-family: "Space Grotesk", sans-serif; font-size: 12px; font-weight: 700; }
.portal-context > span:last-child { display: grid; min-width: 0; }
.portal-context strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.portal-context small { color: var(--portal-muted); font-size: 10px; }
.portal-topbar__actions { position: relative; display: flex; align-items: center; gap: 16px; }
.portal-topbar__link { color: var(--portal-muted-strong); font-size: 12px; font-weight: 650; text-decoration: none; }
.portal-user-trigger { display: flex; align-items: center; gap: 9px; padding: 5px 7px 5px 5px; border: 0; border-radius: 11px; background: transparent; text-align: left; }
.portal-user-trigger:hover { background: var(--portal-surface); }
.portal-avatar { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 9px; background: var(--portal-ink); color: #fff; font-family: "Space Grotesk", sans-serif; font-size: 11px; font-weight: 700; }
.portal-user-trigger__text { display: grid; max-width: 160px; }
.portal-user-trigger__text strong, .portal-user-trigger__text small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-user-trigger__text strong { font-size: 11px; }
.portal-user-trigger__text small { color: var(--portal-muted); font-size: 9px; }
.portal-user-menu { position: absolute; top: calc(100% + 10px); right: 0; z-index: 60; width: 210px; padding: 6px; border: 1px solid var(--portal-border); border-radius: 12px; background: #fff; box-shadow: var(--portal-shadow); }
.portal-user-menu a, .portal-user-menu button { display: block; width: 100%; padding: 10px; border: 0; border-radius: 8px; background: transparent; color: var(--portal-ink); font-size: 12px; text-align: left; text-decoration: none; }
.portal-user-menu a:hover, .portal-user-menu button:hover { background: var(--portal-surface); }

.portal-main { min-height: calc(100dvh - var(--portal-topbar)); }
.portal-content { width: min(1380px, 100%); margin: 0 auto; padding: 34px 32px 80px; }
.portal-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 24px; }
.portal-page-header__copy { max-width: 780px; }
.portal-page-header h1 { margin: 6px 0 12px; }
.portal-page-header__copy > p:last-child { max-width: 740px; margin-bottom: 0; color: var(--portal-muted-strong); font-size: 15px; }
.portal-eyebrow { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; color: var(--portal-blue-dark); font-family: "JetBrains Mono", monospace; font-size: 10px; font-weight: 650; letter-spacing: .09em; text-transform: uppercase; }
.portal-eyebrow span { display: inline-flex; align-items: center; padding: 3px 6px; border: 1px solid #c9def8; border-radius: 5px; background: #edf5ff; color: #205f9f; }
.portal-page-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.portal-button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 8px; padding: 8px 15px; border: 1px solid var(--portal-border-strong); border-radius: 999px; background: #fff; color: var(--portal-ink); font-size: 12px; font-weight: 700; line-height: 1; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.portal-button:hover { border-color: #94a4b7; transform: translateY(-1px); }
.portal-button:focus-visible, .portal-nav__item:focus-visible, .portal-user-trigger:focus-visible, .portal-command-trigger:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, a:focus-visible, button:focus-visible { outline: 2px solid var(--portal-blue); outline-offset: 2px; }
.portal-button--primary { border-color: var(--portal-ink); background: var(--portal-ink); color: #fff; box-shadow: 0 8px 20px rgba(10,15,28,.14); }
.portal-button--primary:hover { border-color: var(--portal-blue); background: #17243b; }
.portal-button--secondary { border-color: #b9d3f4; background: #edf5ff; color: #145ca9; }
.portal-button--quiet { background: transparent; }
.portal-button--danger { border-color: #f0b6b6; background: #fff1f1; color: var(--portal-danger); }
.portal-button--danger:hover { border-color: var(--portal-danger); background: #ffe6e6; }
.portal-button.is-disabled { opacity: .5; pointer-events: none; }
.portal-text-link { color: var(--portal-blue-dark); font-size: 12px; font-weight: 700; text-decoration: none; }

.portal-notice { display: flex; gap: 12px; margin-bottom: 20px; padding: 13px 15px; border: 1px solid; border-radius: 12px; }
.portal-notice strong { font-size: 12px; }
.portal-notice span { color: var(--portal-muted-strong); }
.portal-notice--success { border-color: #bde3ce; background: var(--portal-success-bg); }
.portal-notice--info { border-color: #c7ddf7; background: var(--portal-info-bg); }
.portal-notice--warning { border-color: #efcca5; background: var(--portal-warning-bg); }
.portal-notice--danger { border-color: #efc4c7; background: var(--portal-danger-bg); }

.portal-tabs { display: flex; gap: 4px; margin: 0 0 22px; padding: 4px; overflow-x: auto; border: 1px solid var(--portal-border); border-radius: 12px; background: #fff; scrollbar-width: thin; }
.portal-tabs a { display: inline-flex; min-height: 36px; flex: 0 0 auto; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 8px; color: var(--portal-muted-strong); font-size: 12px; font-weight: 650; text-decoration: none; }
.portal-tabs a:hover { background: var(--portal-surface); color: var(--portal-ink); }
.portal-tabs a.is-active { background: var(--portal-ink); color: #fff; }
.portal-tabs a span { min-width: 18px; padding: 1px 5px; border-radius: 999px; background: rgba(255,255,255,.14); font-family: "JetBrains Mono", monospace; font-size: 9px; text-align: center; }

.portal-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
.portal-metrics--three { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 20px; }
.portal-metric { position: relative; min-width: 0; overflow: hidden; padding: 17px 18px; border: 1px solid var(--portal-border); border-radius: 14px; background: #fff; }
.portal-metric::before { position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--portal-border-strong); content: ""; }
.portal-metric--success::before { background: var(--portal-success); }
.portal-metric--warning::before { background: #df741e; }
.portal-metric--danger::before { background: var(--portal-danger); }
.portal-metric--info::before { background: var(--portal-blue); }
.portal-metric p { margin-bottom: 8px; color: var(--portal-muted); font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.portal-metric strong { display: block; margin-bottom: 5px; overflow: hidden; color: var(--portal-ink); font-family: "Space Grotesk", sans-serif; font-size: 1.55rem; line-height: 1.05; letter-spacing: -.04em; text-overflow: ellipsis; }
.portal-metric span { display: block; color: var(--portal-success); font-size: 10px; font-weight: 650; }
.portal-metric small { display: block; margin-top: 5px; color: var(--portal-muted); font-size: 9px; }

.portal-sections { display: grid; gap: 16px; }
.portal-content > :where(.portal-panel, .portal-sections) + :where(.portal-panel, .portal-sections) { margin-top: 16px; }
.portal-panel { overflow: hidden; border: 1px solid var(--portal-border); border-radius: var(--portal-radius); background: var(--portal-panel); box-shadow: 0 1px 0 rgba(10,15,28,.02); }
.portal-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 19px 20px 16px; border-bottom: 1px solid var(--portal-border); }
.portal-section-heading h2 { margin-bottom: 3px; }
.portal-section-heading p { max-width: 720px; margin-bottom: 0; color: var(--portal-muted); font-size: 11px; }

.portal-record-list { display: grid; }
.portal-record { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 16px 20px; border-top: 1px solid #edf1f5; }
.portal-record:first-child { border-top: 0; }
.portal-record:hover { background: #fbfcfe; }
.portal-record:has(.portal-record__leading),
.portal-record:has(.portal-record__swatch) { grid-template-columns: auto minmax(0, 1fr) auto; }
.portal-record-list--timeline { position: relative; padding-left: 22px; }
.portal-record-list--timeline::before { position: absolute; top: 20px; bottom: 20px; left: 24px; width: 1px; background: var(--portal-border); content: ""; }
.portal-record-list--timeline .portal-record { position: relative; background: #fff; }
.portal-record-list--timeline .portal-record::before { position: absolute; left: -4px; width: 9px; height: 9px; border: 3px solid #fff; border-radius: 50%; background: var(--portal-blue); box-shadow: 0 0 0 1px var(--portal-blue); content: ""; }
.portal-record__leading { min-width: 60px; color: var(--portal-blue-dark); font-family: "JetBrains Mono", monospace; font-size: 1.15rem; text-align: right; }
.portal-record__swatch { width: 40px; height: 40px; flex: 0 0 auto; border: 1px solid rgba(10,15,28,.12); border-radius: 10px; background: var(--portal-swatch, #fff); box-shadow: inset 0 0 0 1px rgba(255,255,255,.45); }
.portal-record__body { min-width: 0; }
.portal-record__title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.portal-record__title-row h3 { margin-bottom: 0; }
.portal-record__eyebrow { margin-bottom: 3px; color: var(--portal-muted); font-family: "JetBrains Mono", monospace; font-size: 8px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.portal-record__description { max-width: 760px; margin: 6px 0 0; color: var(--portal-muted-strong); font-size: 12px; }
.portal-record__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 8px 0 0; padding: 0; color: var(--portal-muted); font-size: 9px; list-style: none; }
.portal-record__meta li:not(:first-child)::before { display: inline-block; width: 3px; height: 3px; margin: 0 7px 2px 0; border-radius: 50%; background: #aeb8c5; content: ""; }
.portal-record__action { display: inline-flex; align-items: center; gap: 8px; color: var(--portal-blue-dark); font-size: 11px; font-weight: 750; text-decoration: none; white-space: nowrap; }
.portal-record__action span { transition: transform .15s ease; }
.portal-record__action:hover span { transform: translateX(3px); }
.portal-status { display: inline-flex; min-height: 23px; flex: 0 0 auto; align-items: center; gap: 6px; padding: 3px 8px; border-radius: 999px; background: #eef1f5; color: var(--portal-muted-strong); font-size: 9px; font-weight: 700; white-space: nowrap; }
.portal-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.portal-status--success { background: var(--portal-success-bg); color: var(--portal-success); }
.portal-status--warning { background: var(--portal-warning-bg); color: var(--portal-warning); }
.portal-status--danger { background: var(--portal-danger-bg); color: var(--portal-danger); }
.portal-status--info { background: var(--portal-info-bg); color: var(--portal-info); }
.portal-progress { height: 5px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: #e8edf3; }
.portal-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--portal-blue), #2bb8d6); }

.portal-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; padding: 16px; }
.portal-record-card { display: flex; min-width: 0; flex-direction: column; gap: 12px; padding: 16px; border: 1px solid var(--portal-border); border-radius: 13px; background: var(--portal-panel-subtle); }
.portal-record-card .portal-record__action { margin-top: auto; padding-top: 5px; }
.portal-record-card .portal-record__title-row { display: grid; }
.portal-record-card .portal-status { justify-self: start; }

.portal-checklist { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0; margin: 0; padding: 8px 18px 18px; list-style: none; }
.portal-checklist li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; align-items: start; padding: 11px 8px; color: var(--portal-muted-strong); font-size: 11px; }
.portal-checklist li > span { position: relative; width: 15px; height: 15px; margin-top: 1px; border: 1px solid #98c7ad; border-radius: 50%; background: var(--portal-success-bg); }
.portal-checklist li > span::after { position: absolute; top: 3px; left: 4px; width: 5px; height: 3px; border-bottom: 1.5px solid var(--portal-success); border-left: 1.5px solid var(--portal-success); transform: rotate(-45deg); content: ""; }
.portal-checklist strong { font-size: 11px; font-weight: 650; }
.portal-checklist small { grid-column: 2; color: var(--portal-muted); }

.portal-empty-state { display: grid; min-height: 190px; place-items: center; align-content: center; padding: 30px; text-align: center; }
.portal-empty-state__mark { position: relative; width: 42px; height: 42px; margin-bottom: 14px; border: 1px dashed #a9bbd1; border-radius: 13px; background: #f2f6fb; }
.portal-empty-state__mark::before, .portal-empty-state__mark::after { position: absolute; top: 50%; left: 50%; background: #8fa5be; content: ""; transform: translate(-50%, -50%); }
.portal-empty-state__mark::before { width: 15px; height: 1px; }
.portal-empty-state__mark::after { width: 1px; height: 15px; }
.portal-empty-state h3 { margin-bottom: 5px; }
.portal-empty-state p { max-width: 510px; margin-bottom: 14px; color: var(--portal-muted); font-size: 11px; }
.portal-footnote { margin: 0; padding: 11px 20px; border-top: 1px solid var(--portal-border); background: #fbfcfd; color: var(--portal-muted); font-size: 9px; }

.portal-chart { position: relative; padding: 14px 18px 18px; }
.portal-chart canvas { width: 100%; height: 300px; border-radius: 10px; background: linear-gradient(#fff, #fbfcfe); }
.portal-chart__legend { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 10px; color: var(--portal-muted-strong); font-size: 10px; }
.portal-chart__legend span { display: inline-flex; align-items: center; gap: 6px; }
.portal-chart__legend i { width: 16px; height: 3px; border-radius: 999px; background: var(--series-color); }
.portal-chart__meta { display: flex; flex-wrap: wrap; gap: 5px 14px; margin-top: 10px; color: var(--portal-muted); font-family: "JetBrains Mono", monospace; font-size: 8px; }
.portal-chart__table { margin-top: 12px; }
.portal-chart__table summary { color: var(--portal-blue-dark); font-size: 10px; font-weight: 700; cursor: pointer; }
.portal-chart__tooltip { position: absolute; z-index: 3; min-width: 128px; padding: 8px 10px; transform: translate(-50%, -100%); border: 1px solid #dce4ee; border-radius: 8px; background: rgba(255, 255, 255, .97); box-shadow: 0 8px 24px rgba(24, 39, 75, .14); color: var(--portal-ink); pointer-events: none; }
.portal-chart__tooltip strong, .portal-chart__tooltip span { display: block; font-size: 9px; line-height: 1.5; }
.portal-chart__tooltip strong { margin-bottom: 3px; font-family: "JetBrains Mono", monospace; }
.portal-chart__tooltip span::before { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--series-color); content: ""; }
.portal-table-scroll { margin-top: 10px; overflow-x: auto; border: 1px solid var(--portal-border); border-radius: 10px; }
.portal-table-scroll table { width: 100%; border-collapse: collapse; font-size: 10px; }
.portal-table-scroll caption { padding: 10px; color: var(--portal-muted); text-align: left; }
.portal-table-scroll th, .portal-table-scroll td { padding: 8px 10px; border-top: 1px solid var(--portal-border); text-align: right; white-space: nowrap; }
.portal-table-scroll th:first-child, .portal-table-scroll td:first-child { text-align: left; }
.portal-table-scroll thead th { background: #f6f8fb; color: var(--portal-muted-strong); font-weight: 700; }
.portal-audit-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.portal-audit-toolbar .portal-form { flex: 1; }
.portal-pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px 0; color: var(--portal-muted); font-size: 10px; }

.portal-request-form { margin-bottom: 16px; }
.portal-request-composer { margin-bottom: 16px; }
.portal-request-composer--internal { border-color: #e5c980; background: #fffbf1; }
.portal-request-composer--internal .portal-section-heading { border-bottom-color: #ead9ad; background: #fff8e7; }
.portal-request-workbench { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.portal-request-workbench > :last-child { grid-column: 1 / -1; }
.portal-request-workflow { display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); }
.portal-request-workflow > form + form { border-left: 1px solid var(--portal-border); }
.portal-request-workflow p { margin: 0; color: var(--portal-muted-strong); }
.portal-form { padding: 20px; }
.portal-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.portal-field { display: grid; gap: 6px; }
.portal-field--wide { grid-column: 1 / -1; }
.portal-field label { color: var(--portal-muted-strong); font-size: 10px; font-weight: 750; }
.portal-field input, .portal-field select, .portal-field textarea { width: 100%; min-height: 43px; padding: 10px 12px; border: 1px solid var(--portal-border-strong); border-radius: 10px; background: #fff; box-shadow: 0 1px 0 rgba(10,15,28,.02); }
.portal-field textarea { min-height: 140px; resize: vertical; }
.portal-field input::placeholder, .portal-field textarea::placeholder { color: #98a3b2; }
.portal-field .field-validation-error, .portal-validation { color: var(--portal-danger); font-size: 10px; }
.portal-validation:empty { display: none; }
.portal-form-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.portal-field small { display: block; margin-top: 6px; color: var(--portal-muted-strong); font-size: 11px; }
.portal-consent { display: inline-flex; align-items: flex-start; gap: 8px; color: var(--portal-muted-strong); font-size: 11px; }
.portal-consent input { width: 16px; height: 16px; min-height: 0; flex: 0 0 16px; margin: 1px 0 0; }
.portal-publish-form { border-top: 1px solid var(--portal-border); background: #f8fbff; }
.portal-publication-form { margin: 20px; border: 1px solid var(--portal-border); border-radius: 13px; background: var(--portal-panel-subtle); }
.portal-publication-form--danger { border-color: #efc4c7; background: #fff9f9; }
.portal-callout { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 20px; padding: 16px; border: 1px solid var(--portal-border); border-radius: 13px; }
.portal-callout--info { border-color: #c7ddf7; background: var(--portal-info-bg); }
.portal-callout p { margin: 4px 0 0; color: var(--portal-muted-strong); font-size: 11px; }
.portal-callout .portal-form-actions { flex: 0 0 auto; margin-top: 0; }
.portal-timeline { display: grid; }
.portal-timeline__item { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; padding: 18px 20px; border-top: 1px solid var(--portal-border); }
.portal-timeline__item:first-child { border-top: 0; }
.portal-timeline__item h3 { margin: 2px 0 7px; }
.portal-timeline__item p { margin: 4px 0; color: var(--portal-muted-strong); font-size: 11px; }
.portal-timeline__marker { width: 10px; height: 10px; margin-top: 5px; border: 3px solid #fff; border-radius: 50%; background: var(--portal-blue); box-shadow: 0 0 0 1px var(--portal-blue); }
.portal-brand-editor-list { display: grid; gap: 16px; padding: 16px; background: var(--portal-panel-subtle); }
.portal-brand-editor { overflow: hidden; border: 1px solid var(--portal-border); border-radius: 13px; background: #fff; }
.portal-brand-editor > .portal-section-heading { background: #fbfcfe; }
.portal-brand-fields { grid-column: 1 / -1; border: 1px solid var(--portal-border); border-radius: 11px; background: #fbfcfe; }
.portal-brand-fields summary { padding: 13px 14px; color: var(--portal-blue-dark); font-size: 11px; font-weight: 750; cursor: pointer; }
.portal-brand-fields[open] summary { border-bottom: 1px solid var(--portal-border); }
.portal-brand-fields > .portal-form-grid { padding: 14px; }
.portal-brand-fields > .portal-consent { margin: 0 14px 14px; }
.portal-upload-status { margin: 18px 0 0; padding: 14px 16px; border: 1px solid #c7ddf7; border-radius: 12px; background: var(--portal-info-bg); }
.portal-upload-status > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.portal-upload-status strong { font-size: 13px; }
.portal-upload-status span { color: var(--portal-muted-strong); font-size: 12px; }
.portal-upload-status.is-error { border-color: #efc4c7; background: var(--portal-danger-bg); }
.portal-deliverable-list { display: grid; }
.portal-deliverable-record { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 19px 20px; border-top: 1px solid var(--portal-border); }
.portal-deliverable-record:first-child { border-top: 0; }
.portal-deliverable-record__main { min-width: 0; }
.portal-deliverable-record__main h3 { margin: 3px 0 5px; font-size: 16px; }
.portal-deliverable-record__main > p:not(.portal-eyebrow) { margin: 0; color: var(--portal-muted-strong); }
.portal-deliverable-record__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 13px; margin-top: 10px; color: var(--portal-muted); font-size: 11px; }
.portal-deliverable-record__actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.portal-deliverable-record__actions form { margin: 0; }
.portal-library-search__field { display: block; padding: 0 20px 16px; }
.portal-library-search__field input { width: 100%; }
.portal-library-search__results { display: grid; border-top: 1px solid var(--portal-border); }
.portal-library-search__results > p { margin: 0; padding: 16px 20px; color: var(--portal-muted-strong); }
.portal-library-search__results a { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; border-bottom: 1px solid var(--portal-border); color: var(--portal-ink); text-decoration: none; }
.portal-library-search__results a:last-child { border-bottom: 0; }
.portal-library-search__results a:hover { background: #f8fafc; }
.portal-library-search__results a span:first-child { display: grid; gap: 3px; }
.portal-library-search__results a small { color: var(--portal-muted-strong); }

.portal-delivery-safeguards { margin-bottom: 16px; }
.portal-delivery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.portal-delivery-grid__wide { grid-column: 1 / -1; }
.portal-empty-state--compact { min-height: 150px; padding: 22px; }
.portal-inline-confirm { display: grid; justify-items: end; gap: 8px; }
.portal-delivery-recovery { margin-bottom: 16px; border-color: #efcca5; }
.portal-delivery-details { display: grid; margin: 0; }
.portal-delivery-details div { display: grid; grid-template-columns: minmax(110px, .7fr) minmax(0, 1.3fr); gap: 14px; padding: 12px 20px; border-top: 1px solid var(--portal-border); }
.portal-delivery-details div:first-child { border-top: 0; }
.portal-delivery-details dt { color: var(--portal-muted); font-size: 10px; font-weight: 700; }
.portal-delivery-details dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: var(--portal-ink-soft); font-size: 11px; text-align: right; }
.portal-delivery-timeline { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.portal-delivery-timeline li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; padding: 16px 20px; border-top: 1px solid var(--portal-border); }
.portal-delivery-timeline li:first-child { border-top: 0; }
.portal-delivery-timeline p { margin: 4px 0; color: var(--portal-muted-strong); font-size: 11px; }
.portal-delivery-timeline small { color: var(--portal-muted); font-size: 9px; }
.portal-notification-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(310px, .7fr); gap: 16px; }
.portal-notification-record.is-unread { background: #f7fbff; box-shadow: inset 3px 0 0 var(--portal-blue); }
.portal-notification-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.portal-notification-actions form { margin: 0; }
.portal-preference-list { display: grid; gap: 10px; }
.portal-preference-list label { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; padding: 12px; border: 1px solid var(--portal-border); border-radius: 11px; background: var(--portal-panel-subtle); }
.portal-preference-list input { width: 17px; height: 17px; margin: 2px 0 0; }
.portal-preference-list span { display: grid; gap: 2px; }
.portal-preference-list strong { font-size: 12px; }
.portal-preference-list small { color: var(--portal-muted); font-size: 10px; }

.portal-command { width: min(680px, calc(100% - 30px)); padding: 0; border: 1px solid var(--portal-border); border-radius: 18px; background: #fff; box-shadow: 0 30px 100px rgba(5,13,25,.28); }
.portal-command::backdrop { background: rgba(3,10,19,.62); backdrop-filter: blur(4px); }
.portal-command__head { display: flex; align-items: flex-start; justify-content: space-between; padding: 20px; border-bottom: 1px solid var(--portal-border); }
.portal-command__head h2 { margin-bottom: 0; font-size: 1.35rem; }
.portal-icon-button { min-height: 34px; padding: 6px 10px; border: 1px solid var(--portal-border); border-radius: 8px; background: #fff; color: var(--portal-muted-strong); font-size: 10px; font-weight: 700; }
.portal-command__search { display: block; padding: 16px 20px 8px; }
.portal-command__search input { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid var(--portal-border-strong); border-radius: 11px; background: var(--portal-surface); font-size: 14px; }
.portal-command__hint { margin: 0; padding: 0 20px 12px; color: var(--portal-muted); font-size: 9px; }
.portal-command__results { min-height: 140px; max-height: 380px; overflow-y: auto; padding: 8px 12px 14px; }
.portal-command__results > p { padding: 20px 8px; color: var(--portal-muted); text-align: center; }
.portal-command-result { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 12px; border-radius: 10px; text-decoration: none; }
.portal-command-result:hover, .portal-command-result:focus { background: var(--portal-info-bg); }
.portal-command-result strong { display: block; font-size: 12px; }
.portal-command-result small { display: block; color: var(--portal-muted); font-size: 9px; }
.portal-command-result span { color: var(--portal-blue-dark); font-size: 10px; font-weight: 700; }

.portal-toast { position: fixed; right: 20px; bottom: 20px; z-index: 1000; width: min(390px, calc(100% - 40px)); padding: 13px 15px; border: 1px solid #b9d3f4; border-radius: 12px; background: #f2f7ff; box-shadow: var(--portal-shadow); color: var(--portal-muted-strong); font-size: 11px; }

.portal-public-body { min-height: 100dvh; background: radial-gradient(circle at 15% 0, rgba(52,224,255,.12), transparent 28%), var(--portal-navy); color: #d8e5f5; }
.portal-public-header { display: flex; min-height: 76px; align-items: center; justify-content: space-between; padding: 0 clamp(20px, 5vw, 72px); border-bottom: 1px solid rgba(255,255,255,.09); }
.portal-public-header .portal-wordmark { color: #fff; }
.portal-public-header .portal-button { border-color: rgba(255,255,255,.2); color: #fff; }
.portal-public-main { display: grid; min-height: calc(100dvh - 126px); place-items: center; padding: 32px 20px; }
.portal-public-main > * { width: min(620px, 100%); }
.portal-public-main .portal-card, .portal-public-main .portal-panel { padding: clamp(24px, 5vw, 44px); border: 1px solid rgba(255,255,255,.12); border-radius: 20px; background: rgba(255,255,255,.07); box-shadow: 0 30px 90px rgba(0,0,0,.2); }
.portal-public-main h1, .portal-public-main h2, .portal-public-main h3 { color: #fff; }
.portal-public-main .portal-muted, .portal-public-main p { color: #aebfd3; }
.portal-public-footer { display: flex; min-height: 50px; align-items: center; justify-content: center; gap: 20px; padding: 12px 20px; border-top: 1px solid rgba(255,255,255,.09); }
.portal-public-footer a { color: #aebfd3; font-size: 12px; font-weight: 650; text-decoration: none; }
.portal-public-footer a:hover, .portal-public-footer a:focus-visible { color: #fff; text-decoration: underline; }

.portal-auth-card { max-width: 560px; }
.portal-auth-card > h1 { margin-bottom: 12px; }
.portal-auth-card > .portal-form { margin: 22px -20px -20px; }
.portal-auth-card .portal-field + .portal-field { margin-top: 14px; }
.portal-auth-card .portal-field > span { color: #dce8f6; font-size: 11px; font-weight: 750; }
.portal-auth-card .portal-field-help { margin: 12px 0 0; color: #9fb2c8; font-size: 11px; }
.portal-auth-card .portal-form-actions a:not(.portal-button) { align-self: center; color: #b9d7ff; font-size: 12px; font-weight: 700; }
.portal-form-actions--between { align-items: center; justify-content: space-between; }
.portal-auth-social { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 22px; }
.portal-auth-social form { margin: 0; }
.portal-button--social { width: 100%; min-height: 46px; border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: #fff; }
.portal-button--social:hover { border-color: rgba(52,224,255,.62); background: rgba(52,224,255,.1); }
.portal-auth-divider { display: flex; align-items: center; gap: 12px; margin: 22px 0 0; color: #8fa3bb; font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.portal-auth-divider::before, .portal-auth-divider::after { height: 1px; flex: 1; background: rgba(255,255,255,.12); content: ""; }
.portal-auth-security-note, .portal-auth-help, .portal-auth-destination { margin: 22px 0 0 !important; font-size: 11px; }
.portal-auth-card .portal-notice { color: var(--portal-ink); }
.portal-code-input { font-family: "JetBrains Mono", ui-monospace, monospace !important; font-size: 1.35rem !important; font-weight: 700; letter-spacing: .34em; text-align: center; }

@media (max-width: 560px) {
    .portal-auth-social { grid-template-columns: 1fr; }
    .portal-auth-card > .portal-form { margin-inline: -16px; }
    .portal-form-actions--between { align-items: stretch; }
}

[dir="rtl"] .portal-sidebar { border-right: 0; border-left: 1px solid rgba(255,255,255,.08); }
[dir="rtl"] .portal-nav__item.is-active::before { right: 0; left: auto; }
[dir="rtl"] .portal-user-menu { right: auto; left: 0; }
[dir="rtl"] .portal-record__action span { transform: scaleX(-1); }
[dir="rtl"] .portal-record__meta li:not(:first-child)::before { margin-right: 0; margin-left: 7px; }
[dir="rtl"] .portal-record-list--timeline { padding-right: 22px; padding-left: 0; }
[dir="rtl"] .portal-record-list--timeline::before { right: 24px; left: auto; }
[dir="rtl"] .portal-record-list--timeline .portal-record::before { right: -4px; left: auto; }
[dir="rtl"] .portal-table-scroll caption, [dir="rtl"] .portal-table-scroll th:first-child, [dir="rtl"] .portal-table-scroll td:first-child { text-align: right; }

@media (max-width: 1100px) {
    .portal-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-user-trigger__text { display: none; }
    .portal-content { padding-inline: 24px; }
}

@media (max-width: 820px) {
    .portal-app { display: block; }
    .portal-sidebar { position: fixed; inset: 0 auto 0 0; width: min(var(--portal-sidebar), calc(100% - 54px)); transform: translateX(-105%); transition: transform .2s ease; box-shadow: 20px 0 60px rgba(0,0,0,.24); }
    .portal-app.is-menu-open .portal-sidebar { transform: translateX(0); }
    .portal-app.is-menu-open::after { position: fixed; inset: 0; z-index: 45; background: rgba(3,10,19,.55); content: ""; }
    [dir="rtl"] .portal-sidebar { inset: 0 0 0 auto; transform: translateX(105%); }
    [dir="rtl"] .portal-app.is-menu-open .portal-sidebar { transform: translateX(0); }
    .portal-mobile-menu { display: block; }
    .portal-topbar { padding-inline: 18px; }
    .portal-context { margin-right: auto; }
    [dir="rtl"] .portal-context { margin-right: 0; margin-left: auto; }
    .portal-page-header { align-items: flex-start; flex-direction: column; }
    .portal-page-actions { justify-content: flex-start; }
    .portal-delivery-grid { grid-template-columns: 1fr; }
    .portal-delivery-grid__wide { grid-column: auto; }
    .portal-notification-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
    :root { --portal-topbar: 66px; }
    body { font-size: 13px; }
    .portal-topbar { gap: 10px; padding-inline: 12px; }
    .portal-context__mark { display: none; }
    .portal-context strong { max-width: 150px; }
    .portal-topbar__link { display: none; }
    .portal-content { padding: 24px 14px 60px; }
    .portal-page-header { gap: 18px; margin-bottom: 18px; }
    .portal-page-header__copy > p:last-child { font-size: 13px; }
    .portal-page-actions { width: 100%; }
    .portal-page-actions .portal-button { flex: 1 1 auto; }
    .portal-metrics { grid-template-columns: 1fr 1fr; gap: 8px; }
    .portal-metric { padding: 14px; }
    .portal-metric strong { font-size: 1.25rem; }
    .portal-section-heading { display: grid; padding: 16px; }
    .portal-record { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 14px 16px; }
    .portal-record:has(.portal-record__leading),
    .portal-record:has(.portal-record__swatch) { grid-template-columns: auto minmax(0, 1fr); }
    .portal-record:has(.portal-record__leading) .portal-record__action,
    .portal-record:has(.portal-record__swatch) .portal-record__action { grid-column: 2; }
    .portal-record__action { justify-self: start; }
    .portal-record__title-row { display: grid; }
    .portal-status { justify-self: start; }
    .portal-card-grid { grid-template-columns: 1fr; padding: 12px; }
    .portal-checklist { grid-template-columns: 1fr; padding-inline: 12px; }
    .portal-chart { padding: 12px; }
    .portal-chart canvas { height: 230px; }
    .portal-chart__meta { display: grid; }
    .portal-form { padding: 16px; }
    .portal-form-grid { grid-template-columns: 1fr; }
    .portal-field--wide { grid-column: auto; }
    .portal-audit-toolbar, .portal-pagination { align-items: stretch; flex-direction: column; }
    .portal-form-actions { flex-direction: column-reverse; }
    .portal-form-actions .portal-button { width: 100%; }
    .portal-callout { align-items: stretch; flex-direction: column; margin: 14px; }
    .portal-callout .portal-form-actions { width: 100%; }
    .portal-publication-form { margin: 14px; }
    .portal-metrics--three { margin: 14px; }
    .portal-request-workbench, .portal-request-workflow { grid-template-columns: 1fr; }
    .portal-request-workbench > :last-child { grid-column: auto; }
    .portal-request-workflow > form + form { border-top: 1px solid var(--portal-border); border-left: 0; }
    .portal-upload-status > div:first-child { display: grid; gap: 4px; }
    .portal-deliverable-record { align-items: stretch; flex-direction: column; }
    .portal-deliverable-record__actions { justify-content: stretch; }
    .portal-deliverable-record__actions .portal-button, .portal-deliverable-record__actions form { width: 100%; }
    .portal-inline-confirm { justify-items: start; }
    .portal-delivery-details div { grid-template-columns: 1fr; gap: 4px; padding-inline: 16px; }
    .portal-delivery-details dd { text-align: left; }
    .portal-delivery-timeline li { grid-template-columns: 1fr; padding: 14px 16px; }
}

@media (max-width: 420px) {
    .portal-context strong { max-width: 90px; }
    .portal-topbar__actions { gap: 6px; }
}

.portal-filter-bar { display: flex; align-items: end; gap: 10px; padding: 0 20px 18px; border-bottom: 1px solid var(--portal-border); }
.portal-filter-bar .portal-field { flex: 1 1 260px; max-width: 440px; }
.portal-context-nav { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; padding: 8px 10px; overflow-x: auto; border: 1px solid var(--portal-border); border-radius: 12px; background: #fff; box-shadow: 0 2px 8px rgba(16,24,40,.04); }
.portal-context-nav__label { flex: none; padding: 0 6px; color: var(--portal-muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.portal-context-nav > div { display: flex; min-width: max-content; gap: 2px; }
.portal-context-nav a { padding: 8px 11px; border-radius: 8px; color: var(--portal-muted-strong); font-size: 11px; font-weight: 700; text-decoration: none; }
.portal-context-nav a:hover { background: var(--portal-panel-subtle); color: var(--portal-ink); }
.portal-context-nav a.is-active { background: var(--portal-navy); color: #fff; }
.portal-confirmation { display: flex; align-items: flex-start; gap: 9px; padding: 12px; border: 1px solid #e3c071; border-radius: 9px; background: var(--portal-warning-bg); color: var(--portal-warning); font-size: 12px; font-weight: 650; line-height: 1.5; }
.portal-confirmation input { margin-top: 3px; flex: none; }
.portal-access-state { margin-bottom: 18px; }
.portal-access-state .portal-empty-state { min-height: 360px; }
.portal-access-state .portal-page-actions { justify-content: center; }
.portal-detail-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr); gap: 18px; }
.portal-definition-list { margin: 0; padding: 0 20px 20px; }
.portal-definition-list > div { display: grid; grid-template-columns: minmax(130px, .42fr) minmax(0, 1fr); gap: 18px; padding: 13px 0; border-top: 1px solid var(--portal-border); }
.portal-definition-list dt { color: var(--portal-muted-strong); font-size: 11px; font-weight: 750; }
.portal-definition-list dt small { display: block; margin-top: 3px; color: var(--portal-muted); font-weight: 500; }
.portal-definition-list dd { min-width: 0; margin: 0; color: var(--portal-ink); overflow-wrap: anywhere; }
.portal-preserve-lines { white-space: pre-wrap; }
.portal-break-all { word-break: break-all; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; }

@media (max-width: 820px) {
    .portal-detail-grid { grid-template-columns: 1fr; }
    .portal-filter-bar { align-items: stretch; flex-direction: column; }
    .portal-filter-bar .portal-field { max-width: none; }
    .portal-context-nav { align-items: flex-start; flex-direction: column; }
    .portal-definition-list > div { grid-template-columns: 1fr; gap: 4px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

@media print {
    .portal-sidebar, .portal-topbar, .portal-page-actions, .portal-command, .portal-toast { display: none !important; }
    .portal-app { display: block; }
    .portal-content { width: 100%; padding: 0; }
    .portal-panel, .portal-metric { break-inside: avoid; box-shadow: none; }
}

/* BytesGlue-owned authentication suite. Cognito remains the identity engine,
   but every application-owned state renders through this shell. */
.auth-body {
    --auth-accent: #8cc3ff;
    --auth-action: #1d6fe0;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    background:
        radial-gradient(1100px 720px at 78% -12%, rgba(46,139,255,.16), transparent 62%),
        linear-gradient(180deg, #0a1322 0%, #071120 100%);
    color: #f2f7ff;
    font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
}
.auth-body--operations {
    --auth-accent: #9fb0c7;
    background:
        radial-gradient(rgba(148,173,208,.09) 1px, transparent 1.5px),
        radial-gradient(900px 620px at 50% -25%, rgba(46,139,255,.12), transparent 60%),
        #060d19;
    background-size: 26px 26px, auto, auto;
}
.auth-body--studio {
    --auth-accent: #5fe6ff;
    background:
        radial-gradient(1000px 640px at 85% 112%, rgba(52,224,255,.13), transparent 55%),
        radial-gradient(1100px 700px at 72% -15%, rgba(46,139,255,.15), transparent 60%),
        #081120;
}
.auth-header {
    min-height: 78px;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 48px;
}
.auth-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #f2f7ff;
    font-family: "Space Grotesk", "Inter", sans-serif;
    font-size: 18.5px;
    font-weight: 600;
    letter-spacing: .01em;
    text-decoration: none;
}
.auth-brand img { width: 26px; height: 26px; object-fit: contain; }
.auth-product-badge {
    padding: 6px 12px;
    border: 1px solid color-mix(in srgb, var(--auth-accent) 38%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--auth-accent) 8%, transparent);
    color: var(--auth-accent);
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    white-space: nowrap;
}
.auth-main {
    width: 100%;
    min-height: 0;
    display: grid;
    flex: 1 0 auto;
    place-items: center;
    padding: 36px clamp(24px, 6.6vw, 96px) 44px;
}
.auth-main > .auth-card { width: min(492px, 100%); }
.auth-composition {
    width: min(1028px, 100%);
    display: grid;
    grid-template-columns: minmax(400px, 464px) minmax(330px, 420px);
    gap: clamp(54px, 7vw, 100px);
    align-items: center;
    justify-content: center;
}
.auth-composition--admin { width: min(464px, 100%); grid-template-columns: minmax(0, 464px); }
.auth-card {
    min-width: 0;
    padding: 34px 40px 28px;
    border: 1px solid rgba(9,17,35,.06);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 24px 64px -16px rgba(3,10,27,.58);
    color: #0a0f1c;
}
.auth-card--password { width: min(492px, 100%) !important; }
.auth-card h1, .auth-card h2, .auth-card h3 { color: #0a0f1c; }
.auth-card__heading { display: grid; gap: 8px; margin-bottom: 18px; }
.auth-card__heading h1 {
    margin: 0;
    font-size: 25px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -.01em;
}
.auth-card__heading p:not(.auth-eyebrow) { margin: 0; color: #46566e; font-size: 14.5px; line-height: 1.55; }
.auth-eyebrow {
    margin: 0;
    color: #1758bd;
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: .14em;
    line-height: 1.4;
}
.auth-body--studio .auth-eyebrow { color: #0e7490; }
.auth-form { display: grid; gap: 16px; margin: 0; padding: 0; }
.auth-field { display: grid; gap: 6px; min-width: 0; color: #232f45; font-size: 13px; font-weight: 600; }
.auth-field__label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
.auth-field a, .auth-center-link, .auth-card__foot a { color: #1758bd; font-weight: 500; text-decoration: none; }
.auth-field a { padding-block: 4px; font-size: 13px; }
.auth-field a:hover, .auth-center-link:hover, .auth-card__foot a:hover { text-decoration: underline; text-underline-offset: 3px; }
.auth-field input {
    width: 100%;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid #b6c2d6;
    border-radius: 10px;
    background: #fff;
    color: #0a0f1c;
    font-size: 15px;
    font-weight: 400;
    box-shadow: 0 1px 0 rgba(10,15,28,.02);
}
.auth-field input[dir="ltr"], .auth-field input[type="email"], .auth-field input[type="password"], .auth-code-input { direction: ltr; text-align: left; }
.auth-field input:hover { border-color: #92a2b8; }
.auth-field input:focus-visible {
    outline: 0;
    border-color: #1d6fe0;
    box-shadow: 0 0 0 3px rgba(46,139,255,.24);
}
.auth-password-control { position: relative; display: block; }
.auth-password-control input { padding-inline-end: 68px; }
.auth-password-control button {
    position: absolute;
    top: 6px;
    inset-inline-end: 6px;
    min-width: 50px;
    height: 32px;
    padding: 0 10px;
    border: 0;
    border-radius: 7px;
    background: #edf2fa;
    color: #233855;
    font-size: 12.5px;
    font-weight: 600;
}
.auth-password-control button:hover { background: #dfe8f5; }
.auth-primary-button, .auth-secondary-button, .auth-danger-button {
    width: 100%;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 9px 16px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
}
.auth-primary-button { border: 1px solid var(--auth-action); background: var(--auth-action); color: #fff; }
.auth-primary-button:hover { border-color: #1861cb; background: #1861cb; }
.auth-primary-button:active { border-color: #1456b4; background: #1456b4; }
.auth-primary-button:disabled { opacity: .76; cursor: wait; }
.auth-secondary-button { border: 1px solid #b6c2d6; background: #fff; color: #16233b; }
.auth-secondary-button:hover { background: #f4f7fc; }
.auth-danger-button { border: 1.5px solid #c0281c; background: #fff; color: #8e2016; }
.auth-center-link { justify-self: center; padding: 3px; font-size: 13.5px; }
.auth-field-help, .auth-privacy-note { margin: 0; color: #5a6b85; font-size: 12.5px; font-weight: 400; line-height: 1.55; }
.auth-privacy-note { margin-top: 16px; padding-top: 14px; border-top: 1px solid #e7edf6; }
.auth-validation { padding: 11px 13px; border: 1px solid #f3b7b2; border-radius: 10px; background: #fef2f1; color: #8e2016; font-size: 13px; line-height: 1.5; }
.auth-validation:empty, .auth-validation.validation-summary-valid { display: none; }
.auth-validation ul { margin: 0; padding-inline-start: 20px; }
.auth-notice {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px solid;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.5;
}
.auth-notice__icon { width: 17px; height: 17px; flex: 0 0 17px; margin-top: 1px; border-radius: 50%; color: #fff; font-size: 11px; font-weight: 700; line-height: 17px; text-align: center; }
.auth-notice--danger { border-color: #f3b7b2; background: #fef2f1; color: #8e2016; }
.auth-notice--danger .auth-notice__icon { background: #c0281c; }
.auth-notice--warning { border-color: #f2dca8; background: #fff8eb; color: #7a4d08; }
.auth-notice--warning .auth-notice__icon { background: #b54708; }
.auth-notice--success { border-color: #b4e6c8; background: #edfbf2; color: #085d3a; }
.auth-notice--success .auth-notice__icon { background: #0c7a48; }
.auth-notice--info { border-color: #c4dafb; background: #eff5ff; color: #1b4b9e; }
.auth-notice--info .auth-notice__icon { background: #2867bd; }
.auth-social { display: grid; gap: 10px; margin: 0 0 18px; }
.auth-social form { margin: 0; }
.auth-social > p { margin: 0; color: #68788f; font-size: 12.5px; line-height: 1.5; text-align: center; }
.auth-provider-button {
    width: 100%;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #bfcBDD;
    border-radius: 10px;
    background: #fff;
    color: #101b30;
    font-size: 15px;
    font-weight: 500;
}
.auth-provider-button:hover { border-color: #8f9db2; background: #f9fbfd; }
.auth-provider-icon { flex: 0 0 18px; }
.auth-microsoft-icon { width: 17px; height: 17px; display: grid; flex: 0 0 17px; grid-template-columns: 1fr 1fr; gap: 1px; }
.auth-microsoft-icon i:nth-child(1) { background: #f25022; }
.auth-microsoft-icon i:nth-child(2) { background: #7fba00; }
.auth-microsoft-icon i:nth-child(3) { background: #00a4ef; }
.auth-microsoft-icon i:nth-child(4) { background: #ffb900; }
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; color: #68788f; font-size: 12.5px; font-weight: 500; }
.auth-divider::before, .auth-divider::after { height: 1px; flex: 1; background: #dce3ef; content: ""; }
.auth-card__foot { display: grid; gap: 8px; margin-top: 18px; padding-top: 14px; border-top: 1px solid #e7edf6; }
.auth-card__foot p { margin: 0; color: #68788f; font-size: 12.5px; line-height: 1.6; }
.auth-card__foot a { font-size: 13px; }
.auth-security-note { display: grid; gap: 4px; margin-top: 18px; padding: 12px 14px; border-radius: 10px; background: #f4f8fd; }
.auth-security-note span { color: #5a6b85; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px; font-weight: 600; letter-spacing: .12em; }
.auth-security-note p { margin: 0; color: #3a4a63; font-size: 13px; line-height: 1.6; }
.auth-security-note--compact { margin-top: 16px; }
.auth-destination { margin: -4px 0 16px; color: #46566e; font-size: 13px; }
.auth-invited-email { display: flex; min-width: 0; align-items: center; gap: 10px; margin: 0 0 16px; padding: 11px 13px; border: 1px solid #e3eaf4; border-radius: 10px; background: #f4f8fd; }
.auth-invited-email span { flex: 0 0 auto; color: #5a6b85; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; font-weight: 600; letter-spacing: .08em; }
.auth-invited-email strong { min-width: 0; overflow: hidden; color: #16233b; font-size: 13.5px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.auth-field small { color: #68788f; font-size: 12.5px; font-weight: 400; line-height: 1.5; }
.auth-password-policy { display: grid; gap: 7px; margin: -4px 0 0; padding: 12px 14px; border: 1px solid #e7edf6; border-radius: 10px; background: #f8fafd; color: #5a6b85; font-size: 13px; font-weight: 400; line-height: 1.4; list-style: none; }
.auth-password-policy li { display: flex; gap: 8px; align-items: center; }
.auth-password-policy li > span { width: 14px; height: 14px; flex: 0 0 14px; border: 1.5px solid #b6c2d6; border-radius: 50%; }
.auth-password-policy li.is-met { color: #085d3a; }
.auth-password-policy li.is-met > span { position: relative; border-color: #0c7a48; background: #0c7a48; }
.auth-password-policy li.is-met > span::after { position: absolute; top: 2px; left: 3px; width: 6px; height: 3px; border-bottom: 1.5px solid #fff; border-left: 1.5px solid #fff; content: ""; transform: rotate(-45deg); }
.auth-card--enrollment { width: min(560px, 100%) !important; }
.auth-enrollment-grid { display: grid; grid-template-columns: 192px minmax(0, 1fr); gap: 20px; align-items: start; margin-bottom: 16px; }
.auth-qr-panel { display: grid; gap: 8px; justify-items: center; color: #68788f; font-size: 12px; }
.auth-qr-panel img { width: 172px; height: 172px; padding: 12px; border: 1px solid #d7deea; border-radius: 12px; background: #fff; image-rendering: pixelated; }
.auth-manual-key { display: grid; gap: 10px; }
.auth-manual-key > p { margin: 0; color: #3a4a63; font-size: 13px; line-height: 1.55; }
.auth-manual-key > div:not(.auth-notice) { display: flex; gap: 8px; align-items: stretch; }
.auth-manual-key code { min-width: 0; flex: 1; overflow-wrap: anywhere; padding: 11px 13px; border: 1px dashed #b9c6da; border-radius: 10px; background: #f4f7fc; color: #16233b; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; font-weight: 500; letter-spacing: .07em; line-height: 1.5; }
.auth-manual-key button { min-width: 62px; padding: 0 13px; border: 1px solid #b6c2d6; border-radius: 10px; background: #fff; color: #16233b; font-size: 13px; font-weight: 600; }
.auth-manual-key .auth-notice { margin: 0; padding: 10px 12px; font-size: 12.5px; }
.auth-enrollment-verify { margin: 0 0 12px; padding-top: 16px; border-top: 1px solid #e7edf6; }
.auth-app-list { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 16px; }
.auth-app-list span { padding: 6px 9px; border: 1px solid #dce3ef; border-radius: 999px; background: #f8fafd; color: #46566e; font-size: 11px; }
.auth-start-enrollment { margin-top: 16px; }
.auth-danger-disclosure { margin-top: 16px; border: 1px solid #f0c6c3; border-radius: 10px; background: #fffafa; }
.auth-danger-disclosure summary { padding: 12px 14px; color: #8e2016; font-size: 13px; font-weight: 600; cursor: pointer; }
.auth-danger-disclosure > div { display: grid; gap: 10px; padding: 0 14px 14px; }
.auth-danger-disclosure h2 { margin: 0; font-size: 18px; }
.auth-danger-disclosure p { margin: 0; color: #46566e; font-size: 13px; line-height: 1.55; }
.auth-status-card { width: min(440px, 100%) !important; display: grid; gap: 15px; justify-items: center; text-align: center; }
.auth-status-card--left { justify-items: stretch; text-align: left; }
.auth-status-card h1 { margin: 0; font-size: 24px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; }
.auth-status-card > p { margin: 0; color: #46566e; font-size: 14px; line-height: 1.6; }
.auth-status-card form { width: 100%; margin: 0; }
.auth-status-icon { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid; border-radius: 50%; font-size: 16px; font-weight: 700; }
.auth-status-icon--success { border-color: #b4e6c8; background: #edfbf2; color: #0c7a48; }
.auth-status-icon--warning { border-color: #f2dca8; background: #fff8eb; color: #b54708; }
.auth-status-icon--info { border-color: #c4dafb; background: #eff5ff; color: #1d6fe0; }
.auth-status-links, .auth-support-reference { width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 20px; }
.auth-status-links a, .auth-support-reference a { color: #1758bd; font-size: 13px; font-weight: 500; text-decoration: none; }
.auth-support-reference { justify-content: space-between; }
.auth-support-reference span { color: #6e82a4; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 500; }
.auth-code-input {
    min-height: 56px !important;
    padding: 0 12px 0 22px !important;
    font-family: "JetBrains Mono", ui-monospace, monospace !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    letter-spacing: .62em;
    text-align: center !important;
}
.auth-aside { display: grid; gap: 24px; color: #e8f0fb; }
.auth-aside__accent { width: 44px; height: 3px; border-radius: 2px; background: linear-gradient(90deg, #2e8bff, #34e0ff); }
.auth-aside h2 { margin: 0 0 10px; color: #e8f0fb; font-size: 24px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; }
.auth-aside p { margin: 0; color: #9fb0c7; font-size: 15px; line-height: 1.6; }
.auth-feature-list { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.auth-feature-list li { display: flex; gap: 14px; align-items: flex-start; }
.auth-feature-list li > span { width: 36px; height: 36px; display: grid; flex: 0 0 36px; place-items: center; border: 1px solid rgba(140,195,255,.28); border-radius: 10px; background: rgba(46,139,255,.1); color: #8cc3ff; font-weight: 700; }
.auth-feature-list div { display: grid; gap: 2px; }
.auth-feature-list strong { color: #dce7f5; font-size: 14.5px; font-weight: 600; }
.auth-feature-list small { color: #7e93b4; font-size: 12.5px; line-height: 1.5; }
.auth-chart-mark { display: flex !important; align-items: flex-end !important; justify-content: center !important; gap: 2px !important; }
.auth-chart-mark i { width: 3px; border-radius: 2px; background: #8cc3ff; }
.auth-chart-mark i:nth-child(1) { height: 8px; } .auth-chart-mark i:nth-child(2) { height: 13px; } .auth-chart-mark i:nth-child(3) { height: 18px; }
.auth-window-mark::before { width: 16px; height: 13px; border: 1.6px solid #8cc3ff; border-radius: 2px; content: ""; }
.auth-studio-wireframe { display: grid; gap: 10px; padding: 14px; border: 1px solid rgba(95,230,255,.22); border-radius: 14px; background: rgba(10,22,38,.7); }
.auth-studio-wireframe__bar { display: flex; align-items: center; gap: 6px; }
.auth-studio-wireframe__bar i { width: 8px; height: 8px; border-radius: 50%; background: #33445f; }
.auth-studio-wireframe__bar span { height: 16px; flex: 1; margin-inline-start: 8px; border-radius: 5px; background: #111d31; }
.auth-studio-wireframe__canvas { display: grid; grid-template-columns: 2fr 1fr; gap: 10px; }
.auth-studio-wireframe__canvas > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.auth-studio-wireframe__canvas b { height: 74px; grid-column: 1 / -1; border-radius: 8px; background: linear-gradient(120deg, rgba(46,139,255,.28), rgba(52,224,255,.14)); }
.auth-studio-wireframe__canvas span { height: 44px; border-radius: 8px; background: #111d31; }
.auth-studio-wireframe__canvas em { display: grid; place-items: center; padding: 8px; border: 1.5px dashed rgba(95,230,255,.55); border-radius: 8px; color: #5fe6ff; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10px; font-style: normal; font-weight: 600; letter-spacing: .1em; text-align: center; }
.auth-aside__note { color: #7e93b4 !important; font-size: 13px !important; }
.auth-footer {
    min-height: 68px;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 48px 22px;
    color: #9fb0c7;
    font-size: 13px;
}
.auth-footer nav { display: flex; flex-wrap: wrap; gap: 18px; font-weight: 500; }
.auth-footer a { color: #c4d4ec; font-weight: 500; text-decoration: none; }
.auth-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.auth-footer nav span { color: #5e7495; }

[dir="rtl"] .auth-body { font-family: "Noto Sans Arabic", "Inter", sans-serif; }
[dir="rtl"] .auth-brand span, [dir="rtl"] .auth-product-badge { font-family: "Space Grotesk", "Inter", sans-serif; }
[dir="rtl"] .auth-aside__accent { background: linear-gradient(270deg, #2e8bff, #34e0ff); }
[dir="rtl"] .auth-code-input { direction: ltr; }

@media (max-width: 1040px) {
    .auth-composition { grid-template-columns: minmax(380px, 464px) minmax(280px, 360px); gap: 48px; }
}
@media (max-width: 820px) {
    .auth-header { padding-inline: 28px; }
    .auth-main { align-items: start; padding: 26px 24px 40px; }
    .auth-composition { width: min(492px, 100%); grid-template-columns: 1fr; }
    .auth-aside { display: none; }
    .auth-footer { justify-content: center; padding-inline: 28px; text-align: center; }
    .auth-footer nav { justify-content: center; }
}
@media (max-width: 560px) {
    .auth-header { min-height: 66px; padding: 16px 20px 12px; }
    .auth-brand { gap: 8px; font-size: 16px; }
    .auth-brand img { width: 22px; height: 22px; }
    .auth-product-badge { max-width: 52vw; overflow: hidden; padding: 4px 8px; font-size: 9.5px; letter-spacing: .1em; text-overflow: ellipsis; }
    .auth-main { padding: 10px 16px 28px; }
    .auth-card { width: 100%; padding: 24px 20px 20px; }
    .auth-card--password { width: 100% !important; }
    .auth-card__heading { margin-bottom: 15px; }
    .auth-card__heading h1 { font-size: 22px; }
    .auth-card__heading p:not(.auth-eyebrow) { font-size: 13.5px; }
    .auth-form { gap: 13px; }
    .auth-field__label-row { align-items: flex-start; }
    .auth-footer { display: grid; gap: 10px; min-height: 0; padding: 14px 20px 22px; font-size: 12px; }
    .auth-footer nav { gap: 12px 16px; }
    .auth-code-input { font-size: 22px !important; letter-spacing: .46em; }
    .auth-enrollment-grid { grid-template-columns: 1fr; }
    .auth-manual-key > div:not(.auth-notice) { flex-direction: column; }
    .auth-manual-key button { min-height: 42px; }
}
@media (max-width: 340px) {
    .auth-header { padding-inline: 14px; }
    .auth-main { padding-inline: 10px; }
    .auth-card { padding-inline: 18px; }
    .auth-product-badge { max-width: 46vw; }
    .auth-code-input { padding-inline-start: 17px !important; font-size: 20px !important; letter-spacing: .38em; }
}
@media (forced-colors: active) {
    .auth-card, .auth-field input, .auth-provider-button, .auth-primary-button, .auth-product-badge { border: 1px solid CanvasText; }
}

/* Client domain management */
.domain-page { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; max-width: 1240px; margin: 0 auto; color: #1d2a44; }
.domain-page > * { min-width: 0; }

.domain-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  gap: 16px;
}

.domain-product-card {
  display: grid;
  align-content: start;
  gap: 10px;
}

.domain-product-card h2,
.domain-product-card p { margin: 0; }

.domain-product-price {
  color: var(--portal-accent, #2e8bff);
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  letter-spacing: -0.02em;
}
.domain-page--narrow { max-width: 960px; }
.domain-page--form { max-width: 1120px; }
.domain-page h1, .domain-page h2, .domain-page h3, .domain-page p { margin-top: 0; }
.domain-page h1 { margin-bottom: 7px; color: #0a0f1c; font-size: clamp(25px, 3vw, 34px); line-height: 1.18; letter-spacing: -.025em; }
.domain-page h2 { margin-bottom: 5px; color: #1d2a44; font-size: 17px; line-height: 1.35; }
.domain-page h3 { margin-bottom: 5px; font-size: 14px; }
.domain-page-head { display: flex; align-items: end; justify-content: space-between; gap: 28px; }
.domain-page-head > div:first-child { max-width: 760px; }
.domain-page-head p:not(.portal-eyebrow), .domain-detail-head p { margin-bottom: 0; color: #5a6b85; font-size: 14px; line-height: 1.55; }
.domain-head-actions, .domain-form-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.domain-back { width: fit-content; color: #526680; font-size: 13px; font-weight: 600; text-decoration: none; }
.domain-back:hover { color: #1d6fe0; text-decoration: underline; text-underline-offset: 3px; }
.portal-button--block { width: 100%; justify-content: center; }
.domain-notice { padding: 13px 15px; border: 1px solid; border-radius: 10px; font-size: 13px; line-height: 1.5; }
.domain-notice--success { border-color: #b9dfc9; background: #edf9f2; color: #0b6b44; }
.domain-notice--error { border-color: #ecc6c3; background: #fff7f6; color: #95261d; }
.domain-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.domain-metrics article { min-width: 0; display: grid; gap: 3px; padding: 17px 18px; border: 1px solid #dce4f2; border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(10,15,28,.03); }
.domain-metrics span, .domain-metrics small { color: #7787a1; font-size: 11px; }
.domain-metrics strong { overflow-wrap: anywhere; color: #17233a; font-size: 22px; font-weight: 650; }
.domain-attention { display: grid; grid-template-columns: minmax(260px, 1.4fr) repeat(3, minmax(170px, .8fr)); gap: 8px; align-items: stretch; padding: 10px; border: 1px solid #f0d7ac; border-radius: 12px; background: #fffaf1; }
.domain-attention > div, .domain-attention > a { min-width: 0; display: grid; gap: 3px; padding: 9px 10px; }
.domain-attention > div span, .domain-attention small { color: #79664a; font-size: 11px; }
.domain-attention a { border-left: 1px solid #efd9b7; color: #1d2a44; text-decoration: none; }
.domain-attention a span { overflow-wrap: anywhere; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; }
.domain-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.domain-toolbar label { width: min(380px, 100%); }
.domain-toolbar input, .domain-search input, .domain-page input, .domain-page select { width: 100%; min-height: 42px; padding: 9px 12px; border: 1px solid #c9d6f0; border-radius: 9px; background: #fff; color: #1d2a44; font: inherit; font-size: 13px; }
.domain-toolbar input:focus, .domain-search input:focus, .domain-page input:focus, .domain-page select:focus { border-color: #2e8bff; outline: 3px solid rgba(46,139,255,.16); outline-offset: 1px; }
.domain-toolbar > span { color: #8093b0; font-size: 12px; }
.domain-list, .domain-simple-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.domain-list > li > a { display: grid; grid-template-columns: minmax(240px, 1.4fr) minmax(150px, .75fr) minmax(180px, .8fr) auto; gap: 18px; align-items: center; padding: 17px 19px; border: 1px solid #d6e0ff; border-radius: 13px; background: #fff; color: inherit; text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.domain-list > li > a:hover { border-color: #9dbef5; box-shadow: 0 5px 18px rgba(31,89,173,.08); transform: translateY(-1px); }
.domain-list__identity { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.domain-list__identity strong { overflow-wrap: anywhere; color: #0a0f1c; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 14px; }
.domain-list a > div:not(.domain-list__identity) { min-width: 0; display: grid; gap: 4px; }
.domain-list a > div small { color: #8093b0; font-size: 10.5px; }
.domain-list a > div span { overflow-wrap: anywhere; color: #44546e; font-size: 12px; }
.domain-status { width: fit-content; display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 999px; background: #edf1f7; color: #52627a; font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.domain-status::before { width: 6px; height: 6px; border-radius: 50%; background: currentColor; content: ""; }
.domain-status--active { background: #e3f4ea; color: #0b6b44; }
.domain-status--actionrequired, .domain-status--expired, .domain-status--unavailable { background: #feebe9; color: #a4372c; }
.domain-status--processing, .domain-status--transferringin, .domain-status--transferringout { background: #e7f0ff; color: #1d6fe0; }
.domain-empty { display: grid; justify-items: center; gap: 9px; padding: 48px 24px; border: 1px dashed #c9d6f0; border-radius: 14px; background: #fbfcff; text-align: center; }
.domain-empty p { max-width: 620px; margin-bottom: 6px; color: #5a6b85; font-size: 13px; line-height: 1.6; }
.domain-empty > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; }
.domain-empty__mark { width: 48px; height: 48px; display: grid !important; place-items: center; border: 1px solid #bcd4fa; border-radius: 13px; background: #edf5ff; color: #1d6fe0; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; font-weight: 700; }
.domain-empty--small { padding: 24px; }
.domain-advanced-card, .domain-guided-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 18px; border: 1px solid #d6e0ff; border-radius: 12px; background: #f8faff; }
.domain-advanced-card p, .domain-guided-card p { margin: 3px 0 0; color: #5a6b85; font-size: 12px; line-height: 1.5; }
.domain-guided-card > div { display: flex; align-items: center; gap: 14px; }
.domain-guided-card__mark { width: 44px; height: 44px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 11px; background: #e7f0ff; color: #1d6fe0; font-size: 11px; font-weight: 700; }
.domain-registrar-note { margin: -5px 0 0; color: #8093b0; font-size: 11.5px; }
.domain-search { display: grid; gap: 7px; padding: 22px; border: 1px solid #d6e0ff; border-radius: 13px; background: linear-gradient(135deg, #f5f9ff, #fff); }
.domain-search > label, .domain-page label { color: #1d2a44; font-size: 12px; font-weight: 650; }
.domain-search > div { display: grid; grid-template-columns: 1fr auto; gap: 9px; }
.domain-search input { min-height: 48px; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 14px; }
.domain-search small, .domain-page label > small { color: #8093b0; font-size: 11px; font-weight: 400; line-height: 1.5; }
.domain-results { display: grid; gap: 9px; }
.domain-results > p { margin-bottom: 2px; color: #8093b0; font-size: 11.5px; }
.domain-results article { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(160px, auto) auto; gap: 18px; align-items: center; padding: 16px 18px; border: 1px solid #e1e6ef; border-radius: 12px; background: #fff; }
.domain-results article.is-available { border-color: #c4ddcd; }
.domain-results article > div:first-child { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.domain-results article > div:first-child strong { overflow-wrap: anywhere; font-family: "JetBrains Mono", ui-monospace, monospace; }
.domain-results article > div:first-child small { width: 100%; color: #8093b0; }
.domain-result-price { display: grid; gap: 2px; text-align: right; }
.domain-result-price strong { font-size: 14px; }
.domain-result-price small, .domain-result-note { color: #8093b0; font-size: 10.5px; }
.domain-safety-note, .domain-warning { padding: 14px 16px; border: 1px solid #d6e0ff; border-radius: 10px; background: #f7faff; }
.domain-safety-note strong, .domain-warning strong { font-size: 12.5px; }
.domain-safety-note p, .domain-warning p { margin: 4px 0 0; color: #5a6b85; font-size: 12px; line-height: 1.6; }
.domain-warning { border-color: #f0d7ac; background: #fffaf2; }
.domain-registration-form { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 18px; align-items: start; }
.domain-form-main { display: grid; gap: 15px; }
.domain-panel { padding: 20px; border: 1px solid #d6e0ff; border-radius: 13px; background: #fff; box-shadow: 0 1px 2px rgba(10,15,28,.025); }
.domain-panel-head { display: flex; align-items: start; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.domain-panel-head p { margin: 3px 0 0; color: #8093b0; font-size: 11.5px; line-height: 1.5; }
.domain-panel-head > span { color: #8093b0; font-size: 10.5px; white-space: nowrap; }
.domain-order-domain { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #e8edf5; }
.domain-order-domain > div { display: grid; gap: 3px; }
.domain-order-domain > div:last-child { text-align: right; }
.domain-order-domain small { color: #8093b0; font-size: 10.5px; }
.domain-order-domain strong[dir="ltr"] { overflow-wrap: anywhere; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 14px; }
.domain-page label { display: grid; gap: 6px; }
.domain-page label > span:not(:empty) { color: #a4372c; font-size: 11px; font-weight: 500; }
.domain-form-grid, .domain-dns-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.domain-field-wide { grid-column: 1 / -1; }
.domain-legal-consent { padding: 18px; border: 1px solid #cdd9ec; border-radius: 12px; background: #fafcff; }
.domain-legal-consent > p { color: #5a6b85; font-size: 12px; line-height: 1.6; }
.domain-legal-consent label { display: flex; align-items: start; gap: 10px; font-weight: 500; line-height: 1.55; }
.domain-legal-consent label input { width: 17px; min-height: 17px; flex: 0 0 17px; margin-top: 2px; }
.domain-order-summary { position: sticky; top: 20px; display: grid; gap: 13px; padding: 20px; border: 1px solid #c9d6f0; border-radius: 13px; background: #f8faff; }
.domain-order-summary dl, .domain-definition-list { display: grid; gap: 0; margin: 0; }
.domain-order-summary dl > div, .domain-definition-list > div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid #e7edf6; }
.domain-order-summary dt, .domain-definition-list dt { color: #8093b0; font-size: 11.5px; }
.domain-order-summary dd, .domain-definition-list dd { margin: 0; overflow-wrap: anywhere; color: #1d2a44; font-size: 12px; font-weight: 600; text-align: right; }
.domain-order-summary > p { margin-bottom: 0; color: #5a6b85; font-size: 11.5px; line-height: 1.55; }
.domain-validation:empty { display: none; }
.domain-validation { grid-column: 1 / -1; padding: 12px 14px; border: 1px solid #ecc6c3; border-radius: 9px; background: #fff7f6; color: #95261d; font-size: 12px; }
.domain-progress { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0; padding: 20px; border: 1px solid #d6e0ff; border-radius: 13px; background: #fff; list-style: none; }
.domain-progress li { position: relative; display: grid; gap: 5px; padding: 26px 14px 0 0; color: #8093b0; }
.domain-progress li::before { position: absolute; top: 4px; left: 0; width: 13px; height: 13px; border: 2px solid #c7d1e2; border-radius: 50%; background: #fff; content: ""; }
.domain-progress li:not(:last-child)::after { position: absolute; top: 11px; left: 15px; right: 2px; height: 2px; background: #dfe6f1; content: ""; }
.domain-progress li.is-complete::before { border-color: #18a15c; background: #18a15c; }
.domain-progress li.is-current::before { border-color: #2e8bff; box-shadow: 0 0 0 4px rgba(46,139,255,.12); }
.domain-progress strong { font-size: 12px; }
.domain-progress small { max-width: 180px; font-size: 10.5px; line-height: 1.45; }
.domain-title-line { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.domain-title-line h1 { overflow-wrap: anywhere; font-family: "JetBrains Mono", ui-monospace, monospace; }
.domain-detail-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.domain-detail-head > div { min-width: 0; }
.domain-tabs { display: flex; gap: 3px; overflow-x: auto; border-bottom: 1px solid #d6e0ff; }
.domain-tabs a { min-height: 42px; display: flex; align-items: center; padding: 0 14px; border-bottom: 2px solid transparent; color: #5a6b85; font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.domain-tabs a:hover { color: #1d6fe0; }
.domain-tabs a.is-active { border-bottom-color: #2e8bff; color: #1d2a44; }
.domain-overview-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 16px; align-items: start; }
.domain-overview-grid > div, .domain-overview-grid > aside { display: grid; gap: 16px; }
.domain-health-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
.domain-health-grid > div { display: grid; gap: 4px; padding: 13px; border: 1px solid #e3e9f3; border-radius: 9px; background: #fbfcff; }
.domain-health-grid small { color: #8093b0; font-size: 10.5px; }
.domain-health-grid strong { font-size: 12px; }
.domain-muted { margin-bottom: 0; color: #687a95; font-size: 12px; line-height: 1.6; }
.domain-activity { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.domain-activity li { display: grid; grid-template-columns: 14px 1fr; gap: 10px; padding: 10px 0; border-top: 1px solid #edf0f5; }
.domain-activity li > span { width: 8px; height: 8px; margin-top: 4px; border: 2px solid #76a9ef; border-radius: 50%; }
.domain-activity li > div { display: grid; gap: 3px; }
.domain-activity strong { font-size: 12px; font-weight: 600; }
.domain-activity small { color: #8093b0; font-size: 10.5px; }
.domain-nameservers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.domain-nameservers li { padding: 11px 12px; border: 1px solid #e2e8f2; border-radius: 8px; background: #f8faff; overflow-wrap: anywhere; font-size: 12px; }
.domain-inline-editor { margin-top: 16px; padding: 17px; border: 1px solid #bdd2f5; border-radius: 10px; background: #f7faff; }
.domain-inline-editor[hidden] { display: none; }
.domain-inline-editor > p { color: #5a6b85; font-size: 12px; line-height: 1.55; }
.domain-dns-form { display: grid; gap: 15px; }
.domain-table-wrap { width: 100%; overflow-x: auto; }
.domain-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.domain-table th, .domain-table td { padding: 11px 9px; border-bottom: 1px solid #e8edf5; text-align: left; vertical-align: top; }
.domain-table thead th { color: #7787a1; font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: .06em; }
.domain-table tbody th { font-weight: 500; }
.domain-table code { overflow-wrap: anywhere; color: #1d2a44; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px; }
.domain-table td small { display: block; margin-top: 3px; color: #a14e0b; font-size: 9.5px; }
.domain-record-type { display: inline-flex; padding: 3px 7px; border-radius: 5px; background: #e7f0ff; color: #1d6fe0; font-size: 10px; font-weight: 700; }
.domain-record-value { display: block; max-width: 460px; }
.domain-row-actions { position: relative; }
.domain-row-actions > summary { color: #1d6fe0; font-size: 11px; font-weight: 700; cursor: pointer; list-style: none; }
.domain-row-actions > summary::-webkit-details-marker { display: none; }
.domain-row-actions > div { position: absolute; z-index: 20; top: calc(100% + 7px); right: 0; width: min(360px, 82vw); display: grid; gap: 10px; padding: 14px; border: 1px solid #c9d6f0; border-radius: 10px; background: #fff; box-shadow: 0 12px 34px rgba(10,15,28,.18); }
.domain-row-actions form:first-child { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.domain-row-actions form:first-child label:nth-of-type(3), .domain-row-actions form:first-child p, .domain-row-actions form:first-child button { grid-column: 1 / -1; }
.domain-row-actions form:first-child p { margin: 0; color: #a14e0b; font-size: 10.5px; line-height: 1.5; }
.domain-row-actions form:last-child { padding-top: 10px; border-top: 1px solid #e8edf5; }
.domain-row-actions .portal-button { width: 100%; justify-content: center; }
.domain-contact-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 16px; }
.domain-contact-card > div { padding: 13px; border: 1px solid #e4eaf4; border-radius: 9px; }
.domain-contact-card dt { color: #8093b0; font-size: 10.5px; }
.domain-contact-card dd { margin: 4px 0 0; overflow-wrap: anywhere; font-size: 12.5px; font-weight: 600; }
.domain-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.domain-choice-grid article { padding: 16px; border: 1px solid #dce4f2; border-radius: 10px; }
.domain-choice-grid article.is-selected { border-color: #72a8f3; background: #f6faff; box-shadow: inset 0 0 0 1px #72a8f3; }
.domain-choice-grid p { color: #5a6b85; font-size: 11.5px; line-height: 1.55; }
.domain-numbered { display: grid; gap: 13px; margin: 15px 0 0; padding: 0; list-style: none; }
.domain-numbered li { display: grid; grid-template-columns: 28px 1fr; gap: 11px; }
.domain-numbered li > span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; background: #e7f0ff; color: #1d6fe0; font-size: 11px; font-weight: 700; }
.domain-numbered p { margin: 3px 0 0; color: #687a95; font-size: 11.5px; line-height: 1.5; }
.domain-transfer-form { display: grid; gap: 15px; }
.domain-page textarea { width: 100%; padding: 10px 12px; border: 1px solid #c9d6f0; border-radius: 9px; background: #fff; color: #1d2a44; font: inherit; font-size: 13px; line-height: 1.5; resize: vertical; }
.domain-page textarea:focus { border-color: #2e8bff; outline: 3px solid rgba(46,139,255,.16); outline-offset: 1px; }
.domain-operation-form { display: grid; gap: 15px; }
.domain-secret-card { display: grid; gap: 12px; }
.domain-secret-card > div:first-child { display: grid; gap: 3px; }
.domain-secret-card > div:first-child small { color: #8093b0; font-size: 10.5px; }
.domain-secret-card > div:first-child strong { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 14px; }
.domain-secret-value { display: grid; grid-template-columns: 1fr auto; gap: 9px; }
.domain-secret-value input { font-family: "JetBrains Mono", ui-monospace, monospace; letter-spacing: .04em; }
.domain-secret-card > p { margin: 0; color: #687a95; font-size: 11.5px; }
.domain-queue-filters { display: flex; flex-wrap: wrap; gap: 7px; }
.domain-queue-filters a { padding: 8px 12px; border: 1px solid #cfd9e9; border-radius: 999px; background: #fff; color: #44546e; font-size: 11.5px; font-weight: 600; text-decoration: none; }
.domain-queue-filters a:hover { border-color: #87aee8; color: #1d6fe0; }
.domain-operations-table td > small { display: block; margin-top: 3px; color: #8093b0; }
.domain-operations-table a:not(.portal-button) { color: #1d6fe0; font-weight: 600; text-decoration: none; }
.domain-transfer-form label > span { color: #8093b0 !important; font-weight: 400 !important; }
.domain-simple-list li { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 0; border-bottom: 1px solid #e8edf5; }
.domain-simple-list li > div { display: grid; gap: 3px; }
.domain-simple-list strong { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; }
.domain-simple-list small { color: #8093b0; font-size: 10.5px; }
[dir="rtl"] .domain-result-price, [dir="rtl"] .domain-order-domain > div:last-child, [dir="rtl"] .domain-order-summary dd, [dir="rtl"] .domain-definition-list dd { text-align: left; }
[dir="rtl"] .domain-attention a { border-right: 1px solid #efd9b7; border-left: 0; }
[dir="rtl"] .domain-progress li { padding-inline: 0 14px; }
[dir="rtl"] .domain-progress li::before { right: 0; left: auto; }
[dir="rtl"] .domain-progress li:not(:last-child)::after { right: 15px; left: 2px; }
[dir="rtl"] .domain-row-actions > div { right: auto; left: 0; }
@media (max-width: 1080px) {
    .domain-list > li > a { grid-template-columns: minmax(220px, 1fr) minmax(150px, .8fr) auto; }
    .domain-list > li > a > div:nth-child(2) { display: none; }
    .domain-attention { grid-template-columns: 1fr 1fr; }
    .domain-attention a { border-left: 0; border-top: 1px solid #efd9b7; }
}
@media (max-width: 820px) {
    .domain-metrics { grid-template-columns: repeat(2, 1fr); }
    .domain-registration-form, .domain-overview-grid { grid-template-columns: 1fr; }
    .domain-order-summary { position: static; }
    .domain-health-grid { grid-template-columns: repeat(2, 1fr); }
    .domain-progress { grid-template-columns: 1fr; gap: 14px; }
    .domain-progress li { padding: 0 0 0 28px; }
    .domain-progress li::before { top: 1px; }
    .domain-progress li:not(:last-child)::after { top: 15px; bottom: -15px; left: 6px; width: 2px; height: auto; right: auto; }
}
@media (max-width: 660px) {
    .domain-page-head, .domain-detail-head, .domain-advanced-card, .domain-guided-card { align-items: stretch; flex-direction: column; }
    .domain-head-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .domain-head-actions .portal-button { justify-content: center; }
    .domain-list > li > a { grid-template-columns: 1fr; gap: 12px; }
    .domain-list > li > a > div:nth-child(2) { display: grid; }
    .domain-list > li > a > .portal-button { justify-content: center; }
    .domain-results article { grid-template-columns: 1fr auto; }
    .domain-results article > .portal-button, .domain-result-note { grid-column: 1 / -1; justify-content: center; }
    .domain-form-grid, .domain-dns-grid, .domain-choice-grid, .domain-contact-card, .domain-nameservers { grid-template-columns: 1fr; }
    .domain-field-wide { grid-column: auto; }
    .domain-detail-head > .portal-button { width: 100%; justify-content: center; }
}
@media (max-width: 440px) {
    .domain-metrics, .domain-attention { grid-template-columns: 1fr; }
    .domain-search > div, .domain-head-actions { grid-template-columns: 1fr; }
    .domain-search .portal-button { justify-content: center; }
    .domain-toolbar { align-items: stretch; flex-direction: column; }
    .domain-results article { grid-template-columns: 1fr; }
    .domain-result-price { text-align: left; }
    .domain-panel { padding: 16px; }
    .domain-order-domain { align-items: start; flex-direction: column; }
    .domain-order-domain > div:last-child { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
    .domain-list > li > a { transition: none; }
    .domain-list > li > a:hover { transform: none; }
}