:root {
  color-scheme: dark;
  --void: #06060d;
  --terminal: #0a0913;
  --panel: #100f1c;
  --line: #29263e;
  --text: #e9e7f5;
  --muted: #777489;
  --violet: #a48aff;
  --blue: #6a9dff;
  --danger: #ff769b;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

html { scroll-behavior: smooth; }

body,
body * { text-transform: lowercase !important; }

body input,
body textarea { text-transform: none !important; }

body .company-suffix { text-transform: uppercase !important; }

button,
input,
textarea { font: inherit; }

body {
  background: var(--void);
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  margin: 0;
  overflow: hidden;
}

body::after {
  background: repeating-linear-gradient(0deg, transparent 0, transparent 2px, rgba(0,0,0,.12) 3px);
  content: "";
  inset: 0;
  pointer-events: none;
  position: fixed;
  z-index: 20;
}

::selection {
  background: #5e4aa1;
  color: #fff;
}

.shell-frame {
  background: var(--terminal);
  border: 1px solid var(--line);
  cursor: text;
  display: grid;
  grid-template-rows: 36px 1fr 22px;
  height: 100dvh;
  margin: 0 auto;
  max-width: 1800px;
  position: relative;
}

.shell-frame a,
.shell-frame button,
.shell-frame input,
.shell-frame textarea,
.shell-frame label {
  cursor: auto;
}

.shell-frame button,
.shell-frame a {
  cursor: pointer;
}

.shell-frame::before {
  background: radial-gradient(circle at 68% 37%, rgba(110,75,255,.1), transparent 38%);
  content: "";
  inset: 36px 0 22px;
  pointer-events: none;
  position: absolute;
}

.shell-titlebar {
  align-items: center;
  background: #11101b;
  border-bottom: 1px solid var(--line);
  color: #747185;
  display: grid;
  font-size: 10px;
  grid-template-columns: 1fr auto 1fr;
  letter-spacing: .04em;
  padding: 0 12px;
  position: relative;
  z-index: 1;
}

.shell-titlebar > span:last-child { justify-self: end; }
.shell-titlebar > span b { color: #8c88a0; font-weight: 400; }
.shell-connection {
  align-items: center;
  display: flex;
  height: 100%;
}

.shell-connection i {
  animation: connection-pulse 1.8s ease-in-out infinite;
  background: var(--violet);
  border-radius: 50%;
  box-shadow: 0 0 8px rgba(164,138,255,.85);
  height: 7px;
  width: 7px;
}

@keyframes connection-pulse {
  50% {
    box-shadow: 0 0 2px rgba(164,138,255,.35);
    opacity: .45;
    transform: scale(.82);
  }
}

.shell-body { min-height: 0; position: relative; z-index: 1; }

.shell-scroll {
  height: 100%;
  overflow-y: auto;
  padding: clamp(25px, 4vw, 62px) clamp(22px, 5vw, 82px) 80px;
  scrollbar-color: #4e426f transparent;
  scrollbar-width: thin;
}

.boot-output > p { color: #777489; font-size: 12px; line-height: 1.6; margin: 0; }
.boot-output .dim { margin-top: 5px; }
.boot-output .dim b { color: var(--violet); font-weight: 400; }

.entered-command {
  display: flex;
  flex-wrap: wrap;
  font-size: 13px;
  gap: 4px;
  margin-top: 36px;
}

.user { color: var(--violet); }
.directory { color: var(--blue); }

.signal-output { margin: clamp(48px, 8vh, 88px) 0 70px clamp(0px, 4vw, 55px); }
.signal-output > p:first-child { color: #716e82; font-size: 11px; letter-spacing: .06em; margin: 0 0 17px; }
.signal-note { color: #757286; font-size: 11px; line-height: 1.55; margin: 0; }

.shell-generated { max-width: 1000px; }
.generated-command { color: #9c98aa; display: flex; flex-wrap: wrap; font-size: 13px; gap: 4px; margin: 25px 0 13px; }
.alias-expansion { color: #5e5a70; font-size: 11px; margin: -7px 0 15px 11px; }
.plain-output { color: #aaa6b8; font-size: 12px; margin: 0 0 22px 11px; }
.command-error { color: var(--danger); font-size: 12px; margin: 0 0 22px; }
.reboot-message { animation: reboot-pulse .65s steps(2, end) infinite; color: var(--blue); font-size: 12px; margin: 0 0 22px; }
@keyframes reboot-pulse { 50% { opacity: .35; } }

.command-view { border-left: 1px solid #494161; margin: 0 0 42px 11px; max-width: 850px; padding: 5px 0 8px 22px; }
.view-heading { color: #696577; font-size: 11px; letter-spacing: .08em; margin: 0 0 22px; }
.help-grid { display: grid; font-size: 12px; gap: 10px 38px; grid-template-columns: 1fr 1fr; }
.help-column { display: flex; flex-direction: column; gap: 10px; }
.help-grid span { color: #747184; }
.help-grid b { color: var(--violet); display: inline-block; font-weight: 400; width: 75px; }

.text-file { display: grid; font-size: 13px; gap: 13px; grid-template-columns: 24px 1fr; line-height: 1.6; }
.text-file > span { color: #504c5e; }
.text-file p { margin: 0; max-width: 650px; }

.directory-list { display: flex; flex-wrap: wrap; font-size: 12px; gap: 12px 30px; max-width: 640px; }
.directory-list .file { color: #aaa6b8; min-width: 100px; }
.directory-list .classified-file { color: var(--violet); }
.directory-list .directory-entry { color: var(--blue); }

.long-list p { display: grid; font-size: 11px; gap: 18px; grid-template-columns: 105px 1fr; margin: 8px 0; }
.long-list span { color: #656174; }
.long-list b { color: var(--blue); font-weight: 400; }
.long-list .restricted b { color: #746582; }
.access-denied { color: var(--danger); font-size: 12px; margin: 0; }

.classified-output { font-size: 11px; max-width: 720px; }
.classified-output .warning { color: #b38bd6; margin: 0 0 25px; }
.project-record { border-top: 1px solid #2d293c; display: grid; gap: 6px; grid-template-columns: 100px 1fr; padding: 17px 0; }
.project-record > span { color: #5d596a; grid-row: 1 / 4; }
.project-record p { color: #858193; margin: 0; }
.project-record p i { color: var(--blue); font-style: normal; }
.project-record p b { color: #8c789d; font-weight: 400; }
.redacted { background: #6a6276; border-radius: 1px; color: transparent !important; display: inline-block; line-height: .95; margin-left: 3px; user-select: none; width: 86px; }
.redacted--short { width: 58px; }
.redacted--long { width: 150px; }
.project-record--locked { opacity: .62; }
.project-record--locked p b { color: var(--danger); }

.status-table { display: grid; font-size: 11px; gap: 11px; grid-template-columns: 140px 1fr; }
.status-table span { color: #777386; }
.status-table b { color: var(--violet); font-weight: 400; }

.command-view--contact { max-width: 760px; }
.command-view--contact form { padding-top: 3px; }
.command-view--contact label { align-items: baseline; display: grid; font-size: 12px; grid-template-columns: 95px 1fr; margin: 18px 0; }
.command-view--contact label > span { color: var(--blue); }
.command-view--contact input,
.command-view--contact textarea { background: transparent; border: 0; border-bottom: 1px solid #383448; border-radius: 0; color: var(--text); outline: 0; padding: 7px 0 10px; resize: vertical; width: 100%; }
.command-view--contact input:focus,
.command-view--contact textarea:focus { border-color: var(--violet); }
.command-view--contact input::placeholder,
.command-view--contact textarea::placeholder { color: #4f4b5c; }

.shell-submit { align-items: center; display: flex; gap: 25px; justify-content: flex-end; margin-top: 24px; }
.shell-submit p { color: #676375; font-size: 10px; margin: 0; }
.shell-submit p[data-state="success"] { color: #9f8aff; }
.shell-submit p[data-state="error"] { color: var(--danger); }
.shell-submit button { background: rgba(133,104,255,.13); border: 1px solid #675692; color: var(--violet); cursor: pointer; font-size: 11px; padding: 11px 16px; }
.shell-submit button:hover { background: var(--violet); color: #0b0912; }
.shell-submit button:disabled { cursor: wait; opacity: .6; }

.shell-prompt { align-items: center; display: flex; font-size: 13px; gap: 5px; margin-top: 10px; }
.shell-prompt label { display: flex; gap: 4px; }
.prompt-entry { align-items: center; display: flex; flex: 1; min-width: 0; }
.shell-prompt input { background: transparent; border: 0; caret-color: transparent; color: var(--text); flex: 0 1 auto; max-width: calc(100% - 12px); min-width: 1ch; outline: 0; padding: 8px 0; width: 1ch; }
.prompt-cursor { animation: prompt-blink .85s step-end infinite; color: var(--blue); display: inline-block; margin-left: 1px; }
@keyframes prompt-blink { 50% { opacity: 0; } }
.prompt-entry:not(:focus-within) .prompt-cursor { animation: none; color: #4e4a5e; opacity: .45; }

.shell-hints { align-items: flex-end; bottom: 32px; display: flex; gap: 13px; position: absolute; right: 24px; }
.shell-hints p { color: #4f4c5a; font-size: 9px; margin: 0; }
.shell-hints button { background: transparent; border: 0; color: #696677; cursor: pointer; font-size: 10px; padding: 0; }
.shell-hints button::before { content: "["; }
.shell-hints button::after { content: "]"; }
.shell-hints button:hover { color: var(--violet); }

.shell-hints button:focus-visible,
.shell-submit button:focus-visible {
  outline: 1px solid var(--violet);
  outline-offset: 3px;
}

.shell-statusbar { align-items: center; background: #5e4aa1; color: white; display: flex; font-size: 9px; gap: 22px; padding: 0 10px; position: relative; z-index: 3; }
.shell-statusbar span:nth-child(3) { margin-left: auto; }

.terminal-only {
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

@media (max-width: 650px) {
  .shell-frame { border-left: 0; border-right: 0; }
  .shell-titlebar { grid-template-columns: 1fr auto; }
  .shell-titlebar > span:first-of-type { display: none; }
  .shell-scroll { padding: 23px 17px 85px; }
  .signal-output { margin: 60px 0 70px; }
  .shell-hints { bottom: 33px; left: 17px; right: auto; }
  .help-grid { grid-template-columns: 1fr; }
  .directory-list { gap: 10px 18px; }
  .long-list p { gap: 8px; grid-template-columns: 95px 1fr; }
  .project-record { display: block; }
  .project-record > span { display: block; margin-bottom: 12px; }
  .project-record p { margin: 7px 0; }
  .command-view { margin-left: 0; padding-left: 14px; }
  .command-view--contact label { display: block; }
  .command-view--contact label > span { display: block; margin-bottom: 5px; }
  .shell-submit { align-items: stretch; flex-direction: column; }
  .shell-submit button { width: 100%; }
  .shell-statusbar span:nth-child(2) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}