/* CLT Docs Stylesheet - Updated to match index.html design */
:root {
  /* Premium Game Interface Color Palette - matching index.html */
  --bg0: #060812;
  --bg1: #070A10;
  --bg: #0b1220;
  --bg-alt: #111b2d;
  --bg-code: #141e30;
  --panel: rgba(17, 22, 34, .66);
  --panel2: rgba(12, 16, 26, .55);
  --glass: rgba(255,255,255,.045);
  --glass2: rgba(255,255,255,.03);
  
  /* Borders */
  --border: rgba(255,255,255,.11);
  --border-strong: rgba(255,255,255,.16);
  --stroke: rgba(255,255,255,.11);
  --stroke2: rgba(255,255,255,.08);
  --stroke3: rgba(255,255,255,.05);
  
  /* Text colors */
  --text: #EAF1FB;
  --text-dim: #A7B2C6;
  --muted: #A7B2C6;
  --muted2: #7E8AA0;
  
  /* Accent Colors - matching index.html */
  --accent: #2EFF7A;
  --accent-rgb: 46,255,122;
  --green: #2EFF7A;
  --cyan: #00D1FF;
  --gold: #FFD36B;
  --rose: #FF5E7B;
  
  --danger: #ef4444;
  --warn: #f59e0b;
  
  /* Radius */
  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;
  --r12: 12px;
  --r16: 16px;
  --r20: 20px;
  --r24: 24px;
  --r28: 28px;
  
  /* Shadows - matching index.html */
  --shadow: 0 26px 86px rgba(0,0,0,.60);
  --shadow2: 0 12px 36px rgba(0,0,0,.40);
  --shadow3: 0 6px 18px rgba(0,0,0,.28);
  
  --sidebar-w: 280px;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin:0; padding:0; -webkit-font-smoothing: antialiased; }

body { 
  font-size: 15px; 
  line-height: 1.55;
  color: var(--text);
  background:
    radial-gradient(1200px 680px at 14% 10%, rgba(46,255,122,.18), transparent 62%),
    radial-gradient(1200px 680px at 86% 10%, rgba(0,209,255,.16), transparent 62%),
    radial-gradient(980px 640px at 50% 92%, rgba(255,211,107,.12), transparent 66%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 55%, var(--bg1));
  min-height: 100vh;
}

/* ==========================================
   AMBIENT BACKGROUND EFFECTS
   ========================================== */

.blobs { position: fixed; inset: 0; pointer-events: none; z-index: -3; }
.blob {
  position: absolute;
  width: 560px;
  height: 560px;
  filter: blur(46px);
  opacity: .22;
  border-radius: 50%;
}
.blob.a {
  left: -150px;
  top: -140px;
  background: radial-gradient(circle at 30% 30%, rgba(46,255,122,.95), rgba(46,255,122,0) 66%);
  animation: floatA 14s ease-in-out infinite;
}
.blob.b {
  right: -190px;
  top: -110px;
  background: radial-gradient(circle at 30% 30%, rgba(0,209,255,.92), rgba(0,209,255,0) 66%);
  animation: floatB 16s ease-in-out infinite;
}
.blob.c {
  left: 36%;
  bottom: -250px;
  width: 700px;
  height: 700px;
  background: radial-gradient(circle at 30% 30%, rgba(255,211,107,.85), rgba(255,211,107,0) 70%);
  animation: floatC 18s ease-in-out infinite;
}

@keyframes floatA { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(46px,30px) scale(1.05); } }
@keyframes floatB { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-40px,34px) scale(1.04); } }
@keyframes floatC { 0%,100% { transform: translate(-10px,0) scale(1); } 50% { transform: translate(18px,-26px) scale(1.03); } }

/* Noise overlay */
.noise {
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .06;
  mix-blend-mode: overlay;
  z-index: -2;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="260" height="260"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency=".85" numOctaves="3" stitchTiles="stitch"/></filter><rect width="260" height="260" filter="url(%23n)" opacity=".35"/></svg>');
  background-size: 260px 260px;
}

