/* EditHouse "aurora glass" layer: violet palette, floating panes, centred hero, bento layout, 3D depth.
   Loaded after app.css / site.css. Delete this file and its two tags to fall back to the plain dark theme. */
:root {
  --g-bg: #050b0e;
  --pc: 20, 209, 176; --pc2: 13, 148, 136; --pc3: 94, 234, 212; --pc4: 56, 189, 248; --pc5: 167, 243, 232; --pc6: 110, 231, 183;
  --h1: #2adfbf; --h2: #0fa88f; --on-accent: #032a24;
  --v1: rgb(var(--pc)); --v2: rgb(var(--pc3)); --v3: rgb(var(--pc5)); --v4: rgb(var(--pc4)); --pink: rgb(var(--pc6));
  --g-fill: rgba(255, 255, 255, .05);
  --g-edge: rgba(var(--pc5), .16);
  --g-blur: blur(26px) saturate(150%);
  --g-shadow: 0 30px 80px rgba(1, 8, 12, .55), inset 0 1px 0 rgba(255, 255, 255, .14);
  --g-ease: cubic-bezier(.2, .8, .2, 1);
  --radius: 18px; --radius-sm: 12px;
  --panel: rgba(28, 22, 52, .5); --panel-2: rgba(255, 255, 255, .06); --raise: rgba(255, 255, 255, .08);
  --line: rgba(var(--pc5), .13); --line-2: rgba(var(--pc5), .22);
}
html { background: var(--g-bg); }
body, body.site { background: transparent; letter-spacing: -.005em; }

/* ---------- aurora: slow violet ribbons of light ---------- */
body::before {
  content: ""; position: fixed; inset: -20%; z-index: -2; pointer-events: none;
  background:
    radial-gradient(40% 34% at 22% 12%, rgba(var(--pc), .42), transparent 70%),
    radial-gradient(36% 32% at 82% 22%, rgba(var(--pc4), .32), transparent 70%),
    radial-gradient(44% 36% at 60% 96%, rgba(var(--pc6), .16), transparent 70%);
  filter: blur(30px); animation: g-aurora 40s ease-in-out infinite alternate; will-change: transform;
}
@keyframes g-aurora {
  0% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
  100% { transform: translate3d(4%, 3%, 0) rotate(6deg) scale(1.12); }
}
body::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .045; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }

/* ---------- type: crisp sans, tight tracking, lilac highlight ---------- */
.hero h1, .section-title, .page-head h1, .cta-band h2, .honest h2, .auth-pitch h1, .auth-card h2 {
  font-family: var(--serif); font-weight: 650; letter-spacing: -.035em; }
