@import"https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;500;600&family=DM+Sans:wght@400;500;600&display=swap";:root{color-scheme:dark;font-family:DM Sans,sans-serif;color:#e4e4de;background:#080e14;font-synthesis:none;--muted: #89969c;--ice: #b5e2e4}*{box-sizing:border-box}body{margin:0;min-width:320px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.35}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #b9e7e7;outline-offset:6px}[hidden]{display:none!important}button{border:0;background:none}#app{min-height:100svh;overflow:hidden;position:relative;isolation:isolate}.ambient{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 75% 42%,#22394265,transparent 50%),radial-gradient(ellipse at 8% 80%,#12323730,transparent 45%);z-index:-2}.grain{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.1;z-index:8;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='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E")}.header{height:114px;max-width:1520px;margin:0 auto;padding:0 5.3%;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:10}.identity{display:flex;align-items:center;gap:13px;font-size:12px;letter-spacing:.16em}.identity-mark{font-size:33px;font-weight:300;color:#c4d6d6}.identity-sub{display:block;font-size:8px;color:#7f9299;letter-spacing:.21em;margin-top:6px}.text-button{font-size:12px;letter-spacing:.08em;color:#bec6c7;padding:12px 0}.text-button span{margin-left:18px;font-size:19px}.text-button:hover{color:#fff}#entrance{max-width:1420px;margin:10px auto 25px;padding:0 5.7%;display:grid;grid-template-columns:.94fr 1fr;gap:7%;align-items:center;min-height:640px}.intro{padding-bottom:38px;transition:opacity .6s,transform .8s}.eyebrow{color:#99aeb5;letter-spacing:.24em;font-size:9px;display:flex;align-items:center;gap:12px}.tiny-line{display:inline-block;height:1px;width:28px;background:#819da4}h1{font-family:"Noto Serif SC",serif;font-weight:400;font-size:clamp(40px,4.6vw,66px);line-height:1.6;letter-spacing:.045em;margin:30px 0 20px}h1 span{color:#bdd7d9}.intro-copy{color:#94a2a8;font-size:13px;line-height:2.25;letter-spacing:.08em}.primary-actions{display:flex;gap:12px;margin-top:39px;flex-wrap:wrap}.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:0 22px;font-size:12px;letter-spacing:.06em;border:1px solid #a5cad53a;border-radius:3px;transition:background .25s,border-color .25s,transform .25s}.button:hover:not(:disabled){transform:translateY(-2px);border-color:#bcd8dd}.button.primary{background:#bfd8d8;color:#132c35;border-color:#bfd8d8;box-shadow:0 4px 28px #78b1c210}.button.primary:hover:not(:disabled){background:#e0eeee}.button.secondary{background:#aacbd405;color:#b1c3c9}.play-icon{font-size:21px;line-height:1}.journey{display:flex;align-items:center;gap:12px;margin-top:53px}.journey-step{font-size:10px;letter-spacing:.04em;color:#63747e;white-space:nowrap;transition:color .4s}.journey-step b{font-weight:400;font-size:9px;color:#74878e;margin-right:7px}.journey-step.active{color:#c0dddd}.journey-step.active b{color:#b6e1e3}.journey i{width:20px;height:1px;background:#34454d}.sample-note{display:flex;align-items:center;gap:7px;color:#647780;font-size:9px;letter-spacing:.05em;line-height:1.8;margin-top:24px}.sample-note span{width:4px;height:4px;background:#a3b996;border-radius:50%;flex-shrink:0}.mirror-zone{min-width:0;position:relative;padding:0 0 12px}.mirror-caption{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:.2em;color:#77909c;margin-bottom:13px;padding:0 2px}.mirror-caption span:last-child{color:#b1bec1;font-size:9px;letter-spacing:.08em}.mirror-frame{width:100%;aspect-ratio:.91;max-height:660px;min-height:370px;border:1px solid #70838b62;border-radius:160px 160px 3px 3px;position:relative;isolation:isolate;box-shadow:0 0 0 7px #17303c12,0 40px 100px #0007,inset 0 0 70px #000a;background:#0c161e;transition:border-color 1.2s,box-shadow 1.2s}.mirror-frame:after{content:"";pointer-events:none;position:absolute;top:-9px;right:-9px;bottom:-9px;left:-9px;border:1px solid #48606c28;border-radius:168px 168px 5px 5px}.world-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background-size:100% 100%;opacity:0;transition:opacity .8s}#world-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:opacity .8s}.loaded #world-canvas,.loaded .world-backdrop{opacity:1}#app[data-state=draw] #world-canvas,#app[data-state=drawing] #world-canvas,#app[data-state=generating] #world-canvas,#app[data-state=draw] .world-backdrop,#app[data-state=drawing] .world-backdrop,#app[data-state=generating] .world-backdrop{opacity:0!important;visibility:hidden}.veil{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(0deg,#06101aec,#101b26a8 35%,#07111ad4);pointer-events:none;transition:opacity 1.6s}#drawing-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border-radius:inherit;touch-action:none;cursor:crosshair}.mirror-corners{position:absolute;pointer-events:none;top:14px;right:14px;bottom:14px;left:14px;border:1px solid #b3c2c016;border-radius:145px 145px 0 0}.mirror-instruction{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);text-align:center;color:#b5c9cd;font-size:11px;letter-spacing:.13em;pointer-events:none;width:90%;transition:opacity .5s}.star{display:block;font-size:31px;margin-bottom:17px;color:#cde6de}.mirror-bottom{position:absolute;bottom:23px;left:27px;right:27px;display:flex;justify-content:space-between;color:#718995;font-size:8px;letter-spacing:.16em;pointer-events:none;transition:opacity .5s}.canvas-tools{display:flex;align-items:center;gap:17px;padding:19px 2px 0;color:#92a4ac}.canvas-tools button{padding:4px 0;font-size:17px}.canvas-tools button span{font-size:10px;margin-left:5px}.canvas-tools button:hover:not(:disabled){color:#e0f1f1}.tool-spacer{flex:1}.stroke-count{font-size:9px;color:#6f8590}.footer{max-width:1520px;margin:0 auto;padding:18px 5.3% 28px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#5c737f;font-size:8px;letter-spacing:.18em;position:relative;z-index:5}#status{font-size:10px;letter-spacing:.04em;text-align:center}#motion{color:#81949d;font-size:10px;letter-spacing:.05em;padding:8px 0;white-space:nowrap}#motion span{color:#bed8d8;margin-left:9px}.loaded .veil{opacity:0}.mirror-instruction small{display:block;font-size:9px;color:#6e8997;letter-spacing:.09em;margin-top:12px}.generation-progress{position:absolute;bottom:48px;left:12%;width:76%;padding:16px;border:1px solid #9fd0db20;background:#0a1726ec;border-radius:6px;text-align:center;font-size:11px;color:#c3d7d9;pointer-events:none}.generation-progress progress{display:block;width:100%;height:3px;margin-top:13px;accent-color:#bfe6e5}.fracture .world-backdrop,.entering .world-backdrop{opacity:0}#app[data-renderer=fallback].fracture .world-backdrop{opacity:0;transition:opacity 2s}.world .mirror-instruction,.fracture .mirror-instruction,.entering .mirror-instruction,.drawing .mirror-instruction,.world .mirror-bottom,.fracture .mirror-bottom,.entering .mirror-bottom{opacity:0}.world .mirror-frame{box-shadow:0 0 80px #7bb6c719,0 40px 100px #0007;border-color:#97bbc77a}.fracture .intro,.entering .intro{opacity:.25;transform:translate(-12px)}.fracture #drawing-canvas,.entering #drawing-canvas{pointer-events:none}.entering .mirror-frame{box-shadow:0 0 120px #a1dae055}.transition-skip{position:fixed;right:5.3%;bottom:75px;z-index:30;color:#eff7f7}.flash{position:fixed;top:0;right:0;bottom:0;left:0;background:#cde5e8;pointer-events:none;z-index:25;opacity:0}.session-ended{position:fixed;top:0;right:0;bottom:0;left:0;z-index:26;display:grid;place-items:center;padding:30px 7%;background:#070d13e8}.session-card{max-width:520px}.session-card h2{font-family:"Noto Serif SC",serif;font-weight:300;font-size:clamp(30px,3.6vw,46px);line-height:1.55;letter-spacing:.05em;margin:20px 0 18px}.session-card p{color:#9db0b7;font-size:13px;line-height:2.05;letter-spacing:.04em}#session-note{margin-top:16px;font-size:10px;letter-spacing:.1em;color:#7e959c}#session-note:empty{display:none}.session-card .button{margin-top:28px}.space{min-height:calc(100svh - 180px);padding:52px 9vw 60px;position:relative}.space:before{content:"";position:absolute;top:-115px;right:-5vw;bottom:-80px;left:25%;background:linear-gradient(90deg,#080e14,#080e1455),var(--world-image) center / cover;opacity:.52;z-index:-1;-webkit-mask-image:linear-gradient(0deg,transparent,#000 25%,#000);mask-image:linear-gradient(0deg,transparent,#000 25%,#000)}.space-stage{position:absolute;top:-115px;right:-5vw;bottom:-80px;left:25%;z-index:-1;pointer-events:none}.space-stage #world-canvas{opacity:1;visibility:visible;border-radius:0}.space-content{max-width:740px;animation:arrive 1.2s both}.space h2{font-family:"Noto Serif SC",serif;font-weight:300;font-size:clamp(40px,5vw,72px);line-height:1.6;letter-spacing:.06em;margin:25px 0}.space h2 em{font-style:normal;color:#c5dddd}.space-description{font-size:12px;letter-spacing:.08em;color:#95a9b1;line-height:2}.space-links{margin:37px 0;max-width:520px}.space-links a{border-top:1px solid #9fbbbf25;display:flex;gap:23px;align-items:center;padding:20px 3px;font-family:Georgia,serif;font-size:27px;transition:padding .3s}.space-links a:last-child{border-bottom:1px solid #9fbbbf25}.space-links a:hover{padding-left:15px}.space-links span{font:9px DM Sans,sans-serif;color:#73909f}.space-links small{font:10px sans-serif;color:#8da2ab}.space-links i{font:22px sans-serif;color:#8ca9b3;margin-left:auto}.space-detail{max-width:650px;padding:30px 0 100px}.detail-copy{color:#a9bbc1;line-height:2.1;font-size:15px}.detail-copy p{margin:0 0 18px}.detail-copy h3{margin:26px 0 10px;font:600 11px DM Sans,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#d5e6ea}.detail-copy ul{margin:0 0 18px;padding-left:20px}.detail-copy li{margin-bottom:10px}.detail-copy b{color:#cfe0e5;font-weight:600}.detail-copy a{color:#8fd8e2;text-decoration:none;border-bottom:1px solid rgba(143,216,226,.35)}.detail-copy a:hover{color:#bce8ec;border-bottom-color:#bce8ec}.detail-copy .detail-links{display:flex;flex-wrap:wrap;gap:10px 26px;padding-left:0;list-style:none}.voice-panel{max-width:650px;padding:6px 0 40px}#spoken-text{color:#a9bbc1;line-height:2.1;font-size:14px;letter-spacing:.04em}#spoken-text:empty{display:none}.voice-controls{display:flex;gap:26px}.voice-controls .text-button{padding:10px 0}.voice-controls .text-button span{margin-left:8px;font-size:13px}.dialogue-panel{max-width:650px;padding:0 0 46px}.dialogue-transcript{display:flex;flex-direction:column;gap:14px;max-height:230px;overflow-y:auto;margin:18px 0 22px}.dialogue-transcript:empty{display:none}.dialogue-transcript p{font-size:13px;line-height:1.95;letter-spacing:.03em}.dialogue-transcript p:before{display:block;margin-bottom:5px;font:9px DM Sans,sans-serif;letter-spacing:.16em}.dialogue-transcript .visitor{color:#8fa6ad}.dialogue-transcript .visitor:before{content:"YOU";color:#63797f}.dialogue-transcript .reply{color:#c3d6d6}.dialogue-transcript .reply:before{content:"XINING";color:#86a7ae}.dialogue-controls{display:flex;align-items:center;gap:26px;flex-wrap:wrap}.dialogue-controls .text-button{padding:10px 0}.dialogue-controls .text-button span{margin-left:8px;font-size:13px}.dialogue-hint{margin-top:14px;font-size:10px;letter-spacing:.1em;color:#7e959c}.dialogue-hint:empty{display:none}#listen:disabled{opacity:.45}#app[data-dialogue=listening] #listen span{color:#bce8ec}#app[data-dialogue=hearing] #listen{color:#ffd9cf}#app[data-dialogue=hearing] #listen span{color:#ff9d85}@keyframes arrive{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}@media(min-width:1600px){#entrance{margin-top:38px}}@media(max-width:1000px){.header{height:92px}#entrance{gap:5%;padding:0 5%;min-height:570px}h1{font-size:43px}.button{padding:0 14px;gap:10px;font-size:11px}.journey{gap:7px}.journey i{width:12px}.mirror-frame{min-height:430px}}@media(max-width:720px){.header{height:85px;padding:0 7%}#entrance{display:flex;flex-direction:column;margin:15px auto 20px;gap:29px;padding:0 8%;max-width:550px}.intro{padding:0;width:100%;text-align:center}.eyebrow{justify-content:center;font-size:8px;letter-spacing:.17em}.tiny-line{display:none}h1{font-size:38px;line-height:1.55;margin:20px 0 12px}.intro-copy{font-size:11px;line-height:2;margin:0}.primary-actions{justify-content:center;margin-top:23px}.button{min-height:44px;padding:0 17px}.journey{justify-content:center;margin-top:24px;gap:10px}.sample-note{justify-content:center;margin-top:14px;font-size:8px}.mirror-zone{width:100%}.mirror-frame{aspect-ratio:.94;min-height:0;border-radius:120px 120px 3px 3px}.mirror-frame:after{border-radius:128px 128px 5px 5px}.mirror-corners{border-radius:106px 106px 0 0}.mirror-caption{font-size:7px}.canvas-tools{padding-top:16px}.footer{flex-wrap:wrap;padding:9px 8% 20px;gap:6px}.footer>span:first-child{display:none}#status{font-size:9px;text-align:left}#motion{font-size:9px}.space{padding:28px 8% 50px}.space .eyebrow{justify-content:flex-start}.space:before{left:0;opacity:.3}.space-stage{left:0}.space h2{font-size:43px}}@media(max-width:720px){.voice-panel{padding-bottom:26px}#spoken-text{font-size:11px;line-height:1.95}.voice-controls{gap:18px}.voice-controls .text-button{font-size:10px;padding:8px 0}}@media(max-width:720px){.dialogue-panel{padding-bottom:30px}.dialogue-transcript{gap:11px;max-height:168px;margin:14px 0 18px}.dialogue-transcript p{font-size:11px;line-height:1.85}.dialogue-controls{gap:14px}.dialogue-controls .text-button{display:inline-flex;align-items:center;min-height:44px;font-size:10px}.dialogue-hint{font-size:9px;margin-top:11px}}@media(max-width:720px){.session-ended{padding:26px 8%}.session-card h2{font-size:30px;margin:16px 0 14px}.session-card p{font-size:12px}.session-card .button{width:100%;margin-top:24px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}