:root {
    color-scheme: light dark;
    --surface: #f4f7fb;
    --card: #ffffff;
    --text: #182230;
    --muted: #526173;
    --accent: #2458d3;
    --border: #dce3ed;
}

@media (prefers-color-scheme: dark) {
    :root {
        --surface: #10151d;
        --card: #171e28;
        --text: #edf2f8;
        --muted: #a9b6c7;
        --accent: #85a8ff;
        --border: #2d3948;
    }
}

* { box-sizing: border-box; }

body {
    margin: 0;
    min-height: 100vh;
    background: var(--surface);
    color: var(--text);
    font-family: Inter, "Noto Sans SC", "Microsoft YaHei", sans-serif;
}

.shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 2rem;
}

.card {
    width: min(44rem, 100%);
    padding: clamp(2rem, 6vw, 4rem);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    box-shadow: 0 1.5rem 4rem rgb(15 23 42 / 10%);
}

.eyebrow {
    margin: 0 0 1rem;
    color: var(--accent);
    font-size: .75rem;
    font-weight: 750;
    letter-spacing: .18em;
}

h1 { margin: 0; font-size: clamp(2rem, 7vw, 4rem); line-height: 1.04; }
p { color: var(--muted); line-height: 1.7; }
dl { margin: 2rem 0 0; border-top: 1px solid var(--border); }
dl div { display: flex; gap: 2rem; justify-content: space-between; padding: 1rem 0; border-bottom: 1px solid var(--border); }
dt { color: var(--muted); }
dd { margin: 0; font-weight: 650; text-align: right; }

