:root{
  --folio-accent:#6a8fc4;
  --folio-accent-deep:#3d5f94;
  --folio-bg:#f5f8fc;
  --folio-paper:#feffff;
  --folio-ink:#1a2230;
  --folio-muted:#6b6560;
  --folio-line:#e8e4dc;
  --folio-toc-w:220px;
  --folio-read-max:680px;
  --folio-masthead-h:42px;
  --folio-font:Georgia,"Noto Serif SC","Source Han Serif SC",serif;
  --folio-sans:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body[data-template="folio"]{
  margin:0;
  font-family:var(--folio-font);
  font-size:1.05rem;
  line-height:1.75;
  color:var(--folio-ink);
  background:var(--folio-bg);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--folio-accent-deep);text-decoration:none}
a:hover{text-decoration:underline}

.menu-toggle{
  display:none;
  position:fixed;
  top:10px;
  left:10px;
  z-index:120;
  width:44px;
  height:44px;
  padding:10px;
  border:1px solid var(--folio-line);
  border-radius:8px;
  background:var(--folio-paper);
  cursor:pointer;
  flex-direction:column;
  justify-content:center;
  gap:5px;
}
.menu-toggle span{display:block;height:2px;background:var(--folio-ink);border-radius:1px}
.folio-overlay{display:none;position:fixed;inset:0;background:rgba(20,16,12,.35);z-index:90}

.folio-app{min-height:100vh;display:flex;flex-direction:column}

.folio-masthead{
  position:sticky;
  top:0;
  z-index:80;
  height:var(--folio-masthead-h);
  border-bottom:1px solid var(--folio-line);
  background:var(--folio-paper);
  box-shadow:0 1px 0 rgba(0,0,0,.04);
}
.folio-masthead-inner{
  max-width:calc(var(--folio-toc-w) + var(--folio-read-max) + 8rem);
  margin:0 auto;
  padding:0 1.25rem;
  height:100%;
  display:flex;
  align-items:center;
  gap:.55rem;
  font-family:var(--folio-sans);
  font-size:.82rem;
  color:var(--folio-muted);
}
.folio-masthead-inner img{border-radius:6px}
.folio-domain{color:var(--folio-ink);font-weight:600;letter-spacing:.02em}
.folio-sep{opacity:.45}
.folio-crumb{color:var(--folio-muted)}

.folio-layout{
  flex:1;
  display:flex;
  max-width:calc(var(--folio-toc-w) + var(--folio-read-max) + 8rem);
  margin:0 auto;
  width:100%;
  padding:0 1.25rem 2rem;
  gap:2.5rem;
  align-items:flex-start;
}

.folio-toc{
  position:sticky;
  top:calc(var(--folio-masthead-h) + 1rem);
  width:var(--folio-toc-w);
  flex-shrink:0;
  padding:1rem 0 1rem .25rem;
  border-right:1px solid var(--folio-line);
  font-family:var(--folio-sans);
  font-size:.84rem;
  max-height:calc(100vh - var(--folio-masthead-h) - 2rem);
  overflow-y:auto;
}
.folio-toc-brand{
  padding:0 .75rem 1rem;
  border-bottom:1px solid var(--folio-line);
  margin-bottom:.75rem;
}
.folio-toc-brand b{display:block;font-size:.95rem;color:var(--folio-ink);margin-bottom:.2rem}
.folio-toc-brand span{display:block;font-size:.75rem;color:var(--folio-muted);line-height:1.4}
.folio-toc-nav{display:flex;flex-direction:column;gap:.15rem;padding:0 .5rem}
.folio-toc-nav a{
  display:block;
  padding:.35rem .5rem;
  border-radius:4px;
  color:var(--folio-muted);
  text-decoration:none;
  line-height:1.35;
  transition:color .15s,background .15s;
}
.folio-toc-nav a:hover,.folio-toc-nav a.active{
  color:var(--folio-accent-deep);
  background:rgba(0,0,0,.03);
  text-decoration:none;
}
.folio-toc-divider{
  margin:.85rem .5rem .35rem;
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--folio-muted);
  opacity:.8;
}
.folio-toc-anchor{font-size:.8rem;padding-left:.85rem!important;opacity:.9}
.folio-toc-foot{
  margin-top:1.25rem;
  padding:.75rem .5rem 0;
  font-size:.7rem;
  color:var(--folio-muted);
  line-height:1.45;
  opacity:.75;
}

