/* अध्ययनसार Design System 2031 — History Optional Family
   Hub + long-form notes + source micro-pages + Ancient India editorial pages + PYQ.
   Depends on tokens.css, base.css, typography.css, layout.css, components.css, reading.css.
*/

body[data-ds="2031"].history-page,
body[data-ds="2031"].history-note-page,
body[data-ds="2031"].ancient-page,
body[data-ds="2031"].topic-page,
body[data-ds="2031"].pyq6-page{
  background:var(--ds-bg);
  color:var(--ds-text);
}

/* Shared accessibility */
body[data-ds="2031"] .skip-link{
  position:fixed;left:12px;top:8px;z-index:5000;
  transform:translateY(-180%);
  padding:8px 12px;border-radius:var(--ds-radius-sm);
  background:var(--ds-surface-soft);color:var(--ds-heading);text-decoration:none;
  font-size:var(--ds-text-sm);font-weight:750;
}
body[data-ds="2031"] .skip-link:focus{transform:translateY(0);}

/* =========================================================
   HISTORY OPTIONAL MASTER INDEX
   ========================================================= */
body[data-ds="2031"] .history-index{
  width:min(var(--ds-content-max),calc(100% - 32px));
  margin-inline:auto;
  padding:var(--ds-space-8) 0 var(--ds-space-20);
}
body[data-ds="2031"] .history-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--ds-space-5);margin:0 0 var(--ds-space-5);
}
body[data-ds="2031"] .history-head h1{
  margin:0;color:var(--ds-heading);
  font-size:var(--ds-text-h1);line-height:var(--ds-leading-tight);
}
body[data-ds="2031"] .history-head p{
  margin:var(--ds-space-2) 0 0;
  color:var(--ds-text-muted);font-size:var(--ds-text-sm);
}
body[data-ds="2031"] .paper-chip{
  flex:none;min-height:34px;display:inline-flex;align-items:center;
  padding:0 var(--ds-space-3);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-pill);background:var(--ds-surface);
  color:var(--ds-primary-strong);font-size:var(--ds-text-sm);font-weight:800;
  white-space:nowrap;
}
body[data-ds="2031"] .index-note{
  margin:0 0 var(--ds-space-5);padding:var(--ds-space-3) var(--ds-space-4);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);
  background:var(--ds-surface-soft);color:var(--ds-text-muted);
  font-size:var(--ds-text-sm);line-height:1.6;
}
body[data-ds="2031"] .chapter-list{display:grid;gap:var(--ds-space-3);}
body[data-ds="2031"] .chapter{
  overflow:hidden;border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-card);background:var(--ds-surface);
  box-shadow:none;
}
body[data-ds="2031"] .chapter>summary{list-style:none;cursor:pointer;}
body[data-ds="2031"] .chapter>summary::-webkit-details-marker{display:none;}
body[data-ds="2031"] .chapter-summary{
  min-height:58px;display:grid;grid-template-columns:38px minmax(0,1fr) 24px;
  align-items:center;gap:var(--ds-space-3);padding:var(--ds-space-3) var(--ds-space-4);
  color:var(--ds-heading);font-weight:800;
}
body[data-ds="2031"] .chapter-summary:hover{background:var(--ds-surface-soft);}
body[data-ds="2031"] .chapter-number{
  width:32px;height:32px;display:grid;place-items:center;
  border-radius:var(--ds-radius-sm);background:var(--ds-surface-soft);
  color:var(--ds-primary-strong);font-size:var(--ds-text-sm);font-weight:850;
}
body[data-ds="2031"] .chapter-name{font-size:var(--ds-text-ui);line-height:1.45;}
body[data-ds="2031"] .chapter-arrow{color:var(--ds-text-muted);transition:transform var(--ds-transition-fast);}
body[data-ds="2031"] details[open]>.chapter-summary .chapter-arrow{transform:rotate(180deg);}
body[data-ds="2031"] .chapter-content{
  padding:var(--ds-space-2) var(--ds-space-4) var(--ds-space-4) 52px;
  border-top:1px solid var(--ds-border);background:var(--ds-surface);
}
body[data-ds="2031"] .topic-row{border-bottom:1px solid var(--ds-border);}
body[data-ds="2031"] .topic-row:last-child{border-bottom:0;}
body[data-ds="2031"] :where(.topic-direct-link,.topic-static){
  min-height:46px;display:grid;grid-template-columns:minmax(48px,auto) minmax(0,1fr) 22px;
  align-items:center;gap:var(--ds-space-2);padding:var(--ds-space-2);
  border-radius:var(--ds-radius-sm);color:var(--ds-text);text-decoration:none;
}
body[data-ds="2031"] .topic-static{grid-template-columns:minmax(48px,auto) minmax(0,1fr);}
body[data-ds="2031"] .topic-direct-link:hover{background:var(--ds-surface-soft);color:var(--ds-primary-strong);}
body[data-ds="2031"] .topic-number{color:var(--ds-text-muted);font-size:var(--ds-text-xs);font-weight:800;}
body[data-ds="2031"] .topic-name{font-size:var(--ds-text-sm);line-height:1.5;}
body[data-ds="2031"] .topic-go{justify-self:end;color:var(--ds-primary);font-size:1.2rem;}
body[data-ds="2031"] :where(.topic-row,.chapter):target{scroll-margin-top:96px;outline:2px solid color-mix(in srgb,var(--ds-primary) 22%,transparent);outline-offset:-2px;}

