/* =======================================================================
   Sindhi Tokenizer — Documentation Website
   Design: restrained documentation aesthetic (Python Docs / Read the Docs)
   Light mode default; optional dark mode via [data-theme="dark"]
   ======================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,300;0,400;0,600;1,400&family=Source+Code+Pro:wght@400;500&family=Noto+Naskh+Arabic:wght@400;600&display=swap');

/* -- CSS Custom Properties ----------------------------------------- */
:root {
  --font-body:    'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'Source Code Pro', 'Consolas', 'Menlo', monospace;
  --font-arabic:  'Noto Naskh Arabic', 'Scheherazade New', serif;

  --color-bg:           #ffffff;
  --color-bg-sidebar:   #f7f7f7;
  --color-bg-code:      #f3f3f3;
  --color-bg-cn:        #eef5fb;
  --color-bg-cw:        #fdf6e3;
  --color-bg-cd:        #fdf0f0;
  --color-bg-ct:        #edfaf3;

  --color-text:         #1a1a1a;
  --color-text-muted:   #5a5a5a;
  --color-text-faint:   #888888;

  --color-link:         #2060a0;
  --color-link-hover:   #1a4a7a;
  --color-accent-light: #e8f0fa;

  --color-border:         #d8d8d8;
  --color-border-sidebar: #ddd;
  --color-pre-border:     #d0d0d0;
  --color-code-text:      #3a3a3a;

  --color-th-bg:    #f0f0f0;
  --color-tr-alt:   #fafafa;
  --color-tb:       #d8d8d8;

  --color-alink:    #e4edf7;
  --color-alink-c:  #174a80;

  --cn-b: #3b8acc;  --cw-b: #c0932a;  --cd-b: #c0392b;  --ct-b: #27ae60;

  --bc-bg: #e6f4ec; --bc-c: #1a5c2e;
  --bs-bg: #fdf0e0; --bs-c: #6b3600;
  --bm-bg: #e6edf8; --bm-c: #1a3a6b;
  --bd-bg: #fdecea; --bd-c: #c0392b;

  --sidebar-w:  256px;
  --toc-w:      200px;
  --hh:          48px;
  --cmax:       760px;

  --sp1: 4px;  --sp2: 8px;  --sp3: 12px;  --sp4: 16px;
  --sp5: 20px; --sp6: 24px; --sp8: 32px;  --sp10: 40px;

  --r-sm: 3px; --r-md: 5px;
  --tf: 120ms ease;
}

[data-theme="dark"] {
  --color-bg:           #1e1e1e;
  --color-bg-sidebar:   #252526;
  --color-bg-code:      #2a2a2a;
  --color-bg-cn: #1b2a38; --color-bg-cw: #2e2310;
  --color-bg-cd: #2e1212; --color-bg-ct: #122e1c;

  --color-text:         #d4d4d4;
  --color-text-muted:   #9d9d9d;
  --color-text-faint:   #666;

  --color-link:         #6baee8;
  --color-link-hover:   #90c4f0;
  --color-accent-light: #2a3d57;

  --color-border:         #3a3a3a;
  --color-border-sidebar: #3a3a3a;
  --color-pre-border:     #444;
  --color-code-text:      #ce9178;

  --color-th-bg: #2d2d2d; --color-tr-alt: #252525; --color-tb: #3a3a3a;
  --color-alink: #2a3d57; --color-alink-c: #90c4f0;

  --bc-bg: #1a3325; --bc-c: #6ac990;
  --bs-bg: #332211; --bs-c: #e0a060;
  --bm-bg: #162440; --bm-c: #80aae0;
  --bd-bg: #3a1515; --bd-c: #f08080;
}

/* -- Reset ------------------------------------------------------- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:16px; scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
body { font-family:var(--font-body); font-size:15px; line-height:1.65; color:var(--color-text); background:var(--color-bg); min-height:100vh; }

/* -- Header ---------------------------------------------------- */
.site-header {
  position:sticky; top:0; z-index:100; height:var(--hh);
  background:var(--color-bg-sidebar); border-bottom:1px solid var(--color-border);
  display:flex; align-items:center; padding:0 var(--sp4); gap:var(--sp4);
}
.header-brand {
  display:flex; align-items:center; gap:var(--sp2); text-decoration:none;
  color:var(--color-text); font-weight:600; font-size:0.95rem; white-space:nowrap; flex-shrink:0;
}
.header-brand:hover { color:var(--color-link); }
.header-brand-script { font-family:var(--font-arabic); font-size:1.15rem; color:var(--color-link); line-height:1; }
.header-sep { color:var(--color-text-faint); font-weight:300; }

