/* AEOESS Shared Styles v7 — Dark mode, bigger nav, tighter layout */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#fafafa;--surface:#fff;--surface-2:#f5f5f5;--surface-3:#ebebeb;
  --border:#e5e5e5;--border-hi:#d0d0d0;
  --text:#171717;--dim:#525252;--muted:#a3a3a3;
  --accent:#2563eb;--accent-soft:#dbeafe;--accent-border:#93c5fd;
  --green:#16a34a;--green-bg:#f0fdf4;--green-border:#bbf7d0;
  --amber:#d97706;--amber-bg:#fffbeb;
  --code-bg:#1e1e2e;--code-fg:#cdd6f4;
  --mono:'JetBrains Mono',monospace;--sans:'Inter',system-ui,sans-serif;
}
/* DARK MODE — Anthropic-inspired palette */
[data-theme="dark"]{
  --bg:#191919;--surface:#232323;--surface-2:#2a2a2a;--surface-3:#333;
  --border:#383838;--border-hi:#4a4a4a;
  --text:#e8e4de;--dim:#a8a29e;--muted:#6b6560;
  --accent:#d4a574;--accent-soft:rgba(212,165,116,.12);--accent-border:rgba(212,165,116,.3);
  --green:#6ee7b7;--green-bg:rgba(110,231,183,.08);--green-border:rgba(110,231,183,.25);
  --amber:#fbbf24;--amber-bg:rgba(251,191,36,.08);
  --code-bg:#141414;--code-fg:#d4d4d4;
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font:400 15px/1.7 var(--sans);-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-weight:600;line-height:1.3}
/* LOGO — top left */
.logo{position:fixed;top:1.4rem;left:2rem;z-index:1000;display:flex;align-items:center;gap:.6rem;text-decoration:none}
.logo img{height:36px}
.logo:hover{text-decoration:none;opacity:.85}

/* DARK MODE TOGGLE — top right, large and visible */
.theme-toggle{position:fixed;top:1.4rem;right:2.5rem;z-index:1001;cursor:pointer;font-size:1.6rem;width:2.4rem;height:2.4rem;display:flex;align-items:center;justify-content:center;border-radius:8px;background:var(--surface-2);border:1px solid var(--border);color:var(--text);transition:all .2s;line-height:1}
.theme-toggle:hover{border-color:var(--accent);color:var(--accent);background:var(--surface-3)}

/* SIDE NAV — right, vertical, roman numerals — HIGH CONTRAST */
.side-nav{position:fixed;top:50%;right:2.5rem;transform:translateY(-50%);z-index:1000;list-style:none}
.side-nav li{margin-bottom:1.8rem;text-align:right}
.side-nav a{color:var(--text);text-decoration:none;font-size:.95rem;font-weight:500;letter-spacing:.04em;transition:all .3s ease;position:relative;display:inline-flex;align-items:center;gap:.7rem}
.side-nav a:hover{color:var(--accent);text-decoration:none}
.side-nav a::before{content:'';width:0;height:2px;background:var(--accent);transition:width .3s ease}
.side-nav a:hover::before{width:28px}
.side-nav .num{font:600 .75rem var(--mono);color:var(--dim);min-width:1.5rem;transition:color .3s}
.side-nav a:hover .num{color:var(--accent)}
.side-nav a.active{color:var(--accent);font-weight:600}
.side-nav a.active .num{color:var(--accent)}
.side-nav a.active::before{width:28px;background:var(--accent)}
.side-nav .label{font:500 .95rem var(--sans)}

/* BURGER — mobile */
.burger{display:none;position:fixed;top:1.8rem;right:1.5rem;z-index:1001;width:28px;height:20px;cursor:pointer;flex-direction:column;justify-content:space-between}
.burger span{display:block;height:2px;background:var(--text);border-radius:2px;transition:all .3s}
.burger.open span:nth-child(1){transform:rotate(45deg) translate(6px,6px)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}

