:root{color-scheme:light;--paper:#f6f7f3;--white:#fff;--ink:#283229;--muted:#60695f;--line:#cbd0c5;--accent:#dfe7b7;--layer:#e9eddf;--olive:#4a5a36;--amber:#715522;--serif:Georgia,'Noto Serif TC','Songti TC','PMingLiU',serif;--sans:Arial,'Noto Sans TC','PingFang TC','Microsoft JhengHei',sans-serif;--mono:'SFMono-Regular',Consolas,monospace}
*{box-sizing:border-box}
html{scroll-behavior:auto;scroll-padding-top:30px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;-webkit-font-smoothing:antialiased}
#hero-title,h2,h3,p,dl,dd{margin:0}
button,a,summary{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--olive);outline-offset:5px}
::selection{background:var(--accent)}
[hidden]{display:none!important}
.wrap{width:min(1120px,calc(100% - 96px));margin-inline:auto}
.header{display:flex;align-items:center;gap:45px;padding-top:30px;padding-bottom:30px;border-bottom:1px solid var(--line)}
.wordmark{display:flex;align-items:center;font-size:1.45rem;letter-spacing:-.055em;font-weight:600}
.wordmark svg{width:29px;height:29px;margin-right:10px}
.brand-period{color:var(--olive)}
.header nav{margin-left:auto;display:flex;gap:29px;font-size:.875rem}
.languages{display:flex;align-items:center;gap:10px;font-size:.8125rem;color:var(--muted)}
.languages button{padding:9px 2px;border:0;background:none;font-size:.875rem}
.languages button[aria-pressed=true]{color:var(--ink);text-decoration:underline;text-underline-offset:6px}
.hero{padding-top:80px;padding-bottom:68px}
.label-row{display:flex;justify-content:space-between;gap:20px;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-size:.75rem;font-weight:500;line-height:1.7}
.micro{font:400 .75rem/1.6 var(--mono);color:var(--muted)}
#hero-title{font:400 clamp(2rem,4.9vw,3.7rem)/1.35 var(--serif);letter-spacing:-.028em;max-width:830px;margin:50px 0 48px;text-wrap:pretty}
.quote-mark{color:#77826a}
.hero-under{display:flex;align-items:center;justify-content:space-between;gap:24px}
.hero-under>p{color:var(--muted);font-size:1rem;line-height:1.7}
.text-action{display:inline-flex;gap:22px;align-items:center;background:none;border:0;border-bottom:1px solid var(--ink);padding:12px 0;font-size:.9375rem;line-height:1.5;text-align:left}
.text-action>span:last-child{font-size:1.2rem}
.example-caption{display:flex;gap:23px;align-items:baseline;border-top:1px solid var(--line);margin-top:38px;padding-top:19px}
.example-caption p{font-size:.8125rem;line-height:1.7;color:var(--muted)}
#walkthrough{margin-top:34px;border:1px solid #aab49b;background:var(--white)}
.walkthrough-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 27px;background:var(--layer);border-bottom:1px solid var(--line)}
.subtle-button{font-size:.8125rem;background:none;border:0;text-decoration:underline;text-underline-offset:4px;padding:10px 0}
.scenario-main{padding:33px}
.scenario-main h3{font-size:1.5rem;font-weight:400;line-height:1.4;letter-spacing:-.02em;max-width:530px;margin:12px 0 20px}
.section{display:grid;grid-template-columns:260px 1fr;gap:60px;padding-top:105px;padding-bottom:105px;border-top:1px solid var(--line)}
.section-label{display:flex;gap:23px;font-size:.8125rem;line-height:1.8;color:var(--muted);padding-top:5px}
.index{font-family:var(--mono)}
h2{font:400 clamp(1.8rem,3.1vw,2.6rem)/1.25 var(--sans);letter-spacing:-.04em;text-wrap:balance}
.section-main h2{max-width:700px}
.body-columns{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-top:40px}
.definition{background:var(--layer);padding:70px 0}
.definition-header{display:flex;justify-content:space-between;gap:20px}
.definition h2{font-size:clamp(2rem,4vw,3.1rem);max-width:760px;margin-top:34px}
.definition-intro{max-width:650px;color:var(--muted);font-size:1rem;line-height:1.85;margin-top:27px}
.principle{background:#2c372b;color:#f3f5e9;padding:85px 0}
.principle-inner{padding-left:320px}
.principle h2{margin-top:28px;font-size:clamp(2rem,3.4vw,2.7rem);max-width:700px}
.principle-bottom{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:38px}
.principle-bottom p{font-size:1rem;line-height:1.85;color:#d4dccb}
.closing{padding-top:110px;padding-bottom:65px}
.return-sentence{font:400 clamp(1.2rem,2.4vw,1.7rem)/1.6 var(--serif);color:var(--muted)}
.closing h2{margin-top:33px;max-width:760px;font-size:clamp(2rem,4vw,3.2rem)}
.closing-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:35px;margin-top:35px}
.closing-meta p{font-size:.9375rem;line-height:1.8;color:var(--muted);max-width:440px}
.closing-meta a{font-size:.875rem}
.closing details{max-width:680px;border-top:1px solid var(--line);margin-top:70px}
.closing summary{cursor:pointer;font-size:.875rem;padding:23px 0;color:var(--muted)}
.closing details p{font-size:.9375rem;line-height:1.85;color:var(--muted);padding:0 0 15px}
.footer{display:flex;gap:25px;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:27px;padding-bottom:32px;font-size:.75rem;line-height:1.7;color:var(--muted)}
.footer a{font-size:.875rem;color:var(--ink)}
.skip{position:absolute;top:-100px;left:20px;background:var(--paper);padding:15px;z-index:3;color:var(--ink)}
.skip:focus{top:10px}
.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}
/* Public L0 optical refinement. Retained shell rules above derive from baseline. */
:root{--display:clamp(48px,5.1vw,72px);--statement:clamp(42px,4.1vw,58px);--heading:clamp(34px,3vw,42px);--thought:28px;--body:17px;--lead:21px;--label:12px;--caption:12px}
body{font-size:var(--body)}#hero-title{font-size:var(--display);line-height:1.04;max-width:960px;margin:52px 0 42px;letter-spacing:-.035em}.quote-line{display:inline}.hero{padding-top:76px;padding-bottom:68px}.hero-under{justify-content:flex-start;min-height:48px}.eyebrow{font-size:var(--label)}.micro{font-size:var(--caption)}.languages button{min-width:44px;min-height:44px}.subtle-button{min-height:44px;min-width:44px;font-size:14px}.text-action{min-height:48px}.header nav a{padding:12px 0}.example-caption p{font-size:var(--caption)}
#walkthrough{background:transparent;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.walkthrough-top{background:transparent;border-bottom:0;padding:12px 0}.scenario-main{padding:18px 0 30px;min-height:244px}#step-heading{font:400 var(--thought)/1.4 var(--sans);letter-spacing:-.015em;white-space:pre-line;max-width:760px;margin:23px 0;min-height:80px}#reveal-brand{margin-top:22px;color:var(--olive)}#reveal-brand:not([hidden])+#step-heading{font-size:36px;max-width:680px;min-height:80px;margin-top:12px}
h2{font-size:var(--heading);line-height:1.2;letter-spacing:-.035em}.body-columns p,.definition-intro,.principle-bottom p{font-size:var(--body);line-height:1.8}.body-columns p+p{margin-top:20px}.definition{padding:78px 0}.definition h2{font-size:var(--statement);max-width:760px;line-height:1.05}.definition-intro{font-size:var(--lead);max-width:700px;margin-top:30px}
.principle{padding:92px 0}.principle-inner{padding-left:240px}.principle h2{font-size:var(--statement);line-height:1.08;max-width:850px}.principle h2 span{display:block}.principle h2 span:empty{display:none}.principle-bottom{max-width:760px}.return-sentence{font-size:30px;line-height:1.3;max-width:900px}.closing h2{font-size:var(--heading);max-width:800px;line-height:1.3;margin-top:48px}.closing-meta p{font-size:18px}.closing-meta p>span{display:block}.closing-brand{font-size:24px;margin-bottom:8px}.closing details p{max-width:650px}.closing summary{min-height:48px;font-size:15px}.footer{font-size:var(--caption)}.footer div{margin-left:auto}.footer div p{margin:0}.static-walkthrough p{margin:24px 0;line-height:1.6}
html[lang=zh-Hant]{--display:clamp(42px,4.2vw,56px);--statement:48px;--heading:36px;--thought:27px;--body:18px;--lead:20px;--label:14px;--caption:13px}html[lang=zh-Hant] #hero-title{line-height:1.23;letter-spacing:0;max-width:960px}html[lang=zh-Hant] h2{letter-spacing:0;line-height:1.35}html[lang=zh-Hant] .eyebrow{letter-spacing:.06em}html[lang=zh-Hant] .definition h2{font-size:54px;line-height:1.08;letter-spacing:-.035em}html[lang=zh-Hant] .definition-intro{max-width:690px;line-height:1.8}html[lang=zh-Hant] .section-label{font-size:14px}html[lang=zh-Hant] .principle h2{line-height:1.25}html[lang=zh-Hant] .principle-bottom p{line-height:1.85}html[lang=zh-Hant] .return-sentence{font-size:28px;line-height:1.5}html[lang=zh-Hant] #step-heading{line-height:1.5;letter-spacing:0}html[lang=zh-Hant] #step-heading[lang=en]{letter-spacing:-.025em;line-height:1.2}
@media(max-width:1050px){.section{grid-template-columns:170px 1fr;gap:35px}.principle-inner{padding-left:205px}.body-columns{gap:26px}}
@media(max-width:760px){:root{--display:44px;--statement:39px;--heading:30px;--thought:26px;--lead:20px}.wrap{width:calc(100% - 48px)}.header{padding:18px 0;gap:15px}.header nav{display:none}.languages{margin-left:auto;gap:4px}.wordmark{font-size:1.3rem}.hero{padding:44px 0 54px}.label-row>.micro{display:none}#hero-title{margin:36px 0 26px;line-height:1.08}.hero #hero-title .quote-line{display:block}.example-caption{display:block;margin-top:26px;padding-top:17px}.example-caption p{margin-top:7px;max-width:390px}.walkthrough-top{gap:12px}.scenario-main{min-height:260px}#step-heading{min-height:110px;margin-top:20px}#reveal-brand:not([hidden])+#step-heading{font-size:32px;min-height:100px}.section{grid-template-columns:1fr;gap:27px;padding:60px 0}.section-label{gap:15px}.body-columns{grid-template-columns:1fr;gap:20px;margin-top:27px}.definition{padding:54px 0}.definition h2{margin-top:25px}.definition-intro{margin-top:24px}.principle{padding:60px 0}.principle-inner{padding-left:0}.principle h2{font-size:35px}.principle-bottom{grid-template-columns:1fr;gap:22px;margin-top:30px}.closing{padding:65px 0 42px}.return-sentence{font-size:25px}.closing h2{margin-top:35px}.closing-meta{display:block}.closing-meta a{margin-top:20px}.closing details{margin-top:45px}.footer{flex-wrap:wrap;gap:15px;padding:24px 0}.footer div{order:3;width:100%;margin:0}.footer span{margin-left:auto}html[lang=zh-Hant]{--display:34px;--statement:36px;--heading:30px;--thought:24px;--body:17px;--lead:19px}html[lang=zh-Hant] #hero-title{line-height:1.24;letter-spacing:0;margin:36px 0 28px}html[lang=zh-Hant] .quote-line{display:block}html[lang=zh-Hant] .definition h2{font-size:38px}html[lang=zh-Hant] .principle h2{font-size:34px;line-height:1.3}html[lang=zh-Hant] .return-sentence{font-size:25px}}
@media(prefers-reduced-motion:no-preference){#walkthrough:not([hidden]){animation:arrive .18s ease-out}@keyframes arrive{from{opacity:.3;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.header nav,.languages,.text-action,button{display:none}.section{break-inside:avoid;padding:35px 0}.principle{color:var(--ink);background:var(--layer)}.principle-bottom p{color:var(--ink)}}
@media(max-width:380px){html[lang=en]{--display:40px}}
@media(min-width:761px) and (max-width:900px){.body-columns,.principle-bottom{grid-template-columns:1fr;gap:24px}}
html[lang=zh-Hant] #closing-title span{display:block}
/* V1.1 / 04D: orientation and compact brand note; example removed in 04E. */
.orientation{padding-top:64px;padding-bottom:68px}
.orientation h1{font:400 clamp(48px,5.1vw,72px)/1.04 var(--sans);letter-spacing:-.04em;max-width:880px;margin:28px 0 30px;text-wrap:balance}
.orientation-lead{font-size:22px;line-height:1.6;max-width:740px}
.orientation-support{font-size:17px;line-height:1.8;color:var(--muted);max-width:680px;margin-top:18px}
.orientation-transition{margin-top:25px}
#experience{border-top:1px solid var(--line)}
html[lang=zh-Hant] .orientation h1{font-size:64px;line-height:1.08;letter-spacing:-.04em}
html[lang=zh-Hant] .orientation-lead{font-size:21px;line-height:1.75;max-width:740px}
html[lang=zh-Hant] .orientation-support{font-size:18px;line-height:1.8;max-width:680px}
.closing #story{max-width:640px;margin-top:52px}
.closing #story summary{font-size:15px;padding:20px 0}
.closing #story p{font-size:15px;line-height:1.8;padding-bottom:12px;max-width:640px}
html[lang=zh-Hant] .closing #story p{font-size:16px;line-height:1.8}
@media(max-width:760px){
 .orientation{padding-top:36px;padding-bottom:40px}
 .orientation h1,html[lang=zh-Hant] .orientation h1{font-size:40px;line-height:1.08;max-width:540px;margin:24px 0}
 .orientation-lead,html[lang=zh-Hant] .orientation-lead{font-size:19px;line-height:1.6}
 .orientation-support,html[lang=zh-Hant] .orientation-support{font-size:17px;line-height:1.7;margin-top:16px}
 .orientation-transition{margin-top:20px}
 .closing #story{margin-top:36px}.closing #story summary{font-size:14px;padding:19px 0}
 html[lang=zh-Hant] .closing #story p{font-size:15.5px}
}
@media(max-width:380px){.orientation h1,html[lang=zh-Hant] .orientation h1{font-size:38px}.orientation-lead,html[lang=zh-Hant] .orientation-lead{font-size:18px}}