.grad { font-style: normal; background: linear-gradient(100deg, var(--v3), var(--pink) 85%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.eyebrow { color: var(--v2); letter-spacing: .16em; }

/* ---------- glass panes ---------- */
.strip, .section.alt { background: transparent; border: 0; }
.steps li, .features article, .nope li, .price-card, .faq details, .cta-band, .panel, .auth-points li, .table-wrap, .price-notes li, .note {
  background: linear-gradient(155deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .03) 55%, rgba(255, 255, 255, .06)) !important;
  border: 1px solid var(--g-edge) !important; box-shadow: var(--g-shadow);
  backdrop-filter: var(--g-blur); -webkit-backdrop-filter: var(--g-blur);
  border-radius: 26px; position: relative;
}
.nope li, .price-notes li, .faq details, .auth-points li, .note { border-radius: 18px; }
.steps li::before, .features article::before, .price-card::before, .cta-band::before, .auth-card::before, .panel::before { /* rim light */
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; padding: 1px;
  background: linear-gradient(140deg, rgba(255, 255, 255, .42), rgba(255, 255, 255, 0) 34%, rgba(255, 255, 255, 0) 66%, rgba(var(--pc5), .3));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.price-card.featured { background: linear-gradient(155deg, rgba(var(--pc), .32), rgba(255, 255, 255, .04) 60%, rgba(var(--pc4), .14)) !important;
  border-color: rgba(var(--pc3), .55) !important; box-shadow: 0 40px 90px rgba(var(--pc), .28), inset 0 1px 0 rgba(255, 255, 255, .25); }
.price b { font-weight: 650; letter-spacing: -.04em; }
input, select, textarea { background: rgba(255, 255, 255, .05) !important; border-color: var(--g-edge) !important; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 12px; }
input:focus, select:focus, textarea:focus { border-color: var(--v2) !important; box-shadow: 0 0 0 4px rgba(var(--pc), .22); }
dialog { background: rgba(12, 26, 32, .7); border: 1px solid var(--g-edge); border-radius: 28px; backdrop-filter: blur(36px) saturate(160%); -webkit-backdrop-filter: blur(36px) saturate(160%);
  box-shadow: 0 60px 140px rgba(1, 8, 12, .7), inset 0 1px 0 rgba(255, 255, 255, .16); }
dialog::backdrop { background: radial-gradient(60% 60% at 50% 40%, rgba(var(--pc), .18), rgba(2, 8, 12, .78)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
dialog[open] { animation: g-pop .4s var(--g-ease) both; }
@keyframes g-pop { from { opacity: 0; transform: perspective(900px) translateY(24px) rotateX(10deg) scale(.95); } to { opacity: 1; transform: none; } }

/* ---------- pill buttons ---------- */
.btn { border-radius: 11px; padding: 0 18px; background: rgba(255, 255, 255, .07); border: 1px solid var(--g-edge);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
  transition: transform .18s var(--g-ease), box-shadow .18s, background .18s; }
.btn:hover { background: rgba(255, 255, 255, .12); transform: translateY(-2px); }
.btn.lg { padding: 0 28px; }
.btn.primary { background: linear-gradient(180deg, var(--h1), var(--h2)) !important; color: var(--on-accent); border: 1px solid rgba(255, 255, 255, .22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 10px 30px rgba(var(--pc2), .5), 0 0 0 4px rgba(var(--pc), .1); }
.btn.primary:hover { filter: brightness(1.1); transform: translateY(-3px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 16px 40px rgba(var(--pc2), .65), 0 0 0 4px rgba(var(--pc), .16); }
.btn.primary:active { transform: translateY(1px) scale(.98); }
.btn.ghost, .btn.link { background: transparent; box-shadow: none; border-color: transparent; backdrop-filter: none; }
.btn.small { padding: 0 12px; }
.badge { background: linear-gradient(180deg, var(--h1), var(--h2)); color: var(--on-accent); border-radius: 8px; padding: 3px 10px; box-shadow: 0 4px 14px rgba(var(--pc2), .5); }

/* ---------- landing: floating pill nav ---------- */
.site-nav { position: sticky; top: 14px; z-index: 30; width: min(1080px, calc(100% - 28px)); margin: 14px auto 0; border-radius: 999px;
  background: rgba(10, 22, 28, .5); border: 1px solid var(--g-edge); backdrop-filter: var(--g-blur); -webkit-backdrop-filter: var(--g-blur);
  box-shadow: 0 16px 50px rgba(1, 8, 12, .5), inset 0 1px 0 rgba(255, 255, 255, .14); }
.site-nav .wrap { padding: 0 12px 0 20px; }
.nav-row { height: 58px; }
.nav-links a { border-radius: 10px; }

/* ---------- landing: centred hero with the product floating below ---------- */
.hero { padding: 76px 0 36px; }
.hero-grid { grid-template-columns: 1fr; gap: 64px; text-align: center; perspective: 1700px; }
.hero-copy { display: flex; flex-direction: column; align-items: center; }
.hero h1 { font-size: clamp(40px, 6.4vw, 78px); line-height: 1.02; max-width: 15ch; }
.hero-lede { max-width: 60ch; font-size: 18px; }
.hero-actions { justify-content: center; }
.mock { width: min(880px, 100%); margin: 0 auto; transform-style: preserve-3d; position: relative; overflow: visible; border-radius: 30px;
  background: linear-gradient(155deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .03) 55%, rgba(255, 255, 255, .07)) !important;
  border: 1px solid rgba(var(--pc5), .28) !important; backdrop-filter: var(--g-blur); -webkit-backdrop-filter: var(--g-blur);
  box-shadow: 0 80px 140px rgba(1, 8, 12, .65), 0 0 120px rgba(var(--pc), .22), inset 0 1px 0 rgba(255, 255, 255, .3);
  transform: rotateX(var(--hrx, 9deg)) rotateY(var(--hry, 0deg)); transition: transform .4s var(--g-ease);
  animation: g-hero-in 1.4s var(--g-ease) both, g-float 8s ease-in-out 1.4s infinite; text-align: left; }
.mock.g-live { transition: transform .08s linear; animation: g-hero-in 1.4s var(--g-ease) both; }
@keyframes g-hero-in { from { opacity: 0; transform: rotateX(38deg) translateY(80px) translateZ(-260px) scale(.8); } }
@keyframes g-float { 50% { translate: 0 -12px; } }
.mock::before, .mock::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: -1;
  background: linear-gradient(155deg, rgba(var(--pc), .2), rgba(255, 255, 255, .02)); border: 1px solid var(--g-edge); }
.mock::before { transform: translate3d(0, 26px, -60px) scale(.94); opacity: .8; }
.mock::after { transform: translate3d(0, 52px, -130px) scale(.88); opacity: .5; }
.mock-bar { border-radius: 30px 30px 0 0; background: rgba(255, 255, 255, .05); }
.mock-body { transform-style: preserve-3d; padding: 24px; grid-template-columns: 1fr 1fr; align-items: start; }
.mock-prompt, .mock-chips { grid-column: 1 / -1; }
.mock-prompt { transform: translateZ(36px); background: rgba(4, 14, 18, .5); border-color: rgba(var(--pc3), .4); box-shadow: 0 18px 34px rgba(1, 8, 12, .45); border-radius: 14px; }
.mock-chips { transform: translateZ(22px); }
.mock-chips span { background: rgba(var(--pc), .18); border-color: rgba(var(--pc3), .4); color: var(--v3); border-radius: 999px; }
.mock-card { transform: translateZ(56px); border-radius: 18px; background: rgba(255, 255, 255, .09) !important; box-shadow: 0 30px 56px rgba(1, 8, 12, .5), inset 0 1px 0 rgba(255, 255, 255, .22); }
.mock-draft { transform: translateZ(30px); border-style: solid !important; border-radius: 18px; }
.mock-btn { background: linear-gradient(180deg, var(--h1), var(--h2)); color: var(--on-accent); border-radius: 9px; padding: 6px 14px; box-shadow: 0 8px 20px rgba(var(--pc2), .55), inset 0 1px 0 rgba(255, 255, 255, .45); }
.mock-avatar { background: linear-gradient(135deg, var(--v1), var(--pink)); color: var(--on-accent); border: 0; }
.mock-mail .dot { background: #7ee787; }
.mock-label { color: var(--v2); }

/* ---------- landing: promise strip as one glass rail ---------- */
.strip { border: 0; padding-block: 0; }
.strip .strip-row { margin-top: 28px; padding: 20px 28px; border-radius: 999px; background: rgba(255, 255, 255, .05); border: 1px solid var(--g-edge);
  backdrop-filter: var(--g-blur); -webkit-backdrop-filter: var(--g-blur); box-shadow: var(--g-shadow); }
.strip-row p { text-align: center; }
@media (max-width: 980px) { .strip .strip-row { border-radius: 28px; } }

/* ---------- landing: bento features ---------- */
.features { grid-template-columns: repeat(12, 1fr); gap: 18px; }
.features article { padding: 30px; }
.features article:nth-child(1) { grid-column: span 7; } .features article:nth-child(2) { grid-column: span 5; }
.features article:nth-child(3), .features article:nth-child(4), .features article:nth-child(5) { grid-column: span 4; }
.features article:nth-child(6) { grid-column: span 12; display: grid; grid-template-columns: auto 1fr; column-gap: 18px; align-items: center; }
.features article:nth-child(6) .f-icon { margin: 0; grid-row: span 2; }
.features article:nth-child(1), .features article:nth-child(2) { background: linear-gradient(155deg, rgba(var(--pc), .2), rgba(255, 255, 255, .03) 60%) !important; }
.features h3 { font-size: 18px; letter-spacing: -.02em; }
.f-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; font-size: 20px; color: var(--v3);
  background: rgba(var(--pc), .2); border: 1px solid rgba(var(--pc3), .4); box-shadow: 0 10px 24px rgba(var(--pc2), .35); transform: translateZ(30px); margin-bottom: 16px; }
.step-n { color: var(--v2); text-shadow: 0 6px 18px rgba(var(--pc), .8); font-size: 14px; transform: translateZ(26px); }
.steps li { padding: 30px; }
@media (max-width: 980px) { .features { grid-template-columns: 1fr 1fr; } .features article { grid-column: auto !important; } .features article:nth-child(6) { display: block; } }
@media (max-width: 720px) { .features { grid-template-columns: 1fr; } .hero-grid { gap: 40px; } .mock-body { grid-template-columns: 1fr; } }

.section-title { font-size: clamp(30px, 4vw, 48px); }
.cta-band { padding: 72px 28px; border-radius: 36px;
  background: linear-gradient(155deg, rgba(var(--pc), .34), rgba(var(--pc4), .12) 55%, rgba(255, 255, 255, .05)) !important; }

/* ---------- app: floating sidebar + pill topbar ---------- */
@media (min-width: 821px) {
  .shell { padding: 14px; gap: 14px; grid-template-columns: 268px minmax(0, 1fr); }
  aside { top: 14px; height: calc(100vh - 28px); border-radius: 28px; border: 1px solid var(--g-edge) !important; background: rgba(10, 22, 28, .52) !important;
    backdrop-filter: var(--g-blur); -webkit-backdrop-filter: var(--g-blur); box-shadow: var(--g-shadow); }
  .topbar { top: 14px; margin: 0 0 14px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--g-edge); height: 56px;
    background: rgba(10, 22, 28, .5) !important; backdrop-filter: var(--g-blur); -webkit-backdrop-filter: var(--g-blur); box-shadow: 0 14px 40px rgba(1, 8, 12, .4), inset 0 1px 0 rgba(255, 255, 255, .12); }
  main { padding: 0 6px 64px 0; }
}
.nav-item { border-radius: 12px; height: 40px; transition: background .2s, transform .2s var(--g-ease); }
.nav-item:hover { transform: translateX(3px); }
.nav-item[aria-current=page] { background: linear-gradient(135deg, rgba(var(--pc), .34), rgba(var(--pc), .1)); box-shadow: inset 0 0 0 1px rgba(var(--pc3), .4), 0 8px 24px rgba(var(--pc2), .2); }
.auth-screen { background: transparent; }
.auth-side { background: transparent !important; border-right: 1px solid var(--g-edge); }
.auth-card { padding: 38px 34px; border-radius: 32px; background: linear-gradient(155deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .03));
  border: 1px solid var(--g-edge); box-shadow: var(--g-shadow); backdrop-filter: var(--g-blur); -webkit-backdrop-filter: var(--g-blur); position: relative; }

/* ---------- 3D: cards lean toward the pointer (set by glass.js) ---------- */
.g-tilt { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateZ(0) !important; transform-style: preserve-3d;
  transition: transform .25s var(--g-ease), box-shadow .25s; position: relative; }
.g-tilt.g-live { transition: transform .06s linear, box-shadow .25s; box-shadow: 0 40px 80px rgba(1, 8, 12, .6), 0 0 50px rgba(var(--pc), .16), inset 0 1px 0 rgba(255, 255, 255, .22) !important; }
.g-tilt::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .25s;
  background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 0%), rgba(var(--pc5), .18), transparent 46%); }