/* =========================================================
   LEGACY LONG NOTE PAGES
   .note-wrap / .note-body family
   ========================================================= */
body[data-ds="2031"].history-note-page main{padding:var(--ds-space-6) 0 var(--ds-space-20);}
body[data-ds="2031"] .note-wrap{
  width:min(var(--ds-content-max),calc(100% - 32px));
  max-width:var(--ds-content-max);margin-inline:auto;
}
body[data-ds="2031"] .breadcrumb{
  display:flex;flex-wrap:wrap;gap:var(--ds-space-2);align-items:center;
  margin:0 0 var(--ds-space-5);color:var(--ds-text-muted);
  font-size:var(--ds-text-sm);line-height:1.5;
}
body[data-ds="2031"] .breadcrumb a{color:inherit;text-decoration:none;}
body[data-ds="2031"] .breadcrumb a:hover{color:var(--ds-primary);}
body[data-ds="2031"] .note-head{
  width:min(var(--ds-reading-max),100%);margin-inline:auto;
  padding:var(--ds-space-6);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-card);background:var(--ds-surface);
  box-shadow:none;
}
body[data-ds="2031"] .note-kicker{
  margin-bottom:var(--ds-space-2);color:var(--ds-primary);
  font-size:var(--ds-text-sm);font-weight:800;
}
body[data-ds="2031"] .note-head h1{
  margin:0;color:var(--ds-heading);font-size:var(--ds-text-h1);
  line-height:var(--ds-leading-tight);
}
body[data-ds="2031"] .note-head p{
  margin:var(--ds-space-3) 0 0;color:var(--ds-text-muted);
  font-size:var(--ds-text-body);line-height:1.7;
}
body[data-ds="2031"] .toc{
  width:min(var(--ds-reading-max),100%);margin:var(--ds-space-4) auto;
  overflow:hidden;border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-md);background:var(--ds-surface);
}
body[data-ds="2031"] .toc summary{
  cursor:pointer;padding:var(--ds-space-3) var(--ds-space-4);
  color:var(--ds-heading);font-size:var(--ds-text-ui);font-weight:800;
}
body[data-ds="2031"] .toc ul{
  margin:0;padding:0 var(--ds-space-5) var(--ds-space-4) 34px;
  columns:2;column-gap:28px;border-top:1px solid var(--ds-border);
}
body[data-ds="2031"] .toc li{break-inside:avoid;margin:7px 0;color:var(--ds-text-muted);}
body[data-ds="2031"] .toc a{color:inherit;text-decoration:none;font-size:var(--ds-text-sm);}
body[data-ds="2031"] .toc a:hover{color:var(--ds-primary);}
body[data-ds="2031"] .note-body{
  width:min(var(--ds-reading-max),100%);margin-inline:auto;
  padding:clamp(20px,4vw,36px);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-card);background:var(--ds-surface);
  box-shadow:none;color:var(--ds-text);
}
body[data-ds="2031"] .note-body :where(h1,h2,h3,h4){color:var(--ds-heading);scroll-margin-top:96px;}
body[data-ds="2031"] .note-body h1{
  margin:var(--ds-space-10) 0 var(--ds-space-4);padding-top:var(--ds-space-4);
  border-top:1px solid var(--ds-border);font-size:var(--ds-text-h2);line-height:1.4;
}
body[data-ds="2031"] .note-body h1:first-child{margin-top:0;border-top:0;padding-top:0;}
body[data-ds="2031"] .note-body h2{margin:var(--ds-space-8) 0 var(--ds-space-3);font-size:var(--ds-text-h3);line-height:1.45;}
body[data-ds="2031"] .note-body h3{margin:var(--ds-space-6) 0 var(--ds-space-2);font-size:var(--ds-text-h4);line-height:1.5;}
body[data-ds="2031"] .note-body :where(p,li){
  color:var(--ds-text);font-size:var(--ds-text-body);line-height:var(--ds-leading-body);
}
body[data-ds="2031"] .note-body p{margin:.7em 0 1em;}
body[data-ds="2031"] .note-body :where(ul,ol){padding-inline-start:1.45em;}
body[data-ds="2031"] .note-body blockquote{
  margin:var(--ds-space-5) 0;padding:var(--ds-space-3) var(--ds-space-4);
  border-left:4px solid var(--ds-primary);border-radius:0 var(--ds-radius-md) var(--ds-radius-md) 0;
  background:var(--ds-surface-soft);color:var(--ds-text);
}
body[data-ds="2031"] .note-body table{
  width:100%;min-width:650px;border-collapse:collapse;
}
body[data-ds="2031"] .note-body table:has(th){
  display:table;
}
body[data-ds="2031"] .note-body :where(th,td){
  padding:11px 12px;border:1px solid var(--ds-border);
  color:var(--ds-text);font-size:var(--ds-text-ui);line-height:1.6;text-align:left;vertical-align:top;
}
body[data-ds="2031"] .note-body th{background:var(--ds-surface-soft);color:var(--ds-heading);font-weight:800;}
body[data-ds="2031"] .note-body hr{border:0;border-top:1px solid var(--ds-border);margin:var(--ds-space-8) 0;}
body[data-ds="2031"] .note-nav{
  width:min(var(--ds-reading-max),100%);margin:var(--ds-space-5) auto 0;
  display:grid;grid-template-columns:1fr 1fr;gap:var(--ds-space-3);
}
body[data-ds="2031"] .note-nav a{
  display:block;padding:var(--ds-space-3) var(--ds-space-4);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);
  background:var(--ds-surface);color:var(--ds-heading);text-decoration:none;
}
body[data-ds="2031"] .note-nav a:last-child{text-align:right;}
body[data-ds="2031"] .note-nav small{display:block;color:var(--ds-text-muted);margin-bottom:3px;}
body[data-ds="2031"] .back-top{display:inline-block;margin-top:var(--ds-space-5);color:var(--ds-primary);font-weight:750;text-decoration:none;}

/* =========================================================
   NEWER SOURCE MICRO-PAGES
   .history-note-main / .history-note-content family
   ========================================================= */
body[data-ds="2031"] .history-note-main{padding:var(--ds-space-6) 0 var(--ds-space-20);}
body[data-ds="2031"] .history-note-shell{width:min(var(--ds-content-max),calc(100% - 32px));max-width:var(--ds-content-max);margin-inline:auto;}
body[data-ds="2031"] .history-breadcrumb{
  display:flex;flex-wrap:wrap;gap:var(--ds-space-2);align-items:center;
  margin:0 0 var(--ds-space-5);color:var(--ds-text-muted);font-size:var(--ds-text-sm);
}
body[data-ds="2031"] .history-breadcrumb a{color:inherit;text-decoration:none;}
body[data-ds="2031"] .history-breadcrumb a:hover{color:var(--ds-primary);}
body[data-ds="2031"] .history-note{width:min(var(--ds-reading-max),100%);margin-inline:auto;}
body[data-ds="2031"] .history-note-header{
  padding:0 0 var(--ds-space-5);border-bottom:1px solid var(--ds-border);
}
body[data-ds="2031"] .history-note-kicker{
  margin-bottom:var(--ds-space-2);color:var(--ds-primary);font-size:var(--ds-text-sm);font-weight:800;
}
body[data-ds="2031"] .history-note h1{
  margin:0;color:var(--ds-heading);font-size:var(--ds-text-h1);line-height:var(--ds-leading-tight);
}
body[data-ds="2031"] .history-note-header p{
  margin:var(--ds-space-3) 0 0;color:var(--ds-text-muted);font-size:var(--ds-text-body);line-height:1.7;
}
body[data-ds="2031"] .history-note-content{
  margin-top:var(--ds-space-5);padding:clamp(20px,4vw,36px);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-card);
  background:var(--ds-surface);box-shadow:none;
}
body[data-ds="2031"] .history-note-content h2{
  margin:var(--ds-space-10) 0 var(--ds-space-4);padding-top:var(--ds-space-4);
  border-top:1px solid var(--ds-border);color:var(--ds-heading);
  font-size:var(--ds-text-h2);line-height:1.4;
}
body[data-ds="2031"] .history-note-content h2:first-child{margin-top:0;border-top:0;padding-top:0;}
body[data-ds="2031"] .history-note-content h3{margin:var(--ds-space-8) 0 var(--ds-space-3);color:var(--ds-heading);font-size:var(--ds-text-h3);}
body[data-ds="2031"] .history-note-content h4{margin:var(--ds-space-6) 0 var(--ds-space-2);color:var(--ds-heading);font-size:var(--ds-text-h4);}
body[data-ds="2031"] .history-note-content :where(p,li){color:var(--ds-text);font-size:var(--ds-text-body);line-height:var(--ds-leading-body);}
body[data-ds="2031"] .history-note-content p{margin:0 0 1em;}
body[data-ds="2031"] .history-note-content :where(ul,ol){padding-inline-start:1.45em;}
body[data-ds="2031"] .history-note-content blockquote{
  margin:var(--ds-space-5) 0;padding:var(--ds-space-3) var(--ds-space-4);
  border-left:4px solid var(--ds-primary);border-radius:0 var(--ds-radius-md) var(--ds-radius-md) 0;
  background:var(--ds-surface-soft);color:var(--ds-text);
}
body[data-ds="2031"] .history-table-wrap{
  max-width:100%;overflow-x:auto;margin:var(--ds-space-5) 0 var(--ds-space-6);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);
  background:var(--ds-surface);-webkit-overflow-scrolling:touch;
}
body[data-ds="2031"] .history-note-content table{width:100%;min-width:650px;border-collapse:collapse;background:var(--ds-surface);}
body[data-ds="2031"] .history-note-content :where(th,td){
  padding:11px 12px;border:1px solid var(--ds-border);color:var(--ds-text);
  font-size:var(--ds-text-ui);line-height:1.6;text-align:left;vertical-align:top;
}
body[data-ds="2031"] .history-note-content th{background:var(--ds-surface-soft);color:var(--ds-heading);font-weight:800;}
body[data-ds="2031"] .history-note-nav{
  margin-top:var(--ds-space-8);padding-top:var(--ds-space-5);
  border-top:1px solid var(--ds-border);
}
body[data-ds="2031"] .history-note-nav a{color:var(--ds-primary);text-decoration:none;font-weight:800;}

/* =========================================================
   ANCIENT INDIA EDITORIAL PAGES
   ========================================================= */
body[data-ds="2031"] :where(.ancient-page,.topic-page) main{overflow:hidden;}
body[data-ds="2031"] :where(.ancient-hero,.topic-hero){
  padding:var(--ds-space-10) 0 var(--ds-space-12);
  background:var(--ds-surface-soft);color:var(--ds-heading);
}
body[data-ds="2031"] :where(.ancient-hero,.topic-hero)>.shell{
  width:min(var(--ds-content-max),calc(100% - 32px));margin-inline:auto;
}
body[data-ds="2031"] :where(.ancient-hero,.topic-hero) .crumb{
  display:flex;flex-wrap:wrap;gap:var(--ds-space-2);
  margin-bottom:var(--ds-space-5);color:var(--ds-text-muted);font-size:var(--ds-text-sm);
}
body[data-ds="2031"] :where(.ancient-hero,.topic-hero) .crumb a{color:var(--ds-heading);text-decoration:none;}
body[data-ds="2031"] .hero-grid{
  display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);
  gap:var(--ds-space-8);align-items:start;
}
body[data-ds="2031"] :where(.ancient-hero,.topic-hero) .kicker{
  display:inline-flex;align-items:center;gap:8px;min-height:32px;
  padding:0 var(--ds-space-3);border:1px solid rgba(255,255,255,.22);
  border-radius:var(--ds-radius-pill);background:rgba(255,255,255,.06);
  color:var(--ds-text);font-size:var(--ds-text-sm);font-weight:800;
}
body[data-ds="2031"] :where(.ancient-hero,.topic-hero) h1{
  margin:var(--ds-space-4) 0 var(--ds-space-3);color:var(--ds-heading);
  font-size:clamp(2.25rem,5vw,4.2rem);line-height:1.08;
}
body[data-ds="2031"] :where(.ancient-hero,.topic-hero) h1 span{
  display:block;margin-top:var(--ds-space-3);color:var(--ds-text);
  font-size:.42em;line-height:1.45;
}
body[data-ds="2031"] .hero-lead{max-width:75ch;margin:0;color:var(--ds-text);font-size:var(--ds-text-body);line-height:1.8;}
body[data-ds="2031"] .hero-actions{display:flex;flex-wrap:wrap;gap:var(--ds-space-2);margin-top:var(--ds-space-5);}
body[data-ds="2031"] .hero-actions .button{
  min-height:44px;display:inline-flex;align-items:center;padding:0 var(--ds-space-4);
  border:1px solid rgba(255,255,255,.28);border-radius:var(--ds-radius-md);
  background:rgba(255,255,255,.06);color:var(--ds-on-primary);text-decoration:none;font-weight:750;
}
body[data-ds="2031"] :where(.route-card,.exam-card){
  padding:var(--ds-space-5);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-card);background:var(--ds-surface);color:var(--ds-text);
  box-shadow:none;
}
body[data-ds="2031"] :where(.route-card,.exam-card)>small{display:block;color:var(--ds-text-muted);font-size:var(--ds-text-xs);font-weight:800;}
body[data-ds="2031"] :where(.route-card,.exam-card) h2{margin:var(--ds-space-2) 0;color:var(--ds-heading);font-size:var(--ds-text-h3);}
body[data-ds="2031"] :where(.route-card,.exam-card)>p{margin:0;color:var(--ds-text-muted);font-size:var(--ds-text-sm);line-height:1.6;}
body[data-ds="2031"] :where(.route-list,.demand-list){display:grid;gap:var(--ds-space-2);margin-top:var(--ds-space-4);}
body[data-ds="2031"] :where(.route-list,.demand-list)>div{
  display:grid;grid-template-columns:32px minmax(0,1fr);gap:var(--ds-space-2);
  padding:var(--ds-space-2);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-sm);background:var(--ds-surface-soft);
}
body[data-ds="2031"] :where(.route-list,.demand-list) b{
  width:28px;height:28px;display:grid;place-items:center;
  border-radius:var(--ds-radius-sm);background:var(--ds-surface-soft);color:var(--ds-heading);font-size:var(--ds-text-xs);
}
body[data-ds="2031"] :where(.route-list,.demand-list) strong{display:block;color:var(--ds-heading);font-size:var(--ds-text-sm);}
body[data-ds="2031"] :where(.route-list,.demand-list) span{display:block;margin-top:2px;color:var(--ds-text-muted);font-size:var(--ds-text-xs);}
body[data-ds="2031"] .status-note{
  margin-top:var(--ds-space-3);padding:var(--ds-space-3);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);
  background:var(--ds-surface-soft);color:var(--ds-text-muted);font-size:var(--ds-text-sm);line-height:1.6;
}
body[data-ds="2031"] .quick-facts{
  width:min(var(--ds-content-max),calc(100% - 32px));margin:-24px auto 0;
  position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  overflow:hidden;border:1px solid var(--ds-border);border-radius:var(--ds-radius-card);
  background:var(--ds-surface);box-shadow:none;
}
body[data-ds="2031"] .quick-facts>div{padding:var(--ds-space-4);border-right:1px solid var(--ds-border);}
body[data-ds="2031"] .quick-facts>div:last-child{border-right:0;}
body[data-ds="2031"] .quick-facts small{display:block;color:var(--ds-text-muted);font-size:var(--ds-text-xs);}
body[data-ds="2031"] .quick-facts strong{display:block;margin-top:4px;color:var(--ds-heading);font-size:var(--ds-text-sm);line-height:1.45;}

