/* ── Reset & Variables ── */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#000000;
  --surface:#111111;
  --border:rgba(255,255,255,.08);
  --border-hover:rgba(255,255,255,.18);
  --border-subtle:rgba(255,255,255,.04);
  --text:#F5EFD9;
  --text-muted:rgba(245,239,217,.55);
  --text-light:rgba(255,255,255,.3);
  --accent:#F5EFD8;
  --accent-light:rgba(245,239,216,.09);
  --accent-hover:#FFFAEE;
  --lock:#555555;
  --lock-bg:rgba(255,255,255,.04);
  --success:#3ECF8E;
  --red:#E5484D;
  --radius:8px;
  --radius-sm:6px;
  --radius-pill:100px;
  --shadow:0 0 0 1px rgba(255,255,255,.06),0 4px 16px rgba(0,0,0,.4);
  --shadow-md:0 0 0 1px rgba(255,255,255,.06),0 8px 32px rgba(0,0,0,.5);
  --shadow-lg:0 0 0 1px rgba(255,255,255,.06),0 20px 60px rgba(0,0,0,.6);
  --ease:cubic-bezier(0.25,0.46,0.45,0.94);
  --spring:cubic-bezier(0.34,1.56,0.64,1);
}
/* ── Light Theme (class toggle — no file swap, no layout shift) ── */
body.light{
  --bg:#faf8f0;
  --surface:#ffffff;
  --border:#e8ddc8;
  --border-hover:#F5EFD8;
  --border-subtle:#f0ead8;
  --text:#1a1200;
  --text-muted:#6b5e40;
  --text-light:#a89870;
  --lock:#b8a878;
  --lock-bg:#f5f0e0;
  --success:#1E7A3A;
  --red:#C0392B;
  --radius:14px;
  --radius-sm:8px;
  --shadow:0 2px 12px rgba(100,80,0,.06),0 1px 3px rgba(100,80,0,.04);
  --shadow-md:0 8px 32px rgba(100,80,0,.10),0 2px 8px rgba(100,80,0,.05);
  --shadow-lg:0 20px 60px rgba(100,80,0,.14),0 4px 16px rgba(100,80,0,.07);
}
html{scroll-behavior:smooth}
body{font-family:'Noto Serif SC',serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}