.g-tilt.g-live::after { opacity: 1; }
.price b { display: inline-block; transform: translateZ(28px); }

/* ---------- scroll reveal ---------- */
.g-reveal { opacity: 0; transform: perspective(900px) translateY(40px) rotateX(12deg); transition: opacity .9s var(--g-ease), transform .9s var(--g-ease); transition-delay: var(--gd, 0s); }
.g-reveal.g-in { opacity: 1; transform: none; }

@supports not (backdrop-filter: blur(1px)) { :root { --panel: #0f1b21; } .steps li, .features article, .price-card, .panel { background: #12222a !important; } }
@media (prefers-reduced-motion: reduce) {
  body::before, .mock, .mock.g-live, dialog[open] { animation: none !important; }
  .mock, .g-tilt { transform: none !important; } .g-reveal { opacity: 1; transform: none; transition: none; }
}


/* ---------- logo: an E built from timeline tracks, with a playhead that scrubs ---------- */
.brand-mark { font-size: 0 !important; color: transparent !important; width: 34px !important; height: 34px !important; border-radius: 10px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22%3E%3Cstyle%3E.b%7Btransform-box:fill-box%3Btransform-origin:left center%3Banimation:grow .7s cubic-bezier%28.2,.8,.2,1%29 both%7D.b2%7Banimation-delay:.12s%7D.b3%7Banimation-delay:.24s%7D.p%7Banimation:scrub 3.4s cubic-bezier%28.45,0,.55,1%29 .9s infinite alternate%7D%40keyframes grow%7Bfrom%7Btransform:scaleX%280%29%7Dto%7Btransform:scaleX%281%29%7D%7D%40keyframes scrub%7Bfrom%7Btransform:translateX%280%29%7Dto%7Btransform:translateX%2811px%29%7D%7D%3C/style%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%2334e5c6%22/%3E%3Cstop offset=%221%22 stop-color=%22%230b8f7f%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22h%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23fff%22 stop-opacity=%22.38%22/%3E%3Cstop offset=%22.55%22 stop-color=%22%23fff%22 stop-opacity=%220%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width=%2232%22 height=%2232%22 rx=%229%22 fill=%22url%28%23g%29%22/%3E%3Crect width=%2232%22 height=%2232%22 rx=%229%22 fill=%22url%28%23h%29%22/%3E%3Crect x=%228%22 y=%228%22 width=%223.4%22 height=%2216%22 rx=%221.7%22 fill=%22%2304241f%22/%3E%3Crect class=%22b%22 x=%228%22 y=%228%22 width=%2216%22 height=%223.4%22 rx=%221.7%22 fill=%22%2304241f%22/%3E%3Crect class=%22b b2%22 x=%228%22 y=%2214.3%22 width=%2211%22 height=%223.4%22 rx=%221.7%22 fill=%22%2304241f%22/%3E%3Crect class=%22b b3%22 x=%228%22 y=%2220.6%22 width=%2216%22 height=%223.4%22 rx=%221.7%22 fill=%22%2304241f%22/%3E%3Cg class=%22p%22%3E%3Crect x=%2212%22 y=%225.2%22 width=%221.8%22 height=%2221.6%22 rx=%22.9%22 fill=%22%23fff%22/%3E%3Ccircle cx=%2212.9%22 cy=%225.2%22 r=%222.1%22 fill=%22%23fbbf24%22/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat !important; box-shadow: 0 6px 20px rgba(var(--pc2), .5) !important; transition: transform .3s cubic-bezier(.2,.8,.2,1); }
.brand:hover .brand-mark { transform: rotate(-6deg) scale(1.08); }

/* ---------- buttons: one radius, lighter glow, real states ---------- */
.btn, .nav-item { border-radius: 10px !important; }
.btn.primary { border: 0 !important; overflow: hidden; position: relative; isolation: isolate;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 1px 0 rgba(0, 0, 0, .25), 0 8px 20px rgba(var(--pc2), .32) !important; text-shadow: 0 1px 0 rgba(255, 255, 255, .25); }
.btn.primary:hover { transform: translateY(-1px) !important; filter: none !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 1px 0 rgba(0, 0, 0, .25), 0 12px 26px rgba(var(--pc2), .42) !important; }
.btn.primary:active { transform: translateY(1px) scale(.985) !important; box-shadow: inset 0 2px 4px rgba(0, 0, 0, .25), 0 3px 8px rgba(var(--pc2), .3) !important; }
.btn.primary::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .5) 50%, transparent 65%);
  transform: translateX(-120%); transition: transform .7s cubic-bezier(.2, .8, .2, 1); }
