@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:300 700;font-display:swap;src:url('assets/fonts/CormorantGaramond-Italic.ttf') format('truetype')}
:root{color-scheme:dark;font-family:Georgia,'Times New Roman','Songti SC',SimSun,serif;color:#edf2f8;background:#060e18}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,a,input{ -webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}.hero{height:100svh;min-height:600px;position:relative;overflow:hidden;background:#07121e}.poster,#video,#water,.shade{position:absolute;width:100%;height:100%;inset:0;object-fit:cover}#video{opacity:0}#water{opacity:0;transition:opacity 1s}.playing #water{opacity:1}.shade{pointer-events:none;opacity:0;background:linear-gradient(90deg,rgba(2,10,18,.62),transparent 63%),linear-gradient(0deg,rgba(2,10,18,.6),transparent 25%)}.playing .shade{opacity:1}.intro{position:absolute;left:6.7%;top:11%;width:51%;opacity:0;pointer-events:none}.playing .intro{opacity:1;transition:opacity 1.2s}.wordmark{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:clamp(100px,15.4vw,270px);line-height:.98;letter-spacing:-.065em;background:linear-gradient(160deg,#fff 8%,#8295b2 22%,#e6efff 31%,#52667d 44%,#fff 49%,#8d9db6 57%,#d3e2f7 70%,#697c96 78%,#fff 90%);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(1px 3px 2px #020812)}.wordmark span{font-size:.2em;letter-spacing:0;vertical-align:top;display:inline-block;padding-top:22px}h1{font-size:clamp(20px,2vw,36px);font-weight:400;letter-spacing:.23em;margin:22px 0 17px}.role{font-size:clamp(16px,1.7vw,30px);letter-spacing:.14em;margin:0 0 14px}.chinese{font-size:clamp(15px,1.6vw,28px);letter-spacing:.21em;margin:0}.rule{width:76px;height:1px;background:#d6e0e9;margin-top:25px}.explore{position:absolute;top:56%;left:6.7%;width:clamp(280px,21vw,390px);height:70px;border:1px solid #b6c7d5;border-radius:50px;display:flex;align-items:center;gap:22px;letter-spacing:.22em;font-size:20px;background:rgba(7,19,30,.45);backdrop-filter:blur(7px);transition:background .3s,box-shadow .3s}.explore:hover{background:#243e5566;box-shadow:0 0 32px #9ed5ff30}.arrow{width:76px;height:76px;border:1.5px solid #e2f1ff;border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-family:Arial;font-size:43px;margin-left:-2px;letter-spacing:0}.star{margin-left:auto;margin-right:16px;font-size:27px;text-shadow:0 0 18px #b1c6ff}.edit-toggle,.motion-toggle{position:absolute;border:1px solid #b4c8e34a;background:#06111d55;backdrop-filter:blur(12px);border-radius:30px}.edit-toggle{right:30px;top:26px;padding:11px 18px;font:12px Arial;letter-spacing:.12em}.edit-toggle span{margin-left:15px}.motion-toggle{right:30px;bottom:29px;width:36px;height:36px;font:14px Arial}.footnote,.scroll-hint{position:absolute;bottom:40px;font:9px Arial;letter-spacing:.2em;color:#b8c7d4}.footnote{left:6.7%}.footnote i{margin:0 12px;font-style:normal;opacity:.5}.scroll-hint{left:50%;transform:translateX(-50%)}.scroll-hint span{margin-left:15px}.next{min-height:80svh;padding:110px 9%;position:relative;background:radial-gradient(ellipse at 80% 60%,#142c41,#060e18 65%);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.eyebrow,.chapter{font:10px Arial;letter-spacing:.28em;color:#90a9bc}.next h2{font-size:clamp(30px,5vw,70px);font-weight:400;letter-spacing:.08em;margin:30px 0 22px}.next p{color:#a9b7c4;font-size:17px;letter-spacing:.15em}.next-line{width:100%;height:1px;background:linear-gradient(90deg,#597287,transparent);margin:50px 0 25px}.back{position:absolute;top:35px;right:40px;font-size:12px;color:#b5c5d1}dialog{width:min(480px,92vw);max-height:90svh;background:#0d1c2a;color:#edf2f8;border:1px solid #526879;border-radius:20px;padding:28px;box-shadow:0 30px 100px #0009;font-family:system-ui}dialog::backdrop{background:#020a15bb;backdrop-filter:blur(10px)}.editor-head{display:flex;justify-content:space-between;align-items:center}.editor-head small{font-size:10px;letter-spacing:.2em;color:#9ebacf}.editor-head h2{font-size:24px;font-weight:400;margin:8px 0}.editor-head button{border:0;background:none;font:30px Arial}.editor-note{font-size:12px;line-height:1.8;color:#9eb0c0}label{display:block;font-size:12px;color:#bfccd8;margin-top:16px}input{display:block;width:100%;border:1px solid #395064;border-radius:7px;padding:10px;background:#06131f;color:#f3f6fa;margin-top:7px;font:13px system-ui}.editor-actions{display:flex;gap:10px;margin:22px 0 12px}.editor-actions button,.done{border:1px solid #526b80;border-radius:7px;padding:11px;background:#162e42;font:12px system-ui}.done{width:100%;background:#d2e5f5;color:#112332}a:focus-visible,button:focus-visible{outline:2px solid #e4c0eb;outline-offset:5px}@media(min-aspect-ratio:2/1){.intro{top:7%}.wordmark{font-size:23vh}.explore{top:66%}}@media(max-width:700px){.hero{min-height:740px}.poster{object-position:65% center}.intro{top:38%;left:7%;width:86%}.wordmark{font-size:26vw}h1{font-size:22px;margin-top:18px}.role{font-size:15px;letter-spacing:.05em}.chinese{font-size:13px;letter-spacing:.13em}.playing .shade{background:linear-gradient(0deg,#04101bf2 7%,#04101ba6 48%,transparent 85%)}.explore{top:auto;bottom:120px;left:7%;width:280px;font-size:16px;height:58px}.arrow{width:64px;height:64px;font-size:34px}.edit-toggle{top:18px;right:18px}.footnote{bottom:40px;left:7%;font-size:8px}.scroll-hint{display:none}.motion-toggle{right:20px}.next{min-height:65svh;padding:90px 7%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}