/* ── Header ── */
.site-header{
  background:rgba(0,0,0,.92);
  border-bottom:1px solid var(--border);
  padding:0 2rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:60px;
  position:sticky;
  top:0;
  z-index:100;
  transition:background .3s var(--ease);
}
.site-header.scrolled{background:rgba(0,0,0,.92)}
.logo{color:#fff;text-decoration:none;display:flex;align-items:center;gap:.65rem;transition:opacity .2s;flex-shrink:0}
.logo:hover{opacity:.7}
.logo-icon{width:26px;height:26px;flex-shrink:0}
.logo-text{display:flex;flex-direction:column;gap:.05rem}
.logo-name{font-size:1.02rem;font-weight:600;letter-spacing:.04em;line-height:1.2;color:#F5EFD9;font-family:'Noto Serif SC',serif}
.logo-slogan{font-size:.62rem;opacity:.55;letter-spacing:.15em;font-weight:500;color:#F5EFD9;font-family:'Noto Sans SC',sans-serif;text-transform:uppercase}
.search-wrap{flex:1;max-width:420px;margin:0 2rem;position:relative}
.search-wrap input{
  width:100%;
  padding:.5rem 1rem .5rem 2.4rem;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.86rem;
  background:rgba(255,255,255,.04);
  color:var(--text);
  outline:none;
  transition:border-color .2s,background .2s;
}
.search-wrap input::placeholder{color:rgba(255,255,255,.28)}
.search-wrap input:focus{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2)}
.search-icon{position:absolute;left:.8rem;top:50%;transform:translateY(-50%);opacity:.3;font-size:.86rem;color:#fff;pointer-events:none}
.header-right{display:flex;align-items:center;gap:.75rem}
.btn-sub{
  background:var(--accent);
  color:#000;
  border:none;
  padding:.42rem 1.2rem;
  border-radius:var(--radius-sm);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.82rem;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
  transition:all .2s var(--ease);
  letter-spacing:.02em;
}
.btn-sub:hover{background:var(--accent-hover)}
.status-badge{display:none;background:rgba(62,207,142,.15);color:var(--success);border:1px solid rgba(62,207,142,.3);font-size:.72rem;padding:.22rem .65rem;border-radius:var(--radius-sm);font-family:'Noto Sans SC',sans-serif;letter-spacing:.02em}
.status-badge.active{display:block}

/* ── Daily Hero ── */
.daily-hero{
  position:relative;
  width:100%;
  height:52vh;
  min-height:400px;
  max-height:520px;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:#000;
}
.hero-bg{position:absolute;inset:0;background:#000}
.hero-char{
  position:absolute;
  right:8%;
  top:50%;
  transform:translateY(-52%);
  font-family:'Noto Serif SC',serif;
  font-weight:700;
  font-size:clamp(200px,28vw,400px);
  line-height:1;
  color:rgba(255,255,255,.03);
  pointer-events:none;
  user-select:none;
  letter-spacing:-.03em;
  z-index:1;
}
.hero-noise{
  position:absolute;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:1;
}
.hero-portrait{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 35%;
  filter:grayscale(100%) contrast(1.18) brightness(.68);
  -webkit-mask-image:linear-gradient(to right,transparent 0%,transparent 18%,rgba(0,0,0,.08) 30%,rgba(0,0,0,.38) 46%,rgba(0,0,0,.76) 62%,rgba(0,0,0,.94) 74%,black 86%);
  mask-image:linear-gradient(to right,transparent 0%,transparent 18%,rgba(0,0,0,.08) 30%,rgba(0,0,0,.38) 46%,rgba(0,0,0,.76) 62%,rgba(0,0,0,.94) 74%,black 86%);
  opacity:0;
  transition:opacity 1s ease;
  z-index:2;
  pointer-events:none;
  display:block;
}
.hero-portrait.loaded{opacity:1}
.hero-content{
  position:relative;
  z-index:10;
  width:52%;
  max-width:600px;
  padding:0 2rem 0 clamp(2.5rem,6vw,5.5rem);
  animation:heroContentIn 1s .15s var(--ease) both;
}
@keyframes heroContentIn{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}
.hero-meta{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}
.hero-era-pill{
  display:inline-block;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.55);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:.26rem .85rem;
  border-radius:var(--radius-sm);
}
.hero-dates{font-family:'Noto Sans SC',sans-serif;font-size:.75rem;color:rgba(255,255,255,.28);letter-spacing:.04em}
.hero-quote{font-size:clamp(1.3rem,2.4vw,1.85rem);font-weight:400;line-height:1.72;color:rgba(255,255,255,.88);letter-spacing:.04em;margin-bottom:1.4rem;font-family:'Noto Serif SC',serif}
.hero-quote-mark{font-size:3rem;line-height:0;vertical-align:-.28em;color:rgba(255,255,255,.14);font-family:'Noto Serif SC',serif;font-weight:700;margin-right:.06em}
.hero-author{font-family:'Noto Sans SC',sans-serif;font-size:.9rem;font-weight:500;color:rgba(255,255,255,.38);letter-spacing:.08em;margin-bottom:1.8rem}
.hero-cta{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  background:var(--accent);
  color:#000;
  border:none;
  font-family:'Noto Sans SC',sans-serif;
  font-size:.82rem;
  font-weight:600;
  padding:.62rem 1.4rem;
  border-radius:var(--radius-sm);
  text-decoration:none;
  letter-spacing:.04em;
  transition:background .2s var(--ease);
}
.hero-cta:hover{background:var(--accent-hover)}
.hero-scroll{
  position:absolute;
  bottom:1.5rem;
  right:2rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.5rem;
  color:rgba(255,255,255,.2);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.58rem;
  letter-spacing:.14em;
  cursor:pointer;
  text-transform:uppercase;
  z-index:10;
  animation:heroScrollIn 1s .8s both;
}
@keyframes heroScrollIn{from{opacity:0}to{opacity:1}}
.hero-scroll-line{width:1px;height:36px;background:linear-gradient(to bottom,rgba(255,255,255,.25),transparent);animation:scrollPulse 2s ease-in-out infinite}
@keyframes scrollPulse{0%,100%{opacity:.4}50%{opacity:.8}}

/* ── Layout ── */
.layout{display:flex;max-width:1340px;margin:0 auto;padding:2.5rem 1.75rem;gap:2.5rem;align-items:flex-start}

/* ── Sidebar ── */
.sidebar{width:210px;flex-shrink:0;position:sticky;top:76px;max-height:calc(100vh - 92px);overflow-y:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.sidebar::-webkit-scrollbar{display:none}
.sidebar-section{margin-bottom:1.75rem}
.sidebar h3{font-size:.62rem;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:rgba(255,255,255,.25);margin-bottom:.55rem;font-family:'Noto Sans SC',sans-serif}
.thinkers-entry-btn{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:.7rem .9rem;
  border-radius:var(--radius-sm);
  background:var(--surface);
  border:1px solid var(--border);
  color:var(--text);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.86rem;
  font-weight:600;
  text-decoration:none;
  transition:background .15s,border-color .15s;
}
.thinkers-entry-btn:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2)}
body.light .thinkers-entry-btn:hover{background:rgba(26,18,0,.05);border-color:#1a1200}
.thinkers-entry-arrow{opacity:.5;transition:transform .15s}
.thinkers-entry-btn:hover .thinkers-entry-arrow{transform:translateX(3px);opacity:.9}
.cat-list{list-style:none}
.cat-list li{margin-bottom:.04rem}
.cat-list button{
  width:100%;
  text-align:left;
  background:none;
  border:none;
  padding:.44rem .75rem;
  border-radius:var(--radius-sm);
  font-family:'Noto Serif SC',serif;
  font-size:.86rem;
  color:var(--text-muted);
  cursor:pointer;
  transition:color .15s,background .15s;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.cat-list button:hover{color:var(--text);background:rgba(255,255,255,.04)}
.cat-list button.active{color:var(--text);font-weight:600;font-size:.95rem}
.cat-count{font-size:.69rem;opacity:.45}
.sidebar-divider{border:none;border-top:1px solid var(--border);margin:1.1rem 0}
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.stat-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.6rem .75rem;text-align:center}
.stat-num{font-size:1.1rem;font-weight:700;color:var(--text);display:block;line-height:1.2}
.stat-lbl{font-size:.65rem;color:var(--text-light);font-family:'Noto Sans SC',sans-serif;margin-top:.1rem;display:block}

/* ── Main ── */
.main{flex:1;min-width:0}
.main-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:1.75rem;flex-wrap:wrap;gap:.5rem}
.main-header h2{font-size:1.45rem;font-weight:600;letter-spacing:.01em;font-family:'Noto Serif SC',serif}
.main-controls{display:flex;align-items:center;gap:.75rem}
.count{font-size:.82rem;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif}
.sort-select{font-family:'Noto Sans SC',sans-serif;font-size:.79rem;border:1px solid var(--border);border-radius:var(--radius-sm);padding:.3rem .6rem;background:var(--surface);color:var(--text);cursor:pointer}
.sort-select:focus{outline:none;border-color:rgba(255,255,255,.2)}
.filter-btns{display:flex;gap:.35rem}
.filter-btn{
  font-family:'Noto Serif SC',serif;
  font-size:.75rem;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:.26rem .72rem;
  background:transparent;
  color:var(--text-muted);
  cursor:pointer;
  transition:all .15s;
}
.filter-btn:hover{border-color:var(--border-hover);color:var(--text)}
.filter-btn.active{background:var(--accent);border-color:var(--accent);color:#000;font-weight:600}

/* ── Grid ── */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--border)}

@keyframes cardFadeUp{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}
.grid-animated .card{
  animation:cardFadeUp .4s var(--ease) var(--delay,0s) both;
}

/* ── Card ── */
.card{
  background:var(--bg);
  padding:1.5rem;
  cursor:pointer;
  transition:background .15s;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.card:hover{background:var(--surface)}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.7rem}
.cat-badge{
  font-size:.63rem;
  font-family:'Noto Sans SC',sans-serif;
  font-weight:500;
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.45);
  padding:.18rem .5rem;
  border-radius:4px;
  white-space:nowrap;
  border:1px solid rgba(255,255,255,.08);
  letter-spacing:.02em;
}
.lock-icon{font-size:.85rem;color:rgba(255,255,255,.2)}
.card h3{font-size:1.15rem;font-weight:700;margin-bottom:.15rem;letter-spacing:.02em;line-height:1.3;font-family:'Noto Serif SC',serif;color:var(--text)}
.card .card-en{font-size:.73rem;color:var(--text-light);margin-bottom:.6rem;font-style:italic;font-family:'Noto Sans SC',sans-serif;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.card .excerpt{font-size:.83rem;color:var(--text-muted);line-height:1.75;flex:1}
.card.locked .excerpt{filter:blur(4px);user-select:none;pointer-events:none}
.card-thinkers{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.75rem}
.thinker-tag{
  font-size:.65rem;
  font-family:'Noto Sans SC',sans-serif;
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  color:var(--text-muted);
  padding:.14rem .45rem;
  border-radius:4px;
  cursor:pointer;
  transition:all .15s;
  text-decoration:none;
}
.thinker-tag:hover{background:rgba(255,255,255,.08);border-color:var(--border-hover);color:var(--text)}
.lock-overlay{display:none;position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.95) 45%);padding:2.5rem 1.4rem 1rem;text-align:center;pointer-events:none}
.card.locked .lock-overlay{display:block}
.lock-cta{font-size:.72rem;color:rgba(255,255,255,.3);font-weight:500;font-family:'Noto Sans SC',sans-serif}

