/*
  APOΞTIC UI Framework — Theme II
  Reusable visual foundation for APOΞTIC web projects.
  BLACK → GRAY → WHITE ; TEAL = SIGNAL
*/
:root{
  --apo-void:#050606;
  --apo-panel:#090a0a;
  --apo-carbon:#181b1b;
  --apo-graphite:#343939;
  --apo-ash:#a7afae;
  --apo-signal:#15cbbd;
  --apo-flux:#00e6d2;
  --apo-white:#fff;
  --apo-ghost:#e8eceb;
  --apo-line:#27302f;
  --apo-muted:#6f7978;
  --apo-font:Consolas,"SFMono-Regular","Liberation Mono",monospace;
  --apo-radius:3px;
  --apo-gap:7px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--apo-void);color:var(--apo-ghost);font-family:var(--apo-font)}
body{overflow:hidden}
button,input,textarea{font:inherit}
button{
  border:1px solid var(--apo-graphite);border-radius:var(--apo-radius);
  background:#101313;color:var(--apo-ash);padding:7px 9px;cursor:pointer;
  transition:border-color .12s,color .12s,background .12s,box-shadow .12s
}
button:hover{border-color:var(--apo-signal);color:var(--apo-white)}
button.on,.apo-active{
  border-color:var(--apo-signal);color:var(--apo-flux);
  background:#0a1716;box-shadow:inset 0 0 12px #15cbbd12
}
input,textarea{
  border:1px solid var(--apo-graphite);border-radius:var(--apo-radius);
  background:#080a0a;color:var(--apo-white);outline:none
}
input:focus,textarea:focus{border-color:var(--apo-signal);box-shadow:0 0 0 1px #15cbbd22}
textarea{resize:none}
.apo-panel{background:var(--apo-panel);border:1px solid var(--apo-line)}
.apo-section{border-bottom:1px solid #202626;padding:10px}
.apo-section:last-child{border-bottom:0}
h1,h2,h3,p{margin-top:0}
h3{
  margin:0 0 8px;color:var(--apo-ash);font-size:10px;font-weight:600;
  letter-spacing:1.5px;text-transform:uppercase
}
.apo-brand{color:var(--apo-white);letter-spacing:2px}
.apo-signal{color:var(--apo-flux)}
.apo-muted{color:var(--apo-muted)}
.apo-probe{
  margin-top:7px;padding:7px;border:1px solid #202827;background:#060808;
  color:#899392;font-size:9px;line-height:1.55;min-height:30px
}
.apo-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.apo-actions button{min-width:0}
.apo-chip-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:4px}
.apo-chip-grid button{padding:5px 7px;font-size:9px;white-space:nowrap}
.apo-num{width:58px;padding:5px;text-align:right}
.apo-range{width:100%;accent-color:var(--apo-signal)}
.apo-scroll{scrollbar-width:thin;scrollbar-color:var(--apo-graphite) var(--apo-panel)}
.apo-hud{font-size:9px;color:#7e8988;letter-spacing:.4px}
.apo-divider{height:1px;background:var(--apo-line);margin:8px 0}
.apo-badge{display:inline-block;border:1px solid var(--apo-graphite);padding:2px 5px;font-size:8px;color:var(--apo-ash)}
::selection{background:var(--apo-signal);color:var(--apo-void)}