/* Premium editorial layer for guide index + article chapters. Keeps all existing content and routes intact. */

.guide-page{
  --gmd-ink:#10182a;
  --gmd-muted:#657084;
  --gmd-red:#b91f2e;
  --gmd-line:#e8ebf0;
  background:linear-gradient(180deg,#f6f8fb 0,#ffffff 34rem);
}

.guide-cover{
  position:relative;
  overflow:hidden;
  padding:64px 0 38px;
  background:
    radial-gradient(circle at 88% 10%,rgba(185,31,46,.09),transparent 28%),
    linear-gradient(135deg,#f7f9fc 0%,#fff 58%,#faf4f5 100%);
  border-bottom:1px solid var(--gmd-line);
}
.guide-cover:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:3px;
  background:linear-gradient(90deg,#9f1422 0 18%,#d9dde5 18% 100%);
}
.guide-cover .wrap{max-width:980px}
.guide-back{margin-bottom:30px;color:#6c7587}
.guide-kicker{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border:1px solid rgba(185,31,46,.18);
  border-radius:999px;
  background:rgba(255,255,255,.74);
  color:var(--gmd-red);
  letter-spacing:.12em;
}
.guide-title{max-width:820px;margin-top:14px;color:var(--gmd-ink);font-size:clamp(42px,6vw,64px);line-height:1.08}
.guide-intro{max-width:790px;color:#4f5b70;font-size:19px;line-height:1.82}

.guide-body{padding:46px 0 84px}
.guide-body .wrap{max-width:980px}
.guide-toc-card{
  border:1px solid #e3e7ed;
  border-radius:24px;
  box-shadow:0 22px 60px rgba(21,31,50,.08);
}
.guide-toc-head{padding:30px 32px 22px;background:linear-gradient(180deg,#fff,#fcfdff)}
.guide-toc-label{color:var(--gmd-red);font-size:11px;letter-spacing:.13em;text-transform:uppercase}
.guide-toc-head h2{font-size:30px;color:var(--gmd-ink)}
.guide-toc-head p{color:#7a8494}

.guide-toc-row{
  grid-template-columns:48px minmax(0,1fr) 28px;
  gap:16px;
  padding:20px 30px;
  min-height:86px;
  background:#fff;
  transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.guide-toc-row:hover{
  position:relative;
  z-index:1;
  background:#fffafa;
  box-shadow:inset 3px 0 0 var(--gmd-red);
}
.guide-toc-no{
  width:46px;
  height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(185,31,46,.28);
  border-radius:50%;
  background:#fff;
  color:var(--gmd-red);
  font-size:14px;
  font-weight:850;
  letter-spacing:.02em;
}
.guide-toc-copy strong{color:#182237;font-size:18px;line-height:1.5;font-weight:780}
.guide-toc-copy small{margin-top:6px;color:#737e91;font-size:14px;line-height:1.65}
.guide-toc-arrow{color:var(--gmd-red);font-size:24px}

/* Reading experience: editorial rhythm and less visual noise. */
.chapter-page{background:#fff}
.chapter-head{
  padding:54px 0 38px;
  background:linear-gradient(180deg,#f7f8fb 0%,#fff 100%);
}
.chapter-shell{max-width:830px}
.chapter-head h1{color:var(--gmd-ink);font-size:clamp(38px,5vw,52px);line-height:1.18}
.chapter-lead{max-width:760px;color:#536075;font-size:19px;line-height:1.82}
.chapter-reading{padding:50px 0 72px}
.chapter-content{max-width:760px}
.chapter-content .prose{color:#263249;font-size:18px;line-height:1.95}
.chapter-content .prose h2{color:#111a2d;font-size:31px;margin-top:2.2em}
.chapter-content .prose h3{color:#1d2940}
.chapter-content .prose blockquote{
  margin:1.6em 0;
  padding:18px 22px;
  border-left:3px solid var(--gmd-red);
  background:#fbf7f8;
  border-radius:0 12px 12px 0;
}
.chapter-note{border-left-color:var(--gmd-red);background:#fbf7f8}
.chapter-nav{gap:12px;margin-top:44px}
.chapter-nav a{border-radius:16px;box-shadow:0 8px 24px rgba(21,31,50,.04)}
.chapter-nav a:hover{border-color:#d9c3c7;background:#fffafa}

@media(max-width:700px){
  .guide-cover{padding:38px 0 26px}
  .guide-title{font-size:38px;line-height:1.13}
  .guide-intro{font-size:17px;line-height:1.72}
  .guide-body{padding:26px 0 56px}
  .guide-toc-card{border-radius:18px}
  .guide-toc-head{padding:22px 18px 16px}
  .guide-toc-head h2{font-size:24px}
  .guide-toc-row{grid-template-columns:44px minmax(0,1fr) 20px;gap:11px;padding:16px 16px;min-height:78px}
  .guide-toc-no{width:42px;height:42px;font-size:13px}
  .guide-toc-copy strong{font-size:16px;line-height:1.48}
  .guide-toc-copy small{font-size:13px;line-height:1.5}
  .chapter-head{padding:34px 0 26px}
  .chapter-head h1{font-size:32px;line-height:1.26}
  .chapter-lead{font-size:17px;line-height:1.72}
  .chapter-reading{padding:32px 0 50px}
  .chapter-content .prose{font-size:17px;line-height:1.86}
}