body[data-ds="2031"] .page-layout{
  width:min(var(--ds-content-max),calc(100% - 32px));margin-inline:auto;
  display:grid;grid-template-columns:240px minmax(0,1fr);
  gap:var(--ds-space-8);padding:var(--ds-space-10) 0 var(--ds-space-20);
}
body[data-ds="2031"] .toc-card{
  position:sticky;top:96px;padding:var(--ds-space-4);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);
  background:var(--ds-surface);box-shadow:none;
}
body[data-ds="2031"] .toc-card>span{display:block;margin-bottom:var(--ds-space-2);color:var(--ds-text-muted);font-size:var(--ds-text-xs);font-weight:800;}
body[data-ds="2031"] .toc-card a{
  display:block;padding:8px;border-radius:var(--ds-radius-sm);
  color:var(--ds-text-muted);font-size:var(--ds-text-sm);font-weight:700;text-decoration:none;line-height:1.45;
}
body[data-ds="2031"] .toc-card a:hover{background:var(--ds-surface-soft);color:var(--ds-primary);}
body[data-ds="2031"] .side-box{
  display:block;margin-top:var(--ds-space-3);padding:var(--ds-space-4);
  border-radius:var(--ds-radius-md);background:var(--ds-surface-soft);color:var(--ds-heading);
}
body[data-ds="2031"] .side-box small{display:block;color:var(--ds-text-muted);font-size:var(--ds-text-xs);}
body[data-ds="2031"] .side-box strong{display:block;margin:4px 0;color:var(--ds-heading);font-size:var(--ds-text-sm);}
body[data-ds="2031"] .side-box span{display:block;color:var(--ds-text);font-size:var(--ds-text-xs);line-height:1.5;}
body[data-ds="2031"] .article{min-width:0;}
body[data-ds="2031"] .section{
  scroll-margin-top:96px;margin-bottom:var(--ds-space-5);padding:var(--ds-space-6);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-card);
  background:var(--ds-surface);box-shadow:none;
}
body[data-ds="2031"] .section>.label{
  display:inline-block;margin-bottom:var(--ds-space-2);color:var(--ds-primary);
  font-size:var(--ds-text-xs);font-weight:850;letter-spacing:.05em;
}
body[data-ds="2031"] .section h2{margin:0 0 var(--ds-space-3);color:var(--ds-heading);font-size:var(--ds-text-h2);line-height:1.4;}
body[data-ds="2031"] .section h3{margin:var(--ds-space-5) 0 var(--ds-space-2);color:var(--ds-heading);font-size:var(--ds-text-h4);line-height:1.5;}
body[data-ds="2031"] .section :where(p,li){color:var(--ds-text);font-size:var(--ds-text-body);line-height:var(--ds-leading-body);}
body[data-ds="2031"] .section p{margin:0 0 1em;}
body[data-ds="2031"] :where(.highlight,.safe-note,.soft-note,.warning-note,.debate,.revision,.syllabus-strip,.content-status,.pyq-box,.next-step){
  margin:var(--ds-space-4) 0;padding:var(--ds-space-4);
  border:1px solid var(--ds-border);border-left:4px solid var(--ds-primary);
  border-radius:var(--ds-radius-md);background:var(--ds-surface-soft);color:var(--ds-text);
}
body[data-ds="2031"] :where(.source-grid,.dimension-grid,.hist-grid,.framework-grid,.seo-grid,.resource-grid,.related-grid,.grid2,.grid3,.phase-grid,.topic-grid){
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ds-space-3);margin:var(--ds-space-4) 0;
}
body[data-ds="2031"] .grid3{grid-template-columns:repeat(3,minmax(0,1fr));}
body[data-ds="2031"] :where(.mini-card,.related-card,.phase,.topic){
  padding:var(--ds-space-4);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-md);background:var(--ds-surface-soft);
}
body[data-ds="2031"] :where(.mini-card,.related-card,.phase,.topic) h3{margin:0 0 var(--ds-space-2);color:var(--ds-heading);font-size:var(--ds-text-h4);}
body[data-ds="2031"] :where(.mini-card,.related-card,.phase,.topic) p{margin:0;color:var(--ds-text);font-size:var(--ds-text-ui);line-height:1.65;}
body[data-ds="2031"] :where(.matrix,.timeline){max-width:100%;overflow-x:auto;margin:var(--ds-space-4) 0;-webkit-overflow-scrolling:touch;}
body[data-ds="2031"] .matrix table{width:100%;min-width:680px;border-collapse:collapse;}
body[data-ds="2031"] .matrix :where(th,td){padding:10px 12px;border:1px solid var(--ds-border);color:var(--ds-text);font-size:var(--ds-text-ui);line-height:1.6;text-align:left;vertical-align:top;}
body[data-ds="2031"] .matrix th{background:var(--ds-surface-soft);color:var(--ds-heading);}
body[data-ds="2031"] .timeline{display:grid;gap:var(--ds-space-2);}
body[data-ds="2031"] .time-row{
  display:grid;grid-template-columns:110px minmax(0,1fr);gap:var(--ds-space-3);
  padding:var(--ds-space-3);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-sm);background:var(--ds-surface-soft);
}
body[data-ds="2031"] .time-row strong{color:var(--ds-heading);}
body[data-ds="2031"] .answer-flow{display:grid;gap:var(--ds-space-2);margin-top:var(--ds-space-3);}
body[data-ds="2031"] .answer-flow>*{padding:var(--ds-space-3);border-left:3px solid var(--ds-primary);background:var(--ds-surface-soft);}
body[data-ds="2031"] .faq details{
  margin-top:var(--ds-space-2);padding:var(--ds-space-3);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-sm);background:var(--ds-surface-soft);
}
body[data-ds="2031"] .faq summary{cursor:pointer;color:var(--ds-heading);font-weight:800;}