/* ── Pagination ── */
.pagination{display:flex;justify-content:center;align-items:center;gap:.35rem;margin-top:2rem;padding-top:1.75rem;border-top:1px solid var(--border)}
.page-btn{font-family:'Noto Sans SC',sans-serif;font-size:.8rem;border:1px solid var(--border);border-radius:var(--radius-sm);padding:.32rem .65rem;background:transparent;color:var(--text-muted);cursor:pointer;transition:all .15s;min-width:34px;text-align:center}
.page-btn:hover{border-color:var(--border-hover);color:var(--text)}
.page-btn.active{background:var(--accent);border-color:var(--accent);color:#000;font-weight:600}
.page-btn:disabled{opacity:.25;cursor:not-allowed}
.page-info{font-size:.76rem;color:var(--text-light);font-family:'Noto Sans SC',sans-serif;padding:0 .4rem}

/* ── Detail Modal ── */
.modal-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.7);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  z-index:200;
  padding:2rem 1rem;
  overflow-y:auto;
}
.modal-overlay.open{display:flex;align-items:flex-start;justify-content:center}
@keyframes modalIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.modal{
  background:#111;
  border:1px solid var(--border);
  border-radius:12px;
  max-width:760px;
  width:100%;
  padding:2.5rem;
  position:relative;
  animation:modalIn .3s var(--spring);
  margin:auto;
  box-shadow:0 0 0 1px rgba(255,255,255,.06),0 32px 80px rgba(0,0,0,.8);
}
.modal-close{
  position:absolute;
  top:1.1rem;
  right:1.1rem;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  width:32px;
  height:32px;
  border-radius:var(--radius-sm);
  font-size:.9rem;
  cursor:pointer;
  color:var(--text-muted);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all .15s;
}
.modal-close:hover{background:rgba(255,255,255,.1);color:var(--text)}
.modal-cat{font-size:.65rem;font-family:'Noto Sans SC',sans-serif;font-weight:600;color:var(--text-light);text-transform:uppercase;letter-spacing:.13em;margin-bottom:.45rem}
.modal h2{font-size:1.9rem;font-weight:700;letter-spacing:.03em;margin-bottom:.22rem;line-height:1.2;font-family:'Noto Serif SC',serif;color:var(--text)}
.modal-en{font-size:.84rem;color:var(--text-muted);font-style:italic;margin-bottom:1.4rem;font-family:'Noto Sans SC',sans-serif}
.modal-body{font-size:.91rem;line-height:2;color:var(--text-muted)}
.modal-body p{margin-bottom:1rem}
.modal-body h4{font-size:.9rem;font-weight:700;margin:1.5rem 0 .5rem;color:var(--text)}
.modal-footer{margin-top:1.5rem;padding-top:1.4rem;border-top:1px solid var(--border);display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.modal-thinkers h4{font-size:.65rem;font-family:'Noto Sans SC',sans-serif;font-weight:600;color:var(--text-light);text-transform:uppercase;letter-spacing:.13em;margin-bottom:.4rem}
.modal-thinkers .card-thinkers{margin-top:0}
.related-entries{font-family:'Noto Sans SC',sans-serif}
.related-entries h4{font-size:.65rem;font-weight:600;color:var(--text-light);text-transform:uppercase;letter-spacing:.13em;margin-bottom:.4rem}
.related-links{display:flex;flex-wrap:wrap;gap:.35rem}
.related-link{font-size:.76rem;color:var(--text-muted);border:1px solid var(--border);padding:.2rem .55rem;border-radius:var(--radius-sm);background:transparent;cursor:pointer;transition:all .15s;text-decoration:none}
.related-link:hover{background:rgba(255,255,255,.06);color:var(--text);border-color:var(--border-hover)}

/* ── Paywall Modal ── */
.paywall{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.7);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  z-index:300;
  align-items:center;
  justify-content:center;
  padding:1rem;
}
.paywall.open{display:flex}
.paywall-box{
  background:#111;
  border:1px solid var(--border);
  border-radius:12px;
  max-width:460px;
  width:100%;
  position:relative;
  animation:modalIn .38s var(--spring);
  overflow:hidden;
  box-shadow:0 0 0 1px rgba(255,255,255,.06),0 32px 80px rgba(0,0,0,.8);
}
.paywall-top{
  background:linear-gradient(160deg,#1a1a1a 0%,#0a0a0a 100%);
  border-bottom:1px solid var(--border);
  padding:2rem 2.25rem;
  color:#fff;
  text-align:center;
  position:relative;
}
.paywall-top .pw-icon{font-size:1.8rem;margin-bottom:.55rem}
.paywall-top h3{font-size:1.3rem;font-weight:700;margin-bottom:.3rem;letter-spacing:.02em}
.paywall-top p{font-size:.83rem;opacity:.5;line-height:1.65;font-family:'Noto Sans SC',sans-serif}
.paywall-close{
  position:absolute;
  top:.85rem;
  right:.85rem;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  width:28px;
  height:28px;
  border-radius:var(--radius-sm);
  color:rgba(255,255,255,.5);
  font-size:.85rem;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .15s;
}
.paywall-close:hover{background:rgba(255,255,255,.12)}
.paywall-bottom{padding:1.6rem 2rem 1.8rem}
.plans{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1.3rem}
.plan{
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:1rem;
  cursor:pointer;
  transition:all .2s;
  position:relative;
  text-align:center;
}
.plan:hover{border-color:var(--border-hover)}
.plan.selected{border-color:var(--accent);background:rgba(245,239,216,.05)}
.plan.popular::before{
  content:'推荐';
  position:absolute;
  top:-9px;
  left:50%;
  transform:translateX(-50%);
  background:var(--accent);
  color:#000;
  font-size:.62rem;
  padding:.18rem .6rem;
  border-radius:var(--radius-pill);
  font-family:'Noto Sans SC',sans-serif;
  white-space:nowrap;
  letter-spacing:.04em;
  font-weight:600;
}
.plan-type{font-size:.73rem;font-family:'Noto Sans SC',sans-serif;color:var(--text-muted);margin-bottom:.3rem}
.plan-price{font-size:1.5rem;font-weight:700;color:var(--text);line-height:1}
.plan-price span{font-size:.75rem;font-weight:400;color:var(--text-muted)}
.plan-save{font-size:.66rem;font-family:'Noto Sans SC',sans-serif;color:var(--success);margin-top:.28rem;font-weight:600}
.email-input{
  width:100%;
  padding:.62rem .9rem;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.85rem;
  margin-bottom:.9rem;
  outline:none;
  transition:border-color .15s;
  background:rgba(255,255,255,.04);
  color:var(--text);
}
.email-input::placeholder{color:rgba(255,255,255,.25)}
.email-input:focus{border-color:rgba(255,255,255,.2)}
.email-hint{font-size:.71rem;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif;margin-bottom:1.1rem;margin-top:-.5rem;line-height:1.5}
.perks{list-style:none;margin-bottom:1.3rem}
.perks li{font-size:.8rem;font-family:'Noto Sans SC',sans-serif;color:var(--text-muted);padding:.22rem 0;display:flex;align-items:center;gap:.45rem}
.perks li::before{content:'✓';color:var(--success);font-weight:700;flex-shrink:0}
.btn-subscribe{
  width:100%;
  background:var(--accent);
  color:#000;
  border:none;
  padding:.9rem;
  border-radius:var(--radius-sm);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.92rem;
  font-weight:600;
  cursor:pointer;
  transition:background .2s;
  letter-spacing:.03em;
}
.btn-subscribe:hover{background:var(--accent-hover)}
.btn-subscribe:disabled{opacity:.4;cursor:not-allowed}
.btn-subscribe.loading::after{content:' ···';animation:dots 1s infinite}
@keyframes dots{0%,100%{opacity:1}50%{opacity:.3}}
.paywall-note{text-align:center;font-size:.69rem;color:var(--text-muted);margin-top:.8rem;font-family:'Noto Sans SC',sans-serif;line-height:1.5}
.paywall-note a{color:rgba(255,255,255,.5);text-decoration:underline;text-underline-offset:2px}
.link-btn{background:none;border:none;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif;font-size:.71rem;cursor:pointer;text-decoration:underline;text-underline-offset:2px;padding:0;transition:color .15s}
.link-btn:hover{color:var(--text)}

/* ── Thinker Page — immersive hero with portrait ── */
.thinker-hero{
  position:relative;
  color:#fff;
  padding:0;
  height:68vh;
  min-height:460px;
  max-height:640px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:#000;
}
.thinker-hero-bg{position:absolute;inset:0;transition:background .6s var(--ease)}
.thinker-hero-char{
  position:absolute;
  right:42%;
  bottom:-10%;
  font-family:'Noto Serif SC',serif;
  font-weight:700;
  font-size:clamp(200px,32vw,420px);
  line-height:1;
  color:rgba(255,255,255,.025);
  pointer-events:none;
  user-select:none;
  letter-spacing:-.02em;
}
.thinker-hero-portrait{
  position:absolute;
  right:0;top:0;bottom:0;
  width:56%;
  object-fit:cover;
  object-position:center top;
  filter:grayscale(100%) contrast(1.08) brightness(.82);
  -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 14%,rgba(0,0,0,.65) 32%,rgba(0,0,0,.92) 50%,black 68%);
  mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 14%,rgba(0,0,0,.65) 32%,rgba(0,0,0,.92) 50%,black 68%);
  opacity:0;
  transition:opacity .9s ease;
  z-index:5;
  pointer-events:none;
  display:block;
}
.thinker-hero-portrait.loaded{opacity:1}
.thinker-hero-noise{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");pointer-events:none;opacity:.6;z-index:3}
.thinker-hero-inner{
  position:relative;
  z-index:10;
  max-width:580px;
  padding:4rem 3rem 3.5rem;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  height:100%;
}
.thinker-era-badge{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  padding:.24rem .72rem;
  border-radius:var(--radius-sm);
  font-size:.67rem;
  font-family:'Noto Sans SC',sans-serif;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  margin-bottom:1.2rem;
  width:fit-content;
}
.thinker-hero h1{font-size:clamp(2.4rem,6vw,4.2rem);font-weight:700;line-height:1;letter-spacing:-.01em;margin-bottom:.45rem;font-family:'Noto Serif SC',serif}
.thinker-hero .en-name{font-size:clamp(.78rem,1.5vw,.95rem);opacity:.35;font-family:'Noto Sans SC',sans-serif;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.4rem}
.thinker-hero .dates{font-size:.84rem;opacity:.35;font-family:'Noto Sans SC',sans-serif}
.thinker-tags{display:flex;gap:.38rem;margin-top:1.1rem;flex-wrap:wrap}
.thinker-tag-pill{font-size:.67rem;font-family:'Noto Sans SC',sans-serif;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.5);padding:.22rem .65rem;border-radius:var(--radius-sm)}
.thinker-hero-line{position:absolute;bottom:0;left:0;right:0;height:1px;background:rgba(255,255,255,.06);z-index:10}
.thinker-body{max-width:760px;margin:2rem auto;padding:0 2rem 4rem}
.thinker-section{margin-bottom:2.25rem}
.thinker-section h2{font-size:.95rem;font-weight:600;color:var(--text);margin-bottom:.9rem;padding-bottom:.45rem;border-bottom:1px solid var(--border);font-family:'Noto Sans SC',sans-serif;letter-spacing:.04em}
.thinker-bio{font-size:.9rem;line-height:2;color:var(--text-muted)}
.thinker-bio p{margin-bottom:1.4rem}
.works-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.5rem}
.works-list li{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.6rem .9rem;font-size:.83rem;font-family:'Noto Sans SC',sans-serif;color:var(--text-muted)}
.works-list li::before{content:'📖 ';font-size:.75rem}
.concepts-grid{display:flex;flex-wrap:wrap;gap:.38rem}
.concept-pill{font-size:.82rem;font-family:'Noto Sans SC',sans-serif;background:rgba(255,255,255,.04);color:var(--text-muted);border:1px solid var(--border);padding:.28rem .7rem;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s;text-decoration:none}
.concept-pill:hover{background:rgba(255,255,255,.1);color:var(--text);border-color:var(--border-hover)}
.thinker-influence{font-size:.88rem;line-height:1.85;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif}
.back-btn{display:inline-flex;align-items:center;gap:.4rem;color:var(--text-muted);text-decoration:none;font-size:.83rem;font-family:'Noto Sans SC',sans-serif;margin-bottom:1.5rem;transition:color .15s;border:1px solid var(--border);padding:.32rem .8rem;border-radius:var(--radius-sm)}
.back-btn:hover{border-color:var(--border-hover);color:var(--text)}

