/* Shared Flutter/Web brand assets and entry controls. Loaded after legacy themes. */
.brand-mark { display:inline-block; width:40px; height:40px; object-fit:cover; border-radius:23%; vertical-align:middle; flex-shrink:0; }
.login-logo .brand-mark { width:88px; height:88px; }
.brand-mark--small { width:32px; height:32px; }
#login-page { background:var(--c-bg) !important; padding:24px 16px; box-sizing:border-box; overflow-y:auto; }
#login-page::before, #login-page::after { display:none; }
@media (max-height:768px) { #login-page { align-items:flex-start; } }
#login-page .login-card { width:100%; max-width:400px; box-sizing:border-box; background:var(--c-surface) !important; border:1px solid var(--c-border); border-radius:20px !important; padding:32px 28px !important; box-shadow:var(--sh-2) !important; backdrop-filter:none; }
#login-page .login-logo h1 { color:var(--c-text); font-size:24px; font-weight:600; letter-spacing:0; }
#login-page .form-group { border-radius:12px !important; border:1px solid var(--c-border) !important; }
#login-page .form-group { display:flex; align-items:center; gap:12px; padding-inline:12px; }
#login-page .form-group .input-icon { position:static; transform:none; display:flex; flex:none; }
#login-page .form-group :is(input,select) { flex:1; min-width:0; width:100%; padding:11px 0; border:0; }
#login-page .form-group:focus-within { border-color:var(--c-brand) !important; background:var(--c-surface) !important; box-shadow:0 0 0 3px var(--c-brand-l) !important; }
#login-page .form-group input { color:var(--c-text); background:transparent; }
#login-page .form-group input:focus { background:transparent; }
#login-page .form-group input::placeholder { color:var(--c-text-2); opacity:1; }
#login-page .btn-primary { min-height:48px; border-radius:12px !important; background:var(--c-brand) !important; box-shadow:none !important; }
#login-page .btn-primary:hover { background:var(--c-brand-d) !important; }
#login-page .btn-primary:disabled { opacity:.55; cursor:not-allowed; }
#login-page button:focus-visible, #login-page a:focus-visible { outline:2px solid var(--c-brand); outline-offset:3px; }
.badge-system, .badge-im-service { display:inline-flex; align-items:center; gap:3px; white-space:nowrap; font-size:11px; line-height:18px; vertical-align:middle; }
.service-brand-mark { width:18px; height:18px; object-fit:cover; border-radius:4px; }
@media(max-width:480px) { #login-page .login-card { padding:28px 20px !important; } }
#tab-settings { background:var(--c-bg) !important; }
#tab-settings .settings-profile-card { background:var(--c-surface) !important; border:1px solid var(--c-border); box-shadow:var(--sh-1) !important; border-radius:16px; }
#tab-settings .settings-profile-card::before, #tab-settings .settings-profile-card::after { display:none; }
#tab-settings .settings-profile-name { color:var(--c-text) !important; font-weight:600; }
#tab-settings .settings-profile-sub, #tab-settings .settings-profile-bio { color:var(--c-text-2) !important; }
#tab-settings .settings-profile-card > span { color:var(--c-text-2) !important; }
#tab-settings .settings-avatar { color:#fff; border-color:var(--c-border) !important; box-shadow:none !important; }
#tab-settings .settings-section { border:1px solid var(--c-border); box-shadow:none; background:var(--c-surface); border-radius:12px; }
#tab-settings .settings-row { gap:14px; }
#tab-settings .settings-row-icon {
  width:34px !important; height:34px !important; border-radius:10px !important;
  background:var(--c-brand-l) !important; color:var(--c-brand) !important;
}
#tab-settings .reception-workbench-entry .settings-row-icon {
  background:rgba(65,109,165,.12) !important; color:#416da5 !important;
}
#tab-settings .settings-row--display .settings-row-icon {
  background:var(--c-surface-2) !important; color:var(--c-text-2) !important;
}
#tab-settings .settings-row--display .settings-row-icon svg { color:inherit !important; }
#tab-settings .settings-row[onclick*="doLogoutUser"] .settings-row-icon {
  background:#fff1f0 !important; color:#c94343 !important;
}
:root[data-theme="dark"] #tab-settings .settings-row-icon {
  background:rgba(115,214,173,.16) !important; color:#73d6ad !important;
}
:root[data-theme="dark"] #tab-settings .settings-row--display .settings-row-icon {
  background:var(--c-surface-2) !important; color:var(--c-text-2) !important;
}
:root[data-theme="dark"] #tab-settings .reception-workbench-entry .settings-row-icon {
  background:rgba(187,214,255,.16) !important; color:#bbd6ff !important;
}
:root[data-theme="dark"] #tab-settings .settings-row[onclick*="doLogoutUser"] .settings-row-icon {
  background:rgba(250,81,81,.14) !important; color:#ff9b9b !important;
}

