@import url("./system-fonts.css");
/* Shared system typography; preserve the user-selected text scale. */

:root {
  --nav-h: calc(64px * var(--text-scale, 1));
  --top-h: calc(52px * var(--text-scale, 1));
}
html {
  font-size: calc(100% * var(--text-scale, 1));
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  font-family: var(--font-body);
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
}
button, input, textarea, select { font-family: inherit; }
h1, h2, h3, h4, h5, h6, .auth-hero-title, .top-logo, .app-logo, .brand {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -.025em;
  text-wrap: balance;
}

/* Controls and supporting labels share the platform UI font. */
button,
.btn,
.btn-primary,
.btn-outline,
.btn-connect,
.nav-item,
.nav-label,
.eyebrow,
.auth-kicker,
.auth-panel-chip,
.section-kicker,
.card-eyebrow,
.status-chip,
.badge,
.post-meta,
.comment-time,
.story-time,
.settings-item-label,
.settings-item-sub,
label,
legend {
  font-family: var(--font-ui);
  letter-spacing: -.015em;
}
.post-name, .chat-item-name, .settings-item-label, .nav-item, .btn-primary { font-weight: 700; }
.post-content, .comment-text, .msg-bubble { line-height: 1.65; overflow-wrap: anywhere; }
input, textarea, select { font-size: max(1rem, 16px) !important; }
.settings-item { gap: 16px; flex-wrap: wrap; }
.settings-item-info { min-width: 0; flex: 1 1 160px; }
.theme-btn { flex-shrink: 0; min-width: 44px; min-height: 44px; }
.settings-item-sub { white-space: normal; }
#uc-cookie-banner, .trust-dialog { font-family: var(--font-body); font-size: .9375rem; }
.btn-primary, .nav-icon-create, .story-add-circle {
  box-shadow: inset 0 1px 0 #ffffff35, 0 4px 0 #0002, 0 10px 22px #0002;
}
.auth-hero, .auth-panel, .create-post-card, .modal-card {
  box-shadow: inset 0 1px 0 #ffffff0a, 0 16px 40px #0002;
}
.btn-primary:active, .nav-icon-create:active { box-shadow: inset 0 1px 2px #0002, 0 2px 0 #0002; }
svg.lucide { stroke-width: 1.8; flex-shrink: 0; }
.nav-item.active { font-weight: 700; }
.nav-item.active svg { color: var(--accent-light); }
.support-card { border: 1px solid var(--border-light); border-radius: 20px; padding: 24px; background: var(--bg-2); margin: 24px 0; box-shadow: inset 0 1px 0 #ffffff10, 0 12px 32px #0002; }
.support-email { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 12px; font-weight: 700; overflow-wrap: anywhere; }
.support-card svg { width: 24px; height: 24px; flex-shrink: 0; }
.support-card details { border-top: 1px solid var(--border-light); padding: 16px 0; }
.support-card summary { cursor: pointer; font-weight: 700; min-height: 44px; }
.support-card p:last-child { margin-bottom: 0; }
.not-found { max-width: 560px; margin: auto; padding: 48px 24px; text-align: center; }
.not-found svg { width: 64px; height: 64px; color: var(--accent-light); margin-bottom: 24px; }
.not-found p { margin: 16px 0 24px; color: var(--text-2); }
.not-found a { display: inline-flex; padding: 12px 20px; border-radius: 12px; }

@media (max-width: 480px) {
  .support-card { padding: 20px; }
  .trust-links { grid-template-columns: 1fr; }
  h1 { overflow-wrap: anywhere; }
  .settings-item > :last-child { max-width: 100%; }
}

/* Keep the established wordmark weight independently of heading weights. */
.top-logo, .app-logo, .brand { font-weight: 800; }
