:root{--ink:#0d1c31;--muted:#5f7086;--electric:#3f9cff;--scroll-progress:0;--glass:#f2f8fdb8}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-snap-type:y proximity;background:#eaf4ff}
body{margin:0;color:var(--ink);font-family:Inter,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button{font:inherit}
.site-shell{min-height:400svh;position:relative;background:#eaf4ff}.film-canvas{position:fixed;inset:0;z-index:0;width:100%;height:100%;background:url("./shots/case.png") center/cover no-repeat}
.atmosphere{position:fixed;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(243,249,255,.94),rgba(237,247,255,.65) 27%,rgba(231,244,255,.06) 58%,rgba(213,234,252,.16))}
.loader{position:fixed;inset:0;z-index:50;display:grid;place-content:center;justify-items:center;gap:1rem;color:#fff;background:radial-gradient(circle at 50% 40%,#7aa9d4,#14263d 74%);transition:opacity .8s ease,visibility .8s ease}
.loader.hidden{opacity:0;visibility:hidden}.loader-mark{display:grid;place-items:center;width:3.5rem;height:3.5rem;border:1px solid #ffffff80;border-radius:50%;font-size:1.2rem;animation:breathe 1.6s ease-in-out infinite}.loader p{margin:0;color:#ffffffb8;font-size:.75rem;letter-spacing:.25em}
.site-header{position:fixed;inset:0 0 auto;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:1.75rem clamp(1.5rem,4vw,4rem);mix-blend-mode:multiply}.brand{border:0;padding:0;background:transparent;color:var(--ink);cursor:pointer;font-weight:760;font-size:.9rem;letter-spacing:.24em}.brand sup{font-size:.48rem}.header-meta{display:flex;gap:1.25rem;color:var(--muted);font:550 .62rem/1 ui-monospace,monospace;letter-spacing:.16em}
.chapter-nav{position:fixed;right:clamp(1.35rem,3vw,2.8rem);top:50%;z-index:10;display:flex;flex-direction:column;gap:1rem;transform:translateY(-50%)}.chapter-nav button{display:flex;align-items:center;gap:.65rem;padding:.35rem 0;border:0;background:none;color:#0d1c314d;cursor:pointer}.chapter-nav button:focus:not(:focus-visible){outline:none}.chapter-nav button:focus-visible{outline:2px solid #3f9cff8c;outline-offset:6px;border-radius:.2rem}.chapter-nav span{opacity:0;width:1.7rem;font:650 .56rem/1 ui-monospace,monospace;transition:opacity .25s}.chapter-nav i{width:1.1rem;height:1px;background:currentColor;transition:width .25s,background .25s}.chapter-nav button:hover span,.chapter-nav button.active span{opacity:1}.chapter-nav button.active{color:var(--ink)}.chapter-nav button.active i{width:2.2rem;background:var(--electric)}
.progress-rail{position:fixed;inset:0 auto 0 0;z-index:12;width:3px;background:#ffffff38}.progress-rail i{display:block;width:100%;height:calc(var(--scroll-progress)*100%);background:var(--electric);box-shadow:0 0 16px #3f9cffa8}
.story-section{position:relative;z-index:2;display:flex;align-items:center;min-height:100svh;padding:7.5rem clamp(1.5rem,8vw,7rem) 4.5rem;scroll-snap-align:start}.story-copy{width:min(36rem,72vw)}.story-section.right{justify-content:flex-start}.story-section.right .story-copy{margin-right:0}
.eyebrow,.chapter-number{margin:0 0 1.35rem;color:#456888;font:680 .65rem/1.4 ui-monospace,monospace;letter-spacing:.22em}.story-copy h1,.story-copy h2{margin:0;color:#10233a;font-family:"PingFang SC","HarmonyOS Sans SC","MiSans","Microsoft YaHei",sans-serif;letter-spacing:-.018em;font-weight:600;line-height:1.04;text-wrap:balance;font-kerning:normal}.story-copy h1{font-size:clamp(3.9rem,6.6vw,6rem)}.story-copy h2{font-size:clamp(3.4rem,5.25vw,5rem)}
.lede,.story-copy>p:not(.eyebrow):not(.chapter-number){max-width:29rem;margin:1.65rem 0 0;color:#52677e;font-size:clamp(.9rem,1.05vw,1rem);line-height:1.85;letter-spacing:.018em}.scroll-cue,.primary-action{margin-top:1.9rem;border:0;border-radius:999px;cursor:pointer;transition:transform .25s,background .25s,box-shadow .25s}.scroll-cue{padding:.8rem 0;background:transparent;color:#294b6c;font-size:.72rem;font-weight:650;letter-spacing:.11em}.scroll-cue span{display:inline-block;margin-left:.65rem;color:var(--electric);animation:nudge 1.8s ease-in-out infinite}
.glass-copy{width:min(34rem,72vw);padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}.feature-line{display:flex;gap:.75rem;margin-top:1.6rem}.feature-line span{padding:.52rem .78rem;border:1px solid #376b9926;border-radius:999px;color:#466982;background:#f6fbffb8;box-shadow:0 8px 24px #3c65851a;backdrop-filter:blur(8px);font-size:.66rem;font-weight:650;letter-spacing:.08em}
.story-copy.dark{width:min(34rem,72vw);padding:0;color:var(--ink);border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}.story-copy.dark h2{color:#10233a;text-shadow:0 1px 26px #ffffffd9}.story-copy.dark .chapter-number{color:#456888}.story-copy.dark>p:not(.chapter-number){color:#52677e;text-shadow:0 1px 20px #ffffffc7}.spec-list{display:grid;gap:.85rem;margin-top:1.7rem;max-width:29rem}.spec-list div{display:grid;grid-template-columns:1fr 1.35fr;gap:1rem;padding-top:.8rem;border-top:1px solid #315a7c30}.spec-list dt{color:#254663;font-size:.72rem;font-weight:680}.spec-list dd{margin:0;color:#5b7186;font-size:.71rem;line-height:1.5}
.primary-action{padding:.88rem 1.3rem;color:#fff;background:#10233a;box-shadow:0 10px 28px #12365a24;font-size:.72rem;font-weight:650;letter-spacing:.09em}.primary-action:hover{transform:translateY(-2px);background:#276da8;box-shadow:0 14px 34px #276da83d}footer{position:absolute;left:clamp(1.5rem,8vw,7rem);right:clamp(1.5rem,4vw,4rem);bottom:1.5rem;display:flex;justify-content:space-between;color:#0d1c3170;font:580 .56rem/1 ui-monospace,monospace;letter-spacing:.15em}
@keyframes breathe{50%{transform:scale(1.08);box-shadow:0 0 35px #acdcff47}}@keyframes nudge{50%{transform:translateY(5px)}}
@media(max-width:760px){.site-header{padding:1.2rem 1.15rem}.header-meta span:last-child{display:none}.chapter-nav{display:none}.atmosphere{background:linear-gradient(180deg,#eff8ff1f,#ddecf708 42%,#edf7ffe8 72%,#edf7fff7)}.story-section{align-items:flex-end;padding:6rem 1.25rem 5.25rem}.story-section.right{justify-content:flex-start}.story-section.right .story-copy{margin-right:0}.story-copy{width:calc(100vw - 2.5rem)}.story-copy h1{font-size:clamp(3.2rem,14.5vw,4.5rem);line-height:1.06;letter-spacing:-.012em}.story-copy h2{font-size:clamp(2.85rem,12.4vw,4rem);line-height:1.07;letter-spacing:-.012em}.story-copy>p:not(.eyebrow):not(.chapter-number){font-size:.86rem;line-height:1.76}.eyebrow,.chapter-number{margin-bottom:1.1rem;font-size:.58rem}.glass-copy{width:calc(100vw - 2.5rem);padding:0;background:transparent}.story-copy.dark{width:calc(100vw - 2.5rem);padding:0;background:transparent}.feature-line{flex-wrap:wrap}.spec-list{margin-top:1.35rem}.spec-list div{grid-template-columns:1fr;gap:.25rem}.primary-action{margin-top:1.5rem}footer{left:1.25rem;right:1.25rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}