/* Shared role palette across list identities and profile/settings chips. */
:root {
  --account-system:#52677f; --account-im:#087f5b;
  --account-seat:#416da5; --account-publication:#93631f; --account-official:#416da5;
  --account-role-alpha:9%;
}
:root[data-theme="dark"] {
  --account-system:#b6c5d8; --account-im:#73d6ad;
  --account-seat:#bbd6ff; --account-publication:#e5bd7a; --account-official:#a8c7f0;
  --account-role-alpha:16%;
}
.account-identity {
  display:inline-flex; align-items:center; white-space:nowrap; flex-shrink:0;
  margin-left:6px; padding:1px 5px; border-radius:4px;
  font-size:10px; line-height:1.3; font-weight:500; vertical-align:middle;
}
.account-role-chip {
  display:inline-flex; align-items:center; gap:4px; flex-shrink:0;
  padding:2px 8px; border-radius:4px; font-size:11px;
  line-height:1.35; font-weight:500; white-space:nowrap;
}
.account-identity, .account-role-chip {
  color:var(--account-role-color,var(--c-text-2));
  background:color-mix(in srgb, var(--account-role-color,var(--c-text-2)) var(--account-role-alpha), transparent);
}
.account-identity.badge-system { --account-role-color:var(--account-system); }
.account-identity.badge-im-service, .account-role-chip--im { --account-role-color:var(--account-im); }
.account-identity.badge-reception-seat, .account-role-chip--reception { --account-role-color:var(--account-seat); }
.account-identity.badge-official-account, .account-role-chip--publication { --account-role-color:var(--account-publication); }
.account-identity.badge-official, .account-role-chip--official { --account-role-color:var(--account-official); }

.account-name-row { display:flex; align-items:center; min-width:0; overflow:hidden; }
.account-name-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-name-row > [class^="badge-"], .account-name-row > .conv-offhours-badge, .account-name-row > .conv-reception-badge { flex-shrink:0; }
/* Four independent roles cannot all take space from a contact's name. */
.contact-name.account-name-row:has(> :nth-child(5)) { flex-wrap:wrap; column-gap:4px; row-gap:2px; overflow:visible; }
.contact-name.account-name-row:has(> :nth-child(5)) > .account-name-text { flex-basis:100%; }
.contact-name.account-name-row:has(> :nth-child(5)) > [class^="badge-"] { margin-left:0; }
.conv-last--visitor { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:anywhere; }
.conv-visitor-id { color:var(--identity-light); font-weight:600; font-variant-numeric:tabular-nums; }
:root[data-theme="dark"] .conv-visitor-id { color:var(--identity-dark); }
.reception-disclosure {
  padding:9px 16px; flex-shrink:0; font-size:12px; line-height:1.5;
  color:#365b85; background:#eef5fc; border-bottom:1px solid #d8e6f4;
}
:root[data-theme="dark"] .reception-disclosure {
  color:#c1d7f1; background:#1d3043; border-bottom-color:#38536c;
}
#login-page .toggle-mode a { color:var(--c-protection-ok) !important; }
#login-page .login-subtitle { color:var(--c-text-2) !important; }

