/* v7: isolated mission and assembly. No dependency on legacy animation styles. */
:root{--nav-height:86px;--n-red:#ff3038;--surface:#101113;--red:#ff3038;--white:#f4f3ef}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#f4f3ef}em{font-style:normal;color:var(--n-red)}img{max-width:100%}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}.reveal.visible{opacity:1;transform:none}
html{scroll-padding-top:calc(var(--nav-height) + 18px)}
body{background:var(--surface);overflow:visible}html{overflow-x:clip}
[hidden]{display:none!important}
.site-nav{height:var(--nav-height);position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:28px;padding:0 6%;background:linear-gradient(110deg,#0e0f10f5,#191718f5,#0e0f10fa);border-bottom:1px solid #ffffff1d;box-shadow:0 5px 25px #0003;backdrop-filter:blur(12px)}
.site-brand{display:block;flex-shrink:0;width:164px;line-height:0}.site-brand img{width:100%;height:76px;object-fit:contain;mix-blend-mode:lighten}
.site-links{display:flex;gap:clamp(16px,2vw,34px);align-items:center;margin:auto}.site-links a{color:#e9e9eb;text-decoration:none;font-size:14px;white-space:nowrap;padding:14px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}.site-links a:hover,.site-links a[aria-current]{color:#fff;border-color:var(--n-red)}
.nav-analysis{background:linear-gradient(120deg,#ff3340,#f10918);color:white;text-decoration:none;font-weight:700;font-size:14px;padding:15px 18px;border-radius:4px;white-space:nowrap;box-shadow:inset 0 1px #ffffff3d}.nav-analysis span{padding-left:9px}
.menu-toggle{display:none}.site-nav a:focus-visible,button:focus-visible,.action-glow:focus-visible,.n-continue:focus-visible{outline:3px solid #ff7d81;outline-offset:5px}
.mission{position:relative;isolation:isolate;min-height:min(890px,calc(100svh - var(--nav-height)));background:#0c0d0e;overflow:hidden;padding:clamp(65px,7vw,120px) 6% 85px;display:flex;align-items:center}
.mission-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 50%;z-index:-2}
.mission:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#090a0dfc 0%,#090a0dea 22%,#090a0dbf 39%,#090a0d38 55%,transparent 74%)}
.mission-copy{width:51%;max-width:740px;color:#f8f8f9}.mission-kicker{font-size:13px;letter-spacing:.26em;font-weight:700;color:#dedee1;display:flex;align-items:center;gap:17px;margin:0 0 25px}.mission-kicker:before{content:"";width:35px;height:2px;background:var(--n-red);flex-shrink:0}
.mission h1{font-size:clamp(38px,4.2vw,72px);line-height:1.09;letter-spacing:-.045em;margin:0 0 30px;font-weight:800}.mission h1 span{color:var(--n-red)}
.mission-copy>p:not(.mission-kicker){max-width:590px;font-size:clamp(16px,1.3vw,21px);line-height:1.55;color:#e2e2e5;margin:0 0 17px}.mission-copy>strong{display:block;max-width:550px;font-size:clamp(18px,1.5vw,24px);line-height:1.45;margin:30px 0 0}.mission-copy>strong:before{content:"";display:block;width:48px;height:1px;background:#98989d;margin-bottom:18px}
.action-glow{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:28px;overflow:hidden;min-height:54px;padding:17px 26px;background:linear-gradient(115deg,#fe0b2e,#e61c25);border:1px solid #ff5d64;border-radius:9px;box-shadow:0 0 24px #fa13363d,inset 0 1px #ffffff52;color:white;text-decoration:none;font:700 18px/1.3 Arial,Helvetica,sans-serif;cursor:pointer;transition:transform .2s,box-shadow .2s}
.action-glow:after{content:"";position:absolute;inset:-50% auto -50% -70%;width:45%;transform:skewX(-22deg);background:linear-gradient(90deg,transparent,#ffffff38,transparent);animation:button-glint 5s ease-in-out infinite;pointer-events:none;z-index:-1}.action-glow:hover{transform:translateY(-2px);box-shadow:0 0 30px #fa13366b}.action-glow span[aria-hidden]{font-size:25px}.mission .action-glow{margin-top:40px}
@keyframes button-glint{0%,60%{left:-70%}90%,100%{left:130%}}
.n-system{position:relative;isolation:isolate;padding:75px 5% 60px;background:radial-gradient(ellipse at 50% 52%,#252329 0,#151519 42%,#101113 75%);border-top:1px solid #ffffff12;overflow:hidden}
.n-system:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.15;background-image:linear-gradient(35deg,transparent 49.7%,#b6b6c039 50%,transparent 50.3%),linear-gradient(-35deg,transparent 49.7%,#b6b6c039 50%,transparent 50.3%);background-size:100px 80px;mask-image:linear-gradient(90deg,#000,transparent 45%,#000)}
.n-heading{text-align:center;max-width:780px;margin:0 auto 28px}.n-heading .mission-kicker{justify-content:center;margin-bottom:17px}.n-heading h2{font-size:clamp(32px,3.6vw,52px);line-height:1.13;letter-spacing:-.035em;margin:0 0 16px}.n-heading>p:last-child{font-size:17px;line-height:1.6;color:#bbbcc5;margin:0}.n-heading em{color:#ff4349}
.n-experience{max-width:1120px;margin:auto}.n-canvas{position:relative;height:460px;contain:layout;isolation:isolate}.troubles{position:absolute;inset:0}.trouble{position:absolute;width:29%;max-width:310px;padding:22px 22px 44px;border:1px solid #ffffff29;border-radius:14px;background:linear-gradient(135deg,#303036ee,#1a1b21f5);box-shadow:0 16px 35px #0004;transform:rotate(var(--tilt));transform-origin:center}
.trouble:nth-child(1){left:3%;top:3%;--tilt:-4deg}.trouble:nth-child(2){right:4%;top:11%;--tilt:3deg}.trouble:nth-child(3){left:8%;top:55%;--tilt:2deg}.trouble:nth-child(4){right:1%;top:61%;--tilt:-3deg}.trouble h3{font-size:18px;line-height:1.3;margin:0 0 10px;color:#fff}.trouble p{font-size:16px;line-height:1.45;margin:0;color:#c7c7d0}.piece-anchor{position:absolute;bottom:15px;left:50%;width:0;height:0}
.fragment-layer,.spark-layer{position:absolute;inset:0;pointer-events:none}.fragment-layer{z-index:3}.n-fragment{position:absolute;left:0;top:0;transform-origin:50% 50%;visibility:hidden;filter:drop-shadow(0 3px 4px #0006)}.n-fragment svg{display:block;width:100%;height:100%;overflow:visible}
.n-burst{position:absolute;left:50%;top:52%;width:180px;height:180px;margin:-90px 0 0 -90px;border-radius:50%;background:radial-gradient(circle,#ffebddaa, #ff3a3655 22%,#ff3a361a 50%,transparent 70%);opacity:0;pointer-events:none;z-index:4}.spark-layer{z-index:5}.n-spark{position:absolute;left:50%;top:52%;width:4px;height:4px;background:#ff8170;opacity:0;border-radius:1px}
.n-finish{position:absolute;inset:0;display:flex;align-items:center;flex-direction:column;pointer-events:none;visibility:hidden}.n-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;width:100%;padding:0;margin:0;list-style:none}.n-steps li{position:relative;min-width:0;border:1px solid #ffffff24;border-radius:10px;padding:16px 12px;background:linear-gradient(130deg,#282a30,#1c1d23);box-shadow:0 10px 22px #0003;opacity:0}.n-steps b{display:block;color:#ff5a60;font-size:14px;margin-bottom:8px}.n-steps span{font-size:15px;font-weight:600;line-height:1.4;display:block}.n-steps li:not(:last-child):after{content:"›";position:absolute;right:-11px;top:38%;color:#ff6b70;z-index:2;font-size:22px}
.n-full-logo{width:clamp(260px,45%,460px);height:auto;max-height:245px;object-fit:contain;margin:28px 0 10px;mix-blend-mode:lighten;opacity:0}.n-resolution{text-align:center;line-height:1.45;font-size:18px;color:#c1c1c9;margin:0;opacity:0}.n-resolution strong{color:#fff;font-size:25px}
.n-controls{position:relative;text-align:center;margin-top:26px;z-index:6}.n-status{font-size:14px;line-height:1.4;color:#c1bdc7;margin:15px 0 0;min-height:20px}.n-continue{display:inline-flex;color:#efedf3;text-decoration:none;border-bottom:1px solid #ff454b6b;padding:12px 0;margin-top:12px;gap:16px;font-size:16px;line-height:1.4}.n-continue:hover{color:#ff767a}
.n-experience[data-state="playing"] .action-glow{background:#282a31;border-color:#555861;box-shadow:none}.n-experience[data-state="playing"] .action-glow:after,.n-experience[data-state="paused"] .action-glow:after,.n-experience[data-state="finished"] .action-glow:after{animation:none;display:none}
.n-experience[data-state="finished"] .n-controls .action-glow{background:#24252c;border-color:#50515a;box-shadow:none;font-size:16px;min-height:46px;padding:12px 22px}
.n-motion-choice{display:flex;align-items:center;justify-content:center;gap:10px;color:#d0ccd5;font-size:14px;line-height:1.4;margin:15px auto 0;min-height:44px;cursor:pointer}.n-motion-choice input{width:20px;height:20px;accent-color:#ff3038}.n-system{scroll-margin-top:0}
.n-steps span{overflow-wrap:break-word}.n-full-logo,.site-brand img{mix-blend-mode:normal}.n-steps b{height:2px;width:22px;background:#ff535b;margin:0 0 12px}
@media(min-width:1700px){.mission{min-height:850px}.mission-copy{width:50%}}
@media(max-width:1100px){.site-nav{padding:0 4%;gap:20px}.site-brand{width:145px}.site-links{gap:16px}.site-links a{font-size:13px}.nav-analysis{font-size:13px;padding:14px}.mission-copy{width:57%}.mission h1{font-size:48px}.mission{padding-left:5%;padding-right:5%}.mission:before{background:linear-gradient(90deg,#090a0df7,#090a0dbf 42%,#090a0d22 80%)}.trouble{width:32%}.trouble:nth-child(1){left:0}.trouble:nth-child(2){right:0}.trouble:nth-child(3){left:2%}.trouble:nth-child(4){right:1%}}
@media(max-width:850px){:root{--nav-height:74px}.site-nav{gap:14px;padding:0 5%}.site-brand{width:138px;margin-right:auto}.site-brand img{height:64px}.nav-analysis{font-size:13px;padding:12px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;border:1px solid #ffffff33;border-radius:6px;background:#ffffff09;width:44px;height:44px;padding:11px;flex-shrink:0}.menu-toggle span{height:2px;width:100%;background:#fff}.site-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:12px 5% 20px;background:#111216;border-bottom:1px solid #ffffff22;box-shadow:0 18px 30px #0006}.site-nav.menu-open .site-links{display:flex}.site-links a{padding:14px 0;font-size:16px}.mission{padding:0 0 42px;display:flex;flex-direction:column;min-height:0}.mission-photo{position:relative;inset:auto;order:0;z-index:0;height:clamp(270px,56vw,460px);object-fit:cover;object-position:80% 42%;width:100%}.mission:before{display:none}.mission-photo{mask-image:linear-gradient(#000 85%,transparent)}.mission-copy{order:1;width:100%;max-width:680px;padding:14px 6% 0;margin:auto}.mission h1{font-size:clamp(35px,6.3vw,51px);line-height:1.12;letter-spacing:-.035em;margin-bottom:23px}.mission-kicker{margin-bottom:19px;font-size:12px}.mission-copy>p:not(.mission-kicker){font-size:16px;line-height:1.6}.mission-copy>strong{font-size:19px}.mission .action-glow{margin-top:28px}.n-system{padding:48px 5% 40px}.n-canvas{height:510px}.trouble{width:37%;padding:18px 18px 42px}.trouble h3{font-size:17px}.trouble p{font-size:15px}.n-steps{gap:9px}.n-steps span{font-size:14px}.n-steps li{padding:12px 9px}.n-full-logo{margin-top:65px}}
@media(max-width:560px){.site-nav{gap:9px}.site-brand{width:119px}.nav-analysis{font-size:12px;padding:12px 10px}.nav-analysis span{padding-left:3px}.n-heading h2{font-size:32px}.n-heading>p:last-child{font-size:16px}.n-heading{margin-bottom:24px}.n-canvas{height:465px}.trouble{width:46%;padding:15px 13px 38px;border-radius:11px}.trouble:nth-child(1){left:1%;top:0;--tilt:-2deg}.trouble:nth-child(2){right:0;top:5%;--tilt:2deg}.trouble:nth-child(3){left:0;top:56%;--tilt:1deg}.trouble:nth-child(4){right:1%;top:61%;--tilt:-2deg}.trouble h3{font-size:16px;line-height:1.3;margin-bottom:9px}.trouble p{font-size:14px;line-height:1.5}.n-steps{grid-template-columns:repeat(6,1fr);gap:9px}.n-steps li{grid-column:span 2;padding:10px 8px;min-height:86px}.n-steps li:nth-child(4){grid-column:2 / span 2}.n-steps span{font-size:13px;line-height:1.35}.n-steps b{font-size:13px;margin-bottom:5px}.n-steps li:after{display:none}.n-full-logo{width:82%;max-width:330px;height:auto;max-height:180px;margin:24px 0 9px}.n-resolution{font-size:16px}.n-resolution strong{font-size:22px}.n-controls{margin-top:22px}.n-continue{max-width:100%;font-size:15px}.action-glow{font-size:17px;gap:23px}.mission .action-glow{width:100%}}
@media(max-width:360px){.site-brand{width:105px}.nav-analysis{font-size:12px;padding:11px 8px}.nav-analysis span{display:none}.mission h1{font-size:33px}.n-canvas{height:510px}.trouble{padding:14px 11px 38px}.n-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.n-steps li,.n-steps li:nth-child(4){grid-column:auto;min-height:75px}.n-steps li:last-child{grid-column:1/-1;min-height:55px}.n-steps span{font-size:14px}.n-full-logo{margin-top:14px;max-height:145px}.n-heading h2{font-size:30px}.n-resolution strong{font-size:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.action-glow:after{animation:none}.action-glow,.site-links a{transition:none}}

/* Keep whole Turkish words together, with enough room for the longest label. */
.n-steps span{overflow-wrap:normal;word-break:normal;hyphens:none;text-wrap:balance}
.n-experience>.n-continue{display:flex;width:fit-content;max-width:100%;margin:22px auto 0;text-align:center}
.n-system{overflow-anchor:none;overflow:clip}
@media(max-width:850px){
  .n-steps{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-width:580px;gap:10px}
  .n-steps li,.n-steps li:nth-child(4){grid-column:auto;padding:12px 10px;min-height:78px}
  .n-steps li:last-child{grid-column:1/-1;min-height:58px}
  .n-steps span{font-size:14px;line-height:1.45}
  .n-steps li:after{display:none}
  .n-full-logo{margin-top:22px}
}
@media(min-width:851px){
  .n-system{padding-top:30px;padding-bottom:32px}
  .n-heading{max-width:1050px;margin-bottom:20px}
  .n-heading .mission-kicker{margin-bottom:10px}
  .n-heading h2{font-size:clamp(30px,3vw,42px);margin-bottom:10px}
  .n-heading h2 br,.n-heading>p:last-child br{display:none}
  .n-heading h2 em:before,.n-heading>p:last-child br:after{content:' '}
  .n-heading>p:last-child{font-size:16px}
  .n-experience{display:flex;flex-direction:column}
  .n-controls{order:0;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:20px;align-items:center;width:760px;max-width:100%;margin:0 auto 22px;min-height:65px}
  .n-controls .action-glow{grid-column:1;grid-row:1/3}
  .n-controls .action-glow,.n-experience[data-state="finished"] .n-controls .action-glow{min-width:218px;min-height:54px;font-size:17px;padding:15px 24px}
  .n-status{grid-column:2;margin:0;min-height:23px;text-align:left;max-width:510px}
  .trouble{padding:16px 18px 38px}
  .trouble h3{font-size:17px}
  .trouble p{font-size:15px;line-height:1.45}
  .n-full-logo{max-height:190px;margin:20px 0 10px}
  .n-motion-choice{grid-column:2;justify-content:flex-start;margin:4px 0 0;min-height:26px}
}
/* Motion is opt-in, including the first paint before JavaScript runs. */
html[data-motion="off"],html[data-motion="off"] *{scroll-behavior:auto!important}
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{animation:none!important;transition:none!important}
html[data-motion="off"] .reveal{opacity:1!important;transform:none!important}
html[data-motion="off"] .process-card:hover,html[data-motion="off"] .project-card:hover,html[data-motion="off"] .process-card:hover img,html[data-motion="off"] .project-card:hover img,html[data-motion="off"] .action-glow:hover{transform:none!important}
.motion-consent{position:fixed;z-index:1000;bottom:22px;right:22px;width:min(470px,calc(100% - 32px));padding:24px;background:#202127;color:#f4f3ef;border:1px solid #64646c;border-radius:14px;box-shadow:0 14px 60px #0009;max-height:calc(100dvh - 32px);overflow:auto}
.motion-consent[hidden],.motion-settings[hidden]{display:none}
.motion-consent h2{font-size:20px;line-height:1.3;margin:0 0 12px}.motion-consent p{font-size:16px;line-height:1.5;color:#d2d2d7;margin:0 0 18px}
.motion-actions{display:flex;flex-wrap:wrap;gap:10px}.motion-actions button,.motion-settings{font:600 14px/1.4 Arial,sans-serif;cursor:pointer;color:#fff;border:1px solid #72727b;border-radius:7px;background:#303138;padding:12px 16px;min-height:44px}
.motion-actions #motion-allow{background:#d91432;border-color:#f45166}.motion-actions button:focus-visible,.motion-settings:focus-visible{outline:3px solid #fff;outline-offset:3px}
.motion-settings{position:fixed;z-index:999;right:16px;bottom:16px;box-shadow:0 5px 20px #0006}
@media(max-width:500px){.motion-consent{bottom:16px;right:16px;padding:20px}.motion-actions{flex-direction:column}.motion-settings{font-size:13px;padding:10px 12px}}

/* The invitation and every phase share one prominent, stable panel below the stage. */
.n-experience{display:flex;flex-direction:column}
.n-controls{order:0;display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);align-items:center;gap:24px;width:100%;max-width:1040px;min-height:142px;margin:26px auto 0;padding:20px 24px;border:1px solid #ff62624d;border-radius:20px;background:radial-gradient(ellipse at 10% 50%,#f82d3823,transparent 65%),#19191fe6;box-shadow:0 12px 40px #0003,inset 0 1px #ffffff0d}
.n-controls #n-play{grid-column:1;grid-row:1;gap:18px;min-width:0;width:100%;min-height:84px;padding:16px 20px;border:1px solid #ff9d9d;border-radius:14px;background:linear-gradient(115deg,#ff3547,#d90926);box-shadow:0 0 32px #ff293b4d,inset 0 1px #ffffff70;text-align:left}
.n-controls #n-play .n-play-icon{display:grid;place-items:center;flex-shrink:0;width:46px;height:46px;border-radius:50%;font-size:23px;background:#ffffff21;border:1px solid #ffffff75}
.n-play-copy{display:flex;flex-direction:column;gap:5px;min-width:0}
.n-play-label{font-size:clamp(20px,2.1vw,27px);font-weight:800;line-height:1.2}
.n-play-hint{font-size:14px;font-weight:600;line-height:1.3;color:#fff0f1}
.n-controls .n-status{grid-column:2;margin:0;max-width:none;min-height:3.6em;display:flex;align-items:center;font-size:clamp(24px,2.8vw,38px);font-weight:800;line-height:1.2;letter-spacing:-.025em;text-align:left;text-wrap:balance;color:#fff6f3;text-shadow:0 0 18px #ff5f6170,0 0 42px #fa294640}
.n-experience[data-state="idle"] .n-status{font-size:clamp(18px,1.8vw,23px);font-weight:500;line-height:1.5;letter-spacing:0;color:#eee2e6;text-shadow:none}
.n-experience:not([data-state="idle"]) .n-play-hint{display:none}
.n-experience:not([data-state="idle"]) .n-controls #n-play{background:#292a32;border-color:#73747e;box-shadow:inset 0 1px #ffffff19}
.n-experience:not([data-state="idle"]) .n-play-label{font-size:20px}
.n-experience[data-state="finished"] .n-controls{border-color:#ff888970;background:radial-gradient(ellipse at 75% 50%,#fc33402b,transparent 75%),#19191f}
.n-experience[data-state="finished"] .n-status{color:#fff5ed;text-shadow:0 0 22px #ff787c85,0 0 48px #ff30384d}
.n-experience[data-state="paused"] .n-status{color:#d4d1dc;text-shadow:none}
.n-steps li{border-color:#ff69694d;background:linear-gradient(140deg,#45242b,#22232b 75%);box-shadow:inset 0 1px #ffaaa921,0 0 20px #ff30380d}
.n-steps span{font-size:clamp(16px,1.6vw,20px);line-height:1.4;color:#fff4f1;text-shadow:0 0 16px #ff666650}
.n-steps b{background:#ff8285;box-shadow:0 0 12px #ff454bcc}
.n-resolution{font-size:clamp(20px,2.4vw,28px);line-height:1.4;color:#dfd7e0}
.n-resolution strong{font-size:clamp(28px,3.2vw,40px);color:#fff4ef;text-shadow:0 0 24px #ff535966}
html[data-motion="on"] .n-experience[data-state="idle"] #n-play{animation:n-invite-glow 2.8s ease-in-out infinite}
html[data-motion="on"] .n-experience[data-state="idle"] #n-play:after{animation:button-glint 3.6s ease-in-out infinite}
html[data-motion="on"] .n-experience[data-state="playing"] .n-status{text-shadow:0 0 20px #ff757b99,0 0 46px #ff30385c}
@keyframes n-invite-glow{0%,100%{box-shadow:0 0 0 0 #ff495733,0 0 28px #ff293b4d,inset 0 1px #ffffff70}50%{box-shadow:0 0 0 8px #ff495700,0 0 46px #ff293b80,inset 0 1px #ffffff70}}
@media(max-width:850px){
  .n-controls{grid-template-columns:minmax(0,1fr);gap:12px;padding:18px;max-width:580px;margin:28px auto 0;min-height:0}
  .n-controls #n-play{grid-row:1;max-width:400px;justify-self:center;min-height:78px}
  .n-controls .n-status{grid-column:1;grid-row:2;justify-content:center;text-align:center;font-size:clamp(23px,4.8vw,32px);min-height:2.6em}
  .n-experience[data-state="idle"] .n-status{font-size:17px;min-height:3.65em}
  .n-steps span{font-size:16px}
  .n-steps li,.n-steps li:nth-child(4){padding:14px 10px}
  .n-resolution{font-size:21px}.n-resolution strong{font-size:28px}
}
@media(prefers-reduced-motion:reduce){html[data-motion="on"] .n-experience[data-state="idle"] #n-play,html[data-motion="on"] .n-experience[data-state="idle"] #n-play:after{animation:none}}
/* Reserve equal space for the invitation, playback phases and final message. */
.n-controls .n-status{min-height:114px}
@media(max-width:850px){.n-controls .n-status,.n-experience[data-state="idle"] .n-status{min-height:84px}}

/* Fixed image frames: no breakpoint resizing, flex shrinking or distortion. */
.trouble-heading{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:12px;min-width:0}
.trouble-image{display:block;flex:none;width:112px;min-width:112px;max-width:none;height:84px;object-fit:cover;object-position:center;border-radius:9px;border:1px solid #ffffff30;background:#25262d}
.trouble-heading h3{margin:0}
.trouble:nth-child(3) .trouble-image{object-position:65% center}
.trouble:nth-child(4) .trouble-image{object-position:30% center}
.trouble h3,.trouble p{overflow-wrap:break-word;min-width:0}
@media(max-width:360px){.trouble{padding-left:6px;padding-right:6px}}
.n-intro{position:absolute;inset:0;z-index:8;display:grid;place-items:center;pointer-events:none;border-radius:22px;background:radial-gradient(ellipse at center,#17171cf5 10%,#17171ce8 45%,#17171ca6 100%)}
.n-intro-title,.n-count{grid-area:1/1;margin:0;text-align:center;opacity:0;color:#fff5f0;text-shadow:0 0 24px #ff525b80,0 0 70px #ff303859}
.n-intro-title{width:100%;padding:20px;font-size:clamp(28px,5vw,64px);line-height:1.15;letter-spacing:-.035em;font-weight:800;text-wrap:balance}
.n-count{font-size:clamp(112px,18vw,220px);line-height:1;font-weight:900;font-variant-numeric:tabular-nums}

/* A single story stage: narration above, steps at the top, logo and link below. */
.n-controls,.n-experience[data-state="finished"] .n-controls{display:flex;justify-content:center;min-height:0;width:100%;padding:0;margin:28px auto 0;border:0;background:none;box-shadow:none}
.n-controls #n-play{width:320px;max-width:100%}
.n-status{position:absolute;top:8px;left:3%;width:94%;max-width:none;min-height:0;margin:0;z-index:7;text-align:center;font-size:clamp(24px,3.2vw,42px);line-height:1.2;font-weight:800;color:#fff5f0;text-wrap:balance;text-shadow:0 0 24px #ff525b70}
.n-status:empty{display:none}
.n-finish{display:block}
.n-steps{position:absolute;top:140px;left:0;max-width:none;margin:0;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.n-steps li{min-height:108px;padding:14px 10px}
.n-steps b{display:grid;place-items:center;width:32px;height:32px;margin:0 auto 10px;background:#ff3446;border-radius:50%;font-size:20px;line-height:1;color:white}
.n-steps span{text-align:center;font-size:16px}
.n-steps li:after{display:none}
.n-step-flights{position:absolute;inset:0;pointer-events:none;z-index:9}
.n-step-flights span{position:absolute;left:50%;top:52%;font-size:106px;line-height:1;font-weight:900;color:#fff4ef;opacity:0;text-shadow:0 0 30px #ff4c6399;transform:translate(-50%,-50%)}
.n-full-logo{position:absolute;left:3%;top:var(--final-top);width:43%;max-width:460px;height:auto;max-height:none;margin:0;transform-origin:center}
.n-finish .n-continue{position:absolute;left:53%;top:calc(var(--final-top) + 20px);width:44%;max-width:none;margin:0;padding:16px 0;display:flex;align-items:center;gap:12px;color:#fff1ed;font-size:clamp(20px,2.4vw,30px);line-height:1.3;font-weight:700;text-wrap:balance;pointer-events:auto;opacity:0}
.n-finish[inert] .n-continue{pointer-events:none}
.n-full-logo{clip-path:polygon(42% 0,100% 0,100% 100%,0 100%,0 80%,42% 80%)}
.n-fragment{filter:none}
.n-intro-title,.n-count,.n-step-flights span,.n-status{text-shadow:0 0 14px #ff525b66}
.n-experience[data-state="playing"] .n-fragment,.n-experience[data-state="playing"] .n-step-flights span{will-change:transform,opacity}
@media(max-width:850px){
 .n-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .n-steps li,.n-steps li:nth-child(4){grid-column:auto;min-height:88px;padding:10px 6px}
 .n-steps li:last-child{grid-column:1/-1;min-height:82px}
 .n-steps span{font-size:14px;line-height:1.3}
 .n-full-logo{left:1%;width:46%}
 .n-finish .n-continue{left:52%;width:47%;top:var(--final-top);font-size:20px}
 .n-status{font-size:26px}
}
