/* New controls in the original Ada design. */
.account-dialog, .history-drawer { color: var(--fg); background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 22px; width: min(520px, calc(100% - 24px)); max-height: calc(100dvh - 24px); overflow-y: auto; overflow-wrap: anywhere; }
.account-dialog::backdrop, .history-drawer::backdrop { background: #0009; }
.account-dialog h2, .history-drawer h2 { margin-top: 8px; }
.account-dialog label { display: block; margin: 14px 0 5px; }
.account-dialog input { box-sizing: border-box; width: 100%; min-height: 44px; padding: 8px 10px; color: var(--fg); background: var(--bg); border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.account-dialog a { color: var(--acc); }
.account-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 12px; }
.account-actions .chat-tool { min-height: 44px; font: inherit; cursor: pointer; }
.dialog-close { float: right; min-height: 44px; }
.history-drawer { position: fixed; inset: 0 auto 0 0; height: 100dvh; max-height: 100dvh; margin: 0; width: min(340px, calc(100% - 20px)); border-radius: 0 16px 16px 0; }
.conversation-row { border-bottom: 1px solid var(--line); padding-block: 12px; }
.chat-title { display: block; width: 100%; text-align: start; white-space: normal; overflow-wrap: anywhere; min-height: 44px; }
.chat-title[aria-pressed="true"] { border-color: var(--acc); }
.chip[data-emo] { border-color: currentColor; }
.chip[data-emo] .chip-dot { animation: tone-pulse 1.8s ease-out 3; }
@keyframes tone-pulse { 50% { box-shadow: 0 0 0 5px currentColor; opacity: .5; } }
@media (prefers-reduced-motion: reduce) { .chip[data-emo] .chip-dot { animation: none; } }
.studio-chat .topbar .model-pill { min-width: 0; }
.studio-chat .topbar { gap: 8px; }
.studio-chat #historyBtn { flex: none; }
.studio-chat .account-dialog .chat-tool, .studio-chat .history-drawer .chat-tool { font-family: inherit; }
.skip-link { position: fixed; inset: 8px auto auto 8px; z-index: 100; padding: 9px 15px; color: var(--fg); background: var(--surface); border-radius: 8px; transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.send-text { min-height: 40px; border: 1px solid var(--line); border-radius: 999px; padding: 0 12px; background: var(--surface); color: var(--fg); font: inherit; font-weight: 650; }
.send-text:disabled { opacity: .48; cursor: default; }
.chat-tool { border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--fg); padding: 5px 10px; min-height: 37px; }
.chat-tool[aria-pressed="true"] { background: var(--acc-soft); color: var(--acc); }
.countdown-text { margin-inline-start: auto; color: var(--mut); font-variant-numeric: tabular-nums; font-size: .77rem; padding: 0 8px; }
.privacy-details { color: var(--mut); font-size: .76rem; margin: 2px auto; text-align: center; }
.privacy-details summary { width: fit-content; margin: auto; cursor: pointer; min-height: 24px; }
.studio-contact .thanks .topic-link { margin-top: 17px; }
.studio-recovery .brand { color: var(--fg); text-decoration: none; }
.studio-contact .field-error { color: var(--bad); font-size: .84rem; }
.studio-contact .field-error:empty { display: none; }
.studio-contact .topic-link { border: 1px solid var(--line); border-radius: 9px; padding: 6px 10px; background: var(--surface); color: var(--acc); align-self: flex-start; min-height: 38px; }
.studio-panel .panel-index { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 0 14px; }
.studio-panel .panel-index a { color: var(--acc); text-decoration: none; }
.studio-panel .message-tools { display: flex; gap: 8px; flex-wrap: wrap; margin-block: 8px 12px; }
.studio-panel .message-tools input { flex: 1 1 200px; }
@media (max-width: 420px) {
  .studio-chat .composer-opts, .studio-chat .composer-actions { gap: 4px; }
  .studio-chat .send-text, .studio-chat #mic { padding-inline: 8px; }
}

/* Keep the idle chat compact, with the original palette and composer. */
.studio-chat .hero-empty { max-width: 640px; gap: 11px; padding-block: 12px; flex: none; }
.studio-chat .hero-sub { max-width: 53ch; text-wrap: pretty; }
.studio-chat .steps { margin-top: 2px; }
.studio-chat .steps li { padding-block: 8px; }
.studio-chat .orb { flex: none; }
.studio-chat .composer-meta { margin-top: 5px; }
.studio-chat .composer-links { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: center; gap: 3px 16px; }
.studio-chat .composer-links:has(details[open]) { display: block; text-align: center; }
.studio-chat .privacy-details { margin-inline: 0; }
.studio-chat .composer-contact { color: var(--acc); font-size: .76rem; }
.studio-panel .login-card .auth-err:empty { display: none; }
@media (max-height: 720px) {
  .studio-chat .hero-empty { gap: 7px; padding-block: 4px; }
  .studio-chat .hero-empty .orb { width: 46px; height: 46px; }
  .studio-chat .hero-empty .orb svg { width: 22px; height: 22px; }
  .studio-chat .steps li { padding-block: 6px; }
}

/* Compliance copy follows the existing typography and remains in normal flow. */
.site-foot { flex-wrap: wrap; gap: 12px; }
.storage-notice { margin: 16px auto; padding: 12px 18px; max-width: 960px; border: 1px solid var(--line, #344155); border-radius: 12px; font-size: .85rem; }
.storage-notice button { margin-inline-start: 12px; color: inherit; background: transparent; border: 1px solid currentColor; border-radius: 6px; padding: 5px 10px; cursor: pointer; }
.storage-notice a { color: var(--acc, #86b7ff); }
.app > .storage-notice { flex-shrink: 0; margin: 4px 12px; padding: 7px 12px; font-size: .72rem; }
.account-dialog select { width: 100%; color: inherit; background: var(--bg, #101827); padding: 10px; border: 1px solid var(--line, #344155); border-radius: 8px; }
.account-dialog label.consent { display: flex; align-items: flex-start; gap: 8px; margin-block: 14px; font-size: .85rem; }
.account-dialog label.consent input { width: auto; flex: 0 0 auto; margin-top: 4px; }
.ai-transparency { max-width: 960px; padding: 12px 20px; margin: 12px auto; color: var(--muted, #abb8ce); font-size: .82rem; }
main table { width: 100%; border-collapse: collapse; font-size: .9rem; overflow-wrap: anywhere; }
main th, main td { text-align: start; padding: 9px 6px; border-bottom: 1px solid var(--line, #344155); }
main [data-l] { overflow-wrap: anywhere; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
#socialSignup { display: grid; gap: 14px; max-width: 600px; }
#socialSignup label.consent { display: flex; align-items: flex-start; gap: 9px; }
#socialSignup input[type="checkbox"] { flex: 0 0 auto; margin-top: 5px; accent-color: var(--acc); }
#socialSignup select, #socialSignup button { min-height: 44px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--fg); background: var(--surface); font: inherit; }