/* Subtle stars */
.stars {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -4;
  opacity: .55;
  background-image:
    radial-gradient(2px 2px at 20% 30%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(1px 1px at 40% 70%, rgba(255,255,255,.25), transparent 60%),
    radial-gradient(1px 1px at 70% 40%, rgba(255,255,255,.22), transparent 60%),
    radial-gradient(2px 2px at 85% 65%, rgba(255,255,255,.30), transparent 60%);
  animation: drift 18s linear infinite;
}
@keyframes drift { 0% { transform: translateY(0); } 100% { transform: translateY(18px); } }

/* ==========================================
   TOPBAR - Glassmorphism style
   ========================================== */

.topbar { 
  position: sticky; 
  top:0; 
  z-index:60; 
  height:64px; 
  display:flex; 
  align-items:center; 
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  background: linear-gradient(180deg, rgba(7,10,16,.82), rgba(7,10,16,.40));
  border-bottom: 1px solid var(--stroke3);
  padding:0 22px; 
  gap:20px; 
}

.topbar .logo { 
  font-weight: 820;
  letter-spacing: .2px;
  font-size: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.topbar .logo img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
}

.topbar .logo-ring {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--green), var(--cyan));
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 5px rgba(46,255,122,.10), 0 0 22px rgba(46,255,122,.18);
}

.topnav { display:flex; align-items:center; gap:14px; flex:1; justify-content: flex-end; }
.topnav a { 
  color: var(--muted); 
  text-decoration:none; 
  font-size:13px; 
  padding:8px 12px; 
  border-radius: 12px;
  border:1px solid transparent;
  transition: all .16s ease;
}
.topnav a:hover { 
  color: var(--text); 
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.06);
}

.version button { 
  background: rgba(255,255,255,.04); 
  color: var(--muted); 
  font: 600 12px/1.2 inherit; 
  border: 1px solid rgba(255,255,255,.10);
  padding: 8px 12px; 
  border-radius: 12px;
  cursor: pointer;
  transition: all .14s ease;
}
.version button:hover {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
}
.version button.active { 
  background: linear-gradient(135deg, var(--green), rgba(0,209,255,.40));
  color: #04110A; 
  border-color: rgba(46,255,122,.42);
  font-weight: 720;
}

.lang-switch select { 
  background: rgba(255,255,255,.04); 
  border: 1px solid rgba(255,255,255,.10);
  color: var(--text); 
  font: 600 13px/1 inherit; 
  padding: 10px 12px; 
  border-radius: 12px;
  cursor: pointer;
  transition: all .14s ease;
  outline: none;
}
.lang-switch select:hover { 
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
}
.lang-switch select:focus { 
  border-color: var(--cyan);
  box-shadow: 0 0 0 2px rgba(0,209,255,.15);
}
.lang-switch select option {
  background: #1a1f2e;
  color: var(--text);
}

/* Search */
.search-container { position:relative; }
.search-container input { 
  width: 200px; 
  background: rgba(255,255,255,.04); 
  border: 1px solid rgba(255,255,255,.10);
  color: var(--text); 
  font: 500 13px/1 inherit; 
  padding: 10px 12px 10px 36px; 
  border-radius: 12px;
  outline: none;
  transition: all .14s ease;
}
.search-container input:hover { 
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
}
.search-container input:focus { 
  border-color: var(--cyan);
  box-shadow: 0 0 0 2px rgba(0,209,255,.15);
}
.search-container input::placeholder { color: var(--muted2); }
.search-container::before { 
  content:"🔍"; 
  position:absolute; 
  left:12px; 
  top:50%; 
  transform:translateY(-50%); 
  font-size: 12px;
  opacity: .7;
}

.search-results { 
  position:absolute; 
  top:48px; 
  left:0; 
  right:0; 
  background: var(--panel);
  backdrop-filter: blur(16px);
  border: 1px solid var(--stroke);
  border-radius: var(--radius);
  padding: 8px;
  box-shadow: var(--shadow2);
  max-height: 360px; 
  overflow-y:auto; 
  display:none;
  z-index: 100;
}
.search-results.active { display:block; }
.search-results button { 
  width:100%; 
  display:block; 
  background:none; 
  border:0; 
  text-align:left; 
  padding: 10px 12px;
  color: var(--muted); 
  font: 500 13px/1.3 inherit; 
  cursor:pointer;
  border-radius: 8px;
  transition: all .14s ease;
}
.search-results button:hover { 
  background: rgba(255,255,255,.06); 
  color: var(--text); 
}

