:root{--deep:#173e43;--paper:#f3f5ef;--sage:#d9e3d8;--orange:#ec774f;--ink:#173b3f;--muted:#a6bbb8;--level:0;color-scheme:light;font-family:"Avenir Next","PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--deep);color:var(--paper)}button,a,[role=button]{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,[tabindex]:focus-visible,summary:focus-visible{outline:3px solid var(--orange);outline-offset:5px}button{color:inherit}a{color:inherit;text-decoration:none}.page{max-width:1600px;margin:auto;padding:24px 4.4vw 16px;min-height:100svh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:20px;padding-bottom:22px;border-bottom:1px solid #ffffff26}.wordmark{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600}.compass{font-size:29px;color:var(--orange);line-height:1}.topnote{margin-left:auto;font-size:12px;color:#c3d2cf;display:flex;align-items:center;gap:9px}.topnote i{width:6px;height:6px;border-radius:50%;background:#b7c8a8}.icon-button{width:34px;height:34px;display:grid;place-items:center;border:1px solid #ffffff40;background:none;border-radius:50%;flex:none}.icon-button svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.5;fill:none}main{display:grid;grid-template-columns:.88fr 1.35fr;gap:5.2%;padding:30px 0 24px;flex:1;align-items:center}.identity{position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center}.hello{font-size:19px;letter-spacing:2px;color:#cad8d1}.name-row{display:flex;align-items:center;gap:24px}h1{font-size:clamp(76px,8.1vw,124px);line-height:1.12;letter-spacing:-8px;margin:8px 0 20px;font-weight:800}h1>span{color:var(--orange);font-weight:500;letter-spacing:-20px}.name-en{font-weight:500;line-height:1.05;font-size:23px;color:var(--muted);border-left:1px solid #ffffff38;padding-left:17px;margin-top:15px}.manifesto{font-size:clamp(26px,2.5vw,40px);line-height:1.45;font-weight:600;letter-spacing:-1px;margin:0 0 15px}.intro{font-size:14px;line-height:1.9;color:#c1d0cb;margin:0}.portrait-scene{position:relative;max-width:380px;height:245px;margin-top:20px}.portrait{position:absolute;width:230px;height:230px;border-radius:50%;overflow:hidden;left:59px;top:0;background:white;transform:rotate(-6deg)}.portrait img{width:100%;height:100%;object-fit:cover}.orbit{position:absolute;width:320px;height:190px;border:1px solid #74908d;border-radius:50%;left:10px;top:20px;transform:rotate(-27deg)}.portrait-note{position:absolute;top:29px;left:0;writing-mode:vertical-rl;letter-spacing:3px;font-size:11px;color:var(--muted)}.portrait-badge{position:absolute;right:9px;top:145px;transform:rotate(-9deg);padding:9px 16px;border-radius:5px;background:var(--orange);color:var(--ink);font-size:14px;font-weight:700;box-shadow:0 4px 0 #0c292e}.portrait-badge span{margin-right:7px}.coordinate{position:absolute;bottom:-5px;left:80px;font-size:10px;letter-spacing:2px;color:var(--muted)}.chapters{display:flex;flex-direction:column;gap:12px}.chapter{position:relative;color:var(--ink);padding:19px 24px;border:2px solid transparent;cursor:pointer;transition:box-shadow .35s,border-color .35s,transform .35s,background .35s;isolation:isolate}.chapter:hover{border-color:#8baaa3}.chapter.active{border-color:var(--orange);box-shadow:0 0 0 4px #ec774f26;transform:translateX(-4px)}.chapter.active .section-tag:before{content:"";display:inline-block;width:6px;height:6px;background:#b24925;border-radius:50%;vertical-align:middle;margin-right:7px}.journey{background:var(--paper);border-radius:17px 17px 5px 5px}.building{background:var(--sage);border-radius:5px}.chapter-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.section-tag{font-size:11px;font-weight:600;letter-spacing:1.5px;color:#476361}.key-hint{font-size:10px;border:1px solid #173e4330;border-radius:4px;width:18px;height:18px;display:grid;place-items:center;color:#58726b}.chapter h2{font-size:24px;font-weight:650;line-height:1.4;letter-spacing:-.7px;margin:0 0 12px}.chapter p{font-size:13px;line-height:1.8;color:#49635e;margin:0}.journey-layout{display:grid;grid-template-columns:1fr 110px;gap:14px}.timeline{position:relative;display:grid;gap:9px;margin:3px 0 12px}.timeline:before{content:"";position:absolute;width:1px;height:calc(100% - 8px);left:4px;top:5px;background:#a3b4a7}.timeline>div{display:flex;align-items:center;gap:12px;position:relative;font-size:13px}.timeline strong{font-weight:500}.dot{display:block;width:9px;height:9px;border:1px solid #7b9386;background:var(--paper);border-radius:50%;flex:none}.now .dot{background:var(--orange);border-color:var(--orange)}.now strong{font-weight:650}.chapter p.small{font-size:11px;color:#6a7e74}.site-photo{width:110px;padding:5px 5px 7px;border:0;background:#fff;box-shadow:0 4px 10px #12363121;transform:rotate(7deg);align-self:center;transition:transform .35s}.site-photo img{display:block;width:100%;height:120px;object-fit:cover;object-position:center 40%}.site-photo span{font-size:10px;display:block;color:#59665c;margin-top:6px}.journey.active .site-photo,.site-photo:hover{transform:rotate(0deg) scale(1.04)}.build-layout{display:flex;align-items:center;justify-content:space-between;gap:12px}.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}.tags span{padding:4px 9px;font-size:10px;border:1px solid #8da596;border-radius:30px}.build-mark{display:flex;align-items:center;gap:3px;font-size:61px;line-height:1;color:#476a61;flex:none;letter-spacing:-5px}.build-mark .asterisk{font-size:44px;color:#9b4930;transition:transform .7s}.building.active .asterisk{transform:rotate(90deg)}.bottom-chapters{display:grid;grid-template-columns:1fr 1fr;gap:12px}.exploring{background:#c1d3d2;border-radius:5px 5px 5px 17px}.living{background:#e8e4d7;border-radius:5px 5px 17px 5px}.bottom-chapters h2{font-size:22px;margin-bottom:9px}.bottom-chapters p{font-size:12px}.film-strip{display:flex;align-items:center;gap:9px;margin-top:17px;font-size:10px;border-top:3px dotted #6d8d88;border-bottom:3px dotted #6d8d88;padding:8px 0;width:max-content;color:#3a625c}.film-strip i{width:11px;height:1px;background:#72908c}.life-art{display:flex;align-items:center;gap:15px;margin-top:12px;color:#6c7664;height:39px}.life-art svg{width:48px;height:35px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.life-art span{font-size:13px}footer{border-top:1px solid #ffffff26;padding-top:21px;display:flex;align-items:center;justify-content:space-between;gap:20px}.invitation{display:flex;gap:15px;align-items:center}.spark{color:var(--orange);font-size:40px;line-height:1}.invitation strong{font-size:20px;font-weight:600;display:block;margin-bottom:5px}.invitation div>span{font-size:11px;color:#b2c6bf}.controls{display:flex;gap:10px;align-items:center}#topic-status{font-size:11px;color:#bfd1c9;margin-right:4px;max-width:115px}.quiet-button{border:0;background:none;font-size:12px;color:#c0d0c9;padding:8px}.voice-button{border:1px solid #8caaa0;border-radius:40px;background:transparent;color:var(--paper);display:flex;align-items:center;gap:8px;font-size:12px;padding:11px 16px;min-width:122px;justify-content:center}.voice-button svg{width:15px;height:17px;stroke:currentColor;stroke-width:1.6;fill:none}.voice-button.listening{background:#e1e9db;color:var(--ink);border-color:#e1e9db}.meter{height:16px;gap:2px;align-items:center;display:none}.listening .meter{display:flex}.meter i{height:calc(3px + var(--level)*13px);width:2px;background:currentColor;transition:height .12s}.meter i:nth-child(2){height:calc(5px + var(--level)*9px)}.meter i:nth-child(3){height:calc(3px + var(--level)*10px)}.keyboard-tip{display:flex;justify-content:space-between;margin-top:15px;font-size:10px;letter-spacing:.3px;color:#91aaa2}dialog{border:0;border-radius:18px;padding:32px;max-width:540px;width:calc(100% - 36px);background:var(--paper);color:var(--ink);box-shadow:0 25px 90px #0005;max-height:90svh;overflow:auto}dialog::backdrop{background:#0b292cd9;backdrop-filter:blur(7px)}.dialog-close{position:absolute;right:16px;top:12px;border:0;background:transparent;font-size:28px;color:#54766a;padding:0 5px}.dialog-kicker{font-size:12px;color:#777}dialog h2{font-size:24px;line-height:1.4;margin:16px 0}dialog p{font-size:13px;line-height:1.8}dialog label{font-size:12px}.mode-options{display:grid;gap:12px;margin:23px 0}.mode-options label{display:flex;align-items:flex-start;gap:10px;background:#e4ebe0;padding:14px;border-radius:9px;cursor:pointer}.mode-options input{accent-color:#24534a;flex:none;margin-top:4px}.mode-options strong{display:block;font-size:14px;margin-bottom:6px}.mode-options small{display:block;line-height:1.7;color:#506658;font-size:11px}.support-note{color:#647663}.primary-button{background:var(--deep);border:0;border-radius:8px;color:white;padding:12px 20px;width:100%}details{border-top:1px solid #bcc9bc;margin-top:22px;padding-top:18px}summary{cursor:pointer;font-size:13px}#rehearsal{margin-top:10px;width:100%;padding:12px 10px;border:1px solid #93aa99;border-radius:6px;background:white;font-size:12px;color:var(--ink)}.sample-words{color:#6b7c70;font-size:10px}#photo-dialog{max-width:560px;padding:16px 16px 6px;background:#f3f5ef}#photo-dialog img{display:block;max-height:75svh;max-width:100%;margin:auto;border-radius:7px}#photo-dialog p{text-align:center;font-size:12px}#photo-dialog .dialog-close{background:var(--paper);width:32px;height:32px;border-radius:50%;line-height:28px}.toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,20px);max-width:calc(100% - 32px);padding:12px 20px;border-radius:9px;background:var(--paper);color:var(--ink);font-size:13px;box-shadow:0 5px 35px #0004;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:10}.toast.show{opacity:1;transform:translate(-50%,0)}.invitation.focused .spark{transform:rotate(45deg)}.invitation.focused strong{color:#ffb393}.spark{transition:transform .5s}.page{animation:arrive .8s ease both}@keyframes arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(min-width:1200px) and (min-height:1050px){main{padding-top:38px;padding-bottom:38px}.chapter{padding:23px 28px}.chapter h2{font-size:27px}.chapter p{font-size:14px}.timeline>div{font-size:14px}.portrait-scene{height:280px;margin-top:32px}.portrait{width:260px;height:260px}.portrait-badge{top:175px}.orbit{height:220px;width:350px}.bottom-chapters h2{font-size:25px}}
@media(min-width:901px) and (max-height:850px){.page{padding-top:15px}.topbar{padding-bottom:13px}main{padding:20px 0 18px;gap:4%}.chapter{padding:14px 21px}.chapter-heading{margin-bottom:7px}.chapter h2{font-size:21px;margin-bottom:9px}.bottom-chapters h2{font-size:20px}.portrait-scene{height:205px;margin-top:12px}.portrait{width:195px;height:195px;left:70px}.portrait-badge{top:130px;right:22px}.orbit{width:290px;height:160px;left:25px}.coordinate{bottom:0}.manifesto{font-size:30px}h1{font-size:94px;margin-bottom:12px}.film-strip{margin-top:11px}footer{padding-top:15px}.keyboard-tip{margin-top:12px}.site-photo img{height:108px}}
@media(max-width:1100px){.page{padding-left:4vw;padding-right:4vw}.chapter{padding-left:18px;padding-right:18px}.build-mark{font-size:45px}.build-mark .asterisk{font-size:32px}.name-en{font-size:18px}.name-row{gap:12px}.portrait-badge{right:0}.invitation strong{font-size:17px}.controls{gap:6px}#topic-status{display:none}.journey-layout{grid-template-columns:1fr 95px;gap:10px}.site-photo{width:95px}.site-photo img{height:110px}}
@media(max-width:900px){.page{padding:20px 6vw}.topnote{display:none}.topbar>.icon-button{margin-left:auto}main{grid-template-columns:1fr;gap:30px;padding-top:30px}.identity{min-height:340px;padding-right:40%;justify-content:center}.portrait-scene{position:absolute;right:-10px;top:45px;width:290px}.hello{font-size:16px}h1{font-size:88px}.manifesto{font-size:28px}.name-en{display:none}.intro{font-size:12px}.portrait{width:200px;height:200px;left:60px}.portrait-badge{top:150px}.portrait-note{display:none}.orbit{width:270px;height:160px}.coordinate{bottom:0;left:60px}.journey-layout{grid-template-columns:1fr 110px}.site-photo{width:110px}.site-photo img{height:120px}.chapter{padding:20px 24px}.chapter h2{font-size:25px}footer{align-items:flex-start;flex-direction:column;gap:20px}.controls{align-self:flex-end}.keyboard-tip>span{display:none}.keyboard-tip{margin-top:12px}.invitation strong{font-size:20px}}
@media(max-width:540px){.page{padding:18px 20px}.wordmark{font-size:13px}.identity{min-height:425px;padding:0;justify-content:flex-start}.hello{font-size:15px}.name-row{position:relative;z-index:1}h1{font-size:92px;margin:10px 0 20px}.manifesto{font-size:29px;position:relative;z-index:1;max-width:55%}.intro{font-size:12px;position:absolute;bottom:0}.portrait-scene{width:205px;right:-8px;top:156px;height:202px;margin:0}.portrait{width:174px;height:174px;left:23px}.orbit{width:205px;height:130px;left:0;top:23px}.portrait-badge{font-size:11px;padding:7px 12px;top:135px;right:0}.coordinate{display:none}main{gap:26px;padding-top:24px}.chapter{padding:18px}.journey-layout{grid-template-columns:1fr 85px;gap:6px}.chapter h2{font-size:20px}.timeline>div{font-size:11px;gap:8px}.site-photo{width:85px}.site-photo img{height:107px}.site-photo span{font-size:8px}.chapter p.small{font-size:9px}.chapter p{font-size:12px}.build-mark{display:none}.bottom-chapters{gap:10px}.bottom-chapters .chapter{padding:16px 12px}.bottom-chapters h2{font-size:18px}.bottom-chapters p{font-size:10px}.section-tag{font-size:10px;letter-spacing:1px}.film-strip{gap:5px;font-size:8px}.film-strip i{width:7px}.life-art{gap:10px}.life-art svg{width:40px}.tags{gap:5px}.tags span{font-size:9px;padding:4px 7px}.invitation strong{font-size:18px}.invitation div>span{font-size:10px}.spark{font-size:32px}.controls{align-self:stretch;justify-content:flex-end}.keyboard-tip{font-size:9px}.chapter.active{transform:translateX(-2px)}dialog{padding:25px}dialog h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.chapter.active{transform:none}.building.active .asterisk,.invitation.focused .spark{transform:none}}
@media(max-width:540px){.orbit{width:175px;height:120px;left:15px;top:27px}}
@media(min-width:901px) and (max-height:850px){
 main{padding:12px 0}.chapter{padding-top:10px;padding-bottom:10px}.chapter-heading{margin-bottom:5px}.timeline{gap:6px;margin-bottom:8px}.tags{margin-top:10px}.film-strip{padding:5px 0;margin-top:8px}.life-art{margin-top:8px}.invitation strong{font-size:18px;margin-bottom:3px}.invitation div>span{font-size:10px}footer{padding-top:11px}.keyboard-tip{margin-top:8px}.site-photo img{height:100px}.site-photo{width:100px}.chapters,.bottom-chapters{gap:10px}.portrait-scene{height:200px}
}