/* Shared UI tokens keep light and dark surfaces consistent. */
.message-worklog {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 0 18px;
  color: var(--app-muted);
  font: 500 12px/1.55 "Manrope", sans-serif;
  -webkit-text-fill-color: currentColor;
}
.message-worklog > summary {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  width: fit-content;
  max-width: 100%;
  padding: 7px 0;
  list-style: none;
  cursor: pointer;
  border-radius: 8px;
}
.message-worklog > summary::-webkit-details-marker { display: none; }
.message-worklog > summary:focus-visible { outline: 2px solid var(--app-accent); outline-offset: 3px; }
.message-worklog .worklog-label { flex-shrink: 0; font-weight: 700; color: var(--app-ink); }
.message-worklog .worklog-status { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.message-worklog summary > svg { width: 16px; height: 16px; flex: 0 0 16px; fill: none; stroke: currentColor; stroke-width: 1.6; transition: transform 160ms ease; }
.message-worklog[open] summary > svg { transform: rotate(180deg); }
.worklog-indicator { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--app-muted); }
.message-worklog--active .worklog-indicator { background: var(--app-accent); box-shadow: 0 0 0 4px var(--app-surface-hover); }
.message-worklog .worklog-steps { list-style: none; margin: 4px 0 12px 3px; padding: 0 0 0 20px; border-left: 1px solid var(--app-line); }
.message-worklog .worklog-step { position: relative; margin: 0; padding: 0 0 16px; overflow-wrap: anywhere; }
.message-worklog .worklog-step:last-child { padding-bottom: 0; }
.message-worklog .worklog-step::before { content: ""; position: absolute; left: -24px; top: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--app-line); box-shadow: 0 0 0 3px var(--app-surface); }
.message-worklog .worklog-step--running::before { background: var(--app-accent); }
.message-worklog .worklog-step--error::before { background: #c16c67; }
.message-worklog .worklog-step > b { display: block; color: var(--app-ink); font-size: 12px; font-weight: 650; }
.message-worklog .worklog-step > p { margin: 3px 0 0; color: var(--app-muted); font: inherit; }
.message-worklog .source-links { max-width: 100%; }
@media (max-width: 760px) {
  .message-worklog { font-size: 11px; margin-bottom: 12px; }
  .message-worklog > summary { gap: 7px; }
  .message-worklog .worklog-status { max-width: 46vw; }
}

:root {
  --app-canvas: #eef2f6;
  --app-surface: #ffffff;
  --app-surface-soft: #f5f7fa;
  --app-surface-hover: #edf3f9;
  --app-ink: #172f4b;
  --app-muted: #5c7088;
  --app-line: #dce4ed;
  --app-accent: #225f9b;
  --app-on-accent: #ffffff;
  --app-shadow: 0 8px 28px rgba(25, 49, 77, 0.06);
}

:root[data-theme="dark"] {
  --app-canvas: #0b131e;
  --app-surface: #111e2c;
  --app-surface-soft: #152536;
  --app-surface-hover: #1c3045;
  --app-ink: #e6eef7;
  --app-muted: #a5b7cb;
  --app-line: #293d52;
  --app-accent: #76b9f2;
  --app-on-accent: #0b233c;
  --app-shadow: 0 8px 28px rgba(0, 0, 0, 0.14);
}

:root[data-theme] body { background: var(--app-canvas); }
:root[data-theme] .ambient,
:root[data-theme] .grain { display: none; }
:root[data-theme] .app { gap: 12px; padding: 12px; }
:root[data-theme] .sidebar,
:root[data-theme] .chat-layout { border-color: var(--app-line); box-shadow: var(--app-shadow); }
:root[data-theme] .sidebar { background: var(--app-surface-soft); border-radius: 20px; }
:root[data-theme] .chat-layout { background: var(--app-surface); border-radius: 20px; }
:root[data-theme] .account-card { background: var(--app-surface); border-color: var(--app-line); box-shadow: none; }
:root[data-theme] .sidebar-foot { border-color: var(--app-line); }
:root[data-theme] .search-chat { background-color: var(--app-surface); border-color: var(--app-line); color: var(--app-ink); }
:root[data-theme] .search-chat::placeholder { color: var(--app-muted); }
:root[data-theme] .search-chat:focus { background-color: var(--app-surface); }
:root[data-theme] .history-item--active { background: var(--app-surface); box-shadow: none; }
:root[data-theme] .history-item:hover { background: var(--app-surface-hover); }
:root[data-theme] .history-title { font: 700 13px/1.45 "Manrope", sans-serif; }
:root[data-theme] .history-sub,
:root[data-theme] .empty-history { color: var(--app-muted); }
:root[data-theme] .history-actions { flex-shrink: 0; }
:root[data-theme] .sidebar-title-row { gap: 8px; }
:root[data-theme] .sidebar-title { flex: 1; }
:root[data-theme] .sidebar-close-btn { display: none; }

/* Utility icons use one optical size and one alignment model. */
:root[data-theme] :is(.menu-btn, .quick-new-chat-btn, .new-chat, .settings-btn, .voice-call-btn--topbar,
.voice-btn, .attach-btn, .sidebar-close-btn, .modal-close, .voice-call-close,
.settings-back-btn, .support-back-btn, .referrals-back-btn, .faq-back-btn, .rules-back) {
  flex-shrink: 0;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  line-height: 1;
}
:root[data-theme] .menu-btn { gap: 7px; padding-inline: 12px; }
:root[data-theme] .menu-btn svg,
:root[data-theme] .sidebar-close-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
:root[data-theme] .sidebar-close-btn { display: none; }
:root[data-theme] .menu-btn::before,
:root[data-theme] .menu-btn::after { display: none; }
:root[data-theme] :is(.quick-new-chat-btn, .new-chat, .settings-btn, .voice-call-btn--topbar, .voice-btn, .attach-btn,
.sidebar-close-btn, .modal-close, .voice-call-close) {
  background: var(--app-surface);
  border: 1px solid var(--app-line);
  color: var(--app-ink);
  box-shadow: none;
}
:root[data-theme] :is(.quick-new-chat-btn, .new-chat, .settings-btn, .voice-call-btn--topbar, .voice-btn, .attach-btn,
.sidebar-close-btn, .modal-close):hover { background: var(--app-surface-hover); box-shadow: none; transform: none; }
:root[data-theme] :is(.settings-btn, .new-chat, .quick-new-chat-btn, .attach-btn, .voice-call-btn--topbar)::after { left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; }
:root[data-theme] button:focus-visible,
:root[data-theme] a:focus-visible { outline: 2px solid var(--app-accent); outline-offset: 3px; }

:root[data-theme] .topbar { padding: 15px 22px; background: var(--app-surface); border-color: var(--app-line); min-height: 70px; }
:root[data-theme] .topbar-row { min-width: 0; align-items: center; }
:root[data-theme] .topbar-title { min-width: 0; flex: 1; }
:root[data-theme] .topbar-title h1 { margin: 0; font: 750 18px/1.4 "Manrope", sans-serif; letter-spacing: -0.025em; color: var(--app-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:root[data-theme] .topbar-actions { gap: 8px; flex-shrink: 0; }
:root[data-theme] .topbar-actions > button { box-shadow: none; }
:root[data-theme] .chat-layout--active .topbar { padding-block: 12px; min-height: 64px; }

/* A quieter welcome screen leaves more room for the user's task. */
:root[data-theme] .chat-intro { padding-top: clamp(20px, 5vh, 58px); padding-bottom: 24px; }
:root[data-theme] .start-card { border-radius: 22px; padding: 34px 38px; background: linear-gradient(140deg, var(--app-surface-soft), var(--app-surface)); border-color: var(--app-line); box-shadow: none; }
:root[data-theme] .start-card::before,
:root[data-theme] .start-card::after { display: none; }
:root[data-theme] .start-eyebrow { padding: 0; border: 0; background: none; box-shadow: none; color: var(--app-accent); letter-spacing: 0.15em; }
:root[data-theme] .start-card h2 { font-size: clamp(32px, 3.5vw, 46px); line-height: 1.12; letter-spacing: -0.035em; color: var(--app-ink); }
:root[data-theme] .start-subtitle { color: var(--app-muted); max-width: 620px; margin-inline: auto; line-height: 1.65; }
:root[data-theme] .start-capabilities { gap: 7px; }
:root[data-theme] .start-capabilities li { background: var(--app-surface); border-color: var(--app-line); color: var(--app-muted); box-shadow: none; }
:root[data-theme] .suggest { background: var(--app-surface); border-color: var(--app-line); box-shadow: none; color: var(--app-ink); font-weight: 650; border-radius: 14px; }
:root[data-theme] .suggest:hover { background: var(--app-surface-soft); box-shadow: none; }

/* Keep the input, controls and answer surfaces in the same palette. */
:root[data-theme] .composer-wrap { background: var(--app-surface); border-top-color: var(--app-line); }
:root[data-theme] .composer { background: var(--app-surface-soft); border-color: var(--app-line); box-shadow: none; padding: 12px; gap: 8px; border-radius: 18px; }
:root[data-theme] .composer:focus-within { border-color: var(--app-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--app-accent) 10%, transparent); }
:root[data-theme] .composer textarea { padding: 3px 2px; background: transparent; color: var(--app-ink); caret-color: var(--app-accent); min-height: 38px; }
:root[data-theme] .composer textarea::placeholder { color: var(--app-muted); }
:root[data-theme] .pending-uploads:empty { display: none; }
:root[data-theme] .model-switch,
:root[data-theme] .topic-select { background: var(--app-surface); border-color: var(--app-line); box-shadow: none; }
:root[data-theme] .model-btn { color: var(--app-muted); min-height: 36px; border-radius: 9px; }
:root[data-theme] .model-btn--active { color: var(--app-on-accent); background: var(--app-accent); box-shadow: none; }
:root[data-theme] .topic-select,
:root[data-theme] .topic-select span,
:root[data-theme] .topic-select select { color: var(--app-ink); }
:root[data-theme] .topic-select select { background-color: transparent; }
:root[data-theme] .send-btn { background: var(--app-accent); color: var(--app-on-accent); box-shadow: none; min-height: 40px; border-radius: 12px; }
:root[data-theme] .send-btn:hover { box-shadow: none; }
:root[data-theme] .status,
:root[data-theme] .tip { color: var(--app-muted); font-weight: 500; }
:root[data-theme] .status { overflow-wrap: anywhere; }
:root[data-theme] .composer-meta { gap: 8px; min-height: 16px; }
:root[data-theme] .message--assistant { background: var(--app-surface); color: var(--app-ink); border-color: var(--app-line); box-shadow: none; }
:root[data-theme] .message--assistant.message--streaming,
:root[data-theme] .message--assistant.message--streaming :is(p, li, h1, h2, h3, h4, strong, em, blockquote, code) { color: var(--app-ink); -webkit-text-fill-color: currentColor; }
:root[data-theme] .message--assistant :is(p, li, strong) { overflow-wrap: anywhere; }
:root[data-theme] .message--assistant pre { max-width: 100%; overflow-x: auto; }
:root[data-theme] .message--assistant table { max-width: 100%; }
:root[data-theme] .followup-row { min-width: 0; max-width: 100%; }
:root[data-theme] .followup-chip { background: var(--app-surface-soft); color: var(--app-ink); border-color: var(--app-line); box-shadow: none; font-weight: 600; }
:root[data-theme] .message-action-btn,
:root[data-theme] .source-pill { box-shadow: none; }

/* Solid, bounded dialogs stay readable over either theme. */
:root[data-theme] .modal { padding: 16px; background: rgba(7, 18, 31, 0.48); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
:root[data-theme] .modal-card { background: var(--app-surface); border-color: var(--app-line); color: var(--app-ink); max-height: calc(100dvh - 32px); overscroll-behavior: contain; scrollbar-width: thin; scroll-padding-block: 20px; }
:root[data-theme] .modal-card--narrow { padding: 24px; }
:root[data-theme] .modal-card h2 { font: 750 28px/1.2 "Manrope", sans-serif; letter-spacing: -0.04em; padding-right: 26px; color: var(--app-ink); }
:root[data-theme] .modal-note,
:root[data-theme] .modal-kicker,
:root[data-theme] .auth-field,
:root[data-theme] .auth-provider-note { color: var(--app-muted); }
:root[data-theme] .modal-status:empty { display: none; }
:root[data-theme] .modal-form { gap: 9px; }
:root[data-theme] .modal-form input,
:root[data-theme] .modal-form textarea,
:root[data-theme] .modal-form select { background: var(--app-surface-soft); border-color: var(--app-line); color: var(--app-ink); }
:root[data-theme] .modal-form input::placeholder { color: var(--app-muted); }
:root[data-theme] .auth-tabs { margin-block: 16px; background: var(--app-surface-soft); border-color: var(--app-line); }
:root[data-theme] .auth-tab { color: var(--app-muted); }
:root[data-theme] .auth-tab--active { background: var(--app-surface); color: var(--app-ink); box-shadow: 0 1px 4px rgba(0,0,0,.06); }
:root[data-theme] .auth-provider-divider { margin-block: 18px 12px; color: var(--app-muted); }
:root[data-theme] .auth-terms,
:root[data-theme] .auth-captcha,
:root[data-theme] .auth-bonus { background: var(--app-surface-soft); border-color: var(--app-line); box-shadow: none; }
:root[data-theme] .auth-terms-control { align-items: start; }
:root[data-theme] .auth-terms-copy { font-size: 12px; line-height: 1.55; color: var(--app-ink); font-weight: 500; }
:root[data-theme] .auth-terms-copy a { color: var(--app-accent); text-underline-offset: 3px; }
:root[data-theme] .auth-terms small { color: var(--app-muted); line-height: 1.5; }
:root[data-theme] .auth-captcha { grid-template-columns: minmax(0, 1fr) 72px 40px; gap: 8px; }
:root[data-theme] .auth-captcha input { padding-inline: 8px; text-align: center; }
:root[data-theme] .auth-password-toggle { min-height: 32px; margin-top: 0; color: var(--app-accent); }

:root[data-theme] .settings-page-head,
:root[data-theme] .referrals-head,
:root[data-theme] .support-head,
:root[data-theme] .faq-head { border-color: var(--app-line); }
:root[data-theme] .settings-page-title h2 { color: var(--app-ink); }
:root[data-theme] .settings-account-name,
:root[data-theme] .settings-account-meta { overflow-wrap: anywhere; }
:root[data-theme] .settings-menu-list { min-width: 0; }
:root[data-theme] .settings-page-content { scrollbar-gutter: stable; }
:root[data-theme] .settings-detail-panel { box-shadow: none; }
:root[data-theme] .login-history { overflow-wrap: anywhere; }
:root[data-theme] .referral-table-wrap { max-width: 100%; overflow-x: auto; }
:root[data-theme] .rules-shell { box-shadow: var(--app-shadow); }
:root[data-theme] .rules-back,
:root[data-theme] .rules-card,
:root[data-theme] .rules-summary { border-color: var(--app-line); box-shadow: none; }

/* Install is an unobtrusive suggestion, not a second input panel. */
:root[data-theme] .install-banner { width: min(430px, calc(100% - 24px)); padding: 12px; border-color: var(--app-line); background: var(--app-surface); box-shadow: 0 8px 32px rgba(8, 28, 51, 0.16); border-radius: 16px; }
:root[data-theme] .install-banner-title { color: var(--app-ink); }
:root[data-theme] .install-banner-text { color: var(--app-muted); }
:root[data-theme] .install-banner-action { box-shadow: none; }

@media (max-width: 1080px) {
  :root[data-theme] .app { padding: 0; gap: 0; }
  :root[data-theme] .chat-layout { border-radius: 0; }
  :root[data-theme] .sidebar { background: var(--app-surface-soft); border-radius: 0 20px 20px 0; }
  :root[data-theme] .sidebar-close-btn { display: inline-flex; }
  :root[data-theme] .sidebar-title-row .new-chat { margin-left: auto; }
  :root[data-theme] .topbar-actions .menu-btn { display: inline-flex; }
  :root[data-theme] .sidebar-backdrop { backdrop-filter: none; -webkit-backdrop-filter: none; }
}

@media (max-width: 760px) {
  :root[data-theme] .topbar,
:root[data-theme] .chat-layout--active .topbar { padding: max(10px, env(safe-area-inset-top)) 12px 10px; min-height: 64px; }
  :root[data-theme] .topbar-title h1 { font-size: 16px; }
  :root[data-theme] .topbar-actions { gap: 6px; }
  :root[data-theme] .topbar-actions > button { min-width: 40px; height: 40px; border-radius: 12px; }
  :root[data-theme] .topbar-actions .menu-btn { width: auto; padding-inline: 10px; }
  :root[data-theme] .chat-intro { padding-top: 18px; padding-bottom: 16px; }
  :root[data-theme] .start-card { padding: 23px 16px; border-radius: 18px; }
  :root[data-theme] .start-card h2 { font-size: 31px; line-height: 1.12; }
  :root[data-theme] .start-subtitle { font-size: 12px; line-height: 1.6; margin-block: 14px; }
  :root[data-theme] .start-capabilities { gap: 5px; margin-top: 16px; }
  :root[data-theme] .start-capabilities li { padding: 5px 7px; font-size: 9px; }
  :root[data-theme] .suggest-grid { gap: 8px; margin-top: 12px; }
  :root[data-theme] .suggest { min-height: 54px; padding-left: 34px; padding-right: 23px; font-size: 11px; line-height: 1.4; border-radius: 13px; }
  :root[data-theme] .suggest::before { left: 11px; width: 14px; height: 14px; }
  :root[data-theme] .suggest::after { right: 10px; }
  :root[data-theme] .composer-wrap { padding: 8px 10px max(8px, env(safe-area-inset-bottom)); }
  :root[data-theme] .composer { width: 100%; padding: 10px; gap: 7px; border-radius: 16px; }
  :root[data-theme] .composer textarea { min-height: 32px; max-height: min(180px, 25dvh); }
  :root[data-theme] .tools-row { gap: 6px; }
  :root[data-theme] .model-switch { padding: 2px; }
  :root[data-theme] .model-btn { padding-inline: 7px; min-height: 34px; }
  :root[data-theme] .topic-select { min-height: 40px; }
  :root[data-theme] .voice-btn,
:root[data-theme] .attach-btn { width: 40px; height: 40px; }
  :root[data-theme] .voice-btn-icon { width: 21px; height: 21px; }
  :root[data-theme] .send-btn { min-height: 40px; }
  :root[data-theme] .composer-meta { min-height: 14px; padding: 0 1px; }
  :root[data-theme] .status { font-size: 10px; }
  :root[data-theme] .tip { display: none; }
  :root[data-theme] .modal { padding: 10px; }
  :root[data-theme] .modal-card { max-height: calc(100dvh - 20px); border-radius: 20px; }
  :root[data-theme] .modal-card--narrow { padding: 20px 18px; }
  :root[data-theme] .modal-card h2 { font-size: 25px; }
  :root[data-theme] .modal-note { font-size: 12px; line-height: 1.5; }
  :root[data-theme] .auth-bonus { padding: 9px 12px; }
  :root[data-theme] .auth-tabs { margin-block: 12px; }
  :root[data-theme] .auth-field { margin-top: 1px; }
  :root[data-theme] .auth-terms { padding: 10px; }
  :root[data-theme] .auth-terms small { font-size: 10px; }
  :root[data-theme] .install-banner { bottom: calc(var(--composer-inset) + 8px); grid-template-columns: 32px minmax(0, 1fr) auto 32px; column-gap: 9px; row-gap: 0; align-items: center; padding: 10px; }
  :root[data-theme] .install-banner-icon { width: 32px; height: 32px; border-radius: 10px; grid-column: 1; grid-row: 1; }
  :root[data-theme] .install-banner-copy { grid-column: 2; grid-row: 1; }
  :root[data-theme] .install-banner-title { font-size: 11px; line-height: 1.4; }
  :root[data-theme] .install-banner-text { font-size: 10px; line-height: 1.4; }
  :root[data-theme] .install-banner-action { grid-column: 3; grid-row: 1; width: auto; min-height: 36px; padding: 8px; font-size: 10px; border-radius: 10px; }
  :root[data-theme] .install-banner-action::before { display: none; }
  :root[data-theme] .install-banner-close { grid-column: 4; grid-row: 1; width: 32px; height: 32px; min-width: 32px; min-height: 32px; border-radius: 9px; }
  :root[data-theme] .message--assistant { border-radius: 16px; }
}

@media (max-width: 360px) {
  :root[data-theme] .topbar-actions { gap: 4px; }
  :root[data-theme] .menu-btn span { display: none; }
  :root[data-theme] .topbar-actions .menu-btn { width: 40px; padding: 0; }
  :root[data-theme] .start-card h2 { font-size: 28px; }
  :root[data-theme] .start-capabilities li { font-size: 8px; }
  :root[data-theme] .install-banner { grid-template-columns: 28px minmax(0, 1fr) auto 28px; gap: 7px; }
  :root[data-theme] .install-banner-action { max-width: 78px; }
}

@media (max-height: 640px) and (max-width: 1080px) {
  :root[data-theme] .chat-intro { padding-top: 12px; }
  :root[data-theme] .start-card { padding-block: 16px; }
  :root[data-theme] .start-card h2 { font-size: 29px; }
  :root[data-theme] .start-capabilities { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  :root[data-theme] .composer,
:root[data-theme] .topbar,
:root[data-theme] .suggest { transition: none; }
}

/* Secondary pages use the same surfaces as the conversation. */
:root[data-theme] :is(.settings-layout, .settings-page, .referrals-layout, .support-layout, .faq-layout) { background: var(--app-canvas); }
:root[data-theme] :is(.settings-page-head, .settings-page-nav, .support-head, .referrals-head, .faq-head) { background: var(--app-surface); }
:root[data-theme] :is(.settings-page-title h2, .support-head h2, .referrals-head h2, .faq-head h2) { font: 750 24px/1.2 "Manrope", sans-serif; letter-spacing: -0.035em; color: var(--app-ink); }
:root[data-theme] :is(.settings-detail-panel, .theme-setting-card, .support-panel, .referral-card, .referral-stat-card, .faq-card) { background: var(--app-surface); border-color: var(--app-line); box-shadow: none; }
:root[data-theme] :is(.settings-account-summary, .settings-menu-row, .buy-btn, .theme-choice-btn) { box-shadow: none; }
:root[data-theme] .settings-account-summary { background: var(--app-surface-soft); }
:root[data-theme] .settings-menu-row { color: var(--app-ink); }
:root[data-theme] .settings-menu-row--active { background: var(--app-surface-hover); color: var(--app-accent); }
:root[data-theme] .settings-nav-toggle { display: none; }
:root[data-theme] .profile-field-label { color: var(--app-muted); font-size: 12px; font-weight: 650; margin: 6px 0 -3px; }
:root[data-theme] .settings-page-status:empty { display: none; }
:root[data-theme] .settings-account-name { white-space: normal; overflow: visible; font-size: 12px; }
:root[data-theme] .settings-account-meta { white-space: normal; font-size: 11px; }
:root[data-theme] :is(.document-body-card, .document-save-panel) { background: var(--app-surface-soft); border-color: var(--app-line); border-radius: 16px; box-shadow: none; }
:root[data-theme] .document-body-head { background: var(--app-surface-soft); border-color: var(--app-line); }
:root[data-theme] .document-body-title { color: var(--app-ink); }
:root[data-theme] .document-body-title small { color: var(--app-muted); }
:root[data-theme] :is(.document-body-action, .document-save-btn) { min-height: 40px; border-radius: 10px; box-shadow: none; font-weight: 650; }
:root[data-theme] .document-body-paper { border-radius: 10px; box-shadow: none; background-image: none; }
:root[data-theme="dark"] .document-body-paper { background: #182a3c; color: #dfe8f2; border-color: var(--app-line); }
:root[data-theme="dark"] .document-body-paper :is(p, h1, h2, h3, h4, strong, li) { color: inherit; }
:root[data-theme] .document-body-actions { min-width: 0; }

@media (max-width: 860px) {
  :root[data-theme] .settings-page-nav { padding: 8px 12px; overflow: visible; }
  :root[data-theme] .settings-nav-toggle { width: 100%; min-height: 42px; display: flex; align-items: center; gap: 10px; padding: 9px 12px; color: var(--app-ink); background: var(--app-surface-soft); border: 1px solid var(--app-line); border-radius: 12px; font: inherit; font-size: 12px; }
  :root[data-theme] .settings-nav-toggle > span { color: var(--app-muted); }
  :root[data-theme] .settings-nav-toggle > b { margin-left: auto; font-weight: 650; }
  :root[data-theme] .settings-nav-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; transition: transform 160ms; }
  :root[data-theme] .settings-nav-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
  :root[data-theme] .settings-page-nav .settings-menu-list { display: none; }
  :root[data-theme] .settings-nav-toggle[aria-expanded="true"] + .settings-menu-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: min(360px, 45dvh); overflow: auto; gap: 6px; padding: 8px 0 0; }
  :root[data-theme] .settings-page-nav .settings-menu-row { width: 100%; min-width: 0; min-height: 44px; padding: 10px; white-space: normal; gap: 7px; font-size: 11px; background: var(--app-surface-soft); border: 1px solid var(--app-line); border-radius: 10px; }
  :root[data-theme] .settings-page-nav .settings-menu-row--active { color: var(--app-accent); background: var(--app-surface-hover); }
  :root[data-theme] .settings-page-nav .settings-menu-separator { display: none; }
  :root[data-theme] .settings-account-summary { display: block; }
  :root[data-theme] .settings-account-meta { text-align: left; margin-top: 4px; }
}

@media (max-width: 760px) {
  :root[data-theme] .start-capabilities { flex-wrap: nowrap; }
  :root[data-theme] .start-capabilities li { padding: 5px 7px; font-size: 9px; }
  :root[data-theme] .support-head { align-items: start; gap: 10px; }
  :root[data-theme] .support-head h2 { font-size: 21px; }
  :root[data-theme] .support-back-btn { min-width: 62px; padding-inline: 8px; }
  :root[data-theme] .document-body-head { align-items: start; flex-direction: column; gap: 10px; padding: 12px; }
  :root[data-theme] .document-body-actions { justify-content: start; gap: 6px; }
  :root[data-theme] .document-body-title b { white-space: normal; font-size: 13px; }
  :root[data-theme] .document-body-action { padding-inline: 10px; }
  :root[data-theme] .document-body-paper { padding: 18px 14px; margin: 8px; }
}

:root[data-theme] .sidebar-title-row { display: flex; align-items: center; }
:root[data-theme] .search-chat { background-position: 13px center; background-repeat: no-repeat; background-size: 17px 17px; }
:root[data-theme] .history-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
:root[data-theme] .history-sub { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
:root[data-theme] .chat-action { background: var(--app-surface); color: var(--app-muted); border-color: var(--app-line); }
:root[data-theme] body.ui-overlay-open .install-banner { visibility: hidden; pointer-events: none; }
@media (min-width: 1081px) {
  :root[data-theme] .topbar-actions .menu-btn { display: none; }
}

:root[data-theme] body:has(.composer:focus-within) .install-banner { display: none; }
:root[data-theme] .history-actions { opacity: 0.7; }
:root[data-theme] .history-item:hover .history-actions { opacity: 1; }
@media (hover: none) {
  :root[data-theme] .history-actions { opacity: 1; }
}
@media (max-width: 760px) {
  :root[data-theme] .start-capabilities { display: none; }
  :root[data-theme] .start-card { padding-block: 20px; }
}
:root[data-theme] body:has(.chat-layout--active) .install-banner { display: none; }

/* Mask icons participate in the button's centering, never in a second offset. */
:root[data-theme] :is(.settings-btn, .new-chat, .attach-btn, .voice-call-btn--topbar,
.voice-btn, .referrals-back-btn, .chat-action, .auth-captcha-refresh)::after {
  position: static;
  inset: auto;
  margin: 0;
  transform: none;
  flex: 0 0 auto;
  align-self: center;
  pointer-events: none;
}