/* ==========================================
   LAYOUT
   ========================================== */

.layout { 
  display:flex; 
  align-items:stretch; 
  min-height:calc(100vh - 64px); 
  position: relative;
}

/* ==========================================
   SIDEBAR - Glass style
   ========================================== */

.sidebar { 
  width: var(--sidebar-w); 
  border-right: 1px solid var(--stroke3);
  background: linear-gradient(180deg, rgba(16,21,34,.62), rgba(11,15,26,.52));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  padding: 20px 0 24px; 
  position: sticky; 
  top: 64px; 
  height: calc(100vh - 64px); 
  overflow-y: auto; 
  scrollbar-width: thin; 
  scrollbar-color: rgba(46,255,122,.2) transparent;
}

.sidebar-inner { padding: 0 16px; }
.sidebar-title { 
  font: 750 11px/1.1 inherit; 
  text-transform: uppercase; 
  letter-spacing: .10em; 
  color: var(--muted2); 
  margin: 0 0 12px;
  padding: 0 12px;
}

.nav-tree { list-style:none; margin:0; padding:0; display:block; }
.nav-tree a { 
  display: flex; 
  align-items: center; 
  gap: 10px; 
  text-decoration: none; 
  font: 600 13px/1.35 inherit; 
  padding: 10px 12px;
  color: var(--muted); 
  border-radius: 12px;
  border: 1px solid transparent;
  transition: all .16s ease;
  margin: 2px 0;
}
.nav-tree a:hover { 
  background: rgba(255,255,255,.05); 
  color: var(--text);
  border-color: rgba(255,255,255,.06);
}
.nav-tree a.active { 
  background: rgba(46,255,122,.12); 
  color: var(--green); 
  border-color: rgba(46,255,122,.25);
}
.nav-tree a .icon { width:16px; height:16px; display:inline-block; opacity:.85; }

.nav-group { margin:16px 0 8px; padding-top:12px; border-top:1px solid rgba(255,255,255,.05); }
.nav-group:first-child { margin-top:0; border-top:0; padding-top:0; }
.nav-group-title { 
  font: 750 10px/1.15 inherit; 
  letter-spacing: .10em; 
  text-transform: uppercase; 
  color: var(--muted2); 
  padding: 0 12px 8px;
}

/* ==========================================
   CONTENT AREA
   ========================================== */

.content-area { 
  flex:1; 
  min-width:0; 
  padding: 36px clamp(32px,4vw,60px) 80px; 
  position:relative; 
}

.doc-article { 
  max-width: 880px; 
  font: 400 15px/1.65 inherit; 
}

.doc-article h1, .doc-article h2, .doc-article h3, .doc-article h4 { 
  font-weight: 850; 
  letter-spacing: -.3px; 
  line-height: 1.25; 
  scroll-margin-top: 84px; 
  position: relative; 
}
.doc-article h1 { font-size: clamp(1.9rem, 2.3vw, 2.55rem); margin:0 0 1rem; }
.doc-article h2 { font-size: clamp(1.35rem, 1.9vw, 1.7rem); margin:2.2rem 0 .85rem; }
.doc-article h3 { font-size: clamp(1.08rem, 1.4vw, 1.25rem); margin:1.9rem 0 .7rem; }
.doc-article h4 { font-size: 1.02rem; margin:1.4rem 0 .65rem; }

.doc-article p { margin:0 0 1.05rem; }
.doc-article p:empty { display:none; }

.doc-article code, .doc-article pre { 
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; 
  background: rgba(255,255,255,.04); 
  color: var(--cyan); 
  font-size: 13px; 
}
.doc-article code { 
  padding: 3px 7px; 
  border-radius: 8px; 
  border: 1px solid rgba(255,255,255,.10); 
}
.doc-article pre { 
  padding: 16px 18px; 
  border-radius: 16px; 
  border: 1px solid rgba(255,255,255,.10); 
  overflow: auto; 
  position: relative; 
}
.doc-article pre code { background:none; border:0; padding:0; color: var(--text); }

