:root {
  --kb-surface: #101a33;
  --kb-surface-raised: #162344;
  --kb-surface-soft: rgba(154, 177, 231, .09);
  --kb-border-strong: rgba(187, 207, 255, .24);
  --kb-text-strong: #f8fbff;
  --kb-text-muted: #aec0e2;
  --kb-brand: #7895ff;
  --kb-brand-strong: #5577ed;
  --kb-success: #39c990;
  --kb-warning: #f6bd5b;
  --kb-danger: #f4777a;
  --kb-radius-sm: 12px;
  --kb-radius: 18px;
  --kb-radius-lg: 26px;
  --kb-shadow: 0 18px 48px rgba(3, 10, 28, .2);
}

body {
  font-family: "Segoe UI Variable", "Aptos", "Trebuchet MS", sans-serif;
  text-rendering: optimizeLegibility;
}

button, input, select, textarea, a { -webkit-tap-highlight-color: transparent; }
button, .btn, .kb-button, .nav-pill { min-height: 42px; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible, summary:focus-visible {
  outline: 3px solid rgba(120, 149, 255, .75) !important;
  outline-offset: 3px;
}
button:disabled, [aria-busy="true"] { cursor: wait !important; opacity: .62; transform: none !important; }
input, select, textarea { line-height: 1.45; }
input::placeholder, textarea::placeholder { color: rgba(174, 192, 226, .7); }

.card, .item, .soft-card, .metric-card, .status-card, .stat-card, .checkout-box, .kb-benefit, .kb-module, .kb-step {
  border-radius: var(--kb-radius);
}
.card, .item, .soft-card, .metric-card, .status-card, .stat-card {
  border-color: var(--kb-border-strong);
}
.item, .card, .checkout-box { scroll-margin-top: 24px; }
.section-title h2, .kb-heading h2, .hero-card h1 { letter-spacing: -.035em; }
.mini-note, .muted, .field-help { line-height: 1.55; }

.status-badge, .badge, .hero-pill, .page-inline-chip, .helper-badge {
  border-radius: 999px !important;
  font-weight: 750;
}
.empty-state, .empty, .loading, .payment-result.empty {
  display: grid;
  place-items: center;
  min-height: 112px;
  padding: 22px;
  border: 1px dashed var(--kb-border-strong) !important;
  border-radius: var(--kb-radius) !important;
  color: var(--kb-text-muted) !important;
  text-align: center;
}
.empty-state-error { border-color: rgba(244, 119, 122, .72) !important; color: #ffd5d6 !important; }

.table-wrap, .table-scroll { position: relative; }
.table-wrap::after, .table-scroll::after {
  content: "Deslize para ver mais";
  display: block;
  padding: 8px 2px 0;
  color: var(--kb-text-muted);
  font-size: .75rem;
  text-align: right;
}
table { border-collapse: separate; border-spacing: 0; }
th { font-size: .76rem; letter-spacing: .06em; text-transform: uppercase; }
td, th { vertical-align: middle; }

.sidebar { z-index: 30; }
.sidebar .btn-nav { min-height: 44px; }
.sidebar .btn-nav:focus-visible { outline-offset: -3px; }
.nav-group-title { letter-spacing: .1em; }
.ticket-nav-badge { background: rgba(244, 119, 122, .16); border-radius: 999px; padding: 2px 7px; }

.kb-slider-controls button { min-height: 38px; }
.kb-slide, .kb-preview, .kb-final-cta { box-shadow: var(--kb-shadow); }
.kb-faq summary { min-height: 28px; }
.group-central-summary-wrap { margin: 16px 0; }
.group-central-summary {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--kb-border-strong);
  border-radius: var(--kb-radius);
  background: linear-gradient(135deg, rgba(120, 149, 255, .16), rgba(255, 255, 255, .035));
}
.group-central-summary span, .group-central-summary small { display: block; color: var(--kb-text-muted); }
.group-central-summary strong { display: block; margin: 5px 0; font-size: 1.15rem; }
.group-central-status { text-align: right; }

@media (max-width: 800px) {
  .panel-menu-toggle {
    display: inline-grid !important;
    place-content: center;
    gap: 4px;
    width: 44px !important;
    min-height: 44px;
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 1px solid var(--kb-border-strong) !important;
    border-radius: 13px !important;
    background: rgba(20, 35, 68, .88) !important;
  }
  .panel-menu-toggle span { width: 18px; height: 2px; border-radius: 999px; background: #fff; }
  .panel-menu-overlay { position: fixed; inset: 0; z-index: 45; border: 0; background: rgba(3, 8, 22, .64) !important; }
  .layout > .sidebar {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    z-index: 50 !important;
    width: min(310px, calc(100vw - 42px)) !important;
    max-height: none !important;
    height: 100dvh !important;
    padding: 14px !important;
    overflow-y: auto !important;
    transform: translateX(-105%);
    transition: transform .22s ease;
    display: flex !important;
  }
  .layout > .sidebar.is-open { transform: translateX(0); }
  .layout > .sidebar .sidebar-brand { display: flex !important; }
  .layout > .sidebar .nav-list { display: grid !important; overflow: visible !important; }
  .layout > .sidebar .nav-group { display: grid !important; }
  .layout > .sidebar .nav-group-title, .layout > .sidebar .nav-text { display: flex !important; }
  .layout > .sidebar .btn-nav { width: 100% !important; height: auto !important; padding: 10px !important; flex: none !important; }
  .content { padding: 16px !important; }
  .hero-card { padding: 18px !important; border-radius: var(--kb-radius) !important; }
  .section-title { align-items: flex-start; }
  .section-title h2 { font-size: clamp(1.25rem, 6vw, 1.7rem); }
  .sidebar { overflow-x: auto !important; scrollbar-width: none; }
  .sidebar::-webkit-scrollbar { display: none; }
  .sidebar .btn-nav { min-width: 44px; min-height: 44px; }
  .overview-group-row, .inline-actions, .danger-actions { align-items: stretch; }
  .group-central-summary { align-items: flex-start; flex-direction: column; }
  .group-central-status { text-align: left; }
  .overview-group-row { flex-direction: column; }
  .overview-group-row span { text-align: left; }
  .table-wrap::after, .table-scroll::after { text-align: left; }
}

@media (min-width: 801px) { .panel-menu-toggle, .panel-menu-overlay { display: none !important; } }

/* Authentication: shared interaction layer over the existing portal forms. */
.auth-shell { min-height: 100dvh; }
.auth-body .brand-panel { position: relative; overflow: hidden; }
.auth-body .brand-panel::after {
  content: '';
  position: absolute;
  width: 18rem;
  height: 18rem;
  right: -7rem;
  bottom: -8rem;
  border: 1px solid rgba(129, 209, 255, 0.28);
  border-radius: 50%;
  box-shadow: 0 0 0 2rem rgba(129, 209, 255, 0.05), 0 0 0 5rem rgba(129, 209, 255, 0.03);
  pointer-events: none;
}
.auth-client .brand-panel::after { border-color: rgba(91, 224, 174, 0.38); }
.auth-affiliate .brand-panel::after { border-color: rgba(255, 194, 102, 0.4); }
.auth-body .login-card { box-shadow: 0 28px 70px rgba(3, 10, 26, 0.25); }
.password-field { position: relative; }
.password-field input { width: 100%; padding-right: 5.7rem !important; }
.password-visibility-toggle {
  position: absolute;
  top: 50%;
  right: 0.55rem;
  min-height: auto !important;
  transform: translateY(-50%);
  border: 0 !important;
  border-radius: 0.55rem !important;
  background: transparent !important;
  color: var(--kb-accent, #1688d4) !important;
  box-shadow: none !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  padding: 0.38rem 0.55rem !important;
}
.password-visibility-toggle:hover,
.password-visibility-toggle:focus-visible { background: rgba(22, 136, 212, 0.12) !important; }

@media (max-width: 760px) { .auth-body .brand-panel::after { display: none; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* KiraBot design system: shared foundations for public, auth and portal screens. */
:root {
  --ui-bg: #08111f;
  --ui-surface: #0e1b2d;
  --ui-surface-secondary: #13243a;
  --ui-surface-hover: #18304b;
  --ui-border: rgba(159, 186, 218, .16);
  --ui-border-strong: rgba(159, 186, 218, .28);
  --ui-primary: #3e9eea;
  --ui-primary-hover: #68b9f4;
  --ui-success: #36c795;
  --ui-warning: #e9ad49;
  --ui-danger: #e2666b;
  --ui-text: #edf5ff;
  --ui-muted: #9eb0c5;
  --ui-radius-sm: 10px;
  --ui-radius: 16px;
  --ui-radius-lg: 24px;
  --ui-shadow: 0 18px 42px rgba(1, 8, 18, .24);
  --ui-space-1: .5rem;
  --ui-space-2: .75rem;
  --ui-space-3: 1rem;
  --ui-space-4: 1.5rem;
  --ui-space-5: 2.25rem;
  --ui-font: "Segoe UI Variable", "Aptos", sans-serif;
  --kb-surface: var(--ui-surface);
  --kb-surface-raised: var(--ui-surface-secondary);
  --kb-surface-soft: rgba(62, 158, 234, .08);
  --kb-border-strong: var(--ui-border-strong);
  --kb-text-strong: var(--ui-text);
  --kb-text-muted: var(--ui-muted);
  --kb-brand: var(--ui-primary);
  --kb-brand-strong: var(--ui-primary-hover);
}

body { font-family: var(--ui-font); background: var(--ui-bg); color: var(--ui-text); }
/* Page themes own commercial and general-purpose surface colors. Shared UI
   supplies tokens and layout only, so public pages can intentionally be light. */
.ui-button, .ui-button-primary, .ui-button-secondary, .ui-button-ghost, .ui-button-danger {
  display: inline-flex; align-items: center; justify-content: center; width: auto; min-height: 42px;
  margin: 0; padding: .68rem 1rem; border: 1px solid transparent; border-radius: var(--ui-radius-sm);
  font: 700 .87rem/1 var(--ui-font); cursor: pointer; transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.ui-button-primary, .ui-button { color: #fff; background: var(--ui-primary); }
.ui-button-primary:hover, .ui-button:hover { background: var(--ui-primary-hover); }
.ui-button-secondary { color: var(--ui-text); border-color: var(--ui-border-strong); background: transparent; }
.ui-button-secondary:hover, .ui-button-ghost:hover { border-color: var(--ui-primary); color: var(--ui-primary-hover); background: rgba(62, 158, 234, .08); }
.ui-button-ghost { color: var(--ui-muted); background: transparent; border-color: transparent; }
.ui-button-danger { color: #fff; background: var(--ui-danger); }
.ui-status, .ui-badge { display: inline-flex; align-items: center; width: fit-content; padding: .33rem .56rem; border: 1px solid var(--ui-border); border-radius: 999px; font-size: .72rem; font-weight: 800; }
.ui-status-success { color: #a7f0d1; background: rgba(54, 199, 149, .12); border-color: rgba(54, 199, 149, .26); }

/* Public home composition. */
.hero { overflow: visible; padding: 0 24px 42px; background: linear-gradient(180deg, #08111f 0%, #0b1727 100%); border: 0; }
.hero::before, body::before { display: none; }
.nav { max-width: 1220px; margin: 0 auto; padding: 16px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.brand img { height: 42px; max-width: 170px; border-radius: 0; }
.nav-pill { padding: .52rem .75rem !important; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--ui-muted) !important; }
.nav-pill:hover { background: rgba(255,255,255,.04); color: var(--ui-text) !important; }
.nav-pill-primary { background: var(--ui-primary) !important; color: #fff !important; }
.product-hero { max-width: 1220px; min-height: 580px; margin: 0 auto; padding: 74px 0 36px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(390px, .9fr); gap: 74px; align-items: center; }
.product-eyebrow, .product-section-heading > span, .portal-page-header > div > span { color: var(--ui-primary-hover); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.product-hero h1 { max-width: 680px; margin: 16px 0; font-size: clamp(2.8rem, 5.1vw, 5rem); line-height: .98; letter-spacing: -.065em; }
.product-hero p { max-width: 600px; margin: 0; color: var(--ui-muted); font-size: 1.1rem; line-height: 1.65; }
.product-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; }
.product-benefit-row { display: flex; flex-wrap: wrap; gap: 9px 18px; margin-top: 34px; color: var(--ui-muted); font-size: .8rem; }
.product-benefit-row span { display: inline-flex; align-items: center; gap: 7px; }
.product-benefit-row span::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--ui-primary); }
.product-hero-preview { overflow: hidden; border: 1px solid var(--ui-border-strong); border-radius: var(--ui-radius-lg); background: #102238; box-shadow: var(--ui-shadow); }
.quick-checkout{padding:18px;border:1px solid var(--ui-border);border-radius:16px;background:#fff;color:#11294b;box-shadow:0 18px 42px rgba(17,41,75,.12)}.quick-checkout .checkout-layout{display:block;margin:0;padding:0}.quick-checkout .checkout-sidebar{margin-top:14px}.quick-checkout .checkout-box{padding:0;border:0!important;background:transparent!important;box-shadow:none!important}.quick-checkout .checkout-summary-box{display:none}.quick-checkout input,.quick-checkout select,.quick-checkout textarea{color:#11294b!important;background:#fff!important;border-color:#d8e2ee!important}.checkout-source-mounted{display:none!important}
.quick-checkout-head{margin-bottom:14px}.quick-checkout-head h2{margin:3px 0 10px}.checkout-steps{display:flex;gap:6px;padding:0;margin:0;list-style:none;overflow:auto}.checkout-steps li{padding:5px 6px;color:#718299;font-size:.7rem;white-space:nowrap}.checkout-steps .is-active{color:#1769d2;font-weight:800;border-bottom:2px solid #1769d2}.checkout-step-panel{display:grid;gap:7px}.checkout-step-controls{display:flex;justify-content:space-between;gap:8px;margin-top:16px}.checkout-step-controls button{width:auto}.quick-checkout .checkout-step-panel label{margin-top:4px}@media(max-width:620px){.checkout-steps li{font-size:0}.checkout-steps li.is-active{font-size:.72rem}.checkout-step-controls button{flex:1}}
.preview-window-bar { display: flex; align-items: center; gap: 6px; min-height: 46px; padding: 0 16px; border-bottom: 1px solid var(--ui-border); background: #0c1929; }
.preview-window-bar span { width: 8px; height: 8px; border-radius: 50%; background: #54718f; }.preview-window-bar b { margin-left: 7px; color: var(--ui-muted); font-size: .74rem; }
.preview-chat { display: grid; gap: 14px; min-height: 270px; padding: 23px; background: linear-gradient(135deg, rgba(62,158,234,.06), transparent 42%); }
.preview-message { display: grid; gap: 5px; width: fit-content; max-width: 85%; padding: 12px 14px; border-radius: 12px; color: #cbd9e8; font-size: .81rem; line-height: 1.45; }.preview-message b { color: #fff; }.preview-message-user { justify-self: end; background: #1e7ec2; color: #fff; }.preview-message-bot { background: #182d45; }
.preview-metrics { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ui-border); }.preview-metrics div { display: grid; gap: 5px; padding: 15px; border-right: 1px solid var(--ui-border); }.preview-metrics div:last-child { border: 0; }.preview-metrics span { color: var(--ui-muted); font-size: .71rem; }.preview-metrics b { font-size: .82rem; }
.kb-slider, .kb-journey, .legacy-home-section { display: none !important; }
.product-steps, .product-feature-layout, .product-panel-showcase { max-width: 1220px; margin: 0 auto; padding: 88px 24px; }
.product-section-heading { max-width: 720px; margin-bottom: 32px; }.product-section-heading h2 { margin: 10px 0; font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.05em; }.product-section-heading p { color: var(--ui-muted); line-height: 1.6; }
.product-step-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }.product-step-grid article { padding: 20px 0; border-top: 1px solid var(--ui-border-strong); }.product-step-grid span { color: var(--ui-primary); font-size: .76rem; font-weight: 800; }.product-step-grid h3 { margin: 15px 0 8px; font-size: 1rem; }.product-step-grid p { margin: 0; color: var(--ui-muted); font-size: .86rem; line-height: 1.55; }
.product-feature-layout { background: #0b1727; max-width: none; padding-left: max(24px, calc((100vw - 1172px) / 2)); padding-right: max(24px, calc((100vw - 1172px) / 2)); }.product-feature-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }.product-feature-grid .ui-card { min-height: 178px; padding: 22px; border-radius: var(--ui-radius); }.feature-label { color: var(--ui-primary-hover); font-size: .71rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.product-feature-grid h3 { margin: 16px 0 8px; }.product-feature-grid p { margin: 0; color: var(--ui-muted); line-height: 1.55; }
.product-panel-showcase { display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; gap: 62px; }.product-panel-showcase h2 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.05em; }.product-panel-showcase p { margin: 0 0 24px; color: var(--ui-muted); line-height: 1.6; }.panel-showcase-mock { display: grid; grid-template-columns: 150px 1fr; overflow: hidden; min-height: 320px; border: 1px solid var(--ui-border-strong); border-radius: var(--ui-radius-lg); background: var(--ui-surface); }.panel-showcase-mock aside { display: grid; align-content: start; gap: 8px; padding: 20px 12px; border-right: 1px solid var(--ui-border); background: #0a1524; }.panel-showcase-mock aside b { margin-bottom: 16px; }.panel-showcase-mock aside span { padding: 8px; color: var(--ui-muted); font-size: .73rem; border-radius: 7px; }.panel-showcase-mock aside .is-active { color: #fff; background: rgba(62,158,234,.18); }.panel-showcase-mock section { padding: 27px; }.panel-showcase-mock small { color: var(--ui-muted); }.panel-showcase-mock h3 { margin: 8px 0 19px; }.mock-kpi-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.mock-kpi-row div, .mock-list { padding: 12px; border: 1px solid var(--ui-border); border-radius: 10px; }.mock-kpi-row span, .mock-list span { display: block; color: var(--ui-muted); font-size: .7rem; }.mock-kpi-row b { display:block; margin-top:5px; font-size:.78rem; }.mock-list { display:grid; gap:10px; margin-top:12px; }.mock-list b { font-size:.78rem; }.mock-list span { display:flex; justify-content:space-between; }.mock-list i { width:16px; height:7px; border-radius:99px; background:var(--ui-success); }

/* Portal shell. */
.layout { min-height: 100dvh; background: var(--ui-bg); }.sidebar { border-right: 1px solid var(--ui-border) !important; background: #0a1524 !important; box-shadow: none !important; }.sidebar-brand { padding: 14px !important; border: 0 !important; background: transparent !important; }.sidebar-brand strong { font-size: .88rem; }.sidebar-brand small { color: var(--ui-muted); }.logo-mini-img { max-height: 35px; }.menu-label { display: none; }.nav-list { gap: 17px !important; }.nav-group { gap: 3px !important; padding: 0 !important; border: 0 !important; background: transparent !important; }.nav-group-title { padding: 0 12px 5px !important; color: #71869e !important; font-size: .64rem !important; letter-spacing: .11em !important; }.sidebar .btn-nav { padding: 9px 12px !important; border: 0 !important; border-radius: 8px !important; background: transparent !important; box-shadow: none !important; }.sidebar .btn-nav:hover { background: rgba(255,255,255,.045) !important; transform: none !important; }.sidebar .btn-nav.active, .sidebar .btn-nav.active-admin { background: rgba(62,158,234,.16) !important; box-shadow: inset 2px 0 0 var(--ui-primary) !important; }.nav-emoji { font-size: 0 !important; width: 24px !important; height: 24px !important; border: 0 !important; border-radius: 6px !important; background: rgba(142,174,211,.1) !important; }.nav-emoji::after { content: ''; display:block; width: 10px; height: 10px; border: 1.5px solid #9cb7d5; border-radius: 3px; }.nav-subtitle { display: none !important; }.nav-title { color: #c8d7e8; font-size: .82rem !important; }.content { max-width: 1440px; margin: 0 auto; padding: 24px 32px 48px !important; }.portal-topbar { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:62px; margin-bottom:24px; }.portal-topbar > div:first-child { display:grid; gap:4px; }.portal-context { color:var(--ui-muted); font-size:.72rem; }.portal-topbar strong { font-size:.92rem; }.portal-topbar-actions { display:flex; align-items:center; gap:10px; }.portal-status { color:#9ec8ef; font-size:.73rem; }.portal-page-header { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:28px; }.portal-page-header h1 { max-width:760px; margin:8px 0; font-size:clamp(1.8rem,4vw,2.75rem); letter-spacing:-.05em; }.portal-page-header p { max-width:680px; margin:0; color:var(--ui-muted); line-height:1.55; }.hero-card { display:none !important; }.section-view > .card, .section.card { border-radius: var(--ui-radius) !important; }.section-title { text-align:left; margin-bottom:18px; }.section-title h2 { font-size:1.25rem; }.section-title > span { color:var(--ui-primary); }.stat-card, .metric-card, .section-kpi { padding:17px !important; border-radius:var(--ui-radius-sm) !important; background:var(--ui-surface-secondary) !important; box-shadow:none !important; }.quick-action-button, .action-tile, .client-menu-card { border-radius:var(--ui-radius-sm) !important; background:var(--ui-surface-secondary) !important; box-shadow:none !important; }.group-central-tabs { display:flex; gap:6px; overflow-x:auto; margin:18px 0; padding-bottom:4px; }.group-central-tabs button { width:auto; min-width:max-content; margin:0; padding:.54rem .76rem; border:1px solid var(--ui-border); border-radius:999px; background:transparent; color:var(--ui-muted); font-size:.76rem; }.group-central-tabs button:hover, .group-central-tabs button.is-active { color:#fff; background:rgba(62,158,234,.15); border-color:rgba(62,158,234,.36); }.group-central-summary { padding:20px; border-color:var(--ui-border) !important; background:var(--ui-surface-secondary) !important; }.page-inline-header { border-color:var(--ui-border) !important; background:var(--ui-surface-secondary) !important; box-shadow:none !important; }.page-inline-badge { display:none; }
.table-wrap, .table-scroll { overflow-x:auto; border:1px solid var(--ui-border); border-radius:var(--ui-radius-sm); }.table-wrap::after, .table-scroll::after { display:none; } table { min-width:600px; } th { color:var(--ui-muted); background:#0b1727 !important; } td { border-color:var(--ui-border) !important; }.modal, .dialog-content { border-radius:var(--ui-radius) !important; }

@media (max-width: 900px) { .product-hero, .product-panel-showcase { grid-template-columns: 1fr; gap: 38px; }.product-hero { padding-top: 48px; }.product-step-grid { grid-template-columns: repeat(2,1fr); }.portal-page-header { align-items:flex-start; flex-direction:column; }.content { padding:16px 18px 34px !important; }.portal-topbar { margin-bottom:18px; }.portal-status { display:none; } }
@media (max-width: 620px) { .hero { padding:0 18px 32px; }.nav { padding:12px 0; }.brand img { max-width:140px; }.product-hero h1 { font-size:2.65rem; }.product-benefit-row { gap:8px 12px; }.product-steps, .product-panel-showcase { padding:58px 20px; }.product-feature-layout { padding:58px 20px; }.product-step-grid, .product-feature-grid { grid-template-columns:1fr; }.product-feature-grid .ui-card { min-height:auto; }.preview-chat { min-height:230px; }.preview-metrics { grid-template-columns:1fr; }.preview-metrics div { border-right:0; border-bottom:1px solid var(--ui-border); }.panel-showcase-mock { grid-template-columns:1fr; }.panel-showcase-mock aside { display:flex; overflow:hidden; gap:3px; padding:10px; border-right:0; border-bottom:1px solid var(--ui-border); }.panel-showcase-mock aside b { display:none; }.panel-showcase-mock aside span { white-space:nowrap; }.mock-kpi-row { grid-template-columns:1fr; }.portal-topbar-actions .ui-button { padding:.5rem .65rem; }.portal-page-header h1 { font-size:1.8rem; }.sidebar .nav-emoji { display:inline-flex !important; }.sidebar .nav-text { display:flex !important; } }

/* Shared authentication composition. */
.auth-body { min-height:100dvh; background:var(--ui-bg) !important; color:var(--ui-text); }
.auth-body::before { display:none; }.auth-shell { width:min(1180px, calc(100% - 48px)); min-height:calc(100dvh - 48px); margin:24px auto; display:grid !important; grid-template-columns:minmax(360px, .88fr) minmax(410px, .72fr); overflow:hidden; border:1px solid var(--ui-border); border-radius:var(--ui-radius-lg); background:var(--ui-surface); box-shadow:var(--ui-shadow); }
.auth-body .brand-panel { display:flex !important; flex-direction:column; justify-content:center; padding:clamp(2rem,6vw,5rem) !important; border:0 !important; border-radius:0 !important; background:#0b1727 !important; }.auth-body .brand-panel::before { content:'KiraBot'; margin-bottom:25px; color:var(--ui-primary-hover); font-size:.76rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }.auth-body .brand-panel::after { display:block; right:-10rem; bottom:-10rem; border-color:rgba(62,158,234,.25); box-shadow:0 0 0 2rem rgba(62,158,234,.04),0 0 0 5rem rgba(62,158,234,.025); }.auth-body .brand-panel h1 { max-width:460px; font-size:clamp(2.25rem,4vw,3.8rem); letter-spacing:-.06em; }.auth-body .brand-panel p, .auth-body .feature-list { position:relative; z-index:1; max-width:430px; color:var(--ui-muted) !important; line-height:1.65; }.auth-body .feature-list { display:grid; gap:9px; padding:0; list-style:none; }.auth-body .feature-list li::before { content:'+'; display:inline-block; width:19px; color:var(--ui-primary-hover); font-weight:800; }.auth-body .login-card { align-self:center; width:min(100%, 440px); margin:auto !important; padding:clamp(1.75rem,4vw,3rem) !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }.auth-switch { display:flex; gap:3px; margin-bottom:35px; padding:4px; border:1px solid var(--ui-border); border-radius:10px; background:rgba(255,255,255,.025); }.auth-switch a { flex:1; padding:.5rem; color:var(--ui-muted); border-radius:7px; font-size:.75rem; font-weight:700; text-align:center; }.auth-switch a.is-current { color:#fff; background:rgba(62,158,234,.18); }.auth-body .login-header h2 { font-size:2rem; letter-spacing:-.045em; }.auth-body label { color:#b8c8da; font-size:.82rem; font-weight:700; }.auth-body input, .auth-body select, .auth-body textarea { border-color:var(--ui-border) !important; border-radius:var(--ui-radius-sm) !important; background:#0b1727 !important; }.auth-body form > button:not(.password-visibility-toggle), .auth-body .login-card button:not(.password-visibility-toggle) { background:var(--ui-primary) !important; border-radius:var(--ui-radius-sm) !important; }.auth-body .auth-links { color:var(--ui-muted); }.auth-body .auth-links a { color:var(--ui-primary-hover); }
@media (max-width:760px) { .auth-shell { width:100%; min-height:100dvh; margin:0; grid-template-columns:1fr; border:0; border-radius:0; }.auth-body .brand-panel { display:none !important; }.auth-body .login-card { width:min(100%, 480px); padding:32px 24px !important; }.auth-switch { margin-bottom:28px; } }