.demo{margin:0}
.dh{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:10px clamp(16px,4vw,40px);border-bottom:1px solid var(--line);background:#15120e;min-height:60px}
.dbrand{display:inline-flex;align-items:center;gap:10px;font:800 18px Archivo,sans-serif;text-decoration:none;color:var(--ink);margin-right:auto;min-height:44px}
.dbrand em{font:500 11px "JetBrains Mono",monospace;color:var(--mut);font-style:normal;letter-spacing:.08em;text-transform:uppercase;margin-left:6px}
.dlink{color:var(--ink);text-decoration:none;font:600 14px Archivo,sans-serif;min-height:44px;display:inline-flex;align-items:center;padding:0 6px}
.dlink:hover{color:var(--sun)}
.dmain{max-width:1000px;margin:0 auto;padding:28px clamp(16px,4vw,40px) 80px}
.lede{max-width:62ch}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 6px}
.demo .tabbtn{min-height:44px;padding:0 18px;font:700 14px Archivo,sans-serif}
.demo .tabbtn.active{background:#2a2113;border-color:var(--sun);color:var(--sun)}
.dfoot{display:flex;flex-wrap:wrap;gap:12px 30px;justify-content:space-between;padding:22px clamp(16px,4vw,40px);border-top:1px solid var(--line);font:500 11.5px "JetBrains Mono",monospace;color:var(--mut);letter-spacing:.08em}