/* ExactDisk Atmosphere: progressive enhancement, no libraries or remote assets. */
html { scroll-padding-top: 122px; }
body {
  min-height: 100vh;
  isolation: isolate;
  background:
    radial-gradient(ellipse 95% 46% at 65% 4%, rgba(16,130,155,.28), transparent 74%),
    radial-gradient(ellipse 66% 40% at 0% 33%, rgba(21,95,148,.20), transparent 80%),
    linear-gradient(175deg, #081e30 0%, #061320 37%, #07182a 68%, #030a13 100%);
}
body:before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .26;
  background: repeating-linear-gradient(90deg, transparent 0, transparent 119px, rgba(108,218,235,.075) 120px);
  mask-image: linear-gradient(transparent 4%, black 25%, transparent 92%);
}
body > main, body > footer { position: relative; z-index: 1; }
#ambient-field { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; opacity: .85; }
.site-chrome {
  position: sticky;
  top: 0;
  z-index: 40 !important;
  border-bottom: 1px solid rgba(149,235,242,.18);
  background: rgba(5,16,28,.82);
  backdrop-filter: blur(24px) saturate(140%);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
}
.system-bar {
  height: 35px;
  padding: 0 max(24px, calc((100% - var(--max)) / 2));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  font-size: 11px;
  letter-spacing: .025em;
  border-bottom: 1px solid rgba(135,228,241,.15);
  color: #b6d2dc;
  background: rgba(47,129,158,.11);
}
.chrome-left,.chrome-right,.chrome-links { display: flex; align-items: center; gap: 16px; }
.chrome-mark { display: flex; align-items: center; gap: 7px; font-weight: 750; color: #f3fbfd; }
.chrome-mark img { width: 17px; height: 17px; border-radius: 4px; }
.chrome-right { font: 600 10px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; text-transform: uppercase; }
.chrome-light { width: 6px; height: 6px; border-radius: 50%; background: #65edc5; box-shadow: 0 0 9px rgba(101,237,197,.55); }
.chrome-separator { color: #6d9aa9; }
.site-chrome .nav { height: 66px; }
.site-chrome .brand { font-size: 16px; letter-spacing: -.03em; }
.site-chrome .brand img { width: 30px; height: 30px; }
.site-chrome .navlinks { gap: clamp(12px, 2.1vw, 26px); }
.site-chrome .navlinks > a:not(.nav-cta) { color: #b2d0dc; }
.site-chrome .navlinks .nav-cta { padding: 9px 15px; }
.site-chrome .menu-toggle { border-color: rgba(158,224,238,.35); }
.hero { min-height: 780px; padding: 116px 0 82px; overflow: hidden; }
.hero:before {
  inset: -24% -18% auto auto;
  width: 960px;
  height: 960px;
  background: radial-gradient(circle, rgba(25,213,220,.15), rgba(42,116,185,.09) 34%, transparent 67%);
}
.hero:after {
  content: ""; position: absolute; top: 58px; left: 50%; width: 1px; height: 120px;
  background: linear-gradient(to bottom, transparent, rgba(83,247,241,.55), transparent);
  opacity: .65; pointer-events: none;
}
.hero-grid {
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(44px, 5vw, 80px);
  align-items: center;
  position: relative;
}
.hero-copy { max-width: 650px; }
.hero .eyebrow, .chapter-label { color: #8ce9e9; font: 700 11px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .19em; text-transform: uppercase; }
.hero .eyebrow:before { content: "✳"; margin-right: 10px; font-size: 15px; vertical-align: -1px; color: var(--cyan); }
.hero h1 {
  max-width: 660px;
  margin: 24px 0 30px;
  font: 500 clamp(54px, 5.65vw, 84px)/1.02 ui-serif, "Iowan Old Style", "New York", Georgia, serif;
  letter-spacing: -.045em;
  text-wrap: balance;
  text-shadow: 0 7px 40px rgba(2,22,36,.55);
}
.hero h1 em {
  font-weight: 450;
  font-style: italic;
  color: #83f2eb;
  text-shadow: 0 0 48px rgba(46,229,226,.36);
}
.hero .lead {
  font-size: clamp(16px,1.5vw,19px);
  line-height: 1.66;
  color: #c2d6df;
  max-width: 525px;
}
.hero-cta { gap: 15px; }
.button, .nav-cta {
  border-radius: 999px;
  box-shadow: 0 6px 38px rgba(31,210,220,.16), inset 0 1px 0 rgba(255,255,255,.6);
}
.hero .button { padding: 14px 23px; }
.hero .micro { flex-basis: 100%; color: #b7d2dd; font-size: 12px; }
.hero .promise { margin-top: 32px; gap: 11px; }
.hero .promise span {
  border: 1px solid rgba(145,224,235,.20);
  border-radius: 999px;
  padding: 6px 11px;
  background: rgba(14,39,54,.57);
  color: #bcd9e1;
  font-size: 12px;
}
.hero .promise span:before { font-size: 11px; }
.hero-device {
  min-width: 0;
  position: relative;
  padding: 92px 0 85px;
  transform: translateZ(0);
}
.device-aura {
  position: absolute; z-index: -1;
  inset: 5% -16%;
  pointer-events: none;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(28,206,219,.27) 0%, rgba(23,102,168,.15) 42%, transparent 69%);
  filter: blur(12px);
  animation: aura-breathe 9s ease-in-out infinite alternate;
}
.device-orbit {
  position: absolute; z-index: -1; pointer-events: none;
  left: 50%; top: 50%;
  width: 115%; aspect-ratio: 1;
  border: 1px solid rgba(131,238,237,.16);
  border-radius: 50%;
  transform: translate(-50%,-50%) rotate(-18deg) scaleY(.7);
}
.device-orbit.orbit-two {
  width: 139%; border-style: dashed; border-color: rgba(156,214,236,.10);
  transform: translate(-50%,-50%) rotate(28deg) scaleY(.7);
}
.device-window {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(163,250,246,.67), rgba(78,129,169,.24) 40%, rgba(111,237,241,.40));
  box-shadow: 0 42px 100px rgba(0,0,0,.51), 0 0 58px rgba(9,190,196,.13);
  transform: perspective(1100px) rotateY(-7deg) rotateX(4deg);
  transition: transform .45s ease, box-shadow .45s ease;
}
.device-window:hover, .device-window:focus-within { transform: perspective(1100px) rotateY(0) rotateX(0); box-shadow: 0 45px 90px rgba(0,0,0,.58),0 0 70px rgba(9,190,196,.2); }
.device-titlebar {
  display: flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  gap: 7px;
  background: rgba(19,34,50,.98);
  color: #acc9d6;
  font: 600 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .03em;
}
.traffic-light { width: 9px; height: 9px; border-radius: 50%; background: #ff6158; }
.traffic-light.yellow { background: #ffbf38; }
.traffic-light.green { background: #33c95c; }
.titlebar-text { margin-inline: auto; padding-right: 27px; white-space: nowrap; }
.device-window .screenshot-open { border: 0; border-radius: 0; box-shadow: none; background: #081722; }
.device-window .screenshot-open:hover { border: 0; }
.device-window .screenshot-open img { width: 100%; height: auto; }
.hero-device figcaption {
  margin-top: 18px; color: #9ac0ce; text-align: center;
  font: 11px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.float-chip {
  position: absolute; z-index: 2;
  border: 1px solid rgba(155,241,241,.36);
  background: rgba(11,39,54,.86);
  color: #d4f9fc;
  padding: 11px 14px;
  box-shadow: 0 18px 32px rgba(0,0,0,.22);
  border-radius: 12px;
  font: 650 11px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .03em;
  animation: chip-float 6s ease-in-out infinite alternate;
  pointer-events: none;
}
.float-chip small { display: block; margin-top: 3px; font-size: 10px; color: #8ec7d3; font-weight: 450; }
.chip-left { left: -9%; top: 14%; }
.chip-right { right: -5%; bottom: 13%; animation-delay: -3s; }
.chip-dot { display: inline-block; margin-right: 7px; width: 7px; height: 7px; border-radius: 50%; background: #6eedd1; box-shadow: 0 0 12px rgba(110,237,209,.5); }
.chip-right .chip-dot { background: #88cfff; }
.story-nav {
  display: flex; align-items: center; gap: 8px;
  padding: 12px;
  margin-top: -4px;
  position: relative;
  border: 1px solid rgba(131,220,231,.24);
  border-radius: 18px;
  background: rgba(8,30,47,.78);
  box-shadow: 0 20px 50px rgba(0,0,0,.18);
}
.story-nav a {
  flex: 1; display: flex; align-items: center; gap: 12px; min-width: 0;
  padding: 12px 14px; border-radius: 11px; color: #d5e9f0;
  font: 600 13px/1.4 system-ui, sans-serif;
  transition: background .2s, transform .2s;
}
.story-nav a:hover,.story-nav a:focus-visible { background: rgba(37,123,148,.25); transform: translateY(-2px); }
.story-nav .index { color: #79e9eb; font: 700 11px ui-monospace, SFMono-Regular, Menlo, monospace; }
.story-nav .arrow { margin-left: auto; color: #86dbe4; }
.story-nav-label { color: #8db8c7; font: 650 10px ui-monospace,monospace; letter-spacing: .16em; padding-inline: 12px; }
.explore-indicator {
  position: fixed; z-index: 35 !important;
  right: 22px; bottom: 22px; display: flex; align-items: center; gap: 12px;
  border: 1px solid rgba(127,237,238,.22);
  border-radius: 999px; padding: 8px 12px;
  background: rgba(7,25,39,.8);
  font: 650 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .09em;
  color: #c6ecf0;
  pointer-events: none;
}
.progress-track { display: inline-block; width: 45px; height: 3px; border-radius: 10px; background: rgba(177,235,237,.22); overflow: hidden; }
.progress-fill { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left; background: #54f1ee; }
.section { position: relative; }
.section.alt { background: linear-gradient(180deg, rgba(13,44,61,.36),rgba(3,16,31,.19)); }
.section h2,.final h2 {
  font-family: ui-serif, "Iowan Old Style", "New York", Georgia, serif;
  font-weight: 500;
  letter-spacing: -.04em;
  text-wrap: balance;
}
.section h2 { font-size: clamp(39px,4.2vw,61px); }
.section-head { margin-bottom: 44px; }
.section-head .eyebrow { color: #8ce9e9; }
.section-head p { color: #c1d5dd; }
.pain,.view-card,.flow-card,.risk,.safety-item,.feature {
  border-color: rgba(127,191,210,.20);
  background: linear-gradient(150deg, rgba(23,50,70,.79),rgba(8,26,42,.85));
  box-shadow: inset 0 1px 0 rgba(164,230,243,.06), 0 15px 34px rgba(0,0,0,.10);
}
.pain,.feature,.risk,.view-card { transition: border-color .25s, transform .25s, background .25s; }
.pain:hover,.feature:hover,.risk:hover,.view-card:hover {
  border-color: rgba(112,228,230,.52);
  transform: translateY(-3px);
}
.screenshot-open { border-color: rgba(118,208,225,.31); box-shadow: 0 25px 60px rgba(0,0,0,.26); }
.screenshot-open:focus-visible { outline-offset: 5px; }
.screenshot-figure figcaption { color: #b0cbd5; }
.screenshot-figure h3 { color: #f3fafb; }
.privacy-band { background: linear-gradient(120deg,rgba(17,64,79,.74),rgba(8,27,48,.8)); border-color: rgba(117,225,229,.28); }
.final { padding: 105px 0; background: radial-gradient(ellipse 55% 115% at 50% 110%, rgba(22,194,205,.21), transparent 80%),linear-gradient(135deg,rgba(11,61,81,.35),rgba(7,18,33,.75)); }
.final h2 { font-size: clamp(42px,5.4vw,74px); }
.final .button { padding: 14px 25px; }
footer { background: rgba(2,12,22,.8); }
@keyframes chip-float { to { transform: translateY(-12px); } }
@keyframes aura-breathe { to { opacity: .65; transform: scale(1.12); } }
@media (max-width: 1040px) {
  .hero { padding-top: 88px; min-height: 0; }
  .hero-grid { grid-template-columns: minmax(0,1fr); gap: 10px; }
  .hero-copy { max-width: 850px; }
  .hero .lead { max-width: 650px; }
  .hero-device { width: min(760px,100%); margin-inline: auto; padding-top: 55px; padding-bottom: 65px; }
  .chip-left { left: -1%; }
  .chip-right { right: -1%; }
}
@media (max-width: 720px) {
  html { scroll-padding-top: 110px; }
  .system-bar { height: 31px; padding-inline: 17px; font-size: 10px; }
  .chrome-links { display: none; }
  .chrome-right { font-size: 9px; gap: 9px; }
  .site-chrome .nav { height: 61px; }
  .site-chrome .menu-toggle { display: inline-flex; }
  .site-chrome .navlinks { display: none; position: absolute; top: 100%; left: 0; right: 0; padding: 16px 18px 20px; background: rgba(5,21,34,.98); align-items: stretch; gap: 0; flex-direction: column; }
  .site-chrome .navlinks.open { display: flex; }
  .site-chrome .navlinks > a:not(.nav-cta) { padding: 12px 5px; }
  .hero { padding: 24px 0 19px; }
  .hero h1 { font-size: clamp(42px, 10.1vw, 58px); line-height: 1.03; margin: 9px 0 13px; }
  .hero .lead { font-size: 17px; }
  .hero-device { padding-top: 10px; padding-bottom: 20px; }
  .device-window { transform: none; }
  .device-window:hover,.device-window:focus-within { transform: none; }
  .device-orbit { width: 120%; }
  .float-chip,.device-orbit { display: none; }
  .story-nav { overflow-x: auto; padding: 7px; gap: 4px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
  .story-nav a { scroll-snap-align: start; }
  .story-nav-label { display: none; }
  .story-nav a { flex: 0 0 auto; padding: 10px 12px; gap: 8px; font-size: 11px; }
  .story-nav .arrow { display: none; }
  .section h2 { font-size: clamp(36px,11vw,48px); }
  .section { padding: 83px 0; }
  .final { padding: 88px 0; }
  .explore-indicator { display: none; }
}
@media (max-width: 390px) {
  .chrome-separator { display: none; }
  .chrome-right span:nth-of-type(2) { display: none; }
  .hero h1 { font-size: 39px; }
  .hero .promise { gap: 7px; }
  .hero .promise span { font-size: 10px; }
  .hero-device { padding-bottom: 15px; }
  .titlebar-text { font-size: 9px; }
}

/* PR #6 review remediation: mobile-first hierarchy and composited scroll chapters. */
.chrome-right { white-space: nowrap; }
.system-bar { backdrop-filter: none; }
.site-chrome .nav { position: relative; }
.hero .eyebrow:before { content: "✳"; }
.hero h1 { overflow-wrap: normal; }
.hero-grid { align-items: center; }
.story-nav-shell {
  position: relative;
  z-index: 1 !important;
}
.story-swipe-hint { display: none; }
.story-nav {
  margin-top: 0;
  background: rgba(8,30,47,.97);
}
.story-nav a[aria-current="location"] {
  color: #edffff;
  background: rgba(42,158,172,.28);
  box-shadow: inset 0 0 0 1px rgba(95,237,232,.36);
}
.story-nav a[aria-current="location"] .index { color: #b8ffff; }
.explore-indicator {
  bottom: max(30px, calc(env(safe-area-inset-bottom) + 16px));
  right: 28px;
}
.section#screenshots,.section#perspectives,.section#classification,.section#safety {
  scroll-margin-top: 120px;
}
.section#screenshots {
  background: radial-gradient(ellipse 62% 55% at 83% 14%, rgba(10,128,166,.17), transparent 75%);
}
.section#perspectives {
  background: radial-gradient(ellipse 70% 70% at 13% 42%, rgba(26,113,185,.15), transparent 77%);
}
.section#classification {
  background: radial-gradient(ellipse 52% 48% at 86% 26%, rgba(32,191,183,.12), transparent 82%);
}
.section#safety {
  background: linear-gradient(155deg,rgba(7,55,70,.32),rgba(5,19,33,.28));
}
.act-label {
  position: absolute; top: 26px; right: max(5%, calc((100% - var(--max)) / 2));
  font: 650 11px ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .15em; color: rgba(133,237,239,.65); pointer-events: none;
}
@keyframes chapter-enter {
  from { opacity: .86; transform: translate3d(0,16px,0); }
  to { opacity: 1; transform: translate3d(0,0,0); }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .section#screenshots .section-head,
    .section#perspectives .split-copy,
    .section#classification .section-head,
    .section#safety .section-head,
    .section#features .section-head,
    .section#privacy .privacy-band {
      animation: chapter-enter linear both;
      animation-timeline: view();
      animation-range: entry 0% cover 26%;
    }
  }
}
html.save-data #ambient-field { display: none; }
html.save-data .device-aura,html.save-data .float-chip { animation: none !important; }
html.save-data .device-window { transition: none; }
html.save-data .section#screenshots .section-head,
html.save-data .section#perspectives .split-copy,
html.save-data .section#classification .section-head,
html.save-data .section#safety .section-head,
html.save-data .section#features .section-head,
html.save-data .section#privacy .privacy-band { animation: none !important; }
.skip-link { position: fixed; z-index: 80 !important; top: -90px; }
.skip-link:focus-visible { top: 12px; }
@media (prefers-reduced-data: reduce) {
  #ambient-field { display: none; }
  .device-aura,.float-chip { animation: none !important; }
  .section#screenshots .section-head,
  .section#perspectives .split-copy,
  .section#classification .section-head,
  .section#safety .section-head,
  .section#features .section-head,
  .section#privacy .privacy-band { animation: none !important; }
}
@media (max-width: 720px) {
  .system-bar { display: none; }
  .site-chrome .nav { height: 56px; }
  .hero:after { display: none; }
  .hero .eyebrow { font-size: 11px; letter-spacing: .15em; }
  .hero .lead { font-size: 16px; line-height: 1.48; margin-bottom: 14px; max-width: 440px; }
  .hero-cta { gap: 6px 12px; }
  .hero .button { min-height: 44px; padding: 10px 16px; font-size: 14px; }
  .hero .micro { font-size: 12px; line-height: 1.35; }
  .hero .promise { margin-top: 11px; gap: 5px; }
  .hero .promise span { padding: 4px 8px; font-size: 11px; }
  .hero-grid { gap: 0; }
  .hero-device { padding-top: 10px; }
  .device-titlebar { min-height: 27px; }
  .device-window { border-radius: 11px; }
  .hero-device figcaption { margin-top: 8px; font-size: 11px; line-height: 1.5; }
  .story-nav-shell { position: relative; top: auto; z-index: 1 !important; }
  .story-swipe-hint { display: block; font: 650 11px ui-monospace,monospace; letter-spacing: .12em; color: #aee8eb; text-align: right; padding: 0 8px 5px; }
  .section#screenshots,.section#perspectives,.section#classification,.section#safety { scroll-margin-top: 72px; }
}
@media (max-width: 390px) {
  .hero h1 { font-size: 38px; }
  .hero .lead { font-size: 16px; }
  .hero .promise span { font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  #ambient-field { display: none; }
  .device-aura,.float-chip { animation: none !important; }
  .device-window,.pain,.feature,.risk,.view-card,.story-nav a { transition: none !important; }
  .device-window { transform: none; }
}