/* Exit Naija account surfaces: storm grey, matte black, and restrained warm gold.
   Scope is limited to Media and Control plane dialogs so the chat itself keeps
   its existing visual treatment. */
.media-dialog,
.account-settings-dialog {
  --en-storm: #454a52;
  --en-storm-light: #555b64;
  --en-black: #141619;
  --en-black-soft: #1b1e22;
  --en-gold: #c7a56a;
  --en-gold-light: #dfc28d;
  --en-ink: #f1f0ed;
  --en-muted: #b0b2b4;
  border: 1px solid #70747a;
  border-radius: 18px;
  background: var(--en-storm);
  color: var(--en-ink);
  box-shadow: 0 30px 100px #0009, inset 0 1px #ffffff12;
}
.media-dialog::backdrop,
.account-settings-dialog::backdrop { background: #08090bd9; backdrop-filter: blur(15px); }
.media-header,
.account-settings-header {
  border-bottom: 1px solid #686d75;
  background: linear-gradient(115deg, #515761, #41464e 72%);
}
.settings-eyebrow,
.media-header .settings-eyebrow { color: var(--en-gold-light); letter-spacing: .17em; }
.media-header h2,
.account-settings-header h2 { color: #f7f5f0; font-size: 25px; letter-spacing: -.035em; }
.media-header p,
.account-settings-header p { color: #d0d1d1; }
.settings-close {
  border: 1px solid #787d84;
  border-radius: 10px;
  background: #30343a;
  color: #ebe9e4;
}
.settings-close:hover { border-color: var(--en-gold); background: #24272c; color: var(--en-gold-light); }
.media-toolbar { border-color: #666c73; background: #3d4249; }
.media-intro strong { color: #f2f0eb; }
.media-intro span { color: #c3c4c4; }
.media-search,
.media-select,
.media-view-toggle {
  border-color: #6b7077;
  border-radius: 8px;
  background: #292d32;
  color: #e2e1dd;
}
.media-search input { color: #f4f2ed; }
.media-search input::placeholder { color: #a8aaac; }
.media-search:focus-within,
.media-select:focus-visible { border-color: var(--en-gold); box-shadow: 0 0 0 2px #c7a56a33; }
.media-upload,
.machine-copy-command {
  border: 1px solid var(--en-gold);
  background: var(--en-gold);
  color: #1c1a16;
  font-weight: 800;
  box-shadow: 0 4px 14px #c7a56a26;
}
.media-upload:hover,
.machine-copy-command:hover { border-color: var(--en-gold-light); background: var(--en-gold-light); color: #161512; }
.media-upload[aria-disabled="true"] { border-color: #77746c; background: #716b5e; color: #e0ded8; }
.media-view-toggle button.active { background: var(--en-gold); color: #1b1915; }
.media-view-toggle:has(button.active) { border-color: #c7a56a99; }
.media-collection-scroll { scrollbar-color: #858078 transparent; }
.media-card,
.machine-settings-card,
.personalization-card {
  border-color: #62676e;
  border-radius: 11px;
  background: var(--en-black);
}
.media-card:hover,
.machine-settings-card:hover { border-color: var(--en-gold); background: #191c20; box-shadow: 0 10px 28px #0004; }
.media-card-preview { border-color: #383c41; background: #101215; }
.media-document-preview { background: radial-gradient(ellipse at 50% 35%, #51565d 0, #202328 72%); color: #d7d4cc; }
.media-document-mark { border-color: #8c7959; background: linear-gradient(145deg, #383a3c, #1d2023); color: var(--en-gold-light); box-shadow: 0 12px 28px #0006; }
.media-type-image,
.media-type-video,
.media-type-document { border-color: #dfc28d; background: #c7a56a; color: #1c1a16; }
.media-card .settings-asset-info strong,
.machine-card-title strong,
.personalization-card-main strong { color: #f0eee8; }
.media-card .settings-asset-info span,
.machine-card-meta,
.personalization-card-main small { color: #b2b4b5; }
.media-card-actions button,
.machine-card-actions button,
.personalization-card-actions button,
.personalization-reset {
  border-color: #62676e;
  background: #292d32;
  color: #e9e7e1;
}
.media-card-actions button:hover,
.machine-card-actions button:hover,
.personalization-card-actions button:hover,
.personalization-reset:hover { border-color: var(--en-gold); background: #383a3b; color: var(--en-gold-light); }
.media-card-actions .settings-delete,
.machine-card-actions .machine-revoke-button { border-color: #825a54; background: #352523; color: #e9b1a7; }
.media-card-actions .settings-delete:hover,
.machine-card-actions .machine-revoke-button:hover { border-color: #c07c6f; background: #4b2c28; color: #ffe5df; }
.media-dialog .settings-status,
.machine-settings-status { color: var(--en-gold-light); }
.media-dialog .settings-status.is-error,
.machine-settings-status.is-error,
.settings-error { color: #e5a096; }
.settings-empty { color: #c4c5c5; }
.media-dialog :focus-visible,
.account-settings-dialog :focus-visible { outline-color: var(--en-gold); }
.account-settings-rail { border-color: #565b62; background: #24282d; }
.settings-rail-label { color: #c6c5c0; }
.settings-rail-item { color: #d0d0ce; }
.settings-rail-item:hover { background: #33383e; color: #fff; }
.settings-rail-item.active { border-color: #c7a56a; background: #c7a56a; color: #1d1b17; }
.settings-rail-item.active span { color: #363027; }
.machine-settings-content,
.personalization-content { background: #454a52; scrollbar-color: #858078 transparent; }
.machine-settings-title h3 { color: #f3f1ec; }
.machine-settings-title p,
.personalization-field small,
.personalization-switches small,
.personalization-section-heading small { color: #d0d0ce; }
.machine-refresh-button {
  border-color: #777c83;
  background: #282c31;
  color: #eceae5;
}
.machine-refresh-button:hover { border-color: var(--en-gold); background: #34383d; }
.machine-refresh-button span { color: var(--en-gold-light); }
.machine-enroll-card {
  border-color: #777c83;
  background: linear-gradient(115deg, #525861, #3c4148);
  box-shadow: inset 3px 0 var(--en-gold);
}
.machine-enroll-symbol,
.machine-card-glyph { border-color: #777c83; background: #292d32; color: var(--en-gold-light); }
.machine-enroll-copy strong,
.machine-list-heading strong,
.personalization-section-heading strong { color: #f5f2eb; }
.machine-enroll-copy p { color: #d6d6d3; }
.machine-enroll-copy code {
  border-color: #6f747b;
  background: #171a1e;
  color: #e6d5b0;
}
.machine-state { border-color: #777b80; background: #2b2f34; color: #e1e0dc; }
.machine-state-online { border-color: #c7a56a; background: #c7a56a; color: #1c1a16; }
.machine-state-pairing { border-color: #988159; background: #403a2f; color: #ead6ad; }
.machine-state-offline { color: #c6c7c7; }
.machine-state-revoked { border-color: #825a54; background: #352523; color: #e9b1a7; }
.machine-card-id { color: #bbbdbd; }
.machine-card-actions .machine-use-button { border-color: var(--en-gold); background: var(--en-gold); color: #1b1915; }
.machine-card-actions .machine-use-button:hover { border-color: var(--en-gold-light); background: var(--en-gold-light); color: #1b1915; }
.personalization-field,
.personalization-card-main strong { color: #f1efe9; }
.personalization-field textarea,
.personalization-field select,
.personalization-field input,
.personalization-card-actions input[type="text"] {
  border-color: #70757c;
  background: #191c20;
  color: #f2f0eb;
}
.personalization-field textarea:focus,
.personalization-field select:focus,
.personalization-field input:focus { border-color: var(--en-gold); outline-color: #c7a56a44; }
.personalization-switches { border-color: #62676e; background: #62676e; }
.personalization-switches label,
.personalization-history { background: #191c20; color: #f0eee8; }
.personalization-switches strong { color: #f1efe9; }
.personalization-switches input { accent-color: var(--en-gold); }
.personalization-card-actions button[aria-pressed="true"] { border-color: var(--en-gold); background: #504631; color: var(--en-gold-light); }
.personalization-history { border-color: #62676e; }
.personalization-privacy { border-left-color: var(--en-gold); background: #30343a; color: #d0d0ce; }
@media (max-width: 760px) {
  .account-settings-rail { border-color: #646a71; }
  .settings-rail-item.active { background: var(--en-gold); }
}

/* Control Center structure and keyboard-ready account search. */
.account-settings-dialog { width: min(1180px, calc(100vw - 28px)); max-height: min(900px, calc(100dvh - 28px)); overflow: hidden; }
.account-settings-header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; }
.account-settings-page { min-height:0; height:calc(100% - 85px); overflow:auto; background:#30343a; }
.settings-global-toolbar { position:sticky; top:0; z-index:5; display:grid; grid-template-columns:minmax(220px, 440px) 1fr; gap:12px; padding:16px 22px 12px; background:#30343aee; backdrop-filter:blur(12px); }
.settings-global-search { display:flex; align-items:center; gap:10px; min-height:42px; padding:0 12px; border:1px solid #70757c; border-radius:10px; background:#191c20; }
.settings-global-search:focus-within { border-color:var(--en-gold); box-shadow:0 0 0 3px #c7a56a2c; }
.settings-global-search svg { width:17px; fill:none; stroke:#bfc1c2; stroke-width:1.8; }
.settings-global-search input { width:100%; border:0; outline:0; background:transparent; color:#f2f0eb; }
.settings-global-search kbd { flex:none; border:1px solid #565b62; border-radius:5px; padding:2px 5px; color:#bfc1c2; font-size:10px; }
.settings-breadcrumb { display:flex; align-items:center; gap:9px; align-self:center; color:#aeb1b4; font-size:12px; }
.settings-breadcrumb strong { color:#f0eee8; font-weight:650; }
.settings-search-results { position:absolute; top:62px; left:22px; width:min(440px,calc(100% - 44px)); padding:6px; border:1px solid #666c73; border-radius:10px; background:#1a1d21; box-shadow:0 18px 40px #0009; }
.settings-search-results[hidden] { display:none; }
.settings-search-results button { display:block; width:100%; padding:10px; border:0; border-radius:7px; background:transparent; color:#e9e7e1; text-align:left; }
.settings-search-results button:hover { background:#33383e; color:var(--en-gold-light); }
.settings-search-empty { display:block; padding:10px; color:#aeb1b4; font-size:12px; }
.account-settings-layout { display:grid; grid-template-columns:190px minmax(0,1fr); gap:18px; padding:0 22px 24px; }
.account-settings-rail { position:sticky; top:70px; align-self:start; max-height:calc(100dvh - 170px); overflow:auto; }
.account-settings-views { min-width:0; }
.settings-view-panel { min-height:100%; padding:22px; border:1px solid #555b62; border-radius:14px; background:#41464e; }
.settings-view-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:18px; }
.settings-view-heading h3 { margin:5px 0 6px; color:#f2f0eb; font-size:22px; letter-spacing:-.025em; }
.settings-view-heading p { max-width:650px; margin:0; color:#c5c7c8; line-height:1.55; }
.settings-plan-badge { display:inline-flex; align-items:center; border:1px solid #c7a56a88; border-radius:999px; padding:6px 10px; background:#c7a56a1c; color:#e1c58f; font-size:11px; font-weight:700; white-space:nowrap; }
.settings-overview-card { display:flex; align-items:center; gap:14px; margin:12px 0; padding:16px; border:1px solid #666c73; border-radius:12px; background:#22262b; }
.settings-overview-card>div { display:grid; gap:4px; min-width:0; flex:1; }
.settings-overview-card small { color:#b6b8ba; }
.settings-overview-card strong { overflow-wrap:anywhere; color:#f2f0eb; }
.settings-overview-card span:not(.settings-account-avatar):not(.settings-card-icon):not(.settings-plan-badge) { color:#bfc1c2; font-size:12px; }
.settings-account-avatar { display:grid; flex:none; place-items:center; width:38px; height:38px; border:1px solid #c7a56a77; border-radius:12px; background:#292d32; color:#dfc28d; font-size:12px; font-weight:800; }
.settings-account-avatar.large { width:48px; height:48px; }
.settings-card-icon { display:grid; flex:none; place-items:center; width:40px; height:40px; border:1px solid #62676e; border-radius:10px; color:#dfc28d; }
.settings-shortcut-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:16px; }
.settings-shortcut-grid button { display:grid; gap:5px; min-height:76px; padding:14px; border:1px solid #62676e; border-radius:11px; background:#292d32; color:#eeeae2; text-align:left; }
.settings-shortcut-grid button:hover { border-color:var(--en-gold); background:#34383d; }
.settings-shortcut-grid small { color:#b8babe; }
.settings-action-button { display:inline-flex; flex:none; align-items:center; justify-content:center; min-height:36px; padding:0 12px; border:1px solid #6c7279; border-radius:8px; background:#292d32; color:#e8e6e0; text-decoration:none; font:inherit; font-size:12px; font-weight:650; }
.settings-action-button:hover { border-color:var(--en-gold); color:var(--en-gold-light); }
.settings-action-button.primary { border-color:var(--en-gold); background:var(--en-gold); color:#1c1a16; }
.settings-support-form { display:grid; gap:10px; max-width:720px; }
.settings-support-form label { color:#f0eee8; font-weight:650; }
.settings-support-form textarea { min-height:150px; resize:vertical; border:1px solid #70757c; border-radius:10px; padding:12px; background:#191c20; color:#f2f0eb; font:inherit; }
.settings-support-form>div { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#dfc28d; font-size:12px; }
.settings-support-form button:disabled { opacity:.6; cursor:wait; }
.machine-settings-content,.personalization-content { min-width:0; border:1px solid #555b62; border-radius:14px; }
.machine-settings-content[hidden],.personalization-content[hidden],.settings-view-panel[hidden] { display:none!important; }
.machine-card-actions button:focus-visible,.settings-action-button:focus-visible,.settings-rail-item:focus-visible,.settings-shortcut-grid button:focus-visible { outline:2px solid var(--en-gold); outline-offset:2px; }
@media(max-width:760px) {
 .account-settings-dialog { width:calc(100vw - 12px); max-height:calc(100dvh - 12px); border-radius:14px; }
 .account-settings-page { height:calc(100% - 76px); }
 .account-settings-header { padding:14px; }
 .settings-global-toolbar { grid-template-columns:1fr; padding:12px; }
 .settings-breadcrumb { padding:0 3px; }
 .settings-search-results { top:56px; left:12px; width:calc(100% - 24px); }
 .account-settings-layout { grid-template-columns:1fr; gap:12px; padding:0 12px 14px; }
 .account-settings-rail { position:static; display:flex; gap:5px; max-height:none; overflow:auto; padding:5px; }
 .settings-rail-label { display:none; }
 .settings-rail-item { flex:none; }
 .settings-view-panel { padding:16px; }
 .settings-overview-card { flex-wrap:wrap; }
 .settings-action-button { margin-left:auto; }
}
.media-header-actions { display:flex; align-items:center; gap:8px; }
.media-back-button { min-height:36px; padding:0 11px; border:1px solid #777c83; border-radius:9px; background:#30343a; color:#e9e7e1; font:inherit; font-size:12px; }
.media-back-button:hover { border-color:var(--en-gold); color:var(--en-gold-light); }
.machine-state-never-connected { color:#c6c7c7; border-style:dashed; }