.btn.primary:hover::after { transform: translateX(120%); }
.btn:not(.primary):hover { border-color: rgba(var(--pc3), .45); }
.btn:focus-visible, .nav-item:focus-visible { outline: 2px solid rgba(var(--pc3), .9); outline-offset: 2px; }
.nav-item { position: relative; box-shadow: none !important; background: transparent; }
.nav-item:hover { background: rgba(255, 255, 255, .06); transform: translateX(2px); }
.nav-item[aria-current=page] { background: linear-gradient(90deg, rgba(var(--pc), .2), rgba(var(--pc), .04)) !important; color: #fff; }
.nav-item[aria-current=page]::before { content: ""; position: absolute; left: -14px; top: 9px; bottom: 9px; width: 3px; border-radius: 0 3px 3px 0;
  background: var(--h1); box-shadow: 0 0 12px rgba(var(--pc), .8); }
aside .btn.block { height: 40px; }

/* ---------- motion: everything arrives, nothing snaps ---------- */
@keyframes g-in-left { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
@keyframes g-rise { from { opacity: 0; transform: translateY(16px) scale(.985); } to { opacity: 1; transform: none; } }
aside .brand { animation: g-in-left .5s cubic-bezier(.2, .8, .2, 1) both; }
aside .btn.block { animation: g-in-left .5s .08s cubic-bezier(.2, .8, .2, 1) both; }
.side-nav > *, .side-section > *, .side-bottom > * { animation: g-in-left .5s cubic-bezier(.2, .8, .2, 1) both; }
.side-nav > :nth-child(1) { animation-delay: .14s; } .side-nav > :nth-child(2) { animation-delay: .2s; } .side-nav > :nth-child(3) { animation-delay: .26s; }
.side-section > * { animation-delay: .3s; } .side-bottom > * { animation-delay: .38s; }
main .panel, main .figure, main .card, main .lead { animation: g-rise .55s cubic-bezier(.2, .8, .2, 1) both; }
main .panel:nth-child(2), main .figure:nth-child(2) { animation-delay: .07s; } main .panel:nth-child(3), main .figure:nth-child(3) { animation-delay: .14s; }
main .panel:nth-child(4), main .figure:nth-child(4) { animation-delay: .21s; } main .panel:nth-child(n+5) { animation-delay: .28s; }
.dot.on { animation: g-pulse 2.4s ease-in-out infinite; }
@keyframes g-pulse { 50% { box-shadow: 0 0 0 6px rgba(var(--pc), 0); } }
.topbar .crumbs { animation: g-in-left .5s .1s both; }
@media (prefers-reduced-motion: reduce) { aside *, main * { animation: none !important; } .btn.primary::after { display: none; } .brand-mark { transition: none; } }

/* ---------- no flash on reload: hold a splash until the session check is done ---------- */
#bootSplash { display: none; position: fixed; inset: 0; z-index: 60; place-items: center; }
#bootSplash .brand-mark { width: 56px !important; height: 56px !important; border-radius: 16px !important; animation: g-boot 1.6s ease-in-out infinite; }
@keyframes g-boot { 50% { transform: scale(1.08); } }
.booting #bootSplash { display: grid; }
.booting #authView, .booting #appView { visibility: hidden; }
/* failsafe: if the script never finishes, show the page after 6s instead of staying blank */
.booting #authView { animation: g-unhide 0s 6s forwards; }
.booting #bootSplash { animation: g-hide 0s 6s forwards; }
@keyframes g-unhide { to { visibility: visible; } }
@keyframes g-hide { to { visibility: hidden; } }
