:root { color-scheme: dark; --mesh-bg:#07101f; --mesh-panel:#0d1728; --mesh-border:#273750; --mesh-text:#dce7f7; --mesh-muted:#93a4bd; --mesh-accent:#67e8f9; --mesh-hot:#f43f5e; }
*,*::before,*::after { box-sizing:border-box; }
body { margin:0; overflow-x:hidden; background:radial-gradient(circle at 80% 0,#0e2940 0,transparent 35%),var(--mesh-bg); color:var(--mesh-text); font:16px/1.55 Inter,ui-sans-serif,system-ui,sans-serif; }
.mesh-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem clamp(1rem,4vw,4rem); border-bottom:1px solid var(--mesh-border); background:rgba(7,16,31,.95); backdrop-filter:blur(12px); }
.mesh-header nav { display:flex; flex-wrap:wrap; gap:.4rem; }.mesh-header a { color:var(--mesh-text); text-decoration:none; padding:.35rem .55rem; border-radius:.35rem; }.mesh-header a:hover,.mesh-header a:focus-visible,.mesh-header [aria-current] { background:#15243a; color:#fff; }
.mesh-brand { font-weight:850; }.mesh-shell { width:min(1800px,calc(100% - 2rem)); margin:auto; }.mesh-intro { padding:clamp(2rem,6vw,5rem) 0 2rem; max-width:1050px; }.eyebrow { color:var(--mesh-accent); text-transform:uppercase; letter-spacing:.1em; font-weight:800; font-size:.8rem; }.mesh-intro h1 { font-size:clamp(2.3rem,6vw,5.8rem); line-height:.96; margin:.25rem 0 1rem; letter-spacing:-.05em; }.lede { font-size:clamp(1.05rem,2vw,1.4rem); color:#c6d4e8; max-width:75ch; }.mesh-notice { border-left:3px solid #f59e0b; background:#201a12; padding:1rem; max-width:80ch; }
.mesh-stats { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1rem; }.mesh-stats span { border:1px solid var(--mesh-border); background:var(--mesh-panel); border-radius:.5rem; padding:.5rem .7rem; }
.mesh-controls { display:grid; grid-template-columns:minmax(18rem,2fr) minmax(10rem,1fr) auto; gap:.8rem; align-items:end; padding:1rem; border:1px solid var(--mesh-border); border-radius:.7rem; background:var(--mesh-panel); }.mesh-controls label { display:grid; gap:.3rem; color:var(--mesh-muted); font-size:.82rem; font-weight:750; }.mesh-controls input,.mesh-controls select,.mesh-controls button { min-height:2.65rem; border:1px solid #385071; border-radius:.4rem; background:#081222; color:var(--mesh-text); padding:.55rem .7rem; }.mesh-controls p { grid-column:1/-1; margin:0; color:var(--mesh-muted); }
.mesh-workspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(20rem,27rem); gap:1rem; margin:1rem 0 2rem; align-items:start; }.mesh-matrix-region,.mesh-detail,.mesh-method { min-width:0; border:1px solid var(--mesh-border); border-radius:.7rem; background:rgba(13,23,40,.94); padding:1rem; }.mesh-matrix { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(14rem,1fr); gap:.6rem; width:100%; max-width:100%; overflow:auto; overscroll-behavior:contain; padding:.25rem 0 1rem; max-height:72vh; }.mesh-tactic { display:flex; flex-direction:column; gap:.35rem; }.mesh-tactic h3 { position:sticky; top:0; z-index:2; margin:0; padding:.7rem; background:#8e1d24; border-radius:.4rem; font-size:.82rem; text-transform:uppercase; }.mesh-technique { width:100%; text-align:left; border:1px solid #31425b; border-radius:.35rem; background:#162336; color:var(--mesh-text); padding:.55rem; cursor:pointer; }.mesh-technique strong { display:block; color:#8bd8ff; font-size:.74rem; }.mesh-technique:hover,.mesh-technique:focus-visible,.mesh-technique[aria-pressed=true] { border-color:var(--mesh-hot); background:#402033; }.mesh-sub { margin-left:.7rem; width:calc(100% - .7rem); background:#0c1727; }
.mesh-detail { position:sticky; top:5rem; max-height:82vh; overflow:auto; }.mesh-detail h2 { margin-top:0; font-size:clamp(1.5rem,3vw,2.2rem); }.mesh-kicker { color:var(--mesh-accent); font-weight:800; }.mesh-detail-section { border-top:1px solid var(--mesh-border); padding-top:.8rem; margin-top:.8rem; }.mesh-detail ul { padding-left:1.15rem; }.mesh-detail a { color:#8bd8ff; }.mesh-pill-list { display:flex;flex-wrap:wrap;gap:.35rem}.mesh-pill { border:1px solid #385071;border-radius:999px;padding:.2rem .45rem;font-size:.75rem}.mesh-method { max-width:1000px; margin:0 0 2rem; }.mesh-footer { padding:2rem; text-align:center; border-top:1px solid var(--mesh-border); color:var(--mesh-muted); }.mesh-footer a { color:#a8c8ee; }
@media(max-width:900px){.mesh-header{align-items:flex-start;flex-direction:column}.mesh-controls{grid-template-columns:1fr}.mesh-workspace{grid-template-columns:1fr}.mesh-detail{position:static;max-height:none}.mesh-matrix{max-height:70vh}.mesh-shell{width:min(100% - 1rem,1800px)}}
@media(max-width:430px){.mesh-header nav{display:grid;grid-template-columns:1fr 1fr;width:100%}.mesh-controls{padding:.7rem}.mesh-matrix{grid-auto-columns:minmax(12.5rem,85vw)}}