:root {
  color-scheme: dark;
  --kufu-night: #171b1e;
  --kufu-ink: #e7e2d6;
  --kufu-muted: #c3bcad;
  --kufu-stone: #24292a;
  --kufu-stone-hi: #303638;
  --kufu-line: #59605b;
  --kufu-lapis: #8bb9c2;
  --kufu-gold: #d8bd7c;
  --kufu-copper: #c58b64;
  --kufu-lore: #b6a0cd;
  --kufu-open: #d9a36e;
}

* { scroll-margin-top: 140px; }
body { color: var(--kufu-ink); background: var(--kufu-night); font-size: 17px; line-height: 1.65; }
button, input { font: inherit; }
a { color: var(--kufu-lapis); text-underline-offset: .18em; }
a:hover { color: #c2e0df; }

.kufu-guide {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 6vw, 76px) 20px 32px;
  background:
    linear-gradient(135deg, rgba(216,189,124,.08), transparent 38%),
    radial-gradient(ellipse at 85% 0%, rgba(79,125,132,.18), transparent 42%),
    #1d2224;
  border-bottom: 1px solid #71674c;
}
.kufu-guide::before, .kufu-guide::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border: 1px solid rgba(216,189,124,.17);
  transform: rotate(45deg);
}
.kufu-guide::before { width: 310px; height: 310px; right: -100px; top: -120px; }
.kufu-guide::after { width: 190px; height: 190px; right: -40px; top: -60px; }
.kufu-guide-inner { position: relative; z-index: 1; width: min(1180px, 100%); margin: 0 auto; }
.kufu-kicker { display:flex; gap:14px; align-items:center; color:var(--kufu-gold); font-size:.78rem; letter-spacing:.19em; font-weight:700; }
.kufu-kicker span + span { padding-left:14px; border-left:1px solid var(--kufu-line); color:var(--kufu-muted); }
.kufu-guide h1 { margin:.05em 0 0; color:#f1dfad; font:700 clamp(3.4rem, 10vw, 7.4rem)/.95 Georgia, "Times New Roman", serif; letter-spacing:.08em; text-shadow:0 3px 22px rgba(216,189,124,.16); }
.kufu-subtitle { margin:.45em 0 0; max-width:780px; color:var(--kufu-gold); font:500 clamp(1.25rem, 2.7vw, 2.05rem)/1.25 Georgia, "Times New Roman", serif; }
.kufu-lead { max-width:850px; margin:1em 0 1.4em; color:#e6e0d4; font-size:1.08rem; }
.kufu-path { display:flex; flex-wrap:wrap; align-items:center; gap:9px 13px; margin:20px 0 24px; padding:12px 15px; color:#efe5c9; border-block:1px solid rgba(216,189,124,.4); font-size:.76rem; letter-spacing:.13em; }
.kufu-path b { color:var(--kufu-copper); font-size:1rem; }

.kufu-guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.kufu-guide-card { align-self:start; border:1px solid #5a5547; border-radius:5px; background:linear-gradient(180deg,#292d2c,#222626); box-shadow:0 8px 26px rgba(0,0,0,.18); }
.kufu-guide-card[open] { border-color:#93815a; }
.kufu-guide-card summary { display:flex; align-items:center; gap:12px; padding:14px 16px; cursor:pointer; list-style:none; color:#f1e5c4; font-weight:650; }
.kufu-guide-card summary::-webkit-details-marker { display:none; }
.kufu-step { color:var(--kufu-gold); font:700 .78rem Georgia,serif; letter-spacing:.09em; }
.kufu-chevron { margin-left:auto; color:var(--kufu-copper); transition:transform .18s ease; }
.kufu-guide-card[open] .kufu-chevron { transform:rotate(180deg); }
.kufu-card-copy { padding:0 16px 14px 45px; color:#d2ccbe; font-size:.94rem; }
.kufu-card-copy p { margin:.45em 0; }
.kufu-citations { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:12px !important; font-size:.88rem; }
.kufu-citations a { border-bottom:1px dotted #8bb9c2; text-decoration:none; }

.kufu-evidence-key { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:20px; color:var(--kufu-muted); font-size:.76rem; }
.kufu-evidence-key span { display:inline-flex; align-items:center; gap:6px; }
.kufu-evidence-key b { color:#f1e5c4; font-size:.72rem; letter-spacing:.08em; }
.key-mark { display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--kufu-lapis); }
.key-model { background:var(--kufu-gold); }
.key-open { background:var(--kufu-open); }
.key-lore { background:var(--kufu-lore); }

.kufu-tools { position:sticky; top:66px; z-index:30; display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; padding:10px max(18px, calc((100vw - 1180px)/2)); background:rgba(24,29,30,.97); border-bottom:1px solid #605943; box-shadow:0 4px 14px rgba(0,0,0,.25); backdrop-filter:blur(8px); }
.kufu-search-label { color:#e8d7aa; font-size:.84rem; font-weight:650; }
#kufu-search { flex:1 1 260px; min-width:160px; max-width:520px; padding:8px 11px; color:var(--kufu-ink); background:#252b2c; border:1px solid #68624f; border-radius:4px; outline:none; }
#kufu-search:focus { border-color:var(--kufu-gold); box-shadow:0 0 0 2px rgba(216,189,124,.2); }
.kufu-fold-actions { display:flex; flex-wrap:wrap; gap:7px; }
.kufu-fold-actions button { padding:7px 10px; color:#eee3c6; background:#343632; border:1px solid #777052; border-radius:4px; cursor:pointer; font-size:.82rem; }
.kufu-fold-actions button:hover { background:#454438; }
.kufu-search-status { flex:1 0 100%; min-height:0; margin:0; color:var(--kufu-muted); font-size:.78rem; }
.kufu-search-status:empty { display:none; }

#root .page { width:min(1240px,100%); padding:28px 18px 72px; }
#root .page > h1, #root .page > p { display:none; }
#root .toc { margin:0 0 26px; padding:14px 18px; background:#242a2b; border:1px solid #5e5948; border-radius:5px; }
#root .toc strong { color:#f0dfad; letter-spacing:.07em; }
#root .toc a { color:var(--kufu-lapis); }
#root .toc ul { columns:2; column-gap:34px; }
#root .toc li { break-inside:avoid; margin:.2em 0; }

#root .sec { margin:18px 0; padding:0; overflow:hidden; background:#202526; border:1px solid #4e554f; border-radius:5px; box-shadow:0 5px 16px rgba(0,0,0,.16); }
#root .sec > h2 { display:flex; align-items:center; gap:14px; margin:0; padding:15px 18px; color:#eddbad; background:linear-gradient(90deg,#303432,#252b2b); border:0; border-bottom:1px solid #535747; font:600 clamp(1.12rem,2vw,1.5rem)/1.3 Georgia,"Times New Roman",serif; cursor:pointer; }
#root .sec > h2:hover { background:linear-gradient(90deg,#3a3b34,#2b3030); }
#root .sec > h2::after { content:""; width:9px; height:9px; margin-left:auto; flex:0 0 9px; border-right:2px solid var(--kufu-copper); border-bottom:2px solid var(--kufu-copper); transform:rotate(45deg) translateY(-2px); transition:transform .16s ease; }
#root .sec[data-kufu-open="false"] > h2::after { transform:rotate(-45deg); }
#root .sec[data-kufu-open="false"] > *:not(h2) { display:none !important; }
#root .sec > .sec-body { padding:16px; }
#root .sec .sec { margin:12px 0; padding:0; background:#272c2c; border-color:#565c53; box-shadow:none; }
#root .sec .sec > h2 { padding:12px 14px; font-size:1.1rem; }
#root .sec .sec > .sec-body { padding:14px; }
#root .sec .caption { color:#c4bdad; }
#root .sec .callout { background:#2a302e; border-color:var(--kufu-gold); color:#e5dfd2; }
#root .sec .pc, #root .sec .toc { background:#262c2c; border-color:#53594f; }
#root .sec table { font-size:.94rem; }
#root .sec th { color:#f0dfad; background:#303432; }
#root .sec td, #root .sec th { border-color:#4e554e; }
#root .sec .btn, #root .sec .seg button { color:#eee5d3; background:#333936; border-color:#66634f; }
#root .sec .seg button.on, #root .sec .btn.primary { color:#171b1e; background:#d5b86f; border-color:#d5b86f; }
#root .sec .badge { border-color:#9d8b5f; }
#root .sec .links a { background:#272d2c; border-color:#575b50; }
#root .sec svg { max-width:100%; }
#root .sec [hidden] { display:none !important; }

.kufu-section-label { flex:0 0 auto; padding:3px 7px; color:#1a2020; background:var(--kufu-lapis); border-radius:2px; font:700 .62rem/1.3 system-ui,sans-serif; letter-spacing:.08em; }
.kufu-section-label[data-kind="MODEL"] { background:var(--kufu-gold); }
.kufu-section-label[data-kind="OPEN"] { background:#dda271; }
.kufu-section-label[data-kind="LORE"] { color:#231c2e; background:#c3add9; }
.kufu-fold-button { display:none; }
.kufu-footer { padding:24px 20px 40px; color:#bdb5a4; background:#1d2224; border-top:1px solid #61583e; font-size:.87rem; }
.kufu-footer p { width:min(1180px,100%); margin:0 auto; }
.kufu-footer strong { color:var(--kufu-gold); letter-spacing:.08em; }

@media(max-width:760px) {
  body { font-size:16px; }
  .kufu-guide { padding:28px 16px 22px; }
  .kufu-guide-grid { grid-template-columns:1fr; }
  .kufu-card-copy { padding-left:16px; }
  .kufu-tools { position:static; padding:10px 16px; }
  .kufu-search-label { flex:1 0 100%; }
  #kufu-search { max-width:none; }
  #root .toc ul { columns:1; }
  #root .sec > .sec-body, #root .sec .sec > .sec-body { padding:12px; }
  #root .sec .grid { grid-template-columns:1fr !important; }
  #root .sec .links { grid-template-columns:1fr; }
  #root .sec table { min-width:640px; }
  #root .sec > h2 { gap:8px; padding:13px 12px; }
  .kufu-section-label { font-size:.56rem; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; } }


.kufu-visual-record { margin:26px 0 24px; padding:18px; background:#232929; border:1px solid #585949; border-radius:5px; }
.kufu-visual-record h2 { margin:0; color:#f1dfad; font:600 clamp(1.25rem,2.4vw,1.7rem)/1.25 Georgia,"Times New Roman",serif; }
.kufu-visual-intro { max-width:880px; margin:.55em 0 14px; color:#d2ccbe; }
.kufu-visual-record figure { min-width:0; margin:0; overflow:hidden; background:#1b2020; border:1px solid #565345; border-radius:4px; }
.kufu-photo-main { margin-bottom:12px !important; }
.kufu-photo-main img { display:block; width:100%; max-height:440px; object-fit:cover; object-position:center 56%; }
.kufu-photo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.kufu-photo-grid img { display:block; width:100%; height:210px; object-fit:cover; background:#171b1e; }
.kufu-photo-grid figure:last-child img { object-fit:contain; padding:8px; }
.kufu-visual-record figcaption { display:grid; gap:4px; padding:10px 12px 12px; color:#bdb8aa; font-size:.78rem; line-height:1.45; }
.kufu-visual-record figcaption a { color:#a9d1d4; }
.kufu-caption-title { color:#f0dfad; font:600 1rem Georgia,"Times New Roman",serif; }
.kufu-guide-card .kufu-card-copy { line-height:1.55; }
.kufu-citations a + a { margin-left:4px; }

@media(max-width:760px) {
  .kufu-visual-record { padding:12px; }
  .kufu-photo-main img { max-height:260px; }
  .kufu-photo-grid { grid-template-columns:1fr; }
  .kufu-photo-grid img { height:230px; }
}
