:root{
  --white:#ffffff;
  --black:#0a0a0a;
  --red:#ff3b1f;
  --grid:rgba(10,10,10,0.07);
  --display:'Archivo Black', sans-serif;
  --mono:'IBM Plex Mono', monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
@keyframes rowSlideIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.row-enter{animation:rowSlideIn 0.35s ease both;}
body{
  background:var(--white);
  color:var(--black);
  font-family:var(--mono);
  font-size:15px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--black);color:var(--white);}
a{color:inherit;}

.grid-overlay{
  position:fixed;inset:0;z-index:1;pointer-events:none;
  background-image:repeating-linear-gradient(90deg, var(--grid) 0, var(--grid) 1px, transparent 1px, transparent calc(100% / 12));
}
@media (max-width:700px){
  .grid-overlay{background-image:repeating-linear-gradient(90deg, var(--grid) 0, var(--grid) 1px, transparent 1px, transparent calc(100% / 4));}
}

.readout{
  position:fixed;bottom:14px;left:14px;z-index:40;
  font-family:var(--mono);font-size:11px;letter-spacing:0.02em;
  background:var(--white);border:1px solid var(--black);
  padding:6px 10px;
}
@media (max-width:700px){ .readout{display:none;} }

.wrap{max-width:1400px;margin:0 auto;padding:0 40px;}
@media (max-width:700px){ .wrap{padding:0 20px;} }

header{
  position:fixed;top:0;left:0;right:0;z-index:30;
  background:var(--white);border-bottom:3px solid var(--black);
}
.nav-inner{
  max-width:1400px;margin:0 auto;padding:16px 40px;
  display:flex;justify-content:space-between;align-items:center;
}
@media (max-width:700px){ .nav-inner{padding:14px 20px;} }
.mark{font-family:var(--mono);font-weight:600;font-size:13px;letter-spacing:0.02em;text-decoration:none;}
nav.links{display:flex;gap:8px;}
nav.links a{
  font-family:var(--mono);font-size:12px;padding:6px 16px;
  border:1px solid var(--black);text-decoration:none;
  transition:background 0.15s, color 0.15s;
}
nav.links a:hover, nav.links a.active{background:var(--black);color:var(--white);}
@media (max-width:700px){ nav.links{display:none;} }

section{border-bottom:3px solid var(--black);position:relative;z-index:2;}
main{min-height:100vh;}
.pad{padding:150px 0 90px;}
@media (max-width:700px){ .pad{padding:120px 0 60px;} }

.label{
  font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:0.04em;
  display:flex;align-items:center;gap:10px;margin-bottom:26px;
}
.label::before{content:'';width:24px;height:2px;background:var(--black);display:inline-block;}

h1.giant{
  font-family:var(--display);
  font-size:clamp(2.6rem, 10vw, 9.5rem);
  line-height:0.94;letter-spacing:-0.01em;text-transform:uppercase;margin:0 -2px;
}
.hero-foot{
  display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:50px;
  border-top:1px solid var(--black);padding-top:26px;
}
@media (max-width:700px){ .hero-foot{grid-template-columns:1fr;} }
.hero-foot p{max-width:46ch;font-size:14px;}
.hero-cta{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;}
.btn{
  font-family:var(--mono);font-size:13px;font-weight:600;
  padding:14px 24px;border:2px solid var(--black);
  transition:background 0.15s, color 0.15s;display:inline-block;text-decoration:none;
  cursor:pointer;background:var(--white);color:var(--black);
}
.btn.solid{background:var(--black);color:var(--white);}
.btn.solid:hover{background:var(--red);border-color:var(--red);}
.btn.outline:hover{background:var(--black);color:var(--white);}