/* Device sessions: shared Android/Web card hierarchy and theme colors. */
.device-manager-panel { background:var(--c-bg); color:var(--c-text); border-radius:16px; width:92%; max-width:520px; max-height:90dvh; overflow-y:auto; box-shadow:0 8px 32px rgba(0,0,0,.18); }
.device-manager-header { display:flex; align-items:center; gap:4px; padding:8px 12px 8px 20px; border-bottom:1px solid var(--c-border); background:var(--c-surface); position:sticky; top:0; z-index:1; }
.device-manager-header h2 { flex:1; margin:0; font-size:17px; font-weight:600; }
.device-header-action { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex:0 0 44px; border:0; border-radius:10px; background:transparent; color:var(--c-text-2); font-size:24px; cursor:pointer; }
.device-manager-body { padding:16px; }
#device-list { display:flex; flex-direction:column; gap:10px; }
#kick-others-btn { width:100%; min-height:44px; padding:12px; margin-bottom:16px; background:color-mix(in srgb,var(--c-danger) 12%,var(--c-surface)); color:var(--c-danger); border:1px solid var(--c-danger); border-radius:10px; font-size:15px; cursor:pointer; }
.device-session-row { display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:12px; background:var(--c-surface); box-shadow:0 2px 6px rgba(0,0,0,.04); }
.device-session-icon { width:44px; height:44px; flex:0 0 44px; display:flex; align-items:center; justify-content:center; border-radius:10px; color:#fff; background:#5856d6; font-size:22px; }
.device-session-icon.native { background:#34a853; }
.device-session-detail { flex:1; min-width:0; color:var(--c-text-2); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.device-session-name { font-size:15px; font-weight:500; color:var(--c-text); }
.device-current-badge { display:inline-block; padding:2px 8px; margin:6px 0 4px; border-radius:10px; background:color-mix(in srgb,var(--green) 14%,var(--c-surface)); color:var(--green); font-size:11px; }
.device-kick { min-width:44px; min-height:44px; padding:8px; border:0; border-radius:8px; background:transparent; color:var(--c-danger); cursor:pointer; font-size:13px; }
.device-list-status { padding:30px 0; text-align:center; color:var(--c-text-2); }
.device-list-error { color:var(--c-danger); }
#device-manager-modal button:disabled { opacity:.5; cursor:default; }
#device-manager-modal button:focus-visible { outline:2px solid var(--green); outline-offset:2px; }
@media(max-width:360px) { .device-session-row { padding:12px; gap:8px; } .device-manager-body { padding:12px; } }

/* Shared conversation/group search controls follow the active color scheme. */
.search-wrap .search-input, .search-input {
  box-sizing:border-box;
  min-height:44px;
  border-radius:12px;
  color:var(--c-text);
  caret-color:var(--c-brand);
  background:var(--c-surface-2);
}
.search-input::placeholder { color:var(--c-text); opacity:1; }
.search-input:focus {
  color:var(--c-text);
  background:var(--c-surface);
  box-shadow:0 0 0 2px var(--c-brand-l), var(--sh-1);
}

/* Protected media uses the same card in ordinary and reception group messages. */
.group-media-card { width:280px; max-width:100%; min-width:0; }
.group-media-play { box-sizing:border-box; width:100%; min-height:72px; display:flex; align-items:center; gap:12px; padding:14px; border:1px solid var(--c-border); border-radius:14px; color:var(--c-text); background:var(--c-surface); font:inherit; text-align:left; cursor:pointer; }
.group-media-icon { width:40px; height:40px; flex:0 0 40px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--c-brand-l); color:var(--c-brand); }
.group-media-info { display:flex; flex:1; min-width:0; flex-direction:column; gap:4px; overflow-wrap:anywhere; }
.group-media-title { font-size:1em; font-weight:600; line-height:1.4; }
.group-media-detail, .group-media-action { color:var(--c-text-2); font-size:.85em; line-height:1.5; }
.group-media-action { flex:0 1 auto; overflow-wrap:anywhere; }
.group-media-play:hover { background:var(--c-surface-2); }
.group-media-play:focus-visible { outline:2px solid var(--c-brand); outline-offset:2px; }
.group-media-play:disabled { cursor:wait; }
.group-media-player { display:block; width:100%; max-width:100%; border-radius:14px; }
.group-media-play[hidden], .group-media-player[hidden] { display:none; }
@media(max-width:360px) { .group-media-play { padding:10px; gap:8px; } }
.msg-row[data-message-type="audio"] > .msg-content-wrap,
.msg-row[data-message-type="video"] > .msg-content-wrap { width:280px; min-width:0; max-width:calc(100% - 76px); }
.cs-mirror-row[data-message-type="audio"] > .msg-content-wrap,
.cs-mirror-row[data-message-type="video"] > .msg-content-wrap { max-width:82%; }

.conversation-search-scope { width:100%; min-height:44px; margin-top:8px; padding:8px; border:1px solid var(--c-border); border-radius:10px; font:inherit; font-size:12px; color:var(--c-text); background:var(--c-surface); }
.conversation-search-status { margin:6px 0 0; color:var(--c-text-2); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.conversation-search-status:empty { display:none; }
.conversation-search-scope:focus-visible { outline:2px solid var(--c-brand); outline-offset:2px; }

.conversation-search-results { border-bottom:1px solid var(--c-border); background:var(--c-surface); max-height:50dvh; min-height:0; overflow:auto; flex-shrink:1; }
.conversation-search-heading { padding:8px 14px; color:var(--c-text-2); font-size:12px; font-weight:600; }
.conversation-search-result { cursor:pointer; min-height:64px; }
.conversation-search-result .search-message-preview { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; color:var(--c-text-2); }
.conversation-search-result mark { background:color-mix(in srgb,var(--c-brand) 18%,var(--c-surface)); color:var(--c-text); padding:0; }
.conversation-search-result:focus-visible { outline:2px solid var(--c-brand); outline-offset:-2px; }

/* Search location uses the same controls in private and group histories. */
.history-location {display:flex;align-items:center;gap:12px;padding:8px 12px;flex-shrink:0;color:var(--c-text-2);font-size:12px;line-height:1.5;background:var(--c-surface)}
.history-location [role="status"] {flex:1;min-width:0;overflow-wrap:anywhere}
.history-location button {flex-shrink:0;min-height:44px;border:1px solid var(--c-border);border-radius:10px;background:var(--c-surface);color:var(--c-text);padding:6px 10px;font:inherit;cursor:pointer}
.history-location button:focus-visible {outline:2px solid var(--c-brand);outline-offset:2px}
.history-location-target {background:color-mix(in srgb,var(--c-brand) 16%,var(--c-surface));outline:2px solid var(--c-brand);outline-offset:-2px;border-radius:10px;scroll-margin-block:16px}

/* Identity accents do not change message protection or approval status colours. */
.msg-row, .message-identity, .reception-reply, .cs-mirror-row .msg-bubble { --identity-accent:var(--identity-light,#56677d); }
:root[data-theme="dark"] .msg-row, :root[data-theme="dark"] .message-identity, :root[data-theme="dark"] .reception-reply, :root[data-theme="dark"] .cs-mirror-row .msg-bubble { --identity-accent:var(--identity-dark,#b4c7df); }
.message-identity { display:inline-flex; max-width:100%; box-sizing:border-box; padding:1px 6px; border-radius:6px; font-size:11px; line-height:18px; font-weight:600; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; color:var(--identity-accent); background:color-mix(in srgb,var(--identity-accent) 9%,var(--c-surface)); border:1px solid color-mix(in srgb,var(--identity-accent) 30%,transparent); }
.message-identity-header { display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; margin-bottom:4px; min-width:0; max-width:100%; font-size:11px; color:var(--c-text-2); }
.message-identity-header .message-sender-label { min-width:0; overflow-wrap:anywhere; }
.msg-row.mine .message-identity-header { justify-content:flex-end; }
.msg-row.identity-marked > .msg-avatar { border-radius:8px; outline:2px solid var(--identity-accent); outline-offset:2px; }
.msg-row .msg-content, .msg-row .msg-content-wrap { min-width:0; }
.reception-identity { display:flex; flex-wrap:wrap; gap:4px 6px; align-items:center; margin-bottom:6px; font-size:11px; color:var(--c-text-2); }
.cs-mirror-row .msg-bubble.other, .msg-bubble.reception-reply { background:color-mix(in srgb,var(--visitor-accent,var(--account-seat)) 8%,var(--c-surface)); }

/* Group voice uses the same compact controls as private voice; video keeps its card. */
.group-audio .group-media-play { width:44px; height:44px; min-height:44px; padding:0; gap:0; border:0; background:transparent; color:var(--voice-ink); }
.group-audio .group-media-play:hover { background:color-mix(in srgb,currentColor 7%,transparent); }
.group-audio .group-media-play:disabled { cursor:default; }
.group-audio .audio-portrait-image { position:relative; }

.group-audio .audio-dur { color:inherit; font-size:12px; }

/* Friend remarks use the same accessible controls and status text on both ends. */
.fd-profile, .fd-section, .fd-danger-section {background:var(--c-surface);}
.fd-close-bar {background:var(--c-surface);color:var(--c-text);border-color:var(--c-border);}
.fd-row:hover {background:var(--c-surface-2);}
.fd-row-source {color:var(--c-text-2);}
.fd-name, .fd-row-value {color:var(--c-text);}
.fd-bio {color:var(--c-text-2);}
.fd-avatar {border-color:var(--c-surface);}
.fd-btn-default {background:var(--c-surface-2);color:var(--c-text);}
.fd-btn-primary {background:var(--c-brand);color:var(--c-on-brand,#fff);}
.fd-remark-editor {background:var(--c-surface);border-color:var(--c-border);}
.fd-remark-editor input {min-height:48px;background:var(--c-surface);color:var(--c-text);border-color:var(--c-border);}
.fd-remark-editor-btns {flex-wrap:wrap;}
.fd-remark-editor-btns .fd-btn {flex:0 0 auto;min-width:88px;min-height:48px;padding:10px 16px;white-space:nowrap;border-radius:var(--r-md);}
.fd-remark-status {margin:8px 16px;color:var(--c-text-2);line-height:1.6;}
.fd-remark-status:empty {display:none;}
.fd-remark-editor input:disabled {opacity:.7;}

/* Shared owned financial forms; controls remain reachable beside the keyboard. */
.money-dialog .modal {max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;overflow:hidden;}
.money-dialog .modal-body {overflow-y:auto;min-height:0;background:var(--c-surface)!important;}
.money-dialog .modal-header, .money-dialog .modal-footer {flex-shrink:0;background:var(--c-surface)!important;color:var(--c-text)!important;}
.money-dialog .modal-header h3, .money-dialog .modal-header .modal-close, #transfer-to-name, #transfer-remark {color:var(--c-text)!important;}
#rp-modal-subtitle {color:var(--c-text-2)!important;overflow-wrap:anywhere;}
.money-dialog .modal-footer {flex-wrap:wrap;}
.money-dialog button {min-height:48px;white-space:nowrap;}
.money-dialog input {min-height:48px;color:var(--c-text)!important;}
.money-policy, .money-status {color:var(--c-text-2);font-size:13px;line-height:1.6;overflow-wrap:anywhere;}
.money-dialog .transfer-user-item {width:100%;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:4px;border:0;background:var(--c-surface);color:var(--c-text);padding:12px;overflow-wrap:anywhere;}
.money-dialog .transfer-user-item:hover {background:var(--c-surface-2);}

/* Packet receipts own a bounded scroll area; closing never depends on claiming. */
.rp-detail-overlay {position:fixed;inset:0;z-index:9100;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:16px;}
.rp-detail-card {width:360px;max-width:100%;max-height:calc(100dvh - 32px);display:flex;flex-direction:column;overflow:hidden;border-radius:20px;background:var(--c-surface,#fff);color:var(--c-text,#20262e);box-shadow:0 16px 48px rgba(0,0,0,.24);}
.rp-detail-scroll {min-height:0;overflow:auto;overscroll-behavior:contain;}
.rp-detail-heading {background:linear-gradient(135deg,#d94439,#9f2726);padding:24px 20px;color:#fff;text-align:center;overflow-wrap:anywhere;}
.rp-detail-heading h3 {font-size:1.15rem;margin:10px 0 6px;}
#rp-detail-sender {font-size:.8rem;opacity:.85;}
#rp-detail-claimed-mine {margin-top:16px;}
#rp-detail-my-amount {display:block;font-size:2.4rem;color:#ffe4a0;}
#rp-claim-btn-area {padding:12px 16px 0;text-align:center;}
.rp-detail-card button {min-height:48px;font:inherit;cursor:pointer;border:0;border-radius:12px;padding:12px 20px;max-width:100%;}
#rp-open-btn {background:#ffe0a0;color:#704416;font-weight:700;border-radius:28px;padding-inline:40px;}
#rp-check-result {background:var(--c-bg,#f5f6f8);color:var(--c-text,#20262e);}
.rp-detail-card button:disabled {opacity:.65;cursor:default;}
#rp-detail-status {padding:8px 16px;margin:0;text-align:center;font-size:.9rem;overflow-wrap:anywhere;}
.rp-detail-records {border-top:1px solid var(--c-border,#e5e7eb);padding:12px 16px;}
#rp-claims-summary,.rp-empty {font-size:.8rem;color:var(--c-text-2,#68717e);}
.rp-claim-row {display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--c-border,#e5e7eb);flex-wrap:wrap;}
.rp-claim-avatar {position:relative;width:36px;height:36px;flex:none;border-radius:9px;display:grid;place-items:center;background:#b73830;color:#fff;}
.rp-claim-person {flex:1;min-width:0;overflow-wrap:anywhere;}
.rp-claim-person small {color:var(--c-text-2,#68717e);font-size:.75rem;}
.rp-claim-row strong {font-size:.9rem;color:#b73830;overflow-wrap:anywhere;}
.rp-detail-card footer {padding:12px 16px;flex:none;border-top:1px solid var(--c-border,#e5e7eb);}
#rp-detail-close {width:100%;background:var(--c-bg,#f5f6f8);color:var(--c-text,#20262e);}

.apr-recovery-entry,.apr-recovery-link {min-height:44px;padding:10px 14px;border:1px solid var(--c-border);border-radius:var(--r-md,12px);background:var(--c-surface);color:var(--c-brand);font:inherit;cursor:pointer;}
.apr-recovery-entry {display:block;width:calc(100% - 24px);margin:12px;}
.apr-recovery-row {padding:16px;margin:12px 0;border:1px solid var(--c-border);border-radius:var(--r-lg,16px);background:var(--c-bg);overflow-wrap:anywhere;}
.apr-recovery-row h3 {margin:0 0 8px;font-size:1rem;font-weight:600;}
.apr-recovery-row p {margin:8px 0;font-size:.875rem;line-height:1.6;}
.apr-recovery-actions {display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.apr-recovery-actions button {min-height:48px!important;max-width:100%;font:inherit;}
.apr-recovery-dialog .apr-dialog-body {min-width:0;}
.apr-recovery-dialog h2 {overflow-wrap:anywhere;}

/* Moments use the same quiet media action style as group cards. */
.moment-protected-video { box-sizing:border-box; width:100%; min-width:0; min-height:132px; display:flex; align-items:center; justify-content:center; gap:10px; padding:12px; border:1px solid var(--c-border); border-radius:8px; background:var(--c-surface-2); color:var(--c-text); font:inherit; cursor:pointer; }
.moment-video-play-icon { width:32px; height:32px; flex:0 0 32px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--c-brand-l); color:var(--c-brand); }
.moment-protected-video:hover { background:var(--c-surface); }
.moment-protected-video:focus-visible { outline:2px solid var(--c-brand); outline-offset:2px; }
.moment-protected-video[aria-busy="true"] { cursor:progress; color:var(--c-text-2); }
.moment-protected-video[data-state="error"] { color:var(--c-danger); }
.moment-video-play-label { overflow-wrap:anywhere; font-size:13px; }
.moment-media-pick-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  padding: 0 5px;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--c-text-2);
  font-size: 12px;
  cursor: pointer;
}
.moment-media-pick-btn:hover { color: var(--c-brand); background: var(--c-surface); }
.moment-media-pick-btn:focus-visible { outline: 2px solid var(--c-brand); outline-offset: 2px; }

/* Approval status panels keep their full warning visible at every width. */
.apr-notice { display:flex; align-items:flex-start; gap:12px; padding:14px; margin:12px 0 16px; border:1px solid var(--c-border); border-radius:14px; background:var(--c-bg); color:var(--c-text-2); }
.apr-notice-icon { flex:0 0 22px; color:var(--c-brand); font-size:22px; line-height:1.4; }
.apr-notice-content { flex:1; min-width:0; }
.apr-notice-text { margin:0; font-size:.875rem; line-height:1.6; overflow-wrap:anywhere; }
.apr-notice-content > button { min-height:44px; max-width:100%; margin:6px 0 0!important; color:var(--c-brand)!important; background:transparent!important; border:0!important; font:inherit; white-space:normal; }
.apr-notice-content > button:focus-visible { outline:2px solid var(--c-brand); outline-offset:2px; }