.folio-reader{flex:1;min-width:0;padding-top:1.25rem}
.folio-reader-inner{max-width:var(--folio-read-max);margin:0 auto}

.folio-ads{margin-bottom:1.5rem;font-family:var(--folio-sans)}
.ads-wrap{margin:0;padding:.75rem 1rem 1rem;border:1px solid var(--folio-line);border-radius:8px;background:var(--folio-paper)}
.ads-head{margin:0}
.applist-title{text-align:center;color:var(--folio-muted);font-size:.88rem;margin:0 0 .55rem;font-family:var(--folio-sans)}
#applist{width:100%}
#ads{display:flex!important;justify-content:center;align-items:flex-start;flex-wrap:wrap;gap:12px;margin:0;padding:0;background:transparent}
#ads>div{display:flex!important;flex-direction:column;align-items:center;width:72px!important;min-width:72px;flex:0 0 72px}
#ads figure{margin:0;width:72px;display:flex;flex-direction:column;align-items:center}
#ads a{display:block;width:65px;height:65px;border-radius:12px;overflow:hidden}
#ads img{width:65px!important;height:65px!important;object-fit:cover!important;border-radius:12px;display:block!important;border:0}
#ads figcaption,#ads .caption{display:block;width:72px;margin-top:6px;font-size:11px!important;line-height:1.2;color:var(--folio-muted);text-align:center;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;font-family:var(--folio-sans)}

.folio-lead{padding:0 0 2rem;text-align:left}
.folio-lead-card{background:transparent;padding:0}
.folio-lead .badge{
  display:inline-block;
  font-family:var(--folio-sans);
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--folio-accent-deep);
  border:1px solid var(--folio-line);
  padding:.2rem .55rem;
  border-radius:3px;
  margin-bottom:1rem;
}
.folio-lead h1{
  font-size:clamp(1.65rem,4vw,2.15rem);
  font-weight:600;
  line-height:1.25;
  margin:0 0 1rem;
  letter-spacing:-.01em;
}
.folio-lead .lead{font-size:1.08rem;color:var(--folio-muted);margin:0 0 1.25rem;max-width:42em}
.folio-lead .cta-row{display:flex;flex-wrap:wrap;gap:.65rem;margin-bottom:1.75rem;font-family:var(--folio-sans)}
.folio-lead .cta,.folio-btn{
  display:inline-block;
  padding:.55rem 1.1rem;
  border-radius:4px;
  font-size:.88rem;
  font-family:var(--folio-sans);
  text-decoration:none;
  border:1px solid var(--folio-line);
}
.folio-lead .cta-primary,.folio-btn{background:var(--folio-accent-deep);color:#fff!important;border-color:var(--folio-accent-deep)}
.folio-lead .cta-primary:hover,.folio-btn:hover{opacity:.92;text-decoration:none}
.folio-lead .cta-ghost{background:transparent;color:var(--folio-ink)!important}
.folio-lead .hero-visual{margin-top:1.5rem;border-radius:6px;overflow:hidden;border:1px solid var(--folio-line)}
.folio-lead .hero-visual img{width:100%;max-height:380px;object-fit:cover}

.folio-chapter{
  padding:2rem 0;
  border-top:1px solid var(--folio-line);
}
.folio-chapter--band{background:rgba(0,0,0,.02);margin:0 -1rem;padding:2rem 1rem;border-radius:6px;border-top:1px solid var(--folio-line)}
.folio-prose h2{
  font-size:1.35rem;
  font-weight:600;
  margin:0 0 1rem;
  color:var(--folio-ink);
  scroll-margin-top:calc(var(--folio-masthead-h) + 1rem);
}
.folio-prose h3{font-size:1.1rem;margin:1.5rem 0 .65rem;font-weight:600}
.folio-prose p{margin:0 0 1rem;text-align:justify;hyphens:auto}
.folio-prose .muted,.folio-prose p[style*="muted"]{color:var(--folio-muted);font-size:.92rem}

.feature-grid,.pillar-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin:1.25rem 0;font-family:var(--folio-sans);font-size:.92rem}
.feature-card,.pillar{padding:1rem;border:1px solid var(--folio-line);border-radius:6px;background:var(--folio-paper)}
.feature-card h3,.pillar h3{margin:0 0 .35rem;font-size:.95rem}
.feature-card .tag{font-size:.72rem;color:var(--folio-accent-deep);margin:0 0 .35rem}