.statement{background:var(--black);color:var(--white);}
.statement .label::before{background:var(--white);}
.manifesto{font-family:var(--display);font-size:clamp(1.6rem,4.4vw,3.4rem);line-height:1.16;text-transform:uppercase;max-width:16ch;}
.manifesto .dim{color:#6b6b6b;}
.manifesto .hit{color:var(--red);}

.system{background:var(--white);}
.system-grid{display:grid;grid-template-columns:1fr 280px;gap:40px;align-items:start;}
@media (max-width:900px){ .system-grid{grid-template-columns:1fr;} }
.schem-container{
  overflow-x:auto;cursor:grab;user-select:none;
  border:1.5px solid var(--black);padding:16px;background:var(--white);
  scrollbar-width:thin;
}
.schem-container.grabbing{cursor:grabbing;}
svg.schem{min-width:680px;width:100%;height:auto;display:block;}
.schem-line{fill:none;stroke:var(--black);stroke-width:1.4;}
.schem-line.thin{stroke-width:1;}
.schem-band{fill:none;stroke:var(--black);stroke-width:1.6;cursor:pointer;transition:all 0.15s ease;}
.schem-band:hover{stroke:var(--red);stroke-width:2.4;}
.schem-band.hit{stroke:var(--red);}
.schem-band.active{stroke:var(--red);stroke-width:3;fill:rgba(230,57,70,0.06);}
.schem-tick{stroke:var(--black);stroke-width:1;}
.schem-text{font-family:var(--mono);font-size:11px;fill:var(--black);letter-spacing:0.02em;pointer-events:none;}
.schem-text.dim{fill:#7a7a7a;}
.schem-text.hit{fill:var(--red);font-weight:600;}
.schem-band-label{font-family:'Archivo Black', sans-serif;font-size:15px;fill:var(--black);text-transform:uppercase;pointer-events:none;}
.system-notes{border-left:2px solid var(--black);padding-left:24px;}
@media (max-width:900px){ .system-notes{border-left:none;border-top:2px solid var(--black);padding-left:0;padding-top:20px;margin-top:8px;} }
.system-note{margin-bottom:16px;padding:10px 12px;border:1px solid transparent;transition:all 0.15s ease;cursor:pointer;}
.system-note:last-child{margin-bottom:0;}
.system-note:hover, .system-note.active{border-color:var(--black);background:rgba(0,0,0,0.02);}
.system-note.active{border-left:3px solid var(--red);}
.system-note .k{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--red);letter-spacing:0.03em;margin-bottom:6px;}
.system-note .v{font-size:13px;max-width:34ch;}
.dwg-tag{
  display:flex;justify-content:space-between;margin-top:36px;padding-top:16px;
  border-top:1px solid var(--black);font-size:11px;letter-spacing:0.02em;opacity:0.75;
}

.index-list{border-top:2px solid var(--black);}
.row{
  display:grid;grid-template-columns:90px 1fr 240px;gap:24px;
  padding:34px 0;border-bottom:2px solid var(--black);align-items:start;
  transition:background 0.15s, color 0.15s;
}
.row:hover{background:var(--black);color:var(--white);}
.row:hover .row-stack span{border-color:var(--white);}
.row:hover .truth{color:var(--red);}
@media (max-width:820px){ .row{grid-template-columns:1fr;gap:10px;padding:26px 0;} }
.row-num{font-family:var(--display);font-size:2rem;line-height:1;}
.row-title{font-family:var(--display);font-size:clamp(1.2rem,2.6vw,1.9rem);text-transform:uppercase;margin-bottom:10px;}
.row-meta{font-size:11.5px;letter-spacing:0.03em;margin-bottom:14px;color:#444;}
.row:hover .row-meta{color:#ccc;}
.row-desc{font-size:14px;max-width:56ch;margin-bottom:16px;}
.truth{font-size:12.5px;font-weight:600;}
.truth-label{color:var(--red);}
.row-stack{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;}
.row-stack span, .row-stack .tag-chip-btn{
  font-family:var(--mono);font-size:11px;border:1px solid var(--black);
  padding:4px 8px;background:transparent;color:var(--black);cursor:pointer;
  transition:all 0.15s ease;line-height:1.2;
}
.row-stack .tag-chip-btn:hover{background:var(--black);color:var(--white);}
.row-stack .tag-chip-btn.active{background:var(--red);border-color:var(--red);color:var(--white);}
.row:hover .row-stack span, .row:hover .row-stack .tag-chip-btn{border-color:var(--white);color:var(--white);}
.row:hover .row-stack .tag-chip-btn:hover{background:var(--white);color:var(--black);}
.row:hover .row-stack .tag-chip-btn.active{background:var(--red);border-color:var(--red);color:var(--white);}

.filter-chip{
  font-family:var(--mono);font-size:11px;font-weight:600;padding:6px 12px;
  border:1.5px solid var(--black);background:var(--white);color:var(--black);
  cursor:pointer;letter-spacing:0.04em;transition:all 0.15s ease;
}
.filter-chip:hover{background:var(--black);color:var(--white);}
.filter-chip.active{background:var(--black);color:var(--white);}

.stack-chip{
  font-family:var(--mono);font-size:11px;font-weight:600;padding:6px 12px;
  border:1.5px solid #555;background:transparent;color:#ccc;
  cursor:pointer;letter-spacing:0.04em;transition:all 0.15s ease;
}
.stack-chip:hover{border-color:var(--white);color:var(--white);}
.stack-chip.active{background:var(--white);border-color:var(--white);color:var(--black);}

.project-action-btn{
  display:inline-flex;align-items:center;font-family:var(--mono);
  font-size:11px;font-weight:600;padding:4px 10px;border:1.5px solid var(--black);
  color:var(--black);text-decoration:none;letter-spacing:0.03em;transition:all 0.15s ease;
}
.project-action-btn:hover{background:var(--black);color:var(--white);}
.project-action-btn.live{border-color:var(--red);color:var(--red);}
.project-action-btn.live:hover{background:var(--red);color:var(--white);}
.row:hover .project-action-btn{border-color:var(--white);color:var(--white);}
.row:hover .project-action-btn:hover{background:var(--white);color:var(--black);}
.row:hover .project-action-btn.live{border-color:var(--red);color:var(--red);}
.row:hover .project-action-btn.live:hover{background:var(--red);color:var(--white);}

.stack-sec{background:var(--black);color:var(--white);}
.stack-sec .label::before{background:var(--white);}
.stack-list{border-top:1px solid #333;}
.stack-row{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:20px 0;border-bottom:1px solid #333;}
@media (max-width:700px){ .stack-row{grid-template-columns:1fr;gap:4px;} }
.stack-k{font-family:var(--display);font-size:13px;text-transform:uppercase;}
.stack-v{font-size:13.5px;color:#c9c9c9;}
.stack-v b{color:var(--white);font-weight:600;}

.contact{background:var(--white);border-bottom:none;}
.contact-h{font-family:var(--display);font-size:clamp(2.2rem,7vw,6rem);text-transform:uppercase;line-height:0.98;margin-bottom:36px;}
.contact-link{
  display:block;font-family:var(--mono);font-size:clamp(1.1rem,2.6vw,1.7rem);
  font-weight:600;text-decoration:underline;text-underline-offset:6px;
  padding:18px 0;border-top:1px solid var(--black);
}
.contact-link:last-of-type{border-bottom:1px solid var(--black);}
.contact-link:hover{background:var(--black);color:var(--white);}

footer{
  background:var(--black);color:var(--white);padding:24px 0;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:11.5px;
}
.loading{color:var(--black);font-size:13px;padding:20px 0;opacity:0.75;}
.stack-sec .loading{color:var(--white);}

/* ---------- ADMIN ---------- */
.admin-wrap{max-width:900px;margin:0 auto;padding:150px 24px 80px;}
.admin-card{border:2px solid var(--black);padding:32px;margin-bottom:24px;}
.admin-card h2{font-family:var(--display);font-size:1.2rem;text-transform:uppercase;margin-bottom:20px;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:11.5px;font-weight:600;letter-spacing:0.03em;margin-bottom:6px;}
.field input, .field textarea, .field select{
  width:100%;font-family:var(--mono);font-size:13.5px;padding:10px;
  border:1.5px solid var(--black);background:var(--white);color:var(--black);
}
.field textarea{resize:vertical;min-height:70px;}
.admin-list-item{
  display:grid;grid-template-columns:1fr auto;gap:16px;
  padding:16px 0;border-bottom:1px solid var(--black);align-items:center;
}
.admin-list-item:first-child{border-top:1px solid var(--black);}
.admin-list-item .title{font-weight:600;font-size:14px;}
.project-link{color:var(--black);}
.row:hover .project-link{color:var(--white);}
.admin-list-item .sub{font-size:12px;color:#555;}
.admin-actions{display:flex;gap:8px;}
.msg{font-size:13px;padding:10px 0;}
.msg.error{color:var(--red);font-weight:600;}
.msg.ok{color:#1a7a1a;font-weight:600;}

/* ---------- NOTE TERMINAL & MARKDOWN STYLING ---------- */
.terminal-block{
  background:var(--black);color:var(--white);
  border:2px solid var(--black);margin:24px 0;
}
.terminal-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:8px 14px;border-bottom:1px solid #222;
  background:#141414;font-family:var(--mono);font-size:11px;
  letter-spacing:0.04em;
}
.terminal-lang{color:#888;font-weight:600;}
.copy-code-btn{
  background:transparent;border:1px solid #444;color:#aaa;
  font-family:var(--mono);font-size:10.5px;padding:3px 8px;
  cursor:pointer;transition:all 0.15s ease;
}
.copy-code-btn:hover{color:var(--white);border-color:var(--white);}
.copy-code-btn.copied{color:#16a34a;border-color:#16a34a;}
.terminal-block pre{
  padding:16px;overflow-x:auto;margin:0;font-family:var(--mono);
  font-size:13.5px;line-height:1.6;
}
.inline-code{
  font-family:var(--mono);font-size:13px;padding:2px 6px;
  background:#f2f2f2;border:1px solid #ddd;color:var(--black);
}
.note-h1{font-family:var(--display);font-size:1.6rem;text-transform:uppercase;margin:32px 0 16px;}
.note-h2{font-family:var(--display);font-size:1.3rem;text-transform:uppercase;margin:28px 0 14px;}
.note-h3{font-family:var(--mono);font-size:1.05rem;font-weight:600;text-transform:uppercase;margin:24px 0 12px;color:var(--red);}
.note-ul{margin:16px 0 20px 24px;list-style-type:square;}
.note-li{margin-bottom:8px;font-size:14.5px;line-height:1.6;}