/* Bank Bobbery - shared shell styling. Dark, high-contrast, heist-flavoured. */
:root{
  --bg:#0b0d11; --bg2:#12151c; --panel:#171b24; --panel2:#1e2330;
  --line:#2a3040; --text:#dfe4ee; --dim:#8c94a6; --faint:#5b6377;
  --gold:#e0b64a; --gold2:#f5d581;
  --thug:#d2503c; --guard:#3f8fd0; --npc:#59a97a;
  /* The same two sides a shade up, for anywhere a side's own colour has to be
     told apart from itself - the second half against the first on the end
     card, and nothing else so far. */
  --thug2:#ef8471; --guard2:#7cbdf2;
  --ok:#4bbd7a; --warn:#e0a33c; --bad:#d2503c;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--sans);font-size:14px;overflow:hidden;
}
button{
  font-family:inherit;font-size:13px;cursor:pointer;
  background:var(--panel2);color:var(--text);
  border:1px solid var(--line);border-radius:6px;padding:8px 14px;
  transition:background .12s,border-color .12s,transform .06s;
}
button:hover{background:#28304099;border-color:#3d465c}
button:active{transform:translateY(1px)}
button.primary{background:var(--gold);color:#1a1405;border-color:var(--gold2);font-weight:600}
button.primary:hover{background:var(--gold2)}
button.thug{background:#3a1d18;border-color:var(--thug);color:#f0b3a8}
button.thug.sel{background:var(--thug);color:#fff}
button.guard{background:#152738;border-color:var(--guard);color:#a9d0ef}
button.guard.sel{background:var(--guard);color:#fff}
button:disabled{opacity:.4;cursor:not-allowed}
input,select,textarea{
  font-family:inherit;font-size:13px;background:#0e1118;color:var(--text);
  border:1px solid var(--line);border-radius:6px;padding:8px 10px;outline:none;
}
input:focus,select:focus{border-color:var(--gold)}
label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--dim);margin-bottom:5px}
h1,h2,h3{margin:0;font-weight:650;letter-spacing:-.01em}
a{color:var(--gold);text-decoration:none}
a:hover{text-decoration:underline}
.row{display:flex;gap:10px;align-items:center}
.col{display:flex;flex-direction:column;gap:10px}
.spacer{flex:1}
.mono{font-family:var(--mono)}
.dim{color:var(--dim)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:#2b3243;border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:#3a4356}