/* MOBILE DRAWER */
.drawer{display:none;position:fixed;inset:0;background:var(--bg);z-index:999;padding:5rem 2rem 2rem;opacity:0;transition:opacity .3s}
.drawer.open{opacity:1}
.drawer ul{list-style:none}
.drawer li{margin-bottom:1.8rem}
.drawer a{font-size:1.2rem;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:1rem}
.drawer .num{font:400 .85rem var(--mono);color:var(--muted);min-width:2rem}
.drawer a.active{color:var(--accent)}
.drawer a.active .num{color:var(--accent)}
/* LAYOUT — tighter padding */
.w{max-width:1400px;margin:0 auto;padding:0 8rem 0 3.5rem}
section{padding:3rem 0;border-bottom:1px solid var(--border)}
section:last-of-type{border-bottom:none}
.sh{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1.5rem}
.sh h2{font-size:1.2rem}
.sh a{font:500 .78rem var(--mono);color:var(--accent)}
/* HERO (sub-page) */
.page-hero{padding:5rem 0 2.5rem;border-bottom:1px solid var(--border)}
.page-hero h1{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:.5rem;letter-spacing:-.01em}
.page-hero .sub{font-size:1rem;color:var(--dim);max-width:700px}
.breadcrumb{font:400 .8rem var(--mono);color:var(--muted);margin-bottom:1rem}
.breadcrumb a{color:var(--muted)}
.breadcrumb a:hover{color:var(--accent)}
/* BADGES */
.badge{font:500 .7rem var(--mono);padding:.25rem .6rem;border-radius:20px;letter-spacing:.02em;display:inline-block}
.badge-green{background:var(--green-bg);color:var(--green);border:1px solid var(--green-border)}
.badge-blue{background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-border)}
.badge-amber{background:var(--amber-bg);color:var(--amber);border:1px solid #fde68a}
/* CARDS */
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}
.g2{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.card{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1.5rem;transition:border-color .15s}
.card:hover{border-color:var(--border-hi)}
.card h3{font-size:.95rem;margin-bottom:.4rem}
.card p{font-size:.85rem;color:var(--dim);line-height:1.65}
.card-link{display:inline-block;margin-top:.8rem;font:500 .8rem var(--sans);color:var(--accent)}
/* CODE */
pre{background:var(--code-bg);color:var(--code-fg);padding:1rem 1.2rem;border-radius:6px;font:400 .8rem/1.7 var(--mono);overflow-x:auto;margin:.8rem 0}
pre .cm{color:#6c7086}pre .kw{color:#89b4fa}pre .fn{color:#a6e3a1}pre .st{color:#f9e2af}
code{font-family:var(--mono);font-size:.82rem;background:var(--surface-2);padding:.15rem .4rem;border-radius:3px}
/* TABLE */
.tbl{width:100%;border:1px solid var(--border);border-radius:8px;overflow:hidden;font-size:.85rem;border-collapse:separate;border-spacing:0}
.tbl th{background:var(--surface-2);font:500 .7rem var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);text-align:left;padding:.65rem 1rem;border-bottom:1px solid var(--border)}
.tbl td{padding:.7rem 1rem;border-bottom:1px solid var(--border);vertical-align:top}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:var(--surface-2)}
.tag{font:500 .65rem var(--mono);padding:.2rem .5rem;border-radius:3px;letter-spacing:.02em;display:inline-block}
.tag-g{background:var(--green-bg);color:var(--green);border:1px solid var(--green-border)}
.tag-b{background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-border)}
.tag-a{background:var(--amber-bg);color:var(--amber);border:1px solid #fde68a}
.mono{font-family:var(--mono);font-size:.8rem;color:var(--dim)}
/* PROSE */
.prose{max-width:860px}
.prose h2{font-size:1.15rem;margin:2.5rem 0 1rem;padding-top:1.5rem;border-top:1px solid var(--border)}
.prose h2:first-child{border-top:none;margin-top:0;padding-top:0}
.prose h3{font-size:1rem;margin:1.8rem 0 .6rem}
.prose p{margin-bottom:1rem;font-size:.95rem;line-height:1.75;color:var(--dim)}
.prose p strong{color:var(--text);font-weight:500}
.prose ul,.prose ol{margin-bottom:1rem;padding-left:1.5rem;color:var(--dim);font-size:.95rem}
.prose li{margin-bottom:.4rem;line-height:1.65}
.prose blockquote{border-left:3px solid var(--accent);padding:.8rem 1.2rem;margin:1.5rem 0;background:var(--surface);border-radius:0 6px 6px 0;font-size:.9rem;color:var(--dim)}
/* BLOG */
.post{padding:2.5rem 0;border-bottom:1px solid var(--border)}
.post:last-child{border-bottom:none}
.post-date{font:400 .75rem var(--mono);color:var(--muted);margin-bottom:.5rem}
.post h2{font-size:1.15rem;margin-bottom:.8rem}
.post h2 a{color:var(--text)}.post h2 a:hover{color:var(--accent)}
/* STATS */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;margin:1.5rem 0}
.stat{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1.2rem;text-align:center}
.stat-val{font:600 1.8rem var(--sans);color:var(--text);display:block}
.stat-label{font:400 .75rem var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1.2rem;font:500 .82rem var(--sans);border-radius:6px;transition:all .15s;border:1px solid transparent;text-decoration:none;cursor:pointer}
.btn:hover{text-decoration:none}
.btn-p{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-p:hover{opacity:.9}
.btn-s{background:var(--surface);color:var(--text);border-color:var(--border)}
.btn-s:hover{border-color:var(--border-hi);background:var(--surface-2)}
/* ENDPOINTS */
.ep{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1.25rem}
.ep-label{font:500 .65rem var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.45rem}
.ep-url{font:400 .8rem var(--mono);color:var(--text);background:var(--surface-2);padding:.45rem .7rem;border-radius:4px;word-break:break-all;display:flex;justify-content:space-between;align-items:center}
.ep-url .copy{cursor:pointer;color:var(--muted);font-size:.7rem;padding:.2rem .4rem;border-radius:3px;transition:all .12s}
.ep-url .copy:hover{background:var(--surface-3);color:var(--text)}
.ep p{font-size:.8rem;color:var(--dim);margin-top:.5rem;line-height:1.6}
/* FAQ */
.faq-item{border-bottom:1px solid var(--border);padding:1.2rem 0}
.faq-item:last-child{border-bottom:none}
.faq-q{font:600 .95rem var(--sans);cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--text)}
.faq-q::after{content:'+';font-size:1.2rem;color:var(--muted);transition:transform .2s}
.faq-item.open .faq-q::after{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;color:var(--dim);font-size:.9rem;line-height:1.7}
.faq-item.open .faq-a{max-height:500px;padding-top:.8rem}
/* FOOTER */
footer{padding:2.5rem 0;color:var(--muted);font-size:.82rem;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);margin-top:1rem}
footer a{color:var(--dim)}footer a:hover{color:var(--text)}
.fr{display:flex;gap:1.5rem}
/* RESPONSIVE */
@media(max-width:900px){
  .side-nav{display:none}
  .burger{display:flex}
  .drawer.open{display:block}
  .w{padding:0 1.5rem}
  .page-hero{padding:4.5rem 0 2rem}
  .g3,.g2{grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,1fr)}
  footer{flex-direction:column;gap:1rem;text-align:center}
  pre{font-size:.72rem}
  .logo{left:1.5rem}
  .theme-toggle{right:4rem;top:1.5rem}
}