@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+Bengali&family=Noto+Sans+Devanagari&family=Noto+Sans+Gujarati&family=Noto+Sans+Gurmukhi&family=Noto+Sans+Kannada&family=Noto+Sans+Malayalam&family=Noto+Sans+Tamil&family=Noto+Sans+Telugu&display=swap');

/* ==========================================================================
   Tokens
   ========================================================================== */
:root {
  --brand-50: #f8eefb; --brand-100: #efd9f5; --brand-200: #dfb4ec; --brand-500: #79288f;
  --brand-600: #651f78; --brand-700: #521862; --brand-900: #2d0d36;
  --success: #0f9d8a; --warning: #f5a524; --danger: #d92d4a; --info: #2f6fed;
  --ink: #1f1a24; --muted: #5e5668; --line: #e7e2ea; --page: #faf8fb;
  --surface: #fff; --surface-2: #f4f0f6; --slate: #596579; --pink: #a32972; --teal: #087c70;
  --shadow: 0 12px 36px rgba(45, 13, 54, .09);
  --radius: 14px;
  --font: Inter, "Noto Sans Tamil", "Noto Sans Devanagari", "Noto Sans Bengali", "Noto Sans Telugu", "Noto Sans Kannada", "Noto Sans Malayalam", "Noto Sans Gujarati", "Noto Sans Gurmukhi", system-ui, sans-serif;
  --ease-bounce: cubic-bezier(.22, 1.35, .36, 1);
  --sidebar-width: 262px;
  --sidebar-collapsed-width: 84px;
}

/* The workspace and auth screens follow the dashboard palette and support dark mode; the public landing page does not. */
body:not([data-layout="landing"]) {
  --brand-500: #77278f; --brand-600: #611f76; --brand-700: #4e185f;
  --ink: #241d27; --muted: #625969; --line: #e5dbe9; --page: #fff;
  --surface: rgba(255, 255, 255, .82); --surface-2: rgba(250, 245, 252, .88);
  --glass-border: rgba(255, 255, 255, .94);
  --glass-bg: linear-gradient(138deg, rgba(252, 245, 254, .93) 0%, rgba(244, 228, 250, .88) 52%, rgba(231, 201, 242, .84) 100%);
  --glass-shadow: inset 1px 1px 0 rgba(255, 255, 255, .9), inset -1px -1px 0 rgba(126, 48, 151, .1), 0 16px 38px rgba(104, 41, 121, .14);
  --field-bg: rgba(255, 255, 255, .94); --field-border: #cfc2d4;
  --control-bg: rgba(255, 255, 255, .9); --control-border: rgba(92, 65, 102, .2);
  --overlay-bg: rgba(45, 13, 54, .3);
  --panel-bg: rgba(252, 244, 254, .985); --panel-border: rgba(255, 255, 255, .9);
  --hover-bg: rgba(119, 39, 143, .08);
  --link: var(--brand-600);
  color-scheme: light;
}
html[data-theme="dark"] body:not([data-layout="landing"]) {
  --ink: #f5edf8; --muted: #d1c2d8; --line: rgba(255, 255, 255, .2); --page: #050306;
  --surface: rgba(20, 13, 24, .78); --surface-2: rgba(255, 255, 255, .12);
  --brand-50: #29112f; --brand-100: #482052; --brand-200: #713584;
  --glass-border: rgba(255, 255, 255, .25);
  --glass-bg: linear-gradient(135deg, rgba(103, 39, 124, .56), rgba(16, 9, 20, .62) 55%, rgba(151, 51, 191, .31)), rgba(8, 5, 11, .52);
  --glass-shadow: inset 1px 1px 0 rgba(255, 255, 255, .16), inset -1px -1px 0 rgba(0, 0, 0, .22), 0 20px 48px rgba(0, 0, 0, .3);
  --field-bg: rgba(0, 0, 0, .45); --field-border: rgba(255, 255, 255, .3);
  --control-bg: rgba(255, 255, 255, .1); --control-border: rgba(255, 255, 255, .28);
  --overlay-bg: rgba(8, 5, 11, .58);
  --panel-bg: rgba(27, 17, 33, .96); --panel-border: rgba(255, 255, 255, .22);
  --hover-bg: rgba(255, 255, 255, .08);
  --link: #e6a6f6;
  color-scheme: dark;
}

/* ==========================================================================
   Base
   ========================================================================== */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; background: var(--page); color: var(--ink); font: 15px/1.5 var(--font); }