form { display: grid; gap: 1rem; margin-top: 2rem; }
label { display: grid; gap: .45rem; color: var(--muted); font-weight: 650; }
input {
    width: 100%;
    padding: .8rem .9rem;
    border: 1px solid var(--border);
    border-radius: .65rem;
    background: var(--card);
    color: var(--text);
    font: inherit;
}
button {
    width: fit-content;
    padding: .8rem 1.15rem;
    border: 0;
    border-radius: .65rem;
    background: var(--accent);
    color: #fff;
    font: inherit;
    font-weight: 750;
    cursor: pointer;
}
.notice { padding: .75rem 1rem; border-left: .25rem solid var(--accent); background: color-mix(in srgb, var(--accent) 9%, transparent); }
.notice.error { border-color: #c73535; }

/* Authentication experience: MinIO-inspired split composition with original branding. */
.auth-page {
    --auth-brand: #111827;
    --auth-brand-soft: #1f2937;
    --auth-surface: #f8fafc;
    --auth-panel: #ffffff;
    --auth-text: #111827;
    --auth-muted: #5f6b7a;
    --auth-border: #d9e0e8;
    --auth-accent: #d92d4c;
    --auth-accent-hover: #b91f3c;
    --auth-focus: #2563eb;
    --auth-success: #087f5b;
    --auth-danger: #b4233c;
    min-height: 100dvh;
    background: var(--auth-surface);
    color: var(--auth-text);
}

.auth-shell {
    min-height: 100dvh;
    display: grid;
    grid-template-columns: minmax(20rem, .92fr) minmax(28rem, 1.08fr);
}

.auth-brand {
    position: relative;
    isolation: isolate;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    overflow: hidden;
    padding: clamp(2rem, 5vw, 4.5rem);
    background:
        radial-gradient(circle at 82% 18%, rgb(217 45 76 / 28%), transparent 25rem),
        linear-gradient(145deg, var(--auth-brand), #0b1220 68%);
    color: #f8fafc;
}

.auth-brand::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(rgb(255 255 255 / 5%) 1px, transparent 1px),
        linear-gradient(90deg, rgb(255 255 255 / 5%) 1px, transparent 1px);
    background-size: 3rem 3rem;
    mask-image: linear-gradient(to bottom right, black, transparent 72%);
    content: "";
}

.auth-brand::after {
    position: absolute;
    z-index: -1;
    right: -8rem;
    bottom: -10rem;
    width: 25rem;
    aspect-ratio: 1;
    border: 1px solid rgb(255 255 255 / 12%);
    border-radius: 50%;
    box-shadow:
        0 0 0 3rem rgb(255 255 255 / 3%),
        0 0 0 7rem rgb(255 255 255 / 2%);
    content: "";
}

.auth-brand__content {
    width: min(34rem, 100%);
}

.brand-lockup {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: .85rem;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 750;
    letter-spacing: -.01em;
    text-decoration: none;
}

.brand-mark {
    width: 2.5rem;
    height: 2.5rem;
    display: grid;
    place-items: center;
    border-radius: .75rem;
    background: var(--auth-accent);
    box-shadow: 0 .5rem 1.5rem rgb(0 0 0 / 24%);
}

.brand-mark svg {
    width: 1.55rem;
    fill: none;
    stroke: #ffffff;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
}

.auth-brand__copy {
    margin-top: clamp(6rem, 20vh, 12rem);
}

.auth-kicker {
    margin: 0 0 1rem;
    color: var(--auth-accent);
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .18em;
    line-height: 1.4;
}

.auth-brand h1 {
    max-width: 12ch;
    margin: 0;
    color: #ffffff;
    font-size: clamp(2.75rem, 5vw, 4.5rem);
    font-weight: 760;
    letter-spacing: -.055em;
    line-height: 1;
}

.auth-brand__copy > p:last-child {
    max-width: 24rem;
    margin: 1.25rem 0 0;
    color: #bac5d3;
    font-size: 1rem;
    line-height: 1.75;
}

.auth-notice svg {
    flex: 0 0 auto;
    width: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.auth-form-area {
    min-width: 0;
    display: grid;
    place-items: center;
    padding: clamp(2rem, 7vw, 6rem);
    background: var(--auth-surface);
}

.auth-form-panel {
    width: min(29rem, 100%);
}

.auth-form-heading h2 {
    margin: 0;
    color: var(--auth-text);
    font-size: clamp(2rem, 4vw, 2.75rem);
    font-weight: 760;
    letter-spacing: -.04em;
    line-height: 1.08;
}

.auth-form-heading > p:last-child {
    margin: 1rem 0 0;
    color: var(--auth-muted);
    line-height: 1.65;
}

.auth-form {
    gap: 1.25rem;
    margin-top: 2rem;
}

.field {
    display: grid;
    gap: .55rem;
}

.field label {
    color: var(--auth-text);
    font-size: .875rem;
    font-weight: 700;
}

.field input {
    min-height: 3.25rem;
    padding: .8rem .95rem;
    border: 1px solid var(--auth-border);
    border-radius: .6rem;
    outline: 0;
    background: var(--auth-panel);
    color: var(--auth-text);
    box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
    transition: border-color 180ms ease, box-shadow 180ms ease;
}

.field input:hover {
    border-color: #aeb8c5;
}

.field input:focus-visible {
    border-color: var(--auth-focus);
    box-shadow: 0 0 0 3px rgb(37 99 235 / 16%);
}

.field input::placeholder {
    color: #8d99a8;
}

.field-help {
    margin: -.1rem 0 0;
    color: var(--auth-muted);
    font-size: .8rem;
    line-height: 1.5;
}

.password-field {
    position: relative;
    width: 100%;
}

.password-field input {
    padding-right: 3.5rem;
}

.password-toggle {
    position: absolute;
    z-index: 1;
    inset-block: 0;
    right: .25rem;
    width: 2.75rem;
    min-width: 2.75rem;
    height: 2.75rem;
    display: grid;
    place-items: center;
    padding: 0;
    margin: auto 0;
    border: 0;
    border-radius: .5rem;
    outline: 0;
    background: transparent;
    color: var(--auth-muted);
    cursor: pointer;
    transition: background-color 180ms ease, color 180ms ease;
}

.password-toggle:hover {
    background: #edf1f5;
    color: var(--auth-text);
}

.password-toggle:focus-visible {
    box-shadow: 0 0 0 3px rgb(37 99 235 / 20%);
}

.password-toggle svg {
    display: block;
    width: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.password-toggle .icon-eye-off,
.password-toggle[aria-pressed="true"] .icon-eye {
    display: none;
}

.password-toggle[aria-pressed="true"] .icon-eye-off {
    display: block;
}

.code-input {
    font-variant-numeric: tabular-nums;
    letter-spacing: .28em;
}

.auth-submit {
    min-height: 3.25rem;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    margin-top: .25rem;
    padding: .8rem 1.1rem;
    border-radius: .6rem;
    outline: 0;
    background: var(--auth-accent);
    box-shadow: 0 .65rem 1.5rem rgb(217 45 76 / 18%);
    transition: background-color 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.auth-submit:hover {
    background: var(--auth-accent-hover);
    box-shadow: 0 .8rem 1.75rem rgb(217 45 76 / 24%);
}

.auth-submit:focus-visible {
    box-shadow: 0 0 0 3px var(--auth-surface), 0 0 0 6px rgb(37 99 235 / 65%);
}

.auth-submit:active {
    box-shadow: 0 .35rem .8rem rgb(217 45 76 / 18%);
}

.auth-submit:disabled {
    opacity: .65;
    cursor: wait;
}

.button-spinner {
    width: 1rem;
    height: 1rem;
    display: none;
    border: 2px solid rgb(255 255 255 / 45%);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: auth-spin 700ms linear infinite;
}

.auth-submit.is-loading .button-spinner {
    display: block;
}

.auth-notice {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    margin-top: 1.5rem;
    padding: .9rem 1rem;
    border: 1px solid rgb(8 127 91 / 22%);
    border-radius: .65rem;
    background: rgb(8 127 91 / 7%);
    color: var(--auth-success);
    font-size: .875rem;
    line-height: 1.55;
}

.auth-notice--error {
    border-color: rgb(180 35 60 / 22%);
    background: rgb(180 35 60 / 7%);
    color: var(--auth-danger);
}

.brand-lockup:focus-visible {
    border-radius: .25rem;
    outline: 3px solid var(--auth-focus);
    outline-offset: 4px;
}

@keyframes auth-spin {
    to { transform: rotate(360deg); }
}

@media (max-width: 56rem) {
    .auth-shell {
        grid-template-columns: 1fr;
    }

    .auth-brand {
        min-height: auto;
        padding: 2rem clamp(1.25rem, 6vw, 3rem) 2.5rem;
    }

    .auth-brand__content {
        width: 100%;
    }

    .auth-brand__copy {
        margin-top: 3.5rem;
    }

    .auth-brand h1 {
        max-width: 16ch;
        font-size: clamp(2.25rem, 8vw, 3.75rem);
    }

    .auth-form-area {
        padding: 3.5rem clamp(1.25rem, 6vw, 3rem);
    }
}

@media (max-width: 30rem) {
    .auth-brand__copy {
        margin-top: 2.75rem;
    }

    .auth-brand h1 {
        font-size: 2.35rem;
    }

    .auth-form-area {
        place-items: start stretch;
        padding-block: 2.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .field input,
    .password-toggle,
    .auth-submit {
        transition: none;
    }

    .button-spinner {
        animation-duration: 1.4s;
    }
}

/* Platform operations console. */
.console-page {
    color-scheme: light;
    --console-bg: #f4f6f9;
    --console-surface: #ffffff;
    --console-sidebar: #0f172a;
    --console-text: #182230;
    --console-muted: #667085;
    --console-border: #e3e8ef;
    --console-primary: #3157d5;
    --console-primary-hover: #2646b5;
    --console-success: #087f5b;
    --console-warning: #a15c00;
    --console-danger: #b4233c;
    min-height: 100dvh;
    background: var(--console-bg);
    color: var(--console-text);
}

.skip-link {
    position: fixed;
    z-index: 1000;
    top: .75rem;
    left: .75rem;
    padding: .75rem 1rem;
    border-radius: .5rem;
    background: #ffffff;
    color: #111827;
    transform: translateY(-180%);
}

.skip-link:focus { transform: translateY(0); }

.console-shell {
    min-height: 100dvh;
    display: grid;
    grid-template-columns: 16.5rem minmax(0, 1fr);
}

.console-sidebar {
    position: sticky;
    top: 0;
    height: 100dvh;
    display: flex;
    flex-direction: column;
    padding: 1.5rem 1rem;
    background: var(--console-sidebar);
    color: #e7edf6;
}

.console-brand {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .25rem .5rem 1.75rem;
    color: #ffffff;
    text-decoration: none;
}

.console-brand .brand-mark { width: 2.25rem; height: 2.25rem; }
.console-brand > span:last-child,
.console-account > span:nth-child(2) { display: grid; gap: .15rem; min-width: 0; }
.console-brand strong { font-size: .9rem; }
.console-brand small,
.console-account small { color: #93a2b7; font-size: .72rem; }

.console-nav { display: grid; gap: .35rem; }
.console-nav a {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .65rem .8rem;
    border-radius: .55rem;
    color: #aebbd0;
    font-size: .9rem;
    font-weight: 650;
    text-decoration: none;
    transition: background-color 180ms ease, color 180ms ease;
}
.console-nav a:hover,
.console-nav a.is-active { background: rgb(255 255 255 / 9%); color: #ffffff; }
.console-nav svg,
.console-account svg,
.console-notice svg,
.operation-panel summary svg,
.empty-state svg {
    width: 1.25rem;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.console-account {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr) 2.75rem;
    align-items: center;
    gap: .65rem;
    margin-top: auto;
    padding: 1rem .5rem 0;
    border-top: 1px solid rgb(255 255 255 / 9%);
}
.console-account form { margin: 0; }
.account-avatar {
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: .55rem;
    background: #3157d5;
    color: #ffffff;
    font-size: .8rem;
    font-weight: 800;
}
.icon-button {
    width: 2.75rem;
    height: 2.75rem;
    display: grid;
    place-items: center;
    padding: 0;
    background: transparent;
    color: #aebbd0;
}
.icon-button:hover { background: rgb(255 255 255 / 9%); color: #ffffff; }

.console-main {
    width: min(100%, 94rem);
    min-width: 0;
    margin-inline: auto;
    padding: clamp(1.5rem, 3vw, 3rem);
}
.console-header,
.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
}
.console-header h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.04em; }
.console-header p,
.section-heading p { margin: .45rem 0 0; color: var(--console-muted); }
.console-kicker {
    margin: 0 0 .55rem !important;
    color: var(--console-primary) !important;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .16em;
}
.primary-action,
.primary-button,
.secondary-button {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .7rem 1rem;
    border-radius: .55rem;
    font-weight: 750;
    text-decoration: none;
}
.primary-action,
.primary-button { background: var(--console-primary); color: #ffffff; }
.primary-action:hover,
.primary-button:hover { background: var(--console-primary-hover); }
.secondary-button { border: 1px solid var(--console-border); background: #ffffff; color: var(--console-text); }
.secondary-button:hover { border-color: #aeb8c5; background: #f8fafc; }

.console-notice {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    margin-top: 1.5rem;
    padding: .8rem 1rem;
    border: 1px solid rgb(8 127 91 / 22%);
    border-radius: .65rem;
    background: rgb(8 127 91 / 7%);
    color: var(--console-success);
    font-size: .9rem;
}
.console-notice--error { border-color: rgb(180 35 60 / 22%); background: rgb(180 35 60 / 7%); color: var(--console-danger); }

.metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2rem;
}
.metric-card {
    display: grid;
    gap: .45rem;
    padding: 1.25rem;
    border: 1px solid var(--console-border);
    border-radius: .8rem;
    background: var(--console-surface);
    box-shadow: 0 1px 2px rgb(15 23 42 / 3%);
}
.metric-card span { color: var(--console-muted); font-size: .82rem; font-weight: 700; }
.metric-card strong { font-size: 2rem; font-variant-numeric: tabular-nums; letter-spacing: -.04em; }
.metric-card small { color: #8994a5; }
.metric-card--success strong { color: var(--console-success); }
.metric-card--warning strong { color: var(--console-warning); }

.console-section {
    scroll-margin-top: 1.5rem;
    margin-top: 2rem;
    padding: clamp(1.25rem, 2.5vw, 2rem);
    border: 1px solid var(--console-border);
    border-radius: .9rem;
    background: var(--console-surface);
}
.section-heading { align-items: center; }
.section-heading h2 { margin: 0; font-size: 1.45rem; letter-spacing: -.02em; }
.record-count { padding: .4rem .65rem; border-radius: 999px; background: #eef2ff; color: #354ec4; font-size: .78rem; font-weight: 750; }

.operation-panel { margin-top: 1.5rem; border: 1px solid var(--console-border); border-radius: .7rem; background: #f9fafc; }
.operation-panel summary {
    min-height: 4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 1rem;
    cursor: pointer;
    list-style: none;
}
.operation-panel summary::-webkit-details-marker { display: none; }
.operation-panel summary > span { display: grid; gap: .2rem; }
.operation-panel summary small { color: var(--console-muted); font-size: .78rem; }
.operation-panel[open] summary svg { transform: rotate(180deg); }

.console-form,
.compact-form { margin: 0; }
.console-form--tenant {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    padding: 1rem;
    border-top: 1px solid var(--console-border);
}
.console-page label { gap: .4rem; color: #344054; font-size: .8rem; }
.console-page input,
.console-page select {
    min-height: 2.75rem;
    width: 100%;
    padding: .65rem .75rem;
    border: 1px solid #ccd4df;
    border-radius: .5rem;
    outline: 0;
    background: #ffffff;
    color: var(--console-text);
    font: inherit;
}
.console-page input:focus-visible,
.console-page select:focus-visible { border-color: var(--console-primary); box-shadow: 0 0 0 3px rgb(49 87 213 / 16%); }
.console-page button:focus-visible,
.console-page a:focus-visible,
.operation-panel summary:focus-visible { outline: 3px solid rgb(49 87 213 / 45%); outline-offset: 2px; }
.console-form--tenant .primary-button { align-self: end; width: 100%; }
.form-guidance { align-self: end; margin: 0; color: var(--console-warning); font-size: .82rem; }
.console-page button:disabled { opacity: .45; cursor: not-allowed; }

.table-wrap { margin-top: 1.5rem; overflow-x: auto; border: 1px solid var(--console-border); border-radius: .7rem; }
.console-page table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.console-page th,
.console-page td { padding: .9rem 1rem; border-bottom: 1px solid var(--console-border); text-align: left; vertical-align: middle; }
.console-page th { background: #f8fafc; color: var(--console-muted); font-size: .75rem; letter-spacing: .03em; white-space: nowrap; }
.console-page tr:last-child td { border-bottom: 0; }
.console-page td strong,
.console-page td small { display: block; }
.console-page td small { margin-top: .2rem; color: var(--console-muted); }
.action-column { text-align: right !important; }
.tenant-actions { min-width: 13rem; text-align: right !important; }
.tenant-actions form { display: inline-flex; gap: .35rem; margin: .2rem 0 .2rem .35rem; }
.renew-form input { width: 8.8rem; min-height: 2.3rem; }
.text-button { min-height: 2.3rem; padding: .45rem .65rem; background: #eef2ff; color: #354ec4; font-size: .78rem; }
.text-button--warning { background: #fff5e6; color: #8a4d00; }
.text-button--danger { background: #fff0f2; color: var(--console-danger); }

.status-badge { display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .6rem; border-radius: 999px; background: #eef1f5; color: #475467; font-size: .75rem; font-weight: 750; white-space: nowrap; }
.status-badge::before { width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; content: ""; }
.status-badge--active { background: #e8f7f1; color: #087f5b; }
.status-badge--suspended { background: #fff5e6; color: #9a5b08; }
.status-badge--disabled { background: #fff5e6; color: #9a5b08; }
.status-badge--expired,
.status-badge--archived { background: #fff0f2; color: var(--console-danger); }
.status-badge--deleted { background: #fff0f2; color: var(--console-danger); }

.empty-state { display: grid; place-items: center; margin-top: 1.5rem; padding: 3rem 1rem; border: 1px dashed #ccd4df; border-radius: .7rem; text-align: center; }
.empty-state svg { width: 2rem; color: #8b98aa; }
.empty-state h3 { margin: .75rem 0 0; }
.empty-state p { margin: .35rem 0 0; }

.catalog-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.5rem; }
.catalog-card { padding: 1.25rem; border: 1px solid var(--console-border); border-radius: .7rem; background: #fbfcfe; }
.catalog-card--grant { grid-column: 1 / -1; }
.catalog-card h3 { margin: 0; }
.catalog-card > p { margin: .4rem 0 1rem; font-size: .85rem; }
.compact-form { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: end; gap: .75rem; }
.catalog-card:not(.catalog-card--grant) .compact-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.catalog-card:not(.catalog-card--grant) .compact-form .secondary-button { width: 100%; }
.catalog-card--grant .compact-form { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; }
.catalog-list { display: grid; gap: 0; max-height: 15rem; margin: 1.25rem 0 0; padding: 0; overflow: auto; border-top: 1px solid var(--console-border); list-style: none; }
.catalog-list li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem .25rem; border-bottom: 1px solid var(--console-border); }
.catalog-list li > span:first-child { display: grid; gap: .2rem; }
.catalog-list small { color: var(--console-muted); }
.status-dot { color: var(--console-success); font-size: .75rem; font-weight: 750; }
.catalog-empty { color: var(--console-muted); }

@media (max-width: 72rem) {
    .console-form--tenant { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 60rem) {
    .console-shell { grid-template-columns: 1fr; }
    .console-sidebar { position: static; height: auto; padding: 1rem; }
    .console-brand { padding-bottom: 1rem; }
    .console-nav { display: flex; flex-wrap: wrap; }
    .console-nav a { flex: 1 1 9rem; }
    .console-account { margin-top: 1rem; }
}

@media (max-width: 44rem) {
    .console-main { padding: 1rem; }
    .console-header,
    .section-heading { align-items: flex-start; flex-direction: column; gap: 1rem; }
    .primary-action { width: 100%; }
    .metric-grid { gap: .75rem; }
    .metric-card { padding: 1rem; }
    .console-section { padding: 1rem; }
    .console-form--tenant,
    .catalog-grid,
    .compact-form,
    .catalog-card:not(.catalog-card--grant) .compact-form,
    .catalog-card--grant .compact-form { grid-template-columns: 1fr; }
    .catalog-card--grant { grid-column: auto; }
}

@media (max-width: 25rem) {
    .metric-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .console-nav a { transition: none; }
    .operation-panel summary svg { transition: none; }
}

/* Shared authenticated workspace shell. */
.workspace-page {
    color-scheme: light;
    --console-bg: #f5f7fa;
    --console-surface: #ffffff;
    --console-sidebar: #111827;
    --console-text: #182230;
    --console-muted: #667085;
    --console-border: #e1e6ed;
    --console-primary: #3157d5;
    --console-primary-hover: #2646b5;
    --console-success: #087f5b;
    --console-warning: #9a5b08;
    --console-danger: #b4233c;
    min-height: 100dvh;
    background: var(--console-bg);
    color: var(--console-text);
}

.workspace-topbar {
    position: sticky;
    z-index: 50;
    top: 0;
    min-height: 4rem;
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr) auto;
    align-items: center;
    border-bottom: 1px solid var(--console-border);
    background: #ffffff;
    box-shadow: 0 1px 2px rgb(15 23 42 / 3%);
}

.workspace-brand {
    align-self: stretch;
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: 0 1.1rem;
    border-right: 1px solid var(--console-border);
    color: var(--console-text);
    font-size: .88rem;
    text-decoration: none;
}

.workspace-brand .brand-mark { width: 2rem; height: 2rem; border-radius: .55rem; }
.workspace-context { min-width: 0; display: grid; gap: .08rem; padding: .55rem 1.5rem; }
.workspace-context span { color: var(--console-muted); font-size: .68rem; font-weight: 700; }
.workspace-context strong { overflow: hidden; font-size: .93rem; text-overflow: ellipsis; white-space: nowrap; }

.profile-trigger {
    min-height: 4rem;
    display: grid;
    grid-template-columns: 2rem auto 1.2rem;
    align-items: center;
    gap: .65rem;
    padding: .5rem 1.25rem;
    border-left: 1px solid var(--console-border);
    color: var(--console-text);
    text-decoration: none;
}
.profile-trigger:hover { background: #f8fafc; }
.profile-trigger > span:nth-child(2) { display: grid; gap: .05rem; }
.profile-trigger strong { max-width: 12rem; overflow: hidden; font-size: .82rem; text-overflow: ellipsis; }
.profile-trigger small { color: var(--console-muted); font-size: .68rem; }
.profile-trigger svg { width: 1rem; fill: none; stroke: #98a2b3; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }

.workspace-frame { min-height: calc(100dvh - 4rem); display: grid; grid-template-columns: 15rem minmax(0, 1fr); }
.workspace-sidebar {
    position: sticky;
    top: 4rem;
    height: calc(100dvh - 4rem);
    display: flex;
    flex-direction: column;
    padding: 1rem .75rem;
    border-right: 1px solid #1f2937;
    background: var(--console-sidebar);
}
.workspace-sidebar nav { display: grid; gap: .3rem; }
.workspace-sidebar a,
.sidebar-logout {
    min-height: 2.75rem;
    width: 100%;
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .65rem .8rem;
    border-radius: .5rem;
    background: transparent;
    color: #aebbd0;
    font-size: .85rem;
    font-weight: 650;
    text-decoration: none;
    transition: background-color 180ms ease, color 180ms ease;
}
.workspace-sidebar a:hover,
.workspace-sidebar a.is-active,
.sidebar-logout:hover { background: rgb(255 255 255 / 9%); color: #ffffff; }
.workspace-sidebar svg { width: 1.2rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.workspace-sidebar form { margin: auto 0 0; }

.workspace-main { min-width: 0; padding: clamp(1.25rem, 2.5vw, 2.25rem); }
.page-title-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.page-title-row h1 { margin: 0; font-size: clamp(1.45rem, 2vw, 1.75rem); letter-spacing: -.025em; }
.page-title-row p { margin: .4rem 0 0; color: var(--console-muted); }
.page-kicker { margin: 0 0 .45rem !important; color: var(--console-primary) !important; font-size: .68rem; font-weight: 800; letter-spacing: .16em; }

.page-tabs {
    display: flex;
    gap: 1.5rem;
    margin-top: 1.5rem;
    overflow-x: auto;
    border-bottom: 1px solid var(--console-border);
    scrollbar-width: thin;
}
.page-tabs a { min-height: 2.75rem; display: inline-flex; align-items: center; gap: .4rem; border-bottom: 2px solid transparent; color: var(--console-muted); font-size: .86rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.page-tabs a:hover { color: var(--console-text); }
.page-tabs a.is-active { border-bottom-color: var(--console-primary); color: var(--console-primary); }
.page-tabs a span { min-width: 1.25rem; padding: .1rem .35rem; border-radius: 999px; background: #eef2f7; color: inherit; font-size: .68rem; text-align: center; }

.content-panel { margin-top: 1.25rem; padding: 1.25rem; border: 1px solid var(--console-border); border-radius: .75rem; background: var(--console-surface); box-shadow: 0 1px 2px rgb(15 23 42 / 3%); }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.panel-heading h2 { margin: 0; font-size: 1.1rem; }
.panel-heading p { margin: .3rem 0 0; font-size: .83rem; }
.text-link { color: var(--console-primary); font-size: .82rem; font-weight: 750; text-underline-offset: .2em; }

.operation-bar { display: flex; align-items: stretch; flex-direction: column; gap: 1rem; }
.operation-actions { width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .6rem; }
.operation-actions .primary-button,
.operation-actions .secondary-button { min-height: 2.25rem; padding: .45rem .75rem; font-size: .76rem; }
.secondary-button.is-disabled { opacity: .45; cursor: not-allowed; }

.toolbar-popover { position: relative; }
.toolbar-popover > summary { list-style: none; cursor: pointer; }
.toolbar-popover > summary::-webkit-details-marker { display: none; }
.popover-panel { position: absolute; z-index: 40; top: calc(100% + .5rem); left: 0; width: min(22rem, calc(100vw - 2rem)); padding: 1rem; border: 1px solid var(--console-border); border-radius: .65rem; background: #ffffff; box-shadow: 0 1rem 2.5rem rgb(15 23 42 / 16%); }
.operation-actions .popover-panel { right: 0; left: auto; }
.popover-panel > p { margin: .35rem 0 .8rem; font-size: .8rem; }
.popover-panel form { margin: 0 0 .75rem; }
.popover-panel input[type="file"] { padding: .45rem; }

.search-form { width: 100%; display: flex; align-items: center; gap: .5rem; margin: 0; }
.search-form > label { width: 3.25rem; flex: 0 0 3.25rem; color: var(--console-muted); font-size: .75rem; font-weight: 400; text-align: right; white-space: nowrap; }
.search-field { position: relative; width: 16rem; }
.search-field svg { position: absolute; top: 50%; left: .7rem; width: .9rem; transform: translateY(-50%); fill: none; stroke: #8491a3; stroke-linecap: round; stroke-width: 2; pointer-events: none; }
.search-field input { min-height: 2.25rem; width: 100%; padding: .45rem .7rem .45rem 2rem; border: 1px solid #ccd4df; border-radius: .5rem; outline: 0; background: #ffffff; color: var(--console-text); font-size: .82rem; }
.search-field input:focus-visible { border-color: var(--console-primary); box-shadow: 0 0 0 3px rgb(49 87 213 / 16%); }
.search-form button { min-height: 2.25rem; margin-left: auto; padding: .45rem .75rem; background: var(--console-primary); font-size: .78rem; white-space: nowrap; }
.search-form a { color: var(--console-muted); font-size: .75rem; }

.workspace-dialog {
    width: min(56rem, calc(100vw - 2rem));
    max-height: calc(100vh - 2rem);
    padding: 0;
    overflow: auto;
    border: 1px solid var(--console-border);
    border-radius: .8rem;
    background: #ffffff;
    color: var(--console-text);
    box-shadow: 0 1.5rem 4rem rgb(15 23 42 / 24%);
}
.workspace-dialog::backdrop { background: rgb(15 23 42 / 52%); backdrop-filter: blur(2px); }
.dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.25rem 1rem; border-bottom: 1px solid var(--console-border); }
.dialog-heading h2 { margin: 0; font-size: 1.2rem; }
.dialog-heading p { margin: .35rem 0 0; color: var(--console-muted); font-size: .82rem; }
.dialog-close { width: 2.5rem; height: 2.5rem; flex: 0 0 auto; display: grid; place-items: center; padding: 0; border-radius: .5rem; background: transparent; color: var(--console-muted); }
.dialog-close:hover { background: #f2f4f7; color: var(--console-text); }
.dialog-close svg { width: 1.1rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 2; }
.workspace-dialog .console-form--tenant,
.workspace-dialog .dialog-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 1.25rem; border-top: 0; }
.workspace-dialog label { display: grid; gap: .4rem; color: #344054; font-size: .8rem; }
.workspace-dialog input,
.workspace-dialog select { min-height: 2.6rem; width: 100%; padding: .55rem .7rem; border: 1px solid #ccd4df; border-radius: .55rem; outline: 0; background: #ffffff; color: var(--console-text); font: inherit; }
.workspace-dialog input:focus-visible,
.workspace-dialog select:focus-visible { border-color: var(--console-primary); box-shadow: 0 0 0 3px rgb(49 87 213 / 16%); }
.workspace-dialog .dialog-field--wide { grid-column: 1 / -1; }
.dialog-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: .6rem; padding-top: .25rem; }
.workspace-dialog .dialog-actions .primary-button { width: auto; }

.data-panel > .operation-panel { margin-top: 1rem; }
.inline-create-form { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: end; gap: .75rem; margin: 0; padding: 1rem; border-top: 1px solid var(--console-border); }
.inline-create-form .primary-button { width: 100%; }

.bulk-form { margin: 1rem 0 0; }
.bulk-bar { min-height: 3.25rem; display: flex; align-items: center; gap: 1rem; padding: .55rem .75rem; border: 1px solid var(--console-border); border-radius: .6rem .6rem 0 0; background: #f8fafc; }
.bulk-bar[hidden] { display: none; }
.bulk-bar > span { margin-right: auto; color: var(--console-muted); font-size: .8rem; }
.bulk-actions { display: flex; align-items: center; gap: .5rem; }
.bulk-bar .secondary-button,
.bulk-bar .danger-button { min-height: 2.25rem; padding: .4rem .7rem; font-size: .78rem; }
.danger-button { display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgb(180 35 60 / 24%); border-radius: .5rem; background: #fff0f2; color: var(--console-danger); font-weight: 750; }
.danger-button:hover { border-color: rgb(180 35 60 / 45%); background: #ffe4e8; }
.table-actions-heading { text-align: right; }
.row-actions { display: flex; align-items: center; justify-content: flex-end; gap: .35rem; white-space: nowrap; }
.row-actions form { margin: 0; }
.dialog-content { padding: 1.25rem; border-top: 1px solid var(--console-border); }
.dialog-actions--standalone { padding: 0 1.25rem 1.25rem; }
.detail-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin: 0 0 1rem; }
.detail-list div { padding: .75rem; border: 1px solid var(--console-border); border-radius: .6rem; background: #f8fafc; }
.detail-list dt { color: var(--console-muted); font-size: .74rem; }
.detail-list dd { margin: .25rem 0 0; font-size: .86rem; font-weight: 700; }
.granted-feature-list { display: flex; flex-wrap: wrap; gap: .45rem; }
.granted-feature-list span { padding: .3rem .55rem; border-radius: 999px; background: #eef2ff; color: #354ec4; font-size: .75rem; }
.granted-feature-list p { margin: 0; color: var(--console-muted); font-size: .82rem; }

.feature-tree { display: grid; gap: .65rem; margin-top: 1.25rem; }
.feature-tree__group { overflow: hidden; border: 1px solid var(--console-border); border-radius: .7rem; background: #fff; }
.feature-tree__group summary { min-height: 3.5rem; display: grid; grid-template-columns: 1.25rem minmax(12rem, 1fr) auto auto; align-items: center; gap: .75rem; padding: .65rem .9rem; cursor: pointer; list-style: none; }
.feature-tree__group summary::-webkit-details-marker,
.permission-tree__group summary::-webkit-details-marker { display: none; }
.feature-tree__group summary:hover { background: #f8fafc; }
.feature-tree__group summary:focus-visible { outline: 3px solid rgb(49 87 213 / 20%); outline-offset: -3px; }
.tree-chevron { width: 1.15rem; height: 1.15rem; display: inline-flex; transition: transform 180ms ease; }
.tree-chevron svg { width: 100%; fill: none; stroke: currentColor; stroke-width: 2; }
.feature-tree__group[open] .tree-chevron { transform: rotate(90deg); }
.feature-tree__title { display: grid; gap: .12rem; }
.feature-tree__title strong { font-size: .84rem; }
.feature-tree__title small { color: var(--console-muted); font-size: .72rem; }
.tree-type { padding: .2rem .45rem; border-radius: .4rem; background: #eef2ff; color: #354ec4; font-size: .7rem; }
.tree-count { color: var(--console-muted); font-size: .75rem; white-space: nowrap; }
.feature-tree__children { border-top: 1px solid var(--console-border); background: #fbfcfe; }
.feature-tree__row { min-height: 3rem; display: grid; grid-template-columns: 1.25rem minmax(12rem, 1fr) minmax(6rem, .35fr) auto; align-items: center; gap: .75rem; padding: .55rem .9rem .55rem 2.15rem; border-bottom: 1px solid #edf0f5; font-size: .8rem; }
.feature-tree__row:last-child { border-bottom: 0; }
.feature-tree__row > span:nth-child(2) { display: grid; gap: .1rem; }
.feature-tree__row small { color: var(--console-muted); font-size: .7rem; }
.tree-branch { height: 1rem; border-left: 1px solid #cbd3df; border-bottom: 1px solid #cbd3df; }
.feature-tree__empty { padding: 1rem 2.15rem; color: var(--console-muted); font-size: .8rem; }
.tree-summary { min-height: 3.5rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: .75rem; padding: .75rem; color: var(--console-muted); font-size: .78rem; }

.workspace-dialog .dialog-form--tree { grid-template-columns: 1fr; }
.permission-tree { max-height: min(55vh, 34rem); overflow-y: auto; display: grid; gap: .5rem; padding-right: .2rem; }
.permission-tree__group { border: 1px solid var(--console-border); border-radius: .6rem; background: #fff; }
.permission-tree__group summary { min-height: 2.75rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .5rem .7rem; cursor: pointer; list-style: none; background: #f8fafc; }
.permission-tree__group summary label { display: flex; grid-template-columns: none; align-items: center; gap: .55rem; margin: 0; font-weight: 700; cursor: pointer; }
.permission-tree input[type="checkbox"] { width: 1rem; min-height: 1rem; accent-color: var(--console-primary); }
.permission-tree__children { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem; padding: .55rem; }
.permission-tree__children label { display: flex; grid-template-columns: none; align-items: flex-start; gap: .5rem; min-height: 2.75rem; padding: .45rem; border-radius: .45rem; cursor: pointer; }
.permission-tree__children label:hover { background: #f8fafc; }
.permission-tree__children label span { display: grid; gap: .1rem; }
.permission-tree__children small { color: var(--console-muted); font-size: .68rem; }
.bulk-form .table-wrap { margin-top: 0; }
.bulk-bar:not([hidden]) + .table-wrap { border-top: 0; border-radius: 0 0 .7rem .7rem; }
.department-name { display: flex; align-items: center; gap: .45rem; padding-left: calc(var(--tree-depth) * 1.25rem); }
.department-name > span:last-child { display: grid; gap: .1rem; }
.department-name small { color: var(--console-muted); font-size: .7rem; }
.tree-toggle, .tree-spacer { width: 1.6rem; min-width: 1.6rem; height: 1.6rem; }
.tree-toggle { display: inline-grid; place-items: center; padding: 0; border: 0; border-radius: .35rem; background: transparent; color: var(--console-muted); }
.tree-toggle:hover { background: #eef2f6; }
.tree-toggle svg { width: .9rem; fill: none; stroke: currentColor; stroke-width: 2; transition: transform 180ms ease; }
.tree-toggle[aria-expanded="true"] svg { transform: rotate(90deg); }
.department-table tr[hidden] { display: none; }
.workspace-dialog--compact { width: min(34rem, calc(100vw - 2rem)); }
.required-mark { color: var(--console-danger); font-size: .68rem; font-weight: 400; }
.bulk-reason { display: flex; align-items: center; gap: .4rem; color: var(--console-muted); font-size: .75rem; }
.bulk-reason input { width: 15rem; min-height: 2.25rem; padding: .4rem .65rem; border: 1px solid #ccd4df; border-radius: .5rem; font: inherit; }
.workspace-dialog textarea { width: 100%; resize: vertical; padding: .65rem .7rem; border: 1px solid #ccd4df; border-radius: .55rem; outline: 0; background: #fff; color: var(--console-text); font: inherit; line-height: 1.5; }
.workspace-dialog textarea:focus-visible { border-color: var(--console-primary); box-shadow: 0 0 0 3px rgb(49 87 213 / 16%); }
.description-cell { max-width: 28rem; color: var(--console-muted); line-height: 1.5; }
.choice-field { margin: 0; padding: 0; border: 0; min-width: 0; }
.choice-field legend { margin-bottom: .45rem; color: var(--console-muted); font-size: .78rem; font-weight: 500; }
.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; max-height: 12rem; overflow-y: auto; padding: .15rem; }
.choice-item { display: flex !important; flex-direction: row !important; align-items: center; gap: .6rem !important; min-height: 2.5rem; padding: .5rem .65rem; border: 1px solid var(--console-border); border-radius: .55rem; cursor: pointer; }
.choice-item:hover { border-color: var(--console-primary); background: var(--console-primary-soft); }
.choice-item input { width: 1rem !important; height: 1rem !important; margin: 0; flex: 0 0 auto; }
.choice-item span { display: grid; min-width: 0; gap: .08rem; }
.choice-item strong { font-size: .78rem; font-weight: 600; }
.choice-item small { color: var(--console-muted); font-size: .68rem; }
.choice-item.is-disabled { opacity: .55; cursor: not-allowed; }
.choice-item.is-disabled:hover { border-color: var(--console-border); background: #fff; }
.inline-note { color: var(--console-muted); font-weight: 400; }

.workspace-page table { width: 100%; border-collapse: collapse; font-size: .83rem; }
.workspace-page th,
.workspace-page td { padding: .8rem .9rem; border-bottom: 1px solid var(--console-border); text-align: left; vertical-align: middle; }
.workspace-page th { background: #f8fafc; color: var(--console-muted); font-size: .72rem; letter-spacing: .025em; white-space: nowrap; }
.workspace-page tr:last-child td { border-bottom: 0; }
.workspace-page td strong,
.workspace-page td small { display: block; }
.workspace-page td small { margin-top: .18rem; color: var(--console-muted); }
.checkbox-column { width: 2.75rem; }
.checkbox-control { min-height: 2rem; display: inline-flex; align-items: center; justify-content: center; }
.checkbox-control input { width: 1rem; height: 1rem; accent-color: var(--console-primary); }
.tenant-actions button { margin: .15rem; }

.pagination-bar { min-height: 3.5rem; display: flex; align-items: center; gap: 1rem; padding: .75rem .25rem 0; color: var(--console-muted); font-size: .78rem; }
.pagination-bar > form { margin: 0 auto 0 0; }
.pagination-bar label { display: flex; align-items: center; gap: .45rem; }
.pagination-bar select { min-height: 2rem; width: 4rem; padding: .25rem .5rem; border: 1px solid #ccd4df; border-radius: .5rem; outline: 0; background: #ffffff; color: var(--console-text); font: inherit; }
.pagination-bar select:focus-visible { border-color: var(--console-primary); box-shadow: 0 0 0 3px rgb(49 87 213 / 16%); }
.pagination-bar nav { display: flex; align-items: center; gap: .65rem; }
.page-button { min-height: 2.25rem; display: inline-flex; align-items: center; padding: .4rem .65rem; border: 1px solid var(--console-border); border-radius: .45rem; color: var(--console-text); text-decoration: none; }
.page-button:hover { border-color: #aeb8c5; background: #f8fafc; }
.page-button.is-disabled { opacity: .4; pointer-events: none; }

.visually-hidden { 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; }
.metric-text { overflow: hidden; font-size: 1rem !important; text-overflow: ellipsis; white-space: nowrap; }
.profile-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(16rem, .6fr); gap: 1rem; }
.profile-form { max-width: 34rem; display: grid; gap: .65rem; margin: 1.25rem 0 0; }
.profile-form > label:not(.checkbox-label) { color: var(--console-muted); font-size: .75rem; font-weight: 400; }
.profile-form > input { min-height: 2.4rem; width: 100%; padding: .5rem .65rem; border: 1px solid #ccd4df; border-radius: .5rem; outline: 0; background: #fff; color: var(--console-text); font: inherit; }
.profile-form > input:focus-visible { border-color: var(--console-primary); box-shadow: 0 0 0 3px rgb(49 87 213 / 16%); }
.profile-form .primary-button { width: fit-content; }
.profile-avatar-row { display: flex; align-items: center; gap: .85rem; margin-top: 1rem; }
.profile-avatar-row > div { display: grid; gap: .15rem; }
.profile-avatar-row small { color: var(--console-muted); font-size: .75rem; }
.profile-avatar-preview { width: 4rem; height: 4rem; flex: 0 0 4rem; border: 1px solid var(--console-border); border-radius: 50%; object-fit: cover; }
.profile-avatar-preview--fallback { display: grid; place-items: center; background: var(--console-primary-soft); color: var(--console-primary); font-size: 1.25rem; font-weight: 750; }
.account-avatar--image { display: block; object-fit: cover; }
.storage-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; margin: 1rem 0; }
.storage-summary > div { min-width: 0; padding: .75rem; border: 1px solid var(--console-border); border-radius: .55rem; background: #f8fafc; }
.storage-summary dt { color: var(--console-muted); font-size: .72rem; }
.storage-summary dd { overflow: hidden; margin: .25rem 0 0; font-size: .8rem; font-weight: 650; text-overflow: ellipsis; }
.storage-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.storage-choice { max-width: none; margin: 0; padding: 1rem; border: 1px solid var(--console-border); border-radius: .65rem; }
.storage-choice h2 { margin: 0; font-size: .95rem; }
.storage-choice p, .storage-choice small { margin: 0; color: var(--console-muted); font-size: .75rem; line-height: 1.5; }
.checkbox-label, .radio-label { display: flex !important; align-items: center; gap: .45rem; color: var(--console-muted); font-size: .75rem; font-weight: 400; }
.checkbox-label input, .radio-label input { width: 1rem; height: 1rem; accent-color: var(--console-primary); }
.workspace-dialog fieldset { grid-column: 1 / -1; display: flex; gap: 1rem; margin: 0; padding: .75rem; border: 1px solid var(--console-border); border-radius: .55rem; }
.workspace-dialog legend { padding: 0 .35rem; color: var(--console-muted); font-size: .75rem; }
.account-summary h2 { margin-top: 0; }
.account-summary dl { margin-top: 1rem; }
.profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.profile-grid > div { display: grid; gap: .4rem; padding: 1rem; border: 1px solid var(--console-border); border-radius: .6rem; }
.profile-grid span { color: var(--console-muted); font-size: .78rem; }

@media (max-width: 64rem) {
    .workspace-topbar { grid-template-columns: 4.25rem minmax(0, 1fr) auto; }
    .workspace-brand { justify-content: center; padding-inline: .75rem; }
    .workspace-brand > strong { display: none; }
    .workspace-frame { grid-template-columns: 4.25rem minmax(0, 1fr); }
    .workspace-sidebar { padding-inline: .55rem; }
    .workspace-sidebar a,
    .sidebar-logout { justify-content: center; padding-inline: .5rem; }
    .workspace-sidebar span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
    .inline-create-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 48rem) {
    .workspace-topbar { grid-template-columns: auto minmax(0, 1fr) auto; }
    .workspace-context { padding-inline: .75rem; }
    .profile-trigger { grid-template-columns: 2rem; padding-inline: .75rem; }
    .profile-trigger > span:nth-child(2),
    .profile-trigger > svg { display: none; }
    .workspace-frame { grid-template-columns: 1fr; }
    .workspace-sidebar { position: sticky; z-index: 45; top: 4rem; height: auto; padding: .5rem .75rem; border-right: 0; }
    .workspace-sidebar nav { display: flex; gap: .4rem; overflow-x: auto; }
    .workspace-sidebar a { min-width: 3rem; flex: 1 0 auto; }
    .workspace-sidebar form { display: none; }
    .workspace-main { padding: 1rem; }
    .page-title-row { align-items: flex-start; flex-direction: column; gap: 1rem; }
    .page-title-row > .primary-button { width: 100%; }
    .search-form { flex-wrap: wrap; }
    .search-form > label { width: 3.25rem; flex-basis: 3.25rem; }
    .search-field { width: auto; min-width: 0; flex: 1 1 12rem; }
    .search-form button { margin-left: auto; }
    .console-form--tenant,
    .inline-create-form { grid-template-columns: 1fr; }
    .bulk-bar { align-items: stretch; flex-wrap: wrap; }
    .bulk-bar > span { width: 100%; }
    .bulk-actions { width: 100%; flex-wrap: wrap; }
    .workspace-dialog .console-form--tenant,
    .workspace-dialog .dialog-form { grid-template-columns: 1fr; }
    .workspace-dialog .dialog-field--wide { grid-column: auto; }
    .feature-tree__group summary { grid-template-columns: 1.25rem minmax(9rem, 1fr) auto; }
    .feature-tree__group summary .tree-type { display: none; }
    .feature-tree__row { grid-template-columns: 1rem minmax(9rem, 1fr) auto; padding-left: 1rem; }
    .feature-tree__row > span:nth-child(3) { display: none; }
    .permission-tree__children { grid-template-columns: 1fr; }
    .row-actions { flex-wrap: wrap; }
    .pagination-bar { align-items: flex-start; flex-wrap: wrap; }
    .pagination-bar > form { order: 3; width: 100%; }
    .pagination-bar nav { margin-left: auto; }
    .profile-layout,
    .profile-grid,
    .storage-choice-grid,
    .storage-summary { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .workspace-sidebar a,
    .sidebar-logout,
    .tree-chevron { transition: none; }
}