@font-face{font-family:"Noto Sans TC";src:url("../../fonts/NotoSansTC-Regular.woff") format("woff");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Noto Sans TC";src:url("../../fonts/NotoSansTC-Bold.woff") format("woff");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"Noto Serif TC";src:url("../../fonts/NotoSerifTC-Regular.woff") format("woff");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Noto Serif TC";src:url("../../fonts/NotoSerifTC-Bold.woff") format("woff");font-style:normal;font-weight:700;font-display:swap}
:root{--ink:#142b43;--navy:#102c41;--teal:#559eaa;--lavender:#9d8fae;--gold:#e8b75f;--paper:#f8fbfc;--line:#dce8eb;--body:#415b6a;--sans:'Noto Sans TC','Microsoft JhengHei','PingFang TC',sans-serif;--serif:'Noto Serif TC','Microsoft JhengHei','PingFang TC',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font:400 17px/1.95 var(--sans);overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%}::selection{background:#b8dfe0;color:var(--ink)}
.skip-link{position:fixed;top:-4rem;left:1rem;z-index:100;padding:.65rem 1rem;color:#fff;background:var(--ink);border-radius:.5rem}.skip-link:focus{top:1rem}a:focus-visible,button:focus-visible{outline:3px solid #e8b75f;outline-offset:4px}.container{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.site-header{position:fixed;z-index:50;top:16px;left:0;width:100%;padding:0 20px;pointer-events:none}.nav-shell{pointer-events:auto;width:min(1180px,100%);height:78px;margin:auto;padding:8px 12px 8px 22px;display:flex;align-items:center;justify-content:space-between;gap:26px;background:rgba(255,255,255,.91);border:1px solid rgba(255,255,255,.85);border-radius:999px;box-shadow:0 12px 38px rgba(29,48,68,.14);backdrop-filter:blur(16px)}.brand{display:inline-flex;align-items:center;gap:14px;flex-shrink:0;color:var(--ink);font-size:18px;font-weight:800;letter-spacing:.04em;line-height:1.4;white-space:nowrap}.brand img{width:68px;height:52px;object-fit:contain}.nav-links{margin-left:auto;display:flex;align-items:center;gap:clamp(13px,1.8vw,28px)}.nav-links>a{color:#405061;font-size:14px;font-weight:700;white-space:nowrap;transition:color .2s}.nav-links>a:hover,.nav-links>a[aria-current=page]{color:#468e9a}.nav-links .nav-cta{color:white;padding:10px 22px;background:linear-gradient(110deg,var(--teal),var(--lavender));border-radius:999px;box-shadow:0 8px 22px rgba(85,158,170,.2)}.nav-links .nav-cta:hover{color:white;filter:brightness(1.08)}.menu-toggle{display:none;margin-left:auto;padding:9px 17px;color:var(--ink);background:white;border:1px solid var(--line);border-radius:999px;font-weight:700;cursor:pointer}
.about-hero{position:relative;min-height:810px;display:flex;align-items:center;overflow:hidden;isolation:isolate;background:#17354b;color:#fff}.hero-image{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover}.about-hero::before{content:'';position:absolute;z-index:-1;inset:0;pointer-events:none}.hero-inner{position:relative;padding-block:170px 128px}.hero-eyebrow{margin:0 0 20px;color:#e8c684;font-size:13px;font-weight:800;letter-spacing:.26em}.about-hero h1{margin:0;font:600 clamp(64px,7vw,108px)/1.18 var(--serif);letter-spacing:.02em}.hero-subtitle{margin:20px 0 0;font:500 clamp(27px,3vw,43px)/1.55 var(--serif);letter-spacing:-.025em}.hero-intro{max-width:570px;margin:31px 0 0;font-size:18px;line-height:1.95;color:#e4eff2}.hero-down{display:inline-flex;gap:26px;align-items:center;margin-top:40px;padding:10px 3px;border-bottom:1px solid rgba(255,255,255,.55);font-size:14px;font-weight:700}.hero-down span{font-size:22px;line-height:1}.hero-caption{position:absolute;right:5vw;bottom:39px;color:#d4e1e7;font-size:12px;letter-spacing:.14em}
.chapter-navigation{position:relative;z-index:4;background:#fff;border-bottom:1px solid var(--line)}.chapter-navigation .container{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}.chapter-navigation span{font-size:11px;font-weight:800;letter-spacing:.13em;color:#558f9a}.chapter-navigation a{font-size:13px;font-weight:700;color:#587080}.chapter-navigation a:hover{color:#2f8998}
.chapter{position:relative;padding:clamp(86px,10vw,150px) 0;scroll-margin-top:95px}.chapter-grid{display:grid;grid-template-columns:minmax(290px,.82fr) minmax(0,1.18fr);gap:clamp(50px,7vw,125px);align-items:start}.chapter-heading{position:relative}.chapter-content{min-width:0}.chapter-number{display:block;margin-bottom:40px;font:500 clamp(55px,7vw,104px)/.8 var(--serif);letter-spacing:-.08em;color:#bad5d9}.section-tag{margin:0 0 19px;color:#3f8b98;font-size:12px;font-weight:800;letter-spacing:.15em}.chapter h2{margin:0;font:700 clamp(34px,3.8vw,52px)/1.48 var(--sans);letter-spacing:-.035em;text-wrap:balance}.chapter-content p{margin:0 0 25px;color:var(--body)}.chapter-prose>p:first-child{margin-top:0}.chapter-content p:last-child{margin-bottom:0}.chapter blockquote{position:relative;margin:35px 0 45px;padding:18px 0 18px 31px;border-left:3px solid var(--gold)}.chapter blockquote p{margin:0!important;color:var(--ink);font:500 clamp(20px,2vw,25px)/1.85 var(--serif)}.chapter blockquote cite{display:block;margin-top:15px;color:#607988;font:500 13px/1.6 var(--sans);font-style:normal}.chapter h3{margin:48px 0 22px;font-size:22px;line-height:1.5}.method-list{padding:0;margin:34px 0 40px;list-style:none;border-top:1px solid #c4d8dc}.method-list li{display:grid;grid-template-columns:42px 1fr;gap:19px;padding:22px 0;border-bottom:1px solid #c4d8dc;line-height:1.85}.method-list strong{color:var(--ink)}.method-index{color:#5797a2;font:600 23px/1.6 var(--serif)}.evidence{grid-column:1/-1;min-width:0;margin-top:12px;padding:clamp(25px,4vw,58px);border:1px solid #d7e6e8;border-radius:27px;background:#eef6f6}.evidence h3:first-child{margin-top:0}.evidence p{max-width:780px;font-size:15px}.table-wrap{max-width:780px;overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:460px;font-size:15px}th{text-align:left;color:#466779;font-size:13px;font-weight:700}td,th{padding:11px 12px;border-bottom:1px solid #d6e5e7}td:first-child{font-weight:700;color:#288695}td:last-child,th:last-child{text-align:right}.evidence blockquote{max-width:820px;margin-bottom:26px}.observation-heading{margin-top:36px!important}.emphasis{margin-top:40px!important;font-size:25px;font-weight:700;color:var(--ink)!important}.button{display:inline-flex;align-items:center;justify-content:center;gap:27px;margin-top:22px;padding:13px 25px;border-radius:999px;background:linear-gradient(110deg,var(--teal),var(--lavender));color:#fff;font-size:15px;font-weight:700;box-shadow:0 12px 30px rgba(85,158,170,.22)}.button span{font-size:21px;font-weight:400}
.site-footer{padding:43px 0 30px;background:#10283b;color:#c4d4de}.footer-grid{display:grid;grid-template-columns:1fr auto;gap:35px;align-items:start}.footer-brand{font-size:21px;font-weight:800;color:white}.footer-sub{font-size:13px;letter-spacing:.12em}.footer-links{display:flex;flex-wrap:wrap;gap:11px 24px;font-size:13px}.copyright{margin-top:38px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);font-size:12px;color:#9baeb9}
/* E: a cinematic, chaptered journey. */
.page-e .hero-image{object-position:center 48%}.page-e .about-hero::before{background:linear-gradient(90deg,rgba(9,31,49,.65),rgba(9,31,49,.32) 42%,rgba(10,32,51,.08) 90%),linear-gradient(0deg,rgba(9,30,46,.45),transparent 45%)}.page-e .hero-inner{max-width:1180px}.page-e .chapter-2{background:#153349;color:#fff}.page-e .chapter-2 .chapter-number{color:#426476}.page-e .chapter-2 .section-tag{color:#97cdd0}.page-e .chapter-2 p{color:#d7e7eb}.page-e .chapter-2 blockquote{border-left-color:#e8b75f}.page-e .chapter-2 blockquote p{color:#fff}.page-e .chapter-2 cite{color:#b6cbd3}.page-e .chapter-3{background:linear-gradient(130deg,#e8f4f3,#f9fbfb 60%,#f2f0f8)}.page-e .chapter-4{background:#fff}.page-e .chapter-5{background:linear-gradient(130deg,#173448,#2f3c59 70%,#4c425e);color:#fff}.page-e .chapter-5 p{color:#dce6ea}.page-e .chapter-5 .chapter-number{color:#6e8193}.page-e .chapter-5 .section-tag{color:#a2d3d3}.page-e .chapter-6{background:linear-gradient(115deg,#f2f4fa,#e8f5f4)}.page-e .chapter-7{background:#103044;color:#fff}.page-e .chapter-7 .chapter-number{color:#496d7e}.page-e .chapter-7 .section-tag{color:#a1d3d4}.page-e .chapter-7 p{color:#dce9ec}.page-e .chapter-7 blockquote p,.page-e .chapter-7 .emphasis{color:#fff!important}.page-e .chapter-7 cite{color:#b7ccd2}
/* F: a strong split-frame editorial opening and independent evidence panels. */
.page-f .about-hero{min-height:790px;background:#17364b}.page-f .hero-image{inset:0 0 0 auto;width:57%;object-position:70% center;z-index:-2}.page-f .about-hero::before{background:linear-gradient(90deg,#183c51 0%,#183c51 38%,rgba(24,60,81,.96) 42%,rgba(24,60,81,.02) 59%),linear-gradient(0deg,rgba(15,42,59,.55),transparent 40%)}.page-f .about-hero::after{content:'';position:absolute;right:0;bottom:0;width:57%;height:11px;background:linear-gradient(90deg,#5ba6ad,#a797bb,#d5c4af)}.page-f .hero-inner{padding-block:160px 110px}.page-f .hero-inner>*{max-width:495px}.page-f .hero-subtitle{font-size:clamp(27px,3vw,40px)}.page-f .hero-caption{right:4vw;color:#fff;text-shadow:0 2px 10px #17364b}.page-f .chapter-2{background:#fbfcfc}.page-f .chapter-2 .chapter-heading{padding-top:50px}.page-f .chapter-2 .chapter-number{position:absolute;top:-85px;left:-12px;color:#e3f0f1;font-size:150px;z-index:0}.page-f .chapter-2 .chapter-heading>*:not(.chapter-number){position:relative}.page-f .chapter-3{background:#e6f3f3}.page-f .chapter-3 .chapter-grid{grid-template-columns:.9fr 1.1fr}.page-f .chapter-4{background:#18374a;color:#fff}.page-f .chapter-4 .chapter-number{color:#547788}.page-f .chapter-4 .section-tag{color:#9bd2d1}.page-f .chapter-4 p{color:#dce9eb}.page-f .chapter-4 blockquote p,.page-f .chapter-4 .method-list strong{color:#fff}.page-f .chapter-4 cite{color:#b9cbd0}.page-f .chapter-4 .method-list{border-color:#59798a}.page-f .chapter-4 .method-list li{border-color:#59798a}.page-f .chapter-4 .method-index{color:#e8b75f}.page-f .chapter-4 .evidence{background:#f3f9f9;color:var(--ink)}.page-f .chapter-4 .evidence p{color:var(--body)}.page-f .chapter-4 .evidence blockquote p{color:var(--ink)}.page-f .chapter-4 .evidence cite{color:#607988}.page-f .chapter-5{background:linear-gradient(115deg,#f0f1f8,#fcfbfd)}.page-f .chapter-6{background:#f8fbfb}.page-f .chapter-7{background:linear-gradient(120deg,#dbeeed,#e9edf5 70%)}.page-f .chapter-7 .chapter-grid{grid-template-columns:.8fr 1.2fr}.page-f .chapter-7 .chapter-content{padding:clamp(28px,4vw,55px);background:rgba(255,255,255,.72);border-radius:28px;border:1px solid #d3e2e5;box-shadow:0 25px 60px rgba(41,79,106,.09)}
/* Approved Prove material: visible evidence panels from the confirmed HTML. */
.hero-metrics{position:relative;z-index:3;margin-top:-1px;background:#142f43}.metric-panel{grid-column:1/-1;min-width:0;margin-top:45px;padding:clamp(25px,4vw,52px);background:#fff;border:1px solid #d5e5e7;border-radius:26px;box-shadow:0 20px 54px rgba(31,75,97,.08)}.metric-panel h3{margin:0 0 30px!important;color:var(--ink);font-size:21px;letter-spacing:.02em}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.metric{min-width:0;padding:25px 23px;background:#f0f7f8;border:1px solid #e0ecee;border-radius:15px}.metric strong{display:block;color:#2c8997;font:800 clamp(27px,3vw,41px)/1.3 var(--sans);letter-spacing:-.05em}.metric span{display:block;margin-top:9px;color:#466271;font-size:14px;line-height:1.65}.hero-data{margin:0;padding:24px 0 27px;background:transparent;border:0;box-shadow:none;border-radius:0}.hero-data h3{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.hero-data .metric-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.hero-data .metric{padding:12px 23px;background:transparent;border:0;border-radius:0;border-right:1px solid rgba(255,255,255,.18)}.hero-data .metric:first-child{padding-left:0}.hero-data .metric:last-child{border-right:0}.hero-data .metric strong{color:#f3cd87;font-size:27px}.hero-data .metric span{color:#d1e2e7;font-size:12px}.page-f .hero-metrics{background:#edf5f5}.page-f .hero-data .metric{border-color:#c9dfe2}.page-f .hero-data .metric strong{color:#368c9a}.page-f .hero-data .metric span{color:#4c6876}.reading-data{margin:0;padding:0;background:transparent;border:0;box-shadow:none}.reading-data .metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.reading-data .metric{background:#fff}.reading-data .metric strong{font-size:37px}.reading-data h4{margin:43px 0 18px;color:var(--ink);font-size:18px}.ability-bars{max-width:780px;margin:0;padding:0;list-style:none}.ability-bars li{position:relative;display:grid;grid-template-columns:1fr auto;gap:5px 22px;padding:11px 0 16px;border-bottom:1px solid #d4e5e7;color:#28465a;font-size:15px;font-weight:700}.ability-bars small{display:block;color:#718997;font-size:12px;font-weight:500}.ability-bars strong{font-size:20px;color:#318c98}.ability-bars i{grid-column:1/-1;display:block;width:100%;height:5px;background:linear-gradient(90deg,#62aeb6 var(--bar),#d8e8e9 var(--bar));border-radius:5px}.reading-data .data-foot{margin:26px 0 0;color:#647d89;font-size:13px;line-height:1.8}.change-data{margin-top:10px}.page-e .chapter-4 .evidence{border:0;padding:0;background:transparent}.page-e .chapter-4 .reading-data{padding:clamp(25px,4vw,52px);background:#eaf5f5;border:1px solid #d5e5e7;border-radius:26px}.page-e .chapter-4 .evidence>blockquote,.page-e .chapter-4 .evidence>.observation-heading,.page-e .chapter-4 .evidence>p{margin-left:clamp(0px,4vw,50px)}.page-e .chapter-4 .evidence>.observation-heading{margin-top:48px!important}.page-e .chapter-4 .evidence>blockquote{max-width:850px}
@media(max-width:1060px){.nav-shell{gap:14px}.nav-links{gap:13px}.brand{gap:7px;font-size:16px}.brand img{width:56px}.nav-links>a{font-size:13px}.nav-links .nav-cta{padding:10px 16px}.chapter-navigation a{font-size:12px}}
@media(max-width:820px){.site-header{top:12px;padding:0 12px}.nav-shell{height:66px;padding:7px 9px 7px 15px}.brand img{width:52px;height:42px}.menu-toggle{display:block}.nav-links{position:absolute;top:calc(100% + 9px);left:12px;right:12px;display:none;flex-direction:column;align-items:stretch;gap:0;padding:15px;background:rgba(255,255,255,.98);border:1px solid var(--line);border-radius:22px;box-shadow:0 18px 40px rgba(25,55,77,.16)}.nav-links[data-open=true]{display:flex}.nav-links>a{font-size:15px;padding:9px 13px}.nav-links .nav-cta{text-align:center;margin-top:8px}.container{width:min(100% - 36px,1180px)}.about-hero{min-height:760px}.hero-inner{padding-block:140px 90px}.page-f .hero-image{width:100%;opacity:.53;object-position:65% center}.page-f .about-hero::before{background:linear-gradient(90deg,rgba(15,45,64,.95),rgba(15,45,64,.55)),linear-gradient(0deg,rgba(15,45,64,.7),transparent 70%)}.page-f .hero-inner>*{max-width:630px}.chapter-navigation{display:none}.chapter-grid,.page-f .chapter-3 .chapter-grid,.page-f .chapter-7 .chapter-grid{grid-template-columns:1fr;gap:36px}.chapter-number{margin-bottom:28px}.chapter{padding:80px 0}.page-f .chapter-2 .chapter-number{position:static;font-size:90px}.page-f .chapter-2 .chapter-heading{padding-top:0}}
@media(max-width:560px){body{font-size:16px}.container{width:min(100% - 32px,1180px)}.site-header{padding:0 10px}.nav-links{left:10px;right:10px}.brand{font-size:15px}.brand img{width:44px}.about-hero,.page-f .about-hero{min-height:700px;align-items:start}.hero-inner,.page-f .hero-inner{padding-block:137px 85px}.about-hero h1{font-size:57px}.hero-subtitle,.page-f .hero-subtitle{font-size:29px}.hero-intro{font-size:16px;margin-top:20px}.hero-down{margin-top:25px}.hero-caption{display:none}.page-e .hero-image{object-position:63% center}.page-e .about-hero::before{background:linear-gradient(90deg,rgba(11,34,52,.88),rgba(11,34,52,.48)),linear-gradient(0deg,rgba(11,34,52,.75),transparent 70%)}.chapter{padding:67px 0}.chapter h2{font-size:34px}.chapter-number{font-size:64px}.chapter blockquote{padding-left:19px}.chapter blockquote p{font-size:19px}.evidence{padding:22px 15px}.method-list li{grid-template-columns:33px 1fr;gap:10px}.footer-grid{grid-template-columns:1fr}.page-f .chapter-7 .chapter-content{padding:24px 18px}}
@media(max-width:360px){.brand{font-size:14px}.brand img{width:40px}.about-hero h1{font-size:48px}.hero-subtitle{font-size:25px}.hero-intro{font-size:15px}.about-hero,.page-f .about-hero{min-height:720px}}
@media(max-width:820px){.hero-data .metric-grid,.reading-data .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-data .metric:nth-child(2){border-right:0}.hero-data .metric:nth-child(n+3){border-top:1px solid rgba(255,255,255,.18)}.page-f .hero-data .metric:nth-child(n+3){border-color:#c9dfe2}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.hero-data .metric{padding:15px 10px}.hero-data .metric:first-child{padding-left:10px}.hero-data .metric strong{font-size:20px}.hero-data .metric span{font-size:11px}.metric-panel{padding:22px 16px}.metric-grid{grid-template-columns:1fr}.reading-data .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reading-data .metric{padding:16px 12px}.reading-data .metric strong{font-size:29px}.reading-data .metric span{font-size:12px}.page-e .chapter-4 .reading-data{padding:22px 16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.nav-links>a{transition:none}}


/* Noto Serif TC remains the actual loaded Ming typeface; a serif family is the fallback. */

.page-e4 .hero-subtitle,.page-e4 .story-title,.page-e4 .chapter blockquote p{font-family:var(--serif)}
.page-e4 .hero-subtitle{font-weight:600;letter-spacing:.025em}
.hero-count{display:inline-block;margin-left:18px;padding-left:18px;border-left:1px solid rgba(255,255,255,.42);color:#f0e7d9;font:600 12px/1.4 var(--sans);letter-spacing:.16em}
.reading-progress{position:fixed;z-index:90;top:0;left:0;right:0;height:3px;pointer-events:none}
.reading-progress span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,#79bfc2,#ecc586);box-shadow:0 0 9px #9ad4d4}
.page-e4 .chapter{padding:0;scroll-margin-top:95px}
.page-e4 .chapter-grid{padding-block:clamp(75px,8vw,135px) clamp(85px,10vw,160px)}
.story-frame{position:relative;display:flex;align-items:center;min-height:clamp(470px,55vw,690px);overflow:hidden;isolation:isolate;background:#17354b;color:#fff}
.story-frame img{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.07);transition:transform 1.5s cubic-bezier(.22,.7,.25,1)}
.story-frame.in-view img{transform:scale(1)}
.story-scrim{position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(7,27,44,.94) 0%,rgba(9,35,51,.77) 35%,rgba(12,39,56,.2) 75%),linear-gradient(0deg,rgba(7,30,47,.5),transparent 48%)}
.story-overlay{position:relative;padding-block:110px 95px}
.story-meta{display:flex;align-items:center;gap:17px;color:#d2e4e5;font:700 11px/1.4 var(--sans);letter-spacing:.17em}
.story-meta span:first-child{color:#e8c684;font-size:13px}.story-meta i{width:42px;height:1px;background:#aac9cb}
.page-e4 .story-title{max-width:700px;margin:34px 0 44px;color:#fff;font:600 clamp(37px,5.4vw,68px)/1.47 var(--serif);letter-spacing:.018em;text-wrap:balance;text-shadow:0 3px 25px rgba(2,20,34,.4)}
.story-next{display:inline-flex;align-items:center;gap:14px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.5);color:#f3e8d4;font-size:13px;font-weight:600;letter-spacing:.12em;transition:gap .25s,color .25s}
.story-next:hover{gap:24px;color:#fff}.story-next span{font-size:20px}
.page-e4 .chapter-heading h2{font-family:var(--serif);font-weight:700;letter-spacing:.01em}
.page-e4 .chapter-2 .story-scrim,.page-e4 .chapter-6 .story-scrim{background:linear-gradient(90deg,rgba(7,27,44,.94),rgba(9,35,51,.79) 42%,rgba(12,39,56,.18) 90%),linear-gradient(0deg,rgba(7,30,47,.35),transparent 50%)}
.page-e4 .chapter-4 .story-frame{min-height:610px}.page-e4 .chapter-5 .story-frame{min-height:640px}
.metric-panel .metric{transition:transform .35s,background .35s,box-shadow .35s}.metric-panel .metric:hover{transform:translateY(-5px);background:#e8f4f4;box-shadow:0 12px 25px rgba(39,93,109,.12)}
.hero-data .metric:hover{background:rgba(255,255,255,.07)}
.metric strong[data-count]{font-variant-numeric:tabular-nums}.metric strong[data-count].counted{animation:value-arrive .65s both}
@keyframes value-arrive{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.ability-bars i{height:7px;overflow:hidden;background:#d8e8e9}.ability-bars i::before{content:'';display:block;width:var(--bar);height:100%;background:linear-gradient(90deg,#5aadb6,#88bbb8);border-radius:inherit;transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.8,.25,1)}
.ability-bars.in-view i::before{transform:scaleX(1)}
.year-story{grid-column:1/-1;display:grid;grid-template-columns:auto minmax(30px,1fr) auto;align-items:center;gap:19px;margin:25px 0 0;padding:29px 32px;border:1px solid #d1e6e6;border-radius:19px;background:rgba(255,255,255,.7)}
.year-story span{color:#276e7a;font:700 clamp(28px,4vw,48px)/1.1 var(--serif);font-variant-numeric:tabular-nums}
.year-story .year-line{position:relative;height:2px;background:#c7e0e1}.year-line::before,.year-line::after{content:'';position:absolute;top:50%;width:9px;height:9px;border-radius:50%;background:#5aabb3;transform:translateY(-50%)}.year-line::before{left:0}.year-line::after{right:0}
.year-line i{display:block;width:100%;height:2px;background:#438e99;transform:scaleX(0);transform-origin:left;transition:transform 1.5s ease-out}.year-story.in-view .year-line i{transform:scaleX(1)}
.year-story p{grid-column:1/-1;margin:0!important;color:#537382!important;font-size:13px;letter-spacing:.08em;text-align:center}
.retention-story{grid-column:1/-1;margin:40px 0 0;padding:31px 38px;border-radius:20px;background:#143549;color:#fff}
.retention-caption{display:flex;align-items:baseline;justify-content:space-between;gap:20px}.retention-caption span{font-weight:700}.retention-caption strong{color:#e6c17b;font:700 clamp(25px,3.6vw,42px)/1.2 var(--serif);font-variant-numeric:tabular-nums;white-space:nowrap}.retention-caption i{font-style:normal;color:#a9ced0}
.retention-bars{display:grid;gap:11px;margin-top:26px}.retention-bars>span{display:block;height:11px;border-radius:10px;background:rgba(255,255,255,.12);overflow:hidden}.retention-bars i{display:block;height:100%;border-radius:inherit;transform:scaleX(0);transform-origin:left;transition:transform 1.4s cubic-bezier(.2,.8,.25,1)}.retention-before i{width:29.63%;background:#80acb7}.retention-after i{width:43.48%;background:linear-gradient(90deg,#6cb0b5,#edc785)}.retention-story.in-view i{transform:scaleX(1)}
.page-e4 .chapter-navigation{position:sticky;top:105px;z-index:35;box-shadow:0 7px 23px rgba(13,52,70,.08)}
.page-e4 .chapter-navigation a.is-active{color:#1d7c89;border-bottom:2px solid #5aa7ad}
@media(max-width:820px){.story-frame{min-height:520px}.story-overlay{padding-block:105px 75px}.story-title{max-width:640px}.page-e4 .chapter-grid{padding-block:75px 95px}.page-e4 .chapter-4 .story-frame,.page-e4 .chapter-5 .story-frame{min-height:520px}}
@media(max-width:560px){.story-frame,.page-e4 .chapter-4 .story-frame,.page-e4 .chapter-5 .story-frame{min-height:540px}.story-frame img{object-position:65% center}.story-scrim,.page-e4 .chapter-2 .story-scrim,.page-e4 .chapter-6 .story-scrim{background:linear-gradient(90deg,rgba(7,27,44,.88),rgba(9,35,51,.5)),linear-gradient(0deg,rgba(7,27,44,.7),transparent 65%)}.story-overlay{padding-block:110px 65px}.story-meta{font-size:9px;gap:10px}.story-meta i{width:22px}.story-title{font-size:clamp(34px,9vw,45px);margin:32px 0 40px}.page-e4 .chapter-grid{padding-block:65px 90px}.year-story{gap:10px;padding:23px 16px}.year-story span{font-size:26px}.retention-story{padding:26px 17px}.retention-caption{display:block}.retention-caption strong{display:block;margin-top:8px;font-size:27px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.story-frame img,.ability-bars i::before,.year-line i,.retention-bars i,.metric-panel .metric,.story-next{transition:none!important}.story-frame img{transform:none}.ability-bars i::before,.year-line i,.retention-bars i{transform:none}.metric strong[data-count].counted{animation:none}}

/* The chapter headline lives in the photograph. Prose follows without a second heading. */
:root{--serif:'Noto Serif TC','Microsoft JhengHei','PingFang TC',sans-serif}
.page-e5 .chapter-grid{display:block;width:min(980px,calc(100% - 40px));scroll-margin-top:110px}
.page-e5 .chapter-content{max-width:100%}
.page-e5 .chapter-prose{max-width:820px}
.page-e5 .chapter h2.story-title{max-width:760px;margin:34px 0 44px;color:#fff;font-family:var(--serif);font-weight:700;letter-spacing:.018em}
.page-e5 .chapter-2 .story-title,.page-e5 .chapter-5 .story-title,.page-e5 .chapter-7 .story-title{color:#fff}
.page-e5 .story-frame{scroll-margin-top:0}
.page-e5 .story-next{font-family:var(--sans)}
@media(max-width:560px){.page-e5 .chapter-grid{width:min(100% - 32px,980px)}.page-e5 .chapter h2.story-title{font-size:clamp(32px,8.5vw,43px);line-height:1.5}}

/* E v6: one continuous story, a vertical chapter index and varied evidence. */
.page-e6 .about-hero{min-height:750px}
.page-e6 .hero-inner{padding-block:145px 95px}
.page-e6 .hero-metrics{margin-top:0}
.page-e6 .story-next{position:relative;padding-left:22px;border:0}
.page-e6 .story-next::before{content:'';position:absolute;left:4px;top:4px;bottom:-42px;width:1px;background:linear-gradient(#f5d08c,rgba(245,208,140,.12))}
.page-e6 .story-next::after{content:'';position:absolute;left:0;top:12px;width:9px;height:9px;border-radius:50%;background:#edc781;box-shadow:0 0 0 6px rgba(237,199,129,.16)}

@media(min-width:1360px){
  .page-e6 .chapter-navigation{position:fixed;z-index:42;left:22px;top:50%;width:165px;padding:16px 0;transform:translate(-12px,-50%);opacity:0;pointer-events:none;border:1px solid rgba(179,214,217,.45);border-radius:20px;background:rgba(14,43,61,.9);box-shadow:0 15px 45px rgba(10,32,46,.2);backdrop-filter:blur(15px);transition:opacity .35s,transform .35s}
  .page-e6.rail-visible .chapter-navigation{opacity:1;transform:translate(0,-50%);pointer-events:auto}
  .page-e6 .chapter-navigation .container{position:relative;display:flex;min-height:0;width:auto;flex-direction:column;align-items:stretch;justify-content:start;gap:0;margin:0 16px;padding-left:20px}
  .page-e6 .chapter-navigation .container::before{content:'';position:absolute;left:5px;top:13px;bottom:13px;width:1px;background:rgba(168,207,213,.37)}
  .page-e6 .chapter-navigation .container::after{content:'';position:absolute;left:5px;top:13px;width:2px;height:calc((100% - 26px)*var(--rail-progress,0));background:#e9bc69;transition:height .24s}
  .page-e6 .chapter-navigation a{position:relative;display:block;min-width:0;padding:9px 0;color:#c6dbe0;font-size:12px;line-height:1.35;border:0;transition:color .25s,transform .25s}
  .page-e6 .chapter-navigation a::before{content:'';position:absolute;left:-19px;top:15px;width:8px;height:8px;border:1px solid #83aeb9;border-radius:50%;background:#163a50;transform:translateX(-50%);transition:background .3s,box-shadow .3s}
  .page-e6 .chapter-navigation a.is-active,.page-e6 .chapter-navigation a:hover{color:#f5cf83;transform:translateX(3px);border:0}
  .page-e6 .chapter-navigation a.is-active::before{background:#f1c874;border-color:#f1c874;box-shadow:0 0 0 4px rgba(241,200,116,.18)}
}
@media(max-width:1359px){.page-e6 .chapter-navigation{display:none}}

.page-e6 .editorial-pull{margin:37px 0!important;padding:22px 28px!important;border-left:4px solid #e9be75;background:linear-gradient(110deg,rgba(104,183,184,.12),rgba(187,172,201,.09));border-radius:0 18px 18px 0}
.page-e6 .editorial-pull strong{display:block;max-width:810px;color:inherit;font:700 clamp(21px,2.3vw,29px)/1.65 var(--serif);letter-spacing:.015em;text-wrap:pretty}
.page-e6 .editorial-pull strong:not(:only-child){margin-bottom:9px}
.page-e6 .chapter-2 .editorial-pull,.page-e6 .chapter-5 .editorial-pull,.page-e6 .chapter-7 .editorial-pull{background:linear-gradient(100deg,rgba(116,183,185,.16),rgba(214,183,138,.08))}
.page-e6 .chapter-2 .editorial-pull strong,.page-e6 .chapter-5 .editorial-pull strong{color:#fff}
.page-e6 .chapter-3 .editorial-pull strong,.page-e6 .chapter-6 .editorial-pull strong{color:#173e52}
.page-e6 .closing-principle{margin-top:55px!important;padding:35px 40px!important;border:1px solid rgba(230,194,123,.58)!important;border-left:5px solid #e9be75!important;border-radius:18px;background:linear-gradient(125deg,#204a5a,#263e5a);box-shadow:0 22px 45px rgba(3,21,35,.16)}
.page-e6 .closing-principle p{font-size:clamp(23px,2.5vw,35px)!important;line-height:1.75!important}

/* Each year is a real stop, not a single line between two endpoints. */
.page-e6 .year-story{display:grid;grid-template-columns:minmax(200px,.78fr) minmax(0,1.22fr);gap:clamp(24px,6vw,90px);margin:60px 0 20px;padding:44px 50px;border:1px solid #d2e6e6;background:linear-gradient(130deg,#f9fbfb,#e8f2f1 65%,#f2f0f7);box-shadow:0 26px 60px rgba(37,92,105,.08)}
.page-e6 .year-intro{position:sticky;top:155px;align-self:start}
.page-e6 .year-intro span{display:block;margin-bottom:17px;color:#3d929e;font-size:12px;font-weight:800;letter-spacing:.18em}
.page-e6 .year-intro strong{display:block;color:#15364b;font:700 clamp(26px,3.1vw,39px)/1.5 var(--serif)}
.page-e6 .year-intro p{margin:15px 0 0!important;color:#557480!important;font-size:15px!important;text-align:left!important;letter-spacing:0!important}
.page-e6 .year-list{position:relative;display:block;margin:0;padding:0 0 0 30px;list-style:none}
.page-e6 .year-list::before{content:'';position:absolute;left:6px;top:27px;bottom:27px;width:2px;background:#c3dcde}
.page-e6 .year-list::after{content:'';position:absolute;left:6px;top:27px;width:2px;height:calc((100% - 54px)*var(--year-progress,0));background:linear-gradient(#4ea6af,#e4bd77);transition:height .55s ease-out}
.page-e6 .year-entry{position:relative;display:flex;align-items:center;gap:18px;min-height:82px;border-bottom:1px solid rgba(67,135,145,.15);opacity:.42;transform:translateX(0);transition:opacity .55s,color .55s,transform .55s}
.page-e6 .year-entry:last-child{border:0}
.page-e6 .year-entry .year-marker{position:absolute;left:-30px;top:50%;z-index:1;width:14px;height:14px;border:2px solid #78adb5;border-radius:50%;background:#eff7f7;transform:translateY(-50%);transition:background .55s,box-shadow .55s}
.page-e6 .year-entry strong{font:700 clamp(28px,3.2vw,42px)/1.1 var(--serif);color:#396d7d;font-variant-numeric:tabular-nums;transition:color .55s}
.page-e6 .year-entry .year-note{font-size:13px;color:#5b7885}
.page-e6 .year-entry.reached{opacity:1;transform:translateX(5px)}
.page-e6 .year-entry.reached strong{color:#15495c}
.page-e6 .year-entry.reached .year-marker{background:#e8bd73;border-color:#e8bd73;box-shadow:0 0 0 5px rgba(232,189,115,.18)}
.page-e6 .year-entry.active strong{color:#ad6e31}

/* Origin data reads as a ledger; its type and spacing differ from the hero strip. */
.page-e6 .origin-data{padding:48px 52px;border:0;background:linear-gradient(135deg,#15374b,#263b57 70%,#40415a);color:#fff}
.page-e6 .origin-data h3{color:#e8c684!important;font-family:var(--serif);font-size:28px}
.page-e6 .origin-data .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 45px}
.page-e6 .origin-data .metric{position:relative;min-height:112px;padding:24px 0;border:0;border-bottom:1px solid rgba(255,255,255,.22);border-radius:0;background:transparent;box-shadow:none}
.page-e6 .origin-data .metric:hover{background:transparent;transform:translateX(6px)}
.page-e6 .origin-data .metric strong{color:#f1d18f;font-size:clamp(30px,3.4vw,43px)}
.page-e6 .origin-data .metric span{color:#d4e5e9}
.page-e6 .origin-data .metric:nth-child(4) strong{color:#9de2da}

/* The reading-club story is one framed editorial unit. */
.page-e6 .reading-case{grid-column:1/-1;position:relative;margin-top:45px;padding:clamp(26px,5vw,60px);border:1px solid #c7dfe1;border-left:7px solid #74b5b8;border-radius:25px;background:linear-gradient(140deg,#eff7f5,#f9faf9 70%,#f2f1f7);box-shadow:0 24px 62px rgba(31,78,95,.1);color:#1c3b4e}
.page-e6 .reading-case-label{display:inline-block;margin:0 0 24px!important;padding:8px 14px;border-radius:999px;background:#1a5b66;color:#fff!important;font-size:12px;font-weight:800;letter-spacing:.13em}
.page-e6 .reading-case>p:not(.reading-case-label){max-width:820px;color:#365768!important}
.page-e6 .reading-case>blockquote{max-width:830px}
.page-e6 .reading-case>blockquote p{color:#173d50!important}
.page-e6 .reading-case .observation-heading{color:#1a4e5d}
.page-e6 .chapter-4 .reading-data{margin:45px 0;padding:35px 38px;border:0;border-radius:20px;background:#17384b;box-shadow:0 20px 45px rgba(18,54,74,.15)}
.page-e6 .reading-data h3,.page-e6 .reading-data h4{color:#fff!important}
.page-e6 .reading-data .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 30px}
.page-e6 .reading-data .metric{padding:23px 0;border:0;border-bottom:1px solid rgba(255,255,255,.18);border-radius:0;background:transparent;box-shadow:none}
.page-e6 .reading-data .metric:hover{background:transparent;transform:translateX(4px)}
.page-e6 .reading-data .metric strong{color:#ecc979}
.page-e6 .reading-data .metric span,.page-e6 .reading-data .data-foot{color:#cfe0e6}
.page-e6 .reading-data .ability-bars li{color:#f3f8f9;border-color:rgba(255,255,255,.18)}
.page-e6 .reading-data .ability-bars small{color:#abc5cc}
.page-e6 .reading-data .ability-bars strong{color:#f0ce86}
.page-e6 .reading-data .ability-bars i{background:rgba(255,255,255,.16)}
.page-e6 .reading-data .ability-bars i::before{background:linear-gradient(90deg,#74c3c4,#ecc678)}
.page-e6 .change-narrative{grid-column:1/-1;max-width:820px;margin-top:70px}
.page-e6 .change-narrative p{color:#405d6d}
.page-e6 .retention-story{margin-top:20px}

/* Outcomes use a ring, a connected set, and a seed-instructor statement. */
.page-e6 .change-data{padding:48px 52px;background:#f9fbfb;border:1px solid #d2e5e6}
.page-e6 .change-data h3{font:700 clamp(25px,3vw,34px)/1.35 var(--serif);margin-bottom:28px!important}
.page-e6 .outcome-layout{display:grid;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr);gap:16px}
.page-e6 .outcome-rate,.page-e6 .outcome-cluster,.page-e6 .outcome-seed{border-radius:21px;overflow:hidden}
.page-e6 .outcome-rate{display:grid;place-items:center;padding:28px;background:#173a4b;color:#fff;text-align:center}
.page-e6 .outcome-rate .metric{position:relative;display:grid;place-items:center;align-content:center;width:min(100%,245px);aspect-ratio:1;border:0;border-radius:50%;background:radial-gradient(circle at center,#173a4b 0 54%,transparent 55%),conic-gradient(#e6be75 0 56%,rgba(255,255,255,.15) 56% 100%);box-shadow:none}
.page-e6 .outcome-rate .metric:hover{transform:none}
.page-e6 .outcome-rate .metric strong{color:#fff;font-size:clamp(45px,5vw,64px)}
.page-e6 .outcome-rate .metric span{max-width:165px;color:#d3e4e7;font-size:12px}
.page-e6 .outcome-cluster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;padding:26px 30px;background:#e8f4f2}
.page-e6 .outcome-label{grid-column:1/-1;margin:0!important;color:#237785!important;font-size:12px;font-weight:800;letter-spacing:.12em}
.page-e6 .outcome-cluster .metric{padding:20px 3px;border:0;border-bottom:1px solid #bed6d9;border-radius:0;background:transparent;box-shadow:none}
.page-e6 .outcome-cluster .metric:hover{background:transparent;transform:translateY(-3px)}
.page-e6 .outcome-cluster .metric strong{font-size:clamp(29px,3vw,38px)}
.page-e6 .outcome-seed{grid-column:1/-1;padding:24px 30px;background:linear-gradient(105deg,#e6ebf5,#d9efee)}
.page-e6 .outcome-seed .metric{display:flex;align-items:center;gap:28px;padding:0;border:0;background:transparent;box-shadow:none}
.page-e6 .outcome-seed .metric:hover{transform:none;background:transparent}
.page-e6 .outcome-seed .metric strong{color:#186d7a;font-size:46px}
.page-e6 .outcome-seed .metric span{margin:0;font-size:16px;font-weight:700}

.motion-ready .page-e6 [data-reveal]{opacity:0;transform:translateY(25px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.25,1);transition-delay:var(--delay,0ms)}
.motion-ready .page-e6 [data-reveal].revealed{opacity:1;transform:none}
.motion-ready .page-e6 .story-frame .story-meta,.motion-ready .page-e6 .story-frame .story-title,.motion-ready .page-e6 .story-frame .story-next{opacity:0;transform:translateY(22px);transition:opacity .8s,transform .8s}
.motion-ready .page-e6 .story-frame.in-view .story-meta,.motion-ready .page-e6 .story-frame.in-view .story-title,.motion-ready .page-e6 .story-frame.in-view .story-next{opacity:1;transform:none}
.motion-ready .page-e6 .story-frame.in-view .story-title{transition-delay:.18s}
.motion-ready .page-e6 .story-frame.in-view .story-next{transition-delay:.34s}

@media(max-width:820px){
  .page-e6 .year-story{grid-template-columns:1fr;padding:30px 22px;gap:20px}
  .page-e6 .year-intro{position:static}
  .page-e6 .year-entry{min-height:70px}
  .page-e6 .reading-case,.page-e6 .change-data,.page-e6 .origin-data{padding:28px 22px}
}
@media(max-width:560px){
  .page-e6 .about-hero{min-height:680px}.page-e6 .hero-inner{padding-block:125px 70px}
  .page-e6 .story-next::before{bottom:-20px}
  .page-e6 .editorial-pull{padding:18px!important}.page-e6 .editorial-pull strong{font-size:21px}
  .page-e6 .year-story{margin-top:45px}.page-e6 .year-list{padding-left:28px}.page-e6 .year-entry strong{font-size:29px}
  .page-e6 .origin-data .metric-grid,.page-e6 .reading-data .metric-grid{grid-template-columns:1fr}
  .page-e6 .origin-data .metric{min-height:92px}.page-e6 .chapter-4 .reading-data{padding:27px 18px}
  .page-e6 .reading-case{border-radius:16px}.page-e6 .outcome-layout{grid-template-columns:1fr}
  .page-e6 .outcome-rate{min-height:295px}.page-e6 .outcome-seed{grid-column:auto}
  .page-e6 .outcome-cluster{padding:22px 18px}.page-e6 .outcome-seed .metric{gap:15px}
  .page-e6 .closing-principle{padding:25px 18px!important}
}
@media(prefers-reduced-motion:reduce){
  .page-e6 .year-entry,.page-e6 .year-entry .year-marker,.page-e6 .year-list::after,.page-e6 .chapter-navigation,[data-reveal],.page-e6 .story-frame .story-meta,.page-e6 .story-frame .story-title,.page-e6 .story-frame .story-next{transition:none!important;animation:none!important}
  .page-e6 .year-entry{opacity:1;transform:none}
}

/* E v7: a frameless chapter rail, alternating photo titles, and quieter dates. */
@media(min-width:1360px){
  .page-e7 .chapter-navigation{left:25px;width:162px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none}
  .page-e7 .chapter-navigation .container{margin:0;padding-left:22px}
  .page-e7 .chapter-navigation a{font-size:13px;font-weight:700;color:#e4eef0;text-shadow:0 1px 9px rgba(4,22,35,.65)}
  .page-e7 .chapter-navigation a::before{background:#183d50}
  .page-e7.rail-on-light .chapter-navigation a{color:#254a5a;text-shadow:0 1px 8px rgba(255,255,255,.95)}
  .page-e7.rail-on-light .chapter-navigation a::before{background:#eaf4f4}
  .page-e7 .chapter-navigation a.is-active,.page-e7.rail-on-light .chapter-navigation a.is-active{color:#d9a856;text-shadow:0 1px 9px rgba(15,39,51,.5)}
}

@media(min-width:821px){
  .page-e7 .story-right .story-overlay{display:flex;flex-direction:column;align-items:flex-end;text-align:right}
  .page-e7 .story-right .story-title{max-width:min(54%,690px)}
  .page-e7 .story-right .story-scrim{background:linear-gradient(270deg,rgba(7,27,44,.94),rgba(9,35,51,.76) 38%,rgba(12,39,56,.12) 82%),linear-gradient(0deg,rgba(7,30,47,.4),transparent 55%)}
  .page-e7 .story-right .story-next{padding:8px 22px 8px 0}
  .page-e7 .story-right .story-next::before{left:auto;right:4px}
  .page-e7 .story-right .story-next::after{left:auto;right:0}
  .page-e7 .chapter-4 .story-overlay{padding-top:70px;padding-bottom:195px}
}
@media(max-width:820px){
  .page-e7 .story-right .story-overlay{text-align:right}
  .page-e7 .story-right .story-meta{justify-content:flex-end}
  .page-e7 .story-right .story-title{margin-left:auto}
  .page-e7 .story-right .story-scrim{background:linear-gradient(270deg,rgba(7,27,44,.9),rgba(9,35,51,.54) 68%,rgba(12,39,56,.24)),linear-gradient(0deg,rgba(7,30,47,.65),transparent 65%)}
}

/* The twelve years remain visible in one horizontal sequence. */
.page-e7 .year-story{display:block;margin:55px 0 24px;padding:31px 36px;border-radius:20px;box-shadow:0 14px 35px rgba(37,92,105,.06)}
.page-e7 .year-intro{position:static}
.page-e7 .year-intro span{margin:0 0 5px}
.page-e7 .year-intro strong{font:700 clamp(22px,2.4vw,29px)/1.45 var(--sans)}
.page-e7 .year-intro p{margin:5px 0 28px!important}
.page-e7 .year-list{display:grid;grid-template-columns:repeat(12,minmax(54px,1fr));gap:0;overflow-x:auto;overflow-y:hidden;margin:0;padding:0 0 26px;scrollbar-width:thin}
.page-e7 .year-list::before{left:17px;right:auto;top:7px;bottom:auto;width:calc(max(100%,648px) - 34px);height:2px}
.page-e7 .year-list::after{display:none}
.page-e7 .year-entry{display:flex;flex-direction:column;align-items:center;gap:8px;min-height:63px;padding:0 2px;border:0;opacity:1;transform:none!important;white-space:nowrap}
.page-e7 .year-entry .year-marker{position:relative;left:auto;top:auto;flex:none;width:15px;height:15px;transform:none}
.page-e7 .year-entry strong,.page-e7 .year-entry.reached strong,.page-e7 .year-entry.active strong{font:700 13px/1.4 var(--sans);letter-spacing:0;color:#2a6574}
.page-e7 .year-entry .year-note{position:absolute;top:48px;left:50%;font-size:10px;transform:translateX(-50%)}
.page-e7 .year-entry:first-child .year-note{left:0;transform:none}
.page-e7 .year-entry:last-child .year-note{left:auto;right:0;transform:none}
.page-e7 .year-entry.reached{transform:none}

/* Long quotations stay in the approved sans-serif reading face. */
.page-e7 .chapter blockquote p,.page-e7 .reading-case>blockquote p{font:400 clamp(18px,1.6vw,21px)/1.85 var(--sans);letter-spacing:0}
.page-e7 .chapter blockquote cite{font:500 13px/1.6 var(--sans)}
.page-e7 .chapter-5 .editorial-pull strong{font:700 clamp(20px,2vw,25px)/1.7 var(--sans)}
.page-e7 .closing-principle p{font:500 clamp(21px,2.25vw,28px)/1.7 var(--sans)!important}
.page-e7 .origin-data h3,.page-e7 .change-data h3{font-family:var(--sans)}

.page-e7 .closing-action{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:45px}
.page-e7 .closing-action .emphasis{flex:1;margin:0!important;font:700 clamp(20px,2.25vw,29px)/1.5 var(--sans)}
.page-e7 .closing-action .button{flex:none;margin:0;white-space:nowrap}

@media(max-width:560px){
  .page-e7 .year-story{padding:26px 17px}
  .page-e7 .year-intro p{margin-bottom:21px!important}
  .page-e7 .year-entry strong,.page-e7 .year-entry.reached strong,.page-e7 .year-entry.active strong{font-size:12px}
  .page-e7 .chapter blockquote p{font-size:18px}
  .page-e7 .closing-action{display:block}
  .page-e7 .closing-action .button{margin-top:20px}
}

/* E v8: closing statement as a quiet colour panel with the approved bold Ming face. */
.page-e7 .closing-principle{
  border:0!important;
  border-left:6px solid #e9be75!important;
  border-radius:0 28px 28px 0;
  background:linear-gradient(110deg,#36536a 0%,#444a65 100%);
  box-shadow:none;
}
.page-e7 .closing-principle p{
  font-family:var(--serif)!important;
  font-weight:700!important;
  letter-spacing:.012em;
}

/* E v9: all reading quotations use the full Noto Sans TC bold file. */
.page-e7 .chapter blockquote:not(.closing-principle) p,
.page-e7 .reading-case>blockquote p{
  font-family:var(--sans);
  font-weight:700;
  line-height:1.8;
}

/* E v11: give the closing line of the hero a clear editorial role. */
.page-e7 .hero-caption{
  right:5vw;
  bottom:43px;
  max-width:610px;
  color:#fff;
  font:700 clamp(27px,2.8vw,40px)/1.5 var(--serif);
  letter-spacing:.025em;
  text-align:right;
  text-wrap:balance;
  text-shadow:0 3px 23px rgba(4,20,34,.85);
}
@media(max-width:1199px){
  .page-e7 .hero-caption{right:4vw;bottom:34px;max-width:500px;font-size:clamp(24px,3vw,32px)}
}
@media(max-width:820px){
  .page-e7 .hero-inner{padding-bottom:155px}
  .page-e7 .hero-caption{display:block;left:5vw;right:5vw;bottom:29px;max-width:none;font-size:clamp(23px,4vw,30px);text-align:left}
}
@media(max-width:560px){
  .page-e7 .hero-inner{padding-bottom:137px}
  .page-e7 .hero-caption{bottom:23px;font-size:clamp(21px,5.5vw,26px)}
}

/* E v12: restore the original banner face at twice its former size. */
.page-e7 .hero-caption{
  color:#fff;
  font:400 24px/1.65 var(--sans);
  letter-spacing:.14em;
  text-wrap:normal;
}

/* The founder's positioning statement and final principle use the exact Serif TC font. */
.page-e7 .chapter-5 .editorial-pull strong{
  font-family:var(--serif);
  font-weight:700;
}


/* Two image-first story experiments for the approved About hero. */
.blueprint-filter-defs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.blueprint-full .about-hero,.blueprint-people .about-hero{background:#102f47}
.blueprint-full .about-hero .hero-image,.blueprint-people .about-hero .hero-image{z-index:-4}
.about-hero .hero-sketch-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;z-index:-2;pointer-events:none}
.about-hero .hero-person-matte{position:absolute;inset:0;z-index:-3;pointer-events:none}
.blueprint-full .about-hero .hero-image{opacity:0;animation:blueprint-photo 7.2s ease-in-out both}
.blueprint-full .about-hero .hero-sketch-image{filter:url("#blueprint-lines");clip-path:inset(0 100% 0 0);animation:blueprint-draw 7.2s cubic-bezier(.21,.66,.26,1) both}
.blueprint-full .about-hero::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background-image:linear-gradient(rgba(127,194,209,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(127,194,209,.1) 1px,transparent 1px);background-size:68px 68px;opacity:0;animation:blueprint-grid 7.2s ease-in-out both}
.blueprint-full .about-hero .hero-inner,.blueprint-people .about-hero .hero-inner{animation:blueprint-copy 1.1s .55s ease-out both}
@keyframes blueprint-draw{0%{opacity:0;clip-path:inset(0 100% 0 0)}7%{opacity:1}34%,62%{opacity:1;clip-path:inset(0 0 0 0)}88%,100%{opacity:0;clip-path:inset(0 0 0 0)}}
@keyframes blueprint-photo{0%,39%{opacity:0}88%,100%{opacity:1}}
@keyframes blueprint-grid{0%{opacity:0}22%,56%{opacity:1}100%{opacity:0}}
@keyframes blueprint-copy{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}

/* The original photograph and a same-size sketch stay in exact registration.
   An SVG silhouette limits the sketch and matte to the three colleagues. */
.blueprint-people .about-hero .hero-person-matte,.blueprint-people .about-hero .hero-sketch-image{
  -webkit-mask-image:url("../../about-people-silhouette.svg");
  mask-image:url("../../about-people-silhouette.svg");
  -webkit-mask-size:cover;mask-size:cover;
  -webkit-mask-position:center 48%;mask-position:center 48%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
.blueprint-people .about-hero .hero-person-matte{background:rgba(19,50,70,.95);animation:people-matte 7.4s ease-in-out both}
.blueprint-people .about-hero .hero-sketch-image{filter:url("#paper-pencil");opacity:0;clip-path:inset(100% 0 0 0);animation:people-draw 7.4s cubic-bezier(.25,.68,.25,1) both}
.blueprint-people .about-hero::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(ellipse 37% 72% at 73% 54%,rgba(133,205,206,.16),transparent 72%);opacity:0;animation:people-halo 7.4s ease-in-out both}
@keyframes people-draw{0%{opacity:0;clip-path:inset(100% 0 0 0)}7%{opacity:1}34%,60%{opacity:1;clip-path:inset(0 0 0 0)}91%,100%{opacity:0;clip-path:inset(0 0 0 0)}}
@keyframes people-matte{0%,60%{opacity:1}91%,100%{opacity:0}}
@keyframes people-halo{0%{opacity:0}30%,62%{opacity:1}100%{opacity:0}}

.blueprint-review{position:fixed;z-index:100;right:18px;bottom:18px;display:flex;align-items:center;gap:4px;padding:7px;background:rgba(13,39,55,.93);border:1px solid rgba(255,255,255,.3);border-radius:999px;box-shadow:0 12px 35px rgba(8,28,40,.27);backdrop-filter:blur(14px);color:#fff;font:700 13px/1.3 var(--sans)}
.blueprint-review span{padding:0 10px 0 13px;color:#d5e5e8;white-space:nowrap}
.blueprint-review a,.blueprint-review button{display:block;padding:8px 12px;border:0;border-radius:999px;background:transparent;color:#fff;text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer;font:inherit}
.blueprint-review a:hover,.blueprint-review button:hover,.blueprint-review a:focus-visible,.blueprint-review button:focus-visible,.blueprint-review a[aria-current=page]{background:#e7c88b;color:#16384a}
.blueprint-review a:focus-visible,.blueprint-review button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media(max-width:560px){
  .blueprint-review{left:8px;right:8px;bottom:8px;justify-content:center;gap:0;font-size:11px}
  .blueprint-review span{display:none}
  .blueprint-review a,.blueprint-review button{padding:9px 8px}
  .about-hero .hero-sketch-image{object-position:63% center}
  .blueprint-people .about-hero .hero-person-matte,.blueprint-people .about-hero .hero-sketch-image{-webkit-mask-position:63% center;mask-position:63% center}
}
@media(prefers-reduced-motion:reduce){
  .blueprint-full .about-hero .hero-image,.blueprint-people .about-hero .hero-image{animation:none;opacity:1}
  .blueprint-full .about-hero .hero-sketch-image,.blueprint-people .about-hero .hero-sketch-image,.blueprint-people .about-hero .hero-person-matte,.blueprint-full .about-hero::after,.blueprint-people .about-hero::after{animation:none;opacity:0}
  .blueprint-full .about-hero .hero-inner,.blueprint-people .about-hero .hero-inner{animation:none;opacity:1;transform:none}
}


/* Digital prelude -> traced blueprint -> unchanged real photograph. */
.blueprint-digital .about-hero{background:#0c2c42}
.blueprint-digital .about-hero .hero-image{opacity:0;clip-path:inset(0 0 0 100%);animation:digital-photo 5.4s ease-in-out both}
.blueprint-digital .about-hero .hero-sketch-image{filter:url("#blueprint-lines");clip-path:inset(0 100% 0 0);animation:digital-draw 5.4s cubic-bezier(.22,.65,.2,1) both}
.blueprint-digital .about-hero::after{animation:none;opacity:0}
.blueprint-digital .about-hero .digital-rain{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;mix-blend-mode:screen;opacity:0;animation:digital-rain-entrance .55s ease-out both}
@keyframes digital-rain-entrance{from{opacity:0}to{opacity:1}}
@keyframes digital-draw{
  0%,7%{opacity:0;clip-path:inset(0 100% 0 0)}
  14%{opacity:1;clip-path:inset(0 70% 0 0)}
  34%,45%{opacity:1;clip-path:inset(0 0 0 0)}
  78%,100%{opacity:0;clip-path:inset(0 0 0 0)}
}
@keyframes digital-photo{
  0%,39%{opacity:0;clip-path:inset(0 0 0 100%)}
  40%{opacity:1;clip-path:inset(0 0 0 100%)}
  78%,100%{opacity:1;clip-path:inset(0 0 0 0)}
}
@media(prefers-reduced-motion:reduce){
  .blueprint-digital .about-hero .hero-image{animation:none;opacity:1}
  .blueprint-digital .about-hero .hero-sketch-image,.blueprint-digital .about-hero .digital-rain{animation:none;display:none}
}