button, input, select, textarea { font: inherit; }
button, a, [role=button] { -webkit-tap-highlight-color: transparent; }
a { color: var(--brand-600); }
button { cursor: pointer; }
img { max-width: 100%; }
:focus-visible { outline: 3px solid var(--info); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--brand-200); }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.16; letter-spacing: -.03em; }
h1 { font-size: clamp(2rem, 4vw, 3rem); }
h2 { font-size: 1.65rem; }
h3 { font-size: 1.05rem; }
small, .small { font-size: .82rem; color: var(--muted); }
[hidden] { display: none !important; }
.skip-link { position: absolute; left: -999px; top: 8px; z-index: 99; padding: 12px; background: #fff; }
.skip-link:focus { left: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
main { min-width: 0; }
.row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.between { justify-content: space-between; }
.muted { color: var(--muted); }
.tabular { font-variant-numeric: tabular-nums; }
.page-wrap { max-width: 1440px; margin: auto; padding: 28px; }
.sr-status { min-height: 1.4em; }
.eyebrow { margin: 0 0 8px; font-size: .7rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
kbd { padding: 1px 5px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface-2); color: var(--ink); font: inherit; }
.lucide { width: 1.1em; height: 1.1em; flex: 0 0 auto; stroke-width: 2; vertical-align: -.15em; }

/* ==========================================================================
   Base components (shared by every layout)
   ========================================================================== */
.card { padding: 20px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 3px 10px rgba(31, 26, 36, .025); }
.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 15px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); font-weight: 650; text-decoration: none; }
.btn--primary { background: var(--brand-500); border-color: var(--brand-500); color: #fff; }
.btn--primary:hover { background: var(--brand-600); }
.btn--danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn--compact { min-height: 34px; padding: 6px 10px; font-size: .78rem; }
.btn:disabled { cursor: not-allowed; opacity: .6; }
.icon-button { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 auto; padding: 0; border: 1px solid var(--control-border, var(--line)); border-radius: 50%; background: var(--control-bg, #fff); color: var(--ink); }
.field { display: grid; gap: 6px; }
.field input, .field select, .field textarea { width: 100%; min-height: 44px; padding: 10px 12px; background: #fff; border: 1px solid #bcb4c4; border-radius: 9px; color: var(--ink); }
.field textarea { min-height: 90px; }
.badge, .status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; border-radius: 999px; font-size: .78rem; font-weight: 650; background: var(--surface-2); color: var(--ink); }
.status--good { background: #e6f6f2; color: #075b50; }
.status--warn { background: #fff3d9; color: #734600; }
.status--bad { background: #fff0f2; color: #9e1830; }
.status--info { background: #edf3ff; color: #174aa7; }
.table-wrap { width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.table { width: 100%; min-width: 680px; border-collapse: collapse; }
.table th, .table td { padding: 13px 15px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.table th { font-size: .78rem; color: var(--muted); background: #fcfbfd; }
.table tr:last-child td { border-bottom: 0; }
.progress { height: 8px; overflow: hidden; border-radius: 99px; background: #ece7ef; }
.progress span { display: block; height: 100%; border-radius: inherit; background: var(--success); }
.empty, .loading, .error { padding: 28px; border: 1px dashed #bcb4c4; border-radius: 12px; text-align: center; background: #fff; }
.loading { display: flex; align-items: center; justify-content: center; gap: 8px; }
.error { border-color: #e8a6b1; color: #912036; }
.metric { font-size: 1.7rem; font-weight: 750; font-variant-numeric: tabular-nums; }
.tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--line); }
.tabs button, [data-tabs] [role=tab] { padding: 10px 12px; border: 0; background: transparent; color: var(--muted); }
.tabs button[aria-selected=true], [data-tabs] [role=tab][aria-selected=true] { color: var(--brand-700); border-bottom: 2px solid var(--brand-500); font-weight: 700; }
.notice { padding: 12px 14px; border: 1px solid var(--brand-200); border-radius: 10px; background: var(--brand-50); }
.modal { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; padding: 18px; background: #16091c99; }
.modal__dialog { width: 100%; max-width: 480px; padding: 24px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.toast { position: fixed; z-index: 120; right: 20px; bottom: 20px; padding: 14px 18px; border-radius: 12px; background: var(--brand-900); color: #fff; }
.canvas { position: relative; min-height: 410px; overflow: hidden; background-color: #fcfbfd; background-image: radial-gradient(#c9c1d0 1px, transparent 1px); background-size: 20px 20px; }
.node { position: relative; z-index: 1; max-width: 235px; padding: 12px; border: 1px solid var(--line); border-left: 5px solid var(--node-color); border-radius: 12px; background: #fff; box-shadow: var(--shadow); }
.node strong { display: inline-flex; align-items: center; gap: 6px; }
.node strong .lucide { color: var(--node-color); }
.node__type { font-size: .72rem; color: var(--muted); }
.node--start { --node-color: var(--teal); }
.node--say { --node-color: var(--brand-500); }
.node--collect { --node-color: var(--info); }
.node--knowledge { --node-color: var(--warning); }
.node--script { --node-color: var(--slate); }
.node--branch { --node-color: var(--pink); }
.node--transfer { --node-color: var(--danger); }
.node--end { --node-color: #77717d; }

/* ==========================================================================
   Landing (public marketing page)
   ========================================================================== */
body[data-layout="landing"] { background: #fff; }
.landing{background:#fff}
.landing-nav{position:sticky;top:0;z-index:20;background:var(--brand-500);color:white;padding:12px 4vw;display:flex;align-items:center;justify-content:space-between}
.landing-nav img{width:112px}
.landing-nav a{color:white;text-decoration:none}
.landing-nav a.btn{color:var(--brand-700);background:#fff;border-color:#fff}
.landing-nav__links{display:flex;gap:18px}
.hero{background:var(--brand-900);color:#fff;padding:72px 6vw 86px;min-height:620px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:40px}
.hero p{max-width:590px;color:#e7ddec}
.hero h1{font-size:clamp(2.5rem,5vw,4.8rem)}
.hero__visual{padding:24px;background:#3a1846;border:1px solid #704b7a;border-radius:20px;box-shadow:0 24px 90px #0005}
.wave{height:45px;display:flex;align-items:center;gap:4px}
.wave i{display:block;width:4px;background:#dda9ef;border-radius:4px;height:var(--h)}
.section{padding:78px 6vw}
.section--dark{background:var(--brand-900);color:#fff}
.section__head{max-width:760px;margin:0 auto 32px;text-align:center}
.plan{position:relative}
.plan--featured{border:2px solid var(--brand-500);transform:translateY(-8px)}
.plan ul{padding-left:20px}
.plan li{margin:9px 0}
.plan-price{font-size:1.75rem;font-weight:800}
.pricing-grid{align-items:stretch}
.price-toggle{display:flex;justify-content:center;gap:8px;margin:20px}
.cost-calculator{scroll-margin-top:90px}
.estimate-result{margin-top:20px;padding:18px;border-radius:12px;background:var(--brand-50);border:1px solid var(--brand-200)}
.quote{font-size:1rem;color:inherit}
.use-case{min-height:120px}
.faq details{padding:16px 0;border-bottom:1px solid var(--line)}
.footer{padding:40px 6vw;background:var(--brand-900);color:white}
.footer a{color:#eee}
/* Public marketing page: isolated from the shared application shell. */
.landing{background:var(--surface);overflow-x:clip}.landing .section{padding:88px max(24px,calc((100vw - 1200px)/2))}.landing .section--dark{background:var(--brand-900);color:#fff}.landing .section--dark p{color:#eadff0}.landing .card{box-shadow:0 1px 2px rgba(45,13,54,.08),0 16px 36px rgba(45,13,54,.06)}
.landing-nav{padding:0 max(24px,calc((100vw - 1200px)/2));min-height:66px;gap:24px;box-shadow:0 1px 0 rgba(255,255,255,.14)}.landing-nav::after{content:"";position:absolute;inset:auto 0 0;height:3px;background:var(--warning);transform:scaleX(var(--scroll-progress,0));transform-origin:left}.landing-nav img{width:120px}.landing-nav__links{margin-left:auto;align-items:center}.landing-nav__links a{font-size:.9rem;font-weight:650;opacity:.92}.landing-nav__links a:hover{text-decoration:underline;text-underline-offset:5px}.landing-nav .row{flex-wrap:nowrap}.landing-nav .btn{min-height:38px;font-size:.86rem}.landing-nav.is-compact{min-height:54px}
.hero{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(850px 420px at 88% 0,#79288f88,transparent 65%),radial-gradient(500px 300px at 5% 90%,#b651ca3b,transparent 65%),var(--brand-900);padding:94px max(24px,calc((100vw - 1200px)/2));min-height:690px}.hero::before,.hero::after{position:absolute;z-index:-1;color:#ffffff13;font-size:clamp(5rem,12vw,11rem);font-weight:800;line-height:1}.hero::before{content:"அ";left:3%;top:3%}.hero::after{content:"आ";right:4%;bottom:-4%}.hero h1{max-width:700px;font-size:clamp(2.7rem,5vw,4.75rem);letter-spacing:-.055em}.hero .badge{background:#ffffff1c;color:#f9eeff;border:1px solid #ffffff38;padding:6px 12px}.hero__visual{background:#ffffff12;border:1px solid #ffffff30;border-radius:24px;box-shadow:0 28px 76px #12061794}.hero__visual .metric{color:#fff;font-size:2.2rem;margin:16px 0 0}.hero__visual .card{border:0;border-radius:16px;box-shadow:none}.hero__visual .card p{color:var(--ink)}.wave{margin:14px 0 5px;height:56px}.wave i{width:5px;background:linear-gradient(var(--brand-100),var(--warning));box-shadow:0 0 14px #e8a5fc66}.hero .btn--primary{background:#fff;color:var(--brand-700);border-color:#fff}.hero .btn--primary:hover{background:var(--brand-100)}.hero .btn:not(.btn--primary){background:transparent;color:#fff;border-color:#ffffff99}.hero .btn:not(.btn--primary):hover{background:#ffffff14}
.landing main>section:nth-of-type(2){padding-top:48px;padding-bottom:48px}.landing main>section:nth-of-type(2) .metric{font-size:2.4rem;color:var(--brand-500)}.landing main>section:nth-of-type(2) article{position:relative;padding-left:18px;border-left:2px solid var(--brand-200)}
.landing main>section:nth-of-type(3){padding-top:28px;padding-bottom:28px;background:#fff;color:var(--brand-700);border-block:1px solid var(--line)}.landing main>section:nth-of-type(3) .section__head{max-width:1200px;text-align:left;margin:0 auto}.landing main>section:nth-of-type(3) h2{font-size:1rem;letter-spacing:0;margin:0 0 9px}.landing main>section:nth-of-type(3) p{font-size:1.05rem;font-weight:750;word-spacing:14px;color:var(--brand-700)}
.landing #platform{background:var(--brand-50)}.landing #platform .canvas{border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.landing #platform .node{align-self:center}.landing #languages .badge{justify-content:center;padding:9px 13px;background:var(--brand-100);color:var(--brand-700);border:1px solid transparent;transition:transform .2s,background .2s,box-shadow .2s}.landing #languages .badge:hover{background:var(--brand-500);color:#fff;transform:translateY(-2px);box-shadow:0 8px 16px #79288f25}.landing #use-cases{background:var(--brand-50)}.landing .use-case{min-height:0;transition:transform .2s,box-shadow .2s;border-color:#dfd1e4}.landing .use-case:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.landing .use-case p{margin-bottom:0;color:var(--muted)}
.landing #pricing{background:linear-gradient(180deg,var(--brand-50),#fff 48%)}.landing #pricing>.section__head{max-width:880px}.price-toggle{width:max-content;max-width:100%;margin:0 auto 30px;padding:5px 8px 5px 14px;border-radius:999px;background:var(--brand-100);align-items:center}.price-toggle label{display:flex;align-items:center;gap:9px;font-weight:700;color:var(--brand-700)}.price-toggle input{inline-size:18px;block-size:18px;accent-color:var(--brand-500)}.pricing-grid{gap:14px}.plan{display:flex;flex-direction:column;border-color:#ddcce4}.plan .plan-price{color:var(--brand-700);letter-spacing:-.04em}.plan .quote{min-height:48px}.plan>p:last-of-type{margin-top:auto;color:var(--muted);font-size:.86rem}.plan .btn{width:100%;margin-top:12px}.plan--featured{background:linear-gradient(180deg,#fff,#fbf4fd);box-shadow:0 18px 40px #79288f22}.plan--featured>.badge{position:absolute;right:16px;top:16px;background:var(--brand-500);color:#fff}
.bill-meter{display:grid;grid-template-columns:132px minmax(0,1fr);gap:24px;align-items:center;margin-top:28px;padding:26px}.bill-meter__ring{--bill-fill:27%;width:126px;height:126px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--brand-500) var(--bill-fill),var(--brand-100) 0);position:relative}.bill-meter__ring::after{content:"";position:absolute;inset:10px;border-radius:50%;background:#fff}.bill-meter__ring strong{position:relative;z-index:1;color:var(--brand-700);font-size:1.35rem;text-align:center;line-height:1.05}.bill-meter__ring small{display:block;font-size:.72rem;color:var(--muted);font-weight:600}.bill-meter .metric{color:var(--brand-700);margin:10px 0}.bill-meter .progress{display:none}.cost-calculator{scroll-margin-top:84px;margin-top:24px!important;padding:0!important;overflow:hidden;border:1px solid var(--brand-200)!important;background:linear-gradient(115deg,var(--brand-900),var(--brand-500))!important;color:#fff}.cost-calculator__inner{padding:30px;display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}.cost-calculator h2,.cost-calculator p{color:inherit}.cost-calculator .small{color:#eadff0}.cost-calculator .field{color:#fff;font-weight:700}.cost-calculator .field select,.cost-calculator .field input{background:#fff;color:var(--ink)}.cost-calculator .field output{color:var(--warning)}.estimate-result{margin:0;padding:24px;background:#fff;color:var(--ink);border:0;border-radius:16px;box-shadow:0 14px 32px #16041e3b}.estimate-result .small,.estimate-result p{color:var(--muted)}.estimate-result .metric{color:var(--brand-700);font-size:clamp(2rem,4vw,3rem);display:block;margin:7px 0}.cost-calculator__note{padding:0 30px 28px;margin:0}.landing #pricing>section.card:last-child{margin-top:24px!important}.landing #pricing>section.card:last-child h2{color:var(--brand-700)}
.landing #deployment{background:var(--brand-50)}.landing #deployment .card{border-top:4px solid var(--brand-500)}.faq{max-width:1000px;margin:auto}.faq details{background:#fff;border:1px solid var(--line);border-radius:12px;margin:10px 0;padding:0!important;overflow:hidden}.faq summary{padding:17px 18px;font-weight:750;cursor:pointer;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";float:right;color:var(--brand-500);font-size:1.3rem}.faq details[open] summary::after{content:"−"}.faq details p{padding:0 18px 17px;margin:0;color:var(--muted)}.footer{padding:48px max(24px,calc((100vw - 1200px)/2))}.footer img{width:128px!important}
@media(max-width:900px){.landing .section,.hero{padding-inline:24px}.landing-nav{padding-inline:20px}.landing-nav__links{display:none}.hero{padding-top:72px}.cost-calculator__inner{grid-template-columns:1fr}.plan--featured{transform:none}.bill-meter{grid-template-columns:1fr}.bill-meter__ring{margin:auto}}
@media(max-width:600px){.landing-nav{min-height:60px;gap:10px}.landing-nav img{width:96px}.landing-nav .row{gap:8px}.landing-nav .row>a:not(.btn){font-size:.84rem}.landing-nav .btn{padding-inline:10px}.hero{min-height:auto;padding-block:64px}.hero h1{font-size:2.55rem}.hero__visual{padding:17px}.landing .section{padding:58px 18px}.landing main>section:nth-of-type(2) article{padding-left:14px}.cost-calculator__inner{padding:22px}.cost-calculator__note{padding:0 22px 22px}.bill-meter{padding:20px}.price-toggle{width:100%;border-radius:14px;justify-content:space-between}.price-toggle .small{display:none}}
@media(prefers-reduced-motion:no-preference){.wave i{animation:landing-wave 1.2s ease-in-out infinite alternate}.wave i:nth-child(3n){animation-delay:.25s}.wave i:nth-child(4n){animation-delay:.45s}@keyframes landing-wave{to{transform:scaleY(.62)}}}

/* Embedded stack calculator */
.calculator{--c-plat:#79288f;--c-stt:#2572cf;--c-llm:#0f9d8a;--c-tts:#d87a16;--c-tel:#d92d4a;background:var(--brand-50);margin:0 calc(-1 * max(24px,calc((100vw - 1200px)/2)));padding:82px max(24px,calc((100vw - 1200px)/2));scroll-margin-top:70px}.calculator .wrap{max-width:1200px;margin:auto}.calculator .center{max-width:760px;margin:0 auto 32px;text-align:center}.calculator .eyebrow{display:inline-flex;padding:5px 11px;border:1px solid var(--brand-200);border-radius:999px;background:#fff;color:var(--brand-700);font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.calculator h2{font-size:clamp(2rem,4vw,3rem);margin:12px 0}.calculator .hl{color:var(--brand-500)}.calculator .lead{font-size:1.03rem;color:var(--muted)}.calc{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);gap:18px;align-items:start}.calc .box{background:#fff;border:1px solid var(--line);border-radius:18px;padding:23px;box-shadow:0 12px 30px rgba(45,13,54,.07)}.calc .field{margin-bottom:18px}.calc .lbl{display:block;margin-bottom:7px;color:var(--ink);font-size:.88rem;font-weight:800}.calc .lbl i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;background:var(--c)}.calc select,.calc input[type=number]{width:100%;min-height:44px;padding:10px 11px;border:1px solid #bcb4c4;border-radius:9px;background:#fff;color:var(--ink)}.calc input[type=range]{accent-color:var(--brand-500);width:100%}.calc .row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.calc .hint,.calc .note,.calc .sm{display:block;color:var(--muted);font-size:.78rem;line-height:1.5}.calc .note{margin:0;padding:13px;border-radius:10px;background:var(--page)}.presets{display:flex;gap:7px;flex-wrap:wrap}.presets button{min-height:35px;padding:6px 10px;border:1px solid var(--brand-200);border-radius:999px;background:#fff;color:var(--brand-700);font-weight:700;font-size:.78rem}.presets button[aria-pressed=true]{background:var(--brand-500);border-color:var(--brand-500);color:#fff}.calc .res{position:sticky;top:84px;display:grid;gap:23px;background:linear-gradient(160deg,#fff,#faf4fc)}.calc .big{margin-top:4px;font-size:clamp(2rem,4vw,2.75rem);line-height:1;color:var(--brand-700);font-weight:850;letter-spacing:-.05em}.split{height:12px;display:flex;overflow:hidden;border-radius:99px;background:var(--line)}.split span{display:block;height:100%;transition:width .25s ease}.brk{display:grid;gap:8px}.brk>div{display:grid;grid-template-columns:13px 1fr auto;align-items:center;gap:7px;font-size:.82rem}.brk i{width:10px;height:10px;border-radius:50%}.brk b{font-variant-numeric:tabular-nums}.opts{display:grid;gap:7px}.opt{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:10px 11px;border:1px solid var(--line);border-radius:10px}.opt.best{border-color:var(--brand-500);background:var(--brand-50)}.opt .nm{font-weight:800}.opt .why{grid-column:1/-1;font-size:.75rem;color:var(--muted)}.vs{border-top:1px solid var(--line);padding-top:13px;display:grid;gap:7px}.vs>div{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:.8rem}.vs>div:first-child{font-weight:800;color:var(--ink)}.cta-note{padding:12px;border-radius:10px;background:#fff1d9;color:#734600;font-size:.84rem}.calculator+.card{margin-top:24px!important}
@media(max-width:900px){.calculator{margin-inline:-24px;padding-inline:24px}.calc{grid-template-columns:1fr}.calc .res{position:static}}@media(max-width:600px){.calculator{margin-inline:-18px;padding:58px 18px}.calc .box{padding:17px}.calc .row2{grid-template-columns:1fr}.presets{display:grid;grid-template-columns:1fr 1fr}.presets button{padding-inline:6px}.calc .res{gap:18px}}
.node .lucide, .landing .section__head .lucide { vertical-align: -.2em; }
.landing #platform .node .lucide { color: var(--node-color); }

/* ==========================================================================
   Auth and onboarding
   ========================================================================== */
body[data-layout="auth"] { display: grid; place-items: center; min-height: 100vh; padding: 32px; background: radial-gradient(circle at 10% 12%, #fff6ef 0 18%, transparent 18.2%), radial-gradient(circle at 88% 82%, #efd9f5 0 20%, transparent 20.2%), #f7edf8; }
html[data-theme="dark"] body[data-layout="auth"], html[data-theme="dark"] body[data-layout="bare"] { background: #050306 url('assets/theme-dark-background.png') center / cover fixed no-repeat; }
body[data-layout="bare"] { background: #fff url('assets/theme-light-background.png') center / cover fixed no-repeat; }
#bare-view { width: 100%; }
.auth { display: grid; grid-template-columns: 42% 58%; width: min(1180px, 100%); min-height: min(760px, calc(100vh - 64px)); margin: auto; overflow: hidden; border: 10px solid #fff; border-radius: 28px; background: #fff; box-shadow: 0 30px 80px rgba(45, 13, 54, .18); }
.auth__brand { position: relative; isolation: isolate; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; min-height: 100%; overflow: hidden; padding: 54px 42px 38px; background: linear-gradient(155deg, var(--brand-500), var(--brand-900)); color: #fff; }
.auth__brand::before { content: ""; position: absolute; z-index: -1; inset: auto -100px -100px -100px; height: 330px; border-radius: 55% 45% 0 0; background: #ffffff16; }
.auth__brand::after { content: ""; position: absolute; z-index: -1; top: 42px; right: -46px; width: 170px; height: 170px; border: 18px solid #ffffff18; border-radius: 50%; }
.auth__brand > img { position: absolute; left: 36px; top: 32px; width: 126px; }
.auth__brand > div { width: 100%; max-width: 390px; text-align: center; }
.auth__brand h2 { max-width: 330px; margin: 4px auto 10px; font-size: 1.8rem; }
.auth__brand p { margin-bottom: 0; color: #f4ddfa; }
.auth__brand .mascot { width: min(370px, 100%); height: auto; margin: 0 auto -12px; filter: drop-shadow(0 20px 22px #12061733); }
.mascot[data-state=success] { animation: nod .5s 2; }
.mascot[data-state=error] { animation: shake .28s 2; }
@keyframes nod { 50% { transform: rotate(7deg) translateY(5px); } }
@keyframes shake { 25% { transform: translateX(-8px); } 75% { transform: translateX(8px); } }
.auth__form { display: grid; align-content: center; gap: 14px; width: 100%; max-width: 570px; margin: auto; padding: 62px 72px 44px; color: var(--ink); }
html[data-theme="dark"] .auth__form { --ink: #1f1a24; --muted: #5e5668; --line: #e7e2ea; --surface-2: #f4f0f6; }
.auth__form > div:first-child { text-align: center; }
.auth__form h1 { margin-bottom: 10px; font-size: clamp(2rem, 3vw, 2.7rem); }
.auth__form h1 + p { color: var(--muted); }
.auth__form > .row:nth-child(2) { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.auth__form > .row:nth-child(2) .btn { min-height: 42px; padding: 8px; border-radius: 999px; background: var(--surface-2); font-size: .82rem; }
.auth__form > .row:nth-child(3) { gap: 9px; color: var(--muted); font-size: .78rem; }
.auth__form > .row:nth-child(3) hr { border: 0; border-top: 1px solid var(--line); }
.auth__form .field { gap: 7px; }
.auth__form .field input { min-height: 52px; padding: 12px 18px; border: 0; border-radius: 999px; background: #f5f2f6; }
.auth__form .field .row { position: relative; display: block; }
.auth__form .field .row input { padding-right: 76px; }
.auth__form .field .row .btn { position: absolute; right: 7px; top: 5px; min-height: 42px; padding: 5px 12px; border: 0; background: transparent; color: var(--brand-700); }
.auth__form > .btn--primary { min-height: 54px; margin-top: 6px; border-radius: 999px; box-shadow: 0 10px 18px #79288f2c; }
.auth__form > [data-auth-error] { min-height: auto; padding: 3px; border: 0; background: transparent; color: var(--muted); font-size: .78rem; }
.auth__form > a { font-size: .86rem; text-align: right; }
.auth__form > label:not(.field) { font-size: .86rem; color: var(--muted); }
.auth__form > p:not(.sr-status) { margin: 4px 0; text-align: center; }
.auth__form > small { text-align: center; }
.auth__form .progress { height: 7px; margin-top: -5px; }
.auth__form .progress span { background: var(--brand-500); }
.page-wrap .card { margin-top: 16px; }
.page-wrap .card:first-of-type { margin-top: 0; }

/* ==========================================================================
   App shell: layout, sidebar, topbar
   ========================================================================== */
body[data-layout="app"] { background: #fff url('assets/theme-light-background.png') center / cover fixed no-repeat; scrollbar-width: thin; }
html[data-theme="dark"] body[data-layout="app"] { background: #050306 url('assets/theme-dark-background.png') center / cover fixed no-repeat; }
html:has(body[data-layout="app"]) { scrollbar-width: thin; scrollbar-color: #943bad rgba(255, 255, 255, .55); }
html[data-theme="dark"]:has(body[data-layout="app"]) { scrollbar-color: #d872ee #170b1c; }

.app-shell { display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); min-height: 100vh; transition: grid-template-columns .32s var(--ease-bounce); }
.app-shell.is-sidebar-collapsed { grid-template-columns: var(--sidebar-collapsed-width) minmax(0, 1fr); }
.shell-main { min-width: 0; min-height: 100vh; padding-top: 96px; }

.sidebar {
  position: sticky; top: 12px; display: flex; flex-direction: column; gap: 20px;
  height: calc(100vh - 24px); margin: 12px 0 12px 12px; padding: 22px 14px; overflow-y: auto;
  border: 1px solid rgba(255, 255, 255, .9); border-radius: 18px; color: #37233f;
  background: linear-gradient(160deg, rgba(248, 230, 253, .9), rgba(234, 200, 246, .82) 58%, rgba(216, 165, 234, .76));
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .96), 0 16px 38px rgba(82, 29, 97, .15);
  scrollbar-width: thin; scrollbar-color: #943bad rgba(255, 255, 255, .55);
  transition: padding .32s var(--ease-bounce);
}
html[data-theme="dark"] .sidebar { border-color: rgba(255, 255, 255, .18); color: #f6eff8; background: rgba(45, 13, 54, .94); box-shadow: 0 14px 36px #00000040; scrollbar-color: #d872ee #170b1c; }
.sidebar.is-bouncing { animation: sidebar-bounce .38s var(--ease-bounce); }
@keyframes sidebar-bounce { 42% { transform: scaleX(.94); } 72% { transform: scaleX(1.02); } }

.sidebar__brand { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 46px; padding: 0 2px 14px 12px; border-bottom: 1px solid rgba(92, 40, 108, .16); }
html[data-theme="dark"] .sidebar__brand { border-color: #ffffff2a; }
.sidebar__logo { width: 116px; height: auto; filter: brightness(0) saturate(100%) invert(20%) sepia(31%) saturate(2797%) hue-rotate(259deg) brightness(88%) contrast(92%); }
html[data-theme="dark"] .sidebar__logo { filter: none; }
.sidebar__mark { display: none; width: 40px; height: 40px; border-radius: 11px; box-shadow: 0 6px 16px rgba(77, 22, 93, .25); }
.sidebar-collapse { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 auto; padding: 0; border: 1px solid rgba(92, 40, 108, .22); border-radius: 50%; background: rgba(255, 255, 255, .55); color: inherit; }
.sidebar-collapse:hover { background: rgba(255, 255, 255, .85); }
html[data-theme="dark"] .sidebar-collapse { border-color: rgba(255, 255, 255, .4); background: rgba(255, 255, 255, .13); }
html[data-theme="dark"] .sidebar-collapse:hover { background: rgba(255, 255, 255, .22); }
.sidebar-collapse > span { display: grid; place-items: center; }
.sidebar-collapse__open { display: none !important; }

.sidebar nav { display: grid; gap: 3px; }
.nav-section { display: grid; gap: 3px; }
.nav-group { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 14px 12px 5px; border: 0; background: transparent; color: #604068; font: inherit; letter-spacing: .09em; text-align: left; text-transform: uppercase; }
html[data-theme="dark"] .nav-group { color: #ddcde2; }
.nav-group .lucide { width: 16px; height: 16px; transition: transform .2s ease; }
.nav-group[aria-expanded="false"] .lucide { transform: rotate(-90deg); }
.nav-group__items { display: grid; gap: 3px; }
.nav-section.is-closed .nav-group__items { display: none; }
.nav-link { display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 9px 12px; border-radius: 10px; color: #37233f; text-decoration: none; }
html[data-theme="dark"] .nav-link { color: #f6eff8; }
.nav-link .lucide { width: 18px; height: 18px; }
.nav-link:hover, .nav-link[aria-current="page"] { color: #fff; background: linear-gradient(135deg, #8834a0, #68217c); }
html[data-theme="dark"] .nav-link:hover, html[data-theme="dark"] .nav-link[aria-current="page"] { background: var(--brand-500); }

/* Collapsed rail: sections dissolve and every destination shows as an icon. */
.sidebar.is-collapsed { padding-inline: 10px; }
.sidebar.is-collapsed .sidebar__brand { flex-direction: column; justify-content: flex-start; gap: 14px; padding: 0 0 14px; }
.sidebar.is-collapsed .sidebar__logo { display: none; }
.sidebar.is-collapsed .sidebar__mark { display: block; }
.sidebar.is-collapsed .sidebar-collapse__open { display: grid !important; }
.sidebar.is-collapsed .sidebar-collapse__close { display: none; }
.sidebar.is-collapsed .nav-group { display: none; }
.sidebar.is-collapsed .nav-section.is-closed .nav-group__items { display: grid; }
.sidebar.is-collapsed nav { gap: 6px; }
.sidebar.is-collapsed .nav-section, .sidebar.is-collapsed .nav-group__items { gap: 6px; }
.sidebar.is-collapsed .nav-link { justify-content: center; padding-inline: 0; }
.sidebar.is-collapsed .nav-link > span { display: none; }

.sidebar-toggle { display: none; }
.drawer-backdrop { display: none; }

.topbar {
  position: fixed; z-index: 50; top: 12px; left: calc(var(--sidebar-width) + 40px); right: 28px;
  display: flex; align-items: center; gap: 16px; height: 72px; padding: 0 28px;
  border: 1px solid rgba(255, 255, 255, .9); border-radius: 18px;
  background: linear-gradient(120deg, rgba(250, 238, 254, .92), rgba(240, 214, 249, .86) 58%, rgba(225, 180, 240, .8));
  box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .88), 0 12px 28px rgba(104, 41, 121, .14);
  transition: left .32s var(--ease-bounce);
}
html[data-theme="dark"] .topbar { border-color: rgba(255, 255, 255, .22); background: rgba(13, 9, 16, .78); box-shadow: 0 12px 28px rgba(0, 0, 0, .3); }
.app-shell.is-sidebar-collapsed .topbar { left: calc(var(--sidebar-collapsed-width) + 40px); }
.topbar-search { display: flex; align-items: center; flex: 1 1 auto; gap: 9px; max-width: 560px; min-width: 0; min-height: 42px; padding: 0 12px; border: 1px solid rgba(130, 62, 151, .2); border-radius: 11px; background: rgba(255, 252, 255, .82); color: #756b7d; text-align: left; box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .72); }
html[data-theme="dark"] .topbar-search { border-color: rgba(255, 255, 255, .28); background: rgba(13, 9, 16, .82); color: var(--muted); box-shadow: none; }
.topbar-search .lucide { width: 18px; height: 18px; }
.topbar-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.agent-assistant-trigger { min-height: 40px; padding: 8px 15px; border: 1px solid var(--brand-500); border-radius: 11px; background: var(--brand-500); color: #fff; box-shadow: 0 5px 14px rgba(75, 20, 89, .18); }
.agent-assistant-trigger:hover { background: var(--brand-600); }
html[data-theme="dark"] .agent-assistant-trigger { border-color: rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .1); color: var(--ink); }
.profile-avatar { display: grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; padding: 0; border: 2px solid rgba(255, 255, 255, .9); border-radius: 50%; background: linear-gradient(145deg, #bd5ed5, #5c1c72); color: #fff; font-weight: 800; box-shadow: 0 0 0 1px rgba(121, 40, 143, .28), 0 4px 12px rgba(45, 13, 54, .16); }

/* ==========================================================================
   App shell: profile, settings, assistant, overlays
   ========================================================================== */
.profile-menu-layer { position: fixed; z-index: 90; top: 92px; right: 28px; }
.profile-menu { width: 250px; padding: 10px; border: 1px solid var(--panel-border); border-radius: 14px; background: var(--panel-bg); color: var(--ink); box-shadow: 0 18px 45px #180b2029; }
.profile-menu__identity { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; padding: 8px 8px 13px; border-bottom: 1px solid var(--line); }
.profile-menu__identity .profile-avatar { flex-basis: 36px; width: 36px; height: 36px; }
.profile-menu__identity span:last-child { display: grid; gap: 2px; }
.profile-menu a, .profile-menu__settings { display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 8px; width: 100%; padding: 10px 8px; border: 0; border-radius: 8px; background: transparent; color: var(--ink); font-weight: 650; text-align: left; text-decoration: none; }
.profile-menu a:hover, .profile-menu__settings:hover, .profile-menu__theme:hover { background: var(--hover-bg); }
.profile-menu__theme { display: grid; grid-template-columns: 28px 1fr 38px; align-items: center; gap: 9px; width: 100%; min-height: 46px; margin: 8px 0; padding: 7px 9px; border: 0; border-radius: 9px; background: transparent; color: var(--ink); font-weight: 650; text-align: left; }
.theme-toggle__icon { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--brand-50); color: var(--brand-600); transition: transform .35s ease, background .35s ease; }
.theme-toggle__icon > span { display: grid; place-items: center; }
.theme-toggle__sun { display: none !important; }
.theme-switch { width: 36px; height: 21px; padding: 3px; border-radius: 999px; background: #d7cedb; transition: background .3s ease; }
.theme-switch i { display: block; width: 15px; height: 15px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px #0003; transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
.profile-menu__theme[aria-pressed="true"] .theme-switch { background: var(--brand-500); }
.profile-menu__theme[aria-pressed="true"] .theme-switch i { transform: translateX(15px); }
.profile-menu__theme[aria-pressed="true"] .theme-toggle__icon { transform: rotate(180deg); background: #35153f; color: #f0c9ff; }
.profile-menu__theme[aria-pressed="true"] .theme-toggle__moon { display: none; }
.profile-menu__theme[aria-pressed="true"] .theme-toggle__sun { display: grid !important; }

.settings-sidebar { position: fixed; z-index: 95; top: 12px; right: 12px; bottom: 12px; width: min(360px, calc(100vw - 24px)); padding: 24px; border: 1px solid var(--panel-border); border-radius: 20px; background: var(--panel-bg); color: var(--ink); box-shadow: 0 24px 60px rgba(45, 13, 54, .22); transform: translateX(110%); transition: transform .24s ease; }
.settings-sidebar.is-open { transform: translateX(0); }
.settings-sidebar header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.settings-sidebar h2 { margin: 0; }
.settings-sidebar nav { display: grid; gap: 8px; margin-top: 20px; }
.settings-sidebar a { display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 13px; border: 1px solid rgba(121, 40, 143, .12); border-radius: 12px; background: var(--control-bg); color: var(--ink); text-decoration: none; }
.settings-sidebar a:hover { border-color: rgba(121, 40, 143, .32); background: var(--hover-bg); }
.settings-sidebar a > .lucide { width: 20px; height: 20px; margin-top: 2px; color: var(--link); }
.settings-sidebar a > span { display: grid; gap: 2px; }

.assistant-panel { position: fixed; z-index: 70; right: 20px; bottom: 20px; width: min(380px, calc(100vw - 32px)); padding: 18px; border: 1px solid var(--panel-border); border-radius: 14px; background: var(--panel-bg); color: var(--ink); box-shadow: 0 18px 50px #2d0d3636; }
.assistant-panel header, .utility-panel header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.assistant-panel h2, .utility-panel h2 { margin: 0; font-size: 1.25rem; }
.assistant-panel .small { margin: 3px 0 0; }
.assistant-conversation { max-height: 200px; margin: 16px 0 12px; overflow: auto; }
.assistant-message { margin: 0 0 8px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); font-size: .86rem; }
.assistant-suggestions { display: flex; flex-wrap: wrap; gap: 7px; }
.assistant-suggestions button { padding: 6px 9px; border: 1px solid var(--line); border-radius: 999px; background: var(--control-bg); color: var(--link); font-size: .76rem; }
.assistant-form { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 14px; }
.assistant-form input, .utility-panel input { width: 100%; min-width: 0; min-height: 46px; padding: 10px 12px; border: 1px solid var(--field-border, #bcb4c4); border-radius: 10px; background: var(--field-bg, #fff); color: var(--ink); }
.assistant-form .btn { min-height: 46px; }

.overlay { position: fixed; z-index: 90; inset: 0; display: grid; place-items: center; padding: 24px; background: var(--overlay-bg); }
#command-palette { place-items: start center; padding: clamp(64px, 12vh, 140px) 18px 18px; background: #2d0d366e; }
.utility-panel { width: min(620px, 100%); padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 24px 64px #2d0d3640; }
.utility-panel input { margin-top: 16px; }
.utility-count { margin: 9px 0; color: var(--muted); font-size: .78rem; }
.command-result { display: grid; gap: 2px; width: 100%; padding: 11px 12px; border: 0; border-radius: 8px; background: transparent; color: var(--ink); text-align: left; }
.command-result:hover, .command-result[aria-selected=true] { background: var(--surface-2); }
.command-result small { font-size: .75rem; }
.utility-hint { margin: 14px 0 0; color: var(--muted); font-size: .74rem; }

/* Global search ("Explore") follows the active theme. */
.workspace-canvas { width: 100%; max-height: calc(100vh - 48px); overflow: auto; padding: 26px; border: 1px solid var(--panel-border); border-radius: 22px; background: var(--panel-bg); color: var(--ink); box-shadow: 0 24px 70px rgba(45, 13, 54, .28); scrollbar-width: thin; scrollbar-color: #943bad transparent; }
html[data-theme="dark"] .workspace-canvas { box-shadow: 0 24px 70px rgba(0, 0, 0, .5); scrollbar-color: #d86af1 #211629; }
.workspace-canvas .canvas-head { display: flex; justify-content: space-between; gap: 18px; }
.workspace-canvas h2 { margin-bottom: 8px; }
.workspace-canvas .canvas-head p:not(.eyebrow) { margin: 0; color: var(--muted); }
.workspace-canvas input { width: 100%; margin: 18px 0 8px; padding: 12px 14px; border: 1px solid var(--field-border); border-radius: 10px; background: var(--field-bg); color: var(--ink); }
.canvas-hint { color: var(--muted); }
.canvas-recents { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 20px 0; }
.canvas-recents > div > div { display: grid; }
.canvas-groups { display: grid; gap: 20px; }
.canvas-empty { color: var(--muted); }
.workspace-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.workspace-card { display: flex; gap: 10px; padding: 13px; border: 1px solid rgba(121, 40, 143, .14); border-radius: 12px; background: rgba(255, 255, 255, .72); color: var(--ink); text-decoration: none; }
.workspace-card:hover { border-color: rgba(121, 40, 143, .32); background: #fff; }
html[data-theme="dark"] .workspace-card { border-color: rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .08); }
html[data-theme="dark"] .workspace-card:hover { background: rgba(255, 255, 255, .16); }
.workspace-card small { display: block; color: var(--muted); }
.workspace-card__icon { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; border-radius: 8px; background: var(--brand-50); color: var(--brand-600); }
html[data-theme="dark"] .workspace-card__icon { background: rgba(232, 156, 255, .2); color: #f0c9ff; }
.workspace-card__icon .lucide { width: 16px; height: 16px; }

.workspace-action { width: min(460px, 100%); padding: 24px; border: 1px solid #ffffff35; border-radius: 20px; background: linear-gradient(135deg, #211629f2, #0f0b14f2); color: #fff; box-shadow: inset 0 1px #ffffff22, 0 28px 70px #0000008c; }
.workspace-action h2 { margin: 0 0 8px; }
.workspace-action__copy { margin: 0 0 20px; color: #ded2e2; }
.workspace-action .row { justify-content: flex-end; }
.workspace-action .btn { min-width: 100px; }
.workspace-action .btn:not(.btn--primary) { border-color: #ffffff38; background: #ffffff14; color: #fff; }

#workspace-detail { place-items: stretch end; padding: 12px; }
.workspace-drawer { width: min(510px, calc(100vw - 24px)); overflow: auto; padding: 24px; border: 1px solid #ffffff38; border-radius: 22px; background: linear-gradient(145deg, #1d1425f5, #0c0911f7); color: #fff; box-shadow: -20px 0 54px #00000061, inset 0 1px #ffffff20; --ink: #fff; --muted: #d7c7dd; }
.workspace-drawer header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid #ffffff20; }
.workspace-drawer .icon-button { border-color: #ffffff38; background: #ffffff14; color: #fff; }
.workspace-drawer h2 { margin: 0; }
.workspace-drawer h3 { margin: 0; font-size: 1rem; }
.workspace-drawer p { color: #e0d5e4; }
.workspace-drawer__body { display: grid; gap: 16px; padding-top: 18px; }
.workspace-drawer .btn:not(.btn--primary):not(.btn--danger) { border-color: #ffffff38; background: #ffffff14; color: #fff; }
.workspace-drawer .field input, .workspace-drawer .field select { border-color: #ffffff35; background: #07050acc; color: #fff; }
.workspace-drawer .field select option { background: #160d1d; color: #fff; }
.drawer-stat { display: grid; gap: 3px; padding: 14px; border: 1px solid #ffffff24; border-radius: 14px; background: #ffffff0c; }
.drawer-stat span { color: #d7c7dd; font-size: .84rem; }
.drawer-list, .resource-links, .variable-output, .prospect-list, .export-options, .column-controls { display: grid; gap: 8px; }
.drawer-link { display: flex; align-items: center; gap: 8px; padding: 11px; border: 1px solid #ffffff22; border-radius: 10px; background: #ffffff0b; color: #f4eafa; text-align: left; text-decoration: none; }
.drawer-actions, .filter-row { display: flex; flex-wrap: wrap; gap: 9px; }
.permission-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.permission-grid span, .variable-output span { display: grid; gap: 2px; padding: 10px; border-radius: 10px; background: #ffffff0c; color: #d4c5da; font-size: .78rem; }
.template-preview, .transcript { padding: 14px; border: 1px solid #ffffff21; border-radius: 14px; background: #ffffff0b; }
.template-preview p:last-child, .transcript p:last-child { margin-bottom: 0; }
.transcript strong { color: #e89cff; }
.live-dot { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: #d96af1; box-shadow: 0 0 0 4px #d96af125; }
.call-live { padding: 12px; border-radius: 12px; background: #77278f28; }
.export-options label, .column-controls > label { padding: 10px; border: 1px solid #ffffff24; border-radius: 10px; background: #ffffff0b; }
.column-controls > div { display: flex; gap: 7px; margin: -3px 0 5px; }
.prospect-list > div { display: grid; gap: 2px; padding: 10px; border: 1px solid #ffffff20; border-radius: 10px; background: #ffffff09; }
.prospect-list span { color: #d5c7dc; font-size: .8rem; }
.drawer-tabs { display: flex; gap: 7px; border-bottom: 1px solid #ffffff25; }
.drawer-tabs button { padding: 7px 10px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #d8cadd; }
.drawer-tabs button.is-active { border-color: #d96af1; color: #fff; }

/* ==========================================================================
   Workspace content: one glass language, taken from the dashboard
   ========================================================================== */
.main-content { display: grid; align-content: start; gap: 18px; width: 100%; max-width: 1500px; padding: 34px clamp(22px, 4vw, 58px) 72px; color: var(--ink); }
.main-content:focus { outline: 0; }
.main-content > * { min-width: 0; margin: 0; }
.main-content h1, .main-content h2, .main-content h3, .main-content strong, .main-content label { color: var(--ink); }
.main-content p, .main-content small, .main-content .small, .main-content .muted { color: var(--muted); }
.main-content .card p, .main-content .card li, .main-content .notice, .main-content .card label { color: var(--ink); }
.main-content .card small { color: var(--muted); }
.main-content a:not(.btn) { color: var(--link); }

.main-content .card, .main-content .dashboard-panel, .main-content .table-wrap, .page-heading, .voice-ledger, .campaign-card, .results-toolbar, .main-content > p, .main-content > .field {
  position: relative; isolation: isolate;
  border: 1px solid var(--glass-border); border-radius: 18px;
  background: var(--glass-bg); box-shadow: var(--glass-shadow);
}
.landing .table-wrap { border-radius: 12px; }
.main-content .card, .main-content .dashboard-panel { overflow: hidden; }
.main-content .card::after, .main-content .dashboard-panel::after { content: ""; position: absolute; z-index: -1; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(115deg, rgba(255, 255, 255, .38), transparent 24%, transparent 72%, rgba(162, 72, 191, .1)); }
html[data-theme="dark"] .main-content .card::after, html[data-theme="dark"] .main-content .dashboard-panel::after { background: linear-gradient(135deg, #ffffff0c, transparent 36%, #b62fda08); }
.main-content > p, .main-content > .field { padding: 16px 18px; }
.main-content > .field { max-width: 520px; }
.main-content > .btn { justify-self: start; }
.main-content > .table-wrap { overflow: auto; }
.main-content .grid { gap: 18px; }
.main-content .grid > .card { height: 100%; }
.main-content .grid > .card h2 { margin-bottom: 14px; }
.main-content .grid > .card h3 { margin-bottom: 8px; }
.main-content .card .btn, .main-content .card > .row:last-child { margin-top: 8px; }
.main-content .card > .btn + .btn { margin-left: 6px; }
.main-content .card .field { margin-bottom: 12px; }
.main-content .grid .card .card { box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .7); }

.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; padding: 22px 24px; }
.page-heading h1 { margin: 3px 0 9px; font-size: clamp(2.15rem, 3.5vw, 3.35rem); letter-spacing: -.055em; }
.page-heading__brief { max-width: 650px; margin: 0; color: var(--muted); }
.page-heading .row { flex-wrap: nowrap; }
.page-heading .eyebrow { color: var(--ink); }

.main-content .btn:not(.btn--primary):not(.btn--danger) { border-color: var(--control-border); background: var(--control-bg); color: var(--ink); }
.main-content .btn--primary { border-color: var(--brand-500); background: var(--brand-500); }
html[data-theme="dark"] .main-content .btn--primary { border-color: #e5a5f5aa; background: #8b2da8d9; }
html[data-theme="dark"] .main-content .btn--primary:hover { background: #a340bc; }
.main-content .field input, .main-content .field select, .main-content .field textarea { border-color: var(--field-border); background: var(--field-bg); color: var(--ink); }
html[data-theme="dark"] .main-content .field select option { background: #170d1b; color: #fff; }
html[data-theme="dark"] .main-content .field input::placeholder, html[data-theme="dark"] .main-content .field textarea::placeholder { color: #cbbdd1; }
.main-content .table { color: var(--ink); }
.main-content .table th { background: rgba(255, 255, 255, .45); color: var(--muted); }
html[data-theme="dark"] .main-content .table th { background: rgba(255, 255, 255, .08); }
.main-content .table th, .main-content .table td { border-color: var(--line); }
.main-content .table tbody tr { transition: background .16s ease; }
.main-content .table tbody tr:hover td { background: var(--hover-bg); }
.main-content .notice { border-color: rgba(171, 89, 196, .3); background: rgba(248, 236, 252, .9); box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .8); }
html[data-theme="dark"] .main-content .notice { border-color: rgba(215, 123, 237, .45); background: rgba(66, 17, 79, .7); box-shadow: none; }
.main-content .status .lucide, .main-content .card p > .lucide { width: 1em; height: 1em; }
html[data-theme="dark"] .main-content .badge, html[data-theme="dark"] .main-content .status { border: 1px solid #ffffff24; background: rgba(255, 255, 255, .12); color: var(--ink); }
.main-content .progress, .main-content .tiny-progress { background: rgba(119, 39, 143, .14); }
.main-content .progress span { background: linear-gradient(90deg, #8f2eaa, #c76be0); }
html[data-theme="dark"] .main-content .progress, html[data-theme="dark"] .main-content .tiny-progress { background: #ffffff1f; }
html[data-theme="dark"] .main-content .progress span { background: linear-gradient(90deg, #8f2eaa, #e795fa); }
.main-content .empty, .main-content .loading, .main-content .error { border-color: var(--field-border); background: var(--control-bg); color: var(--ink); }
.main-content .error { color: #b4233d; }
html[data-theme="dark"] .main-content .error { color: #ffb3c0; }
.main-content .modal__dialog { border: 1px solid var(--panel-border); background: var(--panel-bg); color: var(--ink); }
.main-content [data-tabs] [role=tab] { color: var(--muted); }
.main-content [data-tabs] [role=tab][aria-selected=true] { color: var(--ink); }
.main-content code { padding: 1px 5px; border-radius: 5px; background: var(--hover-bg); }
.main-content ul { padding-left: 20px; }
.main-content progress { accent-color: var(--brand-500); }

.is-inspectable, .is-agent-entry { cursor: pointer; }
.main-content .table tr.is-inspectable:hover td, .main-content .table tr.is-agent-entry:hover td { background: rgba(119, 39, 143, .14); }
.main-content .table tr.is-agent-entry:focus-visible { outline: 2px solid #e795fa; outline-offset: -3px; }
.segmented-actions, .telephony-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.segmented-actions .badge { margin-right: 4px; }
.main-content .canvas { border-radius: 18px; background-color: rgba(255, 255, 255, .5); }
html[data-theme="dark"] .main-content .canvas { background-color: rgba(10, 6, 13, .55); background-image: radial-gradient(#ffffff2a 1px, transparent 1px); }
html[data-theme="dark"] .main-content .node { border-color: rgba(255, 255, 255, .2); background: rgba(24, 15, 30, .92); }

/* Dashboard */
.dashboard { max-width: 1440px; }
.dashboard .page-heading { margin-bottom: 8px; }
.voice-ledger { display: grid; grid-template-columns: minmax(290px, .8fr) minmax(360px, 1.2fr); align-items: center; gap: 36px; padding: 25px 22px 28px; }
.voice-ledger h2, .panel-heading h2, .next-panel h2, .channel-panel h2 { margin: 0 0 9px; font-size: 1.45rem; letter-spacing: -.04em; }
.voice-ledger__copy p:not(.eyebrow) { max-width: 410px; margin: 0 0 14px; }
.voice-ledger a, .panel-heading a, .channel-panel > a { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; text-decoration: none; }
.pulse-chart { padding-left: 28px; border-left: 1px solid var(--line); }
.pulse-chart__meta { display: flex; justify-content: space-between; margin-bottom: 5px; color: var(--muted); font-size: .82rem; }
.pulse-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.pulse-chart__area { fill: #77278f12; }
.pulse-chart__line { fill: none; stroke: var(--brand-500); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.pulse-chart circle { fill: var(--brand-500); stroke: #fff; stroke-width: 3; }
html[data-theme="dark"] .pulse-chart__line { stroke: #d870ef; }
html[data-theme="dark"] .pulse-chart__area { fill: #d870ef24; }
html[data-theme="dark"] .pulse-chart circle { fill: #e89aff; stroke: #190d20; }
.pulse-chart__axis { display: flex; justify-content: space-between; color: var(--muted); font-size: .7rem; }
.metric-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.metric-strip article { min-width: 0; padding: 19px 20px; border: 1px solid var(--glass-border); border-radius: 16px; background: var(--glass-bg); box-shadow: var(--glass-shadow); }
.metric-strip p { margin: 0 0 4px; font-size: .8rem; }
.metric-strip strong { display: block; font-size: 1.75rem; line-height: 1.1; letter-spacing: -.05em; }
.metric-strip small { display: block; margin-top: 7px; }
.metric-strip article:nth-child(2) small { color: var(--link); font-weight: 650; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr); gap: 18px; }
.dashboard-panel { padding: 22px; }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.panel-heading h2 { margin-bottom: 0; }
.panel-heading > a { font-size: .82rem; white-space: nowrap; }
.agent-list, .campaign-table { border-top: 1px solid var(--line); }
.agent-row { display: grid; grid-template-columns: 38px minmax(150px, 1fr) 70px 48px 32px; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.agent-row:last-child, .campaign-row:last-child { border-bottom: 0; }
.agent-row > div { display: grid; gap: 2px; }
.agent-row strong { font-size: .9rem; }
.agent-row small { font-size: .72rem; }
.agent-mark { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--brand-500); color: #fff; font-size: .68rem; font-weight: 800; }
.agent-mark--soft { background: #e9d8ee; color: var(--brand-700); }
.agent-mark--quiet { background: #eceaeb; color: #625b64; }
.agent-status, .channel-state, .status-pill { font-size: .7rem; font-weight: 750; }
.agent-status { color: var(--muted); }
.agent-status.is-live, .channel-state, .status-pill { color: var(--link); }
.agent-status.is-live::before, .channel-state::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 99px; background: var(--brand-500); }
.agent-count { text-align: right; font-variant-numeric: tabular-nums; }
.next-panel { display: flex; flex-direction: column; align-items: flex-start; }
html[data-theme="dark"] .main-content .next-panel { background: rgba(37, 9, 46, .9); }
.next-panel p:not(.eyebrow):not(.small) { margin: 0 0 21px; }
.main-content .next-panel .btn--primary { margin-top: auto; border-color: #fff; background: #fff; color: var(--brand-700); }
.setup-progress { width: 100%; height: 5px; margin-top: auto; overflow: hidden; border-radius: 9px; background: rgba(119, 39, 143, .16); }
.setup-progress span { display: block; width: 60%; height: 100%; border-radius: inherit; background: var(--brand-500); }
html[data-theme="dark"] .setup-progress { background: #ffffff35; }
html[data-theme="dark"] .setup-progress span { background: #fff; }
.next-panel .small { margin: 8px 0 18px; }
.campaign-row { display: grid; grid-template-columns: minmax(160px, 1.35fr) minmax(150px, 1fr) 80px; align-items: center; gap: 22px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.campaign-row--head { padding: 9px 0; color: var(--muted); font-size: .7rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.campaign-row > div { display: grid; gap: 4px; }
.campaign-row strong { font-size: .86rem; }
.campaign-row small { font-size: .72rem; }
.tiny-progress { height: 4px; overflow: hidden; border-radius: 5px; }
.tiny-progress span { display: block; height: 100%; border-radius: inherit; background: var(--brand-500); }
.status-pill::before { content: "●"; margin-right: 5px; font-size: .55rem; }
.main-content .status-pill--quiet { color: var(--muted); }
.channel-panel { display: flex; flex-direction: column; }
.channel-row { display: grid; grid-template-columns: 30px 1fr auto; align-items: center; gap: 10px; padding: 12px 0; border-top: 1px solid var(--line); }
.channel-row:first-of-type { margin-top: 6px; }
.channel-symbol { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--line); border-radius: 50%; color: var(--link); }
.channel-symbol .lucide { width: 14px; height: 14px; }
.channel-row div { display: grid; gap: 2px; }
.channel-row strong { font-size: .8rem; }
.channel-row small { font-size: .7rem; }
.channel-state { font-size: .68rem; }
.channel-panel > a { margin-top: auto; padding-top: 16px; font-size: .82rem; }

/* Campaigns board and call results toolbar */
.campaign-board { display: grid; gap: 16px; }
.campaign-board__head { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding: 2px 2px 0; }
.campaign-board__head h2 { margin: 0; }
.campaign-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.campaign-filter button { padding: 7px 11px; border: 1px solid var(--control-border); border-radius: 999px; background: var(--control-bg); color: var(--ink); }
.campaign-filter button.is-active { border-color: var(--brand-500); background: var(--brand-500); color: #fff; }
.campaign-filter span { padding: 1px 5px; border-radius: 99px; background: rgba(119, 39, 143, .14); font-size: .75rem; }
.campaign-filter button.is-active span { background: #ffffff30; }
.campaign-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.campaign-card { display: grid; gap: 15px; min-height: 210px; padding: 18px; }
.campaign-card__top, .campaign-card__foot { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.campaign-card h3 { margin: 0; font-size: 1rem; }
.campaign-card p { margin: 3px 0 0; font-size: .8rem; }
.campaign-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.campaign-stats span { padding: 9px; border-radius: 10px; background: var(--hover-bg); color: var(--muted); font-size: .74rem; }
.campaign-stats strong { display: block; font-size: 1rem; }
.campaign-card__foot { align-items: center; margin-top: auto; }
.results-toolbar { display: grid; grid-template-columns: 1fr auto auto auto; gap: 9px; padding: 12px; border-radius: 15px; }
.results-toolbar .field { display: block; }
.results-toolbar .field input { min-height: 38px; }

/* Entrance motion for workspace screens. */
.main-content > .card, .main-content > .grid, .main-content > .table-wrap { animation: signal-settle .28s ease both; }
@keyframes signal-settle { from { opacity: .75; transform: translateY(5px); } to { opacity: 1; transform: none; } }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 900px) {
  .app-shell, .app-shell.is-sidebar-collapsed { grid-template-columns: 1fr; }
  .sidebar { position: fixed; z-index: 60; inset: 12px auto 12px 12px; width: 280px; height: auto; margin: 0; transform: translateX(-110%); transition: transform .25s; }
  .sidebar.is-open { transform: translateX(0); }
  .sidebar { background: linear-gradient(160deg, #f8e6fd, #ead0f5 58%, #dcb3ec); }
  html[data-theme="dark"] .sidebar { background: #2d0d36; }
  .hero { grid-template-columns: 1fr; }
  .sidebar-collapse { display: none; }
  .sidebar.is-collapsed { padding-inline: 14px; }
  .sidebar-toggle { display: inline-flex; flex: 0 0 auto; }
  .drawer-backdrop.is-open { display: block; position: fixed; z-index: 55; inset: 0; border: 0; background: #130c1880; }
  .shell-main { padding-top: 74px; }
  .topbar, .app-shell.is-sidebar-collapsed .topbar { top: 8px; left: 8px; right: 8px; padding: 0 16px; }
  .main-content { padding: 24px 20px 64px; }
  .page-heading, .voice-ledger { display: grid; grid-template-columns: 1fr; }
  .page-heading { align-items: start; }
  .pulse-chart { padding: 18px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .next-panel { min-height: 260px; }
  .metric-strip { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .campaign-cards { grid-template-columns: 1fr 1fr; }
  .results-toolbar { grid-template-columns: 1fr 1fr; }
  .results-toolbar .field { grid-column: 1 / -1; }
}
@media (max-width: 800px) {
  body[data-layout="auth"] { padding: 0; background: #fff; }
  .auth { grid-template-columns: 1fr; min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; }
  .auth__brand { align-items: center; min-height: 240px; padding: 30px 24px 10px; }
  .auth__brand > img { left: 24px; top: 22px; width: 108px; }
  .auth__brand > div { display: grid; grid-template-columns: 150px 1fr; align-items: center; max-width: 520px; text-align: left; }
  .auth__brand .mascot { width: 155px; margin: 12px 0 -26px; }
  .auth__brand h2 { margin: 0; font-size: 1.3rem; }
  .auth__brand p { font-size: .86rem; }
  .auth__brand::after { display: none; }
  .auth__form { max-width: 560px; padding: 38px 24px; }
}
@media (max-width: 700px) {
  .canvas-recents, .workspace-grid { grid-template-columns: 1fr; }
  .workspace-canvas { padding: 18px; }
}
@media (max-width: 600px) {
  .page-wrap { padding: 20px 16px; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .main-content .grid[style*="330px"] { grid-template-columns: minmax(0, 1fr) !important; }
  .main-content { gap: 14px; padding: 20px 16px 64px; }
  .main-content > p, .main-content > .field { padding: 14px; }
  .page-heading { gap: 14px; padding: 16px; }
  .page-heading h1 { font-size: 2.25rem; }
  .page-heading .row { width: 100%; }
  .page-heading .btn { flex: 1; }
  .voice-ledger { gap: 22px; padding: 20px 16px; }
  .metric-strip strong { font-size: 1.4rem; }
  .dashboard-panel { padding: 18px; }
  .agent-row { grid-template-columns: 34px minmax(120px, 1fr) auto; gap: 9px; }
  .agent-row .agent-status, .agent-row .agent-count, .agent-row > small:last-child { display: none; }
  .campaign-row { grid-template-columns: 1fr auto; gap: 10px; }
  .campaign-row > div:nth-child(2), .campaign-row--head span:nth-child(2) { display: none; }
  .channel-row { grid-template-columns: 30px 1fr; }
  .channel-state { display: none; }
  .canvas { min-height: 460px; }
  .topbar { gap: 8px; height: 58px; padding: 0 10px; }
  .topbar-actions { gap: 7px; }
  .agent-assistant-trigger { padding-inline: 9px; }
  .profile-menu-layer { top: 72px; right: 12px; }
  .assistant-panel { right: 16px; bottom: 16px; }
  .utility-panel { padding: 16px; }
  .workspace-drawer { width: 100%; padding: 18px; border-radius: 18px; }
  #workspace-detail { padding: 8px; }
  .workspace-action { padding: 20px; }
  .workspace-action .row { display: grid; grid-template-columns: 1fr 1fr; }
  .workspace-action .btn { width: 100%; }
  .campaign-board__head, .campaign-card__top { flex-direction: column; align-items: flex-start; }
  .campaign-cards, .results-toolbar { grid-template-columns: 1fr; }
  .results-toolbar .field { grid-column: auto; }
  .permission-grid { grid-template-columns: 1fr 1fr; }
  .segmented-actions, .telephony-actions { align-items: stretch; }
  .segmented-actions .badge { width: 100%; margin-right: 0; }
  .segmented-actions .btn, .telephony-actions .btn { flex: 1 1 180px; }
  .row--mobile-stack { flex-direction: column; align-items: stretch; }
}
@media (max-width: 420px) {
  .auth__brand { min-height: 190px; }
  .auth__brand > div { grid-template-columns: 112px 1fr; }
  .auth__brand .mascot { width: 118px; }
  .auth__brand h2 { font-size: 1.1rem; }
  .auth__form { padding: 30px 19px; }
  .auth__form > .row:nth-child(2) { gap: 6px; }
  .auth__form > .row:nth-child(2) .btn { font-size: .72rem; }
  .auth__form h1 { font-size: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