/* ── Thinkers List ── */
.thinker-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--border)}
.thinker-card{
  background:var(--bg);
  overflow:hidden;
  cursor:pointer;
  transition:background .15s;
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:inherit;
}
.thinker-card:hover{background:var(--surface)}
.thinker-card-portrait{
  width:100%;
  height:210px;
  overflow:hidden;
  background:#0a0a0a;
  position:relative;
}
.thinker-card-portrait img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 18%;
  filter:grayscale(100%) contrast(1.06) brightness(.75);
  transition:transform .5s var(--ease);
}
.thinker-card:hover .thinker-card-portrait img{transform:scale(1.03)}
.thinker-card-portrait-placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Noto Serif SC',serif;
  font-size:3.5rem;
  font-weight:700;
  color:rgba(255,255,255,.08);
}
.thinker-card-body{padding:.9rem 1rem 1rem;flex:1}
.thinker-card h4{font-size:.9rem;font-weight:700;margin-bottom:.08rem;font-family:'Noto Serif SC',serif;color:var(--text)}
.thinker-card .t-dates{font-size:.68rem;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif}
.thinker-card .t-nat{font-size:.68rem;color:var(--text-light);font-family:'Noto Sans SC',sans-serif}
.thinker-ava{width:40px;height:40px;border-radius:var(--radius-sm);background:rgba(255,255,255,.06);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}

