:root {
    --admin-bg: #ffffff;
    --admin-surface: #f7f8fa;
    --admin-surface-subtle: #fbfcfd;
    --admin-text: #20242a;
    --admin-muted: #69727d;
    --admin-border: #dfe3e8;
    --admin-border-strong: #c9cfd6;
    --admin-accent: #315f8f;
    --admin-accent-dark: #24496e;
    --admin-success: #2e6b4d;
    --admin-danger: #a13f3f;
    --admin-warning: #8a641f;
    --admin-radius: 5px;
    --admin-space-1: 4px;
    --admin-space-2: 8px;
    --admin-space-3: 12px;
    --admin-space-4: 16px;
    --admin-space-6: 24px;
    --admin-space-8: 32px;
    --admin-content-width: 1120px;
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.5;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    background: var(--admin-bg);
    color: var(--admin-text);
}

a { color: var(--admin-accent); }
a:hover { color: var(--admin-accent-dark); }

.admin-shell { min-height: 100vh; }
.admin-main {
    width: min(100% - 40px, var(--admin-content-width));
    margin: 0 auto;
}
.admin-nav { display: flex; align-items: center; gap: var(--admin-space-4); margin-left: auto; }
.admin-nav a { font-size: 14px; text-decoration: none; }
.admin-main { padding: 48px 0 64px; }
.page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--admin-space-6);
    margin-bottom: 32px;
}
.page-header h1 { margin: 0; font-size: 28px; line-height: 1.2; letter-spacing: -0.025em; }
.page-header p { margin: 8px 0 0; color: var(--admin-muted); }
.page-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--admin-space-2); }

