/* Atual Social — Premium Light V4
   Identidade clara, leitura confortável e hierarquia consistente para site, PWA e sala ao vivo. */
:root {
  --bg: #f5f7fb !important;
  --panel: #ffffff !important;
  --panel2: #f8faff !important;
  --text: #14213a !important;
  --muted: #66758d !important;
  --line: rgba(32, 52, 85, 0.12) !important;
  --primary: #6658e8 !important;
  --accent: #0db798 !important;
  --danger: #d9485f !important;
  --warning: #c58a16 !important;
  --shadow: 0 22px 65px rgba(50, 65, 105, 0.12) !important;
  --radius: 24px !important;
  --premium-ink: #14213a;
  --premium-muted: #66758d;
  --premium-white: #fff;
  --premium-soft: #f5f7fb;
  --premium-soft-violet: #f1efff;
  --premium-soft-mint: #ecfbf7;
  --premium-violet: #6658e8;
  --premium-blue: #3478f6;
  --premium-green: #0db798;
  --premium-border: rgba(32, 52, 85, 0.12);
  --premium-shadow: 0 22px 65px rgba(50, 65, 105, 0.12);
}
html {
  color-scheme: light !important;
  background: #f5f7fb !important;
}
html,
body {
  font-size: 16px;
}
body,
body.as-site,
body.marketing {
  background: radial-gradient(circle at 8% 0%, rgba(102, 88, 232, 0.1), transparent 28%),
    radial-gradient(circle at 92% 10%, rgba(13, 183, 152, 0.09), transparent 24%),
    linear-gradient(180deg, #fbfcff 0, #f5f7fb 52%, #fff 100%) !important;
  color: var(--premium-ink) !important;
}
body.as-site {
  min-height: 100vh;
}
body.as-site .as-bg:before {
  background-image: linear-gradient(rgba(47, 72, 115, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47, 72, 115, 0.035) 1px, transparent 1px) !important;
}
body.as-site .as-bg span {
  opacity: 0.1 !important;
  filter: blur(120px) !important;
}

/* Base controls shared by dashboard, editor and live room */
.card {
  background: rgba(255, 255, 255, 0.94) !important;
  border-color: var(--premium-border) !important;
  box-shadow: var(--premium-shadow) !important;
  color: var(--premium-ink) !important;
}
.muted {
  color: var(--premium-muted) !important;
}
.small {
  font-size: 13px !important;
  line-height: 1.45 !important;
}
.btn {
  min-height: 46px !important;
  padding: 11px 16px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  background: #eef2f8 !important;
  color: var(--premium-ink) !important;
  border: 1px solid rgba(32, 52, 85, 0.09) !important;
  box-shadow: none !important;
}
.btn:hover {
  filter: none !important;
  transform: translateY(-1px);
}
.btn-primary {
  color: #fff !important;
  background: linear-gradient(135deg, #6658e8, #7769ef) !important;
  border-color: transparent !important;
  box-shadow: 0 11px 30px rgba(102, 88, 232, 0.22) !important;
}
.btn-accent {
  color: #fff !important;
  background: linear-gradient(135deg, #08aa8d, #16bea0) !important;
  border-color: transparent !important;
  box-shadow: 0 11px 28px rgba(13, 183, 152, 0.18) !important;
}
.btn-ghost {
  background: #fff !important;
  border: 1px solid var(--premium-border) !important;
  color: #31415e !important;
}
.btn-danger {
  background: #fff1f3 !important;
  color: #bc3149 !important;
  border: 1px solid rgba(217, 72, 95, 0.22) !important;
}
.btn-sm {
  min-height: 40px !important;
  padding: 8px 12px !important;
  font-size: 13.5px !important;
}
.input,
.textarea,
.select {
  background: #fff !important;
  border: 1px solid rgba(32, 52, 85, 0.16) !important;
  color: var(--premium-ink) !important;
  font-size: 15px !important;
  min-height: 46px !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset !important;
}
.textarea {
  min-height: 112px !important;
}
.input::placeholder,
.textarea::placeholder {
  color: #96a1b3 !important;
}
.input:focus,
.textarea:focus,
.select:focus {
  border-color: #7467eb !important;
  box-shadow: 0 0 0 4px rgba(102, 88, 232, 0.1) !important;
}
label {
  color: #34435e !important;
  font-size: 14px !important;
}
.pill {
  background: #fff !important;
  border-color: var(--premium-border) !important;
  color: #43516a !important;
  font-size: 13px !important;
}
.status {
  background: #f2f5fa !important;
  border-color: var(--premium-border) !important;
  color: #53637b !important;
  font-size: 12.5px !important;
}
.status.live {
  color: #087e6a !important;
  border-color: rgba(13, 183, 152, 0.28) !important;
  background: #edfbf7 !important;
}
.status.ended {
  color: #657389 !important;
}
.toast {
  background: #fff !important;
  color: var(--premium-ink) !important;
  border-color: var(--premium-border) !important;
  box-shadow: 0 20px 55px rgba(37, 51, 86, 0.18) !important;
}
.modal-backdrop {
  background: rgba(32, 43, 67, 0.34) !important;
  backdrop-filter: blur(8px) !important;
}
.modal {
  background: #fff !important;
}
.icon-btn {
  background: #f5f7fb !important;
  color: #263650 !important;
  border-color: var(--premium-border) !important;
}
.consent {
  background: #f7f9fd !important;
  border-color: var(--premium-border) !important;
  color: #4b5c74 !important;
}

/* Public navigation */
.as-header {
  background: rgba(255, 255, 255, 0.86) !important;
  border-bottom-color: rgba(32, 52, 85, 0.08) !important;
  box-shadow: 0 8px 35px rgba(40, 56, 94, 0.05) !important;
}
.as-nav-shell {
  height: 82px !important;
}
.as-brand {
  color: #172641 !important;
  font-size: 19px !important;
}
.as-nav-links {
  gap: 28px !important;
  color: #53627a !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}
.as-nav-links a:hover {
  color: #5d51db !important;
}
.as-login {
  color: #43516a !important;
  font-size: 15px !important;
}
.as-menu {
  background: #fff !important;
  border-color: var(--premium-border) !important;
}
.as-menu i {
  background: #263650 !important;
}
.as-button {
  min-height: 50px !important;
  font-size: 14px !important;
}
.as-button-primary {
  color: #fff !important;
  background: linear-gradient(135deg, #6658e8, #397cf5) !important;
  box-shadow: 0 15px 36px rgba(88, 83, 216, 0.2) !important;
}
.as-button-secondary {
  background: #fff !important;
  border-color: var(--premium-border) !important;
  color: #34435e !important;
}
.as-play {
  background: #eef2ff !important;
  color: #5d51db !important;
}

/* Public hero — light, editorial and business-oriented */
.as-hero {
  padding-top: 70px !important;
  padding-bottom: 58px !important;
  gap: 64px !important;
}
.as-eyebrow,
.as-kicker {
  color: #087f6c !important;
}
.as-eyebrow {
  background: #edfbf7 !important;
  border-color: rgba(13, 183, 152, 0.18) !important;
  font-size: 11px !important;
}
.as-live-dot {
  background: #0db798 !important;
  box-shadow: 0 0 0 5px rgba(13, 183, 152, 0.11) !important;
}
.as-hero h1 {
  color: #15233e !important;
}
.as-hero h1 span {
  background: linear-gradient(105deg, #6658e8 5%, #397cf5 55%, #0aa98d);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.as-hero-copy > p {
  color: #5b6b83 !important;
  font-size: 18px !important;
  line-height: 1.67 !important;
}
.as-proof-row {
  border-top-color: rgba(32, 52, 85, 0.1) !important;
}
.as-proof-row strong {
  color: #263650 !important;
  font-size: 13px !important;
}
.as-proof-row span {
  color: #728097 !important;
  font-size: 12px !important;
}
.as-photo-card {
  background: #fff !important;
  border: 7px solid #fff !important;
  box-shadow: 0 28px 70px rgba(43, 56, 91, 0.16) !important;
}
.as-photo-shade {
  background: linear-gradient(
    180deg,
    transparent 42%,
    rgba(20, 31, 52, 0.05) 58%,
    rgba(20, 31, 52, 0.72) 100%
  ) !important;
}
.as-floating {
  background: rgba(255, 255, 255, 0.94) !important;
  border-color: rgba(32, 52, 85, 0.11) !important;
  color: #22324e !important;
  box-shadow: 0 18px 50px rgba(42, 57, 92, 0.15) !important;
}
.as-floating-count small,
.as-floating-message small {
  color: #738199 !important;
}
.as-use-rail {
  border-color: rgba(32, 52, 85, 0.09) !important;
  color: #66758d !important;
  font-size: 11px !important;
  background: rgba(255, 255, 255, 0.56) !important;
}

/* Marketing sections */
.as-section {
  padding-top: 78px !important;
  padding-bottom: 78px !important;
}
.as-section-head h2,
.as-human-copy h2,
.as-live-copy h2,
.as-enterprise-copy h2,
.as-final h2 {
  color: #172641 !important;
}
.as-section-head p,
.as-human-copy > p,
.as-live-copy p,
.as-enterprise-copy p,
.as-final p {
  color: #64748b !important;
  font-size: 16.5px !important;
}
.as-story-player {
  background: #fff !important;
  border-color: var(--premium-border) !important;
  box-shadow: var(--premium-shadow) !important;
}
.as-story-media {
  background: #eef2f7 !important;
}
.as-story-controls {
  background: #fff !important;
  border-top-color: rgba(32, 52, 85, 0.09) !important;
}
.as-story-play {
  background: #f2f4fa !important;
  border-color: var(--premium-border) !important;
  color: #554ad3 !important;
}
.as-story-tabs button {
  color: #718096 !important;
}
.as-story-tabs button b {
  color: #43516a !important;
  font-size: 12.5px !important;
}
.as-story-tabs button small {
  font-size: 10.5px !important;
}
.as-story-tabs button.active {
  background: #f0efff !important;
  border-color: rgba(102, 88, 232, 0.18) !important;
}
.as-story-tabs button.active b {
  color: #443bb2 !important;
}
.as-story-tabs button.active span {
  color: #6658e8 !important;
}
.as-human-media > img {
  border: 7px solid #fff !important;
  box-shadow: var(--premium-shadow) !important;
}
.as-human-card {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(32, 52, 85, 0.12) !important;
  color: #172641 !important;
  box-shadow: 0 16px 44px rgba(43, 56, 91, 0.14) !important;
}
.as-human-card small {
  color: #087f6c !important;
}
.as-human-card span {
  background: #f2f4fa !important;
  color: #526178 !important;
  border-color: rgba(32, 52, 85, 0.08) !important;
}
.as-step-list article {
  border-color: rgba(32, 52, 85, 0.1) !important;
}
.as-step-list article > b {
  color: #6658e8 !important;
}
.as-step-list article strong {
  color: #243450 !important;
}
.as-step-list article span {
  color: #708097 !important;
}
.as-text-link {
  color: #584dd1 !important;
}
.as-live-shell {
  background: #fff !important;
  border-color: var(--premium-border) !important;
  box-shadow: var(--premium-shadow) !important;
}
.as-qr-card {
  background: rgba(255, 255, 255, 0.94) !important;
  color: #22324e !important;
  border-color: rgba(32, 52, 85, 0.1) !important;
}
.as-bento-card {
  background: #fff !important;
  border-color: var(--premium-border) !important;
  color: #172641 !important;
  box-shadow: 0 15px 45px rgba(43, 56, 91, 0.08) !important;
}
.as-bento-card p {
  color: #68778e !important;
}
.as-card-label {
  color: #087f6c !important;
}
.as-bento-card a {
  color: #584dd1 !important;
}
.as-pipeline span,
.as-enterprise-tags span {
  background: #f2f4fa !important;
  color: #53627a !important;
  border-color: rgba(32, 52, 85, 0.08) !important;
}
.as-enterprise-panel {
  background: linear-gradient(135deg, #f0efff, #eef8ff 58%, #edfbf7) !important;
  border-color: rgba(102, 88, 232, 0.12) !important;
  box-shadow: var(--premium-shadow) !important;
}
.as-enterprise-metrics article {
  background: rgba(255, 255, 255, 0.76) !important;
  border-color: rgba(32, 52, 85, 0.1) !important;
}
.as-enterprise-metrics strong {
  color: #4e43c5 !important;
}
.as-enterprise-metrics span {
  color: #65748b !important;
}
.as-final {
  background: linear-gradient(135deg, #f1efff, #f4fbff 52%, #ecfbf7) !important;
  border-color: rgba(102, 88, 232, 0.12) !important;
  color: #172641 !important;
  box-shadow: var(--premium-shadow) !important;
}
.as-footer {
  background: #fff !important;
  border-top: 1px solid rgba(32, 52, 85, 0.08) !important;
  color: #506078 !important;
}
.as-footer p,
.as-footer-links {
  color: #6a7890 !important;
}

/* Keep device/product demonstrations rich, but not the page background */
.as-phone,
.as-phone-main,
.as-phone-event,
.as-motion-phone,
.as-motion-mini-phone,
.as-motion-desktop {
  box-shadow: 0 24px 55px rgba(38, 49, 82, 0.2) !important;
}
.as-demo-frame p {
  font-size: 10px !important;
}
.as-demo-bubble {
  font-size: 9px !important;
}
.as-demo-whatsapp b {
  font-size: 9px !important;
}
.as-demo-whatsapp span {
  font-size: 8px !important;
}
.as-demo-crm-card span {
  font-size: 8px !important;
}
.as-motion-signal {
  font-size: 9px !important;
}
.as-motion-toast strong {
  font-size: 10px !important;
}
.as-motion-mini-screen span {
  font-size: 7px !important;
}

/* Legacy public pages: Empresas, Eventos, Educação, White Label, Representantes, Planos */
.public-nav {
  max-width: 1240px !important;
  padding: 18px 24px !important;
  background: rgba(255, 255, 255, 0.88) !important;
  border: 1px solid rgba(32, 52, 85, 0.08) !important;
  border-radius: 0 0 24px 24px !important;
  box-shadow: 0 10px 34px rgba(40, 56, 94, 0.05) !important;
}
.public-nav .nav-links {
  display: flex;
  gap: 24px;
  color: #526178;
  font-size: 15px;
  font-weight: 700;
}
.public-nav .logo {
  color: #172641;
}
.hero-premium,
.hero {
  color: #172641 !important;
}
.hero-premium {
  max-width: 1240px;
  margin: 0 auto;
  padding: 72px 24px 64px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(390px, 0.92fr);
  gap: 58px;
  align-items: center;
}
.hero-copy h1,
.hero-premium h1,
.marketing-section h2,
.section-title,
.cta-band h2 {
  color: #172641 !important;
}
.hero-copy p,
.hero-premium p,
.section-lead,
.eco-card p,
.cta-band p {
  color: #64748b !important;
}
.hero-eyebrow,
.section-kicker {
  color: #087f6c !important;
}
.experience-scene {
  background: linear-gradient(145deg, #edf2ff, #effaf7) !important;
  border: 1px solid rgba(32, 52, 85, 0.1) !important;
  box-shadow: var(--premium-shadow) !important;
}
.marketing-section {
  max-width: 1240px;
  margin: 0 auto;
  padding: 72px 24px;
}
.ecosystem {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.eco-card {
  background: #fff !important;
  color: #172641 !important;
  border: 1px solid var(--premium-border) !important;
  box-shadow: 0 14px 38px rgba(43, 56, 91, 0.07) !important;
}
.cta-band {
  background: linear-gradient(135deg, #f0efff, #edf7ff, #ecfbf7) !important;
  color: #172641 !important;
  border: 1px solid rgba(102, 88, 232, 0.12) !important;
  box-shadow: var(--premium-shadow) !important;
}
.footer-premium {
  background: #fff !important;
  color: #53627a !important;
  border-top: 1px solid rgba(32, 52, 85, 0.09) !important;
}

/* App/PWA */
.app-shell {
  background: transparent !important;
}
.sidebar {
  background: rgba(255, 255, 255, 0.96) !important;
  border-right-color: rgba(32, 52, 85, 0.09) !important;
  box-shadow: 7px 0 35px rgba(40, 56, 94, 0.04) !important;
}
.sidebar .logo {
  color: #172641 !important;
}
.nav-btn {
  color: #58677e !important;
  font-size: 15px !important;
  min-height: 48px !important;
}
.nav-btn.active,
.nav-btn:hover {
  background: linear-gradient(135deg, #f0efff, #f3f6ff) !important;
  color: #443bb2 !important;
  border-color: rgba(102, 88, 232, 0.14) !important;
  box-shadow: inset 3px 0 0 #6658e8 !important;
}
.sidebar-footer {
  color: #65748b !important;
}
.topbar {
  height: 80px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  border-bottom-color: rgba(32, 52, 85, 0.09) !important;
  box-shadow: 0 8px 32px rgba(40, 56, 94, 0.04) !important;
}
.topbar #topTitle {
  color: #172641 !important;
  font-size: 20px !important;
}
.main-content {
  padding: 30px 32px 44px !important;
}
.page-title {
  margin-bottom: 24px !important;
}
.page-title h1 {
  color: #172641 !important;
  font-size: clamp(30px, 3vw, 42px) !important;
}
.page-title p {
  color: #65748b !important;
  font-size: 15.5px !important;
  line-height: 1.55 !important;
}
.stats {
  gap: 16px !important;
}
.stat {
  padding: 23px !important;
}
.stat .small {
  font-size: 12.5px !important;
  color: #65748b !important;
}
.stat .n {
  color: #172641 !important;
  font-size: 42px !important;
}
.section-head h2 {
  color: #172641 !important;
  font-size: 22px !important;
}
.table th {
  color: #66758d !important;
  font-size: 12px !important;
}
.table td {
  color: #293952 !important;
  font-size: 14px !important;
}
.table th,
.table td {
  border-bottom-color: rgba(32, 52, 85, 0.09) !important;
}
.presentation-cover {
  background: linear-gradient(135deg, #6658e8, #4e8cf7) !important;
}
.presentation-meta {
  background: #fff !important;
}
.command-center {
  background: linear-gradient(135deg, #f0efff, #f5f8ff 60%, #ecfbf7) !important;
  border-color: rgba(102, 88, 232, 0.13) !important;
  box-shadow: var(--premium-shadow) !important;
}
.command-center h2 {
  color: #172641 !important;
}
.command-center p {
  color: #65748b !important;
}
.command-card {
  background: rgba(255, 255, 255, 0.9) !important;
  color: #172641 !important;
  border-color: rgba(32, 52, 85, 0.1) !important;
  box-shadow: 0 11px 30px rgba(43, 56, 91, 0.06) !important;
}
.command-card:hover {
  background: #fff !important;
  border-color: rgba(102, 88, 232, 0.25) !important;
}
.command-card span {
  color: #6a7890 !important;
  font-size: 12px !important;
}
.agent-chip,
.quality-item {
  background: #f7f9fd !important;
  color: #263650 !important;
  border-color: rgba(32, 52, 85, 0.1) !important;
}
.preview-device {
  background: #f2f4f8 !important;
  border-color: rgba(32, 52, 85, 0.12) !important;
}
.preview-label {
  color: #53627a !important;
}
.more-sheet .btn {
  background: #fff !important;
}
.slides-rail,
.inspector {
  background: #fff !important;
}
.slide-thumb {
  background: #f1f4fa !important;
  color: #31415e !important;
}
.slide-thumb.active {
  border-color: #6658e8 !important;
  background: #f0efff !important;
}
.template-btn {
  background: #f7f9fd !important;
  color: #43516a !important;
}
.premium-back-btn {
  margin-bottom: 10px !important;
  width: max-content !important;
}
.premium-row-actions {
  display: flex;
  gap: 7px;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.premium-delete-btn {
  white-space: nowrap;
}

/* Authentication */
.auth-page {
  background: radial-gradient(circle at 15% 5%, rgba(102, 88, 232, 0.12), transparent 30%),
    linear-gradient(180deg, #fbfcff, #f5f7fb) !important;
}
.auth-shell {
  background: #fff !important;
  box-shadow: 0 30px 85px rgba(43, 56, 91, 0.14) !important;
  border: 1px solid rgba(32, 52, 85, 0.09) !important;
  border-radius: 28px !important;
}
.auth-brand {
  background: linear-gradient(145deg, #eeeaff, #eaf7ff 58%, #e8fbf5) !important;
  color: #172641 !important;
}
.auth-card {
  background: #fff !important;
  color: #172641 !important;
}

/* Live presenter room */
.live-shell {
  background: #f3f6fb !important;
  color: #172641 !important;
}
.live-top {
  background: #fff !important;
  border-bottom-color: rgba(32, 52, 85, 0.1) !important;
  box-shadow: 0 8px 30px rgba(40, 56, 94, 0.05) !important;
}
.live-top .logo {
  color: #172641 !important;
}
.live-stage-area {
  background: #eef2f7 !important;
}
.live-stage-wrap {
  background: linear-gradient(180deg, #f6f8fc, #eef2f7) !important;
}
.live-side {
  background: #fff !important;
  border-left-color: rgba(32, 52, 85, 0.1) !important;
  color: #263650 !important;
}
.live-bottom {
  background: #fff !important;
  border-top-color: rgba(32, 52, 85, 0.1) !important;
  box-shadow: 0 -8px 30px rgba(40, 56, 94, 0.05) !important;
}
.tool-btn {
  background: #fff !important;
  color: #31415e !important;
  border-color: rgba(32, 52, 85, 0.14) !important;
  min-height: 46px !important;
  height: 46px !important;
  font-size: 13.5px !important;
}
.tool-btn.primary {
  background: #6658e8 !important;
  color: #fff !important;
  border-color: transparent !important;
}
.viewer-row {
  border-color: rgba(32, 52, 85, 0.1) !important;
  background: #f8faff !important;
}
.chat-msg {
  background: #f1f4f9 !important;
  color: #2b3a54 !important;
  font-size: 13.5px !important;
}
.chat-box {
  background: #fff !important;
}
.screen-badge {
  background: rgba(255, 255, 255, 0.92) !important;
  color: #243450 !important;
  border: 1px solid rgba(32, 52, 85, 0.1) !important;
  box-shadow: 0 10px 30px rgba(43, 56, 91, 0.12) !important;
}
.live-back {
  white-space: nowrap;
}
.live-top-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

@media (max-width: 1100px) {
  .as-nav-links {
    gap: 18px !important;
    font-size: 14px !important;
  }
  .hero-premium {
    grid-template-columns: 1fr 1fr;
  }
  .ecosystem {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 900px) {
  .as-section {
    padding-top: 62px !important;
    padding-bottom: 62px !important;
  }
  .as-nav-shell {
    height: 76px !important;
  }
  .as-nav-links.mobile-open {
    background: rgba(255, 255, 255, 0.98) !important;
    border-color: rgba(32, 52, 85, 0.1) !important;
    box-shadow: 0 22px 60px rgba(43, 56, 91, 0.16) !important;
  }
  .as-nav-links.mobile-open a {
    color: #31415e !important;
    font-size: 16px !important;
  }
  .hero-premium {
    grid-template-columns: 1fr;
    padding-top: 52px;
  }
  .public-nav .nav-links {
    display: none;
  }
  .ecosystem {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  html,
  body {
    font-size: 16px !important;
  }
  .main-content {
    padding: 18px 16px calc(122px + env(safe-area-inset-bottom)) !important;
  }
  .topbar {
    height: 78px !important;
    min-height: 78px !important;
    padding: 0 15px !important;
  }
  .topbar #topTitle {
    font-size: 21px !important;
  }
  .topbar .small {
    font-size: 13px !important;
  }
  .page-title {
    gap: 14px !important;
  }
  .page-title h1 {
    font-size: 29px !important;
    line-height: 1.08 !important;
  }
  .page-title p {
    font-size: 15.5px !important;
    line-height: 1.5 !important;
  }
  .btn {
    min-height: 48px !important;
    font-size: 14.5px !important;
  }
  .btn-sm {
    min-height: 42px !important;
    font-size: 13.5px !important;
  }
  .small {
    font-size: 13.5px !important;
  }
  .stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 11px !important;
  }
  .stat {
    padding: 19px !important;
    border-radius: 21px !important;
  }
  .stat .small {
    font-size: 12.5px !important;
    letter-spacing: 0.045em !important;
  }
  .stat .n {
    font-size: 39px !important;
  }
  .section-head h2 {
    font-size: 22px !important;
  }
  .card-pad {
    padding: 18px !important;
  }
  .sidebar {
    height: calc(92px + env(safe-area-inset-bottom)) !important;
    padding: 7px 6px calc(7px + env(safe-area-inset-bottom)) !important;
    background: rgba(255, 255, 255, 0.98) !important;
    border-top: 1px solid rgba(32, 52, 85, 0.1) !important;
    box-shadow: 0 -8px 30px rgba(40, 56, 94, 0.08) !important;
  }
  .nav-list {
    gap: 4px !important;
  }
  .nav-btn {
    height: 76px !important;
    min-height: 76px !important;
    padding: 7px 2px !important;
    color: #627087 !important;
  }
  .nav-btn:before {
    font-size: 23px !important;
    margin-bottom: 4px !important;
  }
  .nav-btn:after {
    font-size: 13px !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
    letter-spacing: -0.015em !important;
    color: inherit !important;
  }
  .nav-btn[data-view='presentations']:after {
    font-size: 12px !important;
  }
  .nav-btn.active {
    background: #f0efff !important;
    color: #5045c9 !important;
    box-shadow: inset 0 3px 0 #6658e8 !important;
    border-color: rgba(102, 88, 232, 0.15) !important;
  }
  .command-center {
    padding: 17px 14px !important;
  }
  .command-card {
    min-height: 108px !important;
    padding: 14px 12px !important;
  }
  .command-card strong {
    font-size: 14.5px !important;
  }
  .command-card span {
    font-size: 12px !important;
  }
  .command-icon {
    font-size: 26px !important;
  }
  .table {
    min-width: 680px !important;
  }
  .table th,
  .table td {
    font-size: 13.5px !important;
  }
  .presentation-actions .btn {
    min-height: 44px !important;
    font-size: 13px !important;
  }
  .modal {
    padding: 20px !important;
  }
  .modal-head h2 {
    font-size: 22px !important;
  }
  .form-grid {
    grid-template-columns: 1fr !important;
  }
  .form-grid .span-2 {
    grid-column: auto !important;
  }
  .as-nav-shell {
    width: min(100% - 24px, 1240px) !important;
  }
  .as-brand {
    font-size: 17px !important;
  }
  .as-hero {
    width: calc(100% - 28px) !important;
    padding-top: 40px !important;
  }
  .as-hero h1 {
    font-size: clamp(39px, 12vw, 52px) !important;
  }
  .as-hero-copy > p {
    font-size: 17px !important;
  }
  .as-proof-row strong {
    font-size: 12.5px !important;
  }
  .as-proof-row span {
    font-size: 11.5px !important;
  }
  .as-use-rail {
    font-size: 10.5px !important;
  }
  .as-section {
    width: calc(100% - 28px) !important;
  }
  .as-section-head h2 {
    font-size: 38px !important;
  }
  .as-section-head p {
    font-size: 15.5px !important;
  }
  .as-story-tabs button b {
    font-size: 11px !important;
  }
  .as-story-tabs button small {
    font-size: 9.5px !important;
  }
  .as-scene-overlay p {
    font-size: 14px !important;
  }
  .as-human-copy > p,
  .as-live-copy p,
  .as-enterprise-copy p,
  .as-final p {
    font-size: 15.5px !important;
  }
  .hero-premium,
  .marketing-section {
    padding-inline: 18px;
  }
  .ecosystem {
    grid-template-columns: 1fr;
  }
  .public-nav {
    padding-inline: 16px !important;
  }
  .live-top {
    padding: 10px 12px !important;
    align-items: flex-start !important;
  }
  .live-top .logo span:last-child {
    display: none;
  }
  .live-top-actions {
    gap: 6px !important;
  }
  .live-bottom {
    justify-content: flex-start !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom)) !important;
  }
  .tool-btn {
    flex: 0 0 auto !important;
    min-height: 48px !important;
    height: 48px !important;
    font-size: 13.5px !important;
  }
  .live-side {
    font-size: 14px !important;
  }
  .chat-msg {
    font-size: 14px !important;
  }
}
@media (max-width: 430px) {
  .as-hero h1 {
    font-size: 40px !important;
  }
  .as-hero-copy > p {
    font-size: 16.5px !important;
  }
  .as-button {
    font-size: 14px !important;
  }
  .as-section-head h2 {
    font-size: 34px !important;
  }
  .as-story-tabs button b {
    font-size: 10.5px !important;
  }
  .as-story-tabs button small {
    font-size: 9px !important;
  }
  .as-demo-frame h4 {
    font-size: 18px !important;
  }
  .as-demo-frame p {
    font-size: 9.5px !important;
  }
  .main-content {
    padding-inline: 14px !important;
  }
  .page-title h1 {
    font-size: 27px !important;
  }
  .page-title p {
    font-size: 15px !important;
  }
  .stats {
    gap: 9px !important;
  }
  .stat {
    padding: 17px !important;
  }
  .stat .n {
    font-size: 36px !important;
  }
  .stat .small {
    font-size: 12px !important;
  }
  .nav-btn:after {
    font-size: 12.5px !important;
  }
  .nav-btn[data-view='presentations']:after {
    font-size: 11.5px !important;
  }
  .btn {
    font-size: 14px !important;
  }
  .command-card strong {
    font-size: 14px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
  }
  .btn,
  .command-card,
  .presentation-card {
    transition: none !important;
  }
}