/* ── Success Page ── */
.success-page{max-width:520px;margin:4rem auto;padding:2rem;text-align:center}
.success-icon{font-size:2.5rem;margin-bottom:1rem}
.success-page h1{font-size:1.6rem;font-weight:700;margin-bottom:.5rem;color:var(--text);font-family:'Noto Serif SC',serif}
.success-page p{font-size:.9rem;color:var(--text-muted);line-height:1.75;font-family:'Noto Sans SC',sans-serif;margin-bottom:.5rem}
.success-actions{display:flex;gap:.6rem;justify-content:center;margin-top:1.75rem;flex-wrap:wrap}
.btn-primary{
  background:var(--accent);
  color:#000;
  border:none;
  padding:.7rem 1.5rem;
  border-radius:var(--radius-sm);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.88rem;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  transition:background .2s;
  display:inline-block;
}
.btn-primary:hover{background:var(--accent-hover)}
.btn-outline{
  background:transparent;
  color:var(--text);
  border:1px solid var(--border);
  padding:.68rem 1.35rem;
  border-radius:var(--radius-sm);
  font-family:'Noto Sans SC',sans-serif;
  font-size:.88rem;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  transition:all .15s;
  display:inline-block;
}
.btn-outline:hover{border-color:var(--border-hover);background:rgba(255,255,255,.06)}

