/* Operational Briefing: shared production portal tokens and components. */
:root {
    color-scheme: light;
    --surface: #ffffff;
    --slate-50: #f5f7f5;
    --slate-100: #e9f0eb;
    --slate-200: #dce4de;
    --slate-300: #bbcbbf;
    --slate-400: #617668;
    --slate-500: #58695e;
    --slate-600: #465b4d;
    --slate-700: #304937;
    --slate-800: #203828;
    --slate-900: #17291f;
    --slate-950: #102018;
    --primary: #0c5b32;
    --primary-hover: #084727;
    --primary-active: #063a20;
    --primary-light: #e9f0eb;
    --brand-700: #155c35;
    --brand-600: #0c5b32;
    --brand-50: #edf5ef;
    --brand-100: #e5f3e8;
    --brand-200: #bbd9c3;
    --brand-400: #83bd41;
    --brand-500: #0c5b32;
    --success-bg: #e5f3e8;
    --success-text: #155c35;
    --warning-bg: #fff0ce;
    --warning-text: #805100;
    --danger-bg: #ffe7e9;
    --danger-text: #a52b34;
    --info-bg: #eaf0f4;
    --info-text: #455867;
    --radius-md: 8px;
    --radius-lg: 12px;
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --surface: #19251e;
    --slate-50: #111a16;
    --slate-100: #2b3d31;
    --slate-200: #34473b;
    --slate-300: #506556;
    --slate-400: #a4b7aa;
    --slate-500: #a4b7aa;
    --slate-600: #b3c5b9;
    --slate-700: #c9d8ce;
    --slate-800: #dde9e1;
    --slate-900: #edf5ef;
    --slate-950: #f6fcf8;
    --primary: #9bdbad;
    --primary-hover: #b3e6c1;
    --primary-active: #c4ecd0;
    --primary-light: #2b3d31;
    --brand-50: #203e2a;
    --brand-100: #203e2a;
    --brand-200: #395f44;
    --brand-300: #9bdbad;
    --brand-500: #9bdbad;
    --brand-600: #9bdbad;
    --brand-700: #a6e5b9;
    --brand-800: #b8ebc6;
    --brand-900: #c9f2d4;
    --success-bg: #203e2a;
    --success-text: #a6e5b9;
    --warning-bg: #48391c;
    --warning-text: #ffd887;
    --danger-bg: #49292e;
    --danger-text: #ffb3b9;
    --info-bg: #293a44;
    --info-text: #c1d4df;
}
body.operational-portal { display: block; overflow-x: visible; font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
[hidden] { display: none !important; }
::selection { color: var(--surface); background: var(--primary); }
* { scrollbar-color: var(--slate-400) var(--slate-50); scrollbar-width: thin; }
input, textarea { caret-color: var(--primary); }
input::placeholder, textarea::placeholder { color: var(--slate-500); opacity: 1; }
:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }
h1, h2, h3, .card-title { text-wrap: balance; overflow-wrap: anywhere; }
p { text-wrap: pretty; }
h1 { font-size: clamp(1.6rem, 2.4vw, 2.125rem); letter-spacing: -.03em; line-height: 1.2; }
h2 { font-size: 1.25rem; line-height: 1.3; }
h3 { font-size: .9375rem; }
small { font-size: .75rem; }
.portal-shell { display: grid; grid-template-columns: 230px minmax(0, 1fr) 260px; min-height: 100vh; }
.portal-sidebar { padding: 30px 22px; border-right: 1px solid var(--slate-200); background: var(--surface); display: flex; flex-direction: column; align-items: stretch; gap: 16px; }
.greenwich-brand { display: block; margin-bottom: 8px; }
.greenwich-brand img { display: block; width: 185px; max-width: 100%; height: auto; }
.brand-dark { display: none !important; }
[data-theme="dark"] .brand-light { display: none; }
[data-theme="dark"] .brand-dark { display: block !important; }
.portal-product { font-size: .8125rem; font-weight: 600; }
.portal-sidebar .form-label { margin: 4px 0 -8px; }
.portal-navigation { display: grid; gap: 5px; }
.portal-nav-link { display: flex; align-items: center; gap: 10px; color: var(--slate-600); padding: 11px 12px; border-radius: 7px; text-decoration: none; min-height: 44px; font-size: .8125rem; font-weight: 550; }
.portal-nav-link svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.portal-nav-link:hover, .portal-nav-link[aria-current="page"] { background: var(--slate-100); color: var(--primary); }
.portal-nav-link[aria-current="page"] { font-weight: 650; }
.portal-nav-divider { border-top: 1px solid var(--slate-200); margin: 16px 0 8px; }
.portal-sidebar-bottom { display: grid; gap: 16px; padding-top: 40px; margin-top: auto; }
.portal-profile { display: flex; align-items: center; gap: 10px; font-size: .75rem; min-width: 0; }
.portal-profile div { min-width: 0; overflow-wrap: anywhere; }
.portal-profile small { display: block; color: var(--slate-500); }
.portal-avatar { padding: 10px; background: var(--slate-100); color: var(--primary); border-radius: 50%; flex-shrink: 0; }
.portal-account-links { display: flex; flex-wrap: wrap; gap: 12px; font-size: .75rem; }
.portal-workspace { min-width: 0; }
.portal-topbar { min-height: 65px; padding: 16px 32px; border-bottom: 1px solid var(--slate-200); display: flex; justify-content: space-between; gap: 20px; color: var(--slate-500); font-size: .75rem; background: var(--surface); }
.operational-portal .app-main { padding: 32px; max-width: none; margin: 0; min-height: calc(100vh - 120px); }
.app-main:focus { outline: none; }
.portal-context { border-left: 1px solid var(--slate-200); background: var(--surface); padding: 34px 24px; min-width: 0; }
.portal-context > p { margin-top: 12px; color: var(--slate-500); }
.portal-context section { margin: 28px 0; padding-top: 24px; border-top: 1px solid var(--slate-200); }
.portal-context h3 { margin-bottom: 14px; }
.portal-context section p { font-size: .8125rem; color: var(--slate-500); margin: 12px 0; }
.context-link { font-weight: 600; font-size: .8125rem; }
.portal-footer { padding: 16px 32px; color: var(--slate-500); font-size: .75rem; border-top: 1px solid var(--slate-200); }
.skip-link { position: fixed; left: 16px; top: -100px; background: var(--surface); padding: 14px; z-index: 200; }
.skip-link:focus { top: 16px; }
.operational-portal .page-header { margin-bottom: 28px; align-items: flex-start; }
.page-title-group { min-width: 0; }
.page-title-group h1 { flex-wrap: wrap; }
.page-description { max-width: 70ch; }
.card, .card-header, .stat-card, .table-container, .empty-state, .form-control, .section-card, .policy-picker, .policy-card, .portal-toast { background: var(--surface); }
.card, .stat-card, .table-container, .section-card, .empty-state { box-shadow: none; }
.card:hover, .stat-card:hover, .section-card:hover { box-shadow: none; transform: none; }
.stat-card.featured, .home-hero, .section-card, .green-callout { background: var(--surface); }
.stat-card.featured::before { display: none; }
.stat-card { border-color: var(--slate-200); border-top: 1px solid var(--slate-200); }
.stat-value { font-size: 2rem; font-variant-numeric: tabular-nums; color: var(--slate-900); }
.stat-header { margin-bottom: 16px; }
.stat-subtext, .stat-label { color: var(--slate-500); }
.stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.btn, button, .portal-nav-link, .section-card, .form-control { transition: background-color 180ms ease-out, color 180ms ease-out, border-color 180ms ease-out, transform 180ms ease-out; }
.btn { min-height: 40px; font-size: .8125rem; border-radius: 7px; }
.btn-primary { background: var(--primary); border-color: var(--primary); color: var(--surface); }
.btn-primary:hover { background: var(--primary-hover); color: var(--surface); }
.btn-secondary { background: var(--surface); color: var(--slate-800); border-color: var(--slate-200); }
.btn-secondary:hover { background: var(--slate-100); color: var(--slate-900); }
.btn:active, button:active { transform: scale(.96); }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.form-control { min-width: 0; color: var(--slate-900); border-color: var(--slate-200); min-height: 42px; }
.form-control:focus { border-color: var(--primary); box-shadow: none; outline: 2px solid var(--primary); outline-offset: 2px; }
.form-hint, .form-label, .badge, .modern-table th, .modern-table td { font-size: max(.75rem, 12px); }
.code-editor { background: var(--slate-50); color: var(--slate-900); }
.modern-table td { font-variant-numeric: tabular-nums; }
.modern-table th { background: var(--slate-50); color: var(--slate-600); }
.table-responsive { max-width: 100%; overflow-x: auto; }
.badge-approved { background: var(--success-bg); color: var(--success-text); }
.badge-pending, .badge-warning { background: var(--warning-bg); color: var(--warning-text); }
.badge-rejected { background: var(--danger-bg); color: var(--danger-text); }
.badge-draft, .badge-neutral, .badge-info { background: var(--info-bg); color: var(--info-text); }
.empty-state { border: 1px solid var(--slate-200); }
.alert-banner { border-left-width: 1px; }
.section-card { border: 1px solid var(--slate-200); }
.section-card:hover { background: var(--slate-100); border-color: var(--primary); }
.section-grid { gap: 16px; }
.portal-context code { overflow-wrap: anywhere; color: var(--primary); }
.operation-heading, .operation-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.operation-toolbar .form-group { margin: 0; flex: 1; }
.operation-toolbar .form-group:last-child { max-width: 200px; }
.operation-copy { color: var(--slate-500); font-size: .8125rem; margin-top: 8px; }
.channel-detail { margin-top: 16px; display: flex; gap: 24px; flex-wrap: wrap; font-size: .8125rem; color: var(--slate-500); }
.channel-detail strong { display: block; color: var(--slate-800); font-variant-numeric: tabular-nums; }
.hub-backlog { display: flex; flex-wrap: wrap; gap: 24px; padding: 20px 0 28px; color: var(--slate-500); font-size: .8125rem; }
.hub-backlog strong { color: var(--slate-900); }
.hub-updated { color: var(--slate-500); font-size: .75rem; margin-bottom: 16px; }
.skeleton-state { padding: 24px; display: grid; gap: 18px; background: var(--surface); border: 1px solid var(--slate-200); border-radius: 12px; }
.skeleton-line { height: 18px; border-radius: 4px; background: var(--slate-100); animation: portal-loading 1.2s ease-in-out infinite; }
.skeleton-line:nth-child(even) { width: 70%; }
@keyframes portal-loading { 50% { opacity: .4; } }
.operation-error { color: var(--danger-text); font-size: .8125rem; margin: 12px 0; }
.template-preview-grid { display: grid; grid-template-columns: minmax(240px, .85fr) minmax(0, 1.15fr); gap: 24px; align-items: start; margin-bottom: 28px; }
.template-preview-grid .card { margin-bottom: 0; }
.template-preview-grid .form-grid { grid-template-columns: 1fr; }
.preview-controls { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.preview-controls [aria-pressed="true"] { background: var(--primary-light); color: var(--primary); border-color: var(--primary); }
.preview-container { background: var(--slate-100); padding: 16px; border: 0; }
.preview-iframe { display: block; width: 100%; min-height: 480px; background: white; border: 0; margin: 0 auto; transition: none; }
.preview-iframe.is-mobile { max-width: 375px; }
.preview-toolbar { background: var(--surface); }
.preview-subject { margin-bottom: 20px; overflow-wrap: anywhere; }
.preview-plain { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--slate-700); font-size: .8125rem; }
.preview-form-values { display: grid; gap: 16px; margin: 20px 0; }
.preview-form-values label { display: grid; gap: 8px; font-size: .8125rem; overflow-wrap: anywhere; }
.type-switcher { display: flex; gap: 8px; margin-bottom: 24px; flex-wrap: wrap; }
.type-switcher .btn[aria-pressed="true"] { background: var(--primary-light); color: var(--primary); border-color: var(--primary); }
.campaign-steps { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 28px; padding: 0; }
.campaign-steps li { padding: 12px 8px; border-bottom: 2px solid var(--slate-200); font-size: .8125rem; color: var(--slate-500); }
.campaign-steps li[aria-current="step"] { border-color: var(--primary); color: var(--primary); font-weight: 600; }
.campaign-stage { border: 0; padding: 0; margin: 0; min-width: 0; }
.campaign-stage legend { font-size: 1.25rem; font-weight: 600; margin-bottom: 8px; }
.campaign-stage > p { color: var(--slate-500); margin-bottom: 24px; }
.campaign-wizard-actions { display: flex; gap: 12px; justify-content: flex-end; padding-top: 24px; border-top: 1px solid var(--slate-200); flex-wrap: wrap; }
.campaign-review { margin-bottom: 28px; }
.campaign-review dt { color: var(--slate-500); font-size: .8125rem; margin-top: 18px; }
.campaign-review dd { margin: 4px 0; font-weight: 600; overflow-wrap: anywhere; }
.campaign-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 24px 0; }
.campaign-flow div { border-top: 1px solid var(--slate-200); padding-top: 16px; }
.campaign-flow span { display: block; color: var(--slate-500); font-size: .75rem; }
.campaign-flow strong { font-size: .8125rem; overflow-wrap: anywhere; }
.account-surface .portal-navigation { display: none; }
@media (max-width: 1250px) {
    .portal-shell { grid-template-columns: 210px minmax(0, 1fr); }
    .portal-context { grid-column: 2; border-left: 0; border-top: 1px solid var(--slate-200); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
    .portal-context h2 { grid-column: 1 / -1; }
    .portal-context section { margin: 0; }
    .operational-portal .app-main { padding: 24px; }
}
@media (max-width: 1000px) {
    .template-preview-grid { grid-template-columns: minmax(0, 1fr); }
    .stats-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
    .portal-shell { display: block; }
    .portal-sidebar { padding: 18px; gap: 12px; border-right: 0; border-bottom: 1px solid var(--slate-200); }
    .greenwich-brand img { width: 145px; }
    .portal-product { margin: 0; }
    .portal-navigation { display: flex; flex-wrap: wrap; }
    .portal-nav-link { padding: 10px; flex-grow: 1; }
    .portal-nav-divider { display: none; }
    .portal-sidebar-bottom { padding-top: 8px; margin-top: 0; gap: 12px; }
    .portal-profile { display: none; }
    .portal-topbar { padding: 16px 18px; flex-wrap: wrap; min-height: 50px; }
    .portal-topbar span:last-child { display: none; }
    .operational-portal .app-main { padding: 24px 18px; min-height: 0; }
    .portal-context { display: block; padding: 24px 18px; }
    .portal-context section { margin: 24px 0; }
    .portal-footer { padding: 16px 18px; }
    .portal-account-links a, .btn { min-height: 44px; }
    .page-header, .page-actions { flex-wrap: wrap; }
    .form-grid-2, .form-grid-3 { grid-template-columns: minmax(0, 1fr); }
    .operation-toolbar .form-group:last-child { max-width: none; }
    .operation-toolbar { align-items: stretch; flex-direction: column; }
    .campaign-steps li { padding: 8px 4px; }
    .campaign-flow { gap: 12px; }
    .portal-context p { max-width: 70ch; }
    .policy-picker, .brand-asset-row, .card-body > form { min-width: 0; }
    .preview-container { padding: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}
.technical-details { margin: 0 0 24px; color: var(--slate-500); font-size: .8125rem; }
.technical-details summary { cursor: pointer; padding: 8px 0; }
summary { min-height: 40px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
/* Match incumbent textarea specificity so both editor surfaces follow the active theme. */
textarea.code-editor { background: var(--slate-50); color: var(--slate-900); }
.operational-portal a:not(.btn):not(.portal-nav-link):not(.section-card) { color: var(--primary); text-underline-offset: 4px; }
.portal-account-links a { display: inline-flex; align-items: center; }
/* Keep visible keyboard focus above legacy component-specific focus resets. */
.operational-portal :is(button, a, summary, select, input, textarea):focus-visible {
    outline: 3px solid var(--primary);
    outline-offset: 3px;
    box-shadow: none;
}