.doc-article a { color: var(--cyan); text-decoration:none; transition: color .14s ease; }
.doc-article a:hover { color: var(--green); }

.doc-article blockquote { 
  margin: 1.4rem 0; 
  padding: 16px 20px 16px 18px;
  background: linear-gradient(180deg, rgba(16,21,34,.62), rgba(11,15,26,.52));
  border: 1px solid rgba(255,255,255,.10);
  border-left: 4px solid var(--green);
  border-radius: 0 16px 16px 0;
  color: var(--muted);
}

.doc-article ul, .doc-article ol { padding-left: 1.35rem; margin: 0 0 1rem; }
.doc-article li { margin: .35rem 0; color: var(--muted); }

.doc-article hr { 
  border:0; 
  height:1px; 
  background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.15), rgba(255,255,255,.05)); 
  margin: 3rem 0 2.2rem; 
}

.doc-article table { 
  border-collapse: collapse; 
  width: 100%; 
  margin: 1.4rem 0; 
  font-size: 14px; 
  display: block; 
  overflow-x: auto; 
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
}
.doc-article th, .doc-article td { 
  border: 1px solid rgba(255,255,255,.08); 
  padding: 12px 14px; 
  text-align: left; 
}
.doc-article th { 
  background: rgba(255,255,255,.04); 
  font-weight: 750; 
  color: var(--text);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.doc-article td {
  color: var(--muted);
}
.doc-article tr:hover td {
  background: rgba(255,255,255,.03);
  color: var(--text);
}

.doc-article img { 
  max-width: 100%; 
  display: block; 
  margin: 1.2rem auto; 
  border-radius: 16px; 
  box-shadow: var(--shadow2);
  border: 1px solid rgba(255,255,255,.10);
}

.doc-article .admonition { 
  border: 1px solid rgba(255,255,255,.10); 
  border-left-width: 4px; 
  padding: 16px 18px; 
  border-radius: 12px; 
  background: linear-gradient(180deg, rgba(16,21,34,.62), rgba(11,15,26,.52));
  margin: 1.4rem 0; 
}
.doc-article .admonition.note { border-left-color: var(--cyan); }
.doc-article .admonition.tip { border-left-color: var(--green); }
.doc-article .admonition.warn { border-left-color: var(--gold); }
.doc-article .admonition.danger { border-left-color: var(--rose); }
.doc-article .admonition .title { 
  font: 750 12px/1.2 inherit; 
  text-transform: uppercase; 
  letter-spacing: .08em; 
  margin: 0 0 8px; 
}

/* ==========================================
   PAGE TOC
   ========================================== */

.page-toc { 
  position: fixed; 
  right: 16px; 
  top: 90px; 
  width: 220px; 
  max-height: calc(100vh - 120px); 
  overflow: auto; 
  padding: 16px;
  background: linear-gradient(180deg, rgba(16,21,34,.62), rgba(11,15,26,.52));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  box-shadow: var(--shadow3);
  display: flex; 
  flex-direction: column; 
  gap: 4px; 
}
.page-toc h5 { 
  margin: 0 0 8px; 
  font: 750 10px/1.1 inherit; 
  text-transform: uppercase; 
  letter-spacing: .10em; 
  color: var(--muted2); 
}
.page-toc a { 
  text-decoration: none; 
  color: var(--muted); 
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid transparent;
  display: block;
  font-size: 12px;
  font-weight: 600;
  transition: all .14s ease;
}
.page-toc a:hover { 
  background: rgba(255,255,255,.06); 
  color: var(--text); 
}
.page-toc a.active { 
  background: rgba(46,255,122,.12); 
  color: var(--green); 
  border-color: rgba(46,255,122,.25);
}
.page-toc .lvl-3 { padding-left: 16px; }
.page-toc .lvl-4 { padding-left: 24px; }

/* ==========================================
   FOOTER
   ========================================== */

.site-footer { 
  font: 600 13px/1.4 inherit; 
  text-align: center; 
  padding: 24px 0 40px; 
  color: var(--muted2); 
  border-top: 1px solid rgba(255,255,255,.08); 
  margin-top: 40px; 
}
.site-footer a {
  color: var(--cyan);
  transition: color .14s ease;
}
.site-footer a:hover {
  color: var(--green);
}

/* ==========================================
   DARK MODE TOGGLE
   ========================================== */

#darkModeToggle { 
  background: rgba(255,255,255,.04); 
  border: 1px solid rgba(255,255,255,.10);
  color: var(--muted); 
  font: 720 12px/1 inherit; 
  padding: 10px 14px; 
  border-radius: 12px;
  cursor: pointer;
  transition: all .14s ease;
}
#darkModeToggle:hover { 
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
  color: var(--text);
}

