:root{
  --bg:#f1eee6;--paper:#faf8f2;--ink:#111716;--muted:#6a726e;--line:#d5d4cc;
  --deep:#0f342d;--deep2:#1e4b40;--cream:#e8dfd2;--sage:#dce6df;--black:#0b1110;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;line-height:1.5}
img{display:block;width:100%;height:100%;object-fit:cover} a{text-decoration:none;color:inherit} button{font:inherit;color:inherit;cursor:pointer}
header{position:fixed;z-index:50;top:0;left:0;right:0;height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;color:white;background:linear-gradient(rgba(8,20,17,.55),rgba(8,20,17,0));}
.brand{font-weight:850;font-size:13px}.nav{display:flex;gap:24px;font-size:11px}.nav a{opacity:.8}.nav a:hover{opacity:1}
.osbtn{border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.08);border-radius:999px;padding:8px 11px;font-size:10px;font-weight:850}
.hero{min-height:100vh;position:relative;overflow:hidden;color:white;padding:120px 42px 54px;display:grid;grid-template-columns:1.05fr .95fr;align-items:end}
.hero-bg{position:absolute;inset:0}.hero-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,18,15,.88),rgba(6,18,15,.62) 40%,rgba(6,18,15,.16) 72%),linear-gradient(0deg,rgba(6,18,15,.55),transparent 48%)}
.hero-copy{position:relative;z-index:2;max-width:900px}.eyebrow{font-size:9px;letter-spacing:.17em;text-transform:uppercase;font-weight:900;opacity:.72;margin-bottom:16px}
.hero h1{margin:0;font-size:clamp(58px,7.2vw,110px);line-height:.9;letter-spacing:-.055em;font-weight:650}
.hero h1 span{display:block}.hero-intro{font-size:14px;max-width:600px;color:rgba(255,255,255,.77);margin:26px 0 0}
.hero-actions{display:flex;gap:10px;margin-top:24px}.hero-actions a{font-size:10px;font-weight:850;padding:10px 13px;border-radius:999px}.hero-actions .p{background:white;color:#11372f}.hero-actions .s{border:1px solid rgba(255,255,255,.45)}
.hero-collage{position:relative;z-index:2;align-self:center;height:min(70vh,650px);min-height:520px}
.hero-card{position:absolute;overflow:hidden;border-radius:22px;box-shadow:0 28px 80px rgba(0,0,0,.22)}
.hero-card.a{right:0;top:2%;width:68%;height:74%;border:1px solid rgba(255,255,255,.24)}
.hero-card.b{left:3%;bottom:0;width:36%;height:36%;border:6px solid rgba(241,238,230,.95)}
.hero-card.c{left:8%;top:0;width:27%;height:28%;border:1px solid rgba(255,255,255,.3)}
.title-reveal{visibility:hidden;clip-path:inset(0 100% 0 0);opacity:0;filter:blur(7px);transform:translateX(-9px)}
.title-reveal.is-visible{visibility:visible;animation:reveal 3s cubic-bezier(.18,.72,.2,1) .25s both}
@keyframes reveal{0%{clip-path:inset(0 100% 0 0);opacity:0;filter:blur(7px);transform:translateX(-9px)}18%{opacity:.28}72%{filter:blur(1px)}100%{clip-path:inset(0 0 0 0);opacity:1;filter:blur(0);transform:none}}
.section{max-width:1380px;margin:auto;padding:108px 44px}.section-head{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;margin-bottom:42px}
.section-head h2{font-family:Georgia,serif;font-size:clamp(40px,4.5vw,66px);font-weight:500;line-height:1.03;letter-spacing:-.04em;margin:0}.section-head p{color:var(--muted);font-size:13px;max-width:660px}
.photo-wall{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:88px;gap:10px}
.tile{position:relative;overflow:hidden;border-radius:20px;background:#ddd}.tile img{transition:transform .55s ease}.tile:hover img{transform:scale(1.025)}
.tile .cap{position:absolute;left:10px;bottom:10px;background:rgba(250,248,242,.9);backdrop-filter:blur(8px);padding:5px 7px;border-radius:999px;font-size:7px;font-weight:900;letter-spacing:.12em}
.t1{grid-column:span 5;grid-row:span 6}.t2{grid-column:span 7;grid-row:span 4}.t3{grid-column:span 3;grid-row:span 4}.t4{grid-column:span 4;grid-row:span 4}.t5{grid-column:span 5;grid-row:span 5}.t6{grid-column:span 4;grid-row:span 5}.t7{grid-column:span 3;grid-row:span 5}.t8{grid-column:span 7;grid-row:span 4}.t9{grid-column:span 5;grid-row:span 4}.t10{grid-column:span 4;grid-row:span 5}.t11{grid-column:span 4;grid-row:span 5}.t12{grid-column:span 4;grid-row:span 5}
.life-band{max-width:none;background:#10362f;color:white}.life-inner{max-width:1380px;margin:auto;padding:105px 44px}
.life-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:14px}.life-main{height:690px;border-radius:28px;overflow:hidden}.life-side{display:grid;grid-template-rows:1fr 1fr;gap:14px}.life-side figure{margin:0;border-radius:24px;overflow:hidden;min-height:330px}
.life-copy{display:grid;grid-template-columns:.7fr 1.3fr;gap:60px;margin-top:38px}.life-copy h2{font-family:Georgia,serif;font-size:52px;font-weight:500;line-height:1.04;margin:0}.life-copy p{color:#c7d6d0;font-size:14px}
.research-card{display:grid;grid-template-columns:1.1fr .9fr;border:1px solid var(--line);background:var(--paper);border-radius:28px;overflow:hidden}.research-img{min-height:560px;position:relative}.research-copy{padding:48px;display:flex;flex-direction:column;justify-content:center}.research-copy h3{font-family:Georgia,serif;font-size:38px;font-weight:500;line-height:1.08;margin:12px 0}.research-copy p{color:var(--muted);font-size:13px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}.tags span{font-size:8px;padding:6px 8px;border:1px solid var(--line);border-radius:999px}
.notes{max-width:none;background:#e8dfd2}.notes-inner{max-width:1380px;margin:auto;padding:105px 44px}.notes-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:30px}.notes-top h2{font-family:Georgia,serif;font-size:56px;font-weight:500;margin:0}
.note{display:grid;grid-template-columns:90px 1fr 170px 24px;gap:18px;align-items:center;padding:22px 0;border-top:1px solid rgba(30,34,32,.15)}.note:last-child{border-bottom:1px solid rgba(30,34,32,.15)}
.note h3{font-family:Georgia,serif;font-size:20px;font-weight:500;margin:0}.note p{font-size:11px;color:#6b6f6b;margin:4px 0}.note .stage{font-size:8px;font-weight:900;letter-spacing:.1em}.note .meta{font-size:8px;color:#777b76;text-align:right}.note .arrow{font-size:18px}
.projects{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.project{min-height:410px;border-radius:24px;overflow:hidden;position:relative;padding:24px;display:flex;flex-direction:column;justify-content:space-between}.project.dark{background:#10362f;color:white}.project.light{background:#dfe8e2}.project.photo{color:white}
.project .bg{position:absolute;inset:0}.project .bg:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,18,15,.72),rgba(7,18,15,.05))}
.project > *:not(.bg){position:relative;z-index:2}.project h3{font-family:Georgia,serif;font-size:31px;font-weight:500;margin:8px 0}.project p{font-size:12px;max-width:380px;opacity:.78}.project .k{font-size:8px;font-weight:900;letter-spacing:.14em}
.closing{max-width:none;background:#0b1512;color:white}.closing-inner{max-width:1380px;margin:auto;padding:100px 44px;display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:end}.closing h2{font-family:Georgia,serif;font-size:clamp(46px,6vw,82px);font-weight:500;line-height:.97;letter-spacing:-.04em;margin:0}.closing p{font-size:12px;color:#a7b8b1}
footer{max-width:1380px;margin:auto;padding:36px 44px 58px;display:flex;justify-content:space-between;font-size:9px;color:#747d78}
dialog{width:min(1000px,94vw);height:min(700px,88vh);border:0;border-radius:25px;padding:0;overflow:hidden;background:#f5f2e9}dialog::backdrop{background:rgba(5,13,11,.62);backdrop-filter:blur(8px)}
.os{height:100%;display:grid;grid-template-columns:180px 1fr}.os aside{background:#11362e;color:white;padding:20px}.os aside nav{display:grid;gap:5px;margin-top:28px}.os aside button{border:0;background:transparent;color:#b9ccc5;text-align:left;padding:8px}.os main{padding:28px;overflow:auto}.os-top{display:flex;justify-content:space-between}.os-top h3{font-family:Georgia,serif;font-size:32px;margin:5px 0}.close{border:0;background:none;font-size:25px}.os-hero{background:#12382f;color:white;border-radius:20px;padding:22px}.os-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.os-kpis div{background:white;border:1px solid var(--line);border-radius:14px;padding:13px}.os-kpis span{font-size:8px;color:#7c847f}.os-kpis b{display:block;margin-top:5px;font-size:18px}
@media(prefers-reduced-motion:reduce){.title-reveal,.title-reveal.is-visible{visibility:visible;clip-path:none;opacity:1;filter:none;transform:none;animation:none}}
@media(max-width:950px){.hero{grid-template-columns:1fr}.hero-collage{height:600px;margin-top:24px}.section-head,.life-copy,.research-card,.closing-inner{grid-template-columns:1fr}.life-grid{grid-template-columns:1fr}.projects{grid-template-columns:1fr 1fr}.research-img{min-height:420px}}
@media(max-width:700px){header{padding:0 18px}.nav{display:none}.hero,.section,.life-inner,.notes-inner,.closing-inner{padding-left:20px;padding-right:20px}.hero h1{font-size:52px}.hero-collage{height:480px;min-height:0}.photo-wall{grid-template-columns:1fr 1fr;grid-auto-rows:210px}.tile{grid-column:auto!important;grid-row:auto!important}.life-main{height:500px}.life-side{grid-template-columns:1fr 1fr;grid-template-rows:none}.life-side figure{min-height:260px}.notes-top{display:block}.notes-top h2{font-size:44px}.note{grid-template-columns:70px 1fr 20px}.note .meta{display:none}.projects{grid-template-columns:1fr}.os aside{display:none}.os{grid-template-columns:1fr}.os-kpis{grid-template-columns:1fr 1fr}footer{padding-left:20px;padding-right:20px;display:block}}

.hero h1.gothic{font-family:"Old English Text MT","Engravers Old English","Lucida Blackletter",serif;font-weight:700;letter-spacing:-.018em;line-height:.92}

/* PDF note card */
.note.pdf-note{color:inherit;text-decoration:none;transition:padding-left .2s ease,background .2s ease}
.note.pdf-note:hover{padding-left:8px;background:rgba(255,255,255,.18)}
.note.pdf-note .pdf-chip{display:inline-block;margin-left:7px;padding:3px 6px;border:1px solid rgba(20,30,27,.22);border-radius:999px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:7px;font-weight:900;letter-spacing:.12em;vertical-align:middle}

/* ===== Theme system: Day / Night / System ===== */
:root{
  color-scheme: light;
  --site-bg:#f1eee6;
  --site-paper:#faf8f2;
  --site-ink:#111716;
  --site-muted:#66706b;
  --site-line:#d5d4cc;
  --site-deep:#10362f;
  --site-deep-2:#1e4b40;
  --site-soft:#dfe8e2;
  --site-note:#e8dfd2;
  --site-contrast:#ffffff;
}
body[data-theme="night"]{
  color-scheme:dark;
  --site-bg:#0d1110;
  --site-paper:#151b19;
  --site-ink:#eee9df;
  --site-muted:#a8b0aa;
  --site-line:#35403b;
  --site-deep:#071e19;
  --site-deep-2:#10382f;
  --site-soft:#1b2823;
  --site-note:#18211e;
  --site-contrast:#f7f3ea;
}
body[data-theme="system"]{ /* JS resolves system to day/night at runtime */ }
body{
  background:var(--site-bg);
  color:var(--site-ink);
  transition:background .35s ease,color .35s ease;
}
.section{background:var(--site-bg)}
.research-card{background:var(--site-paper);border-color:var(--site-line)}
.section-head p{color:var(--site-muted)}
.life-band{background:var(--site-deep)}
.life-copy p{color:#c7d6d0}
.notes{background:var(--site-note)}
.project.dark{background:var(--site-deep)}
.project.light{background:var(--site-soft);color:var(--site-ink)}
.closing{background:#0b1512;color:#fff}
.notes .note{border-color:rgba(30,34,32,.15)}
.os-hero{background:var(--site-deep-2)}
.theme-switcher{
  display:flex;align-items:center;gap:4px;margin-left:auto;margin-right:12px;
  padding:3px;border:1px solid rgba(255,255,255,.38);border-radius:999px;
  background:rgba(0,0,0,.12);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)
}
.theme-btn{
  border:0;background:transparent;color:inherit;border-radius:999px;
  padding:6px 8px;font-size:9px;font-weight:850;letter-spacing:.05em;opacity:.72
}
.theme-btn:hover,.theme-btn.active{opacity:1;background:rgba(255,255,255,.18)}
body[data-theme="night"] .theme-switcher{border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.04)}
body[data-theme="night"] .project.light{background:#1b2521}
body[data-theme="night"] .notes{color:#eee9df}
body[data-theme="night"] .notes .note p,
body[data-theme="night"] .notes .meta{color:#a8b0aa}
body[data-theme="night"] .notes .pdf-note:hover{background:rgba(255,255,255,.05)}
body[data-theme="night"] .os{background:#111715;color:#eee9df}
body[data-theme="night"] .os aside{background:#0c1210}
body[data-theme="night"] .os-hero{color:#fff}
body[data-theme="night"] .check-card{background:#151b19;border-color:#35403b}
body[data-theme="night"] .check-item{border-color:#35403b}
body[data-theme="night"] .check-input{background:#0d1110;color:#eee9df;border-color:#35403b}

/* ===== Actual Blackletter/Gothic typography ===== */
.hero h1.gothic,
.section-head h2,
.life-copy h2,
.notes-top h2,
.research-copy h3,
.project h3,
.closing h2{
  font-family:"UnifrakturMaguntia","Old English Text MT","Engravers Old English","Lucida Blackletter",serif;
  font-weight:400;
  letter-spacing:.005em;
}
.hero h1.gothic{
  font-size:clamp(58px,7.2vw,110px);
  line-height:.92;
}
.section-head h2{letter-spacing:0;font-weight:400}
.life-copy h2,.notes-top h2,.research-copy h3,.project h3,.closing h2{letter-spacing:0}

/* ===== Checklist ===== */
.checklist-section{max-width:1380px;margin:auto;padding:108px 44px;background:var(--site-bg)}
.checklist-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:32px}
.checklist-head h2{margin:0;font-size:clamp(42px,5vw,72px);line-height:.95}
.checklist-head p{max-width:560px;color:var(--site-muted);font-size:13px;margin:0}
.check-card{border:1px solid var(--site-line);background:var(--site-paper);border-radius:28px;padding:28px}
.check-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.check-filter{
  border:1px solid var(--site-line);background:transparent;border-radius:999px;
  padding:8px 12px;font-size:9px;font-weight:850;letter-spacing:.08em
}
.check-filter.active{background:var(--site-deep);color:#fff;border-color:var(--site-deep)}
.check-add{display:flex;gap:8px;margin-bottom:22px}
.check-input{
  flex:1;min-width:180px;border:1px solid var(--site-line);background:var(--site-bg);
  color:var(--site-ink);border-radius:12px;padding:11px 12px;font-size:12px;outline:none
}
.check-add button{
  border:0;border-radius:12px;background:var(--site-deep);color:#fff;
  padding:0 16px;font-size:10px;font-weight:900
}
.check-list{display:grid;gap:0}
.check-group{margin-top:18px}
.check-group:first-child{margin-top:0}
.check-group-title{
  font-size:9px;letter-spacing:.15em;font-weight:900;color:var(--site-muted);
  padding-bottom:8px
}
.check-item{
  display:grid;grid-template-columns:24px 1fr auto;gap:12px;align-items:center;
  padding:13px 0;border-top:1px solid var(--site-line)
}
.check-item label{font-size:12px}
.check-item.done label{text-decoration:line-through;opacity:.48}
.check-item small{font-size:8px;color:var(--site-muted);letter-spacing:.08em}
.check-box{width:17px;height:17px;accent-color:var(--site-deep);cursor:pointer}
.check-delete{
  border:0;background:transparent;opacity:.4;font-size:14px;padding:4px
}
.check-delete:hover{opacity:1}
.check-empty{color:var(--site-muted);font-size:12px;padding:22px 0}
.check-progress{
  margin-top:20px;padding-top:18px;border-top:1px solid var(--site-line);
  display:flex;justify-content:space-between;font-size:9px;font-weight:850;
  letter-spacing:.1em;color:var(--site-muted)
}

@media(max-width:950px){
  .theme-switcher{margin-right:6px}
  .theme-btn{padding:6px 6px;font-size:8px}
  .checklist-section{padding:78px 20px}
  .checklist-head{display:block}
  .checklist-head p{margin-top:16px}
  .check-card{padding:20px}
}

.now-section{display:grid;grid-template-columns:1fr 1fr;gap:50px}.now-section h2,.portfolio h2,#daily-news h2{font-family:Georgia,"Songti SC","SimSun",serif;font-size:46px;line-height:1.2;margin:12px 0}.live-time{display:block;font:64px Georgia,serif;letter-spacing:2px}.now-section small{color:var(--site-muted)}.now-card,.portfolio-card{background:var(--site-paper);border:1px solid var(--site-line);border-radius:22px;padding:28px}.pill-link{display:inline-block;border-bottom:1px solid currentColor;padding:8px 0}.news-toolbar{display:flex;gap:10px;flex-wrap:wrap}.news-toolbar button{border:1px solid var(--site-line);border-radius:40px;background:var(--site-paper);padding:9px 18px}.news-toolbar button[aria-pressed="true"]{background:#214b3d;color:white}.news-grid,.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.news-item{display:block;padding:24px;border-top:1px solid var(--site-line)}.news-item:hover{background:var(--site-soft)}.news-item small,.portfolio-card small{color:var(--site-muted);font-size:12px}.news-item h3{font-size:17px;line-height:1.7;font-weight:500}.portfolio-card h3{font-size:25px}.portfolio-card span{font-size:13px}.portfolio-grid{grid-template-columns:repeat(2,1fr)}#newsStatus{color:var(--site-muted);font-size:12px}.private-page{padding:45px 5vw;background:var(--site-bg);color:var(--site-ink)}.private-page h1{font:48px Georgia,serif}.learning-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.learning-panel{border:1px solid var(--site-line);border-radius:20px;padding:25px;max-height:780px;overflow:auto;background:var(--site-paper);line-height:1.8}.learning-panel h1{font-size:25px}.learning-panel h2,.learning-panel h3{font-family:inherit}.learning-panel audio{width:100%}.learning-panel details{border-top:1px solid var(--site-line);padding:14px 0}.learning-panel summary{cursor:pointer;color:#526d5d}.draft{width:100%;min-height:200px;font:16px/1.7 Georgia,serif;padding:15px;border:1px solid var(--site-line);border-radius:12px;background:var(--site-paper);color:inherit}.private-links{display:flex;gap:20px;flex-wrap:wrap}.private-notice{padding:15px;background:#e5ecdf;color:#2a4034;border-radius:10px}.learning-links{font-size:14px}@media(max-width:750px){.now-section,.news-grid,.portfolio-grid,.learning-grid{grid-template-columns:1fr}.now-section h2,#daily-news h2,.portfolio h2{font-size:34px}.live-time{font-size:48px}}
.tool-case{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;background:var(--site-deep);color:#fff;border-radius:24px;padding:42px;margin:20px 0 64px}.tool-case h3{font:36px/1.3 Georgia,"SimSun",serif;margin:14px 0}.tool-case p{line-height:1.9;opacity:.85}.tool-case small{letter-spacing:.12em}.tool-tags{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.tool-tags span{border:1px solid #638477;border-radius:30px;padding:6px 12px;font-size:12px}.tool-case summary{cursor:pointer;padding:12px 0}.tool-flow{display:grid;align-content:center;gap:12px}.tool-flow span{display:block;padding:18px;border:1px solid #638477;border-radius:12px}.work-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:48px 0 16px}.work-heading h3{font:30px/1.4 Georgia,"SimSun",serif;margin:12px 0}.work-note{color:var(--site-muted);font-size:13px}.work-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.work-piece{margin:0;border:1px solid var(--site-line);background:var(--site-paper);border-radius:18px;overflow:hidden}.work-piece[hidden]{display:none}.work-piece img{width:100%;height:280px;object-fit:contain;padding:15px;background:#fff}.work-piece figcaption{padding:24px}.work-piece h3{font-size:21px;margin:10px 0}.work-piece p{font-size:13px;color:var(--site-muted)}.work-piece small{font-size:11px;color:var(--site-muted)}.work-link{display:inline-block;font-size:13px;border-bottom:1px solid currentColor;margin-top:12px;padding-bottom:4px}@media(max-width:750px){.tool-case,.work-gallery{grid-template-columns:1fr}.tool-case{padding:24px}.work-heading{align-items:start;flex-direction:column}.work-piece img{height:220px}}
@font-face{font-family:RZSongti;src:local("SimSun"),local("宋体"),local("Songti SC"),local("STSong");font-display:swap;unicode-range:U+2E80-2FFF,U+3000-303F,U+3100-312F,U+31A0-31BF,U+3400-4DBF,U+4E00-9FFF,U+F900-FAFF,U+FE30-FE4F,U+FF00-FFEF,U+20000-2FA1F}
body{font-family:RZSongti,Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",serif}
.hero h1.gothic,.section-head h2,.life-copy h2,.notes-top h2,.research-copy h3,.project h3,.closing h2{font-family:RZSongti,"UnifrakturMaguntia","Old English Text MT","Engravers Old English","Lucida Blackletter",serif}
.now-section h2,.portfolio h2,#daily-news h2,.private-page h1,.tool-case h3,.work-heading h3,.draft{font-family:RZSongti,Georgia,serif}
.section-head:not(:has(>p)),.life-copy:not(:has(>p)){grid-template-columns:1fr;gap:0}
.note h3,.checklist-head h2,.os-top h3{font-family:RZSongti,Georgia,serif}