/* Shared, deliberately quiet dark theme. No external fonts or image requests. */
html { font-size: 16px; scrollbar-color: #505056 #151517; }
html[data-private-paused] body { visibility: hidden; }
body { background: var(--wash); line-height: 1.5; }
button, a, input, textarea, select { -webkit-tap-highlight-color: transparent; }
a { color: var(--ink); }
button:disabled { opacity: .45; cursor: not-allowed; }
:is(button, a, input, textarea, select, summary):focus-visible { outline: 2px solid #d4d4d8; outline-offset: 4px; box-shadow: none; }
input, textarea, select { background: var(--wash); border: 1px solid var(--line); border-radius: 8px; color: var(--ink); font-size: 1rem; }
input:hover, textarea:hover, select:hover { border-color: #626269; }
input:focus, textarea:focus, select:focus { border-color: #a1a1aa; box-shadow: none; }
input::placeholder, textarea::placeholder { color: #8d8d97; }
input[type=checkbox] { accent-color: #dedee3; }
.entry-screen { display: flex; align-items: center; justify-content: center; min-height: 100svh; background: var(--wash); padding: 24px; }
.entry-card, .auth-card { width: 100%; max-width: 420px; min-height: auto; padding: 24px 0; }
.entry-card .brand-lockup { margin: 0 0 40px; }
.entry-copy h1, .auth-heading h1 { font-size: 2rem; line-height: 1.2; letter-spacing: -.04em; margin-bottom: 12px; }
.entry-copy p, .auth-heading p { font-size: 1rem; line-height: 1.6; }
.entry-art, .profile-glow, .empty-orbit, .search-trigger kbd { display: none; }
.stack-form { margin-top: 24px; }
.auth-tabs { gap: 24px; margin-top: 24px; }
.eyebrow { color: var(--muted); font-size: .875rem; font-weight: 500; text-transform: none; letter-spacing: 0; }
.primary-button, .round-action, .composer > button[type=submit] { background: #e4e4e7; color: #171719; border-radius: 8px; box-shadow: none; font-weight: 650; }
.primary-button:hover, .round-action:hover, .composer > button[type=submit]:hover { background: #fff; transform: none; box-shadow: none; }
.secondary-button, .icon-button, .close-button { border: 1px solid var(--line); background: #202024; color: var(--ink); border-radius: 8px; min-height: 44px; }
.secondary-button { padding: 10px 14px; }
.secondary-button:hover, .icon-button:hover, .close-button:hover { background: #303036; border-color: #626269; }
.quiet-button, .reveal-button { color: var(--muted); font-size: .875rem; }
.quiet-button:hover, .reveal-button:hover { color: var(--ink); }
.form-error { color: #ff9da7; font-size: .875rem; }
.field-hint, .privacy-note, .crypto-line { font-size: .875rem; line-height: 1.5; }
.mini-shield, .unlock-modal .key-seal { background: #1c2b23; color: var(--green); }
.topbar { height: 68px; padding: 0 24px; gap: 20px; grid-template-columns: 200px minmax(200px, 480px) 1fr; }
.search-trigger { color: var(--muted); border-radius: 8px; }
.workspace { height: calc(100dvh - 68px); grid-template-columns: 208px 300px minmax(0, 1fr); background: var(--paper); }
.sidebar { border-right: 1px solid var(--line); padding: 20px 12px; }
.profile-card, .nav-item, .secure-pill, .conversation-item { border-radius: 8px; }
.profile-card { background: transparent; padding-inline: 8px; }
.main-nav { margin-top: 20px; gap: 4px; }
.nav-item { color: var(--muted); font-size: .875rem; }
.nav-item.active { color: var(--ink); background: #28282d; }
.profile-card small, .chevron, .secure-pill small { color: var(--muted); font-size: .875rem; }
.secure-pill { background: transparent; padding-inline: 8px; }
.secure-pill b { font-size: .875rem; }
.avatar { background-color: #38383f; background-image: none; color: #eeeef0; }
.badge { background: #d5d5dc; color: #151517; border-color: var(--paper); font-size: .75rem; }
.presence-dot { border-color: var(--paper); }
.rail-head { padding: 20px 16px; }
.rail-head .eyebrow, .content-head .eyebrow, .empty-chat .eyebrow { display: none; }
.rail-head h2 { font-size: 1.25rem; }
.conversation-item { min-height: 78px; }
.conversation-row time, .chat-person small, .message-date { font-size: .75rem; color: var(--muted); }
.conversation-body p { font-size: .875rem; }
.main-content, .chat-view { background: var(--wash); }
.empty-chat h2 { font-size: 1.75rem; line-height: 1.3; }
.encryption-caption { color: var(--muted); font-size: .875rem; }
.chat-head { background: var(--paper); min-height: 76px; }
.chat-security { background: transparent; color: var(--muted); border: 0; font-size: .75rem; margin: 8px 8px 0; }
.ephemeral-control { border-bottom: 0; padding: 8px 20px; }
.ephemeral-control small { font-size: .75rem; }
.message .message-bubble { background: #222226; color: var(--ink); box-shadow: none; border-radius: 10px; font-size: 1rem; }
.message.mine .message-bubble { background: #35353d; color: #fafafa; }
.message time, .message-meta { color: var(--muted); font-size: .75rem; }
.read-status.seen { color: #b7d8ff; }
.composer { background: var(--paper); border: 1px solid var(--line); border-radius: 10px; box-shadow: none; }
.composer textarea { background: transparent; font-size: 1rem; color: var(--ink); }
.composer .composer-tool { background: #29292f; color: var(--ink); border-radius: 8px; }
.composer .composer-tool.recording { background: #49252b; color: #ffabb5; }
.person-card, .request-card, .profile-form, .key-card { background: var(--paper); border: 1px solid var(--line); border-radius: 10px; box-shadow: none; }
.person-meta p, .key-card p { color: var(--muted); font-size: .875rem; }
.profile-hero { background: var(--paper); border: 1px solid var(--line); border-radius: 10px; }
.profile-hero p { color: var(--muted); }
.camera-badge { background: #303036; color: var(--ink); box-shadow: none; }
.content-head h2 { font-size: 1.75rem; }
.modal { background: var(--paper); border: 1px solid #45454d; border-radius: 12px; max-height: calc(100dvh - 32px); }
.modal::backdrop { background: #000b; backdrop-filter: none; }
.search-box { border: 1px solid var(--line); border-radius: 8px; }
.search-box input { min-width: 0; }
.idle-warning { background: #302819; border-color: #847044; color: #ffe0a1; border-radius: 8px; }
.site-announcement { background: var(--navy-2); border: 1px solid var(--line); border-radius: 8px; }
.toast { border: 1px solid #505058; background: #25252b; border-radius: 8px; font-size: .875rem; }
.toast.error { background: #42262c; }.toast.success { background: #203b2f; }
.call-overlay { background: #101012; }.call-shade { background: #0003; }
.call-control { backdrop-filter: none; background: #333339; }.call-control.labeled { border-radius: 8px; }
.call-controls .call-control { flex: none; }
.call-control.accept { background: #287a53; }.call-control.danger { background: #a43343; }
@media (max-width: 1080px) and (min-width: 761px) {
  .workspace { grid-template-columns: 76px 280px minmax(0,1fr); }
  .topbar { grid-template-columns: auto minmax(180px,1fr) auto; }
  .profile-card > span:nth-child(2), .profile-card .chevron, .nav-item span, .sidebar-foot { display: none; }
  .nav-item, .profile-card { justify-content: center; padding: 10px; }
}
@media (max-width: 760px) {
  .topbar { height: 64px; grid-template-columns: 1fr auto; padding: 0 12px; gap: 8px; }
  .top-actions { gap: 8px; } #adminLink { font-size: .875rem; padding: 10px; }
  .topbar .brand-mark { display: none; }
  .workspace { height: calc(100dvh - 64px - 67px - env(safe-area-inset-bottom)); grid-template-columns: 1fr; }
  .main-content { bottom: calc(67px + env(safe-area-inset-bottom)); }
  .mobile-nav { background: var(--paper); backdrop-filter: none; }
  .mobile-nav button { font-size: .75rem; color: var(--muted); }
  .mobile-nav button.active { color: #fff; background: #252529; }
  .chat-head { padding: 10px; gap: 8px; }.chat-person { min-width: 0; }
  .chat-person b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .chat-actions { gap: 6px; }.chat-actions .icon-button { width: 38px; }
  .ephemeral-control { gap: 4px; padding: 8px 12px; }
  .composer { padding: 8px; gap: 6px; margin: 0 8px 8px; }
  .composer .composer-tool { width: 40px; min-width: 40px; height: 44px; }
  .composer textarea { min-width: 0; padding: 8px 2px; }
  .content-view { padding: 20px 14px; }
  .call-controls { width: calc(100% - 24px); gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }