/* full screen terminal : bhanuharya@sec */

:root {
  --bg: #050605;
  --fg: #62f2a0;
  --dim: #4ecb80;
  --err: #ff6b6b;
  --warn: #ffd166;
  --link: #8affd0;
  --sel: #143d24;
  --glow: rgba(98, 242, 160, 0.28);
  --mono: ui-monospace, "SF Mono", "DejaVu Sans Mono", "Courier New", monospace;
}

html[data-term="amber"] {
  --fg: #ffb000;
  --dim: #d99b2b;
  --link: #ffd28a;
  --sel: #3d2b00;
  --glow: rgba(255, 176, 0, 0.3);
}

html[data-term="white"] {
  --fg: #e6e6e6;
  --dim: #a8a8a8;
  --link: #a8d8ff;
  --sel: #2a2a2a;
  --glow: rgba(230, 230, 230, 0.18);
}

* { box-sizing: border-box; }

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--mono);
  font-size: 13.5px;
  line-height: 1.5;
}

::selection { background: var(--sel); }

a { color: var(--link); text-decoration: underline; }
a:hover { text-decoration: none; }
/* screen and scrollback */
.crt {
  position: fixed;
  inset: 0;
  overflow-y: auto;
  padding: 14px 16px 22px;
  text-shadow: 0 0 5px var(--glow);
  cursor: text;
}

.screen {
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.screen .line { min-height: 1.5em; }

.dim { color: var(--dim); }
.err { color: var(--err); }
.warn { color: var(--warn); }
.bold { font-weight: bold; }
.link,
.cmd-link {
  color: var(--link);
  text-decoration: underline;
  cursor: pointer;
  background: none;
  border: 0;
  font: inherit;
  padding: 0;
}
.cmd-link:hover { text-decoration: none; }

.banner {
  color: var(--fg);
  line-height: 1.25;
  margin-bottom: 0;
  white-space: pre;
}
/* current input line */
.inputline {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  white-space: pre-wrap;
  word-break: break-all;
}

.prompt { color: var(--fg); flex: 0 0 auto; }
.typed { color: var(--fg); }
.caret {
  display: inline-block;
  width: 0.6em;
  margin-left: 1px;
  background: var(--fg);
  color: transparent;
  animation: blink 1.05s steps(1, end) infinite;
}
.caret.off { animation: none; opacity: 0; }

@keyframes blink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

/* hidden keystroke catcher: needed for mobile keyboards */
.keycatcher {
  position: absolute;
  left: -9999px;
  top: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
  border: 0;
  padding: 0;
  background: transparent;
  color: transparent;
}

/* faint crt texture, can be turned off */
html[data-crt="on"] .crt::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.028) 0px,
    rgba(255, 255, 255, 0.028) 1px,
    transparent 1px,
    transparent 3px
  );
}

@media (max-width: 640px) {
  html, body { font-size: 12.5px; }
  .crt { padding: 10px 11px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .caret { animation: none; }
  html[data-crt="on"] .crt::after { display: none; }
}

/* printed files, tables, ascii */
pre.blob {
  margin: 0 0 8px;
  font: inherit;
  white-space: pre-wrap;
  word-break: break-word;
}
.hr { color: var(--dim); }
