:root{
  --ink:#17130f;
  --ink-soft:#211a15;
  --ink-card:#241d17;
  --vermillion:#9c2b1f;
  --vermillion-bright:#c8402c;
  --gold:#b8944f;
  --gold-soft:#8b713c;
  --parchment:#ede3cf;
  --parchment-dim:#d9cba8;
  --jade:#46614f;
  --jade-bright:#6a9179;
  --ash:#c9c0af;
  --ash-dim:#8f8674;
  --line:#3a3025;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{animation:none!important;transition:none!important;}
}

body{
  background:var(--ink);
  color:var(--ash);
  font-family:"Inter",sans-serif;
  line-height:1.7;
  font-size:16px;
}

h1,h2,h3,.display{
  font-family:"Cinzel",serif;
  color:var(--parchment);
  font-weight:700;
  letter-spacing:.01em;
}
.serif-alt{font-family:"Cormorant Garamond",serif;font-weight:600;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px;}
.wrap-narrow{max-width:820px;margin:0 auto;padding:0 28px;}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:11.5px;letter-spacing:.28em;
  color:var(--gold);text-transform:uppercase;font-weight:700;
}
.eyebrow::before{content:"";width:18px;height:1px;background:var(--gold);display:inline-block;}

/* ---------- NAV ---------- */
header.site-nav{
  position:sticky;top:0;z-index:50;
  background:rgba(23,19,15,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 28px;max-width:1120px;margin:0 auto;
}
.brand{display:flex;align-items:center;gap:12px;font-family:"Cinzel",serif;font-weight:700;font-size:18px;color:var(--parchment);}
.brand .stamp{
  width:30px;height:30px;background:var(--vermillion);color:var(--parchment);
  display:flex;align-items:center;justify-content:center;
  font-family:"Cinzel",serif;font-size:13px;font-weight:900;
  transform:rotate(-4deg);border:1px solid var(--gold-soft);
}
nav.links{display:flex;gap:28px;font-size:13.5px;letter-spacing:.02em;}
nav.links a{color:var(--ash-dim);padding-bottom:4px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s;}
nav.links a:hover,nav.links a.active{color:var(--parchment);border-color:var(--gold);}
.nav-cta{
  background:var(--vermillion);color:var(--parchment);
  padding:9px 18px;font-size:12.5px;font-weight:600;letter-spacing:.05em;
  border:1px solid var(--vermillion-bright);text-transform:uppercase;
}
@media (max-width:820px){nav.links{display:none;}}

/* ---------- NOTICE ---------- */
.mvp-notice{
  background:var(--ink-soft);border-bottom:1px solid var(--line);
  font-size:12.5px;color:var(--ash-dim);text-align:center;padding:9px 20px;
}
.mvp-notice b{color:var(--gold);}

/* ---------- BREADCRUMB ---------- */
.breadcrumb{
  padding:18px 0;
  font-size:12.5px;
  color:var(--ash-dim);
  letter-spacing:.02em;
}
.breadcrumb a{color:var(--gold);}
.breadcrumb a:hover{color:var(--parchment);}
.breadcrumb .sep{margin:0 8px;color:var(--line);}

/* ---------- HERO ---------- */
.hero{padding:70px 0 70px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);}
.hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 15% 0%, rgba(156,43,31,.16), transparent 55%),
    radial-gradient(ellipse at 85% 100%, rgba(184,148,79,.10), transparent 55%);
  pointer-events:none;
}
.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr;}}
.hero h1{font-size:clamp(30px,4.4vw,48px);line-height:1.28;margin:20px 0 22px;}
.hero h1 .accent{color:var(--vermillion-bright);}
.hero p.lede{font-size:16.5px;color:var(--ash);max-width:48ch;margin-bottom:34px;font-family:"Cormorant Garamond",serif;font-weight:600;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}
.btn{display:inline-block;padding:13px 26px;font-size:13.5px;font-weight:600;letter-spacing:.04em;border:1px solid var(--gold-soft);transition:transform .15s,background .15s,color .15s;text-transform:uppercase;}
.btn-primary{background:var(--vermillion);color:var(--parchment);border-color:var(--vermillion-bright);}
.btn-primary:hover{background:var(--vermillion-bright);transform:translateY(-1px);}
.btn-ghost{color:var(--parchment);border-color:var(--line);}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);}