/* ==========================================
   UTILITIES
   ========================================== */

.fade-in { animation: fadeIn .5s ease forwards; }
@keyframes fadeIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }

.placeholder { 
  background: linear-gradient(90deg, rgba(255,255,255,.03), rgba(255,255,255,.06), rgba(255,255,255,.03)); 
  background-size: 200% 100%; 
  animation: plc 1.2s linear infinite; 
  border-radius: 12px; 
}
@keyframes plc { 0% { background-position:0 0; } 100% { background-position:-200% 0; } }

/* Copy button */
.copy-btn { 
  position: absolute; 
  top: 10px; 
  right: 10px; 
  background: rgba(255,255,255,.06); 
  border: 1px solid rgba(255,255,255,.10);
  color: var(--muted); 
  font: 600 11px/1 inherit; 
  padding: 6px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: all .14s ease;
}
.copy-btn:hover { 
  background: rgba(255,255,255,.10); 
  color: var(--text); 
}

/* Toast */
.copy-toast { 
  position: fixed; 
  left: 50%; 
  bottom: 34px; 
  transform: translate(-50%, 20px); 
  background: var(--panel);
  backdrop-filter: blur(16px);
  color: var(--text); 
  font: 700 13px/1 inherit; 
  padding: 12px 20px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  box-shadow: var(--shadow2);
  opacity: 0; 
  pointer-events: none; 
  transition: opacity .3s ease, transform .35s cubic-bezier(.4,.1,0,1); 
}
.copy-toast.on { opacity:1; transform:translate(-50%,0); }

/* Scrollbar styling */
.sidebar::-webkit-scrollbar, .page-toc::-webkit-scrollbar, pre::-webkit-scrollbar { width:10px; height:10px; }
.sidebar::-webkit-scrollbar-track, .page-toc::-webkit-scrollbar-track, pre::-webkit-scrollbar-track { background:transparent; }
.sidebar::-webkit-scrollbar-thumb, .page-toc::-webkit-scrollbar-thumb, pre::-webkit-scrollbar-thumb { 
  background: rgba(46,255,122,.2); 
  border-radius: 20px; 
  border: 2px solid transparent; 
}
.sidebar::-webkit-scrollbar-thumb:hover, .page-toc::-webkit-scrollbar-thumb:hover, pre::-webkit-scrollbar-thumb:hover { 
  background: rgba(46,255,122,.3); 
}

/* Heading anchor links */
.doc-article .h-anchor { 
  opacity: 0; 
  margin-left: 8px; 
  font-size: .8em; 
  text-decoration: none; 
  color: var(--muted); 
  transition: opacity .2s; 
}
.doc-article h1:hover .h-anchor, .doc-article h2:hover .h-anchor, .doc-article h3:hover .h-anchor, .doc-article h4:hover .h-anchor { opacity:.9; }
.doc-article .h-anchor:hover { color: var(--green); }

/* Draft badge */
.draft-badge { 
  display: inline-block; 
  background: rgba(255,211,107,.12); 
  color: var(--gold); 
  font: 750 10px/1 inherit; 
  padding: 4px 8px;
  border: 1px solid rgba(255,211,107,.25);
  border-radius: 8px;
  text-transform: uppercase; 
  letter-spacing: .06em; 
}

