:root{--paper:#fff8f0;--surface:#fffefa;--ink:#292821;--muted:#6e6b62;--line:#e8e0d4;--coral:#f46643;--coral-deep:#ad391e;--soft:#f8e7da;--radius:14px;--font:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--coral-deep);outline-offset:5px}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{font-weight:600}button{color:var(--ink)}[hidden]{display:none!important}.page-width{width:calc(100% - 112px);max-width:1280px;margin-inline:auto}.icon{width:20px;height:20px;flex:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:16px;top:-70px;padding:10px 18px;background:var(--ink);color:var(--paper);z-index:40}.skip-link:focus{top:12px}
.site-header{border-bottom:1px solid var(--line)}.nav-wrap{width:calc(100% - 112px);max-width:1280px;margin:auto;height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;gap:10px;flex:none}.brand>img{border-radius:8px}.brand>span{display:flex;align-items:baseline;gap:9px;font-size:23px;font-weight:600;letter-spacing:-.8px}.brand-en{font-size:16px;font-weight:500;letter-spacing:-.4px}.nav-wrap nav{display:flex;gap:36px;margin-left:auto;margin-right:42px}.nav-wrap nav a{display:flex;align-items:center;min-height:44px;font-size:14px;color:#535148}.nav-wrap nav a:hover{color:var(--coral-deep)}.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:48px;padding:0 22px;border:1px solid var(--line);border-radius:10px;background:transparent;font-size:14px;font-weight:500;white-space:nowrap;transition:background .18s,transform .18s,box-shadow .18s}.button:hover{background:#f3eade}.button:active{transform:translateY(1px)}.primary{background:var(--coral);border-color:var(--coral);color:#2c2018}.primary:hover{background:#ef795a;border-color:#ef795a;box-shadow:0 5px 15px #c7582820}.secondary{background:var(--surface)}.compact{min-height:40px;padding:0 17px;font-size:13px;gap:9px}.nav-action{min-height:42px;border-color:#d7cbbd;padding:0 16px;font-size:13px}
.hero{display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:24px;padding-top:48px;padding-bottom:76px;min-height:700px}.hero-copy{padding-bottom:20px;position:relative;z-index:2}.category{font-size:14px;letter-spacing:1px;color:var(--muted);margin-bottom:24px}.hero h1{font-size:clamp(42px,4.35vw,64px);line-height:1.32;letter-spacing:-2.2px;white-space:nowrap;font-weight:600}.hero-description{font-size:16px;color:var(--muted);line-height:1.95;margin-top:26px;max-width:460px;text-wrap:pretty}.hero-actions{display:flex;align-items:center;gap:26px;margin-top:34px}.hero-actions .primary{min-height:54px;padding:0 23px;font-size:15px}.text-action{display:inline-flex;align-items:center;gap:10px;min-height:48px;font-size:14px;white-space:nowrap}.play-outline{width:27px;height:27px;border:1px solid #bcb5a8;border-radius:50%;display:flex;align-items:center;justify-content:center}.play-outline img{width:13px;height:13px;margin-left:2px}.text-action:hover{color:var(--coral-deep)}
.hero-art{height:550px;position:relative;isolation:isolate;min-width:0}.art-orbit{position:absolute;left:1%;top:5%;width:96%;aspect-ratio:1;border:1px solid #e9d9c7;border-radius:50%;background:radial-gradient(circle at 46% 52%,#f3d4bd73,transparent 68%);z-index:-1}.art-orbit:after{content:"";position:absolute;inset:24px;border:1px solid #ebdece;border-radius:50%}.source-sheet{position:absolute;top:23px;left:4%;width:78%;padding:22px 24px 42px;background:#f3ece0;border:1px solid #e5d8c6;border-radius:var(--radius);transform:rotate(-5deg);box-shadow:0 10px 28px #7b56300b;min-height:270px}.source-sheet-top{display:flex;gap:14px;align-items:center}.cover-mark{display:grid;place-items:center;width:64px;height:70px;background:#efc7aa;border-radius:7px;color:#643e2b;font-size:34px;font-weight:500;flex:none}.source-sheet-top>div{display:grid;gap:3px}.small-label{font-size:12px;color:var(--muted)}.source-sheet-top strong{font-size:17px;font-weight:600}.source-sheet-top>div>span:last-child{font-size:11px;color:var(--muted)}.waveform{height:38px;display:flex;align-items:center;gap:5px;margin:18px 0}.waveform i{width:3px;height:14px;border-radius:2px;background:#c9bca8;flex:1}.waveform i:nth-child(3n){height:25px}.waveform i:nth-child(4n){height:32px}.waveform i:nth-child(5n){height:8px}.waveform i:nth-child(-n+12){background:#ba7450}.sheet-quote{font-size:16px;color:#6a5b4b;line-height:1.8}.insight-sheet{position:absolute;top:158px;right:0;width:77%;padding:25px 28px 20px;background:var(--surface);border:1px solid #e8ddce;border-radius:var(--radius);box-shadow:0 20px 45px #64472d12;min-height:273px;z-index:2}.sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.sheet-kind{font-size:12px;color:var(--coral-deep);font-weight:500}.sample-label{font-size:11px;color:var(--muted)}.insight-sheet h2{font-size:29px;line-height:1.45;margin:16px 0 12px;letter-spacing:-.7px}.insight-sheet>p{font-size:13px;line-height:1.8;max-width:330px;color:var(--muted);min-height:47px}.insight-bottom{display:flex;justify-content:space-between;gap:8px;align-items:center;padding-top:14px;margin-top:20px;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}.thought-sheet{position:absolute;left:0;top:354px;padding:18px 22px 14px;background:#f9d3bc;transform:rotate(-4deg);border:1px solid #edc3a8;z-index:3;width:265px;border-radius:12px;box-shadow:0 12px 26px #734b3110}.thought-label{display:flex;align-items:center;gap:7px;font-size:11px;color:#6a4734}.thought-sheet p{font-size:17px;line-height:1.9;margin:7px 0 5px;letter-spacing:.1px}.thought-sheet mark{color:inherit;background:none;box-shadow:inset 0 -6px #efa88280}.thought-source{font-size:10px;color:#78523b}.hero-stage-switch{position:absolute;right:0;bottom:3px;display:flex;gap:0;background:#f5eee4;border-radius:10px;padding:4px}.hero-stage-switch button{position:relative;background:transparent;border:0;min-width:62px;min-height:44px;padding:0 10px;font-size:12px;isolation:isolate}.hero-stage-switch button:before{content:"";position:absolute;inset:4px 2px;border-radius:7px;z-index:-1}.hero-stage-switch button[aria-pressed=true]:before{background:var(--surface);box-shadow:0 2px 5px #735a3710}.hero-stage-switch button[aria-pressed=true]{color:var(--coral-deep);font-weight:500}
.content-types{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px 0 29px;border-block:1px solid var(--line);font-size:13px;color:var(--muted)}.content-types ul{display:flex;gap:44px;list-style:none;padding:0;margin:0;font-size:14px;color:#555146}.content-types li+li{position:relative}.content-types li+li:before{content:"/";position:absolute;left:-25px;color:#c6bba9}.mobile-break{display:none}
.experience{padding-top:104px;padding-bottom:70px}.experience-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:36px}.section-intro{font-size:13px;color:var(--coral-deep);margin-bottom:12px}.experience h2,.why h2{font-size:38px;line-height:1.45;letter-spacing:-1.3px}.experience-heading p:last-child{font-size:15px;color:var(--muted);margin-top:13px}.play-demo{min-height:44px;font-size:13px;gap:10px;background:var(--surface);border-color:#ddd0bf}.play-demo .icon{width:17px;height:17px}.story-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:18px}.story-tabs button{display:flex;position:relative;align-items:center;gap:12px;padding:16px 18px;border:1px solid transparent;border-radius:11px;background:transparent;text-align:left;min-height:78px}.story-tabs button[aria-selected=true]{background:#f4e7d8;border-color:#ead8c1}.story-tabs button[aria-selected=true]:after{content:"";position:absolute;height:2px;left:18px;right:18px;bottom:0;background:var(--coral);transform-origin:left}.story-tabs button[data-playing=true]:after{animation:step-progress 5s linear both}.story-tabs button:hover{background:#f4eade}.step-number{display:grid;place-items:center;border:1px solid #d9ccba;border-radius:50%;width:28px;height:28px;font-size:12px;color:#7a6b57;flex:none}.story-tabs button[aria-selected=true] .step-number{border-color:#ddad8b;color:#8b4829}.story-tabs button>span:last-child{font-size:14px;font-weight:500;line-height:1.6}.story-tabs small{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:3px}.demo-workspace{display:grid;grid-template-columns:290px minmax(0,1fr);border:1px solid #e2d6c7;border-radius:17px;overflow:hidden;background:var(--surface);box-shadow:0 13px 38px #745b3c07}.demo-source{padding:24px;background:#f6efe4;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:stretch}.source-poster{position:relative;border-radius:8px;aspect-ratio:1.2;background:#eec6a9;padding:18px 20px;color:#633e2a;overflow:hidden}.source-poster:after{content:"";position:absolute;width:150px;height:150px;border:1px solid #d6a37f;border-radius:50%;right:-43px;bottom:-74px}.source-poster>span{font-size:10px}.poster-title{font-size:29px;line-height:1.4;letter-spacing:-1px;margin:13px 0 16px;font-weight:500}.poster-bottom{display:flex;justify-content:space-between;align-items:center;font-size:10px}.poster-bottom>span:last-child{font-size:24px;line-height:1}.source-info{margin-top:21px}.source-info h3{font-size:16px;margin-top:4px}.source-info p{font-size:12px;line-height:1.8;color:var(--muted);margin-top:9px}.source-reference{display:flex;align-items:center;gap:8px;border:0;border-bottom:1px solid #d8cbb9;padding:15px 0 12px;background:transparent;font-size:12px;min-height:44px;text-align:left;margin-top:auto}.source-reference>img:last-child{margin-left:auto}.source-reference:hover{color:var(--coral-deep)}.demo-notice{font-size:10px;color:var(--muted);margin-top:14px}.demo-content{min-width:0}.demo-panel{padding:32px 40px 20px;min-height:550px;display:flex;flex-direction:column}.panel-meta{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:var(--coral-deep);margin-bottom:24px}.nature-label{color:var(--muted);font-size:11px}.personal-label{color:#7c5939}.demo-panel h3{font-size:27px;line-height:1.6;letter-spacing:-.6px}.panel-lead{font-size:14px;color:var(--muted);margin-top:10px;line-height:1.9;max-width:590px}.takeaways{list-style:none;margin:24px 0 22px;padding:0;display:grid;gap:19px}.takeaways li{display:flex;gap:18px}.takeaways li>span{font-size:11px;color:#96826c;padding-top:4px}.takeaways h4{font-size:15px;font-weight:500}.takeaways p{font-size:13px;color:var(--muted);margin-top:3px}.panel-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:auto;padding-top:14px;font-size:11px;color:var(--muted)}.inline-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;font-size:12px;padding:0 0 0 8px;border:0;background:none;color:var(--coral-deep);white-space:nowrap}.inline-button:hover{text-decoration:underline}.question-options{display:flex;gap:8px;flex-wrap:wrap;margin:23px 0 20px}.question-options button{min-height:44px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-size:12px;padding:8px 13px;position:relative}.question-options button[aria-pressed=true]{background:#faeee3;border-color:#e8c9ae;color:#87411f}.answer{padding:19px 22px;background:#f9f6ef;border-radius:10px;margin-bottom:24px}.answer-label{display:flex;align-items:center;gap:8px;font-size:12px}.answer-label img{border-radius:5px}.answer>p{font-size:14px;line-height:2;margin:13px 0}.citation{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;border:0;background:transparent;color:var(--coral-deep);font-size:11px}.note-reference{margin:20px 0;padding:15px 18px;background:#f9f4eb;border-radius:8px;font-size:14px;line-height:1.8}.note-reference span{display:block;font-size:10px;color:var(--muted);margin-top:5px}.note-label{font-size:12px;margin-bottom:9px}.demo-panel textarea{width:100%;resize:vertical;min-height:108px;max-height:200px;padding:13px 16px;border:1px solid #d9cbb8;border-radius:8px;background:#fffdf8;color:var(--ink);font-size:14px;line-height:1.9}.note-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 20px;font-size:11px;color:var(--muted)}.export-options{display:flex;gap:20px;flex-wrap:wrap;border:0;padding:0;margin:21px 0 18px}.export-options label{display:flex;align-items:center;gap:7px;min-height:44px;font-size:12px;cursor:pointer}.export-options input{width:17px;height:17px;accent-color:var(--coral-deep);margin:0}.export-preview{padding:15px 18px;border:1px solid var(--line);border-radius:9px;background:#fbf8f1;margin-bottom:16px;flex:1}.export-preview>div{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--muted);padding-bottom:10px;border-bottom:1px solid var(--line)}.export-preview pre{font-family:var(--font);font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8;color:#56534b;margin:12px 0 0;max-height:180px;overflow:auto}.export-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}.export-actions>div{display:flex;gap:8px}.export-actions>span{font-size:10px;color:var(--muted)}.demo-footnote{font-size:11px;line-height:1.8;color:var(--muted);margin-top:17px;text-align:center}
.why{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding:62px 0 92px;border-top:1px solid var(--line)}.why-heading p{font-size:15px;line-height:1.9;color:var(--muted);margin-top:19px}.why-points{display:grid;gap:25px}.why-points article+article{border-top:1px solid var(--line);padding-top:22px}.why-points h3{font-size:16px;font-weight:500}.why-points p{font-size:13px;color:var(--muted);line-height:1.9;margin-top:5px}footer{display:flex;align-items:center;gap:26px;border-top:1px solid var(--line);padding-block:27px}footer .brand>span{font-size:18px}footer .brand-en{font-size:13px}footer p{font-size:12px;color:var(--muted)}footer>span{margin-left:auto;color:var(--muted);font-size:10px}
dialog{width:min(580px,calc(100% - 32px));max-height:calc(100dvh - 48px);border:1px solid #e2d4c2;border-radius:18px;padding:30px;background:var(--paper);color:var(--ink);box-shadow:0 25px 80px #33271830;overscroll-behavior:contain}dialog::backdrop{background:#302a2447;backdrop-filter:blur(5px)}.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px}.dialog-heading>img{border-radius:10px}.dialog-heading h2{font-size:23px;margin-top:8px}.icon-button{display:grid;place-items:center;border:0;background:transparent;width:44px;height:44px;margin:-8px -8px 0 0;border-radius:8px;flex:none}.icon-button:hover{background:#f1e5d7}.icon-button img{width:22px;height:22px}.source-document p{font-size:14px;line-height:2.1;margin-bottom:16px}.source-document mark{background:#f9d3bc;color:var(--ink);padding:2px 0}.dialog-note{font-size:11px!important;line-height:1.8;color:var(--muted);margin:20px 0!important}#experience-dialog h2{font-size:29px;line-height:1.6;letter-spacing:-.7px}#experience-dialog>p{font-size:14px;line-height:1.9;color:var(--muted);margin:16px 0 24px}#experience-dialog .primary{width:100%}body.dialog-open{overflow:hidden}
@keyframes step-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(min-width:1500px){.hero{gap:60px;min-height:750px}.hero-art{height:570px}.insight-sheet{top:165px}.thought-sheet{top:370px}}
@media(max-width:1150px){.page-width,.nav-wrap{width:calc(100% - 64px)}.hero{gap:12px;min-height:650px}.hero h1{font-size:46px}.hero-description{font-size:14px}.hero-actions{gap:18px}.hero-actions .primary{font-size:13px;padding:0 18px}.text-action{font-size:12px;gap:7px}.hero-art{height:510px}.source-sheet{left:3%;padding:20px 18px;min-height:245px}.source-sheet-top strong{font-size:14px}.source-sheet-top>div>span:last-child{display:none}.cover-mark{width:54px;height:58px}.insight-sheet{padding:22px;top:145px;width:80%}.insight-sheet h2{font-size:25px}.thought-sheet{top:330px;width:225px;padding:16px 18px}.thought-sheet p{font-size:15px}.demo-workspace{grid-template-columns:250px minmax(0,1fr)}.demo-source{padding:20px}.demo-panel{padding:28px 28px 20px}.demo-panel h3{font-size:24px}.story-tabs button{padding:14px 12px;gap:8px}.story-tabs button>span:last-child{font-size:13px}.story-tabs small{font-size:10px}.export-actions{flex-wrap:wrap}.nav-wrap nav{margin-right:18px;gap:26px}}
@media(max-width:900px){.hero{grid-template-columns:1fr;gap:18px;padding-top:56px;padding-bottom:38px;min-height:0}.hero-copy{padding-bottom:0;max-width:660px}.hero h1{font-size:56px}.hero-description{font-size:16px}.hero-art{width:580px;max-width:100%;height:545px;justify-self:center}.hero-actions{gap:28px}.hero-actions .primary{font-size:15px}.text-action{font-size:14px}.source-sheet-top strong{font-size:17px}.source-sheet-top>div>span:last-child{display:block}.insight-sheet h2{font-size:29px}.insight-sheet{top:155px;min-height:275px}.thought-sheet{top:350px;width:260px}.thought-sheet p{font-size:17px}.hero-stage-switch{right:5%}.experience{padding-top:76px}.experience h2,.why h2{font-size:33px}.demo-workspace{grid-template-columns:220px minmax(0,1fr)}.demo-source{padding:18px}.poster-title{font-size:24px}.source-poster{padding:15px;aspect-ratio:1}.demo-panel{min-height:575px;padding:26px 23px 20px}.panel-bottom{align-items:flex-start;gap:10px}.panel-bottom>span{max-width:150px}.demo-panel h3{font-size:22px}.takeaways{gap:20px}.story-tabs button{gap:7px;padding:12px 8px}.story-tabs small{display:none}.step-number{width:25px;height:25px}.question-options{gap:6px}.question-options button{font-size:11px;padding:7px 9px}.why{gap:40px}.note-actions{align-items:flex-start;flex-wrap:wrap}.export-options{gap:8px 14px}footer{gap:18px}footer p{font-size:11px}}
@media(max-width:600px){html{scroll-padding-top:24px}.page-width,.nav-wrap{width:calc(100% - 40px)}.site-header{border-bottom:0}.nav-wrap{height:76px;gap:12px}.brand{gap:8px}.brand>img{width:30px;height:30px;border-radius:7px}.brand>span{font-size:21px;gap:7px}.brand-en{font-size:13px}.nav-wrap nav{display:none}.nav-action{position:relative;min-height:44px;padding:0 12px;border:0;border-radius:0;font-size:12px;gap:6px;isolation:isolate}.nav-action:before{content:"";position:absolute;inset:4px 0;border:1px solid #d7cbbd;border-radius:8px;z-index:-1}.nav-action .icon{width:16px;height:16px}.hero{padding-top:28px;padding-bottom:28px;gap:22px}.category{font-size:12px;letter-spacing:.7px;margin-bottom:16px}.hero h1{font-size:clamp(31px,9.4vw,45px);letter-spacing:-1.8px;line-height:1.4}.hero-description{font-size:13px;line-height:1.9;margin-top:18px;max-width:340px}.desktop-break{display:none}.hero-actions{gap:19px;margin-top:23px;flex-wrap:wrap}.hero-actions .primary{font-size:13px;padding:0 16px;min-height:48px;gap:10px}.hero-actions .primary .icon{width:17px;height:17px}.text-action{font-size:12px;gap:7px;min-height:48px}.play-outline{width:22px;height:22px}.play-outline img{width:11px;height:11px}.hero-art{height:413px;width:100%;margin-top:6px}.art-orbit{left:0;top:3%;width:100%}.art-orbit:after{inset:16px}.source-sheet{top:14px;left:4%;width:86%;padding:17px 17px 26px;min-height:205px;border-radius:12px}.source-sheet-top{gap:10px}.cover-mark{width:45px;height:50px;font-size:27px}.source-sheet-top strong{font-size:13px}.small-label{font-size:10px}.source-sheet-top>div>span:last-child{font-size:9px}.waveform{height:26px;margin:13px 0;gap:3px}.waveform i{width:2px;height:8px}.waveform i:nth-child(3n){height:17px}.waveform i:nth-child(4n){height:22px}.sheet-quote{font-size:12px}.insight-sheet{top:118px;width:80%;padding:18px 18px 14px;min-height:224px;border-radius:12px;right:0}.sheet-kind{font-size:10px}.sample-label{font-size:9px}.insight-sheet h2{font-size:23px;line-height:1.5;margin:11px 0 9px}.insight-sheet>p{font-size:11px;line-height:1.85;min-height:40px}.insight-bottom{font-size:9px;margin-top:12px;padding-top:10px}.insight-bottom img{width:16px;height:16px}.thought-sheet{left:0;top:267px;padding:13px 16px 11px;width:210px;border-radius:10px}.thought-label{font-size:9px;gap:5px}.thought-label img{width:14px;height:14px}.thought-sheet p{font-size:14px;line-height:1.8;margin:6px 0}.thought-source{font-size:9px}.hero-stage-switch{right:0;bottom:0;padding:2px;background:#f3eadd}.hero-stage-switch button{min-width:42px;min-height:44px;font-size:10px;padding:0 6px}.content-types{padding:21px 0;display:block}.content-types p{font-size:12px;line-height:1.8}.content-types ul{gap:34px;font-size:12px;margin-top:13px}.content-types li+li:before{left:-19px}.experience{padding-top:58px;padding-bottom:42px}.experience-heading{margin-bottom:24px;gap:18px;align-items:flex-start}.section-intro{font-size:11px;margin-bottom:9px}.experience h2,.why h2{font-size:27px;letter-spacing:-1px}.experience-heading p:last-child{font-size:12px;line-height:1.9;margin-top:11px}.play-demo{min-height:44px;font-size:10px;padding:0 8px;gap:5px;position:relative;border:0;isolation:isolate;margin-top:32px;flex:none;background:none}.play-demo:before{content:"";position:absolute;inset:4px 0;border:1px solid #ddd0bf;border-radius:7px;z-index:-1;background:var(--surface)}.play-demo .icon{width:13px;height:13px}.story-tabs{gap:2px;margin-bottom:12px}.story-tabs button{padding:9px 0;min-height:62px;display:grid;justify-items:center;gap:6px;text-align:center;border-radius:8px}.step-number{width:22px;height:22px;font-size:10px}.story-tabs button>span:last-child{font-size:11px}.story-tabs button[aria-selected=true]:after{left:12px;right:12px}.demo-workspace{display:flex;flex-direction:column;border-radius:13px}.demo-source{padding:16px 17px;display:grid;grid-template-columns:54px 1fr auto;gap:0 12px;align-items:center;border-right:0;border-bottom:1px solid var(--line)}.source-poster{width:54px;height:63px;aspect-ratio:auto;padding:6px;border-radius:5px}.source-poster>span,.poster-bottom{display:none}.poster-title{font-size:12px;line-height:1.45;margin:0;letter-spacing:-.4px}.source-poster:after{width:50px;height:50px;bottom:-35px;right:-20px}.source-info{margin:0}.source-info .small-label{font-size:9px}.source-info h3{font-size:12px;line-height:1.5;margin:3px 0 0}.source-info p{display:none}.source-reference{font-size:10px;margin:0;padding:0;border:0;min-height:44px;gap:4px}.source-reference>img:first-child{display:none}.source-reference>img:last-child{width:14px;height:14px}.demo-notice{grid-column:2/-1;font-size:9px;margin-top:7px}.demo-panel{padding:23px 18px 15px;min-height:506px}.panel-meta{font-size:10px;margin-bottom:19px;gap:10px}.nature-label{font-size:9px}.demo-panel h3{font-size:21px;line-height:1.55;letter-spacing:-.5px}.panel-lead{font-size:12px;margin-top:10px;line-height:1.9}.takeaways{margin:24px 0 22px;gap:20px}.takeaways li{gap:13px}.takeaways li>span{font-size:10px}.takeaways h4{font-size:13px}.takeaways p{font-size:11px;line-height:1.9;margin-top:5px}.panel-bottom{font-size:9px;padding-top:12px;align-items:center}.panel-bottom>span{max-width:150px}.inline-button{font-size:11px;gap:5px;min-height:44px;padding:0}.inline-button img{width:16px;height:16px}.question-options{margin:19px 0 18px;display:grid;gap:7px}.question-options button{font-size:11px;min-height:44px;text-align:left}.answer{padding:15px 16px;margin-bottom:22px}.answer>p{font-size:12px;line-height:2}.citation{font-size:10px}.note-reference{font-size:12px;margin:19px 0 17px;padding:12px 14px}.note-reference span{font-size:9px}.note-label{font-size:11px}.demo-panel textarea{font-size:16px;line-height:1.8;min-height:133px;max-height:220px;padding:11px 13px}.note-actions{font-size:10px;gap:7px;margin:10px 0 20px;align-items:center}.compact{min-height:44px;font-size:11px;padding:0 12px;position:relative;border:0;border-radius:0;isolation:isolate;background:transparent}.compact:before{content:"";position:absolute;inset:4px 0;border-radius:7px;border:1px solid var(--line);z-index:-1;background:var(--surface)}.compact.primary{background:transparent;color:var(--ink)}.compact.primary:before{background:var(--coral);border-color:var(--coral)}.compact .icon{width:16px;height:16px}.compact:hover{background:transparent;box-shadow:none}.export-options{gap:5px 15px;margin:15px 0 14px}.export-options label{font-size:11px;min-height:44px;gap:6px}.export-options input{width:16px;height:16px}.export-preview{padding:12px 13px;margin-bottom:12px}.export-preview pre{font-size:11px;max-height:190px;line-height:1.8}.export-actions{gap:8px}.export-actions>span{font-size:9px}.export-actions>div{gap:6px;margin-left:auto}.demo-footnote{font-size:10px;line-height:1.9;margin-top:14px;text-align:left}.why{grid-template-columns:1fr;padding:42px 0 48px;gap:30px}.why-heading p{font-size:12px;margin-top:14px}.why-points{gap:20px}.why-points h3{font-size:14px}.why-points p{font-size:12px}.why-points article+article{padding-top:18px}footer{padding-block:22px;flex-wrap:wrap;gap:9px 20px}footer .brand>img{width:25px;height:25px}footer .brand>span{font-size:17px}footer .brand-en{font-size:12px}footer p{width:100%;font-size:11px;order:2}footer>span{font-size:9px}dialog{padding:23px;max-height:calc(100dvh - 32px);padding-bottom:max(23px,env(safe-area-inset-bottom))}.dialog-heading h2{font-size:20px}.source-document p{font-size:13px}.dialog-note{font-size:11px!important}#experience-dialog h2{font-size:26px}#experience-dialog>p{font-size:13px}.button.primary:not(.compact){color:#2c2018}}
@media(max-width:355px){.page-width,.nav-wrap{width:calc(100% - 32px)}.hero-actions{gap:10px}.hero-actions .primary{font-size:12px;padding:0 12px;gap:7px}.text-action{font-size:11px;gap:5px}.hero-art{height:385px}.insight-sheet{width:82%;padding:16px;top:110px}.insight-sheet h2{font-size:21px}.thought-sheet{width:189px;top:250px}.thought-sheet p{font-size:12px}.hero-stage-switch button{min-width:40px}.hero-stage-switch{bottom:-3px}.experience-heading{display:block}.play-demo{margin-top:15px;padding:0 10px;font-size:11px}.demo-source{grid-template-columns:46px 1fr;gap:0 10px}.source-poster{width:46px;height:59px}.source-reference{grid-column:2;justify-self:start;margin-top:1px;min-height:44px}.demo-notice{grid-column:1/-1}.source-info h3{font-size:13px}.demo-panel{padding:21px 15px 15px}.demo-panel h3{font-size:19px}.export-options{gap:5px 12px}.panel-bottom>span{max-width:130px}.export-actions>div{width:100%;justify-content:flex-end}}
/* Readable paper layers: the personal note never covers the main explanation. */
.hero-art{height:590px}
.art-orbit{left:3%;top:2%;width:94%;height:94%;aspect-ratio:auto}
.thought-sheet{top:410px}
.insight-sheet>p{font-size:14px}
.insight-bottom,.thought-label,.thought-source,.sample-label{font-size:12px}
.thought-sheet p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.hero-stage-switch button{font-size:13px;min-width:64px}
.source-sheet-top>div>span:last-child{font-size:12px}
.story-tabs small,.step-number,.nature-label,.panel-meta,.panel-bottom,.note-label,.note-actions,.export-options label,.export-actions>span,.export-preview>div,.demo-footnote,.demo-notice,.source-poster>span,.poster-bottom{font-size:12px}
.takeaways p,.panel-lead,.source-info p,.why-points p{font-size:14px}
.takeaways h4{font-size:16px}
.source-info h3{font-size:17px}
.poster-bottom img{width:23px;height:23px}
.source-poster{aspect-ratio:auto;min-height:230px}
.note-reference span,.citation,.export-preview pre{font-size:12px}
.demo-panel{min-height:575px}
footer>span{font-size:12px}
@media(min-width:901px) and (max-width:1150px){
  .hero-art{height:550px}
  .thought-sheet{top:385px}
  .insight-sheet{min-height:290px;top:130px}
  .insight-sheet>p{font-size:13px}
  .insight-bottom{font-size:11px}
  .thought-sheet{width:230px}
  .hero-stage-switch button{min-width:48px;font-size:12px}
}
@media(min-width:601px) and (max-width:900px){
  .hero-art{height:590px}
  .thought-sheet{top:410px}
  .demo-source{padding:16px}
  .poster-title{font-size:24px}
  .source-poster{min-height:220px}
  .demo-panel{min-height:650px}
  .panel-bottom{flex-wrap:wrap;gap:4px}
  .panel-bottom>span{max-width:none}
}
@media(max-width:600px){
  .hero{gap:8px;padding-top:22px}
  .hero-art{height:506px;margin-top:0}
  .insight-sheet{top:126px;width:84%;padding:18px 19px;min-height:245px}
  .insight-sheet h2{font-size:23px;margin:12px 0 10px}
  .insight-sheet>p{font-size:12px;line-height:1.9}
  .insight-bottom{display:none}
  .thought-sheet{top:349px;left:1%;width:85%;padding:13px 18px 12px;transform:rotate(-2deg)}
  .thought-label,.thought-source,.sample-label,.sheet-kind{font-size:12px}
  .thought-sheet p{font-size:14px;margin:7px 0}
  .thought-source{display:none}
  .source-sheet-top .small-label{font-size:11px}
  .source-sheet-top>div>span:last-child{display:none}
  .hero-stage-switch{bottom:0;left:0;right:0;justify-content:center;background:transparent}
  .hero-stage-switch button{min-width:72px;font-size:12px}
  .hero-stage-switch button[aria-pressed=true]:before{background:#f2e4d4}
  .experience-heading{display:block}
  .experience h2{font-size:27px;white-space:nowrap}
  .play-demo{margin-top:14px;padding:0 12px;font-size:12px}
  .story-tabs button>span:last-child{font-size:12px}
  .step-number{font-size:11px}
  .source-poster{min-height:0;display:grid;place-items:center}
  .source-poster:after{display:none}
  .source-poster .poster-title{font-size:0;line-height:1}
  .source-poster .poster-title:before{content:"听";font-size:27px;font-weight:500}
  .source-info .small-label{font-size:11px}
  .source-info h3{font-size:14px}
  .source-reference{font-size:11px}
  .demo-notice{font-size:11px}
  .demo-panel{min-height:625px;padding:24px 19px 16px}
  .demo-panel h3{font-size:22px}
  .panel-meta,.nature-label,.panel-bottom,.note-label,.note-actions,.export-options label,.export-actions>span,.export-preview>div,.demo-footnote,.note-reference span,.citation{font-size:12px}
  .takeaways p,.panel-lead,.answer>p,.note-reference{font-size:14px}
  .takeaways h4{font-size:15px}
  .takeaways{gap:23px}
  .takeaways li>span{font-size:11px}
  .panel-bottom{flex-wrap:wrap;gap:2px}
  .panel-bottom>span{max-width:none}
  .inline-button{margin-left:auto;font-size:12px}
  .question-options button{font-size:13px}
  .note-actions{flex-wrap:wrap;gap:8px}
  .note-actions .button{margin-left:auto}
  .compact{font-size:12px}
  .export-options{gap:0 13px}
  .export-preview pre{font-size:12px}
  .export-actions{gap:8px}
  .export-actions>div{width:100%;justify-content:flex-end}
  .why-points h3{font-size:15px}
  .why-points p{font-size:14px}
  footer>span{font-size:11px}
}
@media(max-width:355px){
  .hero h1{font-size:31px;letter-spacing:-1.8px}
  .experience h2{font-size:24px}
  .hero-art{height:490px}
  .insight-sheet{width:88%;padding:17px;top:113px}
  .insight-sheet h2{font-size:21px}
  .thought-sheet{top:332px;width:94%}
  .hero-stage-switch button{min-width:66px}
  .demo-panel h3{font-size:20px}
  .export-options{column-gap:10px}
  .export-options label{font-size:11px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}