/* ── Empty / Loading ── */
.empty{text-align:center;padding:4rem 2rem;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif}
.empty-icon{font-size:1.8rem;margin-bottom:.7rem;opacity:.35}
.loading{text-align:center;padding:3rem;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif}

/* ── Toast ── */
.toast{
  position:fixed;
  bottom:1.75rem;
  left:50%;
  transform:translateX(-50%) translateY(12px);
  background:rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
  border:1px solid var(--border);
  color:var(--text);
  padding:.6rem 1.25rem;
  border-radius:var(--radius-sm);
  font-size:.82rem;
  font-family:'Noto Sans SC',sans-serif;
  opacity:0;
  transition:all .3s var(--ease);
  z-index:600;
  pointer-events:none;
  white-space:nowrap;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── Perspective Blocks ── */
.perspectives-section{margin-top:1.6rem}
.perspectives-section>h4{font-size:.63rem;font-weight:600;color:var(--text-light);text-transform:uppercase;letter-spacing:.15em;font-family:'Noto Sans SC',sans-serif;margin-bottom:1rem;padding-bottom:.45rem;border-bottom:1px solid var(--border)}
.perspective-block{margin-bottom:1rem;padding:1rem 1.2rem;background:rgba(255,255,255,.03);border-radius:var(--radius-sm);border-left:2px solid rgba(255,255,255,.1)}
.perspective-block:last-child{margin-bottom:0}
.perspective-header{display:flex;align-items:baseline;gap:.65rem;margin-bottom:.45rem;flex-wrap:wrap}
.perspective-name{font-size:.92rem;font-weight:700;color:var(--text)}
.perspective-meta{font-size:.7rem;color:var(--text-muted);font-family:'Noto Sans SC',sans-serif}
.perspective-text{font-size:.88rem;line-height:1.9;color:var(--text-muted)}
.perspective-source{margin-top:.55rem;font-size:.77rem;color:var(--text-light);font-family:'Noto Sans SC',sans-serif;padding-left:.9rem;border-left:1px solid var(--border);font-style:italic}

/* ── Philosopher Search Result Cards ── */
.ph-search-results{margin-bottom:1.5rem}
.ph-search-label{
  font-size:.62rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--text-light);
  font-family:'Noto Sans SC',sans-serif;
  margin-bottom:.65rem;
}
.ph-cards{display:flex;flex-direction:column;gap:1px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--border)}
.ph-card{
  display:grid;
  grid-template-columns:1fr 180px;
  background:#000;
  text-decoration:none;
  color:#fff;
  position:relative;
  min-height:136px;
  cursor:pointer;
  transition:background .15s;
}
.ph-card:hover{background:#0e0e0e}
.ph-card-body{
  padding:1.15rem 1.35rem;
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.ph-card-bg-char{
  position:absolute;
  left:40%;
  top:50%;
  transform:translate(-50%,-52%);
  font-family:'Noto Serif SC',serif;
  font-weight:700;
  font-size:5.5rem;
  line-height:1;
  color:rgba(255,255,255,.025);
  pointer-events:none;
  user-select:none;
  z-index:1;
}
.ph-card-era{font-size:.58rem;font-family:'Noto Sans SC',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.28);margin-bottom:.24rem;display:block}
.ph-card-name{font-size:1.5rem;font-weight:700;line-height:1.05;letter-spacing:.02em;margin-bottom:.16rem;font-family:'Noto Serif SC',serif}
.ph-card-en{font-size:.7rem;color:rgba(255,255,255,.22);font-family:'Noto Sans SC',sans-serif;letter-spacing:.08em;margin-bottom:.45rem;display:block;font-style:italic}
.ph-card-dates{font-size:.67rem;color:rgba(255,255,255,.22);font-family:'Noto Sans SC',sans-serif;margin-bottom:.5rem}
.ph-card-tags{display:flex;gap:.24rem;flex-wrap:wrap}
.ph-card-tag{font-size:.58rem;font-family:'Noto Sans SC',sans-serif;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.35);padding:.12rem .45rem;border-radius:4px}
.ph-card-arrow{position:absolute;right:193px;bottom:.9rem;color:rgba(255,255,255,.14);font-size:.72rem;transition:color .2s,transform .2s;z-index:2;font-family:'Noto Sans SC',sans-serif}
.ph-card:hover .ph-card-arrow{color:rgba(255,255,255,.45);transform:translateX(4px)}
.ph-card-portrait{position:relative;overflow:hidden;background:#0a0a0a}
.ph-card-portrait img{width:100%;height:100%;object-fit:cover;object-position:center top;filter:grayscale(100%) contrast(1.06) brightness(.8);opacity:0;transition:opacity .7s ease;display:block}
.ph-card-portrait img.loaded{opacity:1}
.ph-card-portrait-fade{position:absolute;inset:0;background:linear-gradient(to right,#000 0%,rgba(0,0,0,.4) 55%,transparent 100%);z-index:1}

/* ── Header Controls ── */
.theme-toggle,.lang-toggle{
  background:rgba(245,239,216,.08);
  border:1px solid rgba(245,239,216,.22);
  color:var(--accent);
  font-size:.75rem;
  padding:.34rem .8rem;
  border-radius:var(--radius-pill);
  cursor:pointer;
  font-family:'Noto Sans SC',sans-serif;
  transition:background .2s;
  white-space:nowrap;
  letter-spacing:.04em;
}
.theme-toggle:hover,.lang-toggle:hover{background:rgba(245,239,216,.16)}

/* ── Info Popup (Works & Concepts) ── */
.info-popup-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  z-index:500;
  padding:2rem 1rem;
  align-items:center;
  justify-content:center;
}
.info-popup-overlay.open{display:flex}
@keyframes popupIn{from{opacity:0;transform:scale(.96) translateY(12px)}to{opacity:1;transform:none}}
.info-popup{
  background:#0e0e0e;
  border:1px solid rgba(245,239,216,.2);
  border-radius:10px;
  max-width:540px;
  width:100%;
  padding:2rem 2.25rem 1.75rem;
  position:relative;
  animation:popupIn .25s var(--spring);
  box-shadow:0 0 0 1px rgba(245,239,216,.08),0 24px 64px rgba(0,0,0,.75);
}
.info-popup-type{
  font-size:.58rem;
  font-family:'Noto Sans SC',sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
  opacity:.75;
  margin-bottom:.55rem;
}
.info-popup-title{
  font-size:1.35rem;
  font-weight:700;
  font-family:'Noto Serif SC',serif;
  color:var(--text);
  margin-bottom:.18rem;
  line-height:1.35;
}
.info-popup-sub{
  font-size:.76rem;
  color:var(--text-muted);
  font-style:italic;
  font-family:'Noto Sans SC',sans-serif;
  margin-bottom:1.1rem;
}
.info-popup-desc{
  font-size:.88rem;
  line-height:1.95;
  color:var(--text-muted);
  font-family:'Noto Sans SC',sans-serif;
}
.info-popup-close{
  position:absolute;
  top:.9rem;
  right:.9rem;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  width:28px;
  height:28px;
  border-radius:6px;
  color:var(--text-muted);
  font-size:.85rem;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .15s;
}
.info-popup-close:hover{background:rgba(255,255,255,.1);color:var(--text)}
.info-popup-footer{
  margin-top:1.2rem;
  padding-top:1rem;
  border-top:1px solid var(--border);
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}
.info-popup-link{
  font-size:.76rem;
  color:var(--accent);
  font-family:'Noto Sans SC',sans-serif;
  text-decoration:none;
  border:1px solid rgba(245,239,216,.3);
  padding:.28rem .75rem;
  border-radius:6px;
  transition:all .15s;
  cursor:pointer;
  background:none;
  display:inline-flex;
  align-items:center;
  gap:.3rem;
}
.info-popup-link:hover{background:rgba(245,239,216,.1)}
.works-list li{cursor:pointer;transition:background .15s,border-color .15s}
.works-list li:hover{background:rgba(245,239,216,.06)!important;border-color:rgba(245,239,216,.25)!important;color:var(--text)!important}
.concept-pill{cursor:pointer}

/* ── Light Theme Hardcoded Color Overrides ── */
body.light .site-header{background:#0a0800;border-color:rgba(245,239,216,.12)}
body.light .site-header.scrolled{background:rgba(8,6,0,.98)}
body.light .logo-name{color:#F5EFD8}
body.light .logo-slogan{color:rgba(245,239,216,.7)}
body.light .search-wrap input{background:rgba(245,239,216,.06);border-color:rgba(245,239,216,.2);color:#fff;border-radius:var(--radius-pill)}
body.light .search-wrap input::placeholder{color:rgba(245,239,216,.35)}
body.light .search-wrap input:focus{background:rgba(245,239,216,.1);border-color:rgba(245,239,216,.4)}
body.light .search-icon{color:#F5EFD8}
body.light .daily-hero{background:#080600}
body.light .hero-bg{background:#080600}
body.light .hero-char{color:rgba(245,239,216,.04)}
body.light .hero-era-pill{background:rgba(245,239,216,.12);border-color:rgba(245,239,216,.25);color:rgba(245,239,216,.85)}
body.light .hero-quote-mark{color:rgba(245,239,216,.25)}
body.light .hero-author{color:rgba(245,239,216,.55)}
body.light .hero-scroll{color:rgba(245,239,216,.35)}
body.light .hero-scroll-line{background:linear-gradient(to bottom,rgba(245,239,216,.4),transparent)}
body.light .card{background:var(--surface)}
body.light .card:hover{background:var(--bg)}
body.light .cat-badge{background:rgba(0,0,0,.05);color:#444;border-color:rgba(0,0,0,.1)}
body.light .lock-icon{color:#b8a878}
body.light .lock-overlay{background:linear-gradient(transparent,rgba(250,248,240,.96) 50%)}
body.light .lock-cta{color:var(--text-muted);font-weight:600}
body.light .thinker-tag{background:var(--bg)}
body.light .thinker-tag:hover{background:rgba(26,18,0,.06);border-color:#1a1200}
body.light .cat-list button:hover{background:rgba(26,18,0,.05)}
body.light .cat-list button.active{background:rgba(26,18,0,.07)}
body.light .filter-btn{background:var(--surface)}
body.light .filter-btn:hover{border-color:#1a1200}
body.light .filter-btn.active{background:#0a0800;border-color:#0a0800;color:#F5EFD8}
body.light .page-btn{background:var(--surface)}
body.light .page-btn:hover{border-color:#1a1200}
body.light .page-btn.active{background:#0a0800;border-color:#0a0800;color:#F5EFD8}
body.light .modal-cat{color:#7A6220}
body.light .modal-body{color:#2A2A00}
body.light .related-link:hover{background:#0a0800;color:#F5EFD8;border-color:#0a0800}
body.light .thinker-tag-pill{background:rgba(26,18,0,.06);border-color:rgba(26,18,0,.12);color:rgba(26,18,0,.5)}
body.light .ph-card-portrait{background:#f5f0e8}
body.light .ph-card-portrait-fade{background:linear-gradient(to right,#faf8f0 0%,rgba(250,248,240,.4) 55%,transparent 100%)}
body.light .paywall-top{background:linear-gradient(160deg,#0a0800 0%,#050400 100%)}
body.light .thinker-card-portrait{background:#e8e0d0}
body.light .thinker-card-portrait img{filter:grayscale(80%) contrast(1) brightness(.92)}
body.light .thinker-card-portrait-placeholder{color:rgba(26,18,0,.15)}

/* ── Responsive ── */
@media(max-width:900px){
  .sidebar{display:none}
  .layout{padding:1.25rem 1rem}
}
@media(max-width:600px){
  .grid{grid-template-columns:1fr}
  .plans{grid-template-columns:1fr}
  .site-header{padding:0 1rem}
  .logo-slogan{display:none}
  .search-wrap{margin:0 .65rem}
  .daily-hero{height:54vh;min-height:360px}
  .ph-card{grid-template-columns:1fr 110px}
  .ph-card-name{font-size:1.25rem}
  .ph-card-arrow{right:123px}
  .hero-content{padding:0 1.25rem}
  .hero-quote{font-size:1.1rem}
  .thinker-hero{height:60vh;min-height:380px}
  .thinker-hero-inner{padding:2.25rem 1.5rem 2rem}
  .thinker-hero h1{font-size:2.3rem}
  .paywall-bottom{padding:1.4rem 1.4rem 1.6rem}
  .paywall-top{padding:1.6rem 1.4rem}
  .modal{padding:1.75rem 1.1rem}
}