.header-search { flex:1; min-width:0; max-width:360px; position:relative; }
.header-search input {
  width:100%; padding:5px 10px 5px 30px; font-family:var(--font-body); font-size:0.875rem;
  border:1px solid var(--color-border); border-radius:var(--r-sm);
  background:var(--color-bg); color:var(--color-text); outline:none;
}
.header-search input:focus { border-color:var(--color-link); box-shadow:0 0 0 2px rgba(32,96,160,.15); }
.header-search .si { position:absolute; left:8px; top:50%; transform:translateY(-50%); color:var(--color-text-faint); pointer-events:none; }

.header-actions { display:flex; align-items:center; gap:var(--sp2); margin-left:auto; flex-shrink:0; }
.header-btn {
  display:inline-flex; align-items:center; gap:3px; padding:4px 10px;
  font-family:var(--font-body); font-size:0.8125rem; color:var(--color-text-muted);
  background:transparent; border:1px solid var(--color-border); border-radius:var(--r-sm);
  cursor:pointer; text-decoration:none; white-space:nowrap;
  transition:color var(--tf),border-color var(--tf),background var(--tf);
}
.header-btn:hover { color:var(--color-link); border-color:var(--color-link); background:var(--color-accent-light); }
.nav-toggle { display:none; background:none; border:none; cursor:pointer; padding:var(--sp1); color:var(--color-text); flex-shrink:0; }

/* -- Page Layout ----------------------------------------------- */
.page-layout {
  display:grid;
  grid-template-columns:var(--sidebar-w) 1fr var(--toc-w);
  grid-template-areas:"sidebar main toc";
  min-height:calc(100vh - var(--hh));
  max-width:1440px; margin:0 auto;
}

/* -- Sidebar --------------------------------------------------- */
.sidebar {
  grid-area:sidebar; position:sticky; top:var(--hh);
  height:calc(100vh - var(--hh)); overflow-y:auto;
  background:var(--color-bg-sidebar); border-right:1px solid var(--color-border-sidebar);
  padding:var(--sp4) 0; scrollbar-width:thin;
}
.sidebar::-webkit-scrollbar { width:4px; }
.sidebar::-webkit-scrollbar-thumb { background:var(--color-border); border-radius:2px; }

.nav-section { margin-bottom:var(--sp4); }
.nav-section-title {
  padding:var(--sp2) var(--sp4); font-size:0.7rem; font-weight:600;
  text-transform:uppercase; letter-spacing:0.08em; color:var(--color-text-faint);
}
.nav-link {
  display:block; padding:5px var(--sp4) 5px var(--sp6); font-size:0.875rem;
  color:var(--color-text); text-decoration:none;
  border-left:2px solid transparent;
  transition:color var(--tf),background var(--tf),border-color var(--tf); line-height:1.4;
}
.nav-link:hover { color:var(--color-link); background:var(--color-accent-light); }
.nav-link.active { color:var(--color-alink-c); border-left-color:var(--color-link); background:var(--color-alink); font-weight:600; }
.nav-link-top { padding-left:var(--sp4); font-weight:600; }

/* -- Main Content ---------------------------------------------- */
.main-content { grid-area:main; min-width:0; padding:var(--sp8) var(--sp10); }
.doc-article  { max-width:var(--cmax); }

/* -- TOC ------------------------------------------------------- */
.toc-sidebar {
  grid-area:toc; position:sticky; top:var(--hh);
  height:calc(100vh - var(--hh)); overflow-y:auto;
  padding:var(--sp8) var(--sp4); font-size:0.8125rem; scrollbar-width:thin;
}
.toc-title { font-size:0.7rem; font-weight:600; text-transform:uppercase; letter-spacing:0.08em; color:var(--color-text-faint); margin-bottom:var(--sp2); }
.toc-list  { list-style:none; }
.toc-item  { margin-bottom:2px; }
.toc-link  { display:block; padding:2px 0 2px var(--sp2); color:var(--color-text-muted); text-decoration:none; border-left:2px solid transparent; transition:color var(--tf),border-color var(--tf); line-height:1.3; }
.toc-link:hover { color:var(--color-link); }
.toc-link.active { color:var(--color-link); border-left-color:var(--color-link); }
.toc-link-h3 { padding-left:20px; font-size:0.76rem; }