/* ---------- SIGNATURE: branching path diagram ---------- */
.path-card{background:var(--ink-card);border:1px solid var(--line);padding:28px 24px 22px;}
.path-card .cap{font-size:12px;color:var(--ash-dim);letter-spacing:.03em;margin-top:14px;text-align:center;font-family:"Cormorant Garamond",serif;font-style:italic;}
.branch-svg{width:100%;height:auto;display:block;}
.branch-svg .line{fill:none;stroke:var(--line);stroke-width:2;transition:stroke .25s;}
.branch-svg .node-start circle{fill:var(--parchment);}
.branch-svg .node-start text{fill:var(--ink);font-weight:700;}
.branch-group:hover .line{stroke:var(--gold);}
.branch-group.die:hover .line{stroke:var(--vermillion-bright);}
.branch-group.live:hover .line{stroke:var(--jade-bright);}
.seal{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:"Cinzel",serif;font-size:10px;font-weight:700;
  padding:3px 8px;letter-spacing:.04em;border:1px solid currentColor;
  text-transform:uppercase;
}
.seal.die{color:var(--vermillion-bright);background:rgba(156,43,31,.12);}
.seal.live{color:var(--jade-bright);background:rgba(70,97,79,.16);}
.seal.true{color:var(--gold);background:rgba(184,148,79,.14);}
.seal.good{color:var(--jade-bright);background:rgba(70,97,79,.12);}

/* ---------- SECTION SHARED ---------- */
section{padding:76px 0;border-bottom:1px solid var(--line);}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:40px;flex-wrap:wrap;}
.section-head h2{font-size:clamp(22px,2.8vw,30px);margin-top:10px;}
.section-head p{color:var(--ash-dim);max-width:52ch;font-size:14.5px;}

/* ---------- CHAPTERS LIST ---------- */
.chapter-list{display:flex;flex-direction:column;gap:14px;}
.chapter-card{background:var(--ink-card);border:1px solid var(--line);padding:22px 24px;}
.chapter-card > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.chapter-card > summary::-webkit-details-marker{display:none;}
.chap-num{font-family:"Cinzel",serif;font-weight:700;color:var(--gold);font-size:18px;min-width:38px;}
.chap-title{color:var(--parchment);font-weight:600;font-size:16px;flex:1;font-family:"Cormorant Garamond",serif;letter-spacing:.01em;}
.chap-title a{color:inherit;}
.chap-title a:hover{color:var(--gold);}
.chap-meta{display:flex;align-items:center;gap:14px;font-size:12.5px;color:var(--ash-dim);text-transform:uppercase;letter-spacing:.03em;}
.surv-bar{width:80px;height:5px;background:var(--line);position:relative;}
.surv-bar span{position:absolute;left:0;top:0;bottom:0;background:var(--vermillion-bright);}
.chevron{color:var(--gold);font-size:13px;transition:transform .2s;}
details[open] .chevron{transform:rotate(90deg);}

.choice-tree{margin-top:20px;padding-top:20px;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:10px;}
.choice-row{display:grid;grid-template-columns:28px 1fr auto;gap:14px;align-items:center;font-size:14px;padding:9px 12px;background:var(--ink-soft);}
.choice-row .qi{color:var(--gold);font-weight:700;font-family:"Cinzel",serif;}
.choice-row .desc{color:var(--ash);}
.placeholder-flag{font-size:12px;color:var(--ash-dim);margin-top:16px;font-style:italic;}

/* ---------- ENDINGS ---------- */
.end-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media (max-width:820px){.end-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.end-grid{grid-template-columns:1fr;}}
.end-card{background:var(--ink-card);border:1px solid var(--line);border-left:3px solid var(--line);padding:20px;display:flex;flex-direction:column;gap:10px;min-height:150px;}
.end-card.bad{border-left-color:var(--vermillion);}
.end-card.true{border-left-color:var(--gold);}
.end-card.good{border-left-color:var(--jade);}
.end-card.neutral{border-left-color:var(--jade);}
.end-card h3{font-size:15.5px;color:var(--parchment);font-family:"Cormorant Garamond",serif;letter-spacing:.01em;}
.end-card h3 a{color:inherit;}
.end-card h3 a:hover{color:var(--gold);}
.end-card p{font-size:13.5px;color:var(--ash-dim);flex:1;}

/* ---------- CHARACTERS ---------- */
.char-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media (max-width:820px){.char-grid{grid-template-columns:1fr;}}
.char-card{background:var(--ink-card);border:1px solid var(--line);padding:26px 22px;}
.char-badge{
  width:42px;height:42px;border:1px solid var(--gold-soft);
  display:flex;align-items:center;justify-content:center;
  font-family:"Cinzel",serif;font-weight:700;color:var(--gold);margin-bottom:16px;font-size:14px;
}
.char-card h3{font-size:16.5px;margin-bottom:6px;font-family:"Cormorant Garamond",serif;}
.char-card .role{font-size:12px;color:var(--ash-dim);margin-bottom:14px;letter-spacing:.05em;text-transform:uppercase;}
.char-card p{font-size:13.5px;}

