:root {
  --bg: #061116;
  --bg-deep: #030a0e;
  --panel: #0a1c23;
  --panel-soft: #0d242c;
  --line: rgba(135, 190, 197, .15);
  --line-bright: rgba(121, 228, 210, .34);
  --text: #f1f7f6;
  --muted: #8da7aa;
  --muted-2: #5f7b7f;
  --mint: #5de1c2;
  --cyan: #48bfee;
  --blue: #6577ff;
  --amber: #f5bd62;
  --rose: #fb778c;
  --display: "Segoe UI Variable Display", "Aptos Display", "Inter", "Segoe UI", sans-serif;
  --body: "Segoe UI Variable Text", "Aptos", "Inter", "Segoe UI", sans-serif;
  --mx: 50%;
  --my: 30%;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: #244b52 var(--bg-deep); }
body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at var(--mx) var(--my), rgba(63, 197, 176, .055), transparent 22rem),
    linear-gradient(180deg, #07151a 0%, var(--bg) 36%, var(--bg-deep) 100%);
  color: var(--text);
  font-family: var(--body);
  font-size: 16px;
  line-height: 1.6;
}
body::before {
  position: fixed;
  z-index: -2;
  inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.017) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.017) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, black, transparent 88%);
  content: "";
  pointer-events: none;
}
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
[hidden] { display: none!important; }
.sr-only { position: absolute!important; width: 1px!important; height: 1px!important; padding: 0!important; overflow: hidden!important; clip: rect(0,0,0,0)!important; white-space: nowrap!important; border: 0!important; }
.form-honeypot { position: absolute!important; left: -9999px!important; width: 1px!important; height: 1px!important; opacity: 0!important; pointer-events: none!important; }
.section-shell { width: min(1280px, calc(100% - 48px)); margin-inline: auto; }
.ambient {
  position: fixed;
  z-index: -3;
  width: 38vw;
  height: 38vw;
  border-radius: 50%;
  filter: blur(110px);
  opacity: .12;
  pointer-events: none;
  animation: ambientMove 18s ease-in-out infinite alternate;
}
.ambient-one { top: -20vw; right: -13vw; background: var(--mint); }
.ambient-two { bottom: -20vw; left: -16vw; background: var(--blue); animation-delay: -9s; }
.page-progress { position: fixed; z-index: 100; top: 0; right: 0; left: 0; height: 2px; background: rgba(255,255,255,.025); }
.page-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--mint), var(--cyan), var(--blue)); box-shadow: 0 0 14px var(--mint); }