/* -- Typography ------------------------------------------------ */
.doc-article h1 { font-size:1.75rem; font-weight:600; line-height:1.25; margin-bottom:var(--sp4); padding-bottom:var(--sp3); border-bottom:1px solid var(--color-border); }
.doc-article h2 { font-size:1.3rem; font-weight:600; margin-top:var(--sp10); margin-bottom:var(--sp4); padding-bottom:var(--sp2); border-bottom:1px solid var(--color-border); }
.doc-article h3 { font-size:1.05rem; font-weight:600; margin-top:var(--sp6); margin-bottom:var(--sp2); }
.doc-article h4 { font-size:0.95rem; font-weight:600; margin-top:var(--sp4); margin-bottom:var(--sp2); }
.doc-article p  { margin-bottom:var(--sp4); max-width:68ch; }
.doc-article ul,.doc-article ol { margin-bottom:var(--sp4); padding-left:var(--sp6); }
.doc-article li { margin-bottom:2px; }
.doc-article a  { color:var(--color-link); text-decoration:none; border-bottom:1px solid transparent; }
.doc-article a:hover { color:var(--color-link-hover); border-bottom-color:var(--color-link-hover); }
.doc-article strong { font-weight:600; }
.doc-article dl { margin-bottom:var(--sp4); }
.doc-article dt { font-weight:600; margin-top:var(--sp3); }
.doc-article dd { margin-left:var(--sp6); color:var(--color-text-muted); }

.doc-article h2[id],.doc-article h3[id] { scroll-margin-top:calc(var(--hh) + 16px); }

.page-meta { font-size:0.8125rem; color:var(--color-text-faint); margin-bottom:var(--sp6); display:flex; flex-wrap:wrap; gap:var(--sp3); align-items:center; }
.page-meta-tag { padding:2px 8px; font-size:0.75rem; border-radius:var(--r-sm); border:1px solid var(--color-border); color:var(--color-text-muted); }

/* -- Code ------------------------------------------------------ */
code { font-family:var(--font-mono); font-size:0.875em; background:var(--color-bg-code); color:var(--color-code-text); padding:1px 4px; border-radius:var(--r-sm); border:1px solid var(--color-border); }

.code-block { margin:var(--sp4) 0 var(--sp6); border:1px solid var(--color-pre-border); border-radius:var(--r-md); overflow:hidden; }
.code-header { display:flex; align-items:center; justify-content:space-between; padding:6px var(--sp4); background:var(--color-th-bg); border-bottom:1px solid var(--color-pre-border); font-size:0.75rem; font-family:var(--font-mono); color:var(--color-text-muted); }
.code-block pre { margin:0; padding:var(--sp4); overflow-x:auto; background:var(--color-bg-code); -webkit-overflow-scrolling:touch; }
.code-block pre code { font-family:var(--font-mono); font-size:0.85rem; background:none; border:none; padding:0; color:var(--color-text); white-space:pre; }

.btn-copy { padding:3px 8px; font-size:0.75rem; font-family:var(--font-body); color:var(--color-text-muted); background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--r-sm); cursor:pointer; transition:color var(--tf),background var(--tf); }
.btn-copy:hover { color:var(--color-link); background:var(--color-accent-light); border-color:var(--color-link); }

