:root{
  --bg:#f6efde;
  --surface:#fffdf8;
  --surface-2:#fbf4e4;
  --panel:#fffaf0;
  --panel-2:#f6edd8;
  --content:#fffdf8;
  --content-2:#faf3e6;
  --content-border:#e4d6b2;
  --content-text:#2f2418;
  --text:#2f2418;
  --muted:#6f6456;
  --line:#e1cfaa;
  --accent:#8a5c37;
  --accent-2:#a57145;
  --success:#2f6a43;
  --shadow:0 10px 24px rgba(56,32,14,.08);
  --radius:18px;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Georgia, "Times New Roman", serif;
  background:linear-gradient(180deg,#fcf7ee 0%, var(--bg) 100%);
  color:var(--text);
  line-height:1.68;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}
code{font-family:Consolas, monospace}
.wrap{width:min(var(--max), calc(100% - 32px)); margin:0 auto}
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(252,247,238,.96);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(138,92,55,.14);
}
.brand-row{display:flex; align-items:center; justify-content:space-between; gap:24px; padding:14px 0}
.brand-title{font-size:1.35rem; font-weight:700; letter-spacing:.2px; color:var(--text)}
.brand-sub{font-size:.92rem; color:var(--muted)}
.nav{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.nav a,.nav summary{
  display:inline-flex; align-items:center; gap:6px;
  padding:10px 13px; border-radius:999px; color:var(--text);
  background:transparent;
  border:1px solid transparent;
  cursor:pointer; list-style:none; font-size:.96rem;
}
.nav a:hover,.nav summary:hover,.nav details[open] summary,.nav a[aria-current="page"]{
  background:var(--panel); border-color:var(--line); text-decoration:none;
}
.nav details{position:relative}
.nav details > div{
  position:absolute; left:0; top:calc(100% + 10px); min-width:260px;
  background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow);
  border-radius:16px; padding:10px; display:grid; gap:6px;
}
.nav details > div a{display:block; border-radius:12px; padding:10px 12px}
.hero{padding:22px 0 10px}
.hero-card,.info-panel,.content-panel,.card{
  border-radius:var(--radius); padding:20px 22px; box-shadow:var(--shadow); border:1px solid var(--line);
}
.hero-card{background:linear-gradient(180deg,var(--surface),var(--panel-2))}
.info-panel,.card{background:var(--panel)}
.content-panel{background:linear-gradient(180deg,var(--content),var(--content-2)); color:var(--content-text); border-color:var(--content-border)}
.kicker{font-size:.82rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-bottom:10px}
h1,h2,h3,h4{line-height:1.22; color:var(--text); margin:0 0 .55em}
h1{font-size:clamp(2rem,2.9vw,3.15rem)}
.home-title-clarifier{display:block; font-size:clamp(1rem,1.55vw,1.32rem); color:var(--muted); margin-bottom:.28em; font-weight:600}
.home-title-main{display:block}
.content-panel h1,.content-panel h2,.content-panel h3,.content-panel h4,.content-panel p,.content-panel li,.content-panel th,.content-panel td,.content-panel .detail-label,.content-panel .keyterm-meta{color:var(--content-text)}
.content-panel a{color:var(--accent)}
.lead{font-size:1.08rem; color:var(--muted); max-width:82ch}
.meta-row,.button-row,.stat-row{display:flex; flex-wrap:wrap; gap:10px; align-items:center}
.badge{display:inline-flex; padding:7px 12px; border-radius:999px; background:var(--surface-2); border:1px solid var(--line); font-size:.93rem}
.button,.button-secondary{
  display:inline-flex; align-items:center; gap:8px; padding:11px 15px; border-radius:999px; border:1px solid var(--line); text-decoration:none; font-weight:600
}
.button{background:#f1dfba; color:#52351c; border-color:#d6b18a}
.button:hover{background:#f7e6d1; text-decoration:none}
.button-secondary{background:var(--panel); color:var(--text)}
.button-secondary:hover{background:var(--surface-2); text-decoration:none}
.section{padding:18px 0}
.section-stack{display:grid; gap:18px}
.grid{display:grid; gap:18px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sidebar-layout{grid-template-columns:minmax(240px,.84fr) minmax(0,1.7fr); align-items:start}
.book-grid .card{display:flex; flex-direction:column; gap:10px}
.unit-list{display:grid; gap:14px}
.unit-item{display:flex; flex-direction:column; gap:10px; padding:18px 20px; border-radius:18px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow)}
.unit-item-header{display:grid; gap:8px}
.unit-ref{display:inline-flex; align-items:center; width:max-content; max-width:100%; padding:6px 11px; border-radius:999px; background:var(--panel); border:1px solid var(--line); color:var(--text); font-size:.9rem; line-height:1.3}
.unit-title{font-size:1.55rem; line-height:1.3; font-weight:700; color:var(--text)}
.unit-summary{font-size:1.08rem; line-height:1.72; color:var(--text); margin:0}
.unit-links{display:flex; flex-wrap:wrap; gap:8px}
.unit-links a{font-size:.95rem; padding:8px 12px; border-radius:999px; border:1px solid var(--line); background:var(--panel); color:var(--text); font-weight:700; text-decoration:none}
.unit-links a:hover{color:var(--text); text-decoration:none; background:var(--surface-2)}
.info-panel.toc{position:sticky; top:92px; background:var(--surface-2)}
.sidebar-layout > aside.section-stack{position:sticky; top:92px; align-self:start}
.toc{display:grid; gap:8px}
.toc a{display:block; padding:8px 10px; border-radius:12px; background:rgba(255,253,248,.95); border:1px solid var(--line)}
.copy-region p:first-child{margin-top:0}
.copy-region ul{margin-top:.4em}
.table{width:100%; border-collapse:collapse}
.table th,.table td{padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top}
.table th{font-size:.94rem; color:var(--muted)}
.content-panel .table th,.content-panel .table td{border-bottom:1px solid var(--line)}
.content-panel .table th{color:var(--muted)}
.small{font-size:.92rem}
.muted{color:var(--muted)}
.content-panel .muted{color:var(--muted)}
.panel-title{display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:10px}
.footer{padding:38px 0 50px; color:var(--muted)}
.footer-grid{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.footer-card{background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:20px; box-shadow:var(--shadow)}
.footer-card strong,.footer-card h3{display:block; color:var(--text); margin:0 0 .55em}
.footer-license{display:flex; gap:12px; align-items:flex-start; margin-top:12px}
.footer-license img{width:132px; height:auto; flex:0 0 auto}
.footer-copy{margin-top:12px}
.breadcrumbs{display:flex; flex-wrap:wrap; gap:8px; font-size:.92rem; color:var(--muted)}
.breadcrumbs a{color:var(--muted)}
.machine-links a{font-size:.9rem}
.page-tail{margin-top:0}
.detail-grid{display:grid; gap:14px}
.detail-card{padding:14px 16px; border-radius:16px; background:var(--surface-2); border:1px solid var(--line)}
.detail-card.single{display:block}
.detail-card h3{margin-bottom:.35em}
.detail-field + .detail-field{margin-top:10px}
.detail-label{font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color:var(--accent); font-weight:700; margin-bottom:6px}
.detail-card p{margin:.45em 0 0}
.detail-card ul.clean{margin:.35em 0 0 1.2em}
ul.clean.compact{margin:.2em 0 0 1.2em}
.keyterm-card{padding:14px 16px; border-radius:16px; background:var(--surface-2); border:1px solid var(--line)}
.keyterm-card h4{margin-bottom:.25em}
.keyterm-meta{font-size:.9rem; color:var(--accent)}
.search-box{padding:14px 16px; border-radius:16px; background:var(--surface); border:1px solid var(--line)}
.search-box input{width:100%; padding:12px 14px; border-radius:12px; border:1px solid var(--line); font:inherit}
.notice{padding:14px 16px; border-radius:16px; border:1px dashed var(--line); background:rgba(255,255,255,.6)}
.unit-page .content-panel p,.unit-page .content-panel li,.unit-page .detail-card p,.unit-page .detail-card li,.unit-page .keyterm-card p,.unit-page .keyterm-card li,.unit-page .copy-only p,.unit-page .copy-only li{font-size:1.08rem; line-height:1.74}
.unit-page .content-panel h2,.unit-page .content-panel h3,.unit-page .detail-card h3,.unit-page .keyterm-card h4{font-size:1.34rem}
@media (max-width: 980px){
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sidebar-layout{grid-template-columns:1fr}
}
@media (max-width: 860px){
  .brand-row{align-items:flex-start; flex-direction:column}
  .nav{gap:6px}
  .nav details > div{position:static; box-shadow:none; margin-top:6px}
  .unit-title{font-size:1.22rem}
  .grid-2,.grid-3{grid-template-columns:1fr}
}



/* 2026-04-08 requested changes */
.sidebar-layout > aside.section-stack,
.sidebar-layout > aside.info-panel{
  position: sticky;
  top: 92px;
  align-self: start;
  max-height: calc(100vh - 112px);
  overflow: auto;
  padding-right: 6px;
  scrollbar-width: thin;
}
.sidebar-layout > aside.section-stack::-webkit-scrollbar,
.sidebar-layout > aside.info-panel::-webkit-scrollbar{width:10px}
.sidebar-layout > aside.section-stack::-webkit-scrollbar-thumb,
.sidebar-layout > aside.info-panel::-webkit-scrollbar-thumb{background:rgba(138,92,55,.28);border-radius:999px}