.site-header {
  position: fixed;
  z-index: 50;
  top: 18px;
  left: 50%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  width: min(1280px, calc(100% - 36px));
  min-height: 68px;
  padding: 10px 12px 10px 20px;
  border: 1px solid transparent;
  border-radius: 20px;
  transform: translateX(-50%);
  transition: background .3s ease, border-color .3s ease, box-shadow .3s ease, top .3s ease;
  pointer-events: none;
}
.site-header .brand,
.site-header .site-nav a,
.site-header .menu-toggle,
.site-header .header-login { pointer-events: auto; }
.site-header.is-scrolled {
  top: 10px;
  border-color: var(--line);
  background: rgba(5, 17, 22, .78);
  box-shadow: 0 22px 64px rgba(0,0,0,.28);
  backdrop-filter: blur(22px) saturate(140%);
}
.brand { display: inline-flex; align-items: center; gap: 11px; width: max-content; }
.brand-mark {
  position: relative;
  display: grid;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(93, 225, 194, .28);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(93,225,194,.13), rgba(72,191,238,.05));
  box-shadow: inset 0 1px rgba(255,255,255,.05), 0 9px 30px rgba(55,206,183,.08);
  place-items: center;
}
.brand-mark b { color: var(--mint); font-family: var(--display); font-size: 19px; line-height: 1; }
.brand-mark i { position: absolute; top: 7px; right: 7px; width: 4px; height: 4px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 10px var(--amber); }
.brand-name { font-family: var(--display); font-size: 18px; font-weight: 700; letter-spacing: -.04em; }
.brand-name span { color: var(--mint); }
.site-nav { display: flex; align-items: center; justify-content: center; gap: clamp(20px, 3vw, 42px); }
.site-nav a { position: relative; color: #a3b7b9; font-size: 13px; font-weight: 600; transition: color .2s ease; }
.site-nav a::after { position: absolute; right: 0; bottom: -8px; left: 0; height: 1px; background: var(--mint); transform: scaleX(0); transform-origin: center; transition: transform .2s ease; content: ""; }
.site-nav a:hover { color: var(--text); }
.site-nav a:hover::after { transform: scaleX(1); }
.menu-toggle { display: none; }

.button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 0 20px;
  border: 1px solid var(--line);
  border-radius: 14px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -.01em;
  transition: transform .22s ease, filter .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.button:hover { transform: translateY(-2px); }
.button-quiet { min-height: 46px; background: rgba(14, 39, 47, .7); }
.button-quiet:hover { border-color: var(--line-bright); background: rgba(17, 48, 57, .9); }
.button-primary {
  border-color: rgba(97, 230, 200, .38);
  background: linear-gradient(135deg, #74e9cc, #4ec6db);
  color: #05211f;
  box-shadow: 0 16px 44px rgba(69, 209, 182, .16), inset 0 1px rgba(255,255,255,.55);
}
.button-primary:hover { filter: brightness(1.07); box-shadow: 0 22px 54px rgba(69, 209, 182, .24), inset 0 1px rgba(255,255,255,.55); }
.button-arrow { font-size: 17px; font-weight: 500; }

.hero {
  --hero-pointer-x: 72vw;
  --hero-pointer-y: 58%;
  --hero-shift-x: 0px;
  --hero-shift-y: 0px;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(520px, 1.18fr);
  align-items: center;
  gap: clamp(28px, 5vw, 84px);
  min-height: 100svh;
  padding-top: 120px;
  padding-bottom: 92px;
  isolation: isolate;
}
.hero::before {
  position: absolute;
  z-index: 0;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  background:
    radial-gradient(circle 330px at var(--hero-pointer-x) var(--hero-pointer-y), rgba(93,225,194,.075), transparent 72%),
    radial-gradient(circle 230px at calc(var(--hero-pointer-x) + 150px) calc(var(--hero-pointer-y) + 95px), rgba(101,119,255,.04), transparent 76%);
  content: "";
  pointer-events: none;
  transform: translateX(-50%);
}
.hero-copy { position: relative; z-index: 2; padding-bottom: 34px; }
.eyebrow { display: flex; align-items: center; gap: 11px; margin: 0 0 22px; color: var(--mint); font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.eyebrow > span { width: 28px; height: 1px; background: linear-gradient(90deg, var(--mint), transparent); }
.hero-ai-signature { display: inline-grid; grid-template-columns: 42px auto auto; align-items: center; gap: 12px; margin-bottom: 26px; padding: 7px 9px 7px 7px; border: 1px solid rgba(93,225,194,.2); border-radius: 15px; background: linear-gradient(105deg, rgba(17,55,58,.72), rgba(8,27,34,.42)); box-shadow: inset 0 1px rgba(255,255,255,.045), 0 14px 38px rgba(0,0,0,.14); backdrop-filter: blur(16px); }
.hero-ai-signature { visibility: hidden!important; pointer-events: none; }
.hero-ai-mark { display: grid; width: 42px; height: 42px; border: 1px solid rgba(118,237,211,.33); border-radius: 12px; background: radial-gradient(circle at 35% 26%, rgba(255,255,255,.75), rgba(93,225,194,.48) 8%, rgba(19,87,85,.72) 36%, #09232b 74%); box-shadow: 0 0 24px rgba(93,225,194,.16); color: white; font-family: var(--display); font-size: 16px; font-weight: 700; place-items: center; text-shadow: 0 0 12px var(--mint); }
.hero-ai-name { display: grid; gap: 1px; min-width: 0; padding-right: 8px; }
.hero-ai-name b { color: var(--mint); font-size: 8px; letter-spacing: .18em; }
.hero-ai-name small { color: #819a9c; font-size: 8px; white-space: nowrap; }
.hero-ai-live { display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-left: 1px solid var(--line); color: #638083; font-size: 6px; font-weight: 800; letter-spacing: .1em; }
.hero-ai-live i { width: 5px; height: 5px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 9px var(--mint); animation: pulseMint 2.2s ease-out infinite; }
.hero h1, .section-intro h2, .section-heading h2, .intelligence h2, .privacy h2, .final-cta h2 {
  margin: 0;
  font-family: var(--display);
  font-weight: 600;
  letter-spacing: -.065em;
  line-height: .97;
}
.hero h1 { max-width: 700px; font-size: clamp(54px, 6vw, 92px); }
.hero h1 > span, h2 em { color: var(--muted-2); font-style: normal; }
.hero-lead { max-width: 650px; margin: 28px 0 0; color: var(--muted); font-size: clamp(17px, 1.5vw, 21px); line-height: 1.62; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 38px; }
.hero-actions .button { min-height: 56px; padding-inline: 25px; border-radius: 16px; }
.text-link { display: inline-flex; align-items: center; gap: 12px; color: #c2d1d2; font-size: 13px; font-weight: 700; }
.text-link span { color: var(--mint); transition: transform .2s ease; }
.text-link:hover span { transform: translateY(4px); }
.hero-trust { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 34px; }
.hero-trust span { display: flex; align-items: center; gap: 8px; color: var(--muted-2); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.hero-trust i { width: 5px; height: 5px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 8px rgba(93,225,194,.7); }
.messenger-rail { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; width: min(590px,100%); margin-top: 22px; }
.messenger-link { display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 11px; min-height: 64px; padding: 10px 13px; border: 1px solid rgba(89,204,230,.2); border-radius: 16px; background: linear-gradient(135deg, rgba(28,127,174,.14), rgba(7,26,34,.82)); box-shadow: inset 0 1px rgba(255,255,255,.03); }
.messenger-link > i { display: grid; width: 38px; height: 38px; border-radius: 12px; background: rgba(255,255,255,.035); font-style: normal; place-items: center; }
.messenger-brand-icon img { display: block; width: 34px; height: 34px; object-fit: contain; }
.messenger-link > span { display: grid; gap: 2px; min-width: 0; }
.messenger-link small { color: #6592a1; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.messenger-link b { color: #d9f5fb; font-size: 12px; white-space: nowrap; }
.messenger-link em { color: #70c9df; font-size: 9px; font-style: normal; font-weight: 800; }
.messenger-telegram { transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.messenger-telegram:hover { border-color: rgba(86,207,234,.46); background: linear-gradient(135deg, rgba(28,127,174,.24), rgba(7,31,41,.92)); transform: translateY(-2px); }
.messenger-max { border-color: rgba(151,133,243,.13); background: linear-gradient(135deg, rgba(107,82,206,.08), rgba(7,26,34,.6)); opacity: .72; }
.messenger-max > i { background: rgba(112,71,255,.08); }
.messenger-max em { color: #9386d0; }
.platform-rail { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; width: min(620px,100%); margin-top: 9px; }
.platform-rail > span { display: grid; min-width: 0; grid-template-columns: 18px minmax(0,1fr); grid-template-rows: auto auto; column-gap: 7px; padding: 8px 9px; border: 1px solid rgba(117,139,145,.11); border-radius: 11px; background: rgba(7,24,30,.5); }
.platform-rail i { grid-row: 1/3; align-self: center; display: grid; width: 18px; height: 18px; border-radius: 6px; background: rgba(116,132,139,.1); color: #64757b; font-size: 8px; font-style: normal; place-items: center; }
.platform-rail b { color: #849399; font-size: 9px; line-height: 1.1; }
.platform-rail small { color: #4e5e64; font-size: 7px; line-height: 1.2; }
.platform-rail .is-ready { border-color: rgba(93,225,194,.13); }
.platform-rail .is-ready i { background: rgba(93,225,194,.12); color: #5de1c2; }
.platform-rail .is-ready b { color: #a9c8c3; }

.hero-visual { position: relative; z-index: 1; perspective: 1200px; }
.visual-halo { position: absolute; z-index: -1; inset: 9% 6%; border-radius: 50%; background: radial-gradient(circle, rgba(76, 219, 192, .18), rgba(65, 120, 255, .06) 44%, transparent 68%); filter: blur(20px); transform: translate3d(var(--hero-shift-x),var(--hero-shift-y),0); transition: transform .32s ease-out; }
.app-window {
  --scene-rgb: 93,225,194;
  --scene-accent: #5de1c2;
  --scene-accent-two: #48bfee;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(132, 198, 203, .22);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(14, 39, 48, .96), rgba(5, 18, 24, .97));
  box-shadow: 0 48px 120px rgba(0,0,0,.42), inset 0 1px rgba(255,255,255,.055);
  transform: rotateY(-4deg) rotateX(1deg);
  transform-origin: center;
  transition: transform .18s ease-out;
}
.app-window[data-hero-scene="finance"] { --scene-rgb: 139,156,255; --scene-accent: #8b9cff; --scene-accent-two: #65d9d0; }
.app-window[data-hero-scene="plans"] { --scene-rgb: 245,189,98; --scene-accent: #f5bd62; --scene-accent-two: #fb778c; }
.app-window::before { position: absolute; z-index: 2; inset: 0; border-radius: inherit; background: linear-gradient(120deg, rgba(255,255,255,.04), transparent 25%); content: ""; pointer-events: none; }
.app-topbar { display: flex; height: 56px; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid var(--line); background: rgba(3, 15, 21, .64); }
.mini-brand { display: flex; align-items: center; gap: 8px; color: #cbd9da; font-family: var(--display); font-size: 11px; font-weight: 700; }
.mini-brand span { width: 22px; height: 22px; border-radius: 7px; background: linear-gradient(135deg, var(--mint), var(--cyan)); box-shadow: 0 0 20px rgba(93,225,194,.25); }
.app-scene-tabs { display: flex; align-items: center; gap: 5px; padding: 3px; border: 1px solid rgba(119,168,174,.12); border-radius: 9px; background: rgba(10,31,38,.58); }
.app-scene-tabs button { display: grid; width: 23px; height: 20px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #536e72; cursor: pointer; font-size: 6px; font-weight: 900; place-items: center; transition: background .25s ease,color .25s ease,box-shadow .25s ease; }
.app-scene-tabs button.is-active { background: rgba(var(--scene-rgb),.16); color: var(--scene-accent); box-shadow: inset 0 0 0 1px rgba(var(--scene-rgb),.18),0 0 12px rgba(var(--scene-rgb),.08); }
.app-status { display: flex; align-items: center; gap: 7px; color: #739195; font-size: 8px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.app-status i { width: 5px; height: 5px; border-radius: 50%; background: var(--scene-accent); box-shadow: 0 0 7px var(--scene-accent); transition: background .3s ease,box-shadow .3s ease; }
.app-user { display: grid; width: 27px; height: 27px; border: 1px solid rgba(93,225,194,.25); border-radius: 9px; background: #12343b; color: var(--mint); font-size: 8px; font-weight: 800; place-items: center; }
.app-layout { display: grid; grid-template-columns: 54px minmax(0,1fr); }
.app-sidebar { display: flex; min-height: 470px; align-items: center; flex-direction: column; gap: 16px; padding-top: 23px; border-right: 1px solid var(--line); background: rgba(4, 18, 24, .64); }
.app-sidebar span { width: 18px; height: 18px; border-radius: 6px; background: #17323a; box-shadow: inset 0 0 0 1px rgba(151,200,205,.08); }
.app-sidebar span.is-active { background: linear-gradient(145deg, rgba(93,225,194,.4), rgba(72,191,238,.18)); box-shadow: 0 0 14px rgba(93,225,194,.13); }
.app-sidebar b { width: 16px; height: 1px; margin-top: auto; margin-bottom: 22px; background: #26424a; }
.app-content { min-width: 0; padding: 21px 21px 25px; opacity: 1; transform: translateY(0); transition: opacity .22s ease,transform .28s ease; }
.app-window.is-scene-changing .app-content { opacity: .12; transform: translateY(7px); }
.app-heading { display: flex; align-items: start; justify-content: space-between; }
.app-heading > div:first-child { display: grid; gap: 3px; }
.app-heading small { color: #607f84; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.app-heading strong { font-size: 15px; letter-spacing: -.035em; }
.pulse-label { display: flex; align-items: center; gap: 5px; color: #6c898d; font-size: 7px; font-weight: 800; }
.pulse-label i { width: 5px; height: 5px; border-radius: 50%; background: var(--rose); animation: pulse 1.8s ease-out infinite; }
.command-card { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 10px; margin-top: 17px; padding: 10px 12px; border: 1px solid rgba(var(--scene-rgb),.2); border-radius: 13px; background: linear-gradient(90deg, rgba(var(--scene-rgb),.15), rgba(10, 36, 43, .25)); transition: border-color .3s ease,background .3s ease; }
.command-orb { display: grid; width: 30px; height: 30px; border: 1px solid rgba(93,225,194,.28); border-radius: 50%; background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.8), var(--mint) 8%, rgba(29,106,100,.7) 34%, #071a20 72%); box-shadow: 0 0 16px rgba(93,225,194,.16); place-items: center; }
.command-orb span { width: 7px; height: 7px; border-radius: 50%; background: white; filter: blur(1px); opacity: .7; }
.command-card > div:nth-child(2) { display: grid; gap: 1px; }
.command-card small { color: var(--scene-accent); font-size: 6px; font-weight: 800; letter-spacing: .1em; transition: color .3s ease; }
.command-card p { margin: 0; color: #a6bdbe; font-size: 9px; }
.command-card kbd { padding: 4px 6px; border: 1px solid #2c5158; border-radius: 6px; background: #0a2229; color: #607f83; font-family: var(--body); font-size: 7px; }
.metric-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 10px; margin-top: 10px; }
.metric-card { min-width: 0; padding: 13px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(145deg, rgba(15,44,53,.76), rgba(7,27,34,.82)); }
.metric-card header, .metric-card footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.metric-card header span { color: #779397; font-size: 7px; font-weight: 700; text-transform: uppercase; }
.metric-card header b { color: var(--mint); font-size: 7px; }
.metric-card > strong { display: block; margin-top: 8px; font-family: var(--display); font-size: 18px; letter-spacing: -.04em; }
.sparkline { display: flex; height: 58px; align-items: end; gap: 5px; margin-top: 6px; padding-top: 6px; border-bottom: 1px solid rgba(93,225,194,.16); }
.sparkline i { flex: 1; height: var(--h); border-radius: 3px 3px 0 0; background: linear-gradient(to top, rgba(var(--scene-rgb),.12), var(--scene-accent)); transition: height .5s ease,background .3s ease; }
.metric-card footer { margin-top: 8px; color: #617f83; font-size: 6px; }
.metric-card footer span:last-child { color: #9fbdbe; }
.metric-time { display: grid; grid-template-rows: auto 1fr auto; }
.time-ring { display: grid; width: 88px; height: 88px; margin: 9px auto; border-radius: 50%; background: conic-gradient(var(--scene-accent-two) 0 var(--ring-progress,76%), rgba(95,146,153,.13) var(--ring-progress,76%)); place-items: center; transition: background .4s ease; }
.time-ring::before { grid-area: 1/1; width: 72px; height: 72px; border-radius: 50%; background: #0a2028; content: ""; }
.time-ring span { z-index: 1; grid-area: 1/1; display: grid; text-align: center; }
.time-ring strong { font-family: var(--display); font-size: 16px; line-height: 1; }
.time-ring small { margin-top: 4px; color: #67868a; font-size: 6px; text-transform: uppercase; }
.metric-payment > p { margin: 3px 0 15px; color: #6e8a8e; font-size: 7px; }
.metric-progress { height: 4px; overflow: hidden; border-radius: 99px; background: #15323a; }
.metric-progress span { display: block; width: 68%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--scene-accent-two), var(--scene-accent)); transition: width .55s ease,background .3s ease; }
.metric-home ul { display: grid; gap: 9px; margin: 12px 0 0; padding: 0; list-style: none; }
.metric-home li { display: flex; align-items: center; gap: 7px; color: #94abad; font-size: 7px; }
.metric-home li > span { width: 10px; height: 10px; border: 1px solid #315058; border-radius: 3px; }
.metric-home li.is-done { color: #57767a; text-decoration: line-through; }
.metric-home li.is-done > span { border-color: var(--mint); background: var(--mint); box-shadow: inset 0 0 0 2px #0b252c; }
.floating-note { position: absolute; display: flex; align-items: center; gap: 10px; border: 1px solid rgba(113,202,199,.2); border-radius: 13px; background: rgba(9, 30, 37, .9); box-shadow: 0 20px 50px rgba(0,0,0,.32); backdrop-filter: blur(16px); }
.note-one { right: -20px; bottom: 22%; padding: 10px 13px; animation: float 5s ease-in-out infinite; }
.note-one i { width: 24px; height: 24px; border-radius: 8px; background: linear-gradient(135deg, rgba(93,225,194,.28), rgba(72,191,238,.15)); }
.note-one span { color: #c9d8d9; font-size: 8px; font-weight: 700; }
.note-one small { display: block; color: #68868a; font-size: 6px; font-weight: 500; }
.note-two { bottom: -25px; left: 13%; padding: 10px 14px; animation: float 5.8s ease-in-out -2s infinite; }
.note-two b { color: var(--mint); font-family: var(--display); font-size: 14px; }
.note-two span { color: #6f8b8e; font-size: 6px; line-height: 1.3; }
.hero-foot { position: absolute; right: 0; bottom: 26px; left: 0; display: grid; grid-template-columns: auto auto 1fr; align-items: end; gap: 18px; }
.hero-foot > span { color: var(--mint); font-family: var(--display); font-size: 11px; }
.hero-foot p { margin: 0; color: #506e72; font-size: 10px; line-height: 1.45; text-transform: uppercase; }
.hero-line { height: 1px; margin-bottom: 5px; background: linear-gradient(90deg, var(--line-bright), transparent); }

.marquee { overflow: hidden; border-block: 1px solid rgba(133,189,195,.09); background: rgba(9, 27, 34, .48); }
.marquee-track { display: flex; width: max-content; align-items: center; gap: 28px; padding: 17px 0; animation: marquee 36s linear infinite; }
.marquee-track span { color: #47666a; font-family: var(--display); font-size: 10px; font-weight: 700; letter-spacing: .2em; }
.marquee-track i { width: 4px; height: 4px; border-radius: 50%; background: var(--mint); opacity: .5; }

.system-section { padding-top: 160px; padding-bottom: 150px; }
.section-intro { display: grid; grid-template-columns: 1.15fr .85fr; align-items: end; column-gap: 80px; }
.section-intro .eyebrow { grid-column: 1/-1; }
.section-intro h2, .section-heading h2, .intelligence h2, .privacy h2, .final-cta h2 { font-size: clamp(48px, 5.6vw, 82px); }
.section-intro > p:last-child, .section-heading > p, .intelligence-copy > p, .privacy-copy > p { max-width: 530px; margin: 0 0 8px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.system-stage { position: relative; display: grid; min-height: 820px; margin-top: 62px; perspective: 1300px; place-items: center; transform-style: preserve-3d; pointer-events: none; }
.system-stage::before { position: absolute; width: 72%; height: 72%; border-radius: 50%; background: radial-gradient(circle, rgba(62,199,178,.14), rgba(53,91,194,.045) 43%, transparent 69%); filter: blur(31px); content: ""; transition: transform .3s ease; pointer-events: none; }
.system-stage::after { position: absolute; width: min(1050px,92%); height: 520px; border-radius: 50%; background: radial-gradient(ellipse, transparent 42%, rgba(93,225,194,.035) 55%, transparent 70%); content: ""; pointer-events: none; }
.core-atmosphere { position: absolute; z-index: 1; inset: 0; overflow: hidden; border-radius: 50%; pointer-events: none; }
.core-atmosphere i { position: absolute; top: 50%; left: 50%; width: 3px; height: 3px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 12px var(--mint); opacity: 0; animation: dataParticle 6s linear infinite; }
.core-atmosphere i:nth-child(2) { animation-delay: -.8s; animation-duration: 7.2s; --particle-angle: 44deg; }
.core-atmosphere i:nth-child(3) { animation-delay: -1.6s; animation-duration: 5.5s; --particle-angle: 88deg; }
.core-atmosphere i:nth-child(4) { animation-delay: -2.4s; animation-duration: 8s; --particle-angle: 132deg; }
.core-atmosphere i:nth-child(5) { animation-delay: -3.2s; animation-duration: 6.7s; --particle-angle: 176deg; }
.core-atmosphere i:nth-child(6) { animation-delay: -4s; animation-duration: 7.6s; --particle-angle: 220deg; }
.core-atmosphere i:nth-child(7) { animation-delay: -4.8s; animation-duration: 5.9s; --particle-angle: 264deg; }
.core-atmosphere i:nth-child(8) { animation-delay: -5.6s; animation-duration: 7.9s; --particle-angle: 308deg; }
.orbit { position: absolute; z-index: 1; top: 50%; left: 50%; border: 1px solid rgba(120,176,183,.14); border-radius: 50%; translate: -50% -50%; pointer-events: none; }
.orbit::after { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 16px var(--mint); content: ""; }
.orbit-one { width: 280px; height: 280px; border-color: rgba(93,225,194,.2); animation: orbitSpin 22s linear infinite; }
.orbit-one::after { top: 34px; right: 32px; }
.orbit-two { width: 530px; height: 340px; border-style: dashed; animation: orbitSpin 52s linear infinite reverse; }
.orbit-two::after { right: 18px; bottom: 64px; width: 5px; height: 5px; background: var(--cyan); }
.orbit-three { width: 820px; height: 510px; border-color: rgba(116,133,255,.1); opacity: .8; animation: orbitSpin 76s linear infinite; }
.orbit-three::after { top: 24px; left: 185px; width: 4px; height: 4px; background: var(--blue); box-shadow: 0 0 14px var(--blue); }
.orbit-four { width: 1080px; height: 660px; border-color: rgba(118,181,188,.07); border-style: dashed; animation: orbitSpin 110s linear infinite reverse; }
.orbit-four::after { right: 112px; bottom: 94px; width: 4px; height: 4px; background: var(--amber); box-shadow: 0 0 14px var(--amber); }
.core-beam { position: absolute; z-index: 0; top: 50%; left: 50%; width: 76%; height: 1px; background: linear-gradient(90deg, transparent, rgba(93,225,194,.16), transparent); transform-origin: center; pointer-events: none; }
.beam-one { transform: translate(-50%,-50%) rotate(17deg); animation: beamSweep 15s ease-in-out infinite alternate; }
.beam-two { background: linear-gradient(90deg, transparent, rgba(98,119,255,.11), transparent); transform: translate(-50%,-50%) rotate(-38deg); animation: beamSweep 19s ease-in-out -8s infinite alternate-reverse; }
.core { position: absolute; z-index: 20; top: 50%; left: 50%; display: grid; width: 215px; height: 215px; align-content: center; overflow: hidden; border: 1px solid rgba(110,230,203,.36); border-radius: 50%; background: radial-gradient(circle at 38% 27%, rgba(194,255,240,.26), rgba(18,72,72,.72) 28%, rgba(5,23,29,.98) 70%); box-shadow: 0 0 105px rgba(61,205,177,.22), 0 0 0 16px rgba(93,225,194,.018), inset 0 0 42px rgba(93,225,194,.12); text-align: center; translate: -50% -50%; transition: transform .24s ease-out, box-shadow .25s ease; transform-style: preserve-3d; pointer-events: none; }
.core::before, .core::after { position: absolute; border: 1px solid rgba(93,225,194,.18); border-radius: 50%; content: ""; }
.core::before { inset: 10px; }
.core::after { inset: -11px; border-style: dashed; animation: orbitSpin 14s linear infinite reverse; }
.core-glow { position: absolute; top: 22px; left: 49px; width: 30px; height: 20px; border-radius: 50%; background: rgba(255,255,255,.55); filter: blur(11px); transform: rotate(-24deg); }
.core-scan { position: absolute; z-index: 0; top: -20%; right: 12%; bottom: -20%; left: 12%; background: linear-gradient(180deg, transparent 0 45%, rgba(93,225,194,.14) 49%, rgba(93,225,194,.45) 50%, rgba(93,225,194,.14) 51%, transparent 55%); animation: coreScan 4.5s ease-in-out infinite; }
.core-pulse { position: absolute; z-index: -1; inset: 22px; border: 1px solid rgba(93,225,194,.18); border-radius: 50%; animation: coreBreathe 3.2s ease-in-out infinite; }
.core > span, .core > strong, .core > small { position: relative; z-index: 2; }
.core span { color: var(--mint); font-size: 9px; font-weight: 800; letter-spacing: .2em; }
.core strong { font-family: var(--display); font-size: 31px; letter-spacing: -.05em; line-height: 1.1; }
.core small { margin-top: 6px; color: #537579; font-size: 7px; text-transform: uppercase; }
.core.is-pulsing { box-shadow: 0 0 135px rgba(93,225,194,.36), 0 0 0 24px rgba(93,225,194,.035), inset 0 0 48px rgba(93,225,194,.17); animation: coreSelect .55s ease-out; }
.orbit-node {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  display: grid;
  grid-template-columns: 36px minmax(0,1fr) 6px;
  align-items: center;
  gap: 11px;
  width: 194px;
  min-height: 67px;
  padding: 9px 13px 9px 9px;
  border: 1px solid rgba(115,185,190,.2);
  border-radius: 19px;
  background: linear-gradient(145deg, rgba(14,43,51,.9), rgba(6,23,29,.82));
  box-shadow: 0 18px 44px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.035);
  color: #789497;
  text-align: left;
  cursor: pointer;
  opacity: var(--node-opacity,1);
  backdrop-filter: blur(17px) saturate(135%);
  transition: color .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease, opacity .18s ease, scale .22s ease;
  transform-style: preserve-3d;
  will-change: transform;
  pointer-events: auto;
}
.orbit-node::before { position: absolute; inset: -1px; border-radius: inherit; background: linear-gradient(120deg, rgba(255,255,255,.08), transparent 28%, rgba(93,225,194,.03)); opacity: .7; content: ""; pointer-events: none; }
.orbit-node::after { position: absolute; inset: -12px; border-radius: 27px; content: ""; }
.orbit-node-index { position: relative; z-index: 1; display: grid; width: 36px; height: 36px; border: 1px solid rgba(105,177,182,.18); border-radius: 12px; background: linear-gradient(145deg,#153943,#0c2830); color: #65858a; font-family: var(--display); font-size: 8px; font-weight: 700; place-items: center; }
.orbit-node-copy { position: relative; z-index: 1; display: grid; min-width: 0; gap: 2px; }
.orbit-node-copy b { color: #c8d8d8; font-family: var(--display); font-size: 12px; font-weight: 600; letter-spacing: -.025em; }
.orbit-node-copy small { overflow: hidden; color: #5e7c80; font-size: 7px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.orbit-node > i { position: relative; z-index: 1; width: 5px; height: 5px; border-radius: 50%; background: #31565b; box-shadow: 0 0 0 3px rgba(70,111,116,.08); }
.orbit-node:hover, .orbit-node:focus-visible { z-index: 30!important; border-color: rgba(93,225,194,.45); background: linear-gradient(145deg, rgba(19,59,63,.97), rgba(7,29,35,.94)); box-shadow: 0 25px 60px rgba(0,0,0,.34), 0 0 36px rgba(93,225,194,.1), inset 0 1px rgba(255,255,255,.06); color: #e4f3f1; outline: 0; scale: 1.035; }
.orbit-node.is-active { z-index: 31!important; border-color: rgba(93,225,194,.58); background: linear-gradient(145deg, rgba(23,72,69,.97), rgba(8,35,40,.96)); box-shadow: 0 24px 62px rgba(0,0,0,.36), 0 0 40px rgba(93,225,194,.14), inset 0 1px rgba(255,255,255,.07); scale: 1.04; }
.orbit-node.is-active .orbit-node-index { border-color: rgba(123,245,218,.5); background: linear-gradient(145deg,var(--mint),#43b9bf); color: #06211f; box-shadow: 0 0 22px rgba(93,225,194,.25); }
.orbit-node.is-active .orbit-node-copy b { color: #f1fbf9; }
.orbit-node.is-active .orbit-node-copy small { color: #85b8af; }
.orbit-node.is-active > i { background: var(--mint); box-shadow: 0 0 12px var(--mint), 0 0 0 3px rgba(93,225,194,.1); }
.node-food .orbit-node-index, .node-health .orbit-node-index { color: var(--amber); }
.node-projects .orbit-node-index { color: #90a0ff; }
.node-training .orbit-node-index { color: var(--rose); }
.node-habits .orbit-node-index { color: #f0c66e; }
.system-stage:not(.is-orbiting) .node-finance { top: 8%; left: 42%; }
.system-stage:not(.is-orbiting) .node-time { top: 19%; left: auto; right: 3%; }
.system-stage:not(.is-orbiting) .node-home { top: auto; right: 6%; bottom: 19%; left: auto; }
.system-stage:not(.is-orbiting) .node-shopping { top: auto; bottom: 6%; left: 40%; }
.system-stage:not(.is-orbiting) .node-family { top: auto; bottom: 18%; left: 4%; }
.system-stage:not(.is-orbiting) .node-food { top: 21%; left: 3%; }
.system-stage:not(.is-orbiting) .node-projects { top: 5%; right: 16%; left: auto; }
.system-stage:not(.is-orbiting) .node-training { top: 42%; right: 0; left: auto; }
.system-stage:not(.is-orbiting) .node-habits { top: auto; right: 17%; bottom: 3%; left: auto; }
.system-stage:not(.is-orbiting) .node-health { top: auto; bottom: 4%; left: 14%; }
.system-stage.is-orbiting .orbit-node { top: 50%; right: auto; bottom: auto; left: 50%; }
.module-story { display: grid; grid-template-columns: 120px minmax(0,1fr) 210px; gap: 28px; align-items: end; padding-top: 34px; border-top: 1px solid var(--line); }
.module-story.is-switching > div:not(.module-index) { opacity: .35; transform: translateY(5px); }
.module-story > div { transition: opacity .18s ease, transform .18s ease; }
.module-index { color: #496b6f; font-family: var(--display); font-size: 12px; }
.module-story > div:nth-child(2) > p:first-child { margin: 0 0 7px; color: var(--mint); font-size: 8px; font-weight: 800; letter-spacing: .16em; }
.module-story h3 { margin: 0; font-family: var(--display); font-size: clamp(26px, 3vw, 42px); letter-spacing: -.045em; }
.module-story > div:nth-child(2) > p:last-child { max-width: 650px; margin: 12px 0 0; color: var(--muted); font-size: 14px; }
.module-stat { display: grid; justify-items: end; text-align: right; }
.module-stat strong { color: var(--mint); font-family: var(--display); font-size: 34px; letter-spacing: -.05em; }
.module-stat span { color: #567378; font-size: 9px; text-transform: uppercase; }

.possibilities { padding-top: 150px; padding-bottom: 160px; }
.section-heading { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(340px,.8fr); align-items: end; gap: 60px; margin-bottom: 65px; }
.section-heading > p { justify-self: end; }
.bento-grid { display: grid; grid-template-columns: 1.18fr .82fr; grid-template-rows: 460px 430px 470px 480px 430px; gap: 16px; }
.bento {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(13,39,47,.9), rgba(5,20,26,.96));
  box-shadow: inset 0 1px rgba(255,255,255,.025);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.bento::before { position: absolute; inset: 0; background: radial-gradient(circle at 85% 15%, rgba(92,225,194,.08), transparent 34%); content: ""; pointer-events: none; }
.bento:hover { border-color: rgba(118,214,203,.28); box-shadow: 0 34px 80px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.04); transform: translateY(-4px); }
.bento-number { position: absolute; top: 28px; right: 30px; color: #436065; font-family: var(--display); font-size: 11px; }
.bento-copy { position: absolute; z-index: 2; top: 34px; left: 36px; }
.bento-copy p { margin: 0 0 11px; color: var(--mint); font-size: 9px; font-weight: 800; letter-spacing: .17em; }
.bento-copy h3 { margin: 0; font-family: var(--display); font-size: clamp(30px, 3.1vw, 45px); font-weight: 600; letter-spacing: -.05em; line-height: 1.04; }
.bento-copy > span { display: block; margin-top: 14px; color: #638085; font-size: 10px; font-weight: 600; text-transform: uppercase; }
.finance-viz { position: absolute; right: 26px; bottom: 26px; left: 36px; display: grid; grid-template-columns: .65fr 1.35fr; align-items: end; gap: 28px; }
.finance-total { display: grid; gap: 7px; }
.finance-total small { color: #648085; font-size: 8px; }
.finance-total strong { font-family: var(--display); font-size: clamp(24px, 2.8vw, 38px); letter-spacing: -.05em; transition: opacity .24s ease, transform .24s ease; }
.finance-total > span { width: max-content; padding: 5px 8px; border-radius: 7px; background: rgba(93,225,194,.1); color: var(--mint); font-size: 8px; font-weight: 800; transition: color .24s ease, background .24s ease, opacity .24s ease, transform .24s ease; }
.finance-total > small { transition: opacity .24s ease, transform .24s ease; }
.finance-modes { display: flex; gap: 6px; margin-top: 4px; }
.finance-modes button { position: relative; width: 24px; height: 20px; padding: 0; border: 0; background: transparent; cursor: pointer; transition: width .25s ease; }
.finance-modes button::after { position: absolute; top: 8px; left: 0; width: 17px; height: 4px; border-radius: 99px; background: #2b4a50; content: ""; transition: width .25s ease, background .25s ease, box-shadow .25s ease; }
.finance-modes button.is-active { width: 38px; }
.finance-modes button.is-active::after { width: 31px; background: var(--mint); box-shadow: 0 0 12px rgba(93,225,194,.35); }
.finance-viz.is-switching .finance-total > small,
.finance-viz.is-switching .finance-total > strong,
.finance-viz.is-switching .finance-total > span { opacity: .25; transform: translateY(4px); }
.finance-bars { display: flex; height: 150px; align-items: end; gap: clamp(6px, 1vw, 12px); padding: 20px 17px 0; border-bottom: 1px solid rgba(93,225,194,.18); background: repeating-linear-gradient(to top, transparent 0 36px, rgba(124,179,186,.07) 36px 37px); }
.finance-bars i { flex: 1; height: var(--size); border-radius: 6px 6px 0 0; background: linear-gradient(to top, rgba(55,146,164,.18), rgba(93,225,194,.82)); box-shadow: 0 -8px 20px rgba(93,225,194,.06); transition: height .75s cubic-bezier(.2,.8,.2,1), filter .3s ease, opacity .3s ease; }
.finance-viz.is-switching .finance-bars i { filter: saturate(.65); opacity: .55; }
.bento-time { background: radial-gradient(circle at 70% 85%, rgba(79,114,255,.17), transparent 37%), linear-gradient(145deg, rgba(15,36,54,.92), rgba(6,20,29,.98)); }
.bento-time .bento-copy p { color: #8c9cff; }
.time-viz { position: absolute; right: 34px; bottom: 36px; left: 36px; display: flex; align-items: end; justify-content: space-between; }
.time-display { display: grid; gap: 5px; }
.time-display strong { font-family: var(--display); font-size: clamp(35px, 4vw, 58px); font-weight: 500; letter-spacing: -.07em; }
.time-display span { color: #6c858b; font-size: 10px; }
.time-viz button { display: grid; width: 64px; height: 64px; border: 1px solid rgba(128,151,255,.34); border-radius: 22px; background: linear-gradient(145deg, #7183ff, #5961d9); box-shadow: 0 16px 38px rgba(83,96,220,.28); cursor: pointer; transition: transform .22s ease, filter .22s ease, box-shadow .22s ease; place-items: center; }
.time-viz button:hover { filter: brightness(1.08); transform: translateY(-2px); }
.time-viz button i { position: relative; width: 14px; height: 16px; }
.time-viz button i::before, .time-viz button i::after { position: absolute; top: 0; bottom: 0; width: 4px; border-radius: 2px; background: white; content: ""; }
.time-viz button i::before { left: 1px; }
.time-viz button i::after { right: 1px; }
.time-viz button:not(.is-running) i { width: 0; height: 0; margin-left: 4px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 12px solid white; }
.time-viz button:not(.is-running) i::before, .time-viz button:not(.is-running) i::after { display: none; }
.bento-shopping { background: radial-gradient(circle at 80% 80%, rgba(242,185,88,.13), transparent 35%), linear-gradient(145deg, rgba(30,35,36,.92), rgba(8,22,25,.98)); }
.bento-shopping .bento-copy p { color: var(--amber); }
.receipt-viz { position: absolute; right: 34px; bottom: 30px; left: 36px; display: grid; gap: 9px; }
.receipt-head, .receipt-line { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; }
.receipt-head { padding: 13px; border: 1px solid rgba(244,190,98,.18); border-radius: 14px; background: rgba(27,38,38,.7); }
.receipt-head i { width: 28px; height: 28px; border-radius: 9px; background: linear-gradient(145deg, rgba(245,189,98,.3), rgba(238,119,92,.12)); }
.receipt-head span { color: #dbe5e3; font-size: 9px; font-weight: 700; }
.receipt-head small { display: block; color: #688187; font-size: 7px; font-weight: 500; }
.receipt-head b { display: grid; width: 20px; height: 20px; border-radius: 50%; background: var(--mint); color: #08221f; font-size: 9px; place-items: center; }
.receipt-line { padding: 0 13px; color: #71898d; font-size: 8px; }
.receipt-line b { color: #b4c5c5; font-size: 8px; }
.receipt-head, .receipt-line { transition: opacity .25s ease, transform .25s ease; }
.receipt-viz.is-switching .receipt-head, .receipt-viz.is-switching .receipt-line { opacity: .28; transform: translateX(6px); }
.receipt-steps { display: flex; justify-content: center; gap: 6px; padding-top: 2px; }
.receipt-steps button { position: relative; width: 24px; height: 20px; padding: 0; border: 0; background: transparent; cursor: pointer; transition: width .25s ease; }
.receipt-steps button::after { position: absolute; top: 8px; left: 0; width: 17px; height: 4px; border-radius: 99px; background: #4d4a3c; content: ""; transition: width .25s ease, background .25s ease, box-shadow .25s ease; }
.receipt-steps button.is-active { width: 36px; }
.receipt-steps button.is-active::after { width: 29px; background: var(--amber); box-shadow: 0 0 11px rgba(245,189,98,.3); }
.bento-home { background: radial-gradient(circle at 78% 70%, rgba(251,119,140,.12), transparent 38%), linear-gradient(145deg, rgba(33,28,39,.92), rgba(9,20,26,.98)); }
.bento-home .bento-copy p { color: var(--rose); }
.family-viz { position: absolute; right: 40px; bottom: 46px; left: 36px; display: flex; align-items: center; }
.avatar { display: grid; width: 61px; height: 61px; margin-left: -12px; border: 4px solid #0b2027; border-radius: 21px; color: white; font-family: var(--display); font-size: 16px; font-weight: 700; place-items: center; }
.avatar:first-child { margin-left: 0; }
.avatar-a { background: linear-gradient(145deg, #237f82, #164b59); }
.avatar-b { background: linear-gradient(145deg, #6c77cc, #414982); }
.avatar-c { background: linear-gradient(145deg, #c07377, #74434f); }
.avatar-more { background: #17343c; color: #759397; font-size: 11px; }
.family-viz > span { margin-left: auto; color: #718a8e; font-size: 10px; }
.home-task-viz { position: absolute; right: 30px; bottom: 31px; left: 30px; padding: 15px; border: 1px solid rgba(251,119,140,.17); border-radius: 17px; background: rgba(28,27,36,.64); box-shadow: inset 0 1px rgba(255,255,255,.025); }
.home-task-main { display: grid; grid-template-columns: 34px minmax(0,1fr) 32px; align-items: center; gap: 10px; }
.home-task-check { display: grid; width: 34px; height: 34px; border: 1px solid rgba(93,225,194,.28); border-radius: 11px; background: rgba(93,225,194,.1); color: var(--mint); font-size: 10px; place-items: center; }
.home-task-main > div { display: grid; gap: 2px; }
.home-task-main small { color: var(--rose); font-size: 5px; font-weight: 800; letter-spacing: .1em; }
.home-task-main b { color: #d6dfe1; font-size: 9px; }
.home-task-main p { margin: 0; color: #617980; font-size: 6px; }
.home-task-person { display: grid; width: 32px; height: 32px; border: 2px solid #132832; border-radius: 10px; background: linear-gradient(145deg,#6b76c5,#40497c); color: white; font-size: 8px; font-weight: 800; place-items: center; }
.home-task-progress { height: 3px; margin: 13px 0 11px; overflow: hidden; border-radius: 99px; background: #26313e; }
.home-task-progress i { display: block; width: var(--home-progress,42%); height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--rose),var(--mint)); box-shadow: 0 0 12px rgba(93,225,194,.22); transition: width .18s linear; }
.home-task-meta { display: flex; align-items: center; justify-content: space-between; color: #6d7e86; font-size: 6px; }
.home-task-meta b { color: #8e9aaf; font-size: 6px; letter-spacing: .18em; }
.home-task-meta em { color: var(--mint); font-style: normal; font-weight: 800; }
.bento-live { position: absolute; z-index: 3; top: 28px; right: 63px; display: flex; align-items: center; gap: 6px; padding: 5px 8px; border: 1px solid rgba(93,225,194,.17); border-radius: 8px; background: rgba(93,225,194,.055); color: #76b9ad; font-size: 6px; font-weight: 800; letter-spacing: .08em; }
.bento-live i { width: 5px; height: 5px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 9px var(--mint); }
.bento-meals { background: radial-gradient(circle at 82% 76%, rgba(245,189,98,.12), transparent 38%), linear-gradient(145deg, rgba(34,35,29,.94), rgba(8,21,24,.98)); }
.bento-meals .bento-copy p { color: var(--amber); }
.meal-viz { position: absolute; right: 34px; bottom: 28px; left: 36px; display: grid; gap: 10px; }
.meal-days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 7px; }
.meal-days > button { display: grid; min-height: 48px; align-content: center; gap: 3px; padding: 7px; border: 1px solid rgba(142,157,126,.12); border-radius: 10px; background: rgba(25,34,29,.5); color: #72827b; font-size: 6px; font-weight: 800; text-align: center; cursor: pointer; transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease; }
.meal-days > button:hover { border-color: rgba(245,189,98,.25); transform: translateY(-2px); }
.meal-days small { color: #4f6765; font-size: 5px; font-weight: 600; text-transform: none; }
.meal-days .is-today { border-color: rgba(245,189,98,.38); background: rgba(245,189,98,.09); color: var(--amber); box-shadow: 0 0 22px rgba(245,189,98,.07); }
.meal-days .is-today small { color: #a48758; }
.meal-current { display: grid; grid-template-columns: 70px minmax(0,1fr) auto; align-items: center; gap: 13px; min-height: 82px; padding: 11px; border: 1px solid rgba(245,189,98,.13); border-radius: 15px; background: rgba(21,31,29,.68); }
.meal-cover { position: relative; display: grid; width: 70px; height: 60px; overflow: hidden; border-radius: 11px; background: radial-gradient(circle at 35% 40%,#e69c62 0 12%,transparent 13%), radial-gradient(circle at 64% 55%,#7eaf72 0 13%,transparent 14%), linear-gradient(145deg,#385b49,#1a352f); place-items: center; }
.meal-cover::after { position: absolute; inset: 10px; border: 1px solid rgba(255,255,255,.17); border-radius: 50%; content: ""; }
.meal-cover i { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #efc578; }
.meal-cover i:first-child { top: 20px; left: 24px; }
.meal-cover i:nth-child(2) { top: 32px; right: 21px; background: #f3ddd0; }
.meal-cover i:nth-child(3) { right: 30px; bottom: 13px; background: #75a86f; }
.meal-current > span { display: grid; gap: 2px; }
.meal-current > span small { color: var(--amber); font-size: 5px; font-weight: 800; letter-spacing: .09em; }
.meal-current > span b { color: #dce5df; font-size: 10px; }
.meal-current > span em { color: #687c75; font-size: 6px; font-style: normal; }
.meal-current > strong { color: #d7e1dd; font-family: var(--display); font-size: 18px; text-align: right; }
.meal-current > strong small { display: block; color: #697c75; font-family: var(--body); font-size: 5px; font-weight: 600; }
.bento-lists { background: radial-gradient(circle at 78% 78%, rgba(93,225,194,.12), transparent 38%), linear-gradient(145deg, rgba(14,39,42,.94), rgba(7,20,25,.98)); }
.list-viz { position: absolute; right: 30px; bottom: 28px; left: 30px; padding: 14px; border: 1px solid rgba(93,225,194,.14); border-radius: 16px; background: rgba(8,29,34,.72); }
.list-summary { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.list-summary > span { display: grid; gap: 2px; }
.list-summary small { color: var(--mint); font-size: 5px; font-weight: 800; letter-spacing: .09em; }
.list-summary b { color: #b8c8c7; font-size: 9px; }
.list-summary > strong { color: #dce9e7; font-family: var(--display); font-size: 18px; letter-spacing: -.04em; }
.list-progress { height: 4px; margin: 11px 0; overflow: hidden; border-radius: 99px; background: #16343a; }
.list-progress i { display: block; width: 67%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--mint),var(--cyan)); }
.list-items { display: grid; gap: 6px; }
.list-items > button { display: grid; grid-template-columns: 16px minmax(0,1fr) auto; align-items: center; gap: 7px; min-height: 34px; padding: 0; border: 0; background: transparent; color: #93a9a8; font-size: 7px; text-align: left; cursor: pointer; transition: opacity .2s ease, color .2s ease; }
.list-items > button:hover { color: #d3e2e0; }
.list-items i { display: grid; width: 15px; height: 15px; border: 1px solid #31545a; border-radius: 5px; color: #08211f; font-size: 7px; font-style: normal; place-items: center; }
.list-items b { color: #718b8c; font-size: 7px; }
.list-items .is-checked { color: #617d7e; text-decoration: line-through; }
.list-items .is-checked i { border-color: var(--mint); background: var(--mint); }
.list-progress i { transition: width .5s cubic-bezier(.2,.8,.2,1); }
.bento-products { grid-column: 1/-1; background: radial-gradient(circle at 78% 54%, rgba(86,104,255,.14), transparent 36%), radial-gradient(circle at 32% 90%, rgba(93,225,194,.1), transparent 38%), linear-gradient(145deg, rgba(12,37,45,.96), rgba(5,17,25,.99)); }
.bento-products .bento-copy { top: 42px; }
.bento-products .bento-copy p { color: #9aa7ff; }
.bento-products .bento-copy h3 { font-size: clamp(37px, 4.2vw, 62px); }
.bento-products .bento-live { right: 72px; }
.product-viz { position: absolute; right: 36px; bottom: 34px; left: 44%; display: grid; grid-template-columns: 1.18fr .82fr; gap: 13px; }
.product-card-preview { position: relative; grid-row: span 2; display: grid; grid-template-columns: 86px minmax(0,1fr) auto; align-items: center; gap: 16px; min-height: 205px; padding: 22px; border: 1px solid rgba(138,151,255,.2); border-radius: 23px; background: linear-gradient(145deg, rgba(20,44,59,.86), rgba(8,25,34,.9)); box-shadow: 0 26px 65px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.04); }
.product-cover { position: relative; display: grid; width: 86px; height: 112px; overflow: hidden; border: 1px solid rgba(245,189,98,.22); border-radius: 22px; background: linear-gradient(155deg, #e9ca72, #9c592e 72%); place-items: center; }
.product-cover::before { position: absolute; width: 56px; height: 78px; border: 2px solid rgba(255,255,255,.42); border-radius: 50% 50% 44% 44%; content: ""; transform: rotate(-8deg); }
.product-cover span { position: relative; z-index: 2; color: #fff7d5; font-family: var(--display); font-size: 17px; font-weight: 800; text-shadow: 0 2px 9px rgba(49,22,3,.5); }
.product-card-preview > div:nth-child(2) { display: grid; gap: 6px; }
.product-card-preview small { color: #7887ee; font-size: 6px; font-weight: 800; letter-spacing: .13em; }
.product-card-preview strong { font-family: var(--display); font-size: 19px; letter-spacing: -.035em; }
.product-stars { color: var(--amber); font-size: 10px; letter-spacing: .08em; }
.product-stars em { margin-left: 5px; color: #a9b9ba; font-size: 8px; font-style: normal; letter-spacing: 0; }
.product-card-preview p { margin: 0; color: #5f7c81; font-size: 7px; }
.product-card-preview > b { align-self: start; color: var(--rose); font-size: 14px; }
.product-story { display: grid; min-width: 0; min-height: 205px; grid-template-rows: auto 1fr auto; gap: 9px; }
.product-story-nav { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; }
.product-story-nav button { min-height: 28px; padding: 0 7px; border: 1px solid rgba(125,143,255,.12); border-radius: 9px; background: rgba(12,31,42,.62); color: #667b88; font-size: 7px; font-weight: 800; cursor: pointer; transition: border-color .2s ease, background .2s ease, color .2s ease; }
.product-story-nav button.is-active { border-color: rgba(138,151,255,.35); background: rgba(104,119,255,.13); color: #aeb8ff; }
.product-stage-stack { position: relative; min-height: 88px; overflow: hidden; border: 1px solid rgba(120,151,190,.13); border-radius: 14px; background: rgba(7,25,33,.7); }
.product-stage { position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0,.85fr) minmax(105px,1.15fr); align-items: center; gap: 10px; padding: 12px; opacity: 0; transform: translateY(9px) scale(.985); transition: opacity .38s ease, transform .38s ease; pointer-events: none; }
.product-stage.is-active { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.product-stage > span { display: grid; gap: 3px; }
.product-stage > span small { color: #7584e8; font-size: 6px; font-weight: 800; letter-spacing: .09em; }
.product-stage > span b { color: #b8c8ca; font-size: 8px; line-height: 1.35; }
.product-price-chart { display: flex; height: 56px; align-items: end; gap: 5px; padding: 6px 7px 0; border-bottom: 1px solid rgba(138,151,255,.18); }
.product-price-chart i { flex: 1; height: var(--h); border-radius: 3px 3px 0 0; background: linear-gradient(to top, rgba(105,120,255,.23), #8f9cff); box-shadow: 0 -6px 13px rgba(108,124,255,.09); transform-origin: bottom; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.product-stage:not(.is-active) .product-price-chart i { transform: scaleY(.25); }
.product-comments { display: grid; grid-template-columns: 25px 25px 1fr; align-items: center; gap: 5px; }
.product-comments i { display: grid; width: 25px; height: 25px; margin-left: -7px; border: 2px solid #0b2630; border-radius: 9px; background: #275761; color: #d7e7e7; font-size: 7px; font-style: normal; place-items: center; }
.product-comments i:first-child { margin-left: 0; background: #4f5c9b; }
.product-comments strong { justify-self: end; color: #d9e4e4; font-family: var(--display); font-size: 16px; }
.product-comments em { grid-column: 1/-1; color: var(--amber); font-size: 8px; font-style: normal; letter-spacing: .1em; }
.product-pulse-chart { display: flex; height: 55px; align-items: center; gap: 4px; }
.product-pulse-chart i { flex: 1; height: 5px; border-radius: 99px; background: #273b53; box-shadow: 0 0 0 rgba(93,225,194,0); animation: productPulse 2.3s ease-in-out infinite; }
.product-pulse-chart i:nth-child(2) { animation-delay: -.35s; }
.product-pulse-chart i:nth-child(3) { animation-delay: -.7s; }
.product-pulse-chart i:nth-child(4) { animation-delay: -1.05s; }
.product-pulse-chart i:nth-child(5) { animation-delay: -1.4s; }
.product-pulse-chart i:nth-child(6) { animation-delay: -1.75s; }
.product-pulse-chart i:nth-child(7) { animation-delay: -2.1s; }
.product-signals { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.product-signals > span { display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: 2px 9px; min-height: 72px; padding: 9px; border: 1px solid var(--line); border-radius: 14px; background: rgba(7,25,32,.72); }
.product-signals i { grid-row: span 2; display: grid; width: 28px; height: 28px; border-radius: 9px; background: rgba(93,225,194,.09); color: var(--mint); font-size: 9px; font-style: normal; place-items: center; }
.product-signals b { color: #aebfc0; font-size: 7px; }
.product-signals small { color: #547277; font-size: 6px; }
.product-ai-note { display: grid; grid-template-columns: 32px 1fr; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid rgba(93,225,194,.16); border-radius: 14px; background: linear-gradient(90deg, rgba(27,75,72,.36), rgba(9,31,39,.55)); }
.product-ai-note > span { display: grid; width: 32px; height: 32px; border: 1px solid rgba(93,225,194,.3); border-radius: 10px; background: #10383c; color: var(--mint); font-family: var(--display); font-size: 10px; font-weight: 800; place-items: center; }
.product-ai-note p { display: grid; gap: 2px; margin: 0; }
.product-ai-note b { color: #b7cac9; font-size: 7px; }
.product-ai-note small { color: #5f7d80; font-size: 6px; }
.bento-banks { background: radial-gradient(circle at 70% 75%, rgba(72,191,238,.14), transparent 38%), linear-gradient(145deg, rgba(10,38,48,.95), rgba(5,18,25,.99)); }
.bento-banks .bento-copy p { color: var(--cyan); }
.bank-api-viz { position: absolute; right: 32px; bottom: 27px; left: 34px; padding: 14px; border: 1px solid rgba(72,191,238,.16); border-radius: 17px; background: rgba(5,26,35,.7); }
.bank-sync-head { display: flex; align-items: center; justify-content: space-between; color: #5d7982; font-size: 6px; }
.bank-sync-head span { display: flex; align-items: center; gap: 6px; color: var(--cyan); font-weight: 800; letter-spacing: .1em; }
.bank-sync-head i { width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }
.bank-flow { display: grid; grid-template-columns: 52px 1fr 48px 1fr 52px; align-items: center; gap: 8px; margin: 18px 0; }
.bank-flow > span { display: grid; justify-items: center; gap: 4px; }
.bank-flow > span i, .bank-flow > strong { display: grid; width: 42px; height: 42px; border: 1px solid rgba(72,191,238,.22); border-radius: 14px; background: rgba(72,191,238,.08); color: #9cdcf4; font-size: 12px; font-style: normal; place-items: center; }
.bank-flow > strong { border-color: rgba(93,225,194,.3); background: #103a40; color: var(--mint); }
.bank-flow small { color: #58747b; font-size: 5px; }
.bank-flow em { display: flex; justify-content: space-around; }
.bank-flow em i { width: 4px; height: 4px; border-radius: 50%; background: var(--mint); opacity: .28; animation: flowDot 1.5s ease-in-out infinite; }
.bank-flow em i:nth-child(2) { animation-delay: .25s; }
.bank-flow em i:nth-child(3) { animation-delay: .5s; }
.bank-api-viz.is-syncing .bank-flow > strong { animation: bankCorePulse .7s ease-out; }
.bank-api-viz.is-syncing .bank-sync-head b { color: var(--mint); }
.bank-sync-head b, .bank-results b { transition: color .25s ease, opacity .25s ease, transform .25s ease; }
.bank-api-viz.is-switching .bank-sync-head b, .bank-api-viz.is-switching .bank-results b { opacity: .3; transform: translateY(3px); }
.bank-results { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; }
.bank-results span { display: grid; padding: 8px; border: 1px solid rgba(72,191,238,.1); border-radius: 10px; background: rgba(12,37,44,.55); }
.bank-results b { color: #bae2eb; font-family: var(--display); font-size: 13px; }
.bank-results small { color: #547179; font-size: 5px; }
.bento-goals { background: radial-gradient(circle at 76% 73%, rgba(245,189,98,.15), transparent 38%), linear-gradient(145deg, rgba(38,35,27,.95), rgba(7,19,24,.99)); }
.bento-goals .bento-copy p { color: var(--amber); }
.goal-viz { position: absolute; right: 32px; bottom: 32px; left: 34px; display: grid; grid-template-columns: 115px 1fr; align-items: center; gap: 20px; }
.goal-ring { position: relative; display: grid; width: 112px; height: 112px; border-radius: 50%; background: conic-gradient(var(--amber) 0 var(--goal-progress,64%), rgba(245,189,98,.09) var(--goal-progress,64%)); box-shadow: 0 0 36px rgba(245,189,98,.1); transition: background .65s ease, box-shadow .3s ease; place-items: center; }
.goal-viz.is-advancing .goal-ring { box-shadow: 0 0 48px rgba(245,189,98,.18); }
.goal-copy strong, .goal-copy p b, .goal-copy p small, .goal-ring strong { transition: opacity .25s ease, transform .25s ease; }
.goal-viz.is-switching :is(.goal-copy > strong,.goal-copy p b,.goal-copy p small,.goal-ring strong) { opacity: .35; transform: translateY(3px); }
.goal-ring::before { position: absolute; width: 91px; height: 91px; border-radius: 50%; background: #102129; content: ""; }
.goal-ring span { position: relative; display: grid; justify-items: center; }
.goal-ring strong { font-family: var(--display); font-size: 21px; letter-spacing: -.05em; }
.goal-ring small { color: #786f5e; font-size: 5px; }
.goal-copy { display: grid; gap: 4px; }
.goal-copy > small { color: var(--amber); font-size: 5px; font-weight: 800; letter-spacing: .1em; }
.goal-copy > strong { font-family: var(--display); font-size: 22px; letter-spacing: -.04em; }
.goal-copy > span { color: #697c7c; font-size: 6px; }
.goal-copy p { display: grid; grid-template-columns: 28px 1fr; gap: 1px 8px; margin: 8px 0 0; padding: 9px; border: 1px solid rgba(245,189,98,.13); border-radius: 11px; background: rgba(43,38,27,.52); }
.goal-copy p i { grid-row: span 2; display: grid; width: 28px; height: 28px; border-radius: 9px; background: rgba(93,225,194,.1); color: var(--mint); font-size: 8px; font-style: normal; place-items: center; }
.goal-copy p b { color: #d6c496; font-size: 8px; }
.goal-copy p small { color: #6d705f; font-size: 5px; }

:is(.finance-modes button,.receipt-steps button,.time-viz button,.meal-days button,.list-items button,.product-story-nav button):focus-visible {
  outline: 2px solid var(--mint);
  outline-offset: 3px;
}

.horizon { padding-top: 130px; padding-bottom: 170px; }
.horizon-intro { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(360px,.85fr); align-items: end; gap: 70px; margin-bottom: 66px; }
.horizon-intro h2 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(48px, 5.6vw, 82px);
  font-weight: 600;
  letter-spacing: -.065em;
  line-height: .97;
}
.horizon-intro h2 em { color: var(--muted-2); font-style: normal; }
.horizon-intro > div:last-child > p { max-width: 560px; margin: 0; color: var(--muted); font-size: 17px; line-height: 1.75; }
.roadmap-note { display: flex; align-items: center; gap: 9px; width: max-content; margin-top: 21px; color: #68868a; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.roadmap-note i { width: 6px; height: 6px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 11px rgba(245,189,98,.7); }
.horizon-grid { display: grid; grid-template-columns: 1.08fr .92fr; grid-template-rows: 540px 480px 430px 430px; gap: 16px; }
.horizon-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 29px 31px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(13,39,47,.94), rgba(5,19,25,.98));
  box-shadow: inset 0 1px rgba(255,255,255,.025);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.horizon-card::before { position: absolute; inset: 0; background: radial-gradient(circle at 84% 12%, rgba(93,225,194,.08), transparent 35%); content: ""; pointer-events: none; }
.horizon-card:hover { border-color: rgba(118,214,203,.28); box-shadow: 0 34px 80px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.04); transform: translateY(-4px); }
.horizon-card > header { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.horizon-code { color: #496a6e; font-family: var(--display); font-size: 9px; font-weight: 700; letter-spacing: .12em; }
.future-badge { padding: 6px 9px; border: 1px solid rgba(245,189,98,.2); border-radius: 8px; background: rgba(245,189,98,.06); color: var(--amber); font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.future-open { border-color: rgba(93,225,194,.2); background: rgba(93,225,194,.06); color: var(--mint); }
.horizon-copy { position: relative; z-index: 2; margin-top: 34px; }
.horizon-copy > p:first-child { margin: 0 0 10px; color: var(--mint); font-size: 8px; font-weight: 800; letter-spacing: .17em; }
.horizon-copy h3 { margin: 0; font-family: var(--display); font-size: clamp(31px,3vw,46px); font-weight: 600; letter-spacing: -.055em; line-height: 1.02; }
.horizon-copy > p:last-child { max-width: 560px; margin: 14px 0 0; color: #6f898d; font-size: 11px; line-height: 1.65; }
.feature-pills { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 7px; margin: 18px 0 0; padding: 0; list-style: none; }
.feature-pills li { padding: 6px 9px; border: 1px solid #25454d; border-radius: 8px; background: rgba(12,41,48,.52); color: #759093; font-size: 7px; font-weight: 700; text-transform: uppercase; }
.horizon-work { background: radial-gradient(circle at 78% 82%, rgba(72,191,238,.11), transparent 39%), linear-gradient(145deg, rgba(12,40,49,.94), rgba(5,18,25,.98)); }
.project-viz { position: absolute; right: 31px; bottom: 29px; left: 31px; display: grid; gap: 8px; padding: 15px; border: 1px solid rgba(92,183,202,.16); border-radius: 16px; background: rgba(5,24,31,.72); }
.project-head { display: flex; align-items: center; justify-content: space-between; color: #aec1c2; font-size: 9px; font-weight: 700; }
.project-head b { color: var(--cyan); font-size: 8px; }
.project-track { height: 4px; overflow: hidden; border-radius: 99px; background: #16343c; }
.project-track i { display: block; width: var(--project-progress,36%); height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--cyan),var(--mint)); box-shadow: 0 0 13px rgba(93,225,194,.2); transition: width .18s linear; }
.task-row { display: grid; grid-template-columns: 11px minmax(0,1fr) auto; align-items: center; gap: 8px; min-height: 28px; padding: 0 8px; border: 1px solid rgba(113,171,180,.08); border-radius: 8px; color: #789195; font-size: 7px; transition: color .35s ease, opacity .35s ease, background .35s ease; }
.task-row > i { width: 9px; height: 9px; border: 1px solid #38585f; border-radius: 3px; }
.task-row > b { color: #59777b; font-size: 6px; font-weight: 700; text-transform: uppercase; }
.task-row.is-ready { color: #577277; text-decoration: line-through; }
.task-row.is-ready > i { border-color: var(--mint); background: var(--mint); box-shadow: inset 0 0 0 2px #0b252c; }
.team-stack { display: flex; align-items: center; margin-top: 3px; }
.team-stack span { display: grid; width: 22px; height: 22px; margin-left: -5px; border: 2px solid #0a252c; border-radius: 8px; background: #214c55; color: #c9d8d8; font-size: 6px; font-weight: 800; place-items: center; }
.team-stack span:first-child { margin-left: 0; background: #236f70; }
.team-stack span:nth-child(2) { background: #525f9c; }
.team-stack span:nth-child(3) { background: #82525d; }
.team-stack small { margin-left: 8px; color: #557277; font-size: 6px; }
.horizon-health { background: radial-gradient(circle at 72% 78%, rgba(251,119,140,.12), transparent 38%), linear-gradient(145deg, rgba(32,27,39,.94), rgba(7,20,26,.98)); }
.horizon-health .horizon-copy > p:first-child { color: var(--rose); }
.health-viz { position: absolute; right: 30px; bottom: 30px; left: 30px; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 24px; }
.activity-ring { display: grid; width: 130px; height: 130px; border-radius: 50%; background: conic-gradient(var(--rose) 0 var(--activity-progress,38%), rgba(130,79,98,.16) var(--activity-progress,38%)); box-shadow: 0 0 calc(12px + var(--eco-glow,0px)) rgba(251,119,140,.12); transition: box-shadow .2s ease; place-items: center; }
.activity-ring::before { grid-area: 1/1; width: 105px; height: 105px; border-radius: 50%; background: #101f2a; content: ""; }
.activity-ring span { z-index: 1; grid-area: 1/1; display: grid; text-align: center; }
.activity-ring strong { font-family: var(--display); font-size: 25px; letter-spacing: -.05em; line-height: 1; }
.activity-ring small { margin-top: 6px; color: #745e6b; font-size: 6px; text-transform: uppercase; }
.activity-stats { display: grid; gap: 8px; }
.activity-stats > span { display: flex; min-height: 37px; align-items: center; justify-content: space-between; padding: 0 11px; border: 1px solid rgba(151,100,122,.13); border-radius: 10px; background: rgba(25,28,39,.5); }
.activity-stats small { color: #765d69; font-size: 6px; font-weight: 800; letter-spacing: .09em; }
.activity-stats b { color: #b9aaaf; font-size: 8px; }
.horizon-wellbeing { background: radial-gradient(circle at 82% 75%, rgba(93,225,194,.13), transparent 40%), linear-gradient(145deg, rgba(12,40,43,.94), rgba(6,20,25,.98)); }
.horizon-wellbeing .horizon-copy > p:first-child { color: #69dfb6; }
.wellbeing-viz { position: absolute; right: 30px; bottom: 27px; left: 30px; display: grid; grid-template-columns: 104px minmax(0,1fr); align-items: center; gap: 18px; }
.wellbeing-score { display: grid; width: 104px; height: 104px; border-radius: 50%; background: conic-gradient(var(--mint) 0 var(--wellbeing-progress,52%),rgba(52,98,91,.16) var(--wellbeing-progress,52%)); box-shadow: 0 0 var(--eco-glow,0px) rgba(93,225,194,.16); place-items: center; }
.wellbeing-score::before { grid-area: 1/1; width: 83px; height: 83px; border-radius: 50%; background: #0b242b; content: ""; }
.wellbeing-score span { z-index: 1; grid-area: 1/1; display: grid; text-align: center; }
.wellbeing-score strong { font-family: var(--display); font-size: 23px; line-height: 1; }
.wellbeing-score small { margin-top: 4px; color: #66827d; font-size: 6px; text-transform: uppercase; }
.wellbeing-stream { display: grid; gap: 8px; }
.wellbeing-stream > span { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 6px 10px; color: #809997; font-size: 7px; }
.wellbeing-stream i { grid-column: 1/-1; grid-row: 2; height: 4px; overflow: hidden; border-radius: 99px; background: #17353a; }
.wellbeing-stream i::after { display: block; width: var(--fill); height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--mint),var(--cyan)); content: ""; transform: scaleX(var(--wellbeing-fill, .55)); transform-origin: left; transition: transform .18s linear; }
.wellbeing-stream small { font-size: 6px; }
.wellbeing-stream b { color: #97aeaa; font-size: 6px; }
.wellbeing-note { grid-column: 1/-1; display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid rgba(93,225,194,.13); border-radius: 11px; background: rgba(12,42,44,.55); }
.wellbeing-note > i { width: 22px; height: 22px; border-radius: 8px; background: linear-gradient(145deg,rgba(93,225,194,.28),rgba(72,191,238,.12)); }
.wellbeing-note > span { color: #9db2af; font-size: 7px; font-weight: 700; }
.wellbeing-note small { display: block; color: #5e7976; font-size: 6px; font-weight: 500; }
.horizon-habits { background: radial-gradient(circle at 78% 82%, rgba(245,189,98,.12), transparent 38%), linear-gradient(145deg, rgba(34,34,29,.94), rgba(7,20,24,.98)); }
.horizon-habits .horizon-copy > p:first-child { color: var(--amber); }
.habit-viz { position: absolute; right: 31px; bottom: 30px; left: 31px; padding: 15px; border: 1px solid rgba(245,189,98,.13); border-radius: 16px; background: rgba(25,30,27,.66); }
.habit-title { display: flex; align-items: center; justify-content: space-between; color: #bdc6c2; font-size: 9px; font-weight: 700; }
.habit-title b { color: var(--amber); font-size: 7px; }
.habit-week { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 6px; margin-top: 13px; }
.habit-week > span { display: grid; gap: 5px; color: #5d7677; font-size: 6px; text-align: center; }
.habit-week i { display: grid; width: 100%; aspect-ratio: 1; border: 1px solid #2c494b; border-radius: 8px; color: #0b2927; font-size: 8px; font-style: normal; transition: border-color .3s ease, background .3s ease, box-shadow .3s ease, transform .3s ease; place-items: center; }
.habit-week .is-done i { border-color: rgba(245,189,98,.26); background: var(--amber); }
.habit-week .is-done i { transform: translateY(-2px); }
.habit-week .is-current i { border-color: var(--amber); box-shadow: 0 0 14px rgba(245,189,98,.12), inset 0 0 0 2px rgba(245,189,98,.06); }
.habit-viz > p { margin: 11px 0 0; color: #6b7e78; font-size: 7px; }
.horizon-day { grid-column: 1/-1; background: radial-gradient(circle at 78% 52%, rgba(72,191,238,.13), transparent 38%), radial-gradient(circle at 18% 90%, rgba(105,119,255,.08), transparent 36%), linear-gradient(145deg, rgba(11,37,49,.96), rgba(5,18,25,.99)); }
.horizon-day .horizon-copy { max-width: 51%; }
.horizon-day .horizon-copy > p:first-child { color: var(--cyan); }
.day-viz { position: absolute; top: 70px; right: 31px; bottom: 28px; width: 43%; padding: 15px; border: 1px solid rgba(72,191,238,.17); border-radius: 18px; background: rgba(5,25,34,.74); box-shadow: inset 0 1px rgba(255,255,255,.025); }
.day-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid rgba(72,191,238,.12); }
.day-head > span { display: grid; gap: 1px; }
.day-head small { color: var(--cyan); font-size: 6px; font-weight: 800; letter-spacing: .1em; }
.day-head b { color: #c6d7d8; font-size: 10px; }
.day-head strong { display: flex; align-items: center; gap: 6px; color: #66838a; font-size: 6px; }
.day-head strong i { width: 5px; height: 5px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 9px var(--mint); }
.day-timeline { position: relative; display: grid; gap: 6px; margin-top: 11px; }
.day-timeline > span { display: grid; grid-template-columns: 38px 8px minmax(0,1fr) auto; align-items: center; gap: 8px; min-height: 39px; padding: 0 9px; border: 1px solid rgba(103,158,170,.08); border-radius: 10px; background: rgba(8,31,40,.48); color: #7d969a; transition: border-color .3s ease, background .3s ease, transform .3s ease; }
.day-timeline > span small { color: #57757b; font-size: 6px; }
.day-timeline > span > i { width: 6px; height: 6px; border: 1px solid #3b5d63; border-radius: 50%; }
.day-timeline > span b { font-size: 7px; }
.day-timeline > span em { color: #58737a; font-size: 6px; font-style: normal; }
.day-timeline > span.is-focus { border-color: rgba(105,119,255,.2); background: rgba(86,101,193,.1); color: #b7c2d8; transform: translateX(4px); }
.day-timeline > span.is-focus > i { border-color: #8694ff; background: #7483ff; box-shadow: 0 0 10px rgba(116,131,255,.5); }
.day-timeline > u { position: absolute; z-index: 3; right: 3px; left: 42px; top: var(--day-now,42%); height: 1px; background: linear-gradient(90deg,var(--rose),rgba(251,119,140,.08)); text-decoration: none; transition: top .18s linear; }
.day-timeline > u > i { position: absolute; top: -3px; left: -2px; width: 7px; height: 7px; border-radius: 50%; background: var(--rose); box-shadow: 0 0 11px var(--rose); }
.day-timeline > u > small { position: absolute; top: -16px; right: 0; color: var(--rose); font-size: 6px; font-weight: 800; }
.horizon-life { grid-column: 1/-1; background: radial-gradient(circle at 72% 60%, rgba(93,225,194,.12), transparent 39%), linear-gradient(145deg, rgba(12,38,44,.94), rgba(5,18,24,.98)); }
.horizon-life .horizon-copy { max-width: 58%; }
.life-map { position: absolute; right: 20px; bottom: 15px; width: 260px; height: 230px; }
.life-map::before, .life-map::after { position: absolute; border: 1px solid rgba(93,225,194,.12); border-radius: 50%; content: ""; }
.life-map::before { inset: 28px 44px; }
.life-map::after { inset: 0 16px; border-style: dashed; animation: orbitSpin 32s linear infinite; }
.life-core { position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; width: 76px; height: 76px; border: 1px solid rgba(93,225,194,.35); border-radius: 50%; background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.4), rgba(40,128,117,.6) 25%, #0a252d 70%); box-shadow: 0 0 calc(40px + var(--eco-glow,0px)) rgba(93,225,194,.16); transform: translate(-50%,-50%) scale(var(--life-scale,1)); transition: transform .18s linear, box-shadow .18s linear; place-items: center; }
.life-core span { color: white; font-family: var(--display); font-size: 25px; font-weight: 600; }
.life-node { position: absolute; z-index: 3; padding: 6px 9px; border: 1px solid #29494f; border-radius: 8px; background: rgba(8,28,34,.85); color: #718b8e; font-size: 6px; text-transform: uppercase; transition: translate .18s linear, border-color .25s ease, color .25s ease; }
.life-node.node-a { top: 6px; left: 42%; }
.life-node.node-b { top: 43%; right: 0; }
.life-node.node-c { right: 22%; bottom: 4px; }
.life-node.node-d { top: 50%; left: 0; }
.horizon-life .node-a, .horizon-life .node-c { translate: 0 var(--life-shift,0px); }
.horizon-life .node-b, .horizon-life .node-d { translate: 0 var(--life-shift-negative,0px); }

.intelligence { padding-top: 150px; padding-bottom: 160px; }
.ai-manifesto { position: relative; display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; min-height: 760px; margin-bottom: 150px; padding: clamp(48px, 7vw, 92px); overflow: hidden; border: 1px solid rgba(105,222,204,.2); border-radius: 36px; background: radial-gradient(circle at 78% 48%, rgba(72,93,255,.14), transparent 35%), radial-gradient(circle at 64% 54%, rgba(93,225,194,.13), transparent 30%), linear-gradient(145deg, rgba(10,37,44,.96), rgba(3,14,20,.99)); box-shadow: 0 55px 130px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.035); }
.ai-manifesto::before { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 54px 54px; mask-image: radial-gradient(circle at 76% 50%, black, transparent 70%); content: ""; pointer-events: none; }
.ai-manifesto-copy { position: relative; z-index: 4; }
.ai-manifesto-copy h2 { font-size: clamp(48px, 5.2vw, 76px); }
.ai-manifesto-copy > p:not(.eyebrow) { max-width: 510px; margin: 29px 0 0; color: var(--muted); font-size: 16px; line-height: 1.75; }
.ai-principles { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 34px; }
.ai-principles span { display: inline-flex; align-items: center; gap: 8px; padding: 9px 11px; border: 1px solid rgba(118,190,192,.17); border-radius: 11px; background: rgba(9,31,37,.62); color: #7f999b; font-size: 7px; font-weight: 700; text-transform: uppercase; }
.ai-principles i { color: var(--mint); font-family: var(--display); font-size: 6px; font-style: normal; }
.neural-scene { position: relative; z-index: 2; min-height: 590px; transform-style: preserve-3d; }
.neural-aura { position: absolute; top: 50%; left: 50%; width: 470px; height: 470px; border-radius: 50%; background: radial-gradient(circle, rgba(93,225,194,.2), rgba(69,93,255,.09) 42%, transparent 70%); filter: blur(18px); transform: translate(-50%,-50%) scale(var(--scene-scale, .92)); }
.neural-ring { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(103,214,200,.17); border-radius: 50%; translate: -50% -50%; }
.neural-ring::after { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 18px var(--mint); content: ""; }
.neural-ring-one { width: 250px; height: 250px; rotate: var(--scene-rotate-one, 0deg); }
.neural-ring-one::after { top: 20px; right: 48px; }
.neural-ring-two { width: 410px; height: 310px; border-style: dashed; rotate: var(--scene-rotate-two, 0deg); }
.neural-ring-two::after { right: 12px; bottom: 90px; width: 5px; height: 5px; background: var(--cyan); }
.neural-ring-three { width: 560px; height: 430px; border-color: rgba(121,133,255,.12); rotate: var(--scene-rotate-three, 0deg); }
.neural-ring-three::after { top: 44px; left: 116px; width: 4px; height: 4px; background: #8693ff; box-shadow: 0 0 14px #7382ff; }
.neural-core { position: absolute; z-index: 5; top: 50%; left: 50%; display: grid; width: 176px; height: 176px; align-content: center; border: 1px solid rgba(113,234,208,.4); border-radius: 50%; background: radial-gradient(circle at 36% 28%, rgba(226,255,248,.55), rgba(58,159,145,.66) 12%, rgba(14,66,70,.82) 34%, #061a22 72%); box-shadow: 0 0 100px rgba(93,225,194,.26), inset 0 0 38px rgba(93,225,194,.15); text-align: center; transform: translate(-50%,-50%) translateY(var(--scene-lift, 0px)); }
.neural-core::before { position: absolute; inset: 10px; border: 1px dashed rgba(118,239,213,.2); border-radius: 50%; content: ""; animation: orbitSpin 18s linear infinite; }
.neural-core span, .neural-core b, .neural-core small { position: relative; z-index: 2; }
.neural-core span { color: white; font-family: var(--display); font-size: 46px; font-weight: 600; line-height: 1; text-shadow: 0 0 25px var(--mint); }
.neural-core b { margin-top: 8px; color: var(--mint); font-size: 7px; letter-spacing: .18em; }
.neural-core small { margin-top: 2px; color: #5a7e81; font-size: 5px; letter-spacing: .08em; }
.neural-signal { position: absolute; z-index: 6; display: flex; align-items: center; gap: 9px; min-width: 148px; padding: 9px 11px; border: 1px solid rgba(118,190,193,.2); border-radius: 13px; background: rgba(6,25,32,.82); box-shadow: 0 17px 38px rgba(0,0,0,.24); backdrop-filter: blur(14px); transition: transform .2s ease-out; }
.neural-signal > i { width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 10px var(--mint); }
.neural-signal span { display: grid; color: #b2c4c4; font-size: 8px; font-weight: 700; line-height: 1.3; }
.neural-signal small { color: #58777b; font-size: 5px; font-weight: 500; }
.signal-finance { top: 12%; left: 4%; transform: translateY(var(--scene-shift-negative, 0px)); }
.signal-food { top: 18%; right: -2%; transform: translateY(var(--scene-shift, 0px)); }
.signal-work { top: 48%; right: -8%; transform: translateY(var(--scene-shift-soft, 0px)); }
.signal-health { bottom: 12%; right: 8%; transform: translateY(var(--scene-shift, 0px)); }
.signal-habits { bottom: 17%; left: 0; transform: translateY(var(--scene-shift-habits, 0px)); }
.intelligence-grid { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: clamp(50px, 8vw, 120px); }
.intelligence-copy > p { margin-top: 30px; }
.intelligence-copy ul { display: grid; gap: 0; margin: 35px 0 0; padding: 0; list-style: none; }
.intelligence-copy li { display: grid; grid-template-columns: 36px minmax(0,1fr); align-items: center; gap: 12px; padding: 15px 0; border-top: 1px solid var(--line); color: #a9bcbd; font-size: 12px; }
.intelligence-copy li:last-child { border-bottom: 1px solid var(--line); }
.intelligence-copy li span { color: var(--mint); font-family: var(--display); font-size: 8px; }
.assistant-demo { overflow: hidden; border: 1px solid rgba(116,192,195,.2); border-radius: 28px; background: linear-gradient(155deg, rgba(13,43,51,.96), rgba(5,20,27,.98)); box-shadow: 0 45px 100px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.035); }
.assistant-head { display: flex; min-height: 72px; align-items: center; justify-content: space-between; padding: 0 24px; border-bottom: 1px solid var(--line); background: rgba(4,17,22,.35); }
.assistant-head > div { display: flex; align-items: center; gap: 11px; }
.assistant-head > div > i { width: 30px; height: 30px; border-radius: 11px; background: radial-gradient(circle at 35% 28%, white 0 3%, var(--mint) 8%, #14565c 45%, #0b2732 72%); box-shadow: 0 0 17px rgba(93,225,194,.16); }
.assistant-head span { color: #d9e6e5; font-size: 10px; font-weight: 700; }
.assistant-head small { display: block; color: #668286; font-size: 7px; font-weight: 500; }
.assistant-head b { color: var(--mint); font-size: 6px; letter-spacing: .12em; }
.assistant-body { display: grid; gap: 20px; min-height: 465px; align-content: center; padding: clamp(24px, 4vw, 52px); }
.user-message { justify-self: end; min-height: 51px; max-width: 76%; padding: 15px 18px; border: 1px solid rgba(116,149,255,.18); border-radius: 17px 17px 4px 17px; background: rgba(74,86,160,.2); color: #cdd5e6; font-size: 11px; }
.typing-caret { display: none; width: 1px; height: 1em; margin-left: 2px; background: #aeb9ff; vertical-align: -.15em; animation: caretBlink .8s steps(1) infinite; }
.assistant-demo.is-typing .typing-caret { display: inline-block; }
.ai-message { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 13px; }
.ai-symbol { display: grid; width: 32px; height: 32px; border: 1px solid rgba(93,225,194,.25); border-radius: 11px; background: #10353b; color: var(--mint); font-family: var(--display); font-size: 11px; font-weight: 700; place-items: center; }
.ai-message p { margin: 3px 0 14px; color: #aabdbd; font-size: 11px; }
.assistant-thinking { display: none; min-height: 31px; align-items: center; gap: 5px; }
.assistant-thinking.is-visible { display: flex; }
.assistant-thinking i { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); opacity: .35; animation: thinkingDot 1.15s ease-in-out infinite; }
.assistant-thinking i:nth-child(2) { animation-delay: .16s; }
.assistant-thinking i:nth-child(3) { animation-delay: .32s; }
.assistant-demo.is-story-ready .ai-story-step { opacity: 0; transform: translateY(9px); transition: opacity .42s ease, transform .42s ease; pointer-events: none; }
.assistant-demo.is-story-ready .ai-story-step.is-revealed { opacity: 1; transform: translateY(0); pointer-events: auto; }
.insight-card { position: relative; display: grid; gap: 3px; margin-top: 8px; padding: 13px 15px; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: rgba(8,30,36,.64); }
.insight-card::before { position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: var(--mint); content: ""; }
.insight-card > span { color: var(--mint); font-size: 6px; font-weight: 800; letter-spacing: .1em; }
.insight-card strong { color: #d7e3e3; font-size: 10px; }
.insight-card small { color: #658085; font-size: 7px; }
.insight-time::before { background: var(--blue); }
.insight-time > span { color: #8390ff; }
.ai-message button { margin-top: 13px; padding: 9px 13px; border: 1px solid rgba(93,225,194,.26); border-radius: 10px; background: rgba(30,85,80,.34); color: var(--mint); font-size: 8px; font-weight: 700; }
.ai-message button span { margin-left: 12px; }
.assistant-input { display: flex; min-height: 68px; align-items: center; justify-content: space-between; margin: 0 16px 16px; padding: 0 13px 0 18px; border: 1px solid #274952; border-radius: 17px; background: #071d25; color: #537177; font-size: 9px; }
.assistant-input b { display: grid; width: 35px; height: 35px; border-radius: 11px; background: linear-gradient(145deg, var(--mint), var(--cyan)); color: #08211f; font-size: 15px; place-items: center; }

.development { padding-top: 40px; padding-bottom: 150px; }
.development-card { position: relative; display: grid; grid-template-columns: minmax(0,.88fr) minmax(440px,1.12fr); gap: clamp(40px,5vw,76px); min-height: 760px; align-items: center; padding: clamp(72px,7vw,96px) clamp(40px,6.5vw,86px) clamp(40px,6.5vw,86px); overflow: hidden; border: 1px solid rgba(114,135,255,.24); border-radius: 36px; background: radial-gradient(circle at 83% 38%, rgba(104,117,255,.23), transparent 34%), radial-gradient(circle at 17% 81%, rgba(93,225,194,.1), transparent 31%), linear-gradient(145deg, rgba(13,31,48,.97), rgba(4,16,23,.99)); box-shadow: 0 50px 120px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.035); }
.development-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(139,155,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(139,155,255,.025) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(115deg, black, transparent 70%); pointer-events: none; }
.development-status { position: absolute; z-index: 3; top: 28px; right: 30px; left: 30px; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 10px; padding-bottom: 18px; border-bottom: 1px solid rgba(130,149,255,.13); }
.development-pulse { display: grid; width: 34px; height: 34px; border: 1px solid rgba(122,235,213,.24); border-radius: 11px; background: rgba(93,225,194,.06); place-items: center; }
.development-pulse i { width: 7px; height: 7px; border-radius: 50%; background: var(--mint); animation: pulseMint 2.2s ease-out infinite; }
.development-status div { display: grid; gap: 1px; }
.development-status small { color: #657b9c; font-size: 5px; font-weight: 800; letter-spacing: .13em; }
.development-status b { color: #93a2ff; font-size: 7px; letter-spacing: .12em; }
.development-status em { color: #445779; font-size: 7px; font-style: normal; }
.development-copy { position: relative; z-index: 3; }
.development-copy h2 { margin: 0; font-family: var(--display); font-size: clamp(47px,5vw,74px); font-weight: 600; letter-spacing: -.065em; line-height: .98; }
.development-copy h2 em { color: #69779c; }
.development-copy > p:not(.eyebrow) { max-width: 590px; margin: 28px 0 0; color: var(--muted); font-size: 16px; line-height: 1.75; }
.development-progress { display: grid; gap: 13px; margin-top: 34px; }
.development-progress > span { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 5px; padding-bottom: 12px; overflow: hidden; border-bottom: 1px solid rgba(129,151,255,.12); }
.development-progress > span::after { position: absolute; bottom: -1px; left: 0; width: var(--progress); height: 1px; background: linear-gradient(90deg, #7989ff, var(--mint)); content: ""; box-shadow: 0 0 8px rgba(115,133,255,.4); }
.development-progress i { display: none; }
.development-progress b { color: #aebdc3; font-size: 9px; }
.development-progress small { color: #60758c; font-size: 7px; text-transform: uppercase; }
.beta-panel { position: relative; z-index: 4; padding: 38px; border: 1px solid rgba(119,232,209,.4); border-radius: 30px; background: radial-gradient(circle at 88% 8%, rgba(93,225,194,.15), transparent 27%), linear-gradient(145deg, rgba(30,54,80,.97), rgba(8,29,39,.98)); box-shadow: 0 42px 100px rgba(0,0,0,.38), 0 0 80px rgba(91,126,255,.13), 0 0 42px rgba(93,225,194,.07), inset 0 1px rgba(255,255,255,.075); transform: translateY(-5px); }
.beta-panel::before { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(125deg, rgba(255,255,255,.075), transparent 26%, rgba(93,225,194,.025)); content: ""; pointer-events: none; }
.beta-panel::after { position: absolute; top: -1px; right: 15%; left: 15%; height: 2px; border-radius: 99px; background: linear-gradient(90deg, transparent, var(--mint), #8494ff, transparent); box-shadow: 0 0 20px rgba(93,225,194,.55); content: ""; }
.beta-number { position: absolute; top: 20px; right: 23px; color: #8291ae; font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.beta-icon { display: grid; width: 62px; height: 62px; margin-bottom: 25px; border: 1px solid rgba(137,151,255,.52); border-radius: 19px; background: linear-gradient(145deg, rgba(121,137,255,.34), rgba(93,225,194,.14)); box-shadow: 0 14px 36px rgba(74,97,215,.22), inset 0 1px rgba(255,255,255,.08); color: #bcc5ff; font-family: Georgia, serif; font-size: 28px; place-items: center; }
.beta-panel > p:first-of-type { margin: 0 0 10px; color: #9dacff; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.beta-panel > h3 { max-width: 610px; margin: 0; font-family: var(--display); font-size: clamp(30px,2.7vw,40px); letter-spacing: -.048em; line-height: 1.08; }
.beta-reward { position: relative; display: grid; grid-template-columns: 68px 1fr; align-items: center; gap: 18px; margin-top: 28px; padding: 21px; overflow: hidden; border: 1px solid rgba(93,225,194,.38); border-radius: 20px; background: radial-gradient(circle at 12% 50%, rgba(93,225,194,.2), transparent 31%), linear-gradient(105deg, rgba(29,104,91,.32), rgba(16,51,64,.64)); box-shadow: inset 0 1px rgba(255,255,255,.06), 0 18px 50px rgba(1,16,23,.24); }
.beta-reward::after { position: absolute; top: -35px; right: -26px; width: 120px; height: 120px; border: 1px solid rgba(93,225,194,.13); border-radius: 50%; content: ""; box-shadow: 0 0 0 25px rgba(93,225,194,.025); }
.beta-reward > i { position: relative; z-index: 2; display: grid; width: 68px; height: 68px; border: 1px solid rgba(93,225,194,.4); border-radius: 20px; background: linear-gradient(145deg, rgba(93,225,194,.2), rgba(72,191,238,.08)); color: var(--mint); font-family: var(--display); font-size: 36px; font-style: normal; place-items: center; text-shadow: 0 0 22px rgba(93,225,194,.65); }
.beta-reward span { position: relative; z-index: 2; display: grid; gap: 2px; }
.beta-reward em { color: var(--mint); font-size: 9px; font-style: normal; font-weight: 800; letter-spacing: .13em; }
.beta-reward strong { margin: 2px 0 1px; color: #effcf8; font-family: var(--display); font-size: clamp(23px,2.2vw,31px); letter-spacing: -.04em; line-height: 1.05; }
.beta-reward b { color: #c6d9d8; font-size: 13px; }
.beta-reward small { margin-top: 2px; color: #89a8aa; font-size: 11px; line-height: 1.35; }
.beta-roles { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.beta-roles span { padding: 7px 10px; border: 1px solid rgba(135,153,255,.25); border-radius: 9px; background: rgba(122,139,255,.055); color: #9aa7c8; font-size: 9px; font-weight: 700; text-transform: uppercase; }
.beta-form { position: relative; margin-top: 20px; }
.beta-step { display: grid; gap: 9px; animation: betaStepIn .55s cubic-bezier(.2,.8,.2,1) both; }
.beta-step-label { display: flex; align-items: center; gap: 9px; color: #91a3b8; font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.beta-step-label i { color: #93a2ff; font-style: normal; }
.beta-form label { display: block; }
.beta-form input, .beta-form textarea { width: 100%; border: 1px solid rgba(126,167,190,.34); outline: 0; border-radius: 15px; background: rgba(3,19,28,.82); color: #e9f1f0; font: inherit; font-size: 14px; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.beta-form input { height: 60px; padding: 0 18px; }
.beta-form textarea { min-height: 142px; padding: 14px 16px; resize: vertical; line-height: 1.5; }
.beta-form input:focus, .beta-form textarea:focus { border-color: rgba(112,232,207,.48); background: rgba(6,26,34,.9); box-shadow: 0 0 0 4px rgba(93,225,194,.055); }
.beta-form input::placeholder, .beta-form textarea::placeholder { color: #4f6874; }
.beta-form button { display: flex; min-height: 60px; align-items: center; justify-content: space-between; padding: 0 10px 0 19px; border: 1px solid rgba(113,234,208,.52); border-radius: 15px; background: linear-gradient(135deg, #7af0d3, #5bd2e8); box-shadow: 0 15px 38px rgba(83,211,199,.16); color: #06231f; font-size: 13px; font-weight: 800; cursor: pointer; transition: transform .2s ease, filter .2s ease; }
.beta-form button:hover { filter: brightness(1.06); transform: translateY(-2px); }
.beta-form button i { display: grid; width: 35px; height: 35px; border-radius: 10px; background: rgba(4,35,31,.12); font-size: 15px; font-style: normal; place-items: center; }
.beta-form button:disabled { cursor: wait; filter: saturate(.5); opacity: .72; }
.beta-privacy { margin: 14px 0 0!important; color: #789095!important; font-size: 10px!important; line-height: 1.5!important; }
.form-message { min-height: 22px; margin-top: 9px; color: var(--mint); font-size: 10px; }
.form-message.is-error { color: var(--rose); }
.beta-panel.is-complete .beta-form, .beta-panel.is-complete .beta-privacy { display: none; }
.beta-panel.is-complete .form-message { min-height: 96px; display: grid; align-content: center; padding: 17px; border: 1px solid rgba(93,225,194,.2); border-radius: 15px; background: rgba(93,225,194,.07); color: #aee3d7; font-size: 9px; line-height: 1.5; }

.privacy { padding-top: 80px; padding-bottom: 160px; }
.privacy-card { position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 640px; padding: clamp(42px, 7vw, 92px); overflow: hidden; border: 1px solid rgba(115,202,200,.18); border-radius: 34px; background: linear-gradient(145deg, rgba(12,40,46,.92), rgba(4,18,24,.98)); }
.privacy-card::after { position: absolute; inset: 0; background: linear-gradient(115deg, rgba(255,255,255,.025), transparent 26%); content: ""; pointer-events: none; }
.privacy-aura { position: absolute; right: -10%; width: 60%; height: 90%; border-radius: 50%; background: radial-gradient(circle, rgba(93,225,194,.13), rgba(73,112,255,.06) 45%, transparent 70%); filter: blur(12px); }
.privacy-copy { position: relative; z-index: 2; }
.privacy-copy > p { margin-top: 28px; }
.privacy-points { display: grid; gap: 12px; margin-top: 30px; }
.privacy-points span { display: flex; align-items: center; gap: 11px; color: #9db3b4; font-size: 11px; }
.privacy-points i { display: grid; width: 20px; height: 20px; border: 1px solid rgba(93,225,194,.3); border-radius: 7px; background: rgba(93,225,194,.08); color: var(--mint); font-size: 8px; font-style: normal; place-items: center; }
.privacy-viz { position: relative; z-index: 2; display: grid; min-height: 400px; place-items: center; }
.shield-rings { position: absolute; display: grid; place-items: center; }
.shield-rings i { position: absolute; border: 1px solid rgba(99,213,193,.14); border-radius: 50%; animation: breathe 4s ease-in-out infinite; }
.shield-rings i:nth-child(1) { width: 180px; height: 180px; }
.shield-rings i:nth-child(2) { width: 280px; height: 280px; animation-delay: -1.2s; }
.shield-rings i:nth-child(3) { width: 390px; height: 390px; animation-delay: -2.4s; }
.shield-core { position: relative; z-index: 2; display: grid; width: 145px; height: 168px; align-content: center; border: 1px solid rgba(112,231,204,.36); border-radius: 64px 64px 76px 76px; background: linear-gradient(160deg, rgba(42,119,111,.75), rgba(7,31,39,.95)); clip-path: polygon(50% 0, 94% 18%, 86% 72%, 50% 100%, 14% 72%, 6% 18%); box-shadow: 0 0 80px rgba(93,225,194,.16); text-align: center; }
.shield-core span { color: white; font-family: var(--display); font-size: 39px; font-weight: 600; text-shadow: 0 0 22px rgba(93,225,194,.65); }
.shield-core small { color: var(--mint); font-size: 6px; font-weight: 800; letter-spacing: .18em; line-height: 1.4; }
.data-chip { position: absolute; z-index: 3; display: flex; align-items: center; gap: 8px; padding: 10px 13px; border: 1px solid rgba(110,193,193,.2); border-radius: 12px; background: rgba(7,26,33,.88); color: #8fa9aa; font-size: 8px; box-shadow: 0 16px 35px rgba(0,0,0,.25); backdrop-filter: blur(12px); }
.data-chip i { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 8px var(--mint); }
.chip-one { top: 22%; right: 1%; animation: float 5.2s ease-in-out infinite; }
.chip-two { bottom: 20%; left: 0; animation: float 6s ease-in-out -2s infinite; }

.support { padding-top: 20px; padding-bottom: 150px; }
.support-card { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(48px,7vw,100px); align-items: center; min-height: 700px; padding: clamp(42px,7vw,94px); overflow: hidden; border: 1px solid rgba(245,189,98,.2); border-radius: 36px; background: radial-gradient(circle at 77% 52%, rgba(245,189,98,.14), transparent 32%), radial-gradient(circle at 12% 85%, rgba(93,225,194,.08), transparent 29%), linear-gradient(145deg, rgba(34,30,25,.96), rgba(7,18,23,.99)); box-shadow: 0 50px 120px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.04); }
.support-card::after { position: absolute; top: -40%; left: 58%; width: 1px; height: 180%; background: linear-gradient(transparent, rgba(245,189,98,.24), transparent); content: ""; transform: rotate(21deg); }
.support-glow { position: absolute; top: 50%; right: 8%; width: 430px; height: 430px; border: 1px solid rgba(245,189,98,.09); border-radius: 50%; box-shadow: 0 0 0 70px rgba(245,189,98,.018), 0 0 0 140px rgba(245,189,98,.01); transform: translateY(-50%); }
.support-copy { position: relative; z-index: 3; }
.support-copy .eyebrow { color: var(--amber); }
.support-copy .eyebrow > span { background: linear-gradient(90deg, var(--amber), transparent); }
.support-copy h2 { margin: 0; font-family: var(--display); font-size: clamp(49px,5.5vw,78px); font-weight: 600; letter-spacing: -.065em; line-height: .98; }
.support-copy h2 em { color: #7f715c; }
.support-copy > p:not(.eyebrow) { max-width: 550px; margin: 28px 0 0; color: var(--muted); font-size: 16px; line-height: 1.75; }
.support-directions { display: grid; gap: 0; margin-top: 35px; }
.support-directions > span { display: grid; grid-template-columns: 31px 110px 1fr; align-items: center; gap: 11px; padding: 13px 0; border-top: 1px solid rgba(245,189,98,.1); }
.support-directions > span:last-child { border-bottom: 1px solid rgba(245,189,98,.1); }
.support-directions i { color: var(--amber); font-size: 6px; font-style: normal; }
.support-directions b { color: #bcb5a7; font-size: 9px; }
.support-directions small { color: #6d716d; font-size: 7px; }
.contribution-panel { position: relative; z-index: 4; padding: 32px; border: 1px solid rgba(245,189,98,.24); border-radius: 28px; background: linear-gradient(150deg, rgba(54,45,32,.82), rgba(12,27,30,.94)); box-shadow: 0 36px 90px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.055); }
.contribution-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid rgba(245,189,98,.12); color: #b99352; font-size: 6px; font-weight: 800; letter-spacing: .14em; }
.contribution-head i { color: #6f6758; font-style: normal; }
.contribution-value { display: grid; gap: 4px; margin: 34px 0 25px; }
.contribution-value small { color: #7b786e; font-size: 8px; }
.contribution-value strong { color: #f0cf91; font-family: var(--display); font-size: clamp(40px,4.2vw,60px); letter-spacing: -.06em; line-height: 1; text-shadow: 0 0 30px rgba(245,189,98,.12); }
.contribution-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.contribution-options button { min-height: 45px; border: 1px solid rgba(188,163,112,.18); border-radius: 12px; background: rgba(13,30,32,.55); color: #7e8179; font-size: 9px; font-weight: 700; cursor: pointer; transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease; }
.contribution-options button:hover { transform: translateY(-2px); }
.contribution-options button.is-active { border-color: rgba(245,189,98,.45); background: rgba(245,189,98,.1); color: #f0cc89; box-shadow: inset 0 0 22px rgba(245,189,98,.04); }
.contribution-action { display: flex; min-height: 58px; align-items: center; justify-content: space-between; margin-top: 12px; padding: 0 11px 0 19px; border: 1px solid rgba(245,189,98,.42); border-radius: 14px; background: linear-gradient(135deg, #f6cf89, #dea351); color: #2c1b06; font-size: 11px; font-weight: 800; box-shadow: 0 16px 40px rgba(229,166,74,.16); transition: transform .2s ease, filter .2s ease; }
.contribution-action:hover { filter: brightness(1.06); transform: translateY(-2px); }
.contribution-action i { display: grid; width: 38px; height: 38px; border-radius: 11px; background: rgba(60,34,4,.1); font-size: 16px; font-style: normal; place-items: center; }
.contribution-action { width: 100%; cursor: pointer; font-family: inherit; }
.contribution-custom { position: relative; display: grid; min-height: 45px; align-content: center; padding: 7px 10px; border: 1px solid rgba(188,163,112,.18); border-radius: 12px; background: rgba(13,30,32,.55); transition: border-color .2s ease, background .2s ease; }
.contribution-custom:focus-within, .contribution-custom.is-active { border-color: rgba(245,189,98,.45); background: rgba(245,189,98,.1); }
.contribution-custom > span { color: #777a72; font-size: 8px; font-weight: 700; }
.contribution-custom input { width: 100%; padding: 0; border: 0; outline: 0; appearance: textfield; -moz-appearance: textfield; background: transparent; color: #f0cc89; font-family: inherit; font-size: 12px; font-weight: 800; }
.contribution-custom input::-webkit-inner-spin-button,
.contribution-custom input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; }
.contribution-custom input::placeholder { color: #62675f; }
.contribution-form { display: grid; gap: 11px; margin-top: 16px; padding: 18px; border: 1px solid rgba(245,189,98,.15); border-radius: 18px; background: rgba(6,22,27,.72); animation: supportReveal .28s ease both; }
.contribution-form-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; color: #e6c98f; font-size: 11px; font-weight: 800; }
.contribution-form-head button { display: grid; width: 28px; height: 28px; border: 1px solid rgba(245,189,98,.15); border-radius: 9px; background: transparent; color: #8d8b80; cursor: pointer; place-items: center; }
.contribution-form > label:not(.contribution-anonymous) { display: grid; gap: 6px; }
.contribution-form > label > span { color: #a39f92; font-size: 10px; font-weight: 700; }
.contribution-form > label > span em { margin-left: 5px; color: #666e69; font-size: 8px; font-style: normal; font-weight: 500; }
.contribution-form input[type="email"], .contribution-form input[type="text"], .contribution-form textarea { width: 100%; border: 1px solid rgba(166,181,169,.16); border-radius: 11px; outline: 0; background: rgba(6,19,24,.8); color: #e8efeb; font: inherit; font-size: 12px; transition: border-color .2s ease, box-shadow .2s ease; }
.contribution-form input[type="email"], .contribution-form input[type="text"] { min-height: 43px; padding: 0 12px; }
.contribution-form textarea { min-height: 78px; padding: 11px 12px; resize: vertical; }
.contribution-form input:focus, .contribution-form textarea:focus { border-color: rgba(245,189,98,.4); box-shadow: 0 0 0 3px rgba(245,189,98,.05); }
.support-comment-policy { overflow: hidden; border: 1px solid rgba(118,163,158,.14); border-radius: 12px; background: rgba(9,29,34,.5); color: #83908c; }
.support-comment-policy summary { display: grid; min-height: 46px; grid-template-columns: 26px 1fr 20px; align-items: center; gap: 9px; padding: 7px 10px; cursor: pointer; list-style: none; }
.support-comment-policy summary::-webkit-details-marker { display: none; }
.support-comment-policy summary > i { display: grid; width: 24px; height: 24px; border: 1px solid rgba(91,207,193,.25); border-radius: 8px; background: rgba(62,181,168,.07); color: #70c9be; font-family: Georgia,serif; font-size: 12px; font-style: italic; place-items: center; }
.support-comment-policy summary > span { display: grid; gap: 2px; }
.support-comment-policy summary b { color: #b9c8c3; font-size: 10px; }
.support-comment-policy summary small { color: #697874; font-size: 9px; }
.support-comment-policy summary > em { color: #61716d; font-size: 14px; font-style: normal; text-align: center; transition: transform .2s ease,color .2s ease; }
.support-comment-policy[open] { border-color: rgba(91,207,193,.24); }
.support-comment-policy[open] summary > em { color: #7dd8cc; transform: rotate(45deg); }
.support-comment-policy > div { display: grid; gap: 8px; padding: 0 12px 12px 45px; border-top: 1px solid rgba(118,163,158,.08); }
.support-comment-policy p { margin: 10px 0 0; color: #84938f; font-size: 10px; line-height: 1.55; }
.support-comment-policy ul { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.support-comment-policy li { position: relative; padding-left: 12px; color: #788985; font-size: 9px; line-height: 1.5; }
.support-comment-policy li::before { position: absolute; top: .58em; left: 0; width: 4px; height: 4px; border-radius: 50%; background: #64bdb2; box-shadow: 0 0 8px rgba(100,189,178,.38); content: ""; }
.contribution-anonymous { display: flex; align-items: center; gap: 9px; min-height: 34px; cursor: pointer; }
.contribution-anonymous input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.contribution-anonymous > i { display: grid; width: 18px; height: 18px; border: 1px solid rgba(245,189,98,.25); border-radius: 6px; background: rgba(7,24,29,.8); place-items: center; }
.contribution-anonymous input:checked + i { border-color: #e9b960; background: #e9b960; }
.contribution-anonymous input:checked + i::after { color: #291b08; content: "✓"; font-size: 11px; font-style: normal; font-weight: 900; }
.contribution-pay { display: flex; min-height: 51px; align-items: center; justify-content: space-between; padding: 0 9px 0 16px; border: 0; border-radius: 12px; background: linear-gradient(135deg,#f6cf89,#dea351); color: #291b08; cursor: pointer; font-family: inherit; font-size: 11px; font-weight: 850; }
.contribution-pay i { display: grid; width: 34px; height: 34px; border-radius: 9px; background: rgba(51,29,4,.1); font-style: normal; place-items: center; }
.contribution-pay:disabled { cursor: wait; filter: grayscale(.45); opacity: .7; }
.contribution-payment { display: grid; justify-items: center; gap: 13px; margin-top: 16px; padding: 18px; border: 1px solid rgba(90,225,194,.22); border-radius: 19px; background: linear-gradient(145deg,rgba(11,56,57,.65),rgba(5,23,29,.9)); animation: supportReveal .28s ease both; }
.contribution-payment-head { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; }
.contribution-payment-head span { display: flex; align-items: center; gap: 7px; color: #6dcab7; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.contribution-payment-head span i { width: 6px; height: 6px; border-radius: 50%; background: #5de1c2; box-shadow: 0 0 10px #5de1c2; }
.contribution-payment-head strong { color: #c9f9ed; font-size: 15px; }
.contribution-payment img { width: min(250px,80%); aspect-ratio: 1; padding: 10px; border-radius: 18px; background: #fff; box-shadow: 0 20px 45px rgba(0,0,0,.28); }
.contribution-payment > p { margin: 0; color: #8aa49f; font-size: 10px; text-align: center; }
.contribution-payment > a { display: flex; width: 100%; min-height: 46px; align-items: center; justify-content: space-between; padding: 0 14px; border: 1px solid rgba(93,225,194,.25); border-radius: 12px; color: #78e2c9; font-size: 10px; font-weight: 800; }
.contribution-payment > a i { font-style: normal; }
.contribution-message { min-height: 0; margin-top: 10px; color: #9baca7; font-size: 10px; line-height: 1.5; }
.contribution-message.is-error { color: #ff9b91; }
.contribution-panel > p { margin: 12px 2px 0; color: #6c746f; font-size: 7px; line-height: 1.55; }
.contribution-foot { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 22px; padding-top: 17px; border-top: 1px solid rgba(245,189,98,.1); }
.contribution-foot span { display: flex; align-items: center; gap: 6px; color: #6c716c; font-size: 5px; font-weight: 800; letter-spacing: .1em; }
.contribution-foot i { width: 4px; height: 4px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 7px var(--amber); }
.supporters-toggle { display: flex; width: 100%; min-height: 38px; align-items: center; justify-content: space-between; margin-top: 12px; padding: 0 11px; border: 1px solid rgba(245,189,98,.12); border-radius: 11px; background: rgba(6,22,27,.48); color: #938d80; cursor: pointer; font-family: inherit; font-size: 9px; font-weight: 750; transition: border-color .2s ease, color .2s ease; }
.supporters-toggle:hover { border-color: rgba(245,189,98,.3); color: #dbc18e; }
.supporters-toggle i { font-style: normal; transition: transform .2s ease; }
.supporters-toggle[aria-expanded="true"] i { transform: rotate(180deg); }
.supporters-panel { position: relative; z-index: 4; grid-column: 1/-1; padding: clamp(25px,4vw,46px); overflow: hidden; border: 1px solid rgba(245,189,98,.2); border-radius: 30px; background: radial-gradient(circle at 88% 8%,rgba(128,82,255,.11),transparent 26%),radial-gradient(circle at 6% 100%,rgba(245,189,98,.08),transparent 28%),linear-gradient(145deg,rgba(20,38,40,.96),rgba(5,19,25,.98)); box-shadow: inset 0 1px rgba(255,255,255,.045),0 32px 85px rgba(0,0,0,.24); animation: supportReveal .32s ease both; }
.supporters-panel.section-shell { margin-top: 26px; margin-bottom: 90px; }
.supporters-panel::before { position: absolute; top: 0; right: 11%; left: 11%; height: 1px; background: linear-gradient(90deg,transparent,rgba(245,189,98,.7),rgba(112,87,255,.65),transparent); content: ""; }
.supporters-heading { position: relative; display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 24px; }
.supporters-heading span { color: #c29654; font-size: 9px; font-weight: 900; letter-spacing: .18em; }
.supporters-heading h3 { max-width: 760px; margin: 9px 0 0; color: #f1eee6; font-family: var(--display); font-size: clamp(29px,3.4vw,46px); font-weight: 600; letter-spacing: -.045em; line-height: 1.02; }
.supporters-heading > strong { display: grid; min-width: 132px; height: 78px; align-content: center; padding-inline: 18px; border: 1px solid rgba(245,189,98,.28); border-radius: 23px; background: radial-gradient(circle at 50% 0,rgba(245,189,98,.14),transparent 65%),rgba(9,25,30,.7); box-shadow: inset 0 1px rgba(255,255,255,.05),0 18px 38px rgba(0,0,0,.18); text-align: center; }
.supporters-heading > strong i { color: #f0ca82; font-family: var(--display); font-size: 26px; font-style: normal; line-height: 1; }
.supporters-heading > strong small { margin-top: 5px; color: #8b816f; font-size: 8px; font-weight: 900; letter-spacing: .1em; white-space: nowrap; }
.supporters-honor { position: relative; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 14px; margin-bottom: 17px; padding: 13px 16px; border: 1px solid rgba(245,189,98,.13); border-radius: 15px; background: linear-gradient(90deg,rgba(245,189,98,.055),rgba(111,80,205,.035)); }
.supporters-honor > i { display: grid; width: 42px; height: 42px; border: 1px solid rgba(245,189,98,.25); border-radius: 13px; color: #e7bc6d; font-size: 15px; font-style: normal; place-items: center; box-shadow: inset 0 0 20px rgba(245,189,98,.05); }
.supporters-honor > span { display: grid; gap: 3px; }
.supporters-honor b { color: #cfcac0; font-size: 11px; }
.supporters-honor small { color: #73807c; font-size: 10px; }
.supporters-honor em { color: #675f54; font-size: 7px; font-style: normal; font-weight: 900; letter-spacing: .13em; }
.supporters-filter { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 18px; margin: 0 0 13px; padding: 8px 10px 8px 15px; border: 1px solid rgba(94,213,196,.22); border-radius: 15px; background: linear-gradient(100deg,rgba(34,102,96,.16),rgba(8,28,34,.75)); box-shadow: inset 0 1px rgba(255,255,255,.035); animation: supportReveal .25s ease both; }
.supporters-filter > span { display: grid; gap: 2px; min-width: 0; }
.supporters-filter small { color: #5d817f; font-size: 7px; font-weight: 900; letter-spacing: .13em; }
.supporters-filter b { overflow: hidden; color: #bfe3de; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.supporters-filter button { display: inline-flex; min-height: 36px; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid rgba(110,205,193,.2); border-radius: 11px; background: rgba(10,38,43,.76); color: #8bb7b2; cursor: pointer; font-size: 9px; font-weight: 800; white-space: nowrap; transition: border-color .2s ease,color .2s ease,background .2s ease; }
.supporters-filter button:hover { border-color: rgba(113,226,209,.42); background: rgba(16,55,59,.9); color: #c8f0ea; }
.supporters-filter button i { color: #6bcabd; font-size: 15px; font-style: normal; line-height: 1; }
.supporters-table { position: relative; }
.supporters-row { display: grid; grid-template-columns: minmax(250px,1fr) minmax(260px,1.8fr) minmax(135px,.5fr); gap: 22px; align-items: center; }
.supporters-header { min-height: 37px; padding: 0 20px; color: #5d6865; font-size: 8px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.supporters-header > span:last-child { text-align: right; }
.supporters-person-row { position: relative; min-height: 102px; margin-top: 9px; padding: 15px 18px; overflow: hidden; border: 1px solid rgba(158,177,170,.12); border-radius: 20px; background: linear-gradient(110deg,rgba(14,38,42,.76),rgba(6,24,30,.9)); box-shadow: inset 0 1px rgba(255,255,255,.025),0 14px 30px rgba(0,0,0,.11); transition: border-color .28s ease,background .28s ease,box-shadow .28s ease,transform .28s ease; animation: supporterEnter .45s ease both; animation-delay: calc(var(--supporter-order) * 70ms); }
.supporters-person-row::before { position: absolute; top: 18%; bottom: 18%; left: 0; width: 2px; border-radius: 0 3px 3px 0; background: linear-gradient(transparent,#536c6b,transparent); content: ""; opacity: .55; }
.supporters-person-row:hover { border-color: rgba(245,189,98,.28); background: linear-gradient(110deg,rgba(22,48,49,.9),rgba(8,28,34,.97)); box-shadow: inset 0 1px rgba(255,255,255,.04),0 20px 42px rgba(0,0,0,.2); transform: translateX(4px); }
.supporters-person-row.is-admin { border-color: rgba(245,189,98,.2); background: radial-gradient(circle at 3% 50%,rgba(245,189,98,.08),transparent 24%),linear-gradient(110deg,rgba(35,42,39,.88),rgba(8,27,32,.95)); }
.supporters-person-row.is-admin::before { background: linear-gradient(transparent,#f0bd62,transparent); box-shadow: 0 0 13px rgba(240,189,98,.6); opacity: 1; }
.supporters-person-row.is-beta { border-color: rgba(125,102,255,.28); background: radial-gradient(circle at 2% 50%,rgba(112,82,255,.13),transparent 26%),linear-gradient(110deg,rgba(25,36,56,.92),rgba(7,27,34,.96)); box-shadow: inset 0 1px rgba(255,255,255,.04),0 15px 38px rgba(62,46,140,.1); }
.supporters-person-row.is-beta::before { background: linear-gradient(transparent,#856cff,#51ddcf,transparent); box-shadow: 0 0 16px rgba(118,98,255,.78); opacity: 1; }
.supporters-person-row.is-anonymous { background: linear-gradient(110deg,rgba(18,34,38,.64),rgba(6,23,29,.82)); }
.supporter-person { display: grid; grid-template-columns: 32px 49px minmax(0,1fr); align-items: center; gap: 11px; min-width: 0; }
.supporter-rank { color: #596764; font-size: 8px; font-weight: 900; letter-spacing: .07em; white-space: nowrap; }
.supporter-avatar { display: grid; width: 49px; height: 49px; border: 1px solid rgba(116,204,191,.18); border-radius: 15px; background: linear-gradient(145deg,rgba(38,101,98,.55),rgba(11,47,55,.9)); color: #83ded0; font-family: var(--display); font-size: 19px; font-style: normal; place-items: center; box-shadow: inset 0 1px rgba(255,255,255,.05),0 10px 24px rgba(0,0,0,.2); }
.is-admin .supporter-avatar { border-color: rgba(245,189,98,.35); background: linear-gradient(145deg,rgba(148,103,38,.62),rgba(50,38,26,.92)); color: #f5d18e; box-shadow: inset 0 1px rgba(255,255,255,.08),0 0 24px rgba(232,174,76,.12); }
.is-beta .supporter-avatar { border-color: rgba(133,108,255,.45); background: linear-gradient(145deg,rgba(116,81,232,.7),rgba(26,71,90,.92)); color: #ddfdfa; box-shadow: inset 0 1px rgba(255,255,255,.1),0 0 28px rgba(111,82,255,.2); }
.is-anonymous .supporter-avatar { filter: grayscale(.55); opacity: .78; }
.supporter-identity { display: grid; justify-items: start; gap: 7px; min-width: 0; }
.supporter-identity > strong { overflow: hidden; max-width: 100%; color: #f1eee7; font-size: 14px; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.supporter-badges { display: flex; flex-wrap: wrap; gap: 5px; }
.supporter-badge { position: relative; display: inline-flex; min-height: 24px; align-items: center; gap: 6px; padding: 0 9px; overflow: hidden; border: 1px solid rgba(245,189,98,.32); border-radius: 999px; background: linear-gradient(115deg,rgba(245,189,98,.18),rgba(103,65,14,.07)); color: #f1ca80; box-shadow: inset 0 1px rgba(255,255,255,.07),0 7px 20px rgba(0,0,0,.16); }
.supporter-badge::after { position: absolute; top: -40%; bottom: -40%; left: -45%; width: 28%; background: linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent); content: ""; transform: rotate(16deg); animation: badgeGleam 5.5s ease-in-out infinite; }
.supporter-badge > span { display: grid; width: 15px; height: 15px; border-radius: 50%; background: rgba(245,189,98,.12); font-size: 8px; place-items: center; }
.supporter-badge > b { font-size: 8px; font-weight: 950; letter-spacing: .065em; text-transform: uppercase; }
.supporter-badge.is-beta { border-color: rgba(133,108,255,.48); background: linear-gradient(110deg,rgba(112,82,255,.28),rgba(66,214,202,.13)); color: #d9fffa; box-shadow: inset 0 1px rgba(255,255,255,.1),0 0 20px rgba(104,81,236,.16); }
.supporter-badge.is-beta > span { background: linear-gradient(145deg,#8068ff,#43cdbf); color: white; box-shadow: 0 0 12px rgba(109,91,243,.48); }
.supporter-badge:is(button) { cursor: pointer; font-family: inherit; transition: border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease; }
.supporter-badge:is(button):hover { transform: translateY(-1px); }
.supporter-badge.is-repeat { border-color: rgba(133,158,157,.2); background: rgba(87,112,111,.08); color: #899b98; box-shadow: none; }
.supporter-badge.is-repeat::after { display: none; }
.supporter-badge.is-repeat > span { background: rgba(130,153,150,.1); color: #8fa6a2; box-shadow: none; }
.supporter-badge.is-repeat:hover { border-color: rgba(133,193,184,.34); background: rgba(91,137,130,.13); color: #b5d1cc; }
.supporter-comment { display: grid; grid-template-columns: 25px 1fr; align-items: start; gap: 9px; color: #aeb9b5; font-size: 11px; line-height: 1.55; }
.supporter-quote { color: rgba(245,189,98,.47); font-family: Georgia,serif; font-size: 28px; font-style: normal; line-height: .9; }
.supporter-amount { display: grid; justify-items: end; gap: 5px; }
.supporter-amount small { color: #6d7772; font-size: 8px; font-weight: 900; letter-spacing: .14em; }
.supporter-amount strong { min-width: 118px; padding: 10px 12px; border: 1px solid rgba(245,189,98,.25); border-radius: 13px; background: linear-gradient(135deg,rgba(245,189,98,.12),rgba(245,189,98,.035)); color: #f2ce8b; font-family: var(--display); font-size: 18px; letter-spacing: -.025em; text-align: center; box-shadow: inset 0 1px rgba(255,255,255,.04),0 8px 25px rgba(0,0,0,.12); }
.is-beta .supporter-amount strong { border-color: rgba(125,105,248,.3); background: linear-gradient(135deg,rgba(111,82,255,.13),rgba(67,207,193,.06)); color: #bfece7; }
.supporters-beta-note { display: grid; grid-template-columns: 45px 1fr auto; align-items: center; gap: 14px; margin-top: 17px; padding: 14px 17px; border: 1px solid rgba(126,104,255,.25); border-radius: 16px; background: radial-gradient(circle at 0 50%,rgba(112,82,255,.15),transparent 25%),linear-gradient(100deg,rgba(27,34,56,.84),rgba(7,26,33,.82)); box-shadow: inset 0 1px rgba(255,255,255,.04); }
.supporters-beta-note > i { display: grid; width: 45px; height: 45px; border: 1px solid rgba(135,112,255,.38); border-radius: 14px; background: linear-gradient(145deg,rgba(119,84,241,.65),rgba(39,98,111,.68)); color: white; font-family: Georgia,serif; font-size: 20px; font-style: normal; place-items: center; box-shadow: 0 0 25px rgba(109,84,235,.16); }
.supporters-beta-note > span { display: grid; gap: 4px; }
.supporters-beta-note b { color: #d7e9e6; font-size: 11px; }
.supporters-beta-note small { color: #879b98; font-size: 10px; }
.supporters-beta-note em { color: #73699f; font-size: 7px; font-style: normal; font-weight: 900; letter-spacing: .13em; }
.supporters-loader { position: relative; display: grid; width: 100%; min-height: 68px; grid-template-columns: 38px 1fr 28px; align-items: center; gap: 13px; margin-top: 14px; padding: 10px 15px; overflow: hidden; border: 1px solid rgba(112,177,169,.14); border-radius: 17px; background: linear-gradient(100deg,rgba(12,37,41,.72),rgba(7,25,31,.84)); color: #879894; cursor: pointer; font-family: inherit; text-align: left; transition: border-color .25s ease,background .25s ease,transform .25s ease; }
.supporters-loader:hover { border-color: rgba(245,189,98,.28); background: linear-gradient(100deg,rgba(20,46,46,.82),rgba(9,29,35,.94)); transform: translateY(-2px); }
.supporters-loader > i { position: relative; display: grid; width: 38px; height: 38px; border: 1px solid rgba(93,225,194,.2); border-radius: 12px; background: rgba(93,225,194,.05); place-items: center; }
.supporters-loader > i::before, .supporters-loader > i::after, .supporters-loader > i span { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #6bc9bd; box-shadow: 0 0 10px rgba(107,201,189,.5); content: ""; }
.supporters-loader > i::before { transform: translate(-8px,2px); }
.supporters-loader > i::after { transform: translate(8px,-3px); }
.supporters-loader > i span { transform: translate(0,-8px); }
.supporters-loader > span { display: grid; gap: 3px; }
.supporters-loader b { color: #b3c2be; font-size: 10px; }
.supporters-loader small { color: #65736f; font-size: 9px; }
.supporters-loader > em { color: #687875; font-size: 15px; font-style: normal; text-align: center; }
.supporters-loader.is-loading > i { animation: supporterLoaderSpin 1.25s linear infinite; }
.supporters-loader.is-loading > em { animation: supporterLoaderDrop .85s ease-in-out infinite alternate; }
.supporters-loader:disabled { cursor: wait; opacity: .75; transform: none; }
.supporters-complete { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 13px; margin-top: 14px; padding: 15px 17px; border: 1px solid rgba(245,189,98,.13); border-radius: 17px; background: linear-gradient(100deg,rgba(245,189,98,.055),rgba(10,29,34,.72)); }
.supporters-complete > i { display: grid; width: 42px; height: 42px; border: 1px solid rgba(245,189,98,.23); border-radius: 13px; color: #dfb96f; font-family: Georgia,serif; font-size: 21px; font-style: normal; place-items: center; }
.supporters-complete > span { display: grid; gap: 3px; }
.supporters-complete b { color: #c5c3b9; font-size: 10px; }
.supporters-complete small { color: #697570; font-size: 9px; }
.supporters-complete > em { color: #6e6557; font-size: 7px; font-style: normal; font-weight: 900; letter-spacing: .13em; }
.supporters-empty { margin: 0; padding: 25px; color: #777f7a; font-size: 11px; text-align: center; }
@keyframes supporterEnter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes badgeGleam { 0%,72%,100% { left: -45%; } 88% { left: 120%; } }
@keyframes supporterLoaderSpin { to { transform: rotate(360deg); } }
@keyframes supporterLoaderDrop { to { transform: translateY(4px); } }
@keyframes supportReveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* Readability floor: decorative microcopy must remain readable on large screens. */
body small,
body :is(
  .hero-ai-name b, .hero-ai-live, .hero-foot p, .app-status, .app-user, .pulse-label,
  .command-card p, .command-card kbd, .metric-card header span, .metric-card header b,
  .metric-card footer, .metric-payment > p, .metric-home li, .note-one span, .note-two span,
  .core span, .orbit-node-index, .orbit-node-copy b, .module-stat span, .finance-total span,
  .receipt-head span, .receipt-head b, .receipt-line, .receipt-line b,
  .home-task-main b, .home-task-main p, .home-task-person, .home-task-meta, .home-task-meta b,
  .bento-live, .meal-days > button, .meal-current > span em, .list-summary b, .list-items > button, .list-items i, .list-items b,
  .product-stars em, .product-card-preview p, .product-signals i, .product-signals b,
  .product-story-nav button, .product-stage > span small, .product-stage > span b, .product-comments em, .product-ai-note b, .bank-sync-head, .goal-copy > span, .goal-copy p i, .goal-copy p b,
  .roadmap-note, .horizon-code, .future-badge, .feature-pills li, .project-head,
  .project-head b, .task-row, .task-row > b, .team-stack span, .activity-stats b,
  .wellbeing-stream > span, .wellbeing-stream b, .wellbeing-note > span,
  .habit-title, .habit-title b, .habit-week > span, .habit-week i, .habit-viz > p,
  .day-head, .day-head strong, .day-timeline > span, .day-timeline > span b, .day-timeline > span em, .day-timeline > u > small, .life-node, .ai-principles span, .ai-principles i, .neural-core b,
  .neural-signal span, .intelligence-copy li span, .assistant-head b,
  .insight-card > span, .ai-message button, .assistant-input,
  .development-status small, .development-status b, .development-status em, .beta-number,
  .development-progress b, .development-progress small, .privacy-points i,
  .data-chip, .support-directions i, .support-directions b, .contribution-head,
  .contribution-options button, .contribution-panel > p, .contribution-foot span,
  .footer-meta
) { font-size: 10px!important; line-height: 1.35; }

body :is(
  .eyebrow, .module-story > div:nth-child(2) > p:first-child, .bento-copy p,
  .horizon-copy > p:first-child, .beta-panel > p:first-of-type, .beta-step-label
) { font-size: 11px!important; }

.beta-reward em { font-size: 10px!important; }
.beta-reward b { font-size: 14px!important; }
.beta-reward small { font-size: 12px!important; }
.beta-roles span { font-size: 10px!important; }
.beta-privacy, .form-message { font-size: 11px!important; }

.final-cta { padding: 70px 0 120px; }
.cta-card { position: relative; display: grid; min-height: 580px; align-content: center; justify-items: center; padding: 70px 24px; overflow: hidden; border: 1px solid rgba(115,207,200,.16); border-radius: 34px; background: radial-gradient(circle at 50% 110%, rgba(93,225,194,.16), transparent 44%), linear-gradient(145deg, rgba(10,38,45,.92), rgba(4,17,23,.98)); text-align: center; }
.cta-card::before { position: absolute; width: 570px; height: 570px; border: 1px solid rgba(93,225,194,.08); border-radius: 50%; content: ""; }
.cta-orbit { position: absolute; width: 430px; height: 430px; border: 1px dashed rgba(93,225,194,.12); border-radius: 50%; animation: orbitSpin 40s linear infinite; }
.cta-orbit::before, .cta-orbit::after { position: absolute; border-radius: 50%; content: ""; }
.cta-orbit::before { top: 8px; left: 95px; width: 8px; height: 8px; background: var(--mint); box-shadow: 0 0 18px var(--mint); }
.cta-orbit::after { right: 20px; bottom: 100px; width: 5px; height: 5px; background: var(--blue); box-shadow: 0 0 14px var(--blue); }
.cta-card > *:not(.cta-orbit) { position: relative; z-index: 2; }
.cta-card .eyebrow { margin-bottom: 25px; }
.cta-card > p:not(.eyebrow) { max-width: 600px; margin: 28px auto 34px; color: var(--muted); font-size: 16px; }
.button-large { min-height: 60px; padding-inline: 30px; border-radius: 17px; }
.site-footer { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 32px; padding: 0 0 45px; }
.site-footer > p { margin: 0; color: #536f74; font-size: 10px; line-height: 1.5; text-transform: uppercase; }
.footer-meta { display: flex; flex-wrap: wrap; justify-content: end; gap: 24px; color: #536e73; font-size: 9px; text-transform: uppercase; }
.footer-meta a:hover { color: var(--mint); }
.site-footer-dock {
  position: fixed;
  z-index: 48;
  right: auto;
  bottom: 10px;
  left: 50%;
  display: grid;
  width: min(1280px,calc(100% - 36px));
  min-height: 66px;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 28px;
  margin: 0;
  padding: 9px 13px;
  border: 1px solid rgba(117,188,186,.16);
  border-radius: 18px;
  background: linear-gradient(110deg,rgba(7,23,29,.92),rgba(9,28,35,.86));
  box-shadow: 0 20px 60px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.045);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%,calc(100% + 28px));
  transition: opacity .28s ease,transform .38s cubic-bezier(.2,.8,.2,1),border-color .28s ease;
  backdrop-filter: blur(22px) saturate(135%);
}
.site-footer-dock.is-visible { border-color: rgba(117,210,196,.24); opacity: 1; pointer-events: auto; transform: translate(-50%,0); }
.site-footer-dock > p { display: none; }
.site-footer-dock .brand { gap: 9px; }
.site-footer-dock .brand-mark { width: 36px; height: 36px; border-radius: 11px; }
.site-footer-dock .brand-name { font-size: 15px; }
.site-footer-dock .footer-meta { justify-content: end; gap: clamp(12px,2vw,24px); font-size: 8px; }

.cookie-notice {
  position: fixed;
  z-index: 140;
  bottom: 18px;
  right: 18px;
  display: grid;
  width: min(520px,calc(100% - 36px));
  min-height: 90px;
  grid-template-columns: 44px minmax(0,1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
  overflow: hidden;
  border: 1px solid rgba(111,211,198,.28);
  border-radius: 18px;
  background:
    radial-gradient(circle at 10% 0,rgba(93,225,194,.11),transparent 28%),
    linear-gradient(125deg,rgba(8,29,36,.98),rgba(5,18,24,.97));
  box-shadow: 0 28px 80px rgba(0,0,0,.52),inset 0 1px rgba(255,255,255,.055);
  opacity: 0;
  transform: translate3d(0,calc(100% + 42px),0);
  transition: opacity .28s ease,transform .46s cubic-bezier(.2,.82,.2,1);
  backdrop-filter: blur(24px) saturate(135%);
}
.cookie-notice::before { position: absolute; top: 0; right: 20px; left: 20px; height: 1px; background: linear-gradient(90deg,transparent,var(--mint),var(--cyan),transparent); opacity: .7; content: ""; }
.cookie-notice.is-visible { opacity: 1; transform: translate3d(0,0,0); }
.cookie-notice-mark { position: relative; display: grid; width: 44px; height: 44px; border: 1px solid rgba(93,225,194,.28); border-radius: 14px; background: linear-gradient(145deg,rgba(93,225,194,.16),rgba(72,191,238,.055)); place-items: center; }
.cookie-notice-mark span { width: 19px; height: 19px; border: 2px solid var(--mint); border-radius: 50%; box-shadow: 0 0 20px rgba(93,225,194,.18); }
.cookie-notice-mark span::before, .cookie-notice-mark span::after, .cookie-notice-mark i, .cookie-notice-mark b { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 8px rgba(93,225,194,.45); content: ""; }
.cookie-notice-mark span::before { top: 13px; left: 19px; }
.cookie-notice-mark span::after { right: 12px; bottom: 13px; }
.cookie-notice-mark i { bottom: 13px; left: 14px; }
.cookie-notice-mark b { top: 18px; right: 13px; }
.cookie-notice-copy { display: grid; min-width: 0; gap: 3px; }
.cookie-notice-copy strong { font-family: var(--display); font-size: 14px; line-height: 1.2; letter-spacing: -.025em; }
.cookie-notice-copy p { margin: 0; color: #94aaad; font-size: 10px; line-height: 1.4; }
.cookie-notice-copy a { width: max-content; margin-top: 2px; color: var(--mint); font-size: 9px; font-weight: 750; letter-spacing: .02em; }
.cookie-notice-copy a span { display: inline-block; margin-left: 3px; transition: transform .2s ease; }
.cookie-notice-copy a:hover span { transform: translate(2px,-2px); }
.cookie-notice > button { min-width: 88px; min-height: 40px; padding: 0 14px; border: 1px solid rgba(93,225,194,.35); border-radius: 11px; background: linear-gradient(135deg,var(--mint),#6bd5dc); box-shadow: 0 12px 30px rgba(56,209,184,.13); color: #042029; font-size: 11px; font-weight: 800; cursor: pointer; transition: transform .2s ease,box-shadow .2s ease; }
.cookie-notice > button:hover { box-shadow: 0 16px 36px rgba(56,209,184,.21); transform: translateY(-2px); }
.cookie-notice > button:focus-visible, .cookie-notice-copy a:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }

.legal-body { background: radial-gradient(circle at 80% 10%,rgba(88,107,255,.09),transparent 28rem),linear-gradient(180deg,#07171d 0%,var(--bg) 48%,var(--bg-deep) 100%); }
.legal-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 24px; }
.legal-back { display: inline-flex; min-height: 44px; align-items: center; gap: 10px; padding: 0 17px; border: 1px solid var(--line); border-radius: 14px; background: rgba(8,29,36,.6); color: #9bb1b4; font-size: 12px; font-weight: 700; transition: border-color .2s ease,color .2s ease,transform .2s ease; }
.legal-back:hover { border-color: var(--line-bright); color: var(--text); transform: translateY(-1px); }
.legal-page { padding-top: clamp(88px,12vw,160px); padding-bottom: 120px; }
.legal-hero { position: relative; max-width: 1030px; padding-bottom: clamp(70px,9vw,120px); }
.legal-hero::after { position: absolute; right: -10vw; bottom: 8%; width: 360px; height: 360px; border: 1px solid rgba(93,225,194,.055); border-radius: 50%; box-shadow: 0 0 90px rgba(93,225,194,.035),inset 0 0 70px rgba(93,225,194,.025); content: ""; pointer-events: none; }
.legal-hero h1 { max-width: 940px; margin: 24px 0 28px; font-family: var(--display); font-size: clamp(58px,8.5vw,118px); font-weight: 650; line-height: .88; letter-spacing: -.075em; }
.legal-hero h1 em { color: #7890b5; font-style: normal; }
.legal-hero > p:not(.eyebrow) { max-width: 760px; margin: 0; color: #9ab0b3; font-size: clamp(17px,1.6vw,21px); line-height: 1.65; }
.legal-meta { display: grid; max-width: 920px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 44px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--line); }
.legal-meta span { display: grid; gap: 4px; padding: 18px 20px; background: rgba(7,27,34,.96); }
.legal-meta small { color: #5f7d81; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.legal-meta b { overflow: hidden; color: #c7d9d8; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.legal-document { display: grid; grid-template-columns: 250px minmax(0,1fr); align-items: start; gap: clamp(42px,7vw,100px); }
.legal-toc { position: sticky; top: 32px; display: grid; gap: 2px; padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: rgba(7,25,32,.72); box-shadow: 0 25px 70px rgba(0,0,0,.18); backdrop-filter: blur(18px); }
.legal-toc > span { padding: 4px 10px 12px; color: #5c7b7e; font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.legal-toc a { display: grid; min-height: 42px; grid-template-columns: 29px 1fr; align-items: center; padding: 7px 9px; border-radius: 11px; color: #819a9d; font-size: 11px; font-weight: 650; line-height: 1.25; transition: background .2s ease,color .2s ease; }
.legal-toc a:hover { background: rgba(93,225,194,.07); color: #dceae8; }
.legal-toc i { color: var(--mint); font-size: 8px; font-style: normal; letter-spacing: .06em; }
.legal-content { min-width: 0; }
.legal-content section { position: relative; padding: 0 0 68px 68px; scroll-margin-top: 36px; }
.legal-content section + section { padding-top: 68px; border-top: 1px solid rgba(126,179,184,.12); }
.legal-index { position: absolute; top: 4px; left: 0; display: grid; width: 42px; height: 42px; border: 1px solid rgba(93,225,194,.2); border-radius: 13px; background: rgba(93,225,194,.055); color: var(--mint); font-size: 10px; font-weight: 800; place-items: center; }
.legal-content section + section .legal-index { top: 72px; }
.legal-content h2 { margin: 0 0 22px; font-family: var(--display); font-size: clamp(31px,3.4vw,48px); font-weight: 650; line-height: 1.05; letter-spacing: -.055em; }
.legal-content h3 { margin: 34px 0 15px; color: #d9e8e6; font-family: var(--display); font-size: clamp(20px,2vw,27px); font-weight: 650; letter-spacing: -.035em; }
.legal-content p { max-width: 820px; margin: 0 0 18px; color: #a2b6b7; font-size: 17px; line-height: 1.78; }
.legal-content p b { color: #d8e5e3; }
.legal-content p a { color: var(--mint); text-decoration: underline; text-decoration-color: rgba(93,225,194,.28); text-underline-offset: 4px; }
.cookie-category-grid { display: grid; gap: 10px; margin: 30px 0; }
.cookie-category { display: grid; min-height: 104px; grid-template-columns: 54px 1fr; align-items: center; gap: 17px; padding: 18px; border: 1px solid rgba(115,177,183,.15); border-radius: 20px; background: linear-gradient(125deg,rgba(11,37,44,.72),rgba(6,24,31,.7)); }
.cookie-category > i { display: grid; width: 54px; height: 54px; border: 1px solid rgba(101,119,255,.26); border-radius: 17px; background: rgba(101,119,255,.08); color: #8f9cff; font-size: 11px; font-style: normal; font-weight: 800; place-items: center; }
.cookie-category > span { display: grid; gap: 2px; }
.cookie-category small { color: #708d90; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cookie-category b { font-family: var(--display); font-size: 18px; letter-spacing: -.025em; }
.cookie-category p { margin: 2px 0 0; color: #819a9d; font-size: 13px; line-height: 1.5; }
.cookie-category.is-essential { border-color: rgba(93,225,194,.25); background: linear-gradient(125deg,rgba(17,55,55,.75),rgba(6,27,33,.72)); }
.cookie-category.is-essential > i { border-color: rgba(93,225,194,.3); background: rgba(93,225,194,.1); color: var(--mint); }
.cookie-category.is-off { opacity: .72; }
.cookie-table-wrap { margin: 30px 0 22px; overflow-x: auto; border: 1px solid rgba(115,177,183,.15); border-radius: 20px; }
.cookie-table { width: 100%; min-width: 650px; border-collapse: collapse; background: rgba(6,24,31,.62); }
.cookie-table th, .cookie-table td { padding: 17px 19px; border-bottom: 1px solid rgba(115,177,183,.1); text-align: left; }
.cookie-table tr:last-child td { border-bottom: 0; }
.cookie-table th { color: #628084; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cookie-table td { color: #9db1b3; font-size: 13px; }
.cookie-table td:last-child { color: #d1dedd; white-space: nowrap; }
.cookie-table code { display: inline-block; padding: 4px 7px; border: 1px solid rgba(93,225,194,.14); border-radius: 7px; background: rgba(93,225,194,.05); color: var(--mint); font-family: "Cascadia Code","SFMono-Regular",Consolas,monospace; font-size: 11px; }
.legal-note { padding: 17px 19px; border-left: 2px solid var(--amber); border-radius: 0 14px 14px 0; background: rgba(245,189,98,.05); color: #9fa89c!important; font-size: 14px!important; }
.legal-list { display: grid; gap: 11px; margin: 26px 0 0; padding: 0; list-style: none; }
.legal-list li { position: relative; padding: 14px 18px 14px 45px; border: 1px solid rgba(115,177,183,.12); border-radius: 15px; background: rgba(8,29,36,.5); color: #a2b6b7; font-size: 15px; }
.legal-list li::before { position: absolute; top: 19px; left: 19px; width: 8px; height: 8px; border: 1px solid var(--mint); border-radius: 50%; box-shadow: 0 0 12px rgba(93,225,194,.2); content: ""; }
.legal-list li b { color: #d9e8e6; }
.legal-list li a { color: var(--mint); text-decoration: underline; text-decoration-color: rgba(93,225,194,.28); text-underline-offset: 4px; }
.offer-requisites { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.offer-requisites > span { display: grid; min-height: 98px; align-content: center; gap: 9px; padding: 20px 22px; border: 1px solid rgba(93,225,194,.15); border-radius: 18px; background: linear-gradient(145deg,rgba(13,45,52,.72),rgba(7,28,35,.72)); }
.offer-requisites > span:first-child { grid-column: 1/-1; }
.offer-requisites small { color: #68868a; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.offer-requisites b { color: #e6f1ef; font-family: var(--display); font-size: clamp(17px,1.8vw,23px); letter-spacing: -.025em; }
.offer-requisites a { color: inherit; }
.payment-result-body { min-height: 100vh; }
.payment-result { display: grid; min-height: 100vh; grid-template-rows: auto 1fr auto; gap: 30px; padding-block: 28px; }
.payment-result > .brand { width: max-content; }
.payment-result-card { position: relative; display: grid; width: min(760px,100%); align-self: center; justify-self: center; justify-items: start; padding: clamp(34px,6vw,74px); overflow: hidden; border: 1px solid rgba(93,225,194,.22); border-radius: 34px; background: radial-gradient(circle at 88% 5%,rgba(93,225,194,.13),transparent 24rem),linear-gradient(145deg,rgba(15,47,54,.95),rgba(5,21,28,.98)); box-shadow: 0 42px 110px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.06); }
.payment-result-card::before { position: absolute; top: 0; right: 12%; left: 12%; height: 1px; background: linear-gradient(90deg,transparent,var(--mint),transparent); content: ""; }
.payment-result-card.is-fail { border-color: rgba(245,189,98,.25); background: radial-gradient(circle at 88% 5%,rgba(245,189,98,.12),transparent 24rem),linear-gradient(145deg,rgba(49,41,30,.93),rgba(5,21,28,.98)); }
.payment-result-card.is-fail::before { background: linear-gradient(90deg,transparent,var(--amber),transparent); }
.payment-result-mark { display: grid; width: 62px; height: 62px; margin-bottom: 35px; border: 1px solid rgba(93,225,194,.3); border-radius: 20px; background: rgba(93,225,194,.1); color: var(--mint); font-size: 25px; font-weight: 800; place-items: center; box-shadow: 0 0 35px rgba(93,225,194,.12); }
.is-fail .payment-result-mark { border-color: rgba(245,189,98,.35); background: rgba(245,189,98,.1); color: var(--amber); box-shadow: 0 0 35px rgba(245,189,98,.1); }
.payment-result-card h1 { margin: 18px 0 22px; font-family: var(--display); font-size: clamp(51px,7vw,88px); font-weight: 600; line-height: .94; letter-spacing: -.07em; }
.payment-result-card h1 em { color: var(--mint); font-style: normal; }
.payment-result-card.is-fail h1 em { color: var(--amber); }
.payment-result-card > p:not(.eyebrow) { max-width: 620px; margin: 0 0 30px; color: #9db0b1; font-size: 17px; line-height: 1.7; }
.payment-result-card > .button { min-width: 250px; }
.payment-result-card > small { max-width: 580px; margin-top: 22px; color: #61777a; font-size: 10px; line-height: 1.55; }
.payment-result-legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 22px; color: #587075; font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.payment-result-legal a:hover { color: var(--mint); }
.legal-reset { display: inline-flex; min-height: 50px; align-items: center; gap: 22px; margin-top: 12px; padding: 0 18px; border: 1px solid rgba(93,225,194,.25); border-radius: 15px; background: rgba(93,225,194,.07); color: #cce1de; font-weight: 750; cursor: pointer; transition: border-color .2s ease,background .2s ease,transform .2s ease; }
.legal-reset:hover { border-color: rgba(93,225,194,.48); background: rgba(93,225,194,.11); transform: translateY(-1px); }
.legal-reset i { color: var(--mint); font-size: 19px; font-style: normal; }
.legal-footer { padding-top: 38px; border-top: 1px solid rgba(126,179,184,.1); }

@media (max-width: 820px) {
  .legal-page { padding-top: 100px; }
  .legal-document { grid-template-columns: 1fr; gap: 35px; }
  .legal-toc { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .legal-toc > span { grid-column: 1/-1; }
}

@media (max-width: 560px) {
  .cookie-notice { right: 10px; bottom: 10px; width: min(390px,calc(100% - 20px)); min-height: 0; grid-template-columns: 36px minmax(0,1fr) auto; gap: 9px; padding: 10px; border-radius: 16px; }
  .cookie-notice-mark { width: 36px; height: 36px; border-radius: 11px; }
  .cookie-notice-mark span { width: 16px; height: 16px; }
  .cookie-notice-mark span::before { top: 10px; left: 15px; }
  .cookie-notice-mark span::after { right: 9px; bottom: 10px; }
  .cookie-notice-mark i { bottom: 10px; left: 10px; }
  .cookie-notice-mark b { top: 14px; right: 10px; }
  .cookie-notice-copy strong { font-size: 12px; }
  .cookie-notice-copy p { font-size: 9px; line-height: 1.35; }
  .cookie-notice-copy a { font-size: 9px; }
  .cookie-notice > button { min-width: 68px; min-height: 36px; padding-inline: 10px; font-size: 10px; }
  .legal-header { padding-top: 14px; }
  .legal-header .brand-name { display: none; }
  .legal-back { min-height: 40px; padding-inline: 13px; font-size: 10px; }
  .legal-page { padding-top: 76px; padding-bottom: 85px; }
  .legal-hero { padding-bottom: 70px; }
  .legal-hero h1 { margin-top: 20px; font-size: clamp(47px,15vw,70px); }
  .legal-hero > p:not(.eyebrow) { font-size: 16px; }
  .legal-meta { grid-template-columns: 1fr; }
  .legal-meta span { padding: 14px 16px; }
  .legal-toc { grid-template-columns: 1fr; padding: 12px; border-radius: 16px; }
  .legal-toc > span { grid-column: 1; }
  .legal-content section, .legal-content section + section { padding-right: 0; padding-bottom: 55px; padding-left: 0; }
  .legal-content section + section { padding-top: 55px; }
  .legal-index { position: static; width: 37px; height: 37px; margin-bottom: 18px; border-radius: 11px; }
  .legal-content section + section .legal-index { position: static; }
  .legal-content h2 { margin-bottom: 18px; font-size: 32px; }
  .legal-content h3 { margin-top: 28px; font-size: 23px; }
  .legal-content p { font-size: 15px; line-height: 1.7; }
  .cookie-category { grid-template-columns: 44px 1fr; gap: 12px; padding: 14px; border-radius: 16px; }
  .cookie-category > i { width: 44px; height: 44px; border-radius: 13px; }
  .cookie-category b { font-size: 16px; }
  .cookie-category p { font-size: 11px; }
  .cookie-table th, .cookie-table td { padding: 14px; }
  .legal-list li { font-size: 13px; }
  .offer-requisites { grid-template-columns: 1fr; }
  .offer-requisites > span:first-child { grid-column: auto; }
  .offer-requisites > span { min-height: 82px; padding: 17px; }
  .payment-result { padding-block: 16px; }
  .payment-result-card { padding: 30px 21px; border-radius: 24px; }
  .payment-result-mark { width: 52px; height: 52px; margin-bottom: 26px; border-radius: 16px; }
  .payment-result-card h1 { font-size: clamp(46px,14vw,62px); }
  .payment-result-card > p:not(.eyebrow) { font-size: 14px; }
  .payment-result-card > .button { width: 100%; min-width: 0; }
  .payment-result-legal { gap: 14px; font-size: 8px; }
  .legal-reset { width: 100%; justify-content: space-between; }
}

.reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1); }
.reveal.reveal-left { transform: translate3d(-36px,12px,0); }
.reveal.reveal-right { transform: translate3d(36px,12px,0); }
.reveal.reveal-scale { transform: translateY(22px) scale(.975); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: .08s; }
.reveal-delay-2 { transition-delay: .16s; }
.reveal-delay-3 { transition-delay: .24s; }
.reveal-delay-4 { transition-delay: .32s; }

@keyframes ambientMove { to { transform: translate3d(7vw, 5vh, 0) scale(1.12); } }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(251,119,140,.55); } 70% { box-shadow: 0 0 0 7px rgba(251,119,140,0); } 100% { box-shadow: 0 0 0 0 rgba(251,119,140,0); } }
@keyframes pulseMint { 0% { box-shadow: 0 0 0 0 rgba(93,225,194,.48); } 70% { box-shadow: 0 0 0 9px rgba(93,225,194,0); } 100% { box-shadow: 0 0 0 0 rgba(93,225,194,0); } }
@keyframes orbitSpin { to { transform: rotate(360deg); } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes breathe { 0%,100% { opacity: .35; transform: scale(.97); } 50% { opacity: .75; transform: scale(1.03); } }
@keyframes dataParticle {
  0% { opacity: 0; transform: rotate(var(--particle-angle,0deg)) translateX(95px) scale(.35); }
  18% { opacity: .75; }
  76% { opacity: .22; }
  100% { opacity: 0; transform: rotate(calc(var(--particle-angle,0deg) + 165deg)) translateX(510px) scale(1.2); }
}
@keyframes beamSweep { to { rotate: 14deg; scale: 1.08; opacity: .45; } }
@keyframes coreScan { 0%,100% { transform: translateY(-58%); opacity: .2; } 50% { transform: translateY(58%); opacity: .9; } }
@keyframes coreBreathe { 0%,100% { opacity: .35; transform: scale(.92); } 50% { opacity: .8; transform: scale(1.08); } }
@keyframes coreSelect { 0% { scale: 1; } 42% { scale: 1.09; } 100% { scale: 1; } }
@keyframes betaStepIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes flowDot { 0%,100% { opacity: .18; transform: scale(.7); } 50% { opacity: 1; transform: scale(1.25); } }
@keyframes productPulse { 0%,100% { height: 5px; background: #273b53; box-shadow: 0 0 0 rgba(93,225,194,0); } 50% { height: 32px; background: var(--mint); box-shadow: 0 0 12px rgba(93,225,194,.23); } }
@keyframes bankCorePulse { 0% { scale: 1; } 45% { scale: 1.13; box-shadow: 0 0 24px rgba(93,225,194,.28); } 100% { scale: 1; } }
@keyframes caretBlink { 0%,48% { opacity: 1; } 49%,100% { opacity: 0; } }
@keyframes thinkingDot { 0%,100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-4px); } }

@media (max-width: 1100px) {
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 160px; }
  .hero-copy { max-width: 850px; }
  .hero h1 { font-size: clamp(64px, 9vw, 96px); }
  .hero-visual { width: min(850px, 94%); margin: 20px auto 70px; }
  .hero-foot { bottom: 15px; }
  .section-intro, .section-heading { grid-template-columns: 1fr; align-items: start; gap: 28px; }
  .section-heading > p { justify-self: start; }
  .horizon-intro { grid-template-columns: 1fr; align-items: start; gap: 28px; }
  .ai-manifesto { grid-template-columns: 1fr; padding-bottom: 40px; }
  .ai-manifesto-copy { max-width: 760px; }
  .neural-scene { width: min(720px,100%); margin-inline: auto; }
  .intelligence-grid { grid-template-columns: 1fr; }
  .intelligence-copy { max-width: 720px; }
  .assistant-demo { width: min(760px, 100%); margin-inline: auto; }
  .development-card, .support-card { grid-template-columns: 1fr; }
  .development-copy, .support-copy { max-width: 760px; }
  .beta-panel, .contribution-panel { width: min(620px,100%); margin-inline: auto; }
  .privacy-card { grid-template-columns: 1fr; }
  .privacy-copy { max-width: 720px; }
  .privacy-viz { margin-top: 30px; }
}

@media (max-width: 820px) {
  .section-shell { width: min(100% - 28px, 680px); }
  .site-header { grid-template-columns: auto auto auto; justify-content: space-between; width: calc(100% - 20px); padding-left: 13px; }
  .site-nav {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: 0;
    display: grid;
    gap: 0;
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(5,17,22,.96);
    box-shadow: 0 24px 60px rgba(0,0,0,.38);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .2s ease, visibility .2s ease, transform .2s ease;
    backdrop-filter: blur(20px);
  }
  .site-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .site-nav a { padding: 13px 14px; border-radius: 10px; }
  .site-nav a:hover { background: rgba(93,225,194,.06); }
  .site-nav a::after { display: none; }
  .menu-toggle { display: grid; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 13px; background: #0b252d; place-content: center; gap: 5px; cursor: pointer; }
  .menu-toggle span { display: block; width: 16px; height: 1px; background: #a8bec0; transition: transform .2s ease; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }
  .header-login { min-width: 42px; width: 42px; padding: 0; }
  .header-login > span:first-child { display: none; }
  .hero { padding-top: 145px; }
  .hero h1 { font-size: clamp(51px, 14vw, 78px); }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 18px; }
  .app-window { transform: none; }
  .floating-note { display: none; }
  .system-stage { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; min-height: auto; padding-top: 430px; transform: none; place-items: stretch; }
  .system-stage::before, .system-stage::after { top: 20px; left: 50%; width: 520px; height: 350px; transform: translateX(-50%); }
  .core-atmosphere { height: 390px; }
  .core { top: 170px; width: 170px; height: 170px; }
  .core strong { font-size: 24px; }
  .orbit { top: 170px; }
  .orbit-one { width: 215px; height: 215px; }
  .orbit-two { width: 350px; height: 250px; }
  .orbit-three { width: 520px; height: 340px; }
  .orbit-four { display: none; }
  .core-beam { top: 170px; width: 75%; }
  .system-stage .orbit-node,
  .system-stage.is-orbiting .orbit-node,
  .system-stage:not(.is-orbiting) .orbit-node { position: relative; inset: auto; top: auto; right: auto; bottom: auto; left: auto; width: 100%; min-height: 62px; opacity: 1!important; transform: none!important; scale: 1; }
  .system-stage .orbit-node:hover, .system-stage .orbit-node:focus-visible, .system-stage .orbit-node.is-active { scale: 1.02; }
  .module-story { grid-template-columns: 70px 1fr; }
  .module-stat { grid-column: 2; justify-items: start; text-align: left; }
  .bento-grid { grid-template-columns: 1fr; grid-template-rows: 420px 400px 420px 390px 460px 420px 610px 430px 430px; }
  .bento-products { grid-column: auto; }
  .bento-products .bento-copy { top: 34px; }
  .product-viz { right: 28px; bottom: 28px; left: 28px; grid-template-columns: 1fr 1fr; }
  .product-card-preview { grid-column: 1/-1; grid-row: auto; min-height: 190px; }
  .product-story { grid-column: 1/-1; min-height: 178px; }
  .development-card, .support-card { padding-inline: 30px; }
  .supporters-row { grid-template-columns: minmax(220px,1fr) minmax(220px,1.35fr) 125px; gap: 14px; }
  .supporters-person-row { padding-inline: 14px; }
  .supporter-person { grid-template-columns: 28px 43px minmax(0,1fr); gap: 8px; }
  .supporter-avatar { width: 43px; height: 43px; border-radius: 13px; }
  .supporter-badge > b { font-size: 7px; }
  .development-status { right: 24px; left: 24px; }
  .horizon-grid { grid-template-columns: 1fr; grid-template-rows: 540px 500px 480px 470px 540px 430px; }
  .horizon-day { grid-column: auto; }
  .horizon-day .horizon-copy { max-width: 100%; }
  .day-viz { top: auto; right: 28px; bottom: 28px; left: 28px; width: auto; height: 255px; }
  .horizon-life { grid-column: auto; }
  .horizon-life .horizon-copy { max-width: 100%; }
  .privacy-card { padding-inline: 28px; }
  .site-footer { grid-template-columns: 1fr 1fr; }
  .footer-meta { grid-column: 1/-1; justify-content: start; }
}

@media (max-width: 560px) {
  body { font-size: 15px; }
  .section-shell { width: calc(100% - 20px); }
  .brand-name { font-size: 16px; }
  .brand-mark { width: 37px; height: 37px; }
  .platform-rail { gap: 4px; }
  .platform-rail > span { grid-template-columns: 15px minmax(0,1fr); column-gap: 4px; padding: 6px 5px; }
  .platform-rail i { width: 15px; height: 15px; border-radius: 5px; font-size: 7px; }
  .platform-rail b { font-size: 8px; }
  .platform-rail small { font-size: 6px; }
  .messenger-rail { grid-template-columns: 1fr; }
  .messenger-link { min-height: 58px; }
  .site-header { min-height: 60px; border-radius: 17px; }
  .hero { display: block; padding-top: 135px; padding-bottom: 90px; }
  .hero h1 { font-size: clamp(46px, 14.7vw, 66px); letter-spacing: -.075em; }
  .hero-lead { margin-top: 22px; font-size: 16px; }
  .hero-actions .button { width: 100%; }
  .hero-trust { gap: 12px 17px; }
  .hero-visual { width: 100%; margin-top: 58px; }
  .app-topbar { height: 45px; }
  .app-layout { grid-template-columns: 36px minmax(0,1fr); }
  .app-sidebar { min-height: 392px; gap: 13px; padding-top: 18px; }
  .app-sidebar span { width: 14px; height: 14px; }
  .app-content { padding: 14px 11px 16px; }
  .app-heading strong { font-size: 11px; }
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 7px; }
  .metric-card { padding: 9px; border-radius: 11px; }
  .metric-card > strong { font-size: 13px; }
  .sparkline { height: 42px; gap: 3px; }
  .time-ring { width: 66px; height: 66px; }
  .time-ring::before { width: 54px; height: 54px; }
  .time-ring strong { font-size: 12px; }
  .hero-foot { grid-template-columns: auto 1fr; }
  .hero-foot p { font-size: 8px; }
  .hero-line { display: none; }
  .system-section, .possibilities, .horizon, .intelligence, .development, .support { padding-top: 105px; padding-bottom: 105px; }
  .section-intro h2, .section-heading h2, .horizon-intro h2, .intelligence h2, .privacy h2, .final-cta h2 { font-size: clamp(42px, 13vw, 60px); }
  .section-intro > p:last-child, .section-heading > p, .intelligence-copy > p, .privacy-copy > p { font-size: 15px; }
  .system-stage { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; min-height: auto; margin-top: 48px; padding-top: 335px; transform: none; }
  .system-stage::before, .system-stage::after { top: 0; width: 330px; height: 290px; }
  .core-atmosphere { height: 310px; }
  .orbit { top: 135px; }
  .orbit-one { width: 168px; height: 168px; }
  .orbit-two { width: 255px; height: 188px; }
  .orbit-three { width: 340px; height: 245px; }
  .core-beam { top: 135px; }
  .core { top: 135px; width: 135px; height: 135px; }
  .core strong { font-size: 20px; }
  .core::after { inset: -7px; }
  .system-stage .orbit-node { grid-template-columns: 30px minmax(0,1fr) 4px; gap: 7px; min-height: 54px; padding: 7px; border-radius: 15px; }
  .orbit-node-index { width: 30px; height: 30px; border-radius: 10px; font-size: 7px; }
  .orbit-node-copy b { font-size: 9px; }
  .orbit-node-copy small { font-size: 5px; }
  .module-story { grid-template-columns: 1fr; }
  .module-stat { grid-column: 1; }
  .bento-grid { grid-template-rows: 430px 400px 420px 390px 470px 470px 720px 460px 460px; }
  .bento { border-radius: 22px; }
  .bento-copy { top: 27px; left: 24px; }
  .bento-copy h3 { font-size: 32px; }
  .bento-number { top: 24px; right: 24px; }
  .finance-viz { right: 20px; bottom: 24px; left: 24px; grid-template-columns: 1fr; gap: 12px; }
  .finance-bars { height: 96px; }
  .time-viz, .receipt-viz, .family-viz, .meal-viz { right: 24px; left: 24px; }
  .time-display strong { font-size: 40px; }
  .time-viz button { width: 54px; height: 54px; border-radius: 18px; }
  .family-viz { flex-wrap: wrap; gap: 0; }
  .family-viz > span { width: 100%; margin: 15px 0 0; }
  .avatar { width: 55px; height: 55px; }
  .home-task-viz { right: 22px; left: 22px; }
  .bento-live { top: 54px; right: 24px; }
  .meal-days { grid-template-columns: repeat(7,minmax(72px,1fr)); overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; scroll-snap-type: x proximity; }
  .meal-days::-webkit-scrollbar { display: none; }
  .meal-days > button { scroll-snap-align: start; }
  .meal-current { grid-template-columns: 58px minmax(0,1fr); }
  .meal-cover { width: 58px; height: 55px; }
  .meal-current > strong { grid-column: 2; font-size: 14px; text-align: left; }
  .list-viz { right: 22px; left: 22px; }
  .bento-products .bento-copy { right: 24px; }
  .bento-products .bento-copy h3 { font-size: 34px; }
  .product-viz { right: 21px; bottom: 22px; left: 21px; display: grid; grid-template-columns: 1fr; }
  .product-card-preview { grid-column: auto; grid-template-columns: 68px minmax(0,1fr) auto; gap: 11px; min-height: 170px; padding: 15px; }
  .product-cover { width: 68px; height: 90px; border-radius: 17px; }
  .product-story { min-height: 200px; }
  .product-story-nav button { min-height: 36px; }
  .product-stage { grid-template-columns: 1fr 1fr; }
  .product-signals { grid-template-columns: 1fr 1fr; }
  .product-ai-note { min-height: 62px; }
  .bank-api-viz { right: 21px; left: 21px; }
  .bank-flow { grid-template-columns: 43px 1fr 44px 1fr 43px; gap: 3px; }
  .goal-viz { right: 21px; left: 21px; grid-template-columns: 100px 1fr; gap: 13px; }
  .goal-ring { width: 98px; height: 98px; }
  .goal-ring::before { width: 79px; height: 79px; }
  .horizon-grid { grid-template-rows: 570px 530px 510px 500px 590px 500px; }
  .horizon-card { padding: 24px 21px; border-radius: 22px; }
  .horizon-copy { margin-top: 27px; }
  .horizon-copy h3 { font-size: 32px; }
  .project-viz, .habit-viz { right: 21px; bottom: 22px; left: 21px; }
  .health-viz { right: 21px; bottom: 24px; left: 21px; grid-template-columns: 108px 1fr; gap: 14px; }
  .activity-ring { width: 108px; height: 108px; }
  .activity-ring::before { width: 87px; height: 87px; }
  .activity-ring strong { font-size: 20px; }
  .wellbeing-viz { right: 21px; bottom: 22px; left: 21px; grid-template-columns: 92px 1fr; gap: 13px; }
  .wellbeing-score { width: 92px; height: 92px; }
  .wellbeing-score::before { width: 73px; height: 73px; }
  .day-viz { right: 21px; bottom: 22px; left: 21px; height: 285px; }
  .day-timeline > span { grid-template-columns: 34px 7px minmax(0,1fr); }
  .day-timeline > span em { grid-column: 3; }
  .life-map { right: 50%; bottom: 6px; transform: translateX(50%) scale(.92); }
  .ai-manifesto { min-height: auto; margin-bottom: 90px; padding: 50px 20px 24px; border-radius: 24px; }
  .ai-manifesto-copy h2 { font-size: clamp(42px,12vw,58px); }
  .ai-manifesto-copy > p:not(.eyebrow) { font-size: 14px; }
  .neural-scene { min-height: 460px; transform: scale(.84); }
  .neural-ring-three { width: 490px; height: 380px; }
  .signal-work { right: -14%; }
  .assistant-body { min-height: 430px; padding: 24px 17px; }
  .user-message { max-width: 88%; }
  .privacy { padding-bottom: 110px; }
  .development-card, .support-card { min-height: auto; padding: 82px 20px 28px; border-radius: 24px; }
  .development-copy h2, .support-copy h2 { font-size: clamp(42px,12vw,58px); }
  .development-copy > p:not(.eyebrow), .support-copy > p:not(.eyebrow) { font-size: 14px; }
  .beta-panel, .contribution-panel { padding: 22px; border-radius: 21px; }
  .contribution-options { grid-template-columns: 1fr; }
  .contribution-value { margin-block: 27px 20px; }
  .contribution-form { padding: 14px; }
  .contribution-payment img { width: min(230px,90%); }
  .supporters-panel { padding: 20px 14px; border-radius: 20px; }
  .supporters-panel.section-shell { margin-top: 15px; margin-bottom: 55px; }
  .supporters-heading { align-items: start; gap: 12px; margin-bottom: 18px; }
  .supporters-heading h3 { font-size: clamp(27px,9vw,38px); }
  .supporters-heading > strong { min-width: 92px; height: 62px; padding-inline: 10px; border-radius: 17px; }
  .supporters-heading > strong i { font-size: 21px; }
  .supporters-heading > strong small { font-size: 6px; letter-spacing: .07em; }
  .supporters-honor, .supporters-beta-note { grid-template-columns: 40px 1fr; gap: 10px; padding: 12px; }
  .supporters-honor > i, .supporters-beta-note > i { width: 40px; height: 40px; border-radius: 12px; }
  .supporters-honor em, .supporters-beta-note em { grid-column: 2; font-size: 6px; }
  .supporters-filter { align-items: stretch; flex-direction: column; gap: 8px; padding: 11px; }
  .supporters-filter button { justify-content: center; }
  .supporters-header { display: none; }
  .supporters-table { border: 0; border-radius: 0; }
  .supporters-person-row { display: grid; min-height: 0; grid-template-columns: 1fr; gap: 14px; margin-top: 10px; padding: 16px; border-radius: 17px; }
  .supporters-person-row:hover { transform: translateY(-2px); }
  .supporter-person { grid-template-columns: 28px 47px minmax(0,1fr); }
  .supporter-avatar { width: 47px; height: 47px; }
  .supporter-identity > strong { font-size: 15px; }
  .supporter-comment { grid-template-columns: 20px 1fr; padding: 12px 0; border-top: 1px solid rgba(158,177,170,.08); border-bottom: 1px solid rgba(158,177,170,.08); font-size: 10px; }
  .supporter-quote { font-size: 24px; }
  .supporter-amount { grid-template-columns: 1fr auto; align-items: center; justify-items: stretch; }
  .supporter-amount strong { min-width: 132px; font-size: 17px; }
  .supporter-badge { min-height: 23px; padding-inline: 8px; }
  .supporter-badge > b { font-size: 7px; }
  .supporters-loader { min-height: 64px; grid-template-columns: 36px 1fr 20px; padding-inline: 12px; }
  .supporters-loader > i { width: 36px; height: 36px; }
  .supporters-loader b { font-size: 9px; }
  .supporters-loader small { font-size: 8px; }
  .supporters-complete { grid-template-columns: 40px 1fr; padding: 12px; }
  .supporters-complete > i { width: 40px; height: 40px; }
  .supporters-complete > em { grid-column: 2; font-size: 6px; }
  .support-comment-policy > div { padding-left: 12px; }
  .beta-reward { grid-template-columns: 36px 1fr; }
  .beta-reward > i { width: 36px; height: 36px; }
  .support-directions > span { grid-template-columns: 26px 86px 1fr; gap: 6px; }
  .privacy-card { min-height: 760px; padding: 50px 20px 30px; border-radius: 24px; }
  .privacy-viz { min-height: 320px; transform: scale(.82); }
  .chip-one { right: -10%; }
  .chip-two { left: -10%; }
  .final-cta { padding-bottom: 90px; }
  .cta-card { min-height: 520px; padding: 60px 18px; border-radius: 24px; }
  .cta-card .button { width: 100%; }
  .site-footer { grid-template-columns: 1fr; padding-inline: 7px; }
  .site-footer-dock { width: calc(100% - 18px); min-height: 58px; grid-template-columns: auto 1fr; gap: 12px; padding: 7px 9px; }
  .site-footer-dock .brand-mark { width: 32px; height: 32px; }
  .site-footer-dock .brand-name { font-size: 13px; }
  .site-footer-dock .footer-meta { display: grid; grid-template-columns: auto auto; justify-content: end; gap: 2px 12px; font-size: 7px; text-align: right; }
  .site-footer-dock .footer-meta > span,
  .site-footer-dock .footer-meta > a:first-of-type { display: none; }
  .footer-meta { grid-column: 1; gap: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

.back-to-top {
  position: fixed;
  z-index: 120;
  right: 20px;
  bottom: 20px;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(143,246,222,.22);
  border-radius: 13px;
  background:
    radial-gradient(circle at 25% 15%,rgba(255,255,255,.11),transparent 38%),
    linear-gradient(145deg,rgba(26,65,67,.38),rgba(5,20,27,.28));
  color: rgba(221,255,247,.88);
  box-shadow:
    0 12px 34px rgba(0,0,0,.2),
    0 0 0 1px rgba(255,255,255,.018) inset,
    0 1px 0 rgba(255,255,255,.08) inset;
  -webkit-backdrop-filter: blur(18px) saturate(135%);
  backdrop-filter: blur(18px) saturate(135%);
  opacity: 0;
  pointer-events: none;
  transform: translateY(9px) scale(.96);
  transition:
    opacity .22s ease,
    transform .22s ease,
    border-color .22s ease,
    color .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}
.back-to-top::before {
  position: absolute;
  inset: -50%;
  background: linear-gradient(115deg,transparent 40%,rgba(255,255,255,.15) 50%,transparent 60%);
  content: "";
  opacity: 0;
  transform: translateX(-35%) rotate(12deg);
  transition: opacity .22s ease, transform .5s ease;
}
.back-to-top span {
  position: relative;
  z-index: 1;
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 8px;
  background: rgba(102,234,205,.055);
}
.back-to-top svg {
  width: 16px;
  height: 16px;
  overflow: visible;
  fill: none;
}
.back-to-top path {
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.back-to-top.is-visible {
  opacity: .88;
  pointer-events: auto;
  transform: none;
}
.back-to-top:hover {
  border-color: rgba(143,246,222,.52);
  background:
    radial-gradient(circle at 25% 15%,rgba(255,255,255,.16),transparent 40%),
    linear-gradient(145deg,rgba(31,78,77,.48),rgba(8,28,35,.34));
  color: #fff;
  box-shadow:
    0 15px 38px rgba(0,0,0,.25),
    0 0 24px rgba(93,227,199,.08),
    0 1px 0 rgba(255,255,255,.12) inset;
  transform: translateY(-2px);
}
.back-to-top:hover::before {
  opacity: 1;
  transform: translateX(35%) rotate(12deg);
}
.back-to-top:focus-visible {
  outline: 2px solid rgba(117,239,212,.8);
  outline-offset: 3px;
}
@media (max-width: 700px) {
  .back-to-top {
    right: 12px;
    bottom: 12px;
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }
}

/* Stable first paint and mobile layout pass — 2026-07-30 */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}

html.site-booting {
  overflow: hidden;
}

html.site-booting body > :not(.site-loader) {
  visibility: hidden;
}

.site-loader {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 8px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 44%, rgba(93,225,194,.12), transparent 18rem),
    linear-gradient(145deg, #07181e, #030b0f 72%);
  opacity: 1;
  transition: opacity .38s ease, visibility .38s ease;
}

.site-loader::before {
  position: absolute;
  width: min(70vw, 520px);
  aspect-ratio: 1;
  border: 1px solid rgba(93,225,194,.055);
  border-radius: 50%;
  box-shadow:
    0 0 0 46px rgba(93,225,194,.018),
    0 0 90px rgba(93,225,194,.055);
  content: "";
  animation: loaderBreathe 2.2s ease-in-out infinite;
}

html.site-ready .site-loader {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.site-loader-core {
  position: relative;
  display: grid;
  width: 78px;
  height: 78px;
  margin-bottom: 14px;
  place-items: center;
}

.site-loader-core .brand-mark {
  z-index: 2;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(93,225,194,.18), rgba(72,191,238,.07));
  box-shadow: 0 0 45px rgba(93,225,194,.11), inset 0 1px rgba(255,255,255,.08);
}

.site-loader-core .brand-mark b {
  font-size: 25px;
}

.site-loader-orbit {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(93,225,194,.2);
  border-right-color: rgba(72,191,238,.82);
  border-radius: 50%;
  animation: loaderSpin 1.15s linear infinite;
}

.site-loader > strong {
  position: relative;
  font-family: var(--display);
  font-size: 20px;
  letter-spacing: -.04em;
}

.site-loader > strong span {
  color: var(--mint);
}

.site-loader > small {
  position: relative;
  color: #658084;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.site-loader-line {
  position: relative;
  width: 150px;
  height: 2px;
  margin-top: 15px;
  overflow: hidden;
  border-radius: 99px;
  background: rgba(93,225,194,.08);
}

.site-loader-line span {
  display: block;
  width: 45%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, var(--mint), var(--cyan), transparent);
  animation: loaderLine 1.25s ease-in-out infinite;
}

@keyframes loaderSpin {
  to { transform: rotate(360deg); }
}

@keyframes loaderLine {
  from { transform: translateX(-120%); }
  to { transform: translateX(340%); }
}

@keyframes loaderBreathe {
  0%, 100% { opacity: .55; transform: scale(.96); }
  50% { opacity: 1; transform: scale(1.03); }
}

@media (max-width: 820px) {
  .reveal,
  .reveal.reveal-left,
  .reveal.reveal-right,
  .reveal.reveal-scale {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .site-header {
    top: 10px;
    grid-template-columns: minmax(0, 1fr) 40px auto;
    gap: 7px;
    width: calc(100% - 20px);
    min-height: 58px;
    padding: 7px;
    border-color: rgba(128,196,195,.16);
    border-radius: 18px;
    background: rgba(5,17,22,.78);
    box-shadow: 0 16px 45px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.025);
    -webkit-backdrop-filter: blur(20px) saturate(135%);
    backdrop-filter: blur(20px) saturate(135%);
  }

  .site-header.is-scrolled {
    top: 8px;
  }

  .site-header .brand {
    min-width: 0;
    gap: 8px;
  }

  .site-header .brand-mark {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 13px;
  }

  .site-header .brand-name {
    overflow: hidden;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .menu-toggle {
    width: 40px;
    height: 40px;
    border-color: rgba(127,191,193,.18);
    border-radius: 12px;
    background: rgba(11,38,46,.78);
  }

  .menu-toggle span {
    width: 15px;
  }

  .header-login {
    width: auto;
    min-width: 68px;
    min-height: 40px;
    gap: 0;
    padding: 0 14px;
    border-radius: 12px;
    font-size: 11px;
  }

  .header-login > span:first-child {
    display: inline;
  }

  .header-login .button-arrow {
    display: none;
  }

  .site-nav {
    top: calc(100% + 7px);
    border-radius: 16px;
  }

  .bento,
  .horizon-card,
  .development-card,
  .support-card,
  .privacy-card,
  .cta-card {
    max-width: 100%;
  }
}

@media (max-width: 560px) {
  .site-header {
    grid-template-columns: minmax(0, 1fr) 38px auto;
    gap: 6px;
  }

  .site-header .brand-mark,
  .menu-toggle {
    width: 38px;
    height: 38px;
  }

  .site-header .brand-mark {
    flex-basis: 38px;
  }

  .site-header .brand-name {
    font-size: 15px;
  }

  .header-login {
    min-width: 62px;
    min-height: 38px;
    padding-inline: 11px;
    font-size: 10px;
  }

  .cookie-notice {
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    width: min(330px, calc(100% - 24px));
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 8px 10px;
    padding: 11px;
    border-radius: 16px;
  }

  .cookie-notice-mark {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  .cookie-notice-mark span {
    width: 14px;
    height: 14px;
  }

  .cookie-notice-copy strong {
    font-size: 12px;
  }

  .cookie-notice-copy p {
    display: none;
  }

  .cookie-notice-copy a {
    margin-top: 1px;
    font-size: 8px;
  }

  .cookie-notice > button {
    grid-column: 2;
    width: 100%;
    min-width: 0;
    min-height: 34px;
    font-size: 10px;
  }

  .bento-number {
    top: 25px;
    right: 22px;
  }

  .bento-live {
    top: 23px;
    right: 51px;
    max-width: calc(100% - 98px);
    padding: 4px 7px;
    white-space: nowrap;
  }

  .bento-copy,
  .bento-products .bento-copy {
    top: 72px;
  }

  .bento-copy {
    right: 22px;
    left: 22px;
  }

  .bento-copy h3,
  .bento-products .bento-copy h3 {
    font-size: 31px;
  }

  .meal-days {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
    padding: 2px;
    overflow: visible;
    scroll-snap-type: none;
  }

  .meal-days > button {
    min-width: 0;
    min-height: 45px;
    padding: 5px 2px;
    border-radius: 9px;
  }

  .meal-current {
    grid-template-columns: 54px minmax(0, 1fr) auto;
    gap: 9px;
  }

  .meal-cover {
    width: 54px;
    height: 52px;
  }

  .meal-current > strong {
    grid-column: auto;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    font-size: 14px;
    text-align: right;
    white-space: nowrap;
  }

  .meal-current > strong small {
    display: inline;
    font-size: 5px;
  }

  .bento-grid {
    grid-template-rows: 430px 400px 420px 390px 470px 470px 640px 430px 390px;
  }

  .product-card-preview {
    min-height: 150px;
  }

  .product-story {
    min-height: 184px;
  }

  .goal-viz {
    bottom: 24px;
  }

  .horizon-grid {
    grid-template-rows: 570px 530px 510px 430px 630px 500px;
  }

  .horizon-habits .horizon-copy > p:last-child {
    margin-top: 10px;
    line-height: 1.5;
  }

  .project-viz,
  .habit-viz {
    bottom: 20px;
  }

  .horizon-day .horizon-copy {
    margin-top: 24px;
  }

  .horizon-day .horizon-copy > p:last-of-type {
    line-height: 1.5;
  }

  .feature-pills {
    gap: 5px;
    margin-top: 12px;
  }

  .feature-pills li {
    padding: 5px 7px;
    font-size: 6px;
  }

  .day-viz {
    top: 337px;
    bottom: auto;
    height: 268px;
  }

  .beta-reward {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .beta-reward > i {
    padding-bottom: 4px;
    font-size: 25px;
    line-height: 1;
  }
}

@media (max-width: 370px) {
  .site-header .brand-name {
    font-size: 14px;
  }

  .header-login {
    min-width: 56px;
    padding-inline: 9px;
    font-size: 9px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-loader::before,
  .site-loader-orbit,
  .site-loader-line span {
    animation: none;
  }
}

/* Mobile footer and paint performance pass — 2026-07-30 */
@media (max-width: 820px) {
  .site-footer-dock {
    display: none !important;
  }

  .ambient {
    animation: none;
    filter: blur(82px);
  }

  .bento,
  .horizon-card {
    contain: layout paint;
  }

  .supporters-person-row,
  .supporters-panel,
  .supporters-filter {
    animation: none;
  }
}

@media (max-width: 560px) {
  .site-footer {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding: 22px 5px calc(22px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(126,179,184,.09);
  }

  .site-footer .brand {
    gap: 8px;
  }

  .site-footer .brand-mark {
    width: 34px;
    height: 34px;
    border-radius: 11px;
  }

  .site-footer .brand-mark b {
    font-size: 16px;
  }

  .site-footer .brand-name {
    font-size: 14px;
  }

  .site-footer > p {
    font-size: 8px;
    line-height: 1.4;
  }

  .site-footer .footer-meta {
    display: flex;
    grid-column: auto;
    justify-content: flex-start;
    gap: 7px 13px;
    font-size: 8px;
    line-height: 1.25;
    text-align: left;
  }

  .supporters-person-row {
    transition: border-color .2s ease, background .2s ease;
  }
}

/* Pricing — subscriptions and one-time project support */
.pricing-body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 84% 5%, rgba(102,119,255,.12), transparent 29rem),
    radial-gradient(circle at 8% 34%, rgba(93,225,194,.07), transparent 27rem),
    linear-gradient(180deg, #07171c 0%, #061116 48%, #030a0e 100%);
}

.pricing-header {
  display: flex;
  min-height: 78px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-top: 14px;
}

.pricing-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pricing-home {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(8,29,36,.52);
  color: #8ca4a7;
  font-size: 11px;
  font-weight: 750;
  transition: border-color .2s ease, color .2s ease, transform .2s ease;
}

.pricing-home:hover {
  border-color: var(--line-bright);
  color: var(--text);
  transform: translateY(-1px);
}

.pricing-header .button {
  min-height: 44px;
  padding-inline: 17px;
}

.pricing-page {
  padding-top: clamp(85px, 10vw, 145px);
  padding-bottom: 115px;
}

.pricing-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
  align-items: end;
  gap: clamp(48px, 8vw, 120px);
}

.pricing-hero h1 {
  max-width: 850px;
  margin: 24px 0 0;
  font-family: var(--display);
  font-size: clamp(63px, 7.5vw, 108px);
  font-weight: 620;
  line-height: .89;
  letter-spacing: -.075em;
}

.pricing-hero h1 em {
  color: #7a8eb4;
  font-style: normal;
}

.pricing-hero-copy {
  display: grid;
  gap: 18px;
  padding-bottom: 5px;
}

.pricing-hero-copy > p {
  margin: 0;
  color: #91a8aa;
  font-size: 16px;
  line-height: 1.68;
}

.pricing-preview {
  display: grid;
  min-height: 62px;
  grid-template-columns: 8px 1fr;
  align-content: center;
  gap: 2px 10px;
  padding: 11px 14px;
  border: 1px solid rgba(93,225,194,.18);
  border-radius: 15px;
  background: linear-gradient(105deg, rgba(26,75,71,.3), rgba(8,31,40,.55));
}

.pricing-preview > i {
  grid-row: span 2;
  align-self: center;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mint);
  box-shadow: 0 0 13px rgba(93,225,194,.75);
}

.pricing-preview b {
  color: #c8dcd8;
  font-size: 10px;
}

.pricing-preview small {
  color: #6c8586;
  font-size: 9px;
}

.pricing-billing {
  display: grid;
  grid-template-columns: 1fr 1.45fr;
  gap: 5px;
  padding: 5px;
  border: 1px solid rgba(122,172,178,.15);
  border-radius: 15px;
  background: rgba(5,21,27,.74);
}

.pricing-billing button {
  position: relative;
  display: flex;
  min-height: 45px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: #688084;
  font-size: 9px;
  font-weight: 800;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}

.pricing-billing button span {
  padding: 4px 6px;
  border-radius: 6px;
  background: rgba(245,189,98,.09);
  color: #c59d60;
  font-size: 6px;
  letter-spacing: .04em;
  white-space: nowrap;
}

.pricing-billing button.is-active {
  border-color: rgba(93,225,194,.2);
  background: rgba(93,225,194,.08);
  color: #d3e8e4;
  box-shadow: inset 0 1px rgba(255,255,255,.035);
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
  margin-top: clamp(72px, 9vw, 125px);
}

.pricing-card {
  position: relative;
  display: grid;
  min-height: 585px;
  grid-template-rows: auto auto auto auto 1fr auto;
  align-content: start;
  padding: 24px;
  overflow: hidden;
  border: 1px solid rgba(125,173,179,.15);
  border-radius: 25px;
  background:
    radial-gradient(circle at 84% 6%, rgba(93,225,194,.07), transparent 30%),
    linear-gradient(145deg, rgba(12,36,43,.94), rgba(5,19,25,.98));
  box-shadow: inset 0 1px rgba(255,255,255,.035), 0 28px 70px rgba(0,0,0,.15);
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.pricing-card::before {
  position: absolute;
  top: 0;
  right: 18%;
  left: 18%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(93,225,194,.62), transparent);
  content: "";
  opacity: .45;
}

.pricing-card:hover {
  border-color: rgba(119,221,207,.28);
  box-shadow: inset 0 1px rgba(255,255,255,.05), 0 35px 85px rgba(0,0,0,.22);
  transform: translateY(-4px);
}

.pricing-card > header {
  display: flex;
  min-height: 30px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pricing-code {
  color: #48666b;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .1em;
}

.pricing-card > header > i {
  padding: 5px 7px;
  border: 1px solid rgba(93,225,194,.13);
  border-radius: 7px;
  background: rgba(93,225,194,.045);
  color: #6c9993;
  font-size: 6px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .11em;
}

.pricing-name {
  display: grid;
  gap: 4px;
  margin-top: 36px;
}

.pricing-name p {
  margin: 0;
  font-family: var(--display);
  font-size: 33px;
  font-weight: 650;
  letter-spacing: -.055em;
}

.pricing-name span {
  color: #6f888b;
  font-size: 10px;
}

.pricing-price {
  display: flex;
  align-items: end;
  gap: 8px;
  margin-top: 25px;
}

.pricing-price strong {
  font-family: var(--display);
  font-size: clamp(48px, 4.2vw, 64px);
  font-weight: 600;
  line-height: .88;
  letter-spacing: -.07em;
}

.pricing-price > span {
  display: grid;
  gap: 1px;
  padding-bottom: 3px;
}

.pricing-price b {
  color: var(--mint);
  font-size: 16px;
}

.pricing-price small {
  color: #62797c;
  font-size: 8px;
  white-space: nowrap;
}

.pricing-saving {
  min-height: 26px;
  margin-top: 12px;
  padding: 6px 8px;
  border: 1px solid rgba(245,189,98,.14);
  border-radius: 8px;
  background: rgba(245,189,98,.055);
  color: #b99b68;
  font-size: 7px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.4;
}

.pricing-card ul {
  display: grid;
  align-content: start;
  gap: 13px;
  margin: 31px 0 28px;
  padding: 0;
  list-style: none;
}

.pricing-card li {
  position: relative;
  padding-left: 22px;
  color: #9aafb0;
  font-size: 10px;
  line-height: 1.45;
}

.pricing-card li::before {
  position: absolute;
  top: .36em;
  left: 0;
  display: grid;
  width: 13px;
  height: 13px;
  border: 1px solid rgba(93,225,194,.25);
  border-radius: 50%;
  color: var(--mint);
  content: "✓";
  font-size: 7px;
  line-height: 11px;
  text-align: center;
}

.pricing-action {
  display: flex;
  min-height: 49px;
  align-items: center;
  justify-content: space-between;
  align-self: end;
  padding: 0 9px 0 14px;
  border: 1px solid rgba(101,161,166,.16);
  border-radius: 13px;
  background: rgba(11,38,45,.64);
  color: #bde8df;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.pricing-action:hover {
  border-color: rgba(93,225,194,.5);
  background: rgba(18,58,57,.86);
  color: #effffb;
}

.pricing-action i {
  display: grid;
  width: 31px;
  height: 31px;
  border-radius: 9px;
  background: rgba(93,225,194,.06);
  font-style: normal;
  place-items: center;
}

.pricing-action:disabled {
  cursor: not-allowed;
  opacity: .78;
}

.pricing-plus {
  background:
    radial-gradient(circle at 82% 7%, rgba(72,191,238,.1), transparent 31%),
    linear-gradient(145deg, rgba(12,38,49,.96), rgba(5,19,27,.98));
}

.pricing-family {
  border-color: rgba(117,98,255,.34);
  background:
    radial-gradient(circle at 80% 7%, rgba(108,86,255,.19), transparent 34%),
    radial-gradient(circle at 10% 92%, rgba(93,225,194,.09), transparent 34%),
    linear-gradient(145deg, rgba(22,35,58,.98), rgba(5,20,28,.99));
  box-shadow: inset 0 1px rgba(255,255,255,.055), 0 30px 80px rgba(47,38,121,.14);
}

.pricing-family::before {
  background: linear-gradient(90deg, transparent, #7666ff, var(--mint), transparent);
  opacity: .9;
}

.pricing-popular {
  position: absolute;
  top: 22px;
  right: 24px;
  display: flex;
  align-items: center;
  gap: 5px;
  color: #b6afea;
  font-size: 6px;
  font-weight: 900;
  letter-spacing: .08em;
}

.pricing-popular i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #8575ff;
  box-shadow: 0 0 10px #8575ff;
}

.pricing-family > header > i {
  visibility: hidden;
}

.pricing-pro {
  border-color: rgba(245,189,98,.2);
  background:
    radial-gradient(circle at 82% 7%, rgba(245,189,98,.14), transparent 31%),
    linear-gradient(145deg, rgba(39,35,28,.96), rgba(7,19,24,.99));
}

.pricing-pro::before {
  background: linear-gradient(90deg, transparent, rgba(245,189,98,.8), transparent);
}

.pricing-pro .pricing-price b,
.pricing-pro .pricing-name p {
  color: #f0c777;
}

.pricing-scope-note {
  max-width: 850px;
  margin: 26px auto 0;
  color: #5d7477;
  font-size: 10px;
  line-height: 1.55;
  text-align: center;
}

.pricing-payment-models {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: clamp(85px, 10vw, 145px);
}

.pricing-model {
  position: relative;
  display: grid;
  min-height: 315px;
  grid-template-columns: 44px minmax(0, 1fr) 74px;
  align-items: start;
  gap: 22px;
  padding: 33px;
  overflow: hidden;
  border: 1px solid rgba(116,177,183,.16);
  border-radius: 26px;
  background: linear-gradient(140deg, rgba(12,40,47,.86), rgba(5,20,27,.97));
}

.pricing-model::after {
  position: absolute;
  right: -90px;
  bottom: -120px;
  width: 270px;
  height: 270px;
  border: 1px solid rgba(93,225,194,.08);
  border-radius: 50%;
  box-shadow: 0 0 0 38px rgba(93,225,194,.018);
  content: "";
}

.pricing-model-index {
  display: grid;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(93,225,194,.2);
  border-radius: 13px;
  background: rgba(93,225,194,.055);
  color: var(--mint);
  font-size: 9px;
  font-weight: 900;
  place-items: center;
}

.pricing-model > div {
  position: relative;
  z-index: 2;
}

.pricing-model p {
  margin: 2px 0 17px;
  color: var(--mint);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .15em;
}

.pricing-model h2 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(27px, 3vw, 41px);
  font-weight: 620;
  line-height: 1.03;
  letter-spacing: -.05em;
}

.pricing-model > div > span {
  display: block;
  max-width: 520px;
  margin-top: 18px;
  color: #82999b;
  font-size: 11px;
  line-height: 1.6;
}

.pricing-model a {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: 16px;
  margin-top: 22px;
  padding: 0 14px;
  border: 1px solid rgba(245,189,98,.22);
  border-radius: 12px;
  background: rgba(245,189,98,.07);
  color: #d8b773;
  font-size: 9px;
  font-weight: 850;
}

.pricing-model a i {
  font-style: normal;
}

.pricing-model-mark {
  position: relative;
  z-index: 2;
  display: grid;
  width: 66px;
  height: 66px;
  border: 1px solid rgba(93,225,194,.2);
  border-radius: 20px;
  background: rgba(93,225,194,.07);
  color: var(--mint);
  font-size: 27px;
  font-style: normal;
  place-items: center;
}

.pricing-model-support {
  border-color: rgba(245,189,98,.2);
  background:
    radial-gradient(circle at 86% 10%, rgba(245,189,98,.12), transparent 30%),
    linear-gradient(140deg, rgba(38,35,28,.9), rgba(6,20,25,.98));
}

.pricing-model-support .pricing-model-index,
.pricing-model-support .pricing-model-mark {
  border-color: rgba(245,189,98,.24);
  background: rgba(245,189,98,.07);
  color: var(--amber);
}

.pricing-model-support p {
  color: var(--amber);
}

.pricing-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid rgba(116,177,183,.12);
  border-radius: 21px;
  background: rgba(116,177,183,.12);
}

.pricing-facts > div {
  display: grid;
  min-height: 125px;
  align-content: center;
  gap: 4px;
  padding: 22px;
  background: rgba(5,22,28,.94);
}

.pricing-facts small {
  color: #58777b;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .12em;
}

.pricing-facts b {
  color: #c5d6d5;
  font-size: 12px;
}

.pricing-facts span {
  color: #657d80;
  font-size: 9px;
}

.pricing-footer {
  padding-top: 25px;
  border-top: 1px solid rgba(126,179,184,.09);
}

@media (max-width: 1100px) {
  .pricing-hero {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 35px;
  }

  .pricing-hero-copy {
    max-width: 650px;
  }

  .pricing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pricing-card {
    min-height: 545px;
  }
}

@media (max-width: 700px) {
  .pricing-header {
    min-height: 68px;
    padding-top: 10px;
  }

  .pricing-header .brand-name {
    font-size: 15px;
  }

  .pricing-header .brand-mark {
    width: 38px;
    height: 38px;
  }

  .pricing-home {
    width: 40px;
    min-height: 40px;
    justify-content: center;
    padding: 0;
    font-size: 0;
  }

  .pricing-home span {
    font-size: 14px;
  }

  .pricing-header .button {
    min-height: 40px;
    padding-inline: 13px;
    font-size: 10px;
  }

  .pricing-page {
    padding-top: 75px;
    padding-bottom: 80px;
  }

  .pricing-hero h1 {
    font-size: clamp(49px, 14vw, 70px);
  }

  .pricing-hero-copy > p {
    font-size: 14px;
  }

  .pricing-billing {
    grid-template-columns: 1fr;
  }

  .pricing-grid {
    grid-template-columns: 1fr;
    margin-top: 65px;
  }

  .pricing-card {
    min-height: 0;
    padding: 22px;
    border-radius: 22px;
  }

  .pricing-name {
    margin-top: 28px;
  }

  .pricing-price strong {
    font-size: 58px;
  }

  .pricing-card ul {
    margin-block: 28px;
  }

  .pricing-payment-models {
    grid-template-columns: 1fr;
    margin-top: 85px;
  }

  .pricing-model {
    min-height: 0;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 16px;
    padding: 24px 20px;
    border-radius: 22px;
  }

  .pricing-model-index {
    width: 40px;
    height: 40px;
  }

  .pricing-model-mark {
    display: none;
  }

  .pricing-model h2 {
    font-size: 30px;
  }

  .pricing-facts {
    grid-template-columns: 1fr;
  }

  .pricing-facts > div {
    min-height: 105px;
  }
}

@media (max-width: 390px) {
  .pricing-header .brand-name {
    font-size: 14px;
  }

  .pricing-header-actions {
    gap: 6px;
  }

  .pricing-header .button {
    padding-inline: 10px;
  }

  .pricing-billing button {
    padding-inline: 8px;
  }

  .pricing-billing button span {
    font-size: 5px;
  }
}
.brand-mark {
  border: 0 !important;
  border-radius: 0 !important;
  background: url("./neurarobot-mark.svg") center / contain no-repeat !important;
  box-shadow: none !important;
}
.brand-mark b,
.brand-mark i { display: none !important; }
.mini-brand span {
  border-radius: 0 !important;
  background: url("./neurarobot-mark.svg") center / contain no-repeat !important;
  box-shadow: none !important;
}

.beta-form .beta-full-name{display:grid;gap:9px;text-align:left}.beta-full-name>span{font-size:14px;color:#bed1d5}.beta-full-name>small{font-size:12px;line-height:1.5;color:#93aeb5}.beta-privacy a{color:#83cbbd;text-decoration:underline;text-underline-offset:3px}