/* ---------- PROFILE ---------- */
.profile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media (max-width:820px){.profile-grid{grid-template-columns:1fr;}}
.profile-card{background:linear-gradient(160deg,var(--ink-card),var(--ink-soft));border:1px solid var(--line);padding:26px 22px;position:relative;}
.profile-card::after{
  content:"E";
  position:absolute;top:16px;right:16px;
  font-family:"Cinzel",serif;font-weight:900;font-size:12px;color:var(--vermillion-bright);
  border:1px solid var(--vermillion-bright);padding:2px 7px;transform:rotate(6deg);
}
.profile-card h3{font-size:18px;margin-bottom:4px;font-family:"Cinzel",serif;}
.profile-card .en{font-size:11px;color:var(--ash-dim);letter-spacing:.1em;margin-bottom:14px;display:block;text-transform:uppercase;}
.profile-card p{font-size:13.5px;}

/* ---------- CHAPTER DETAIL PAGE ---------- */
.page-head{padding:36px 0 10px;}
.page-head h1{font-size:clamp(28px,4vw,42px);margin:14px 0 18px;line-height:1.25;}
.page-head .dek{font-family:"Cormorant Garamond",serif;font-size:17px;color:var(--ash);max-width:62ch;font-weight:600;}
.meta-strip{
  display:flex;gap:24px;flex-wrap:wrap;
  margin-top:24px;padding-top:20px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--ash-dim);text-transform:uppercase;letter-spacing:.04em;
}
.meta-strip strong{color:var(--parchment);display:block;font-size:15px;text-transform:none;font-family:"Cinzel",serif;margin-top:4px;letter-spacing:0;}

.synopsis-box{
  background:var(--ink-card);border:1px solid var(--line);border-left:3px solid var(--gold);
  padding:22px 24px;margin:32px 0;
}
.synopsis-box h2{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold);margin-bottom:10px;}
.synopsis-box p{font-size:14.5px;color:var(--ash);font-family:"Cormorant Garamond",serif;font-size:16px;}

.detail-section{padding:44px 0;border-bottom:1px solid var(--line);}
.detail-section h2{font-size:22px;margin-bottom:18px;}

.choice-block{
  background:var(--ink-card);border:1px solid var(--line);padding:24px;margin-bottom:16px;
}
.choice-block .qlabel{font-family:"Cinzel",serif;color:var(--gold);font-size:13px;letter-spacing:.05em;margin-bottom:10px;}
.choice-block h3{font-size:17px;font-family:"Cormorant Garamond",serif;color:var(--parchment);margin-bottom:14px;font-weight:600;}
.opt-row{
  display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;
  padding:12px 14px;background:var(--ink-soft);margin-bottom:8px;font-size:14px;
}
.opt-row .why{grid-column:1 / -1;font-size:13px;color:var(--ash-dim);margin-top:6px;font-style:italic;}

