:root {
  color-scheme: dark;
  --ink: #eef8f3;
  --soft: rgba(226, 241, 234, .78);
  --muted: rgba(226, 241, 234, .5);
  --brand: #2de0a5;
  --brand-bright: #62f0bf;
}

* { box-sizing: border-box; }
html { background: #010604; scroll-behavior: auto; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: #010604; color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
button, a { font: inherit; }
img, video { display: block; max-width: 100%; }
[data-copy] { display: none; }
html[lang="bg"] [data-copy="bg"], html[lang="en"] [data-copy="en"] { display: inline; }

.skip-link { position: fixed; left: 1rem; top: -6rem; z-index: 100; padding: .75rem 1rem; border-radius: 999px; background: var(--brand-bright); color: #00120c; font-weight: 900; text-decoration: none; }
.skip-link:focus { top: 1rem; }

.experience-header { position: fixed; inset: 0 0 auto; z-index: 20; min-height: 76px; padding: env(safe-area-inset-top) clamp(1rem, 3vw, 2.5rem) 0; display: flex; align-items: center; justify-content: space-between; pointer-events: none; background: linear-gradient(180deg, rgba(1,6,4,.82), transparent); transition: opacity .28s ease; }
.experience-header a, .experience-header button { pointer-events: auto; }
.experience-brand { display: inline-flex; align-items: center; gap: .72rem; color: var(--ink); font-size: .88rem; font-weight: 950; letter-spacing: .08em; text-decoration: none; }
.experience-brand img { width: 42px; height: 42px; object-fit: contain; filter: drop-shadow(0 0 18px rgba(45,224,165,.22)); }
.experience-nav { display: flex; align-items: center; gap: 1.1rem; }
.experience-nav > a { color: var(--soft); font-size: .82rem; font-weight: 750; text-decoration: none; }
.experience-nav > a:hover, .experience-nav > a:focus-visible { color: var(--brand-bright); }
.language-switch { display: inline-flex; padding: 3px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(1,8,5,.58); backdrop-filter: blur(16px); }
.language-switch button { min-width: 39px; height: 34px; border: 0; border-radius: 999px; background: transparent; color: var(--muted); font-size: .7rem; font-weight: 900; cursor: pointer; }
.language-switch button[aria-pressed="true"] { background: var(--brand-bright); color: #00120c; }

.experience-track { position: relative; height: 1320vh; background: #010604; }
.experience-stage { position: sticky; top: 0; width: 100%; height: 100svh; min-height: 520px; overflow: hidden; isolation: isolate; background: #010604; }
.experience-films { position: absolute; inset: 0; z-index: -5; background: #010604; }
.experience-film { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0; filter: brightness(.77) saturate(.94) contrast(1.07); transform: scale(1.01); transition: opacity .22s linear; contain: strict; will-change: opacity; }
.experience-film.is-active { opacity: 1; }
.experience-shade { position: absolute; inset: 0; z-index: -4; pointer-events: none; background: radial-gradient(circle at 50% 48%, transparent 22%, rgba(0,0,0,.1) 60%, rgba(0,0,0,.52) 100%), linear-gradient(90deg,rgba(0,5,3,.4),transparent 33%,transparent 67%,rgba(0,5,3,.34)), linear-gradient(180deg,rgba(0,5,3,.4),transparent 20%,transparent 70%,rgba(0,5,3,.68)); transition: background .35s ease; }
html[data-experience-phase="copy"] .experience-shade { background: radial-gradient(circle at 50% 48%, transparent 14%, rgba(0,0,0,.22) 58%, rgba(0,0,0,.67) 100%), linear-gradient(90deg,rgba(0,5,3,.62),transparent 46%,rgba(0,5,3,.3)), linear-gradient(180deg,rgba(0,5,3,.48),transparent 22%,rgba(0,5,3,.64)); }
.experience-grain { position: absolute; inset: -40%; z-index: -3; pointer-events: none; opacity: .028; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.62'/%3E%3C/svg%3E"); animation: grain-shift 6s steps(5) infinite; }
@keyframes grain-shift { 0% { transform: translate3d(-2%,1%,0); } 25% { transform: translate3d(1%,-2%,0); } 50% { transform: translate3d(2%,2%,0); } 75% { transform: translate3d(-1%,-1%,0); } 100% { transform: translate3d(-2%,1%,0); } }

.experience-loading { position: absolute; inset: 0; z-index: 15; display: grid; place-content: center; justify-items: center; gap: 1rem; background: #010604; color: var(--muted); font-size: .7rem; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; transition: opacity .45s ease, visibility .45s step-end; }
.experience-loading i { width: 46px; height: 46px; border: 2px solid rgba(98,240,191,.16); border-top-color: var(--brand-bright); border-radius: 50%; animation: loading-spin .8s linear infinite; }
.experience-loading.is-hidden { opacity: 0; visibility: hidden; pointer-events: none; }
@keyframes loading-spin { to { transform: rotate(1turn); } }

.experience-copies { position: absolute; inset: 0; pointer-events: none; }
.experience-copy { position: absolute; top: 50%; width: min(calc(100% - 2.5rem), 650px); padding: 1.3rem 1.45rem 1.45rem; border-left: 2px solid var(--brand-bright); background: linear-gradient(90deg,rgba(1,8,5,.92),rgba(1,8,5,.45),transparent); opacity: 0; visibility: hidden; transform: translate3d(0,calc(-50% + 24px),0); transition: opacity .28s ease, transform .48s cubic-bezier(.2,.8,.2,1), visibility .28s step-end; }
.experience-copy[data-align="left"] { left: clamp(1.25rem,6vw,7rem); }
.experience-copy[data-align="right"] { right: clamp(1.25rem,6vw,7rem); border-left: 0; border-right: 2px solid var(--brand-bright); background: linear-gradient(270deg,rgba(1,8,5,.9),rgba(1,8,5,.38),transparent); text-align: right; }
.experience-copy[data-align="center"] { left: 50%; width: min(calc(100% - 2rem), 920px); padding: 1.4rem 1.75rem; border: 0; background: radial-gradient(ellipse at center,rgba(1,8,5,.78),rgba(1,8,5,.34) 52%,transparent 75%); text-align: center; transform: translate3d(-50%,calc(-50% + 24px),0); }
.experience-copy.is-active { opacity: 1; visibility: visible; transform: translate3d(0,-50%,0); transition: opacity .32s ease .12s, transform .55s cubic-bezier(.2,.8,.2,1) .08s, visibility 0s; }
.experience-copy[data-align="center"].is-active { transform: translate3d(-50%,-50%,0); }
.story-kicker { margin: 0 0 .85rem; color: var(--brand-bright); font-size: clamp(.65rem,1vw,.8rem); font-weight: 900; letter-spacing: .2em; }
.experience-copy h1, .experience-copy h2 { max-width: 13ch; margin: 0 0 .8rem; font-size: clamp(2.5rem,5.4vw,5.7rem); line-height: .94; letter-spacing: -.055em; text-wrap: balance; text-shadow: 0 18px 70px rgba(0,0,0,.8); }
html[lang="bg"] .experience-copy h1, html[lang="bg"] .experience-copy h2 { line-height: 1.04; letter-spacing: -.04em; }
.experience-copy[data-align="right"] h2, .experience-copy[data-align="right"] > p { margin-left: auto; }
.experience-copy[data-align="center"] h1, .experience-copy[data-align="center"] h2, .experience-copy[data-align="center"] > p { margin-left: auto; margin-right: auto; }
.experience-copy > p:last-of-type { max-width: 600px; margin-bottom: 0; color: var(--soft); font-size: clamp(1rem,1.35vw,1.14rem); line-height: 1.55; text-wrap: balance; }
.experience-intro .story-kicker { font-size: clamp(.72rem,1.25vw,1rem); letter-spacing: .19em; }
.experience-intro h1 { max-width: 15ch; }
.experience-strategies[data-align="center"] { top: 51%; width: min(calc(100% - 2rem), 1080px); padding: .75rem 1.5rem 1rem; display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,340px); gap: clamp(2rem,6vw,5rem); align-items: center; background: radial-gradient(ellipse at center,rgba(1,8,5,.92),rgba(1,8,5,.5) 61%,transparent 86%); }
.experience-strategies h2 { max-width: 20ch; margin: 0 0 0 auto; font-size: clamp(2.55rem,4.35vw,4.55rem); text-align: right; }
.strategy-phone-preview { position: relative; width: min(340px,30vw); margin: 0; filter: drop-shadow(0 28px 46px rgba(0,0,0,.62)); }
.strategy-phone-preview::before, .strategy-phone-preview::after { content: ""; position: absolute; z-index: -1; width: 5px; border-radius: 0 5px 5px 0; background: linear-gradient(180deg,#456158,#15211d); box-shadow: 1px 0 2px rgba(0,0,0,.7); }
.strategy-phone-preview::before { right: -5px; top: 20%; height: 76px; }
.strategy-phone-preview::after { left: -5px; top: 17%; height: 112px; border-radius: 5px 0 0 5px; }
.strategy-phone-shell { position: relative; width: 100%; aspect-ratio: 1080 / 2340; overflow: hidden; border: 8px solid #0a0e0d; border-radius: 48px; background: #020806; box-shadow: 0 0 0 1px rgba(139,171,159,.55), inset 0 0 0 1px rgba(255,255,255,.1), 0 0 44px rgba(45,224,165,.16); }
.strategy-phone-shell::after { content: ""; position: absolute; inset: 0; border-radius: 38px; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255,255,255,.05), inset 16px 0 24px rgba(255,255,255,.025); }
.strategy-phone-screen { width: 100%; height: 100%; max-width: none; object-fit: cover; display: none; }
html[lang="bg"] .strategy-phone-screen-bg, html[lang="en"] .strategy-phone-screen-en { display: block; }
.experience-feature[data-align="center"] { width: min(calc(100% - 2rem), 1080px); padding: 1rem 1.5rem; display: grid; grid-template-columns: minmax(0,1fr) 250px; gap: clamp(1.4rem,4vw,3.5rem); align-items: center; background: radial-gradient(ellipse at center,rgba(1,8,5,.92),rgba(1,8,5,.58) 62%,transparent 88%); text-align: left; }
.experience-feature .feature-copy { min-width: 0; text-align: left; }
.experience-feature .feature-copy h2 { max-width: 17ch; margin: 0 0 .75rem; font-size: clamp(2.35rem,4.35vw,4.35rem); line-height: .98; text-wrap: balance; }
.experience-feature .feature-copy > p:not(.story-kicker):not(.feature-note) { max-width: 620px; margin: 0; color: var(--soft); font-size: clamp(.96rem,1.25vw,1.1rem); line-height: 1.5; text-wrap: balance; }
.feature-facts { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.feature-facts > span { padding: .55rem .72rem; border: 1px solid rgba(98,240,191,.28); border-radius: 999px; background: rgba(2,18,12,.76); color: var(--brand-bright); font-size: .72rem; font-weight: 800; }
.feature-note { max-width: 620px; margin: .8rem 0 0; color: var(--muted); font-size: .7rem; line-height: 1.4; }
.phone-preview { position: relative; width: 242px; margin: 0; justify-self: end; filter: drop-shadow(0 28px 44px rgba(0,0,0,.5)); }
.phone-shell { position: relative; width: 100%; aspect-ratio: 1080 / 2340; overflow: hidden; border: 6px solid rgba(7,17,13,.96); border-radius: 32px; background: #020806; box-shadow: 0 0 0 1px rgba(98,240,191,.25), 0 0 38px rgba(45,224,165,.13); }
.phone-shell::after { content: ""; position: absolute; top: 8px; left: 50%; width: 32%; height: 8px; border-radius: 999px; background: rgba(0,0,0,.76); transform: translateX(-50%); }
.phone-screen { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: top center; display: none; }
html[lang="bg"] .phone-screen-bg, html[lang="en"] .phone-screen-en { display: block; }
.experience-feature-booster .phone-preview { width: min(310px,32vw); }
.experience-feature-track { grid-template-columns: minmax(280px,310px) minmax(0,1fr) !important; }
.experience-feature-track .phone-preview { grid-column: 1; grid-row: 1; width: min(310px,30vw); justify-self: start; }
.experience-feature-track .feature-copy { grid-column: 2; grid-row: 1; }
.experience-copy.experience-final[data-align="center"] { top: auto; bottom: 3.5rem; padding-top: .85rem; padding-bottom: .85rem; transform: translate3d(-50%,24px,0); }
.experience-copy.experience-final[data-align="center"].is-active { transform: translate3d(-50%,0,0); }
.experience-final h2 { max-width: 23ch; font-size: clamp(2.15rem,3.9vw,4.15rem); }
.experience-final > p:last-of-type { max-width: 720px; }
.final-steps { margin-top: 1rem; display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem; }
.final-steps > span { padding: .48rem .72rem; border: 1px solid rgba(98,240,191,.3); border-radius: 999px; background: rgba(2,18,12,.72); color: var(--brand-bright); font-size: .7rem; font-weight: 850; }
.release-status { margin-top: 1rem; display: flex; justify-content: center; gap: .65rem; }
.release-status > span { min-width: 150px; padding: .75rem 1rem; display: grid; gap: .12rem; border: 1px solid rgba(98,240,191,.3); border-radius: 14px; background: rgba(1,12,8,.7); backdrop-filter: blur(14px); }
.release-status b { font-size: .82rem; letter-spacing: .03em; }
.release-status small { color: var(--brand-bright); font-size: .63rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.launch-notify { margin-top: .8rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .65rem; }
.launch-notify > span { color: var(--soft); font-size: .76rem; }
.launch-notify-button { min-height: 40px; padding: .66rem .95rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--brand-bright); border-radius: 999px; background: var(--brand-bright); color: #00120c; font-size: .72rem; font-weight: 900; text-decoration: none; pointer-events: auto; transition: transform .2s ease, box-shadow .2s ease; }
.launch-notify-button:hover, .launch-notify-button:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(45,224,165,.24); }

.experience-progress { position: absolute; left: clamp(1.25rem,3vw,2.5rem); right: clamp(1.25rem,3vw,2.5rem); bottom: calc(1.35rem + env(safe-area-inset-bottom)); display: grid; grid-template-columns: auto 1fr 34px; gap: 1rem; align-items: center; color: var(--muted); font-size: .66rem; font-weight: 900; letter-spacing: .15em; transition: opacity .28s ease; }
.experience-progress i { height: 2px; overflow: hidden; background: rgba(255,255,255,.16); }
.experience-progress b { display: block; width: 100%; height: 100%; background: linear-gradient(90deg,var(--brand),#60e4ff); box-shadow: 0 0 16px rgba(45,224,165,.65); transform: scaleX(var(--experience-progress,0)); transform-origin: left; }
.experience-balance { position: absolute; left: clamp(1.25rem,3vw,2.5rem); top: calc(88px + env(safe-area-inset-top)); display: grid; gap: .22rem; padding: .55rem .7rem; border: 1px solid rgba(98,240,191,.18); border-radius: 12px; background: rgba(1,10,7,.52); color: var(--muted); backdrop-filter: blur(12px); transition: opacity .3s ease, transform .3s ease; }
.experience-balance > span { font-size: .52rem; font-weight: 900; letter-spacing: .13em; }
.experience-balance strong { color: var(--ink); font-size: 1.28rem; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
html[data-active-story="final"] .experience-progress, html[data-active-story="final"] .experience-balance { opacity: 0; }
html[data-active-story="final"] .experience-balance { transform: translateY(-8px); }
.scene-counter { position: absolute; right: clamp(1.25rem,3vw,2.5rem); top: calc(84px + env(safe-area-inset-top)); display: flex; align-items: center; gap: .5rem; color: var(--muted); font-size: .62rem; font-weight: 900; letter-spacing: .13em; transition: opacity .28s ease; }
.scene-counter i { width: 24px; height: 1px; background: rgba(255,255,255,.24); }
.scroll-instruction { position: absolute; left: 50%; bottom: calc(4rem + env(safe-area-inset-bottom)); display: grid; justify-items: center; gap: .55rem; color: rgba(238,248,243,.72); font-size: .64rem; font-weight: 900; letter-spacing: .15em; transform: translateX(-50%); opacity: var(--intro-opacity,1); pointer-events: none; white-space: nowrap; }
.scroll-instruction i { width: 1px; height: 28px; background: linear-gradient(var(--brand-bright),transparent); animation: scroll-pulse 1.6s ease-in-out infinite; }
@keyframes scroll-pulse { 0%,100% { opacity: .3; transform: scaleY(.55); transform-origin: top; } 50% { opacity: 1; transform: scaleY(1); transform-origin: top; } }
.noscript { padding: 2rem; color: var(--soft); }

@media (max-width: 700px) {
  .experience-header { min-height: 64px; padding-left: max(1rem,env(safe-area-inset-left)); padding-right: max(1rem,env(safe-area-inset-right)); }
  .experience-brand span, .experience-nav > a { display: none; }
  .experience-brand img { width: 38px; height: 38px; }
  .experience-track { height: 1280vh; }
  .experience-film { object-position: 50% center; filter: brightness(.72) saturate(.93) contrast(1.08); }
  .scene-counter { top: calc(72px + env(safe-area-inset-top)); }
  .experience-copy, .experience-copy[data-align="left"], .experience-copy[data-align="right"] { left: 1rem; right: 1rem; top: auto; bottom: calc(6.5rem + env(safe-area-inset-bottom)); width: auto; padding: 1rem 1rem 1.05rem; border-left: 1px solid var(--brand-bright); border-right: 0; background: linear-gradient(90deg,rgba(1,8,5,.92),rgba(1,8,5,.6),rgba(1,8,5,.28)); text-align: left; transform: translate3d(0,22px,0); }
  .experience-copy.is-active, .experience-copy[data-align="right"].is-active { transform: none; }
  .experience-copy[data-align="center"] { left: 50%; right: auto; top: 48%; bottom: auto; width: min(calc(100% - 2rem), 620px); border: 0; background: radial-gradient(ellipse at center,rgba(1,8,5,.82),rgba(1,8,5,.4) 56%,transparent 80%); text-align: center; transform: translate3d(-50%,calc(-50% + 22px),0); }
  .experience-copy[data-align="center"].is-active { transform: translate3d(-50%,-50%,0); }
  .experience-copy.experience-final[data-align="center"] { top: auto; bottom: calc(1rem + env(safe-area-inset-bottom)); width: calc(100% - 1rem); padding: .6rem .55rem .7rem; transform: translate3d(-50%,22px,0); }
  .experience-copy.experience-final[data-align="center"].is-active { transform: translate3d(-50%,0,0); }
  .experience-copy[data-align="right"] h2, .experience-copy[data-align="right"] > p { margin-left: 0; }
  .experience-copy h1, .experience-copy h2 { max-width: 16ch; font-size: clamp(2rem,9.8vw,3.25rem); }
  .experience-copy > p:last-of-type { font-size: .92rem; line-height: 1.45; }
  .experience-copy[data-align="center"] h1, .experience-copy[data-align="center"] h2 { max-width: 14ch; }
  .experience-strategies[data-align="center"] { top: 49%; bottom: auto; width: calc(100% - .5rem); padding: .35rem .45rem .5rem; grid-template-columns: 1fr; gap: .55rem; justify-items: center; background: radial-gradient(ellipse at center,rgba(1,8,5,.94),rgba(1,8,5,.62) 68%,transparent 94%); }
  .experience-strategies[data-align="center"] h2 { max-width: 20ch; margin: 0 auto; font-size: clamp(1.65rem,7.2vw,2.15rem); text-align: center; }
  .strategy-phone-preview { width: min(270px,30svh,calc(100vw - 1.5rem)); margin: 0 auto; }
  .strategy-phone-shell { border-width: 6px; border-radius: 39px; }
  .strategy-phone-shell::after { border-radius: 31px; }
  .experience-feature[data-align="center"] { top: 50%; bottom: auto; width: calc(100% - 1rem); padding: .55rem .7rem .7rem; grid-template-columns: 1fr; gap: .55rem; justify-items: center; background: radial-gradient(ellipse at center,rgba(1,8,5,.94),rgba(1,8,5,.68) 72%,transparent 96%); text-align: center; }
  .experience-feature .feature-copy { text-align: center; }
  .experience-feature .feature-copy h2 { max-width: 18ch; margin: 0 auto .4rem; font-size: clamp(1.45rem,6.4vw,1.85rem); line-height: 1; }
  .experience-feature .feature-copy > p:not(.story-kicker):not(.feature-note) { max-width: 37ch; margin-inline: auto; font-size: .68rem; line-height: 1.32; }
  .experience-feature .story-kicker { margin-bottom: .4rem; font-size: .54rem; }
  .feature-facts { margin-top: .5rem; justify-content: center; gap: .3rem; }
  .feature-facts > span { padding: .34rem .42rem; font-size: .54rem; }
  .feature-note { max-width: 38ch; margin: .42rem auto 0; font-size: .51rem; line-height: 1.28; }
  .phone-preview { width: min(360px,calc(100vw - 1rem)); justify-self: center; }
  .phone-shell { height: 430px; aspect-ratio: auto; border-width: 4px; border-radius: 22px; }
  .phone-shell::after { display: none; }
  .phone-screen { position: absolute; top: 0; left: 0; width: 100%; height: auto; object-fit: contain; }
  .experience-feature-booster .phone-preview { width: min(230px,25.5svh,calc(100vw - 1.5rem)); }
  .experience-feature-booster .phone-shell { height: auto; aspect-ratio: 1080 / 2340; }
  .experience-feature-booster .phone-screen { width: 100%; height: 100%; object-fit: cover; transform: none; }
  .experience-feature-track { grid-template-columns: 1fr !important; }
  .experience-feature-track[data-align="center"] { top: 50%; gap: .45rem; padding: .35rem .45rem .45rem; }
  .experience-feature-track .feature-copy { grid-column: 1; grid-row: 1; }
  .experience-feature-track .phone-preview { grid-column: 1; grid-row: 2; width: min(260px,calc(100vw - 2rem)); justify-self: center; }
  .experience-feature-track .phone-shell { height: min(420px,57vh); aspect-ratio: auto; }
  .experience-feature-track .phone-screen { width: 100%; height: auto; object-fit: contain; object-position: top center; }
  .experience-feature-track .phone-screen-en { top: -48px; }
  .experience-final[data-align="center"] h2 { max-width: 19ch; font-size: clamp(1.75rem,7.5vw,2.4rem); }
  .experience-final[data-align="center"] > p:last-of-type { font-size: .82rem; }
  .final-steps { margin-top: .65rem; gap: .3rem; }
  .final-steps > span { padding: .34rem .52rem; font-size: .56rem; }
  .release-status { gap: .45rem; }
  .release-status > span { min-width: 0; flex: 1; padding: .55rem .6rem; }
  .launch-notify { margin-top: .55rem; display: grid; justify-items: center; gap: .4rem; }
  .launch-notify > span { font-size: .63rem; }
  .launch-notify-button { min-height: 36px; padding: .55rem .85rem; font-size: .66rem; }
  .experience-progress { bottom: calc(.9rem + env(safe-area-inset-bottom)); grid-template-columns: 1fr 32px; }
  .experience-progress-label { display: none; }
  .experience-balance { left: max(.75rem,env(safe-area-inset-left)); top: calc(66px + env(safe-area-inset-top)); max-width: 180px; padding: .42rem .52rem; border-radius: 10px; }
  .experience-balance > span { font-size: .43rem; }
  .experience-balance strong { font-size: 1rem; }
  .scroll-instruction { bottom: calc(3.8rem + env(safe-area-inset-bottom)); }
  html[data-active-story="strategies"] .experience-balance,
  html[data-active-story="strategies"] .scene-counter,
  html[data-active-story="plan"] .experience-balance,
  html[data-active-story="plan"] .scene-counter,
  html[data-active-story="progress"] .experience-balance,
  html[data-active-story="progress"] .scene-counter { opacity: 0; }
}

@media (max-width: 700px) and (max-height: 720px) {
  html[data-active-story="plan"] .experience-header,
  html[data-active-story="progress"] .experience-header { opacity: 0; pointer-events: none; }
  html[data-active-story="strategies"] .experience-balance,
  html[data-active-story="strategies"] .scene-counter,
  html[data-active-story="strategies"] .experience-progress { opacity: 0; }
  .experience-strategies[data-align="center"] { top: 51%; gap: .55rem; padding: .2rem .35rem .3rem; }
  .experience-strategies[data-align="center"] h2 { max-width: 20ch; font-size: clamp(1.35rem,6.2vw,1.7rem); line-height: 1.02; }
  .strategy-phone-preview { width: min(205px,29svh,calc(100vw - 1.5rem)); }
  .strategy-phone-shell { border-width: 5px; border-radius: 34px; }
  .strategy-phone-shell::after { border-radius: 27px; }
  html[data-active-story="plan"] .experience-balance,
  html[data-active-story="plan"] .scene-counter,
  html[data-active-story="plan"] .experience-progress { opacity: 0; }
  .experience-feature-booster[data-align="center"] { top: 50%; gap: .35rem; padding: .25rem .4rem .35rem; }
  .experience-feature-booster .feature-copy h2 { font-size: clamp(1.25rem,5.7vw,1.55rem); }
  .experience-feature-booster .feature-copy > p:not(.story-kicker):not(.feature-note) { max-width: 38ch; font-size: .61rem; }
  .experience-feature-booster .feature-facts,
  .experience-feature-booster .feature-note { display: none; }
  .experience-feature-booster .phone-preview { width: min(178px,25svh,calc(100vw - 1.5rem)); }
}

@media (max-width: 700px) and (min-height: 800px) {
  .experience-feature-track .phone-shell { height: auto; aspect-ratio: 1080 / 2340; }
  .experience-feature-track .phone-screen { top: 0; height: 100%; object-fit: cover; }
  .experience-feature-track .phone-screen-en { top: 0; }
}

@media (max-height: 620px) and (orientation: landscape) {
  .experience-copy h1, .experience-copy h2 { font-size: clamp(2rem,7vw,3.8rem); }
  .experience-copy > p:last-of-type { font-size: .9rem; }
  .experience-copy { top: 48%; }
  .scene-counter { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .experience-film, .experience-copy, .experience-shade, .experience-loading { transition: none; }
  .experience-grain, .scroll-instruction i, .experience-loading i { animation: none; }
}