/* Ancient landing-page topic browser */
body[data-ds="2031"] .topic-toolbar{
  display:flex;flex-wrap:wrap;gap:var(--ds-space-2);margin-bottom:var(--ds-space-4);
}
body[data-ds="2031"] .topic-group{
  margin-bottom:var(--ds-space-4);padding:var(--ds-space-4);
  border:1px solid var(--ds-border);border-radius:var(--ds-radius-md);background:var(--ds-surface-soft);
}
body[data-ds="2031"] .topic-title{margin:0 0 var(--ds-space-3);color:var(--ds-heading);font-size:var(--ds-text-h4);}
body[data-ds="2031"] .syllabus-list{display:grid;gap:var(--ds-space-2);}
body[data-ds="2031"] .syllabus-row{
  padding:var(--ds-space-3);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-sm);background:var(--ds-surface-soft);
}
body[data-ds="2031"] .study-flow{display:grid;gap:var(--ds-space-2);}
body[data-ds="2031"] .study-flow>*{padding:var(--ds-space-3);border-left:3px solid var(--ds-primary);background:var(--ds-surface-soft);}

/* =========================================================
   HISTORY OPTIONAL PYQ PAGE
   ========================================================= */
body[data-ds="2031"] .pyq6-main{padding:var(--ds-space-6) 0 var(--ds-space-20);}
body[data-ds="2031"] .pyq6-main>.as-shell{width:min(var(--ds-content-max),calc(100% - 32px));max-width:var(--ds-content-max);margin-inline:auto;}
body[data-ds="2031"] .ca-breadcrumb{
  display:flex;flex-wrap:wrap;gap:var(--ds-space-2);align-items:center;
  margin-bottom:var(--ds-space-5);color:var(--ds-text-muted);font-size:var(--ds-text-sm);
}
body[data-ds="2031"] .ca-breadcrumb a{color:inherit;text-decoration:none;}
body[data-ds="2031"] .pyq6-head{max-width:900px;padding:var(--ds-space-5) 0;border-bottom:1px solid var(--ds-border);margin-bottom:var(--ds-space-5);}
body[data-ds="2031"] .pyq6-head>span{color:var(--ds-primary);font-size:var(--ds-text-sm);font-weight:800;}
body[data-ds="2031"] .pyq6-head h1{margin:var(--ds-space-2) 0;color:var(--ds-heading);font-size:var(--ds-text-h1);}
body[data-ds="2031"] .pyq6-head p{margin:0;color:var(--ds-text-muted);font-size:var(--ds-text-body);line-height:1.7;}
body[data-ds="2031"] .pyq6-filters{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ds-space-3);margin-bottom:var(--ds-space-5);
}
body[data-ds="2031"] .pyq6-filters label{display:flex;flex-direction:column;gap:6px;color:var(--ds-text-muted);font-size:var(--ds-text-sm);font-weight:800;}
body[data-ds="2031"] .pyq6-filters select{
  min-height:44px;padding:0 var(--ds-space-3);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-sm);background:var(--ds-surface);color:var(--ds-text);
}
body[data-ds="2031"] .pyq6-count{margin:0 0 var(--ds-space-4);color:var(--ds-text-muted);font-size:var(--ds-text-sm);font-weight:800;}
body[data-ds="2031"] .pyq6-list{display:grid;gap:var(--ds-space-3);}
body[data-ds="2031"] .pyq6-card{
  padding:var(--ds-space-5);border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-card);background:var(--ds-surface);box-shadow:none;
}
body[data-ds="2031"] .pyq6-card[hidden]{display:none !important;}
body[data-ds="2031"] .pyq6-meta{display:flex;flex-wrap:wrap;gap:6px;}
body[data-ds="2031"] .pyq6-meta span{
  padding:4px 8px;border:1px solid var(--ds-border);border-radius:var(--ds-radius-pill);
  background:var(--ds-surface-soft);color:var(--ds-text-muted);font-size:var(--ds-text-xs);font-weight:800;
}
body[data-ds="2031"] .pyq6-card h2{margin:var(--ds-space-3) 0;color:var(--ds-heading);font-size:1.08rem;line-height:1.65;}
body[data-ds="2031"] .pyq6-card>a{color:var(--ds-primary);font-size:var(--ds-text-sm);font-weight:800;text-decoration:none;}