.faq-item{border-bottom:1px solid var(--line);padding:16px 0;}
.faq-item summary{cursor:pointer;font-weight:600;color:var(--parchment);font-size:15px;list-style:none;display:flex;justify-content:space-between;align-items:center;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";color:var(--gold);font-size:18px;}
.faq-item[open] summary::after{content:"–";}
.faq-item p{margin-top:10px;font-size:14px;color:var(--ash);}

.prev-next{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:44px 0;
}
@media (max-width:600px){.prev-next{grid-template-columns:1fr;}}
.prev-next a{
  background:var(--ink-card);border:1px solid var(--line);padding:20px;display:block;
  transition:border-color .2s;
}
.prev-next a:hover{border-color:var(--gold);}
.prev-next .dir{font-size:11px;color:var(--ash-dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;}
.prev-next .title{font-family:"Cinzel",serif;color:var(--parchment);font-size:15px;}
.prev-next.next-align{text-align:right;}

.unlock-box{
  background:var(--ink-card);border:1px solid var(--gold-soft);padding:24px;margin:28px 0;
}
.unlock-box h2{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold);margin-bottom:12px;}
.unlock-box ul{padding-left:20px;font-size:14.5px;color:var(--ash);}
.unlock-box li{margin-bottom:6px;}

/* ---------- FAQ ---------- */
.faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
@media (max-width:820px){.faq-grid{grid-template-columns:1fr;}}
.faq-card{background:var(--ink-card);border:1px solid var(--line);border-left:3px solid var(--line);padding:24px 22px;display:flex;flex-direction:column;gap:10px;min-height:140px;}
.faq-card[data-category="general"]{border-left-color:var(--gold);}
.faq-card[data-category="rte2"]{border-left-color:var(--vermillion);}
.faq-card[data-category="tips"]{border-left-color:var(--jade);}
.faq-card h3{font-size:16.5px;color:var(--parchment);font-family:"Cormorant Garamond",serif;letter-spacing:.01em;}
.faq-card h3 a{color:inherit;}
.faq-card h3 a:hover{color:var(--gold);}
.faq-card p{font-size:13.5px;color:var(--ash-dim);flex:1;}
.faq-game-tag{font-size:12px;color:var(--gold);letter-spacing:.04em;text-transform:uppercase;font-weight:600;}
.faq-body h3{font-size:18px;color:var(--parchment);font-family:"Cormorant Garamond",serif;font-weight:600;margin:28px 0 10px;padding-top:16px;border-top:1px solid var(--line);}
.faq-body h3:first-child{margin-top:0;padding-top:0;border-top:none;}
.faq-body p{font-size:14.5px;color:var(--ash);line-height:1.7;}
.faq-body ul,.faq-body ol{padding-left:22px;margin:10px 0;font-size:14.5px;color:var(--ash);}
.faq-body li{margin-bottom:6px;}

/* ---------- ACHIEVEMENTS ---------- */
.ach-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
@media (max-width:820px){.ach-grid{grid-template-columns:1fr;}}
.ach-card{background:var(--ink-card);border:1px solid var(--line);border-left:3px solid var(--gold);padding:24px 22px;display:flex;flex-direction:column;gap:10px;min-height:140px;}
.ach-card h3{font-size:16.5px;color:var(--parchment);font-family:"Cormorant Garamond",serif;letter-spacing:.01em;}
.ach-card h3 a{color:inherit;}
.ach-card h3 a:hover{color:var(--gold);}
.ach-card p{font-size:13.5px;color:var(--ash-dim);flex:1;}
.ach-count{font-size:12px;color:var(--gold);letter-spacing:.04em;text-transform:uppercase;font-weight:600;}

/* Achievement detail page — markdown table styling */
.detail-section table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px;}
.detail-section th{background:var(--ink-soft);color:var(--gold);font-size:12px;text-transform:uppercase;letter-spacing:.05em;padding:10px 14px;text-align:left;border:1px solid var(--line);}
.detail-section td{padding:10px 14px;border:1px solid var(--line);color:var(--ash);vertical-align:top;}
.detail-section tr:hover td{background:rgba(184,148,79,.04);}
.detail-section td strong{color:var(--parchment);}

/* ---------- FOOTER ---------- */
/* ---------- COMING SOON (stub chapters) ---------- */
.coming-soon-badge{
  margin-left:12px;vertical-align:middle;
}
.coming-soon-box{
  background:var(--ink-card);border:1px solid var(--line);border-left:3px solid var(--vermillion);
  padding:28px 24px;margin:32px 0;
}
.coming-soon-box h2{
  font-size:13px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--vermillion-bright);margin-bottom:14px;
}
.coming-soon-box p{
  font-size:15px;color:var(--ash);font-family:"Cormorant Garamond",serif;line-height:1.75;
}
.coming-soon-note{
  margin-top:16px;font-size:13.5px!important;color:var(--ash-dim)!important;
  font-style:italic;
}
.chapter-card.stub{
  opacity:.72;
  border-left:2px solid var(--vermillion);
}
.chapter-card.stub .chap-title a{
  color:var(--ash-dim);
}

footer{padding:48px 0;text-align:center;}
footer p{font-size:12px;color:var(--ash-dim);}
footer .brand-mini{font-family:"Cinzel",serif;color:var(--parchment);font-weight:700;margin-bottom:8px;font-size:15px;}

/* ========================================
   OUTCOME TOGGLE — spoiler-light
   ======================================== */

.opt-row .opt-text{color:var(--ash);}
.outcome-details{
  grid-column:1 / -1;margin-top:6px;
}
.outcome-toggle{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ash-dim);cursor:pointer;
  padding:4px 0;border:none;background:none;
  font-family:"Inter",sans-serif;
  list-style:none;
}
.outcome-toggle::-webkit-details-marker{display:none;}
.outcome-toggle::before{
  content:'▸';font-size:10px;transition:transform .2s;
}
.outcome-details[open] .outcome-toggle::before{
  transform:rotate(90deg);
}
.outcome-details[open] .outcome-toggle{
  color:var(--gold);
}
.outcome-content{
  display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;
  margin-top:8px;
}
.outcome-content .why{
  font-size:13px;color:var(--ash-dim);font-style:italic;flex:1;min-width:200px;margin:0;
}
