/* Bitsofgeek TUI shell — CRT terminal styling.
 * Palette: cyan #5fe4e4 · dim #41bcbc · pink #db7497 · bg #1b1b1b */

html, body { margin: 0; height: 100%; background: #1b1b1b; }

::selection { background: #5fe4e4; color: #1b1b1b; text-shadow: none; }
a { color: #5fe4e4; }
a:hover { color: #db7497; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #41bcbc55; border-radius: 5px; }
::-webkit-scrollbar-track { background: transparent; }

@keyframes bogblink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes bogflick {
  0%, 100% { opacity: .94; }
  7% { opacity: .86; }
  8% { opacity: .97; }
  23% { opacity: .9; }
  55% { opacity: .96; }
  80% { opacity: .88; }
}

.term {
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: #1b1b1b;
  position: relative;
  overflow: hidden;
  cursor: text;
  font-family: VT323, monospace;
  font-weight: bold;
  color: #5fe4e4;
  /* chromatic fringe */
  text-shadow: -1px 0px 1px rgba(219, 116, 151, 0.7), 1px 0px 1px rgba(65, 188, 188, 0.7);
}

.bar {
  font-size: 21px;
  padding: 3px 16px;
  display: flex;
  gap: 16px;
  text-shadow: none;
}
.bar-top {
  background: #41bcbc;
  color: #1b1b1b;
  justify-content: space-between;
}
.bar-bottom {
  background: #232323;
  border-top: 1px solid #2e2e2e;
  padding: 4px 16px;
  gap: 18px;
  color: #41bcbc;
  flex-wrap: wrap;
}

.chip { cursor: pointer; padding: 0 4px; }
.chip:hover { color: #1b1b1b; background: #41bcbc; }
.brand { margin-left: auto; color: #db7497; }

.pane {
  flex: 1;
  overflow-y: auto;
  padding: 22px 30px;
  font-size: 24px;
  line-height: 1.22;
  overflow-wrap: anywhere;
}
.pane .line { min-height: 1.22em; white-space: pre-wrap; overflow-wrap: anywhere; }
.pane .link { text-decoration: underline; cursor: pointer; }

.prompt-line {
  padding: 4px 30px 8px;
  font-size: 24px;
  line-height: 1.22;
  white-space: pre;
}
.prompt-line[hidden] { display: none; }
.prompt { color: #41bcbc; }

.cursor {
  display: inline-block;
  width: 0.55em;
  height: 1em;
  vertical-align: -0.12em;
  background: #5fe4e4;
  box-shadow: -1px 0 1px rgba(219, 116, 151, 0.7), 1px 0 1px rgba(65, 188, 188, 0.7);
  opacity: 0.35;
}
.cursor.focused { opacity: 1; animation: bogblink 1.06s steps(1) infinite; }

#kbd {
  position: absolute;
  bottom: 6px;
  left: 6px;
  width: 2px;
  height: 2px;
  opacity: 0;
  border: 0;
  padding: 0;
  background: transparent;
}
#kbd:focus-visible { outline: none; }

.crt { position: absolute; inset: 0; pointer-events: none; opacity: 0.5; }
.crt-scan {
  position: absolute;
  inset: 0;
  animation: bogflick 4.3s infinite;
  background: repeating-linear-gradient(0deg,
    rgba(0, 0, 0, 0.12) 0px, rgba(0, 0, 0, 0.12) 1px,
    transparent 1px, transparent 3px);
}

/* ── admin console ─────────────────────────────────────────── */

body.admin { font-family: VT323, monospace; color: #5fe4e4; font-size: 22px; }
.admin-shell { min-height: 100vh; display: flex; flex-direction: column; }
.admin-shell .bar-top a { color: #1b1b1b; }
.admin-main { flex: 1; padding: 24px 32px; max-width: 900px; }
.admin-main h1 { font-size: 30px; font-weight: normal; color: #db7497; margin: 0 0 18px; }
.admin-notice { color: #1b1b1b; background: #41bcbc; display: inline-block; padding: 2px 10px; }

.admin-table { border-collapse: collapse; width: 100%; }
.admin-table th { text-align: left; color: #41bcbc; font-weight: normal; border-bottom: 1px solid #2e2e2e; padding: 4px 12px 4px 0; }
.admin-table td { padding: 6px 12px 6px 0; border-bottom: 1px solid #232323; }
.admin-table form { display: inline; }

.admin-form label { display: block; margin: 14px 0; color: #41bcbc; }
.admin-form input[type="text"], .admin-form input[type="number"],
.admin-form input[type="date"], .admin-form textarea {
  display: block; width: 100%; box-sizing: border-box; margin-top: 4px;
  background: #111; color: #5fe4e4; border: 1px solid #2e2e2e; padding: 8px 10px;
  font-family: VT323, monospace; font-size: 22px;
}
.admin-form input:focus, .admin-form textarea:focus { outline: 1px solid #41bcbc; }
.admin-row { display: flex; gap: 24px; align-items: center; }
.admin-row label { flex: 1; }
.admin-hint { color: #2e6e6e; }

.admin-btn, .admin-form input[type="submit"], .admin-table button {
  background: #1b1b1b; color: #5fe4e4; border: 1px solid #41bcbc;
  font-family: VT323, monospace; font-size: 20px; padding: 4px 14px; cursor: pointer;
  text-decoration: none; display: inline-block;
}
.admin-btn:hover, .admin-form input[type="submit"]:hover, .admin-table button:hover {
  background: #41bcbc; color: #1b1b1b;
}
.admin-errors { border: 1px solid #db7497; color: #db7497; padding: 10px 14px; }
.admin-errors ul { margin: 6px 0 0; }

.admin-kv { display: inline-block; margin-right: 12px; color: #5fe4e4; }

/* Turnstile mount inside the terminal pane (only visible when a challenge is needed) */
.pane .ts-line { min-height: 0; margin: 6px 0; text-shadow: none; }
.admin-form label.admin-toggle { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.admin-form label.admin-toggle input[type="checkbox"] { width: 22px; height: 22px; accent-color: #5fe4e4; margin: 0; }