/* -- Tables ---------------------------------------------------- */
.table-wrap { overflow-x:auto; margin:var(--sp4) 0 var(--sp6); -webkit-overflow-scrolling:touch; border:1px solid var(--color-tb); border-radius:var(--r-md); }
.data-table { width:100%; border-collapse:collapse; font-size:0.875rem; }
.data-table th { padding:8px 12px; text-align:left; font-weight:600; font-size:0.8rem; background:var(--color-th-bg); border-bottom:2px solid var(--color-tb); white-space:nowrap; }
.data-table td { padding:7px 12px; border-bottom:1px solid var(--color-tb); vertical-align:top; }
.data-table tr:last-child td { border-bottom:none; }
.data-table tbody tr:nth-child(even) td { background:var(--color-tr-alt); }
.data-table tbody tr.row-custom   td { background:#f0f8f4; }
.data-table tbody tr.row-flagship td { background:#eaf2fb; }
[data-theme="dark"] .data-table tbody tr.row-custom   td { background:#142a1e; }
[data-theme="dark"] .data-table tbody tr.row-flagship td { background:#122340; }

.type-badge { display:inline-block; padding:1px 6px; font-size:0.72rem; font-weight:600; border-radius:3px; white-space:nowrap; }
.tb-custom  { color:var(--bc-c); background:var(--bc-bg); }
.tb-sindhi  { color:var(--bs-c); background:var(--bs-bg); }
.tb-multi   { color:var(--bm-c); background:var(--bm-bg); }
.tb-defect  { color:var(--bd-c); background:var(--bd-bg); }

/* -- Callouts -------------------------------------------------- */
.callout { margin:var(--sp4) 0 var(--sp6); padding:var(--sp3) var(--sp4); border-left:4px solid; border-radius:0 var(--r-md) var(--r-md) 0; font-size:0.9rem; }
.callout-title { font-weight:600; margin-bottom:var(--sp1); font-size:0.875rem; }
.callout-note   { background:var(--color-bg-cn); border-color:var(--cn-b); }
.callout-warn   { background:var(--color-bg-cw); border-color:var(--cw-b); }
.callout-danger { background:var(--color-bg-cd); border-color:var(--cd-b); }
.callout-tip    { background:var(--color-bg-ct); border-color:var(--ct-b); }
.callout-note   .callout-title { color:var(--cn-b); }
.callout-warn   .callout-title { color:var(--cw-b); }
.callout-danger .callout-title { color:var(--cd-b); }
.callout-tip    .callout-title { color:var(--ct-b); }

/* -- Sindhi text ----------------------------------------------- */
.sd { font-family:var(--font-arabic); font-size:1.05em; direction:rtl; unicode-bidi:embed; }

/* -- Benchmark Toolbar ----------------------------------------- */
.benchmark-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp3); margin-bottom:var(--sp4); }
.filter-tabs { display:flex; flex-wrap:wrap; gap:var(--sp1); }
.filter-tab { padding:4px 10px; font-size:0.8125rem; font-family:var(--font-body); color:var(--color-text-muted); background:var(--color-bg); border:1px solid var(--color-border); border-radius:var(--r-sm); cursor:pointer; transition:color var(--tf),background var(--tf),border-color var(--tf); }
.filter-tab:hover { color:var(--color-link); border-color:var(--color-link); }
.filter-tab.active { color:var(--color-link); background:var(--color-accent-light); border-color:var(--color-link); font-weight:600; }
.table-search { padding:4px 8px; font-family:var(--font-body); font-size:0.8125rem; border:1px solid var(--color-border); border-radius:var(--r-sm); background:var(--color-bg); color:var(--color-text); outline:none; width:200px; }
.table-search:focus { border-color:var(--color-link); box-shadow:0 0 0 2px rgba(32,96,160,.12); }

/* -- Playground ----------------------------------------------- */
.playground { border:1px solid var(--color-border); border-radius:var(--r-md); background:var(--color-bg); overflow:hidden; margin:var(--sp4) 0 var(--sp6); }
.playground-header { padding:var(--sp3) var(--sp4); background:var(--color-th-bg); border-bottom:1px solid var(--color-border); font-size:0.8125rem; font-weight:600; color:var(--color-text-muted); }
.playground-body { padding:var(--sp4); }

.form-row { display:flex; gap:var(--sp4); margin-bottom:var(--sp3); flex-wrap:wrap; }
.form-group { display:flex; flex-direction:column; gap:var(--sp1); flex:1; min-width:200px; }
.form-label { font-size:0.8125rem; font-weight:600; color:var(--color-text-muted); }
.form-textarea { width:100%; padding:var(--sp2) var(--sp3); font-family:var(--font-arabic); font-size:1rem; direction:rtl; border:1px solid var(--color-border); border-radius:var(--r-sm); background:var(--color-bg); color:var(--color-text); resize:vertical; outline:none; line-height:1.7; }
.form-textarea:focus { border-color:var(--color-link); }
.form-select { padding:6px var(--sp3); font-family:var(--font-body); font-size:0.875rem; border:1px solid var(--color-border); border-radius:var(--r-sm); background:var(--color-bg); color:var(--color-text); outline:none; cursor:pointer; }
.form-select:focus { border-color:var(--color-link); }

.sample-pills { display:flex; flex-wrap:wrap; gap:var(--sp1); margin-top:var(--sp2); }
.pill-btn { padding:2px 8px; font-size:0.75rem; font-family:var(--font-body); color:var(--color-text-muted); background:var(--color-bg-code); border:1px solid var(--color-border); border-radius:12px; cursor:pointer; transition:color var(--tf),background var(--tf); }
.pill-btn:hover,.pill-btn.active { color:var(--color-link); background:var(--color-accent-light); border-color:var(--color-link); }

.token-output-box { min-height:60px; padding:var(--sp3); border:1px solid var(--color-border); border-radius:var(--r-sm); background:var(--color-bg-code); display:flex; flex-wrap:wrap; gap:4px; align-items:flex-start; font-family:var(--font-arabic); direction:rtl; }
.token-chip { display:inline-flex; flex-direction:column; align-items:center; padding:2px 5px; border-radius:3px; font-size:0.9rem; line-height:1.4; color:#fff; }
.token-id { font-family:var(--font-mono); font-size:0.62rem; opacity:0.75; direction:ltr; }

.playground-stats { display:flex; flex-wrap:wrap; gap:var(--sp4); margin-top:var(--sp4); padding-top:var(--sp3); border-top:1px solid var(--color-border); }
.pg-stat { display:flex; flex-direction:column; gap:2px; }
.pg-stat-val { font-size:1.3rem; font-weight:600; font-family:var(--font-mono); color:var(--color-text); }
.pg-stat-lbl { font-size:0.75rem; color:var(--color-text-faint); }

/* -- FAQ ------------------------------------------------------- */
.faq-list { border:1px solid var(--color-border); border-radius:var(--r-md); overflow:hidden; margin:var(--sp4) 0; }
.faq-item { border-bottom:1px solid var(--color-border); }
.faq-item:last-child { border-bottom:none; }
.faq-question { width:100%; display:flex; align-items:center; justify-content:space-between; padding:var(--sp3) var(--sp4); font-family:var(--font-body); font-size:0.9rem; font-weight:600; color:var(--color-text); background:var(--color-bg); border:none; cursor:pointer; text-align:left; transition:background var(--tf); }
.faq-question:hover { background:var(--color-tr-alt); }
.faq-chevron { flex-shrink:0; transition:transform 200ms ease; color:var(--color-text-faint); }
.faq-item.open .faq-chevron { transform:rotate(180deg); }
.faq-answer { display:none; padding:0 var(--sp4) var(--sp4); font-size:0.9rem; color:var(--color-text-muted); line-height:1.65; background:var(--color-bg); }
.faq-item.open .faq-answer { display:block; }

/* -- Authors --------------------------------------------------- */
.author-list { margin:var(--sp4) 0; }
.author-item { display:flex; align-items:flex-start; gap:var(--sp3); padding:var(--sp3) 0; border-bottom:1px solid var(--color-border); }
.author-item:last-child { border-bottom:none; }
.author-initials { flex-shrink:0; width:36px; height:36px; border-radius:50%; background:var(--color-accent-light); color:var(--color-link); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:0.8rem; border:1px solid var(--color-border); }
.author-name { font-weight:600; font-size:0.9rem; }
.author-role { font-size:0.82rem; color:var(--color-text-muted); }
.author-links { display:flex; gap:var(--sp2); margin-top:4px; flex-wrap:wrap; }
.author-link { font-size:0.8rem; color:var(--color-link); text-decoration:none; display:inline-flex; align-items:center; gap:3px; }
.author-link:hover { text-decoration:underline; }

/* -- Repo tree ------------------------------------------------- */
.repo-tree { font-family:var(--font-mono); font-size:0.83rem; background:var(--color-bg-code); border:1px solid var(--color-border); border-radius:var(--r-md); padding:var(--sp4); overflow-x:auto; white-space:pre; line-height:1.7; margin:var(--sp4) 0 var(--sp6); }

/* -- Intro box ------------------------------------------------- */
.intro-box { padding:var(--sp5) var(--sp6); background:var(--color-bg-cn); border-left:4px solid var(--color-link); border-radius:0 var(--r-md) var(--r-md) 0; margin-bottom:var(--sp6); }
.intro-box p { margin-bottom:var(--sp2); max-width:none; }
.intro-box p:last-child { margin-bottom:0; }

/* -- Quick nav ------------------------------------------------- */
.quick-nav { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:var(--sp3); margin:var(--sp4) 0 var(--sp6); }
.quick-nav-card { padding:var(--sp3) var(--sp4); border:1px solid var(--color-border); border-radius:var(--r-md); text-decoration:none; color:var(--color-text); background:var(--color-bg); transition:border-color var(--tf),background var(--tf); display:block; }
.quick-nav-card:hover { border-color:var(--color-link); background:var(--color-accent-light); }
.quick-nav-card-title { font-weight:600; font-size:0.9rem; color:var(--color-link); margin-bottom:3px; }
.quick-nav-card-desc  { font-size:0.8rem; color:var(--color-text-muted); line-height:1.4; }

/* -- Footer ---------------------------------------------------- */
.site-footer { border-top:1px solid var(--color-border); padding:var(--sp4) var(--sp10); font-size:0.8125rem; color:var(--color-text-faint); background:var(--color-bg-sidebar); display:flex; flex-wrap:wrap; gap:var(--sp4); justify-content:space-between; align-items:center; }
.site-footer a { color:var(--color-link); text-decoration:none; }
.site-footer a:hover { text-decoration:underline; }

/* -- Toast ----------------------------------------------------- */
.toast-notice { position:fixed; bottom:var(--sp6); right:var(--sp6); background:var(--color-text); color:var(--color-bg); padding:8px 16px; border-radius:var(--r-md); font-size:0.875rem; opacity:0; pointer-events:none; transform:translateY(8px); transition:opacity 200ms,transform 200ms; z-index:9999; }
.toast-notice.show { opacity:1; transform:translateY(0); pointer-events:auto; }

/* -- Sidebar overlay ------------------------------------------- */
.sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:90; }
.sidebar-overlay.active { display:block; }

/* -- Responsive 1100px ----------------------------------------- */
@media (max-width:1100px){
  .page-layout { grid-template-columns:var(--sidebar-w) 1fr; grid-template-areas:"sidebar main"; }
  .toc-sidebar { display:none; }
}

/* -- Responsive 768px ------------------------------------------ */
@media (max-width:768px){
  :root { --sidebar-w:260px; }
  .page-layout { grid-template-columns:1fr; grid-template-areas:"main"; }
  .sidebar { position:fixed; top:var(--hh); left:0; height:calc(100vh - var(--hh)); z-index:95; transform:translateX(-100%); transition:transform 200ms ease; box-shadow:2px 0 12px rgba(0,0,0,.15); }
  .sidebar.open { transform:translateX(0); }
  .nav-toggle { display:flex; }
  .main-content { padding:var(--sp5) var(--sp4); }
  .site-footer { padding:var(--sp4); flex-direction:column; align-items:flex-start; gap:var(--sp2); }
  .quick-nav { grid-template-columns:1fr; }
  .benchmark-toolbar { flex-direction:column; align-items:flex-start; }
  .table-search { width:100%; }
  .header-search { display:none; }
  .form-row { flex-direction:column; }
  .playground-stats { gap:var(--sp3); }
}

/* -- Responsive 480px ------------------------------------------ */
@media (max-width:480px){
  .main-content { padding:var(--sp4) var(--sp3); }
  .doc-article h1 { font-size:1.4rem; }
  .doc-article h2 { font-size:1.15rem; }
  .data-table { font-size:0.8rem; }
  .data-table th,.data-table td { padding:6px 8px; }
}

/* -- Print ----------------------------------------------------- */
@media print {
  .site-header,.sidebar,.toc-sidebar,.site-footer,.nav-toggle { display:none!important; }
  .page-layout { display:block; }
  .main-content { padding:0; }
  .doc-article { max-width:none; }
}