/* Layout measured against the owner-approved 2048 × 1152 hero artwork. */
body:not([data-page]){background:#fff}
body:not([data-page]) .hero{background-image:radial-gradient(#c7d2dd 1px,transparent 1.2px);background-size:27px 27px}
body:not([data-page]) .site-header{width:min(1600px,calc(100% - 44px));max-width:none;height:100px;min-height:100px;padding:0;border:0;background:transparent}
body:not([data-page]) .site-header .wordmark{font-size:43px;letter-spacing:-.075em}
body:not([data-page]) .site-header .wordmark-icon,body:not([data-page]) .site-header .wordmark-dot{display:none}
body:not([data-page]) .site-header .wordmark-store{margin-left:15px;padding-left:16px;font-size:15px;color:#526b84}
body:not([data-page]) .desktop-nav{position:absolute;left:50%;transform:translateX(-50%);margin:0;gap:70px;font-size:23px;font-weight:400}
body:not([data-page]) .desktop-nav a{font-size:inherit}
body:not([data-page]) .account-button{display:none}
body:not([data-page]) .header-actions{margin-left:auto}
body:not([data-page]) .header-cta{display:grid;place-items:center;width:200px;min-height:62px;padding:0;border-radius:15px;font-size:22px;font-weight:600;box-shadow:none}
body:not([data-page]) .hero-stage{max-width:2048px;height:clamp(790px,51.4vw,1052px);min-height:0;overflow:hidden}
body:not([data-page]) .stage-grain{inset:0;opacity:1;background-color:transparent;background-image:none;mask-image:none}
body:not([data-page]) .hero-copy{max-width:1180px;margin:0 auto;padding:clamp(194px,12vw,245px) 0 0;text-align:center;transform:none}
body:not([data-page]) .hero-kicker{display:none}
body:not([data-page]) .hero h1{width:max-content;max-width:100%;margin:0 auto;letter-spacing:-.082em;line-height:.83;transform:none}
body:not([data-page]) .title-keyhole{font-size:clamp(112px,9.9vw,203px);line-height:.84;font-weight:900;letter-spacing:-.085em;margin:0;transform:none}
body:not([data-page]) .title-animation{font-size:clamp(124px,10.25vw,210px);line-height:.82;letter-spacing:-.07em;margin:-3px 0 0;transform:none}
body:not([data-page]) .hero-strap{width:max-content;max-width:100%;font-size:clamp(32px,2.52vw,52px);line-height:1.05;margin:clamp(24px,2vw,40px) auto 0;letter-spacing:-.055em;transform:none}
body:not([data-page]) .hero-description{width:max-content;max-width:100%;font-size:clamp(17px,1.25vw,26px);line-height:1.25;margin:17px auto 0;transform:none}
body:not([data-page]) .hero-buttons{position:relative;left:auto;top:auto;z-index:30;display:flex;justify-content:center;gap:24px;width:auto;margin:36px auto 0;transform:none}
body:not([data-page]) .hero-buttons .button{min-height:81px;min-width:242px;padding:0 30px;border-radius:14px;font-size:24px;font-weight:600;gap:14px;box-shadow:0 4px 7px #10191f0d}
body:not([data-page]) .hero-buttons .button-secondary{border:1px solid #aab7c2;background:#fff}
body:not([data-page]) .hero-buttons .button-primary span{font-size:0}
body:not([data-page]) .hero-blue-rule,body:not([data-page]) .hero-tag,body:not([data-page]) .stage-index{display:none}
body:not([data-page]) .panel{padding:15px 17px;border:1px solid #343c44;border-radius:13px;background:linear-gradient(155deg,#30363b,#22272c 70%);box-shadow:0 18px 25px #25313a2b;font-size:16px}
body:not([data-page]) .panel-top{height:32px}
body:not([data-page]) .panel-title{font-size:18px;font-weight:650;font-style:normal}
body:not([data-page]) .panel-search{height:32px;margin:12px 0 7px}
body:not([data-page]) .project-row,body:not([data-page]) .transform-row,body:not([data-page]) .effects-row{height:34px}
body:not([data-page]) .project-row small{font-size:14px}
body:not([data-page]) .panel-project{display:block;left:6%;top:clamp(28px,1.8vw,38px);width:clamp(260px,19.5vw,400px);height:clamp(218px,13.7vw,280px);transform:rotate(7deg)}
body:not([data-page]) .panel-transform{display:block;left:10.5%;top:clamp(340px,19vw,400px);width:clamp(250px,17.1vw,350px);height:clamp(190px,12.2vw,250px);transform:rotate(5deg)}
body:not([data-page]) .panel-transform .transform-row strong{font-size:16px}
body:not([data-page]) .panel-timeline{display:block;left:3.4%;bottom:25px;width:clamp(380px,29.3vw,600px);height:clamp(185px,12vw,245px);transform:rotate(-9deg)}
body:not([data-page]) .panel-timeline .track{height:31px}
body:not([data-page]) .panel-timeline .track span{width:95px}
body:not([data-page]) .panel-graph{display:block;right:5%;top:clamp(55px,3.3vw,70px);width:clamp(310px,23.5vw,482px);height:clamp(240px,17.2vw,352px);transform:rotate(7deg)}
body:not([data-page]) .panel-graph .graph-svg{height:clamp(145px,10vw,205px)}
body:not([data-page]) .panel-effects{display:block;right:5%;top:clamp(345px,22vw,450px);bottom:auto;width:clamp(255px,17.2vw,352px);height:clamp(280px,18vw,370px);transform:rotate(4deg)}
body:not([data-page]) .panel-effects .effects-row{height:30px;font-size:15px}
body:not([data-page]) .panel-expression{display:block;right:7%;bottom:75px;width:clamp(310px,20.5vw,420px);height:155px;transform:rotate(4deg)}
body:not([data-page]) .panel-expression .code-line{font-size:17px}
body:not([data-page]) .ae-tile{display:grid;left:28.5%;top:70px;width:106px;height:106px;border:6px solid #8e4af0;border-radius:17px;background:#28115f;color:#c69aff;font-size:51px;font-weight:700;letter-spacing:-.07em;transform:rotate(-13deg);box-shadow:0 15px 26px #26125636}
body:not([data-page]) .selection-box{display:grid;right:35%;top:35px;width:142px;height:142px;border-width:2px;transform:rotate(-11deg)}
body:not([data-page]) .selection-star{font-size:85px}
body:not([data-page]) .spark-two{right:29%;bottom:245px;width:27px;height:27px}
.fall-glyph,.fall-word{position:absolute;z-index:3;display:block;white-space:pre;pointer-events:none;transform-origin:center center;overflow:visible}

/* Illustrated assets are several times larger than their displayed size.
   Their own framing fills the body; no nested black padding or stretching. */
body:not([data-page]) .hero-stage .panel[data-illustrated-panel]{padding:0;border:0;height:auto;background:transparent;overflow:hidden}
body:not([data-page]) .panel[data-illustrated-panel] img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none}
body:not([data-page]) .panel-project[data-illustrated-panel]{aspect-ratio:4/3}
body:not([data-page]) .panel-transform[data-illustrated-panel],body:not([data-page]) .panel-graph[data-illustrated-panel]{aspect-ratio:3/2}
body:not([data-page]) .panel-timeline[data-illustrated-panel]{aspect-ratio:1983/793;bottom:55px}
body:not([data-page]) .panel-effects[data-illustrated-panel]{aspect-ratio:1}
body:not([data-page]) .panel-expression[data-illustrated-panel]{aspect-ratio:3;bottom:55px}
body:not([data-page]) .selection-box{width:126px;height:126px}

@media(max-width:1099px){
  body:not([data-page]) .site-header{height:78px;min-height:78px}
  body:not([data-page]) .site-header .wordmark{font-size:28px}
  body:not([data-page]) .desktop-nav{gap:25px;font-size:15px}
  body:not([data-page]) .header-cta{width:auto;min-height:45px;padding:0 16px;font-size:14px;border-radius:8px}
  body:not([data-page]) .hero-stage{height:790px}
  body:not([data-page]) .hero-copy{padding-top:224px;max-width:760px}
  body:not([data-page]) .hero-kicker{display:none}
  body:not([data-page]) .title-keyhole{font-size:clamp(90px,12vw,132px)}
  body:not([data-page]) .title-animation{font-size:clamp(94px,12.5vw,140px)}
  body:not([data-page]) .hero-strap{font-size:clamp(26px,3.5vw,36px);margin-top:29px}
  body:not([data-page]) .hero-description{font-size:18px}
  body:not([data-page]) .hero-buttons{position:relative;left:auto;top:auto;gap:12px;margin-top:25px;transform:none}
  body:not([data-page]) .hero-buttons .button{min-width:164px;min-height:56px;padding:0 16px;font-size:16px;border-radius:8px}
  body:not([data-page]) .hero-blue-rule,body:not([data-page]) .hero-tag,body:not([data-page]) .stage-index{display:none}
  body:not([data-page]) .panel{padding:10px 12px;font-size:12px}
  body:not([data-page]) .panel-title{font-size:13px}
  body:not([data-page]) .panel-top{height:22px}
  body:not([data-page]) .panel-search{height:22px;margin:7px 0 5px}
  body:not([data-page]) .project-row,body:not([data-page]) .effects-row{height:24px;font-size:11px}
  body:not([data-page]) .panel-graph .graph-svg{height:105px}
  body:not([data-page]) .panel-transform,body:not([data-page]) .panel-expression{display:none}
  body:not([data-page]) .panel-project{left:22px;top:25px;width:235px;height:210px}
  body:not([data-page]) .panel-graph{right:22px;top:25px;width:255px;height:210px}
  body:not([data-page]) .panel-timeline{left:22px;bottom:35px;width:325px;height:170px}
  body:not([data-page]) .panel-effects{right:22px;top:auto;bottom:35px;width:230px;height:228px}
  body:not([data-page]) .ae-tile{left:22%;top:105px;width:66px;height:66px;font-size:32px}
  body:not([data-page]) .selection-box{right:35%;top:105px;width:82px;height:82px}
  body:not([data-page]) .selection-star{font-size:48px}
}

@media(max-width:760px){
  body:not([data-page]) .site-header{height:68px;min-height:68px}
  body:not([data-page]) .site-header .wordmark{font-size:25px}
  body:not([data-page]) .site-header .wordmark-store{font-size:10px;margin-left:8px;padding-left:8px}
  body:not([data-page]) .desktop-nav,body:not([data-page]) .header-cta{display:none}
  body:not([data-page]) .account-button{display:none}
  body:not([data-page]) .hero-stage{height:720px}
  body:not([data-page]) .hero-copy{padding:193px 18px 0;max-width:100%;width:100%;text-align:center}
  body:not([data-page]) .title-keyhole{font-size:clamp(71px,21vw,104px)}
  body:not([data-page]) .title-animation{font-size:clamp(75px,22vw,110px)}
  body:not([data-page]) .hero-strap{font-size:clamp(24px,6.7vw,31px);margin-top:32px}
  body:not([data-page]) .hero-description{font-size:14px;margin-top:12px}
  body:not([data-page]) .hero-buttons{gap:8px;margin-top:24px}
  body:not([data-page]) .hero-buttons .button{min-width:0;min-height:52px;padding:0 13px;font-size:13px}
  body:not([data-page]) .panel{padding:9px 10px;font-size:10px}
  body:not([data-page]) .panel-title{font-size:12px}
  body:not([data-page]) .panel-search{height:18px;margin:4px 0}
  body:not([data-page]) .project-row,body:not([data-page]) .effects-row{height:21px;font-size:10px}
  body:not([data-page]) .panel-graph .graph-svg{height:88px}
  body:not([data-page]) .panel-project{left:12px;top:21px;width:min(40vw,175px);height:auto}
  body:not([data-page]) .panel-graph{right:12px;top:20px;width:min(40vw,185px);height:auto}
  body:not([data-page]) .panel-timeline{left:12px;bottom:30px;width:min(52vw,235px);height:auto}
  body:not([data-page]) .panel-effects{right:12px;top:auto;bottom:30px;width:min(38vw,170px);height:auto}
  body:not([data-page]) .ae-tile,body:not([data-page]) .selection-box,body:not([data-page]) .spark{display:none}
}