/* Glossary terms */
.gl-term { cursor:help; border-bottom:1px dashed rgba(46,255,122,.6); }
.glossary-tooltip { 
  position: absolute; 
  z-index: 9999; 
  max-width: 260px; 
  font: 600 12px/1.35 inherit; 
  background: var(--panel);
  backdrop-filter: blur(16px);
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  box-shadow: var(--shadow2);
  color: var(--text); 
  display: none; 
}

/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1200px) {
  .page-toc { display:none; }
}

@media (max-width: 960px) {
  .sidebar { 
    position: fixed; 
    left: 0; 
    top: 64px; 
    transform: translateX(-100%); 
    transition: transform .38s cubic-bezier(.4,.08,0,1); 
    box-shadow: var(--shadow);
    width: 260px;
    z-index: 50;
  }
  .sidebar.open { transform: translateX(0); }
  .layout { flex-direction: column; }
  .content-area { padding: 28px 24px 60px; }
}

@media (max-width: 640px) {
  .topbar { padding: 0 16px; gap: 12px; }
  .topnav { gap: 8px; }
  .search-container input { width: 140px; }
  .content-area { padding: 24px 18px 70px; }
  .doc-article h1 { font-size: 1.85rem; }
}

/* ==========================================
   LIGHT THEME
   ========================================== */

html.light { 
  --bg0: #f8fafc;
  --bg1: #f1f5f9;
  --bg: #f8fafc; 
  --bg-alt: #f1f5f9; 
  --bg-code: #e2e8f0; 
  --border: #cbd5e1; 
  --border-strong: #94a3b8; 
  --text: #0f172a; 
  --text-dim: #445063;
  --muted: #64748b;
  --muted2: #94a3b8;
}

html.light body { 
  background: linear-gradient(180deg, #f8fafc, #f1f5f9);
  color: var(--text); 
}

html.light .sidebar { 
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(241,245,249,.9));
  border-right-color: #cbd5e1;
}

html.light .topbar { 
  background: rgba(248,250,252,.85);
  border-bottom-color: #cbd5e1;
}

html.light .nav-tree a { color: #475569; }
html.light .nav-tree a:hover { background: rgba(0,0,0,.04); color: #0f172a; }
html.light .nav-tree a.active { 
  background: rgba(46,255,122,.15); 
  color: #065f46;
  border-color: rgba(46,255,122,.3);
}

html.light .lang-switch select {
  background: rgba(0,0,0,.04);
  color: var(--text);
  border-color: #cbd5e1;
}
html.light .lang-switch select option {
  background: #ffffff;
  color: #0f172a;
}

html.light .page-toc { 
  background: rgba(255,255,255,.9);
  border-color: #cbd5e1;
}

html.light .doc-article blockquote { 
  background: linear-gradient(145deg, #f1f5f9, #ffffff); 
  color: #334155;
  border-color: #e2e8f0;
}

html.light .doc-article code,
html.light .doc-article pre {
  background: #e2e8f0;
  color: #0f172a;
  border-color: #cbd5e1;
}

html.light .doc-article th {
  background: #e2e8f0;
  color: #0f172a;
}

html.light .doc-article td {
  color: #334155;
}

html.light .glossary-tooltip { 
  background: rgba(255,255,255,.95); 
  color: #0f172a;
  border-color: #cbd5e1;
}

html.light .draft-badge { 
  background: rgba(251,191,36,.15); 
  color: #92400e; 
  border-color: #fbbf24; 
}

html.light .search-container input { 
  background: rgba(0,0,0,.04); 
  color: var(--text); 
  border-color: #cbd5e1; 
}
html.light .search-container input::placeholder { color: #64748b; }
html.light .search-results { 
  background: #ffffff; 
  border-color: #cbd5e1; 
}
html.light .search-results button { color: #334155; }
html.light .search-results button:hover { background: rgba(0,0,0,.06); color: #0f172a; }

html.light tbody tr:nth-child(odd) td { background: #ffffff; }
html.light tbody tr:nth-child(even) td { background: #f8fafc; }