:root{color-scheme:light;--paper:#fffdf8;--ink:#242719;--muted:#5c6052;--brand:#ffcc00;--wash:#fff5c7;--line:#dddccf;--button:#272c1c;--on-button:#fffdf8;--focus:#6b4900;font-family: 'Avenir Next', Avenir, 'Helvetica Neue', 'PingFang TC', 'Microsoft JhengHei', sans-serif;font-size:16px;line-height:1.6;font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:32px}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}body.good{--ink:#163c28;--muted:#4e6757;--brand:#1a7a40;--wash:#e8f5e7;--line:#cbdccc;--button:#1a6b3b;--focus:#145930}a{color:inherit;text-decoration-thickness:1px;text-underline-offset:5px}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible+span{outline:3px solid var(--focus);outline-offset:5px}::selection{background:var(--brand);color:#101b13}img{display:block;max-width:100%;height:auto}svg{width:22px;height:22px;flex-shrink:0}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.14;font-weight:600;text-wrap:balance}h1{font-size:clamp(3.4rem,5.3vw,5.2rem);letter-spacing:-.04em}h2{font-size:clamp(2.2rem,3.7vw,3.5rem);letter-spacing:-.035em}h3{font-size:1.4rem;letter-spacing:-.02em}p{max-width:66ch;color:var(--muted)}.wrap{width:min(1184px,calc(100% - 96px));margin-inline:auto}.site-header{display:flex;align-items:center;gap:40px;padding-block:27px}.brand{display:flex;gap:12px;align-items:center;font-size:1.15rem;font-weight:650;text-decoration:none;white-space:nowrap}.brand img{border-radius:9px}.site-header nav{display:flex;gap:28px;margin-left:auto;font-size:.95rem}.site-header nav a{text-decoration:none}.site-header nav a:hover{text-decoration:underline}.locale-link{display:flex;gap:7px;align-items:center;font-size:.88rem;min-height:44px;text-decoration:none;border-bottom:1px solid var(--line)}.locale-link svg{width:16px}.skip-link{position:fixed;top:-100px;left:20px;background:var(--ink);color:white;padding:12px 20px;z-index:10}.skip-link:focus{top:10px}.hero{display:grid;grid-template-columns:1.3fr .8fr;gap:64px;align-items:center;padding-top:26px;padding-bottom:76px}.hero-copy{padding-block:32px}.intro{font-size:1.2rem;line-height:1.75;max-width:41ch;margin-top:28px}.primary-button{display:inline-flex;gap:12px;align-items:center;background:var(--button);color:var(--on-button);padding:16px 24px;border-radius:8px;text-decoration:none;font-weight:600;margin-top:32px;transition:background .2s,transform .2s}.primary-button:hover{transform:translateY(-2px);background:#39432c}.good .primary-button:hover{background:#114b29}.hero-details{display:flex;gap:20px;flex-wrap:wrap;font-size:.85rem;color:var(--muted);margin-top:28px}.hero-details span{display:flex;gap:7px;align-items:center}.hero-details svg{width:17px;height:17px}.hero-details span+span{border-left:1px solid var(--line);padding-left:20px}.hero-art{justify-self:center;max-width:335px;border-radius:16px;overflow:hidden;background:var(--wash);box-shadow:0 20px 48px -28px #35422255}.hero-art img{width:100%;height:auto}.listen-section{background:var(--wash);padding-block:88px}.listen-layout{display:grid;grid-template-columns:1fr 1.45fr;gap:70px;align-items:start}.listen-intro>p{margin-top:24px;font-size:1.04rem}.time-stamp{margin-top:32px}.time-stamp>span{display:block;font-size:4rem;line-height:1.15;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.time-stamp>small{display:block;margin-top:6px;font-size:.82rem;color:var(--muted)}.listen-intro .audio-note{font-size:.86rem;max-width:33ch;margin-top:25px}.player{background:var(--paper);border-radius:14px;padding:28px 30px}.player-options{display:flex;flex-wrap:wrap;gap:20px 24px;padding-bottom:26px}fieldset{padding:0;margin:0;border:0;min-width:0;flex:1}legend{font-size:.86rem;font-weight:600;margin-bottom:10px}.segmented{display:flex;gap:4px;background:var(--wash);padding:5px;border-radius:8px}.segmented label{flex:1;position:relative}.segmented input{position:absolute;opacity:0;width:1px;height:1px}.segmented span{display:block;white-space:nowrap;padding:9px 12px;text-align:center;font-size:.88rem;border-radius:5px;cursor:pointer;min-height:42px}.segmented input:checked+span{background:var(--button);color:var(--on-button);font-weight:600}.segmented span:hover{box-shadow:inset 0 0 0 1px var(--muted)}.audio-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:18px;padding:21px 0;border-top:1px solid var(--line)}.language-name>span{display:block;font-size:1.18rem;font-weight:600}.language-name small{display:block;font-size:.78rem;color:var(--muted);margin-top:2px}.sample-time{font-size:1.1rem;font-variant-numeric:tabular-nums;white-space:nowrap}.sample-time small{font-size:.7rem}.play-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:7px;font-size:.86rem;min-height:46px;padding:10px 12px;min-width:134px}.play-button svg{width:16px;height:16px}.play-button:hover{background:var(--wash);border-color:var(--ink)}.play-button[aria-pressed=true]{background:var(--button);color:var(--on-button);border-color:var(--button)}.player-bottom{border-top:1px solid var(--line);padding-top:18px;display:flex;gap:15px;align-items:start;justify-content:space-between}.player-bottom p{font-size:.8rem;padding-top:8px;min-height:3.2em}.player-bottom button{background:transparent;border:0;text-decoration:underline;text-underline-offset:4px;white-space:nowrap;color:var(--ink);font-size:.8rem;min-height:40px;padding:5px 0}.player-bottom button:disabled{color:var(--muted);text-decoration:none}.features-section{padding-block:104px}.section-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:end;margin-bottom:52px}.section-heading>p{font-size:1.07rem;max-width:40ch}.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:42px 70px}.feature-list article{padding-top:24px;border-top:1px solid var(--line)}.feature-list p{margin-top:14px;max-width:47ch}.access-section{padding-block:94px;background:#f2f0e8}.good .access-section{background:#eef2eb}.access-layout{display:grid;grid-template-columns:1.4fr .8fr;gap:90px;align-items:center}.access-list article{display:grid;grid-template-columns:180px 1fr;gap:24px;border-top:1px solid var(--line);padding-block:23px}.access-list h3{font-size:1.18rem;line-height:1.4}.access-list p{font-size:.97rem}.contrast-art{max-width:250px;justify-self:center}.contrast-art img{border-radius:22px;box-shadow:0 15px 40px -20px #17261e66}.contrast-art figcaption{text-align:center;font-size:.8rem;color:var(--muted);margin-top:18px}footer.wrap{padding-block:48px;display:grid;grid-template-columns:1fr auto;gap:30px}footer p{font-size:.85rem;margin-top:9px}.footer-links{display:flex;gap:24px;align-items:start;font-size:.85rem;flex-wrap:wrap}.footer-links a{display:inline-flex;align-items:center;gap:5px;min-height:44px}.footer-links svg{width:16px}footer>small{font-size:.75rem;color:var(--muted);grid-column:1/-1}.chooser{padding-block:100px}.chooser>p{margin-top:24px}.chooser>div{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:60px}.chooser>div>a{padding:40px;text-decoration:none;background:#fff1b2;border-radius:16px}.chooser>div>a+ a{background:#e0f0df}.chooser h2{font-size:2rem;margin-top:28px}.chooser p{margin-block:20px}.chooser span{display:inline-block;text-decoration:underline;text-underline-offset:5px}noscript a{display:inline-block;margin:10px}html[lang=zh-Hant] h1{font-size:clamp(3rem,4.7vw,4.5rem);line-height:1.25;letter-spacing:-.03em}html[lang=zh-Hant] h2{line-height:1.3}
@media(min-width:1440px){.hero{gap:110px}.hero-art{max-width:355px}}
@media(max-width:1050px){.wrap{width:calc(100% - 64px)}.hero{gap:35px;grid-template-columns:1.25fr .85fr}.hero-art{max-width:295px}.site-header{gap:24px}.site-header nav{gap:18px}.listen-layout{gap:35px;grid-template-columns:.8fr 1.3fr}.player{padding:22px}.player-options{gap:16px}.audio-row{gap:12px}.play-button{min-width:115px}.access-layout{gap:40px}.access-list article{grid-template-columns:145px 1fr}.section-heading{gap:40px}.footer-links{gap:16px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.site-header{flex-wrap:wrap;gap:10px 20px;padding-block:18px}.site-header .brand{font-size:1rem}.site-header nav{order:3;width:100%;justify-content:center;margin:8px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:.86rem;gap:28px}.locale-link{margin-left:auto;font-size:.8rem}.hero{grid-template-columns:1fr;gap:26px;padding-top:24px;padding-bottom:48px}.hero-copy{padding-block:12px}h1{font-size:clamp(3rem,9vw,4.6rem)}.intro{font-size:1.07rem;max-width:44ch;margin-top:22px}.hero-art{max-width:290px}.hero-details{margin-top:24px;font-size:.78rem;gap:12px}.hero-details span+span{padding-left:12px}.primary-button{margin-top:26px}.listen-section{padding-block:52px}.listen-layout{grid-template-columns:1fr;gap:30px}.listen-intro{display:grid;grid-template-columns:1fr auto;gap:0 20px}.listen-intro h2{grid-column:1/-1}.listen-intro>p{grid-column:1/2;margin-top:20px}.time-stamp{grid-column:2;grid-row:2/4;align-self:center;margin:20px 0 0}.time-stamp>span{font-size:2.8rem}.time-stamp>small{max-width:15ch}.listen-intro .audio-note{margin-top:14px;max-width:40ch}.player{padding:22px}.features-section{padding-block:60px}.section-heading{grid-template-columns:1fr;gap:20px;margin-bottom:32px}.section-heading>p{max-width:50ch}.feature-list{gap:28px;grid-template-columns:1fr}.feature-list p{max-width:60ch}.access-section{padding-block:60px}.access-layout{grid-template-columns:1fr;gap:40px}.access-list article{grid-template-columns:155px 1fr;gap:20px}.contrast-art{max-width:230px}footer.wrap{grid-template-columns:1fr;padding-block:36px;gap:22px}.footer-links{gap:18px}.chooser{padding-block:50px}.chooser>div{grid-template-columns:1fr}.chooser>div>a{padding:28px}}
@media(max-width:430px){.wrap{width:calc(100% - 32px)}.hero-art{max-width:260px}.listen-intro{display:block}.time-stamp{margin-top:22px}.time-stamp>small{max-width:none}.player{padding:18px 16px}.player-options{gap:14px}.segmented span{padding:9px 8px;font-size:.8rem}.audio-row{gap:10px;grid-template-columns:1fr auto}.sample-time{display:none}.play-button{font-size:.8rem;min-width:120px}.access-list article{grid-template-columns:1fr;gap:10px}.site-header nav{gap:22px}html[lang=zh-Hant] h1{font-size:2.8rem}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media(forced-colors:active){.segmented input:checked+span,.play-button[aria-pressed=true]{outline:2px solid Highlight}.segmented input:checked+span::after{content:' ✓'}.primary-button{border:1px solid ButtonText}}
.slot-options{margin-bottom:24px}.slot-options .segmented span{white-space:normal}
/* A single desktop stage gives each device a deliberate, readable presentation. */
.hero{grid-template-columns:.9fr 1.1fr;gap:48px}
.hero-gallery{min-width:0;width:100%}.device-picker{display:none}.device-stage{display:grid;gap:28px;justify-items:center}
.hero-gallery .hero-art{width:300px;max-width:100%;margin:0;justify-self:center}
.hero-ipad{width:100%;max-width:560px;justify-self:center}
.hero-ipad img{width:100%;height:auto;border-radius:12px;box-shadow:0 16px 40px -24px #35422255}
.hero-ipad figcaption{font-size:.8rem;color:var(--muted);text-align:center;margin-top:12px}
@media(min-width:761px){
 .has-device-picker .device-picker{display:flex;width:max-content;max-width:100%;gap:4px;margin:0 auto 22px;padding:5px;border:1px solid var(--line);border-radius:10px}
 .device-picker button{min-height:44px;padding:8px 28px;border:0;border-radius:6px;color:var(--muted);background:transparent;font-weight:600}
 .device-picker button:hover{background:var(--wash);color:var(--ink)}
 .device-picker button[aria-pressed=true]{background:var(--button);color:var(--on-button)}
 .has-device-picker .device-stage{height:660px;align-items:center}
 .has-device-picker[data-device=iphone] .hero-ipad,.has-device-picker[data-device=ipad] .hero-art{display:none}
}
@media(min-width:761px) and (max-width:1050px){.hero{gap:30px}.hero-gallery .hero-art{width:260px}.has-device-picker .device-stage{height:570px}}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:32px}.hero-gallery{max-width:560px;justify-self:center}.hero-gallery .hero-art{width:260px}}
@media(forced-colors:active){.device-picker button[aria-pressed=true]{outline:2px solid Highlight}}

/* Three page languages; wrap at narrow widths without changing navigation order. */
.locale-links{display:flex;gap:14px;flex-wrap:wrap;margin-left:auto}
.locale-links .locale-link{margin-left:0}
.preview-note{font-size:.8rem;text-align:center;margin-bottom:12px}
html[lang=ja] h1{font-size:clamp(2.8rem,4.7vw,4.5rem);line-height:1.3;letter-spacing:-.03em}
html[lang=ja] h2{line-height:1.4}
@media(max-width:760px){.site-header .locale-links{gap:12px}.site-header nav{flex-wrap:wrap}}
@media(max-width:430px){html[lang=ja] h1{font-size:2.6rem}}