{"version":3,"sources":["file:///home/runner/work/decius-css/decius-css/scss/web/_00-base.scss","../../scss/decius-web.scss","file:///home/runner/work/decius-css/decius-css/scss/web/_01-layout.scss","file:///home/runner/work/decius-css/decius-css/scss/web/_02-cards.scss"],"names":[],"mappings":"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","file":"decius-web.min.css","sourcesContent":["/* ============================================================\n   decius-web.css — web extensions for the decius docs site\n   Light page chrome, conventional typography, with seams that\n   make the DCC panels feel embedded.\n   ============================================================ */\n\n:root {\n  --dw-bg:        #ffffff;\n  --dw-bg-soft:   #f7f8fa;\n  --dw-bg-band:   #f1f3f7;\n  --dw-line:      #e3e6ec;\n  --dw-line-soft: #eef0f4;\n  --dw-text:      #1a1f2c;\n  --dw-text-dim:  #525a6b;\n  --dw-text-mute: #8c93a3;\n  --dw-accent:    #4d9fff;\n  --dw-accent-lo: #2f86ee;\n  --dw-accent-dim: rgba(77,159,255,.10);\n  --dw-code-bg:   #f4f6f9;\n\n  --dw-font: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;\n  --dw-font-mono: 'JetBrains Mono', 'IBM Plex Mono', ui-monospace, monospace;\n  --dw-font-display: 'IBM Plex Sans', sans-serif;\n\n  --dw-fs: 15px;\n  --dw-lh: 1.6;\n\n  --dw-radius: 8px;\n\n  --dw-shadow-card: 0 1px 2px rgba(20,30,50,.04), 0 4px 16px rgba(20,30,50,.06);\n}\n\n* { box-sizing: border-box; }\nhtml, body {\n  margin: 0; padding: 0;\n  background: var(--dw-bg);\n  color: var(--dw-text);\n  color-scheme: light;   /* light page chrome incl. native scrollbars */\n  font-family: var(--dw-font);\n  font-size: var(--dw-fs);\n  line-height: var(--dw-lh);\n  -webkit-font-smoothing: antialiased;\n}\nbody { overflow-x: hidden; }\n\na {\n  color: var(--dw-accent-lo);\n  text-decoration: none;\n  text-underline-offset: 3px;\n  border-bottom: 1px solid transparent;\n  transition: border-color 120ms;\n}\na:hover { border-bottom-color: var(--dw-accent); }\n\nh1, h2, h3, h4 {\n  font-family: var(--dw-font-display);\n  letter-spacing: -.012em;\n  margin: 0;\n  line-height: 1.15;\n  color: var(--dw-text);\n}\nh1 { font-size: clamp(36px, 5vw, 56px); font-weight: 600; letter-spacing: -.02em; }\nh2 { font-size: clamp(24px, 3vw, 32px); font-weight: 600; letter-spacing: -.015em; }\nh3 { font-size: 19px; font-weight: 600; }\nh4 { font-size: 15px; font-weight: 600; }\n\np { margin: 0 0 1em; color: var(--dw-text-dim); }\np:last-child { margin-bottom: 0; }\n\ncode, pre, kbd { font-family: var(--dw-font-mono); }\n:not(pre) > code {\n  font-size: .88em;\n  padding: 1px 6px;\n  background: var(--dw-code-bg);\n  border-radius: 4px;\n  color: #2840a4;\n  border: 1px solid var(--dw-line-soft);\n}\npre {\n  background: #0f1218;\n  color: #d8dade;\n  border-radius: var(--dw-radius);\n  padding: 16px 18px;\n  overflow-x: auto;\n  font-size: 13px;\n  line-height: 1.6;\n  margin: 0;\n  border: 1px solid #1c2230;\n}\n/* Code block wrapper + copy button */\n.dw-code { position: relative; }\n.dw-code + .dw-code { margin-top: 10px; }   /* gap between back-to-back code blocks */\n.dw-code__copy {\n  position: absolute; top: 8px; right: 8px;\n  display: inline-flex; align-items: center; gap: 5px;\n  height: 26px; padding: 0 9px;\n  font-family: var(--dw-font); font-size: 11px; font-weight: 500;\n  color: #b7bdca;\n  background: rgba(255, 255, 255, .06);\n  border: 1px solid rgba(255, 255, 255, .14);\n  border-radius: 6px;\n  cursor: pointer;\n  opacity: .5;\n  transition: opacity .15s, background .15s, color .15s, border-color .15s;\n}\n.dw-code:hover .dw-code__copy,\n.dw-code__copy:focus-visible { opacity: 1; }\n.dw-code__copy:hover { background: rgba(255, 255, 255, .12); color: #fff; border-color: rgba(255, 255, 255, .24); }\n.dw-code__copy svg { width: 13px; height: 13px; }\npre .tk-c { color: #6b7280; }            /* comment */\npre .tk-k { color: #ff7ab8; }            /* keyword/property */\npre .tk-s { color: #4ed18a; }            /* string */\npre .tk-n { color: #f2b14a; }            /* number */\npre .tk-v { color: #4d9fff; }            /* variable */\npre .tk-t { color: #8b6dff; }            /* type/selector */\npre .tk-p { color: #aab0bd; }            /* punctuation */\n\nhr { border: none; height: 1px; background: var(--dw-line); margin: 48px 0; }\n","@charset \"UTF-8\";\n/* ============================================================\n   decius-web.css — web extensions for the decius docs site\n   Light page chrome, conventional typography, with seams that\n   make the DCC panels feel embedded.\n   ============================================================ */\n:root {\n  --dw-bg: #ffffff;\n  --dw-bg-soft: #f7f8fa;\n  --dw-bg-band: #f1f3f7;\n  --dw-line: #e3e6ec;\n  --dw-line-soft: #eef0f4;\n  --dw-text: #1a1f2c;\n  --dw-text-dim: #525a6b;\n  --dw-text-mute: #8c93a3;\n  --dw-accent: #4d9fff;\n  --dw-accent-lo: #2f86ee;\n  --dw-accent-dim: rgba(77,159,255,.10);\n  --dw-code-bg: #f4f6f9;\n  --dw-font: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;\n  --dw-font-mono: 'JetBrains Mono', 'IBM Plex Mono', ui-monospace, monospace;\n  --dw-font-display: 'IBM Plex Sans', sans-serif;\n  --dw-fs: 15px;\n  --dw-lh: 1.6;\n  --dw-radius: 8px;\n  --dw-shadow-card: 0 1px 2px rgba(20,30,50,.04), 0 4px 16px rgba(20,30,50,.06);\n}\n\n* {\n  box-sizing: border-box;\n}\n\nhtml, body {\n  margin: 0;\n  padding: 0;\n  background: var(--dw-bg);\n  color: var(--dw-text);\n  color-scheme: light; /* light page chrome incl. native scrollbars */\n  font-family: var(--dw-font);\n  font-size: var(--dw-fs);\n  line-height: var(--dw-lh);\n  -webkit-font-smoothing: antialiased;\n}\n\nbody {\n  overflow-x: hidden;\n}\n\na {\n  color: var(--dw-accent-lo);\n  text-decoration: none;\n  text-underline-offset: 3px;\n  border-bottom: 1px solid transparent;\n  transition: border-color 120ms;\n}\n\na:hover {\n  border-bottom-color: var(--dw-accent);\n}\n\nh1, h2, h3, h4 {\n  font-family: var(--dw-font-display);\n  letter-spacing: -0.012em;\n  margin: 0;\n  line-height: 1.15;\n  color: var(--dw-text);\n}\n\nh1 {\n  font-size: clamp(36px, 5vw, 56px);\n  font-weight: 600;\n  letter-spacing: -0.02em;\n}\n\nh2 {\n  font-size: clamp(24px, 3vw, 32px);\n  font-weight: 600;\n  letter-spacing: -0.015em;\n}\n\nh3 {\n  font-size: 19px;\n  font-weight: 600;\n}\n\nh4 {\n  font-size: 15px;\n  font-weight: 600;\n}\n\np {\n  margin: 0 0 1em;\n  color: var(--dw-text-dim);\n}\n\np:last-child {\n  margin-bottom: 0;\n}\n\ncode, pre, kbd {\n  font-family: var(--dw-font-mono);\n}\n\n:not(pre) > code {\n  font-size: 0.88em;\n  padding: 1px 6px;\n  background: var(--dw-code-bg);\n  border-radius: 4px;\n  color: #2840a4;\n  border: 1px solid var(--dw-line-soft);\n}\n\npre {\n  background: #0f1218;\n  color: #d8dade;\n  border-radius: var(--dw-radius);\n  padding: 16px 18px;\n  overflow-x: auto;\n  font-size: 13px;\n  line-height: 1.6;\n  margin: 0;\n  border: 1px solid #1c2230;\n}\n\n/* Code block wrapper + copy button */\n.dw-code {\n  position: relative;\n}\n\n.dw-code + .dw-code {\n  margin-top: 10px;\n} /* gap between back-to-back code blocks */\n.dw-code__copy {\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  display: inline-flex;\n  align-items: center;\n  gap: 5px;\n  height: 26px;\n  padding: 0 9px;\n  font-family: var(--dw-font);\n  font-size: 11px;\n  font-weight: 500;\n  color: #b7bdca;\n  background: rgba(255, 255, 255, 0.06);\n  border: 1px solid rgba(255, 255, 255, 0.14);\n  border-radius: 6px;\n  cursor: pointer;\n  opacity: 0.5;\n  transition: opacity 0.15s, background 0.15s, color 0.15s, border-color 0.15s;\n}\n\n.dw-code:hover .dw-code__copy,\n.dw-code__copy:focus-visible {\n  opacity: 1;\n}\n\n.dw-code__copy:hover {\n  background: rgba(255, 255, 255, 0.12);\n  color: #fff;\n  border-color: rgba(255, 255, 255, 0.24);\n}\n\n.dw-code__copy svg {\n  width: 13px;\n  height: 13px;\n}\n\npre .tk-c {\n  color: #6b7280;\n} /* comment */\npre .tk-k {\n  color: #ff7ab8;\n} /* keyword/property */\npre .tk-s {\n  color: #4ed18a;\n} /* string */\npre .tk-n {\n  color: #f2b14a;\n} /* number */\npre .tk-v {\n  color: #4d9fff;\n} /* variable */\npre .tk-t {\n  color: #8b6dff;\n} /* type/selector */\npre .tk-p {\n  color: #aab0bd;\n} /* punctuation */\nhr {\n  border: none;\n  height: 1px;\n  background: var(--dw-line);\n  margin: 48px 0;\n}\n\n/* ---------- Layout ---------- */\n.dw-page {\n  display: grid;\n  grid-template-columns: 260px minmax(0, 1fr);\n  grid-template-rows: auto 1fr;\n  min-height: 100vh;\n}\n\n.dw-top {\n  grid-column: 1/-1;\n  height: 56px;\n  display: flex;\n  align-items: center;\n  gap: 24px;\n  padding: 0 28px;\n  background: var(--dw-bg);\n  border-bottom: 1px solid var(--dw-line);\n  position: sticky;\n  top: 0;\n  z-index: 30;\n  backdrop-filter: saturate(180%) blur(6px);\n}\n\n.dw-brand {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  font-family: var(--dw-font-display);\n  font-weight: 600;\n  letter-spacing: -0.01em;\n  font-size: 17px;\n  color: var(--dw-text);\n  border: none;\n}\n\n.dw-brand__mark {\n  width: 28px;\n  height: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #14161c;\n  color: var(--dw-accent);\n  border-radius: 6px;\n  position: relative;\n  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);\n  font-family: var(--dw-font-mono);\n}\n\n.dw-brand__version {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: var(--dw-text-mute);\n  background: var(--dw-bg-soft);\n  border: 1px solid var(--dw-line);\n  padding: 1px 6px;\n  border-radius: 999px;\n  margin-left: 4px;\n  font-weight: 400;\n}\n\n.dw-nav {\n  display: flex;\n  align-items: center;\n  gap: 20px;\n  margin-left: 12px;\n}\n\n.dw-nav a {\n  font-size: 14px;\n  color: var(--dw-text-dim);\n  border: none;\n}\n\n.dw-nav a:hover {\n  color: var(--dw-text);\n}\n\n.dw-nav a.active {\n  color: var(--dw-accent-lo);\n  font-weight: 500;\n}\n\n.dw-top__spacer {\n  flex: 1;\n}\n\n.dw-top__actions {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.dw-search {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 240px;\n  height: 32px;\n  padding: 0 10px;\n  background: var(--dw-bg-soft);\n  border: 1px solid var(--dw-line);\n  border-radius: 6px;\n  color: var(--dw-text-mute);\n  font-size: 13px;\n  cursor: text;\n}\n\n.dw-search:hover {\n  border-color: #d4d8e0;\n}\n\n.dw-search kbd {\n  margin-left: auto;\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  background: #fff;\n  border: 1px solid var(--dw-line);\n  border-radius: 4px;\n  padding: 1px 5px;\n  color: var(--dw-text-mute);\n}\n\n.dw-sidebar {\n  border-right: 1px solid var(--dw-line);\n  padding: 24px 0 60px 0;\n  background: var(--dw-bg);\n  position: sticky;\n  top: 56px;\n  align-self: start;\n  max-height: calc(100vh - 56px);\n  overflow-y: auto;\n}\n\n.dw-sidebar__group {\n  padding: 10px 20px 4px 28px;\n  font-size: 11px;\n  text-transform: uppercase;\n  letter-spacing: 0.08em;\n  color: var(--dw-text-mute);\n  font-weight: 600;\n}\n\n.dw-sidebar a {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 5px 20px 5px 28px;\n  font-size: 14px;\n  color: var(--dw-text-dim);\n  border: none;\n  border-left: 2px solid transparent;\n  margin-left: -1px;\n}\n\n.dw-sidebar a:hover {\n  color: var(--dw-text);\n  background: var(--dw-bg-soft);\n}\n\n.dw-sidebar a.active {\n  color: var(--dw-accent-lo);\n  border-left-color: var(--dw-accent);\n  background: var(--dw-accent-dim);\n  font-weight: 500;\n}\n\n.dw-sidebar a svg {\n  color: var(--dw-text-mute);\n}\n\n.dw-sidebar a.active svg {\n  color: var(--dw-accent);\n}\n\n.dw-main {\n  padding: 56px 64px 120px;\n  max-width: 1100px;\n  min-width: 0;\n}\n\n@media (max-width: 1100px) {\n  .dw-main {\n    padding: 40px 32px 80px;\n  }\n}\n.dw-section {\n  margin-bottom: 80px;\n  scroll-margin-top: 72px;\n}\n\n.dw-section__eyebrow {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  color: var(--dw-text-mute);\n  margin-bottom: 12px;\n}\n\n.dw-section__lead {\n  font-size: 18px;\n  color: var(--dw-text-dim);\n  margin-top: 12px;\n  max-width: 64ch;\n  line-height: 1.55;\n}\n\n/* Hamburger (mobile only) toggles the sidebar drawer; scrim dims behind it. */\n.dw-hamburger {\n  display: none;\n  align-items: center;\n  justify-content: center;\n  width: 34px;\n  height: 34px;\n  margin-left: -6px;\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: 8px;\n  color: var(--dw-text-dim);\n  cursor: pointer;\n}\n\n.dw-hamburger:hover {\n  background: var(--dw-bg-soft);\n  color: var(--dw-text);\n}\n\n.dw-scrim {\n  display: none;\n}\n\n/* ---------- Mobile ---------- */\n@media (max-width: 860px) {\n  .dw-page {\n    grid-template-columns: 1fr;\n  }\n  .dw-top {\n    gap: 10px;\n    padding: 0 14px;\n  }\n  .dw-hamburger {\n    display: inline-flex;\n  }\n  .dw-nav {\n    display: none;\n  }\n  .dw-brand__version {\n    display: none;\n  }\n  /* Sidebar becomes an off-canvas drawer. */\n  .dw-sidebar {\n    position: fixed;\n    top: 56px;\n    left: 0;\n    bottom: 0;\n    width: 272px;\n    max-height: none;\n    z-index: 45;\n    transform: translateX(-100%);\n    transition: transform 0.22s ease;\n    box-shadow: 0 16px 48px rgba(16, 24, 40, 0.28);\n  }\n  .dw-sidebar--open {\n    transform: none;\n  }\n  .dw-scrim {\n    display: block;\n    position: fixed;\n    inset: 56px 0 0 0;\n    background: rgba(16, 22, 34, 0.42);\n    z-index: 44;\n  }\n  .dw-main {\n    padding: 28px 18px 80px;\n  }\n  .dw-section {\n    margin-bottom: 56px;\n  }\n  .dw-section__lead {\n    font-size: 16px;\n  }\n  /* (Demo horizontal-scroll lives in _02-cards.scss so it lands after the\n     base .dw-demo overflow:hidden and actually wins.) */\n}\n@media (max-width: 560px) {\n  .dw-main h2 {\n    font-size: 24px;\n  }\n}\n/* ---------- Cards ---------- */\n.dw-card {\n  background: var(--dw-bg);\n  border: 1px solid var(--dw-line);\n  border-radius: var(--dw-radius);\n  overflow: hidden;\n}\n\n.dw-card__head {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  background: var(--dw-bg-soft);\n  border-bottom: 1px solid var(--dw-line);\n  font-size: 13px;\n  color: var(--dw-text-dim);\n}\n\n.dw-card__head .dw-card__title {\n  font-weight: 500;\n  color: var(--dw-text);\n  font-family: var(--dw-font-mono);\n  font-size: 12px;\n  letter-spacing: 0.03em;\n}\n\n.dw-card__body {\n  padding: 28px;\n}\n\n/* Demo container — embeds a dark DCC panel cleanly */\n.dw-demo {\n  border-radius: var(--dw-radius);\n  border: 1px solid #14161c;\n  padding: 28px;\n  position: relative;\n  overflow: hidden;\n}\n\n.dw-demo--panel {\n  background: #2a2e38;\n} /* matches default .dcs-bg — for bare-widget demos */\n.dw-demo--app {\n  background: #1f222a;\n} /* matches .dcs-bg-app — for Panel/Dock demos */\n.dw-demo--checker {\n  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.02) 25%, transparent 25%), linear-gradient(-45deg, rgba(255, 255, 255, 0.02) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(255, 255, 255, 0.02) 75%), linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, 0.02) 75%);\n  background-size: 16px 16px;\n  background-position: 0 0, 0 8px, 8px -8px, -8px 0px;\n}\n\n.dw-demo--inset {\n  padding: 0;\n}\n\n/* ── Inline notes inside a demo card ──────────────────────────────\n   `.dw-note` is the standard small-print description used inside\n   demos (and elsewhere). On the light docs page it reads as dim grey;\n   inside a dark `.dw-demo--app`/`--panel` it switches to the dark\n   palette so the text stays legible against the panel background.\n   Inline `<code>` is similarly re-skinned for the dark context. */\n.dw-note {\n  font-size: 13px;\n  line-height: 1.65;\n  color: var(--dw-text-dim);\n}\n\n.dw-note strong {\n  color: var(--dw-text);\n  font-weight: 600;\n}\n\n.dw-note p {\n  margin: 0 0 0.6em;\n  color: inherit;\n}\n\n.dw-note p:last-child {\n  margin-bottom: 0;\n}\n\n.dw-demo--app .dw-note,\n.dw-demo--panel .dw-note {\n  color: var(--dcs-text-dim);\n}\n\n.dw-demo--app .dw-note strong,\n.dw-demo--panel .dw-note strong {\n  color: var(--dcs-text);\n}\n\n/* Inline <code> inside a dark demo — light bg/dark text would flash\n   against the panel; use a translucent dark chip with accent text. */\n.dw-demo--app :not(pre) > code,\n.dw-demo--panel :not(pre) > code {\n  background: rgba(255, 255, 255, 0.07);\n  border-color: rgba(255, 255, 255, 0.1);\n  color: var(--dcs-accent-hi, #8fc1ff);\n}\n\n/* On small screens, let demos scroll horizontally rather than collapse/clip.\n   Must sit AFTER the base `overflow: hidden` above so it wins. Demos that can\n   shrink to fit (e.g. the node graph) simply do; complex demos hold their\n   layout via the Demo `minw` prop / inline min-width and scroll. An\n   always-visible scrollbar makes the affordance obvious (overlay scrollbars\n   otherwise stay hidden until you scroll). */\n@media (max-width: 860px) {\n  .dw-demo {\n    overflow-x: auto;\n    overflow-y: hidden;\n    -webkit-overflow-scrolling: touch;\n  }\n  .dw-demo::-webkit-scrollbar {\n    height: 10px;\n  }\n  .dw-demo::-webkit-scrollbar-track {\n    background: rgba(0, 0, 0, 0.05);\n  }\n  .dw-demo::-webkit-scrollbar-thumb {\n    background: var(--dw-text-mute);\n    border-radius: 5px;\n    border: 2px solid transparent;\n    background-clip: padding-box;\n  }\n}\n.dw-demo__caption {\n  margin-top: 10px;\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  font-family: var(--dw-font-mono);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n/* Two-column demo + code */\n.dw-split {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n\n@media (max-width: 900px) {\n  .dw-split {\n    grid-template-columns: 1fr;\n  }\n}\n.dw-stack {\n  display: grid;\n  gap: 16px;\n}\n\n.dw-grid {\n  display: grid;\n  gap: 16px;\n  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));\n}\n\n/* Footnotes, captions */\n.dw-caption {\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  font-family: var(--dw-font-mono);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n  margin-bottom: 8px;\n}\n\n.dw-meta {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: var(--dw-text-mute);\n}\n\n/* Pill / tag in the light system */\n.dw-pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  height: 22px;\n  padding: 0 9px;\n  background: var(--dw-bg-soft);\n  border: 1px solid var(--dw-line);\n  border-radius: 999px;\n  color: var(--dw-text-dim);\n  letter-spacing: 0.03em;\n}\n\n.dw-pill--accent {\n  background: var(--dw-accent-dim);\n  border-color: rgba(77, 159, 255, 0.35);\n  color: var(--dw-accent-lo);\n}\n\n.dw-pill--dot::before {\n  content: \"\";\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: currentColor;\n}\n\n/* Big install snippet */\n.dw-install {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  background: #0f1218;\n  color: #d8dade;\n  border-radius: 10px;\n  padding: 14px 18px;\n  font-family: var(--dw-font-mono);\n  font-size: 14px;\n  border: 1px solid #1c2230;\n}\n\n.dw-install__prompt {\n  color: #4d9fff;\n  user-select: none;\n}\n\n.dw-install__cmd {\n  flex: 1;\n}\n\n.dw-install__copy {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  background: transparent;\n  color: #aab0bd;\n  border: 1px solid #2a3142;\n  border-radius: 6px;\n  padding: 4px 10px;\n  font-size: 12px;\n  cursor: pointer;\n  font-family: var(--dw-font-mono);\n}\n\n.dw-install__copy:hover {\n  color: #fff;\n  background: #1c2230;\n}\n\n/* Hero — feels like the site, but with one big DCC artifact */\n.dw-hero {\n  padding-top: 48px;\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 40px;\n  margin-bottom: 64px;\n}\n\n.dw-hero__eyebrow {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-family: var(--dw-font-mono);\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  margin-bottom: 16px;\n}\n\n.dw-hero__eyebrow::before {\n  content: \"\";\n  width: 24px;\n  height: 1px;\n  background: var(--dw-accent);\n}\n\n.dw-hero > * {\n  min-width: 0;\n} /* let columns shrink so wide deck/text never force page overflow */\n.dw-hero h1 {\n  max-width: 18ch;\n}\n\n.dw-hero p.lede {\n  margin-top: 18px;\n  font-size: 19px;\n  line-height: 1.5;\n  color: var(--dw-text-dim);\n  max-width: 56ch;\n}\n\n.dw-hero__actions {\n  margin-top: 28px;\n  display: flex;\n  gap: 12px;\n  align-items: center;\n  flex-wrap: wrap; /* wrap to a second row rather than cram/overflow */\n}\n\n.dw-cta {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  height: 40px;\n  padding: 0 18px;\n  border-radius: 8px;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  border: 1px solid transparent;\n  font-family: var(--dw-font);\n}\n\n.dw-cta--primary {\n  background: #14161c;\n  color: #fff;\n  border-color: #14161c;\n}\n\n.dw-cta--primary:hover {\n  background: #2a2e38;\n}\n\n.dw-cta--ghost {\n  background: transparent;\n  color: var(--dw-text);\n  border-color: var(--dw-line);\n}\n\n.dw-cta--ghost:hover {\n  border-color: #c8cdd6;\n  background: var(--dw-bg-soft);\n}\n\n/* Narrow / sidebar-present widths: stack the hero CTAs as full-width buttons\n   instead of a cramped, wrapping row. Kicks in well before phone widths\n   because the sidebar eats horizontal room. The MIT pill stays a small chip,\n   and the verbose download sub-label drops. */\n@media (max-width: 1000px) {\n  .dw-hero__actions {\n    flex-direction: column;\n    align-items: stretch;\n    gap: 10px;\n  }\n  .dw-hero__actions .dw-cta {\n    width: 100%;\n    justify-content: center;\n  }\n  .dw-hero__actions .dw-pill {\n    align-self: flex-start;\n  }\n  .dw-cta__sub {\n    display: none;\n  }\n}\n/* Featured stage — large dark embed */\n.dw-stage {\n  background: var(--dcs-bg-app, #1f222a);\n  border-radius: 14px;\n  border: 1px solid #14161c;\n  padding: 0;\n  overflow: hidden;\n  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset, 0 30px 80px -20px rgba(20, 30, 60, 0.25), 0 12px 24px -10px rgba(20, 30, 60, 0.18);\n  position: relative;\n}\n\n.dw-stage__chrome {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  height: 28px;\n  padding: 0 12px;\n  background: linear-gradient(180deg, #3c424f, #2a2e38);\n  border-bottom: 1px solid #14161c;\n}\n\n.dw-stage__lights {\n  display: flex;\n  gap: 6px;\n}\n\n.dw-stage__light {\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: #555d6e;\n}\n\n.dw-stage__title {\n  flex: 1;\n  text-align: center;\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: #aab0bd;\n  letter-spacing: 0.04em;\n}\n\n/* In-page links */\n.dw-anchor {\n  font-family: var(--dw-font-mono);\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  text-decoration: none;\n  margin-left: 12px;\n  opacity: 0;\n  border: none;\n}\n\n.dw-section h2:hover .dw-anchor,\n.dw-section h3:hover .dw-anchor {\n  opacity: 1;\n}\n\n/* Subgrid headings */\n.dw-subhead {\n  display: flex;\n  align-items: baseline;\n  justify-content: space-between;\n  margin: 32px 0 16px;\n  padding-bottom: 8px;\n  border-bottom: 1px solid var(--dw-line);\n}\n\n.dw-subhead h3 {\n  margin: 0;\n}\n\n.dw-subhead__meta {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: var(--dw-text-mute);\n}\n\n/* Foot */\n.dw-foot {\n  border-top: 1px solid var(--dw-line);\n  padding: 32px 64px;\n  font-size: 13px;\n  color: var(--dw-text-mute);\n  grid-column: 1/-1;\n  display: flex;\n  gap: 28px;\n  flex-wrap: wrap;\n  align-items: center;\n}\n\n.dw-foot a {\n  color: var(--dw-text-dim);\n  border: none;\n}\n\n.dw-foot a:hover {\n  color: var(--dw-text);\n}\n\n/* Right-side ToC (optional) */\n.dw-toc {\n  position: fixed;\n  top: 88px;\n  right: 24px;\n  width: 200px;\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  display: none;\n}\n\n@media (min-width: 1400px) {\n  .dw-toc {\n    display: block;\n  }\n}\n.dw-toc__title {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  text-transform: uppercase;\n  letter-spacing: 0.08em;\n  color: var(--dw-text-mute);\n  margin-bottom: 10px;\n}\n\n.dw-toc a {\n  display: block;\n  padding: 3px 0;\n  border: none;\n  color: var(--dw-text-dim);\n}\n\n.dw-toc a:hover {\n  color: var(--dw-text);\n}\n\n.dw-toc a.active {\n  color: var(--dw-accent-lo);\n  font-weight: 500;\n}\n\n/* \"Why\" feature grid */\n.dw-feature-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 20px;\n  margin: 32px 0;\n}\n\n@media (max-width: 900px) {\n  .dw-feature-grid {\n    grid-template-columns: 1fr;\n  }\n}\n.dw-feature {\n  padding: 24px;\n  border: 1px solid var(--dw-line);\n  border-radius: var(--dw-radius);\n  background: var(--dw-bg);\n}\n\n.dw-feature__icon {\n  width: 36px;\n  height: 36px;\n  border-radius: 8px;\n  background: var(--dw-accent-dim);\n  color: var(--dw-accent);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-bottom: 14px;\n}\n\n.dw-feature h4 {\n  margin-bottom: 6px;\n}\n\n.dw-feature p {\n  font-size: 14px;\n  line-height: 1.55;\n  color: var(--dw-text-dim);\n}","/* ---------- Layout ---------- */\n.dw-page {\n  display: grid;\n  grid-template-columns: 260px minmax(0, 1fr);\n  grid-template-rows: auto 1fr;\n  min-height: 100vh;\n}\n.dw-top {\n  grid-column: 1 / -1;\n  height: 56px;\n  display: flex; align-items: center;\n  gap: 24px;\n  padding: 0 28px;\n  background: var(--dw-bg);\n  border-bottom: 1px solid var(--dw-line);\n  position: sticky; top: 0; z-index: 30;\n  backdrop-filter: saturate(180%) blur(6px);\n}\n.dw-brand {\n  display: flex; align-items: center; gap: 10px;\n  font-family: var(--dw-font-display);\n  font-weight: 600;\n  letter-spacing: -.01em;\n  font-size: 17px;\n  color: var(--dw-text);\n  border: none;\n}\n.dw-brand__mark {\n  width: 28px; height: 28px;\n  display: flex; align-items: center; justify-content: center;\n  background: #14161c;\n  color: var(--dw-accent);\n  border-radius: 6px;\n  position: relative;\n  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);\n  font-family: var(--dw-font-mono);\n}\n.dw-brand__version {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: var(--dw-text-mute);\n  background: var(--dw-bg-soft);\n  border: 1px solid var(--dw-line);\n  padding: 1px 6px;\n  border-radius: 999px;\n  margin-left: 4px;\n  font-weight: 400;\n}\n.dw-nav {\n  display: flex; align-items: center; gap: 20px;\n  margin-left: 12px;\n}\n.dw-nav a {\n  font-size: 14px;\n  color: var(--dw-text-dim);\n  border: none;\n}\n.dw-nav a:hover { color: var(--dw-text); }\n.dw-nav a.active { color: var(--dw-accent-lo); font-weight: 500; }\n\n.dw-top__spacer { flex: 1; }\n.dw-top__actions { display: flex; align-items: center; gap: 10px; }\n\n.dw-search {\n  display: flex; align-items: center; gap: 8px;\n  width: 240px; height: 32px;\n  padding: 0 10px;\n  background: var(--dw-bg-soft);\n  border: 1px solid var(--dw-line);\n  border-radius: 6px;\n  color: var(--dw-text-mute);\n  font-size: 13px;\n  cursor: text;\n}\n.dw-search:hover { border-color: #d4d8e0; }\n.dw-search kbd {\n  margin-left: auto;\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  background: #fff;\n  border: 1px solid var(--dw-line);\n  border-radius: 4px;\n  padding: 1px 5px;\n  color: var(--dw-text-mute);\n}\n\n.dw-sidebar {\n  border-right: 1px solid var(--dw-line);\n  padding: 24px 0 60px 0;\n  background: var(--dw-bg);\n  position: sticky;\n  top: 56px;\n  align-self: start;\n  max-height: calc(100vh - 56px);\n  overflow-y: auto;\n}\n.dw-sidebar__group {\n  padding: 10px 20px 4px 28px;\n  font-size: 11px;\n  text-transform: uppercase;\n  letter-spacing: .08em;\n  color: var(--dw-text-mute);\n  font-weight: 600;\n}\n.dw-sidebar a {\n  display: flex; align-items: center; gap: 10px;\n  padding: 5px 20px 5px 28px;\n  font-size: 14px;\n  color: var(--dw-text-dim);\n  border: none;\n  border-left: 2px solid transparent;\n  margin-left: -1px;\n}\n.dw-sidebar a:hover { color: var(--dw-text); background: var(--dw-bg-soft); }\n.dw-sidebar a.active {\n  color: var(--dw-accent-lo);\n  border-left-color: var(--dw-accent);\n  background: var(--dw-accent-dim);\n  font-weight: 500;\n}\n.dw-sidebar a svg { color: var(--dw-text-mute); }\n.dw-sidebar a.active svg { color: var(--dw-accent); }\n\n.dw-main {\n  padding: 56px 64px 120px;\n  max-width: 1100px;\n  min-width: 0;\n}\n@media (max-width: 1100px) { .dw-main { padding: 40px 32px 80px; } }\n\n.dw-section { margin-bottom: 80px; scroll-margin-top: 72px; }\n.dw-section__eyebrow {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  letter-spacing: .12em;\n  text-transform: uppercase;\n  color: var(--dw-text-mute);\n  margin-bottom: 12px;\n}\n.dw-section__lead {\n  font-size: 18px;\n  color: var(--dw-text-dim);\n  margin-top: 12px;\n  max-width: 64ch;\n  line-height: 1.55;\n}\n\n/* Hamburger (mobile only) toggles the sidebar drawer; scrim dims behind it. */\n.dw-hamburger {\n  display: none;\n  align-items: center; justify-content: center;\n  width: 34px; height: 34px; margin-left: -6px;\n  background: transparent; border: 1px solid transparent; border-radius: 8px;\n  color: var(--dw-text-dim); cursor: pointer;\n}\n.dw-hamburger:hover { background: var(--dw-bg-soft); color: var(--dw-text); }\n.dw-scrim { display: none; }\n\n/* ---------- Mobile ---------- */\n@media (max-width: 860px) {\n  .dw-page { grid-template-columns: 1fr; }\n  .dw-top { gap: 10px; padding: 0 14px; }\n  .dw-hamburger { display: inline-flex; }\n  .dw-nav { display: none; }\n  .dw-brand__version { display: none; }\n\n  /* Sidebar becomes an off-canvas drawer. */\n  .dw-sidebar {\n    position: fixed; top: 56px; left: 0; bottom: 0;\n    width: 272px; max-height: none; z-index: 45;\n    transform: translateX(-100%);\n    transition: transform .22s ease;\n    box-shadow: 0 16px 48px rgba(16, 24, 40, .28);\n  }\n  .dw-sidebar--open { transform: none; }\n  .dw-scrim {\n    display: block; position: fixed; inset: 56px 0 0 0;\n    background: rgba(16, 22, 34, .42); z-index: 44;\n  }\n\n  .dw-main { padding: 28px 18px 80px; }\n  .dw-section { margin-bottom: 56px; }\n  .dw-section__lead { font-size: 16px; }\n  /* (Demo horizontal-scroll lives in _02-cards.scss so it lands after the\n     base .dw-demo overflow:hidden and actually wins.) */\n}\n\n@media (max-width: 560px) {\n  .dw-main h2 { font-size: 24px; }\n}\n","/* ---------- Cards ---------- */\n.dw-card {\n  background: var(--dw-bg);\n  border: 1px solid var(--dw-line);\n  border-radius: var(--dw-radius);\n  overflow: hidden;\n}\n.dw-card__head {\n  display: flex; align-items: center; gap: 12px;\n  padding: 12px 16px;\n  background: var(--dw-bg-soft);\n  border-bottom: 1px solid var(--dw-line);\n  font-size: 13px;\n  color: var(--dw-text-dim);\n}\n.dw-card__head .dw-card__title {\n  font-weight: 500; color: var(--dw-text);\n  font-family: var(--dw-font-mono);\n  font-size: 12px;\n  letter-spacing: .03em;\n}\n.dw-card__body { padding: 28px; }\n\n/* Demo container — embeds a dark DCC panel cleanly */\n.dw-demo {\n  border-radius: var(--dw-radius);\n  border: 1px solid #14161c;\n  padding: 28px;\n  position: relative;\n  overflow: hidden;\n}\n.dw-demo--panel { background: #2a2e38; }   /* matches default .dcs-bg — for bare-widget demos */\n.dw-demo--app   { background: #1f222a; }   /* matches .dcs-bg-app — for Panel/Dock demos */\n.dw-demo--checker {\n  background-image:\n    linear-gradient(45deg, rgba(255,255,255,.02) 25%, transparent 25%),\n    linear-gradient(-45deg, rgba(255,255,255,.02) 25%, transparent 25%),\n    linear-gradient(45deg, transparent 75%, rgba(255,255,255,.02) 75%),\n    linear-gradient(-45deg, transparent 75%, rgba(255,255,255,.02) 75%);\n  background-size: 16px 16px;\n  background-position: 0 0, 0 8px, 8px -8px, -8px 0px;\n}\n.dw-demo--inset { padding: 0; }\n\n/* ── Inline notes inside a demo card ──────────────────────────────\n   `.dw-note` is the standard small-print description used inside\n   demos (and elsewhere). On the light docs page it reads as dim grey;\n   inside a dark `.dw-demo--app`/`--panel` it switches to the dark\n   palette so the text stays legible against the panel background.\n   Inline `<code>` is similarly re-skinned for the dark context. */\n.dw-note {\n  font-size: 13px;\n  line-height: 1.65;\n  color: var(--dw-text-dim);\n}\n.dw-note strong { color: var(--dw-text); font-weight: 600; }\n.dw-note p { margin: 0 0 .6em; color: inherit; }\n.dw-note p:last-child { margin-bottom: 0; }\n\n.dw-demo--app .dw-note,\n.dw-demo--panel .dw-note { color: var(--dcs-text-dim); }\n.dw-demo--app .dw-note strong,\n.dw-demo--panel .dw-note strong { color: var(--dcs-text); }\n\n/* Inline <code> inside a dark demo — light bg/dark text would flash\n   against the panel; use a translucent dark chip with accent text. */\n.dw-demo--app :not(pre) > code,\n.dw-demo--panel :not(pre) > code {\n  background: rgba(255, 255, 255, .07);\n  border-color: rgba(255, 255, 255, .10);\n  color: var(--dcs-accent-hi, #8fc1ff);\n}\n\n/* On small screens, let demos scroll horizontally rather than collapse/clip.\n   Must sit AFTER the base `overflow: hidden` above so it wins. Demos that can\n   shrink to fit (e.g. the node graph) simply do; complex demos hold their\n   layout via the Demo `minw` prop / inline min-width and scroll. An\n   always-visible scrollbar makes the affordance obvious (overlay scrollbars\n   otherwise stay hidden until you scroll). */\n@media (max-width: 860px) {\n  .dw-demo { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }\n  .dw-demo::-webkit-scrollbar { height: 10px; }\n  .dw-demo::-webkit-scrollbar-track { background: rgba(0, 0, 0, .05); }\n  .dw-demo::-webkit-scrollbar-thumb {\n    background: var(--dw-text-mute); border-radius: 5px;\n    border: 2px solid transparent; background-clip: padding-box;\n  }\n}\n\n.dw-demo__caption {\n  margin-top: 10px;\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  font-family: var(--dw-font-mono);\n  display: flex; align-items: center; gap: 8px;\n}\n\n/* Two-column demo + code */\n.dw-split {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 20px;\n}\n@media (max-width: 900px) { .dw-split { grid-template-columns: 1fr; } }\n\n.dw-stack { display: grid; gap: 16px; }\n.dw-grid {\n  display: grid;\n  gap: 16px;\n  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));\n}\n\n/* Footnotes, captions */\n.dw-caption {\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  font-family: var(--dw-font-mono);\n  text-transform: uppercase;\n  letter-spacing: .06em;\n  margin-bottom: 8px;\n}\n.dw-meta {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: var(--dw-text-mute);\n}\n\n/* Pill / tag in the light system */\n.dw-pill {\n  display: inline-flex; align-items: center; gap: 6px;\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  height: 22px; padding: 0 9px;\n  background: var(--dw-bg-soft);\n  border: 1px solid var(--dw-line);\n  border-radius: 999px;\n  color: var(--dw-text-dim);\n  letter-spacing: .03em;\n}\n.dw-pill--accent {\n  background: var(--dw-accent-dim);\n  border-color: rgba(77,159,255,.35);\n  color: var(--dw-accent-lo);\n}\n.dw-pill--dot::before {\n  content: \"\"; width: 6px; height: 6px; border-radius: 50%;\n  background: currentColor;\n}\n\n/* Big install snippet */\n.dw-install {\n  display: flex; align-items: center; gap: 12px;\n  background: #0f1218;\n  color: #d8dade;\n  border-radius: 10px;\n  padding: 14px 18px;\n  font-family: var(--dw-font-mono);\n  font-size: 14px;\n  border: 1px solid #1c2230;\n}\n.dw-install__prompt { color: #4d9fff; user-select: none; }\n.dw-install__cmd { flex: 1; }\n.dw-install__copy {\n  display: inline-flex; align-items: center; gap: 6px;\n  background: transparent;\n  color: #aab0bd;\n  border: 1px solid #2a3142;\n  border-radius: 6px;\n  padding: 4px 10px;\n  font-size: 12px;\n  cursor: pointer;\n  font-family: var(--dw-font-mono);\n}\n.dw-install__copy:hover { color: #fff; background: #1c2230; }\n\n/* Hero — feels like the site, but with one big DCC artifact */\n.dw-hero {\n  padding-top: 48px;\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 40px;\n  margin-bottom: 64px;\n}\n.dw-hero__eyebrow {\n  display: inline-flex; align-items: center; gap: 8px;\n  font-family: var(--dw-font-mono);\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  margin-bottom: 16px;\n}\n.dw-hero__eyebrow::before {\n  content: \"\"; width: 24px; height: 1px; background: var(--dw-accent);\n}\n.dw-hero > * { min-width: 0; }   /* let columns shrink so wide deck/text never force page overflow */\n.dw-hero h1 { max-width: 18ch; }\n.dw-hero p.lede {\n  margin-top: 18px;\n  font-size: 19px;\n  line-height: 1.5;\n  color: var(--dw-text-dim);\n  max-width: 56ch;\n}\n.dw-hero__actions {\n  margin-top: 28px;\n  display: flex; gap: 12px; align-items: center;\n  flex-wrap: wrap;   /* wrap to a second row rather than cram/overflow */\n}\n.dw-cta {\n  display: inline-flex; align-items: center; gap: 8px;\n  height: 40px;\n  padding: 0 18px;\n  border-radius: 8px;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  border: 1px solid transparent;\n  font-family: var(--dw-font);\n}\n.dw-cta--primary {\n  background: #14161c;\n  color: #fff;\n  border-color: #14161c;\n}\n.dw-cta--primary:hover { background: #2a2e38; }\n.dw-cta--ghost {\n  background: transparent;\n  color: var(--dw-text);\n  border-color: var(--dw-line);\n}\n.dw-cta--ghost:hover { border-color: #c8cdd6; background: var(--dw-bg-soft); }\n\n/* Narrow / sidebar-present widths: stack the hero CTAs as full-width buttons\n   instead of a cramped, wrapping row. Kicks in well before phone widths\n   because the sidebar eats horizontal room. The MIT pill stays a small chip,\n   and the verbose download sub-label drops. */\n@media (max-width: 1000px) {\n  .dw-hero__actions { flex-direction: column; align-items: stretch; gap: 10px; }\n  .dw-hero__actions .dw-cta { width: 100%; justify-content: center; }\n  .dw-hero__actions .dw-pill { align-self: flex-start; }\n  .dw-cta__sub { display: none; }\n}\n\n/* Featured stage — large dark embed */\n.dw-stage {\n  background: var(--dcs-bg-app, #1f222a);\n  border-radius: 14px;\n  border: 1px solid #14161c;\n  padding: 0;\n  overflow: hidden;\n  box-shadow:\n    0 1px 0 rgba(255,255,255,.5) inset,\n    0 30px 80px -20px rgba(20,30,60,.25),\n    0 12px 24px -10px rgba(20,30,60,.18);\n  position: relative;\n}\n.dw-stage__chrome {\n  display: flex; align-items: center; gap: 10px;\n  height: 28px;\n  padding: 0 12px;\n  background: linear-gradient(180deg, #3c424f, #2a2e38);\n  border-bottom: 1px solid #14161c;\n}\n.dw-stage__lights { display: flex; gap: 6px; }\n.dw-stage__light { width: 10px; height: 10px; border-radius: 50%; background: #555d6e; }\n.dw-stage__title {\n  flex: 1;\n  text-align: center;\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: #aab0bd;\n  letter-spacing: .04em;\n}\n\n/* In-page links */\n.dw-anchor {\n  font-family: var(--dw-font-mono);\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  text-decoration: none;\n  margin-left: 12px;\n  opacity: 0;\n  border: none;\n}\n.dw-section h2:hover .dw-anchor,\n.dw-section h3:hover .dw-anchor { opacity: 1; }\n\n/* Subgrid headings */\n.dw-subhead {\n  display: flex; align-items: baseline; justify-content: space-between;\n  margin: 32px 0 16px;\n  padding-bottom: 8px;\n  border-bottom: 1px solid var(--dw-line);\n}\n.dw-subhead h3 { margin: 0; }\n.dw-subhead__meta {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  color: var(--dw-text-mute);\n}\n\n/* Foot */\n.dw-foot {\n  border-top: 1px solid var(--dw-line);\n  padding: 32px 64px;\n  font-size: 13px;\n  color: var(--dw-text-mute);\n  grid-column: 1 / -1;\n  display: flex;\n  gap: 28px;\n  flex-wrap: wrap;\n  align-items: center;\n}\n.dw-foot a { color: var(--dw-text-dim); border: none; }\n.dw-foot a:hover { color: var(--dw-text); }\n\n/* Right-side ToC (optional) */\n.dw-toc {\n  position: fixed;\n  top: 88px; right: 24px;\n  width: 200px;\n  font-size: 12px;\n  color: var(--dw-text-mute);\n  display: none;\n}\n@media (min-width: 1400px) { .dw-toc { display: block; } }\n.dw-toc__title {\n  font-family: var(--dw-font-mono);\n  font-size: 11px;\n  text-transform: uppercase;\n  letter-spacing: .08em;\n  color: var(--dw-text-mute);\n  margin-bottom: 10px;\n}\n.dw-toc a {\n  display: block;\n  padding: 3px 0;\n  border: none;\n  color: var(--dw-text-dim);\n}\n.dw-toc a:hover { color: var(--dw-text); }\n.dw-toc a.active { color: var(--dw-accent-lo); font-weight: 500; }\n\n/* \"Why\" feature grid */\n.dw-feature-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 20px;\n  margin: 32px 0;\n}\n@media (max-width: 900px) { .dw-feature-grid { grid-template-columns: 1fr; } }\n.dw-feature {\n  padding: 24px;\n  border: 1px solid var(--dw-line);\n  border-radius: var(--dw-radius);\n  background: var(--dw-bg);\n}\n.dw-feature__icon {\n  width: 36px; height: 36px;\n  border-radius: 8px;\n  background: var(--dw-accent-dim);\n  color: var(--dw-accent);\n  display: flex; align-items: center; justify-content: center;\n  margin-bottom: 14px;\n}\n.dw-feature h4 { margin-bottom: 6px; }\n.dw-feature p { font-size: 14px; line-height: 1.55; color: var(--dw-text-dim); }\n"]}