/* ============================================================================
   NerveArt — the MASTER theme (VS Code "studio" look). ONE source of truth.
   Loaded site-wide by base.html so every page shares it — no per-page drift.
   Steward (Job), 2026-08-10. Extracted from the studio home so it is reusable
   (extend Eden; never a per-page inline copy).
   ============================================================================ */
:root{
  --bg:#1e1e1e; --panel:#252526; --bar:#333333; --border:#2b2b2b; --tab:#2d2d2d;
  --accent:#007acc; --text:#d4d4d4; --dim:#858585; --line:#3c3c3c;
  --blue:#569cd6; --teal:#4ec9b0; --green:#6a9955; --orange:#ce9178; --purple:#c586c0;
  --yellow:#dcdcaa; --mono:"Cascadia Code",Consolas,"Fira Code",ui-monospace,monospace;
  --ui:"Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0}
body{background:#141414;color:var(--text);font-family:var(--ui);-webkit-font-smoothing:antialiased}
a{color:var(--blue)}

/* ---- the studio window (VS Code frame) ---- */
.na-app{max-width:1280px;margin:1.4rem auto;height:min(82vh,860px);display:flex;flex-direction:column;
  border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.55);background:var(--bg)}
.na-title{height:38px;background:var(--bar);display:flex;align-items:center;gap:.5rem;padding:0 .8rem;
  border-bottom:1px solid var(--border);font-size:12.5px;color:var(--dim)}
.dot{width:12px;height:12px;border-radius:50%}.dot.r{background:#ff5f56}.dot.y{background:#ffbd2e}.dot.g{background:#27c93f}
.na-title .name{margin-left:.6rem;color:#cfcfcf}.na-title .menus{margin-left:1.2rem;display:flex;gap:1rem}
.na-title .spacer{flex:1}
.na-body{flex:1;display:flex;min-height:0}
.na-act{width:48px;background:var(--bar);display:flex;flex-direction:column;align-items:center;padding-top:.6rem;gap:1rem;border-right:1px solid var(--border);color:var(--dim);font-family:var(--mono);font-size:13px}
.na-act b{color:#fff;border-left:2px solid var(--accent);padding-left:6px;margin-left:-8px}

/* ---- explorer (the plate catalogue, grouped by section) ---- */
.na-explorer{width:270px;background:var(--panel);border-right:1px solid var(--border);overflow:auto;font-size:13px}
.na-explorer .head{padding:.7rem .9rem .4rem;color:var(--dim);font-size:11px;letter-spacing:.08em}
.na-explorer .folder{padding:.34rem .9rem;color:#c8c8c8;font-weight:600;font-size:12.5px;cursor:default}
.na-explorer .file{padding:.26rem .9rem .26rem 1.9rem;color:#bfbfbf;cursor:pointer;font-family:var(--mono);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.na-explorer .file:hover{background:#2a2d2e}.na-explorer .file.on{background:#094771;color:#fff}
.na-explorer .file .ic{color:var(--orange);margin-right:.15rem}
.g{color:var(--teal)} .m{color:var(--yellow)} .c{color:var(--purple)} .x{color:var(--orange)} .b{color:var(--blue)}

/* ---- editor / canvas ---- */
.na-editor{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg)}
.na-tabs{height:36px;background:#252526;display:flex;border-bottom:1px solid var(--border)}
.na-tab{display:flex;align-items:center;gap:.5rem;padding:0 1rem;font-size:12.5px;color:#fff;background:var(--bg);border-right:1px solid var(--border);border-top:1px solid var(--accent);font-family:var(--mono)}
.na-canvas{flex:1;display:grid;grid-template-columns:1.15fr .85fr;min-height:0}
.na-stage{background:radial-gradient(1200px 500px at 30% 0%,#22262c,#141414);display:grid;place-items:center;padding:1.4rem;overflow:auto;position:relative}
/* plates are ink-on-paper + borderless (like Vortex) -> the CLEAR border lives on the tile,
   a light "paper" card so the ink reads on the dark studio stage */
.na-stage img,.na-stage object{max-width:94%;max-height:94%;background:#f4ecd8;border:1px solid #cdbfa0;
  border-radius:8px;padding:16px;box-shadow:0 14px 40px rgba(0,0,0,.45)}
.na-stage .badge{position:absolute;top:.8rem;left:1rem;font-family:var(--mono);font-size:11px;color:var(--green)}
.na-code{background:#1b1b1b;border-left:1px solid var(--border);padding:1.1rem 1.2rem;overflow:auto;font-family:var(--mono);font-size:12.5px;line-height:1.7}
.na-code .cm{color:var(--green)} .na-code .kw{color:var(--blue)} .na-code .fn{color:var(--yellow)}
.na-code .ty{color:var(--teal)} .na-code .nm{color:#b5cea8} .na-code .st{color:var(--orange)}
.na-code h4{font-family:var(--ui);color:#fff;font-size:15px;margin:.2rem 0 .7rem}
.na-code p{font-family:var(--ui);color:var(--dim);font-size:12.5px;line-height:1.6;margin:.7rem 0}
.na-code .prov{margin-top:1rem;color:var(--green);font-family:var(--mono);font-size:11.5px}
.na-status{height:26px;background:var(--accent);color:#fff;display:flex;align-items:center;gap:1.1rem;padding:0 .9rem;font-size:11.5px;font-family:var(--mono)}
.na-status .spacer{flex:1}

/* ---- hero + tags + footer (shared) ---- */
.na-hero{max-width:1280px;margin:1.6rem auto 0;padding:0 1rem;text-align:center}
.na-hero h1{font-size:clamp(30px,5vw,52px);font-weight:800;letter-spacing:-.025em;color:#fff;line-height:1.05;margin:.2rem 0}
.na-hero h1 .grad{background:linear-gradient(90deg,#4ec9b0,#569cd6,#c586c0);-webkit-background-clip:text;background-clip:text;color:transparent}
.na-hero p{color:#a9b3c2;max-width:660px;margin:.9rem auto;font-size:18px;line-height:1.55}
.na-tags{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-top:1.1rem}
.na-tag{border:1px solid #2f3a48;background:#1a2130;color:#9fb2cc;border-radius:999px;padding:.35rem .9rem;font-size:12.5px;font-family:var(--mono)}
.na-tag b{color:#4ec9b0}
.na-foot{max-width:1280px;margin:1.6rem auto 3rem;padding:1.4rem 1rem 0;border-top:1px solid #23262c;color:var(--dim);font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem}
.na-foot a{color:#569cd6;text-decoration:none}

@media(max-width:820px){.na-explorer{width:200px}.na-canvas{grid-template-columns:1fr}.na-code{display:none}.na-app{height:78vh}}

/* ============================ minimal public front ============================ */
.na-front-wrap{max-width:720px;margin:0 auto;min-height:78vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding:2rem 1.2rem;gap:.2rem}
.na-mark{margin-bottom:.4rem;opacity:.95}
.na-front-h1{font-size:clamp(44px,9vw,88px);font-weight:800;letter-spacing:-.03em;color:#fff;margin:0}
.na-front-h1 .grad{background:linear-gradient(90deg,#4ec9b0,#569cd6,#c586c0);-webkit-background-clip:text;background-clip:text;color:transparent}
.na-front-lede{color:#a9b3c2;max-width:56ch;font-size:clamp(15px,2.2vw,18px);line-height:1.6;margin:1rem 0 0}
.na-front-actions{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center;margin-top:1.8rem}
.na-front-foot{color:var(--dim);font-size:12.5px;margin-top:2.4rem;font-family:var(--mono)}
.na-btn{display:inline-block;padding:.7rem 1.3rem;border-radius:8px;border:1px solid var(--line);
  color:var(--text);text-decoration:none;font-size:14px;background:#1a2130;transition:transform .15s,border-color .15s}
.na-btn:hover{transform:translateY(-2px);border-color:var(--teal)}
.na-btn-primary{background:linear-gradient(90deg,#0e639c,#007acc);border-color:#0a5a91;color:#fff;font-weight:600}

/* ============================ the workbench ============================ */
.na-hero-slim{margin:1rem auto .2rem}
.na-app-bench{height:min(84vh,900px)}
.na-canvas-bench{grid-template-columns:1fr 1fr}
.na-pane{display:flex;flex-direction:column;min-width:0;min-height:0}
.na-pane-code{border-right:1px solid var(--border);background:#1b1b1b}
.na-pane-bar{height:32px;display:flex;align-items:center;gap:.5rem;padding:0 .7rem;background:#252526;
  border-bottom:1px solid var(--border);font-family:var(--mono);font-size:11.5px;color:var(--dim)}
.na-pane-bar .spacer{flex:1}
.na-b{background:#2d2d2d;color:#d4d4d4;border:1px solid var(--line);border-radius:5px;font-family:var(--mono);
  font-size:11.5px;padding:.22rem .6rem;cursor:pointer}
.na-b:hover{background:#37373d;border-color:var(--accent)}
.na-b:disabled{opacity:.4;cursor:default}
#naEditor{flex:1;min-height:0;resize:none;border:0;outline:0;background:#1b1b1b;color:#d4d4d4;
  font-family:var(--mono);font-size:13px;line-height:1.6;padding:.9rem 1rem;tab-size:2;white-space:pre;overflow:auto}
.na-console{height:30px;border-top:1px solid var(--border);background:#161616;color:var(--green);
  font-family:var(--mono);font-size:11.5px;display:flex;align-items:center;padding:0 1rem;flex:none}
.na-console.err{color:#f48771}
.na-pane-view{background:var(--bg)}
.na-preview{flex:1;min-height:0;display:grid;place-items:center;padding:1.2rem;
  background:radial-gradient(1200px 500px at 30% 0%,#22262c,#141414);cursor:zoom-in;overflow:auto}
.na-plate-img,.na-plate-svg{width:auto;max-width:94%;max-height:94%;background:#f4ecd8;border:1px solid #cdbfa0;
  border-radius:8px;padding:16px;box-shadow:0 14px 40px rgba(0,0,0,.45)}
.na-cap{flex:none;padding:.6rem 1rem;border-top:1px solid var(--border);color:var(--dim);
  font-size:12.5px;font-family:var(--ui);background:#1b1b1b}
/* subject menu on the activity bar */
.na-act{gap:.35rem;padding-top:.5rem}
.na-actbtn{width:44px;background:none;border:0;border-left:2px solid transparent;color:var(--dim);cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:1px;padding:.4rem 0;font-family:var(--mono)}
.na-actbtn .ag{font-size:16px;line-height:1}
.na-actbtn .al{font-size:9px;letter-spacing:.02em}
.na-actbtn:hover{color:#fff;background:#2a2d2e;border-left-color:var(--accent)}
.na-explorer .folder.flash{background:#094771;color:#fff;border-radius:4px}
.na-explorer .file.live{color:#e8e8e8}
.na-explorer .file.live .ic{color:var(--teal)}
.na-run-hint{color:#9fd4c2;font-family:var(--mono);font-size:11.5px}

/* enlarge modal */
.na-modal{position:fixed;inset:0;background:rgba(8,10,14,.82);display:none;place-items:center;z-index:50;padding:3vh 3vw}
.na-modal.on{display:grid}
.na-modal-inner{position:relative;max-width:96vw;max-height:94vh;display:grid;place-items:center}
.na-modal-inner img,.na-modal-inner svg{max-width:92vw;max-height:90vh;background:#f4ecd8;border:1px solid #cdbfa0;
  border-radius:12px;padding:24px;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.na-modal-x{position:absolute;top:-14px;right:-14px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);
  background:#252526;color:#fff;font-size:20px;cursor:pointer;line-height:1}

/* BYOK keys panel */
.na-keys{position:fixed;inset:0;background:rgba(8,10,14,.7);display:none;place-items:center;z-index:60;padding:4vh 4vw}
.na-keys.on{display:grid}
.na-keys-inner{max-width:480px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1.4rem 1.5rem;color:var(--text)}
.na-keys-inner h4{margin:0 0 .5rem;color:#fff;font-size:16px}
.na-keys-inner p{color:var(--dim);font-size:13px;line-height:1.6;margin:0 0 1rem}
.na-keys-inner input{width:100%;padding:.6rem .8rem;border-radius:7px;border:1px solid var(--line);
  background:#1b1b1b;color:#d4d4d4;font-family:var(--mono);font-size:13px}
.na-keys-actions{display:flex;gap:.6rem;justify-content:flex-end;margin-top:1rem}
.na-title .menus #mKeys{cursor:pointer}
.na-title .menus #mKeys:hover{color:#fff}

@media(max-width:820px){.na-canvas-bench{grid-template-columns:1fr}.na-pane-view{display:none}}

/* ============================ article (findings) — pure VS Code theme, inherits nasite.css ============================ */
.na-article{max-width:1000px;margin:0 auto;padding:1.5rem 22px 4rem}
.na-article .lead{max-width:70ch}
.na-art-hero{padding:2.4rem 0 1.4rem;border-bottom:1px solid var(--line)}
.na-art-hero h1{font-size:clamp(32px,6vw,60px);font-weight:800;letter-spacing:-.03em;color:#fff;line-height:1.05;margin:.4rem 0}
.na-art-hero h1 .grad{background:linear-gradient(100deg,var(--teal),var(--blue),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}
.na-art-hero .lede{color:#a9b3c2;font-size:clamp(17px,2.2vw,21px);max-width:60ch;margin:.8rem 0 0;line-height:1.55}
.na-article h2{font-size:clamp(22px,3.4vw,32px);color:#fff;font-weight:700;letter-spacing:-.01em;margin:2.4rem 0 .3rem}
.na-article h3{font-size:18px;color:#fff;margin:1.6rem 0 .3rem}
.na-article p{color:var(--text);font-size:16.5px;line-height:1.7;margin:.8rem 0;max-width:72ch}
.na-article a{color:var(--mint);text-decoration:none;border-bottom:1px solid rgba(56,211,159,.35)}
.na-art-eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mint)}
.na-bignum{font-family:var(--mono);font-weight:700;font-size:clamp(48px,10vw,92px);line-height:.9;letter-spacing:-.03em;
  background:linear-gradient(180deg,var(--teal),var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.na-headline{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;margin:1.4rem 0}
.na-headline .say{color:#cfd8e0;font-size:17px;line-height:1.55}.na-headline .say b{color:var(--mint)}
.na-tilegrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:1.4rem 0}
.na-stat{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px;position:relative;overflow:hidden}
.na-stat .rail{position:absolute;left:0;top:0;bottom:0;width:4px}
.na-stat .k{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.na-stat .v{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:28px;font-weight:700;color:#fff;margin-top:.1rem}
.na-stat .s{font-size:12.5px;color:var(--dim)}
.na-fig{margin:1.8rem 0}
.na-fig .frame{background:radial-gradient(1200px 460px at 30% -10%,#22262c,#141414);border:1px solid var(--line);border-radius:12px;padding:20px;display:grid;place-items:center;overflow-x:auto}
.na-fig img{max-width:96%;height:auto;background:#f4ecd8;border:1px solid #cdbfa0;border-radius:8px;padding:14px;box-shadow:0 14px 40px rgba(0,0,0,.5)}
.na-fig figcaption{margin-top:.7rem;color:var(--dim);font-size:13.5px;font-family:var(--ui);max-width:72ch}
.na-fig figcaption b{color:var(--text)}
.na-figrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.na-figrow .na-fig{margin:0}.na-figrow .frame{padding:12px}
.na-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--panel);margin:1.2rem 0}
.na-article table{border-collapse:collapse;width:100%;font-size:14.5px}
.na-article th,.na-article td{padding:10px 13px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap;color:var(--text)}
.na-article thead th{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.na-article td.n,.na-article th.n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.na-article tr.total td{font-weight:700;background:#20262c;color:#fff}
.na-idot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px}
.na-steps{display:grid;gap:12px;margin:1.2rem 0}
.na-stepc{display:grid;grid-template-columns:auto 1fr;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.na-stepc .i{font-family:var(--mono);font-size:12.5px;font-weight:700;color:var(--mint);border:1px solid var(--line);border-radius:7px;padding:.3rem .5rem;height:fit-content}
.na-stepc h4{color:#fff;margin:.1rem 0 .25rem;font-size:15.5px}.na-stepc p{color:var(--dim);font-size:14.5px;margin:0;max-width:none}
.na-refs{columns:2;column-gap:30px;font-size:14px;margin-top:.8rem}
@media(max-width:720px){.na-refs{columns:1}.na-headline{grid-template-columns:1fr}}
.na-refs p{break-inside:avoid;color:var(--dim);margin:0 0 .8rem;max-width:none}.na-refs b{color:var(--text)}
.na-callout{border-left:3px solid var(--mint);background:#20262c;padding:12px 16px;border-radius:0 8px 8px 0;margin:1.4rem 0;color:#cfd8e0;font-size:15.5px}
.na-callout .mono{font-family:var(--mono);color:var(--mint)}

/* modelling tool — kinds registry + model detail (VS Code, inherits theme) */
.na-paradigm{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center;font-family:var(--mono);font-size:12.5px;color:var(--dim);margin:1rem 0 0}
.na-paradigm .p{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:.32rem .7rem;color:var(--text)}
.na-paradigm .p b{color:var(--mint)}.na-paradigm .a{color:var(--dim)}
.na-kinds{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin:1.2rem 0}
.na-kind{display:block;background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:15px 16px;text-decoration:none;color:var(--text);position:relative;transition:transform .15s,border-color .15s}
.na-kind[href]:hover{transform:translateY(-3px);border-color:var(--accent)}
.na-kind.soon{opacity:.5}
.na-kind .gl{font-size:22px;line-height:1}
.na-kind h4{margin:.45rem 0 .2rem;color:#fff;font-size:16px}
.na-kind p{margin:0;color:var(--dim);font-size:13px;max-width:none;line-height:1.5}
.na-kind .badge{position:absolute;top:13px;right:13px;font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mint);border:1px solid var(--line);border-radius:5px;padding:.14rem .42rem}
.na-kind .badge.soon{color:var(--dim)}
.na-meta{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1rem;font-size:14px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:1rem 0}
.na-meta dt{font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.na-meta dd{margin:0;color:var(--text)}
.na-actions{display:flex;gap:12px;flex-wrap:wrap;margin:1.2rem 0 .3rem}
.na-dl{font-family:var(--mono);font-size:13.5px;text-decoration:none;padding:.65rem 1.1rem;border-radius:8px;border:1px solid var(--line);color:var(--text);background:var(--panel)}
.na-dl:hover{border-color:var(--mint);color:#fff}
.na-dl.primary{background:linear-gradient(100deg,#0e639c,#007acc);color:#fff;border:0;font-weight:600}
.na-hashline{font-family:var(--mono);font-size:11px;color:var(--green);word-break:break-all;margin-top:.5rem}