/* DrillX — shared application design layer.
   Loaded after each page's own <style>, so it overrides the older steel palette
   with the black/Archivo language used on the marketing site.
   Generated documents (.doc, .sheet) are deliberately untouched: they are white
   paper for print and PDF, and must stay that way. */

:root{
  --steel:#000000;
  --steel-2:#0D0F12;
  --steel-3:#16191C;
  --brass:#D9A441;
  --signal:#4FD1B5;
  --blue:#8AB4D8;
  --warn:#E2564C;
  --text:#FFFFFF;
  --muted:#7C858A;
  --line:rgba(255,255,255,.10);
  --line-2:rgba(255,255,255,.18);
}

body{
  background:#000;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}

/* ---------- display type ---------- */
h1,h2,.mark,.tier h3,.rig h4{
  font-family:"Archivo","IBM Plex Sans Condensed",system-ui,sans-serif !important;
  letter-spacing:-.035em;
}
h1{font-weight:800 !important;line-height:1.02;text-transform:uppercase}
h2{font-weight:700 !important;letter-spacing:-.03em}
.mark{font-weight:900 !important;letter-spacing:.2em !important;text-transform:uppercase}

/* section eyebrow */
.tag{
  font-family:"IBM Plex Mono",monospace !important;
  font-size:.64rem !important;letter-spacing:.26em !important;
  text-transform:uppercase;color:var(--brass) !important;
}
.lede{color:#A8B0B4 !important;font-weight:300}

/* ---------- chrome ---------- */
.top{
  background:rgba(0,0,0,.72) !important;
  backdrop-filter:saturate(160%) blur(20px);
  -webkit-backdrop-filter:saturate(160%) blur(20px);
  border-bottom:1px solid var(--line) !important;
}
.top nav a{
  font-size:.78rem;letter-spacing:.01em;color:#B4BBBF !important;
}
.top nav a:hover{color:#fff !important}

/* ---------- surfaces: hairlines, not rounded boxes ---------- */
.card,.rig,.tier,.console,.panel,.box,.note,.strip>div,.plat>div,
.search input,select,input[type=text],input[type=date],input[type=number],textarea{
  border-radius:2px !important;
}
.card,.rig,.tier,.panel,.box{
  background:var(--steel-2) !important;
  border:1px solid var(--line) !important;
}
.card:hover,.rig:hover{background:var(--steel-3) !important}

/* ---------- form controls ---------- */
select,input,textarea{
  background:#0A0C0E !important;
  border:1px solid var(--line) !important;
  color:#fff !important;
}
select:focus,input:focus,textarea:focus{
  outline:2px solid var(--brass);outline-offset:1px;border-color:var(--brass) !important;
}
label{
  font-family:"IBM Plex Mono",monospace !important;
  font-size:.62rem !important;letter-spacing:.18em !important;
  text-transform:uppercase;color:var(--muted) !important;
}

/* ---------- buttons ---------- */
.btn,button.btn,a.btn{
  border-radius:2px !important;
  font-family:"IBM Plex Mono",monospace !important;
  font-size:.74rem !important;letter-spacing:.08em !important;
  text-transform:uppercase;font-weight:500 !important;
}
.btn.ghost{border-color:var(--line-2) !important}
.btn.ghost:hover{background:#fff !important;color:#000 !important;border-color:#fff !important}

/* the big rig-floor buttons stay large and legible — only the geometry changes */
.bigbtn{border-radius:3px !important;letter-spacing:.04em}

/* ---------- tables ---------- */
table.r th,table.t th,table.spec th,.side th{
  font-family:"IBM Plex Mono",monospace !important;
  font-size:.62rem !important;letter-spacing:.2em !important;
  text-transform:uppercase;color:#5A6367 !important;
  border-bottom:1px solid var(--line-2) !important;
}
table.r td,table.t td{border-bottom:1px solid var(--line) !important}

/* ---------- tabs ---------- */
.tabs{border-bottom:1px solid var(--line) !important}
.tabs button{
  font-family:"IBM Plex Mono",monospace !important;
  font-size:.7rem !important;letter-spacing:.14em !important;text-transform:uppercase;
}
.tabs button.on{border-bottom-color:var(--brass) !important;color:#fff !important}

/* ---------- role / side list ---------- */
.side button{border-radius:2px !important}
.side button.on{background:var(--steel-3) !important;border-inline-start:2px solid var(--brass)}

/* ---------- key figures ---------- */
.strip .v,.sum b,.kpi b{
  font-family:"Archivo",sans-serif !important;font-weight:800 !important;letter-spacing:-.04em;
}

/* ---------- notes ---------- */
.note{
  background:var(--steel-2) !important;
  border-inline-start:2px solid var(--brass) !important;
}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line) !important;color:#6B7378 !important;font-size:.78rem}

/* ---------- language picker sits comfortably in the darker chrome ---------- */
#dxLangBtn{border-color:var(--line-2) !important}
#dxLangMenu{background:#0A0C0E !important;border-color:var(--line-2) !important}

/* ---------- the generated documents stay exactly as they were ---------- */
.doc,.doc *,.sheet,.sheet *{
  border-radius:revert;
}
.doc,.sheet{background:#fff !important;color:#111 !important}
.doc h1,.doc h2,.sheet h1,.sheet h2{
  font-family:"IBM Plex Sans Condensed",sans-serif !important;
  text-transform:none !important;letter-spacing:normal !important;color:inherit !important;
}
.doc label,.sheet label{
  font-family:inherit !important;font-size:inherit !important;letter-spacing:normal !important;
  text-transform:none !important;color:inherit !important;
}
.doc table th,.sheet table th{
  color:inherit !important;font-family:inherit !important;font-size:inherit !important;
  letter-spacing:normal !important;text-transform:none !important;border-color:inherit !important;
}
.doc td,.doc th,.sheet td,.sheet th{border-color:#ccc !important}
.doc input,.doc select,.sheet input,.sheet select{
  background:#fff !important;color:#111 !important;border-color:#bbb !important;
}

@media print{
  .doc,.sheet{background:#fff !important;color:#000 !important}
}