.section { margin-top: 40px; }
.section:first-child { margin-top: 0; }
.section-header { border-bottom: 1px solid var(--admin-border); margin-bottom: 20px; padding-bottom: 10px; }
.section-header h2 { margin: 0; font-size: 17px; line-height: 1.3; }
.section-header p { margin: 5px 0 0; color: var(--admin-muted); font-size: 14px; }
.section-note { color: var(--admin-muted); font-size: 14px; }
.ses-component { display: grid; gap: 24px; }
.ses-component > * { margin-top: 0; }
.ses-component > .notice { order: 20; }
.ses-component > .ses-action-panel,
.ses-component > .ses-cloudflare-next,
.ses-component > [data-domain-verification-poll] { order: 40; }
.ses-component > .ses-resource-summary { order: 50; }
.ses-component > .ses-recovery { order: 60; }
.ses-component > .ses-next-step { order: 70; }
.ses-component-slot { margin: 0; }
.ses-component-slot--status { order: 20; }
.ses-component-slot--checklist { order: 30; }
.ses-component-slot--action { order: 40; }
.ses-component-slot--details { order: 50; }
.ses-component-slot--recovery { order: 60; }
.ses-component-slot--next { order: 70; }
.ses-component-slot > *:first-child { margin-top: 0; }
.ses-component-slot > *:last-child { margin-bottom: 0; }
.ses-component .section-header { margin-bottom: 0; }
.ses-action-panel {
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    background: var(--admin-surface-subtle);
    padding: 20px 24px;
}
.ses-action-panel { background: #fff; }
.ses-action-panel > * { margin-top: 0; margin-bottom: 0; }
.ses-action-panel > * + * { margin-top: 16px; }
.ses-action-panel form { margin: 0; }
.ses-action-panel .button { margin-top: 4px; }
.ses-live-activity { border: 1px solid var(--admin-border); padding: 16px; background: #fafafa; max-height: 360px; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.ses-live-activity h3 { position: sticky; top: -16px; z-index: 1; margin: -16px -16px 12px; padding: 16px 16px 12px; background: #fafafa; font-size: 15px; }
.ses-live-activity ul, .ses-live-activity ol { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.ses-live-step { color: var(--admin-muted); }
.ses-live-step--running { color: #8a5a00; font-weight: 600; }
.ses-live-step--waiting { color: #5c4d8a; font-weight: 600; }
.ses-live-step--complete { color: #236b45; font-weight: 600; }
.ses-live-step--failed { color: #9b2c2c; font-weight: 600; }
.ses-live-activity[hidden] { display: none; }
.ses-verification-poll-form { display: none; }
.ses-verification-title { display: flex; align-items: center; gap: 10px; }
.ses-activity-indicator { width: 10px; height: 10px; flex: 0 0 10px; border: 2px solid #b58220; border-top-color: transparent; border-radius: 50%; animation: ses-verification-spin 1s linear infinite; }
@keyframes ses-verification-spin { to { transform: rotate(360deg); } }
.ses-unified-running .ses-preparation-form, .ses-unified-running .setup-instructions { display: none; }
.ses-next-step {
    border-top: 1px solid var(--admin-border);
    padding-top: 24px;
}
.ses-next-step > * { margin-top: 0; margin-bottom: 0; }
.ses-next-step > * + * { margin-top: 14px; }
.ses-resource-summary { display: grid; gap: 8px; }
.ses-resource-summary p { margin: 0; }
.ses-preparation-form .form-grid { margin-bottom: 20px; }
.ses-preparation-form .field-full { grid-column: 1 / -1; }
.ses-unified-steps { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ses-unified-steps li { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--admin-border); padding: 10px 0; }
.ses-unified-steps strong { color: var(--admin-muted); font-weight: 600; }

.notice {
    border-left: 3px solid var(--admin-border-strong);
    background: var(--admin-surface);
    margin: 0 0 24px;
    padding: 10px 14px;
}
.notice-success { border-left-color: var(--admin-success); }
.notice-error { border-left-color: var(--admin-danger); }

html.admin-scroll-restore-pending body { visibility: hidden; }

.notice-flash {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 100;
    width: min(420px, calc(100vw - 48px));
    margin: 0;
    border: 1px solid var(--admin-border);
    border-left: 4px solid var(--admin-success);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(23, 32, 42, .18);
    padding: 14px 44px 14px 16px;
    animation: admin-toast-in .18s ease-out;
    transition: opacity .18s ease, transform .18s ease;
}
.notice-flash.is-dismissing { opacity: 0; transform: translateY(8px); }
.notice-dismiss {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 30px;
    min-height: 30px;
    border: 0;
    background: transparent;
    color: var(--admin-muted);
    padding: 0;
    transform: translateY(-50%);
    font-size: 21px;
    font-weight: 400;
    line-height: 1;
}
.notice-dismiss:hover { border: 0; background: var(--admin-surface); color: var(--admin-text); }

@keyframes admin-toast-in {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .notice-flash { animation: none; transition: none; }
}

@media (max-width: 520px) {
    .notice-flash { right: 14px; bottom: 14px; width: calc(100vw - 28px); }
}

.data-table { width: 100%; border-collapse: collapse; }
.data-table th,
.data-table td { border-bottom: 1px solid var(--admin-border); padding: 13px 12px; text-align: left; vertical-align: top; }
.data-table th { color: var(--admin-muted); font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.data-table td { font-size: 14px; }
.data-table th:first-child,
.data-table td:first-child { padding-left: 0; }
.data-table th:last-child,
.data-table td:last-child { padding-right: 0; }
.data-table tr:last-child td { border-bottom: 0; }
.row-disabled { opacity: .72; }
.table-wrap { overflow-x: auto; }
.table-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; white-space: nowrap; }
.button-link { min-height: auto; border: 0; background: transparent; color: var(--admin-accent); padding: 0; }
.button-link:hover { border: 0; background: transparent; color: var(--admin-accent-dark); }
.action-danger { color: var(--admin-danger); }
.empty-state { margin-top: 40px; padding: 56px 24px; border-top: 1px solid var(--admin-border); border-bottom: 1px solid var(--admin-border); text-align: center; }
.empty-state h2 { margin: 0; font-size: 20px; }
.empty-state p { margin: 8px 0 20px; color: var(--admin-muted); }

.mailbox-workspace { border: 1px solid var(--admin-border); background: #fff; }
.mail-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; border-bottom: 1px solid var(--admin-border); padding: 12px 16px; }
.mail-toolbar select { width: auto; min-width: 180px; }
.mail-toolbar input { width: min(520px, 44vw); }
.mail-inbox { display: grid; grid-template-columns: minmax(360px, 400px) minmax(0, 1fr); gap: 0; height: calc(100vh - 218px); min-height: 520px; align-items: stretch; }
.mail-inbox-list { min-width: 0; min-height: 0; overflow: auto; border-right: 1px solid var(--admin-border); }
.mail-list { display: grid; }
.mail-item { display: flex; flex-direction: column; gap: 3px; border-bottom: 1px solid var(--admin-border); padding: 14px 12px; color: var(--admin-text); text-decoration: none; }
.mail-item:hover, .mail-item.is-selected { background: var(--admin-surface); color: var(--admin-text); }
.mail-item.is-selected { border-left: 3px solid var(--admin-accent); padding-left: 9px; }
.mail-item-subject { overflow: hidden; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.mail-item-meta, .mail-item-address { color: var(--admin-muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-inbox-detail { min-width: 0; min-height: 0; overflow: auto; background: #fff; }
.mail-preview { min-width: 0; min-height: 100%; background: #fff; }
.mail-preview-header { padding: 22px 24px 16px; }
.mail-preview-header h2 { margin: 0 0 18px; font-size: 22px; overflow-wrap: anywhere; }
.mail-meta { display: grid; grid-template-columns: 90px 1fr; margin: 0; }
.mail-meta dt, .mail-meta dd { margin: 0; padding: 4px 0; overflow-wrap: anywhere; }
.mail-meta dt { color: var(--admin-muted); font-size: 13px; }
.mail-meta dd { font-size: 14px; }
.mail-tabs { display: flex; gap: 18px; border-top: 1px solid var(--admin-border); border-bottom: 1px solid var(--admin-border); padding: 0 24px; background: #fff; }
.mail-tab { border-bottom: 2px solid transparent; padding: 11px 0 9px; color: var(--admin-muted); font-size: 14px; text-decoration: none; }
.mail-tab:hover, .mail-tab.is-active { border-bottom-color: var(--admin-accent); color: var(--admin-accent-dark); }
.mail-preview-canvas { min-height: 220px; border-bottom: 1px solid var(--admin-border); background: #eef1f4; padding: 24px; }
.mail-html-preview { display: block; width: 100%; min-height: 520px; border: 0; background: #fff; }
.preview-note { margin: 0 0 10px; color: var(--admin-muted); font-size: 12px; }
.mail-text-preview { min-height: 220px; max-height: 600px; margin: 0; background: #fff; }
.mail-empty, .mail-empty-body { padding: 40px 20px; color: var(--admin-muted); text-align: center; }
.mail-empty h2 { margin: 0; color: var(--admin-text); font-size: 18px; }
.mail-empty p { margin: 8px 0 0; }
.mail-empty-detail { border: 1px solid var(--admin-border); }
.mail-attachments { border-top: 1px solid var(--admin-border); padding: 18px 24px; }
.mail-attachments h3 { margin: 0 0 10px; font-size: 15px; }
.attachment-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.attachment-list li { display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--admin-border); padding: 8px 0; }
.attachment-list li:last-child { border-bottom: 0; }
.attachment-list span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.attachment-list small { color: var(--admin-muted); }
.mail-delete { border-top: 1px solid var(--admin-border); padding: 16px 24px; }

.mono, code, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; }
.mono, code { font-size: .92em; }
.code-block {
    overflow-x: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius);
    background: var(--admin-surface);
    margin: 20px 0;
    padding: 16px;
}
.setup-instructions { display: grid; gap: 16px; margin: 20px 0; padding-left: 22px; }
.setup-instructions li { padding-left: 4px; }
.setup-policy { margin-top: 12px; }
.setup-policy summary { color: var(--admin-accent); cursor: pointer; font-weight: 600; }
.setup-policy .code-block { margin: 12px 0 0; }
.setup-credential-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.setup-credential-form .field { margin-bottom: 0; }
.setup-credential-form > .button { grid-column: 1 / -1; justify-self: start; }

.badge {
    display: inline-block;
    border: 1px solid var(--admin-border-strong);
    border-radius: 999px;
    padding: 2px 8px;
    color: var(--admin-muted);
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
}
.badge-active { border-color: #9bc4ac; color: var(--admin-success); }
.badge-disabled { border-color: #d5a7a7; color: var(--admin-danger); }
.badge-ed25519 { border-color: #a9bfd7; color: var(--admin-accent-dark); }

.identity-list { display: grid; grid-template-columns: minmax(130px, 180px) 1fr; margin: 0; }
.identity-list dt,
.identity-list dd { border-bottom: 1px solid var(--admin-border); margin: 0; padding: 11px 0; }
.identity-list dt { color: var(--admin-muted); font-size: 13px; }
.identity-list dd { overflow-wrap: anywhere; }
.identity-list dd:last-child,
.identity-list dt:nth-last-of-type(1) { border-bottom: 0; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.field fieldset { border: 0; margin: 0; padding: 0; }
.field-full { grid-column: 1 / -1; }
.field label, .field legend { color: var(--admin-text); font-size: 14px; font-weight: 600; }
.field-help { color: var(--admin-muted); font-size: 13px; font-weight: 400; }
input, select, textarea {
    width: 100%;
    border: 1px solid var(--admin-border-strong);
    border-radius: var(--admin-radius);
    background: #fff;
    color: var(--admin-text);
    font: inherit;
    padding: 9px 10px;
}
input, select { min-height: 40px; }
textarea { min-height: 112px; resize: vertical; }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible {
    outline: 2px solid rgba(49, 95, 143, .35);
    outline-offset: 2px;
    border-color: var(--admin-accent);
}
.choice-group { display: flex; flex-wrap: wrap; gap: 16px; }
.choice { display: flex; align-items: center; gap: 7px; font-weight: 400 !important; }
.choice input, .confirm input { width: auto; min-height: auto; }
.advanced-options { margin-top: 12px; color: var(--admin-muted); font-size: 13px; }
.advanced-options summary { cursor: pointer; }
.advanced-options .choice { margin-top: 10px; color: var(--admin-text); font-size: 14px; }
.additional-scopes { display: flex; flex-direction: column; gap: 3px; margin-top: 8px; }
.additional-scopes code { color: var(--admin-muted); }
.confirm { display: flex; align-items: center; gap: 7px; color: var(--admin-muted); font-size: 13px; }

.button, button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border: 1px solid var(--admin-border-strong);
    border-radius: 6px;
    background: #fff;
    color: var(--admin-text);
    cursor: pointer;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.25;
    padding: 9px 16px;
    text-decoration: none;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.button:hover, button:hover { border-color: var(--admin-accent); background: var(--admin-surface); color: var(--admin-accent-dark); }
.button-primary { border-color: var(--admin-accent); background: var(--admin-accent); color: #fff; }
.button-primary:hover { border-color: var(--admin-accent-dark); background: var(--admin-accent-dark); color: #fff; }
.button-secondary { border-color: var(--admin-border-strong); background: #fff; color: var(--admin-text); }
.button-secondary:hover { border-color: var(--admin-accent); background: var(--admin-surface); color: var(--admin-accent-dark); }
.button-danger { border-color: #d5a7a7; background: #fff; color: var(--admin-danger); }
.button-danger:hover { border-color: var(--admin-danger); background: #fff8f8; color: var(--admin-danger); }
.button-subtle { min-height: auto; border-color: transparent; background: transparent; color: var(--admin-muted); padding-left: 0; padding-right: 0; }
.button-subtle:hover { border-color: transparent; background: transparent; color: var(--admin-accent-dark); }
.button:disabled, button:disabled { cursor: not-allowed; opacity: .58; }

.delete-app-page { width: min(100%, 760px); margin: 0 auto; }
.delete-app-page .notice-error { margin-bottom: 24px; }
.delete-app-page .page-header { align-items: center; margin-bottom: 40px; }
.delete-app-page .page-header h1 { font-size: 26px; }
.delete-app-panel { margin-top: 0; border: 1px solid var(--admin-border); border-top: 3px solid #d5a7a7; border-radius: 8px; background: #fff; padding: 28px 32px 32px; }
.delete-app-intro { max-width: 660px; margin: 0 0 28px; color: var(--admin-muted); }
.delete-app-form .field { margin-bottom: 24px; }
.delete-app-confirmation { margin: 4px 0 28px; border: 1px solid #ead5d5; border-radius: 6px; background: #fff8f8; padding: 14px 16px 12px; }
.delete-app-confirmation .confirm { align-items: flex-start; color: var(--admin-text); font-size: 14px; line-height: 1.45; }
.delete-app-confirmation .confirm input { flex: 0 0 auto; margin-top: 3px; }
.delete-app-confirmation .section-note { margin: 9px 0 0 25px; font-size: 13px; }
.delete-app-actions { display: flex; justify-content: flex-end; border-top: 1px solid var(--admin-border); padding-top: 24px; }
.delete-app-actions .button-danger { background: #fff8f8; }

.credential-group { border-top: 1px solid var(--admin-border); padding: 18px 0 4px; }
.credential-group__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.credential-group h3 { margin: 0 0 6px; font-size: 16px; }
.credential-group h4 { margin: 18px 0 2px; color: var(--admin-muted); font-size: 13px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; }
.credential-label { display: grid; gap: 4px; margin-bottom: 8px; }
.credential-label code { color: var(--admin-muted); font-size: 13px; font-weight: 650; }
.credential-form { display: grid; min-width: 0; grid-template-columns: 220px minmax(0, 1fr) auto; align-items: center; gap: 0 12px; padding: 14px 0 18px; }
.credential-form .credential-label { grid-column: 1; margin-bottom: 0; }
.credential-form > input:not([type="hidden"]) { grid-column: 2; min-width: 0; }
.credential-form > .button { grid-column: 3; }
.secret-row--managed { display: block; }
.credential-managed { display: grid; min-width: 0; grid-template-columns: 220px minmax(0, 1fr); align-items: start; gap: 0 12px; padding: 14px 0 18px; }
.credential-managed .credential-label { margin: 10px 0 0; }
.credential-managed__value { min-width: 0; }
.credential-managed__value input { width: 100%; min-width: 0; }
.credential-managed__value .section-note { margin: 8px 0 0; }
.console-status-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, 220px) 84px; align-items: center; gap: 16px; border-bottom: 1px solid var(--admin-border); padding: 14px 0; }
.console-status-row__status { color: var(--admin-muted); }
.app-provisioning-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; margin-top: 40px; }
.app-provisioning-panel { margin-top: 0; }
.app-credentials-section { margin-top: 40px; }
.app-management-stack { display: grid; gap: 24px; margin-top: 40px; }
.app-card { margin-top: 0; margin-bottom: 0; border: 1px solid var(--admin-border); border-radius: var(--admin-radius); background: var(--admin-bg); padding: 20px; }
.app-card .section-header { margin-bottom: 16px; }
.app-card > form + form { margin-top: var(--admin-space-4); }
.setup-material + .setup-material { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--admin-border); }
.setup-material__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.setup-material__header h3 { margin: 0; }
.setup-material .code-block { margin-top: 12px; }
.setup-prompt summary { color: var(--admin-accent); cursor: pointer; font-weight: 600; }
.setup-prompt > p { margin-bottom: 0; }
.app-card.danger-zone { border-top: 1px solid #e3bcbc; padding-top: 20px; }
.ses-cloudflare-token, .ses-cloudflare-next { display: grid; gap: 16px; }
.ses-cloudflare-token { margin-top: 20px; margin-bottom: 36px; }
.ses-cloudflare-next { margin-top: 36px; border-top: 1px solid var(--admin-border); padding-top: 28px; }
.ses-cloudflare-action { margin: 0; }
.ses-cloudflare-action .button { margin-top: 4px; }
.ses-cloudflare-action:has(#cloudflare-domain), form:has(#cloudflare-domain) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ses-cloudflare-action:has(#cloudflare-domain) .field, form:has(#cloudflare-domain) .field { min-width: 0; margin-bottom: 0; }
.ses-cloudflare-action:has(#cloudflare-domain) .field, form:has(#cloudflare-domain) .field { display: grid; grid-template-rows: auto minmax(36px, auto) auto; align-content: start; }
.ses-cloudflare-action:has(#cloudflare-domain) .field-help, form:has(#cloudflare-domain) .field-help { min-height: 36px; }
.ses-cloudflare-action:has(#cloudflare-domain) > .button, form:has(#cloudflare-domain) > .button { grid-column: 1 / -1; justify-self: start; }
.danger-zone { border-top: 1px solid var(--admin-border); padding-top: 24px; }
.danger-zone .section-header { border-bottom-color: #e3bcbc; }
.production-preflight-step { border-top: 1px solid var(--admin-border); margin-top: 28px; padding-top: 24px; }
.production-preflight-step .section-header { margin-bottom: 16px; }
.production-preflight-step .field { max-width: 620px; }
@media (max-width: 900px) { .app-provisioning-layout, .credential-group__fields, .ses-cloudflare-action:has(#cloudflare-domain), form:has(#cloudflare-domain) { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { .console-status-row { grid-template-columns: 1fr auto; gap: 5px 12px; } .console-status-row > :last-child { grid-column: 2; grid-row: 1 / span 2; } .app-card { padding: 16px; } }
.secret-row { display: grid; grid-template-columns: minmax(0, 1fr) 32px; align-items: center; gap: 0 12px; }
.secret-actions { display: flex; grid-column: 2; flex: 0 0 auto; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; padding: 0 0 18px; }
.credential-delete { width: 32px; height: 32px; min-height: 32px; border: 1px solid transparent; border-radius: 50%; background: transparent; font-size: 24px; font-weight: 500; line-height: 1; padding: 0; }
.credential-delete:hover { border-color: #d5a7a7; background: #fff8f8; color: var(--admin-danger); }
.add-credential { margin-top: 20px; border-top: 1px solid var(--admin-border); padding-top: 16px; }
.add-credential summary { color: var(--admin-accent); cursor: pointer; font-weight: 600; }
.add-credential .section-form { margin-top: 18px; }
.custom-credential-form { display: grid; grid-template-columns: minmax(180px, .8fr) minmax(240px, 1fr) auto; align-items: end; gap: 0 16px; }
.custom-credential-form .field { margin-bottom: 0; }

.login-layout { width: min(100%, 420px); margin: 48px auto 0; }
.login-layout .page-header { margin-bottom: 24px; }
.login-layout form { border-top: 1px solid var(--admin-border); padding-top: 24px; }
.issuance-warning { color: var(--admin-warning); }

@media (max-width: 760px) {
    .admin-main { width: min(100% - 28px, var(--admin-content-width)); }
    .admin-nav { width: 100%; margin-left: 0; }
    .admin-main { padding-top: 32px; }
    .page-header { display: block; }
    .delete-app-page .page-header { margin-bottom: 28px; }
    .delete-app-panel { padding: 22px 20px 24px; }
    .delete-app-actions { justify-content: stretch; }
    .delete-app-actions .button { width: 100%; }
    .page-actions { margin-top: 16px; }
    .data-table { display: block; overflow-x: auto; white-space: nowrap; }
    .form-grid { grid-template-columns: 1fr; gap: 0; }
    .field-full { grid-column: auto; }
    .identity-list { grid-template-columns: 1fr; }
    .identity-list dt { border-bottom: 0; padding-bottom: 2px; }
    .identity-list dd { padding-top: 2px; }
    .credential-group__fields { gap: 0; }
    .credential-form { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; padding: 14px 0 8px; }
    .credential-form .credential-label { grid-column: 1 / -1; }
    .credential-form > input:not([type="hidden"]) { grid-column: 1; }
    .credential-form > .button { grid-column: 2; }
    .credential-managed { grid-template-columns: 1fr; gap: 8px; padding: 14px 0 8px; }
    .credential-managed .credential-label { margin: 0; }
    .secret-row { grid-template-columns: minmax(0, 1fr) 32px; gap: 0 12px; }
    .secret-actions { justify-content: center; padding-bottom: 8px; }
    .custom-credential-form { grid-template-columns: 1fr; gap: 16px; }
    .setup-credential-form { grid-template-columns: 1fr; }
    .setup-credential-form > .button { grid-column: auto; }
    .mailbox-workspace { border-left: 0; border-right: 0; }
    .mail-inbox { grid-template-columns: 1fr; height: auto; min-height: 0; gap: 24px; }
    .mail-inbox-list { border-right: 0; }
    .mail-toolbar { align-items: stretch; flex-direction: column; }
    .mail-toolbar select, .mail-toolbar input, .mail-toolbar .button { width: 100%; }
    .mail-preview-header, .mail-attachments, .mail-delete { padding-left: 16px; padding-right: 16px; }
    .mail-tabs { padding-left: 16px; padding-right: 16px; }
    .mail-preview-canvas { padding: 12px; }
    .mail-html-preview { min-height: 420px; }
}

/* Shell sizing overrides remain last so page-specific rules cannot recreate the frame. */
.admin-shell:not(.admin-auth-layout) { display: flex; min-height: 100vh; }
.admin-shell:not(.admin-auth-layout) .admin-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 10; display: flex; width: 224px; flex-direction: column; justify-content: space-between; border-right: 1px solid var(--admin-border); background: #f4f6f8; padding: 28px 16px 20px; }
.admin-shell:not(.admin-auth-layout) .admin-sidebar__top { display: grid; gap: 34px; }
.admin-shell:not(.admin-auth-layout) .admin-sidebar__brand { display: grid; gap: 3px; padding: 0 10px; color: var(--admin-text); text-decoration: none; }
.admin-sidebar__logo { display: block; width: min(100%, 180px); height: auto; }
.admin-shell:not(.admin-auth-layout) .admin-nav { display: grid; width: auto; gap: 3px; margin-left: 0; }
.admin-shell:not(.admin-auth-layout) .admin-nav__item { border-left: 2px solid transparent; padding: 10px 10px 10px 12px; color: var(--admin-muted); text-decoration: none; }
.admin-shell:not(.admin-auth-layout) .admin-nav__item--active { border-left-color: var(--admin-accent); background: #e9edf1; color: var(--admin-text); font-weight: 650; }
.admin-shell:not(.admin-auth-layout) .admin-sidebar__account { display: grid; gap: 7px; border-top: 1px solid var(--admin-border); padding: 16px 10px 0; }
.admin-shell:not(.admin-auth-layout) .admin-logout { min-height: auto; border: 0; background: transparent; padding: 0; justify-content: flex-start; }
.admin-shell:not(.admin-auth-layout) .admin-logout:hover { border: 0; background: transparent; color: var(--admin-accent-dark); }
.admin-main-wrap { width: calc(100% - 224px); margin-left: 224px; min-width: 0; }
.admin-auth-layout .admin-main-wrap { width: 100%; margin-left: 0; }
.admin-shell:not(.admin-auth-layout) .admin-main { width: min(calc(100% - 64px), var(--admin-content-width)); margin: 0 auto; padding: 32px 0 64px; }
.admin-shell:not(.admin-auth-layout) .admin-main.admin-page--workspace { width: min(calc(100% - 64px), 1600px); max-width: none; padding-top: 28px; padding-bottom: 32px; }
.admin-auth-layout .admin-main { width: min(calc(100% - 48px), var(--admin-content-width)); margin: 0 auto; }

@media (max-width: 760px) {
    .admin-shell:not(.admin-auth-layout) .admin-sidebar { width: min(224px, 84vw); transform: translateX(-100%); transition: transform .18s ease; box-shadow: 8px 0 24px rgba(23, 32, 42, .12); }
    .admin-shell.sidebar-open .admin-sidebar { transform: translateX(0); }
    .admin-main-wrap { width: 100%; margin-left: 0; }
    .admin-sidebar-toggle { position: relative; z-index: 5; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin: 12px 14px 0; }
    .admin-shell:not(.admin-auth-layout) .admin-main { width: calc(100% - 28px); padding-top: 24px; }
    .admin-shell:not(.admin-auth-layout) .admin-main.admin-page--workspace { width: calc(100% - 28px); padding-top: 20px; }
    .admin-auth-layout .admin-main { width: calc(100% - 28px); }
}

/* Final shell alignment: every authenticated page starts at the same inset. */
.admin-shell:not(.admin-auth-layout) .admin-main {
    width: min(calc(100% - 64px), var(--admin-content-width));
    margin-left: 32px;
    margin-right: 32px;
}
.admin-shell:not(.admin-auth-layout) .admin-main.admin-page--workspace {
    width: calc(100% - 64px);
    max-width: none;
}
.admin-sidebar-toggle { display: none !important; }
@media (max-width: 760px) {
    .admin-shell:not(.admin-auth-layout) .admin-main {
        width: calc(100% - 28px);
        margin-left: 14px;
        margin-right: 14px;
    }
    .admin-shell:not(.admin-auth-layout) .admin-main.admin-page--workspace {
        width: calc(100% - 28px);
    }
    .admin-sidebar-toggle {
        display: inline-flex !important;
        width: 40px;
        height: 40px;
        margin: 12px 14px 0;
        padding: 0;
        border: 1px solid var(--admin-border-strong);
        border-radius: var(--admin-radius);
        background: #fff;
    }
    .admin-sidebar-toggle__icon,
    .admin-sidebar-toggle__icon::before,
    .admin-sidebar-toggle__icon::after {
        display: block;
        width: 16px;
        height: 2px;
        border-radius: 2px;
        background: var(--admin-text);
    }
    .admin-sidebar-toggle__icon { position: relative; }
    .admin-sidebar-toggle__icon::before,
    .admin-sidebar-toggle__icon::after { position: absolute; content: ''; left: 0; }
    .admin-sidebar-toggle__icon::before { top: -5px; }
    .admin-sidebar-toggle__icon::after { top: 5px; }
}

.admin-account-name { color: var(--admin-muted); font-size: 13px; }
.section-form input[name="secret_value"],
.section-form input[type="password"] { max-width: 520px; }

/* Canonical operator shell sizing. Keep these values in one place. */
:root {
    --admin-sidebar-width: 220px;
    --admin-main-gutter: 36px;
    --admin-standard-width: 1320px;
    --admin-workspace-width: 1560px;
}

@media (min-width: 761px) {
    .admin-shell:not(.admin-auth-layout) .admin-sidebar {
        width: var(--admin-sidebar-width);
    }

    .admin-shell:not(.admin-auth-layout) .admin-main-wrap {
        width: calc(100% - var(--admin-sidebar-width));
        margin-left: var(--admin-sidebar-width);
    }

    .admin-shell:not(.admin-auth-layout) .admin-main,
    .admin-shell:not(.admin-auth-layout) .admin-main.admin-page--workspace {
        width: min(calc(100% - (2 * var(--admin-main-gutter))), var(--admin-standard-width));
        max-width: var(--admin-standard-width);
        margin-inline: auto;
        padding: 32px 0 64px;
    }

    .admin-shell:not(.admin-auth-layout) .admin-main.admin-page--workspace {
        width: min(calc(100% - (2 * var(--admin-main-gutter))), var(--admin-workspace-width));
        max-width: var(--admin-workspace-width);
        padding-top: 28px;
        padding-bottom: 32px;
    }

    .admin-shell:not(.admin-auth-layout) .admin-main > .page-header h1 {
        display: block;
    }
}

@media (max-width: 760px) {
    .admin-shell:not(.admin-auth-layout) .admin-main,
    .admin-shell:not(.admin-auth-layout) .admin-main.admin-page--workspace {
        width: calc(100% - 28px);
        max-width: none;
        margin-inline: 14px;
    }

    .admin-shell:not(.admin-auth-layout) .admin-sidebar__account {
        padding-bottom: 4px;
    }
}

/* Deliberate unauthenticated login layout. */
.admin-shell.admin-auth-layout {
    min-height: 100vh;
    background: #f3f6f8;
}
.admin-auth-layout .admin-main-wrap {
    width: 100%;
    margin: 0;
}
.admin-auth-layout .admin-main {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 32px 24px;
}
.login-layout {
    display: grid;
    min-height: calc(100vh - 64px);
    width: 100%;
    margin: 0;
    place-items: center;
}
.login-panel {
    width: min(100%, 432px);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(32, 46, 58, .08);
    padding: 36px;
}
.login-brand {
    margin-bottom: 38px;
}
.login-logo { display: block; width: min(100%, 196px); height: auto; }
.login-heading { margin-bottom: 28px; }
.login-heading h1 { margin: 0; font-size: 28px; line-height: 1.2; letter-spacing: -.025em; }
.login-heading p { margin: 8px 0 0; color: var(--admin-muted); }
.login-error { margin: 0 0 22px; }
.login-form { display: grid; gap: 6px; border: 0; padding: 0; }
.login-form .field { margin: 0; }
.login-submit { width: 100%; margin-top: 10px; }

button:disabled { cursor: wait; opacity: .65; }

@media (max-width: 520px) {
    .admin-auth-layout .admin-main { padding: 20px 16px; }
    .login-layout { min-height: calc(100vh - 40px); }
    .login-panel { padding: 28px 24px; }
    .login-brand { margin-bottom: 32px; }
}