/* Terminal reboot theme */
:root {
  --bg: #0A0F0D;
  --panel: #0F1A15;
  --panel-2: #13221B;
  --line: #1F3A2E;
  --dim: #4B6B5C;
  --text: #D1FAE5;
  --soft: #8FB8A5;
  --ok: #34D399;
  --ok-soft: #6EE7B7;
  --run: #A3E635;
  --run-soft: #D9F99D;
  --warn: #FBBF24;
  --bad: #F87171;
  --bad-soft: #FCA5A5;
  --mono: ui-monospace, "Cascadia Mono", "Cascadia Code", Consolas, "Liberation Mono", Menlo, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--mono); font-size: 16px; line-height: 1.55; }
a { color: var(--ok); }
h1, h2, h3 { font-weight: 600; margin: 0 0 .5rem; letter-spacing: .02em; }
h1 { font-size: 1.6rem; } h2 { font-size: 1.25rem; } h3 { font-size: 1.05rem; }
.prompt::before { content: "> "; color: var(--ok); }
.muted { color: var(--soft); }
.dim { color: var(--dim); }
.wrap { max-width: 1100px; margin: 0 auto; padding: 1.25rem; }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 4px; padding: 1.1rem 1.25rem; }
.row { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.grow { flex: 1; }
input[type=text], input[type=password], input[type=number], select {
  font-family: var(--mono); font-size: 1rem; background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 3px; padding: .6rem .75rem; outline: none; min-width: 0;
}
input:focus, select:focus { border-color: var(--ok); box-shadow: 0 0 0 2px rgba(52,211,153,.18); }
input::placeholder { color: var(--dim); }
button {
  font-family: var(--mono); font-size: .95rem; background: transparent; color: var(--ok);
  border: 1px solid var(--ok); border-radius: 3px; padding: .55rem 1rem; cursor: pointer; transition: background .12s, transform .06s;
}
button:hover { background: rgba(52,211,153,.12); }
button:active { transform: scale(.98); }
button.primary { background: var(--ok); color: var(--bg); font-weight: 600; }
button.primary:hover { background: var(--ok-soft); }
button.warn { color: var(--warn); border-color: var(--warn); }
button.warn:hover { background: rgba(251,191,36,.12); }
button.bad { color: var(--bad); border-color: var(--bad); }
button.bad:hover { background: rgba(248,113,113,.12); }
button.ghost { border-color: var(--line); color: var(--soft); }
button[disabled] { opacity: .45; cursor: not-allowed; }
.tag { display: inline-block; font-size: .75rem; padding: .1rem .45rem; border: 1px solid var(--line); border-radius: 2px; color: var(--soft); }
.tag.alarm { color: var(--bad-soft); border-color: var(--bad); }
.status-ok { color: var(--ok-soft); } .status-run { color: var(--run-soft); } .status-lock { color: var(--bad-soft); } .status-idle { color: var(--dim); }
.err { color: var(--bad-soft); min-height: 1.4em; font-size: .9rem; }
.good { color: var(--ok-soft); }
.timer { font-size: 2rem; font-weight: 700; color: var(--ok); letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.timer.amber { color: var(--warn); }
.timer.red { color: var(--bad); }
.timer.pulse { animation: pulse 1s infinite; }
@keyframes pulse { 50% { opacity: .35; } }
.slot { display: inline-flex; width: 2.1rem; height: 2.4rem; align-items: center; justify-content: center; border: 1px solid var(--line); color: var(--dim); border-radius: 2px; font-size: 1.15rem; font-weight: 700; }
.slot.got { border-color: var(--ok); color: var(--ok); background: rgba(52,211,153,.07); }
.slot.new { animation: drop .7s cubic-bezier(.2,1.4,.4,1); }
@keyframes drop { 0% { transform: translateY(-40px) scale(1.6); opacity: 0; } 100% { transform: none; opacity: 1; } }
table { border-collapse: collapse; width: 100%; }
th, td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--line); font-size: .9rem; vertical-align: middle; }
th { color: var(--soft); font-weight: 500; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; }
.overlay { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; z-index: 50; text-align: center; padding: 2rem; }
.flash-bad { background: rgba(120,10,10,.88); animation: flash .35s 6 alternate; }
@keyframes flash { from { background: rgba(160,15,15,.92); } to { background: rgba(40,4,4,.92); } }
.flash-ok { background: rgba(4,30,20,.93); }
.big { font-size: 4.5rem; font-weight: 800; line-height: 1.05; }
.scan { position: fixed; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 3px); z-index: 1; }