/* =========================================================
   DARK MODE
   ========================================================= */
html[data-theme="dark"] body[data-ds="2031"] :where(
  .chapter,.paper-chip,.note-head,.toc,.note-body,.history-note-content,
  .route-card,.exam-card,.quick-facts,.toc-card,.section,.pyq6-card
){
  background:var(--ds-surface);border-color:var(--ds-border);
}
html[data-theme="dark"] body[data-ds="2031"] :where(
  .index-note,.chapter-number,.topic-direct-link:hover,.status-note,
  .route-list>div,.demand-list>div,.highlight,.safe-note,.soft-note,.warning-note,
  .debate,.revision,.syllabus-strip,.content-status,.pyq-box,.next-step,
  .mini-card,.related-card,.phase,.topic,.time-row,.topic-group,.syllabus-row,
  .pyq6-meta span
){
  background:var(--ds-surface-soft);border-color:var(--ds-border);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:63.999rem){
  body[data-ds="2031"] .hero-grid{grid-template-columns:1fr;}
  body[data-ds="2031"] .page-layout{grid-template-columns:1fr;}
  body[data-ds="2031"] .toc-card{position:static;}
  body[data-ds="2031"] .quick-facts{grid-template-columns:repeat(2,minmax(0,1fr));}
  body[data-ds="2031"] .quick-facts>div{border-bottom:1px solid var(--ds-border);}
  body[data-ds="2031"] .grid3{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:47.999rem){
  body[data-ds="2031"] .history-index,
  body[data-ds="2031"] .note-wrap,
  body[data-ds="2031"] .history-note-shell,
  body[data-ds="2031"] .pyq6-main>.as-shell,
  body[data-ds="2031"] :where(.ancient-hero,.topic-hero)>.shell,
  body[data-ds="2031"] .page-layout,
  body[data-ds="2031"] .quick-facts{
    width:min(100% - 24px,var(--ds-content-max));
  }
  body[data-ds="2031"] .history-index{padding:var(--ds-space-5) 0 var(--ds-space-16);}
  body[data-ds="2031"] .history-head{align-items:flex-start;flex-direction:column;gap:var(--ds-space-2);}
  body[data-ds="2031"] .chapter-summary{grid-template-columns:32px minmax(0,1fr) 20px;padding:var(--ds-space-2) var(--ds-space-3);}
  body[data-ds="2031"] .chapter-content{padding:var(--ds-space-2) var(--ds-space-3) var(--ds-space-3) var(--ds-space-5);}
  body[data-ds="2031"] :where(.topic-direct-link,.topic-static){grid-template-columns:minmax(44px,auto) minmax(0,1fr) 18px;padding:7px;}
  body[data-ds="2031"] .topic-static{grid-template-columns:minmax(44px,auto) minmax(0,1fr);}
  body[data-ds="2031"] .toc ul{columns:1;}
  body[data-ds="2031"] .note-head,
  body[data-ds="2031"] .note-body,
  body[data-ds="2031"] .history-note-content{padding:18px 16px;}
  body[data-ds="2031"] .note-nav{grid-template-columns:1fr;}
  body[data-ds="2031"] .note-nav a:last-child{text-align:left;}
  body[data-ds="2031"] :where(.ancient-hero,.topic-hero){padding:var(--ds-space-7) 0 var(--ds-space-9);}
  body[data-ds="2031"] .quick-facts{grid-template-columns:1fr;margin-top:var(--ds-space-3);}
  body[data-ds="2031"] .quick-facts>div{border-right:0;}
  body[data-ds="2031"] .page-layout{padding:var(--ds-space-6) 0 var(--ds-space-16);}
  body[data-ds="2031"] .section{padding:var(--ds-space-4);}
  body[data-ds="2031"] :where(.source-grid,.dimension-grid,.hist-grid,.framework-grid,.seo-grid,.resource-grid,.related-grid,.grid2,.grid3,.phase-grid,.topic-grid){
    grid-template-columns:1fr;
  }
  body[data-ds="2031"] .time-row{grid-template-columns:1fr;}
  body[data-ds="2031"] .pyq6-filters{grid-template-columns:1fr;}
  body[data-ds="2031"] .pyq6-card{padding:var(--ds-space-4);}
}


/* History Optional Notes — separate from syllabus taxonomy */
body[data-ds="2031"] .history-notes-block{
  margin:0 0 var(--ds-space-8);
  padding:var(--ds-space-5);
  border:1px solid var(--ds-border);
  border-radius:var(--ds-radius-card);
  background:var(--ds-surface);
}
body[data-ds="2031"] .history-notes-head{
  margin:0 0 var(--ds-space-3);
}
body[data-ds="2031"] .history-notes-head>span{
  display:block;
  margin:0 0 var(--ds-space-1);
  color:var(--ds-primary-strong);
  font-size:var(--ds-text-xs);
  font-weight:850;
  letter-spacing:.04em;
}
body[data-ds="2031"] .history-notes-head h2{
  margin:0;
  color:var(--ds-heading);
  font-size:clamp(1.35rem,2.4vw,1.75rem);
  line-height:1.25;
}
body[data-ds="2031"] .history-notes-head p{
  margin:var(--ds-space-2) 0 0;
  color:var(--ds-text-muted);
  font-size:var(--ds-text-sm);
  line-height:1.6;
}
body[data-ds="2031"] .history-notes-list{
  border-top:1px solid var(--ds-border);
  padding-top:var(--ds-space-2);
}
body[data-ds="2031"] .history-syllabus-title{
  margin:0 0 var(--ds-space-4);
  color:var(--ds-heading);
  font-size:clamp(1.2rem,2vw,1.5rem);
}
@media (max-width:640px){
  body[data-ds="2031"] .history-notes-block{padding:var(--ds-space-4);}
}