.media-grid,.media-duo,.gallery,.price-grid,.price-strip{display:grid;gap:1rem;margin:1.25rem 0}
.media-grid,.media-duo{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.gallery{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.price-grid,.price-strip{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
figure{margin:0}
figcaption{font-family:var(--folio-sans);font-size:.78rem;color:var(--folio-muted);margin-top:.4rem;line-height:1.4;text-align:center}
.shot-row figure img{width:100%;border-radius:4px;border:1px solid var(--folio-line)}

.compare-table{width:100%;border-collapse:collapse;margin:1.25rem 0;font-family:var(--folio-sans);font-size:.88rem}
.compare-table th,.compare-table td{border:1px solid var(--folio-line);padding:.55rem .65rem;text-align:left}
.compare-table th{background:rgba(0,0,0,.03);font-weight:600}

.outlinks{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0;font-family:var(--folio-sans);font-size:.88rem}
.outlinks a{padding:.35rem .7rem;border:1px solid var(--folio-line);border-radius:4px;background:var(--folio-paper);text-decoration:none}
.outlinks a:hover{border-color:var(--folio-accent);color:var(--folio-accent-deep)}

.faq{font-family:var(--folio-sans);font-size:.95rem}
.faq details{border:1px solid var(--folio-line);border-radius:4px;margin-bottom:.5rem;background:var(--folio-paper)}
.faq summary{padding:.65rem .85rem;cursor:pointer;font-weight:500;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq details[open] summary{border-bottom:1px solid var(--folio-line)}
.faq details p{margin:0;padding:.65rem .85rem .85rem;color:var(--folio-muted);font-size:.92rem}

.folio-page-head{margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--folio-line)}
.folio-page-head h1{font-size:1.65rem;margin:0 0 .5rem;font-weight:600}
.folio-page-head p{margin:0;color:var(--folio-muted);font-size:1rem}
.folio-page-body h2{font-size:1.15rem;margin:1.5rem 0 .65rem;font-weight:600}
.folio-page-body p{margin:0 0 1rem}

.folio-error{text-align:center;padding:2.5rem 1rem;font-family:var(--folio-sans)}
.folio-error-code{font-size:3rem;font-weight:700;color:var(--folio-accent);margin:0;line-height:1;font-family:var(--folio-font)}
.folio-error h1{font-size:1.25rem;margin:.75rem 0;font-weight:600}
.folio-error p{color:var(--folio-muted);margin:0 0 1rem}

.folio-footer{
  margin-top:3rem;
  padding-top:1.5rem;
  border-top:1px solid var(--folio-line);
  font-family:var(--folio-sans);
  font-size:.82rem;
  color:var(--folio-muted);
}
.folio-footer strong{display:block;color:var(--folio-ink);font-size:.92rem;margin-bottom:.35rem}
.folio-footer-links{display:flex;flex-wrap:wrap;gap:.65rem 1rem;margin:.5rem 0}
.folio-footer-links a{color:var(--folio-muted);text-decoration:none}
.folio-footer-links a:hover{color:var(--folio-accent-deep)}
.folio-copy{margin:.75rem 0 0;font-size:.78rem;opacity:.85}

@media(max-width:860px){
  .menu-toggle{display:flex}
  .folio-overlay.open{display:block}
  .folio-layout{flex-direction:column;padding:0;gap:0}
  .folio-toc{
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    width:min(280px,85vw);
    z-index:100;
    background:var(--folio-paper);
    border-right:1px solid var(--folio-line);
    transform:translateX(-105%);
    transition:transform .25s ease;
    padding-top:3.5rem;
    box-shadow:4px 0 24px rgba(0,0,0,.08);
    max-height:100vh;
  }
  .folio-toc.open{transform:translateX(0)}
  .folio-reader{padding:1rem 1.25rem 2rem}
  .folio-masthead-inner{padding-left:3.5rem}
  .folio-chapter--band{margin:0;padding:1.5rem 0}
}