/* A separate mobile composition on the shared home route. HTML is complete before motion. */
[data-home-mobile]{display:none}
@media(max-width:720px),(max-width:1024px) and (max-height:540px) and (pointer:coarse){
  [data-home-desktop]{display:none}
  [data-home-mobile]{display:block}
  .mobile-home{--mobile-accent:#d5f66b;--mobile-edge:#e4eed41c;--mobile-quiet:#a4aa9c;--mobile-nav:15 18 15;position:relative;isolation:isolate;font-size:15px;line-height:1.6}
  html[data-site-theme=light] .mobile-home{--mobile-accent:#375b2b;--mobile-edge:#29432626;--mobile-quiet:#5e6b56;--mobile-nav:245 246 239}
  .mobile-home :is(h1,h2,h3,p){margin:0}
  .mobile-home a{text-decoration:none}
  .mobile-home :is(a,button){-webkit-tap-highlight-color:transparent}
  .mobile-home :is(a,button):focus-visible,.mobile-scenes:focus-visible{outline:2px solid var(--mobile-accent);outline-offset:5px}
  body[data-view=home] .product-nav{height:calc(64px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) max(14px,env(safe-area-inset-right,0px)) 0 max(14px,env(safe-area-inset-left,0px));margin-inline:0;gap:6px}
  body[data-view=home] .product-nav::before{inset:0;background:rgb(15 18 15 / .82);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
  html[data-site-theme=light][data-site-theme-scope=marketing] body[data-view=home] .product-nav::before{background:rgb(245 246 239 / .88)}
  body[data-view=home] .product-nav::after{background:linear-gradient(90deg,transparent,#d5e9ac2a,transparent)}
  html[data-site-theme=light][data-site-theme-scope=marketing] body[data-view=home] .product-nav::after{background:linear-gradient(90deg,transparent,#29432626,transparent)}
  body[data-view=home] .product-nav .wordmark{font-size:24px;gap:3px}
  body[data-view=home] .product-nav .account-nav{gap:1px}
  body[data-view=home] .product-nav :is(.nav-control,.avatar-trigger,.brand-logo-control){min-width:44px;min-height:44px}
  body[data-view=home] .product-nav .nav-language{min-width:55px;font-size:10px}
  body[data-view=home] .product-nav .avatar-trigger{width:44px;height:44px;min-width:44px;min-height:44px;margin:0}
  body[data-view=home] .product-nav .avatar-trigger img{width:44px;height:44px}
  body[data-view=home] .settings-close{min-width:44px;min-height:44px}
  body[data-view=home] .product-nav .wordmark-home{display:inline-flex;align-items:center;min-height:44px}
  .mobile-intro,.mobile-world,.mobile-result,.mobile-closing,.mobile-footer{padding-left:max(22px,env(safe-area-inset-left,0px));padding-right:max(22px,env(safe-area-inset-right,0px));max-width:650px;margin-inline:auto}
  .mobile-eyebrow{font:9px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.1em;color:var(--mobile-quiet);text-transform:uppercase;display:flex;align-items:center;gap:9px}
  .mobile-eyebrow i{width:5px;height:5px;border-radius:50%;background:var(--mobile-accent);box-shadow:0 0 12px #d5f66b44}
  .mobile-intro{position:relative;padding-top:24px;padding-bottom:36px}
  .mobile-intro:before{content:'';position:absolute;z-index:-1;pointer-events:none;inset:-64px -20px 0;background:radial-gradient(ellipse at 85% 42%,#a7c16a12,transparent 66%);transform:translateY(var(--mobile-light-y,0px))}
  .mobile-intro h1{font-size:clamp(36px,11.7vw,68px);font-weight:500;letter-spacing:-.075em;line-height:1.15;margin:20px 0 15px}
  .mobile-intro h1 span,.mobile-world h2 span,.mobile-closing h2 span{color:var(--mobile-accent)}
  .mobile-intro-note{font-size:13px;line-height:1.8;color:var(--mobile-quiet)}
  .mobile-deck{margin-top:22px;min-width:0}
  .mobile-scenes{--mobile-card:calc(100vw - 56px);position:relative;display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:22px;overscroll-behavior-x:contain;scrollbar-width:none;margin-inline:-22px;padding:0 34px 0 22px;touch-action:pan-x pan-y pinch-zoom;outline-offset:-3px;isolation:isolate}
  .mobile-scenes::-webkit-scrollbar{display:none}
  .mobile-scene{position:relative;isolation:isolate;flex:0 0 var(--mobile-card);height:clamp(290px,87vw,374px);border-radius:23px;scroll-snap-align:start;overflow:hidden;background:#eeece3;box-shadow:inset 0 0 0 1px #e2dfd13d;transform:scale(1);transition:transform 180ms cubic-bezier(.2,.7,.2,1)}
  .mobile-scene[data-pressed=true]{transform:scale(.986)}
  .mobile-scene:after{content:'';position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px #edf2d81a;background:radial-gradient(ellipse at var(--touch-x,70%) 60%,#e9f8bd00,transparent 65%);transition:background 200ms}
  .mobile-scene[data-pressed=true]:after{background:radial-gradient(ellipse at var(--touch-x,70%) 60%,#e9f8bd22,transparent 65%)}
  .mobile-scene-art{position:absolute;inset:0;transform:translate3d(var(--scene-depth,0px),0,0);pointer-events:none}
  .mobile-scene-title{position:absolute;top:27px;left:24px;z-index:3;font-size:clamp(30px,8.5vw,40px);font-weight:500;line-height:1.19;letter-spacing:-.065em;color:#293326;transform:translate3d(var(--scene-copy-shift,0px),0,0)}
  .mobile-scene-number{position:absolute;right:21px;bottom:17px;color:#39452c85;font:10px ui-monospace,monospace;z-index:3}
  .mobile-person{position:absolute;width:76%;height:119%;right:-9%;bottom:-26%;object-fit:contain;object-position:center bottom}
  .mobile-portrait-photo{position:absolute;inset:0;opacity:0}
  .mobile-portrait-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .mobile-hello{position:absolute;left:16px;bottom:21px;font-size:clamp(72px,24vw,104px);line-height:.9;letter-spacing:-.09em;color:#a4aa8b}
  .mobile-profile-mark{position:absolute;right:20px;top:25px;color:#59664c;font:7px/1.5 ui-monospace,monospace;letter-spacing:.03em;text-align:right}
  .mobile-scene--work{background:radial-gradient(ellipse at 74% 78%,#3b4931,#18221d 70%)}
  .mobile-scene--work .mobile-scene-title,.mobile-scene--life .mobile-scene-title{color:#f0f2e8}
  .mobile-scene--work .mobile-scene-number,.mobile-scene--life .mobile-scene-number{color:#e8eddb9e}
  .mobile-project{position:absolute;border-radius:10px;background:#222725;box-shadow:0 12px 24px #0005,0 0 0 1px #f2f6df1f;width:75%;overflow:hidden;transform-origin:50% 50%;animation:mobile-project-drift 9s ease-in-out infinite alternate;animation-play-state:paused}
  .mobile-project span{display:flex;align-items:center;gap:5px;height:24px;padding:0 9px;color:#cad3be;font:8px ui-monospace,monospace}
  .mobile-project span i{height:4px;width:4px;background:#d5f66b;border-radius:50%}
  .mobile-project b{font-size:12px;margin-left:auto;font-weight:400}
  .mobile-project img{display:block;width:100%;height:auto}
  .mobile-project--one{--project-rotation:-9deg;right:12%;top:42%;transform:rotate(-9deg)}
  .mobile-project--two{--project-rotation:8deg;right:-11%;top:63%;transform:rotate(8deg);animation-delay:-4s}
  .mobile-scene[data-animate=true] .mobile-project{animation-play-state:running}
  @keyframes mobile-project-drift{from{transform:translate3d(0,4px,0) rotate(var(--project-rotation))}to{transform:translate3d(-3px,-5px,0) rotate(calc(var(--project-rotation) + 2deg))}}
  .mobile-life-photo{width:100%;height:100%;object-fit:cover;object-position:58% 45%;transform:scale(1.07);animation:mobile-life-drift 12s ease-in-out infinite alternate;animation-play-state:paused}
  .mobile-scene[data-animate=true] .mobile-life-photo{animation-play-state:running}
  @keyframes mobile-life-drift{from{transform:scale(1.07) translate3d(0,0,0)}to{transform:scale(1.12) translate3d(-6px,-3px,0)}}
  .mobile-scene--life .mobile-scene-art:after{content:'';position:absolute;inset:0;background:linear-gradient(160deg,#101b34b8,transparent 66%,#0d172866)}
  .mobile-life-stamp{position:absolute;z-index:2;bottom:23px;left:23px;color:#edf1df;font:10px/1.5 ui-monospace,monospace;letter-spacing:.08em}
  .mobile-scene-controls{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:13px}
  .mobile-scene-tabs{display:flex;gap:4px;padding:3px;border:1px solid var(--mobile-edge);border-radius:999px;background:var(--panel)}
  .mobile-scene-tabs button{border:0;border-radius:999px;background:transparent;color:var(--mobile-quiet);font:inherit;font-size:12px;line-height:1.4;padding:10px 17px;min-height:44px;transition:background-color 200ms,color 200ms;white-space:nowrap}
  .mobile-scene-tabs button[aria-pressed=true]{background:#d5f66b;color:#1d2914}
  .mobile-scene-count{font:9px ui-monospace,monospace;white-space:nowrap;letter-spacing:.04em;color:var(--mobile-quiet)}
  .mobile-scene-count b{color:var(--ink);font-weight:400}
  .mobile-deck .mobile-scene-hint{font-size:9px;color:var(--mobile-quiet);margin-top:9px;letter-spacing:.025em}
  .mobile-hero-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:23px}
  .mobile-primary{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:52px;padding:14px 22px;border-radius:999px;background:#d5f66b;color:#1d2914;font-size:13px;font-weight:500;line-height:1.5;transition:transform 160ms,background-color 160ms}
  .mobile-primary>span:last-child{font-size:22px;line-height:1}
  .mobile-primary:active{transform:scale(.98);background:#e2ff8a}
  .mobile-secondary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;color:var(--ink);font-size:11px}
  .mobile-secondary>span:last-child{font-size:18px}
  .mobile-world{position:relative;padding-top:54px;padding-bottom:45px;overflow:hidden}
  .mobile-world h2,.mobile-result h2,.mobile-closing h2{font-size:clamp(32px,9.7vw,48px);font-weight:500;line-height:1.25;letter-spacing:-.07em;margin-top:19px}
  .mobile-world-art{position:relative;height:clamp(225px,63vw,330px);margin:5px -10px 0;isolation:isolate}
  .mobile-world-art:before{content:'';position:absolute;inset:0 -30px -15px;background:radial-gradient(ellipse at 50% 55%,#c5e47d15,transparent 70%);z-index:-1}
  .mobile-world-art svg{position:absolute;width:100%;height:100%;inset:0;overflow:visible;transform:translate3d(0,var(--mobile-word-y,0px),0) scale(var(--mobile-word-scale,1));transform-origin:center}
  .mobile-world-chip{position:absolute;z-index:1;padding:7px 12px;border:1px solid var(--mobile-edge);border-radius:999px;background:var(--bg);color:var(--mobile-quiet);font-size:9px;line-height:1.5;letter-spacing:.02em}
  .mobile-world-chip--one{left:1%;top:16%;transform:translate3d(calc(-1 * var(--mobile-spread,0px)),0,0) rotate(-9deg)}
  .mobile-world-chip--two{right:1%;top:5%;transform:translate3d(var(--mobile-spread,0px),0,0) rotate(8deg)}
  .mobile-world-chip--three{right:18%;bottom:2%;transform:translate3d(var(--mobile-spread,0px),0,0) rotate(-5deg)}
  .mobile-world-line{position:absolute;height:1px;bottom:22px;left:0;right:50%;background:linear-gradient(90deg,var(--mobile-edge),transparent);transform:rotate(-8deg)}
  .mobile-world-note{color:var(--mobile-quiet);font-size:13px;line-height:1.9;margin-top:12px!important}
  .mobile-result{padding-top:39px;padding-bottom:43px}
  .mobile-result-note{color:var(--mobile-quiet);font-size:12px;margin-top:12px!important}
  .mobile-result-card{position:relative;display:block;margin-top:25px;background:#c8cbc4;border-radius:21px;overflow:hidden;box-shadow:0 0 0 1px var(--mobile-edge);color:#fff;transition:transform 180ms}
  .mobile-result-card:active{transform:scale(.986)}
  .mobile-result-image{display:block;width:100%;height:auto;aspect-ratio:1.25;object-fit:cover;object-position:50% 25%}
  .mobile-result-overlay{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;position:absolute;left:0;right:0;bottom:54px;padding:48px 20px 19px;background:linear-gradient(transparent,#101611bd);font:11px/1.5 ui-monospace,monospace;letter-spacing:.06em}
  .mobile-result-overlay small{display:block;font:10px/1.8 -apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;letter-spacing:0;opacity:.85;margin-top:4px}
  .mobile-result-enter{display:grid;place-items:center;width:40px;height:40px;border:1px solid #fff6;border-radius:50%;font-size:23px}
  .mobile-result-cta{height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:var(--panel);color:var(--ink);font-size:12px}
  .mobile-result-cta>span:last-child{font-size:20px;color:var(--mobile-accent)}
  .mobile-closing{padding-top:43px;padding-bottom:24px;border-top:1px solid var(--mobile-edge)}
  .mobile-closing h2{margin-top:16px}
  .mobile-steps{list-style:none;padding:0;margin:28px 0 29px;display:grid;gap:18px}
  .mobile-steps li{display:flex;align-items:flex-start;gap:17px}
  .mobile-steps li>span{font:9px/1.8 ui-monospace,monospace;color:var(--mobile-accent);padding-top:2px}
  .mobile-steps h3{font-size:13px;line-height:1.5;font-weight:500}
  .mobile-steps p{font-size:10px;line-height:1.8;color:var(--mobile-quiet);margin-top:3px}
  .mobile-closing>.mobile-primary{width:100%;min-height:54px}
  .mobile-museum-entry{margin-top:26px;padding-top:20px;border-top:1px solid var(--mobile-edge)}
  .mobile-museum-entry p{font-size:10px;color:var(--mobile-quiet)}
  .mobile-museum-entry a{display:flex;align-items:center;justify-content:space-between;min-height:48px;font-size:12px;color:var(--ink)}
  .mobile-museum-entry a>span:last-child{font-size:22px;color:var(--mobile-accent)}
  .mobile-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:17px;padding-bottom:max(26px,env(safe-area-inset-bottom,0px));border-top:1px solid var(--mobile-edge)}
  .mobile-footer>span{font:500 25px/1 var(--brand-font);letter-spacing:.025em}
  .mobile-footer small{font:7px ui-monospace,monospace;letter-spacing:.05em;color:var(--mobile-quiet)}
  .mobile-sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .mobile-scenes.is-dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}
  .has-mobile-preview{overflow:hidden}
  .mobile-preview{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;overflow:hidden;background:var(--bg);color:var(--ink)}
  .mobile-preview::backdrop{background:#0b0d0a}
  .mobile-preview-toolbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;height:calc(58px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px));border-bottom:1px solid var(--mobile-edge);background:var(--bg)}
  .mobile-preview-toolbar button,.mobile-preview-toolbar a{display:inline-flex;align-items:center;gap:12px;min-height:44px;border:0;padding:5px 0;background:none;color:var(--ink);font:12px/1.5 -apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif}
  .mobile-preview-toolbar button>span:first-child{font-size:23px}
  .mobile-preview-toolbar a{font-size:10px;color:var(--mobile-quiet)}
  .mobile-preview iframe{position:absolute;inset:calc(58px + env(safe-area-inset-top,0px)) 0 0;width:100%;height:calc(100% - 58px - env(safe-area-inset-top,0px));border:0;display:block;background:#999e9e}
  .mobile-preview-loading{position:absolute;top:48%;left:20px;right:20px;text-align:center;color:var(--mobile-quiet);font-size:12px}
  .mobile-preview[data-loaded=true] .mobile-preview-loading{display:none}
  html[lang=en] .mobile-intro h1{font-size:clamp(34px,10.6vw,61px);letter-spacing:-.06em;line-height:1.12}
  html[lang=en] .mobile-scene-title{font-size:clamp(28px,8.3vw,40px)}
  html[lang=en] .mobile-scene-tabs button{padding-inline:14px;font-size:11px}
  html[lang=en] .mobile-world h2,html[lang=en] .mobile-result h2,html[lang=en] .mobile-closing h2{font-size:clamp(31px,9.1vw,46px)}
}
@media(max-width:360px){
  body[data-view=home] .product-nav .wordmark{font-size:20px}
  .mobile-intro,.mobile-world,.mobile-result,.mobile-closing,.mobile-footer{padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}
  .mobile-scenes{margin-inline:-18px;padding-left:18px;padding-right:30px;scroll-padding-inline:18px;--mobile-card:calc(100vw - 48px)}
  .mobile-scene{height:290px}
  .mobile-scene-title{left:21px;top:25px;font-size:29px}
  .mobile-profile-mark{font-size:6px;right:15px}
  .mobile-hero-actions{gap:10px}
  .mobile-primary{padding-inline:18px;font-size:12px;gap:19px}
  .mobile-secondary{font-size:10px;gap:8px}
  .mobile-scene-tabs button{padding-inline:14px}
  .mobile-scene-count{font-size:8px}
  html[lang=en] .mobile-scene-tabs button{padding-inline:11px}
}
@media(min-width:560px) and (max-width:720px),(min-width:721px) and (max-width:1024px) and (max-height:540px) and (pointer:coarse){
  .mobile-intro{display:grid;grid-template-columns:1fr 1.1fr;grid-template-areas:'copy deck' 'actions deck';gap:24px;padding-top:40px;padding-bottom:44px;align-items:start}
  .mobile-intro-copy{grid-area:copy;padding-top:10px}
  .mobile-intro h1{font-size:clamp(36px,6.9vw,49px);margin-top:23px}
  html[lang=en] .mobile-intro h1{font-size:clamp(32px,6.2vw,43px)}
  .mobile-intro-note{font-size:11px}
  .mobile-deck{grid-area:deck;margin:0}
  .mobile-scenes{margin:0;padding:0;--mobile-card:100%;scroll-padding-inline:0;gap:12px}
  .mobile-scene{height:330px;border-radius:20px}
  .mobile-scene-title{font-size:29px;left:20px}
  .mobile-profile-mark{font-size:6px;right:14px}
  .mobile-scene-controls{gap:5px}
  .mobile-scene-tabs button{padding-inline:12px;font-size:11px}
  html[lang=en] .mobile-scene-tabs button{padding-inline:8px}
  .mobile-scene-count{font-size:8px}
  .mobile-hero-actions{grid-area:actions;align-self:end;display:grid;gap:5px;margin-top:0}
  .mobile-secondary{padding-inline:20px;max-width:210px}
  .mobile-world{padding-top:34px;padding-bottom:35px;display:grid;grid-template-columns:1fr 1.3fr;column-gap:22px}
  .mobile-world>.mobile-eyebrow{grid-column:1/-1}
  .mobile-world h2{grid-column:1;margin-top:35px}
  .mobile-world-art{grid-column:2;grid-row:2/4;height:270px;margin-top:10px}
  .mobile-world-note{grid-column:1;align-self:end;padding-bottom:20px}
  .mobile-result-card{max-width:500px;margin-inline:auto}
}
@media(max-width:720px) and (prefers-reduced-motion:reduce),(max-width:1024px) and (max-height:540px) and (pointer:coarse) and (prefers-reduced-motion:reduce){
  .mobile-home *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .mobile-world-art svg,.mobile-world-chip,.mobile-scene-art,.mobile-scene-title{transform:none!important}
  .mobile-portrait-photo{opacity:0!important}
}
@media(max-width:720px) and (prefers-reduced-transparency:reduce),(max-width:1024px) and (max-height:540px) and (pointer:coarse) and (prefers-reduced-transparency:reduce){
  body[data-view=home] .product-nav::before{background:var(--bg)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  @media(max-width:720px),(max-width:1024px) and (max-height:540px) and (pointer:coarse){body[data-view=home] .product-nav::before{background:var(--bg)!important}}
}
