:root {
  --bg: #000;
  --fg: #d7dcd7;
  --dim: #6b7a6b;
  --green: #33ff66;
  --green-dim: #1a7a33;
  --blue: #5fafff;
  --mono: ui-monospace, "Cascadia Mono", "JetBrains Mono", "DejaVu Sans Mono", Menlo, Consolas, monospace;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 16px/1.65 var(--mono);
  overflow-x: hidden;
}
/* faint CRT scanlines */
body::after {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(to bottom, rgba(255,255,255,.025) 0 1px, transparent 1px 3px);
}

a { color: var(--green); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2 { font-size: 1.05rem; font-weight: 700; margin: 0 0 .8em; }
p { margin: 0 0 .8em; max-width: 68ch; }
.g { color: var(--green); }
.b { color: var(--blue); }
.dim { color: var(--dim); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.wrap { max-width: 860px; margin: 0 auto; padding: 0 16px; }
main section { padding: 28px 0; border-top: 1px dashed #1c2a1c; }
main section:first-child { border-top: 0; }

.bar { border-bottom: 1px solid #1c2a1c; }
.bar-inner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px 16px; min-height: 52px; padding-top: 10px; padding-bottom: 10px; }
.prompt-link { color: var(--fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.prompt-link:hover { text-decoration: none; }
nav { display: flex; flex-wrap: wrap; gap: 4px 18px; white-space: nowrap; }

.hero { padding: 48px 0 32px; }
.hero .dim { margin: 0 0 4px; letter-spacing: .4em; }
.ascii {
  margin: 0 0 32px;
  color: var(--green);
  font-family: var(--mono);
  font-size: clamp(6px, 2.45vw, 15px);
  line-height: 1.05;
  text-shadow: 0 0 6px rgba(51, 255, 102, .55);
  overflow: hidden;
}
.term p { margin: 0 0 .3em; }
.term .out { color: var(--fg); padding-left: 2ch; }
.cursor { color: var(--green); animation: blink 1s steps(1) infinite; }

.ls { list-style: none; margin: 0; padding: 0; white-space: pre-wrap; }
.ls li { padding-left: 2ch; }

.btn {
  display: inline-block;
  margin-top: 6px;
  padding: 8px 14px;
  border: 1px solid var(--green);
  color: var(--green);
  word-break: break-all;
}
.btn:hover { background: var(--green); color: var(--bg); text-decoration: none; }

.kv { display: grid; grid-template-columns: max-content 1fr; gap: 4px 3ch; margin: 0; }
.kv dt { color: var(--dim); }
.kv dt::after { content: ":"; }
.kv dd { margin: 0; }

.footer { padding: 24px 16px 40px; color: var(--dim); font-size: .85rem; border-top: 1px solid #1c2a1c; }
.footer a { color: var(--dim); text-decoration: underline; }

/* calendar: break out of the text column and use the browser width */
.cal-wide {
  width: min(1400px, calc(100vw - 32px));
  margin-left: 50%;
  transform: translateX(-50%);
}
.cal-head { display: flex; align-items: center; gap: 2ch; margin-bottom: 12px; }
.cal-head button {
  font: inherit; background: none; color: var(--green);
  border: 1px solid var(--green-dim); padding: 2px 12px; cursor: pointer;
}
.cal-head button:hover { border-color: var(--green); background: #0b1f0f; }
#cal-title { min-width: 15ch; text-align: center; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: #1c2a1c; border: 1px solid #1c2a1c; }
.cal-dow { background: var(--bg); color: var(--dim); text-align: center; padding: 4px 0; font-size: .8rem; }
.cal-cell {
  font: inherit; color: var(--fg); text-align: left;
  background: var(--bg); border: 0; padding: 4px 5px; min-height: 92px;
  display: flex; flex-direction: column; gap: 2px; cursor: default; min-width: 0;
}
.cal-cell.empty { cursor: default; }
.cal-num { font-size: .8rem; color: var(--dim); }
.cal-cell.has .cal-num { color: var(--fg); }
.cal-cell.today .cal-num { background: var(--green); color: var(--bg); padding: 0 4px; align-self: flex-start; }
.cal-evs { list-style: none; margin: 0; padding: 0; font-size: .78rem; line-height: 1.35; }
.cal-evs li { margin-bottom: 8px; overflow-wrap: break-word; }
.ev span { display: block; }
.ev-time { color: var(--green); }
.ev-title { color: var(--fg); font-weight: 700; }
.ev-who { color: var(--dim); }
.cal-day .ev { padding-left: 2ch; margin-bottom: 10px; }
.cal-dots { display: none; color: var(--green); letter-spacing: 2px; line-height: 1; }
.cal-day { display: none; margin-top: 16px; min-height: 5.5em; }
.cal-day p { margin: 0 0 .3em; }
.cal-day .out { padding-left: 2ch; }

@media (max-width: 700px) {
  .cal-cell { min-height: 48px; align-items: center; }
  .cal-evs { display: none; }
  .cal-dots { display: block; }
  .cal-day { display: block; }
  .cal-cell:not(.empty) { cursor: pointer; }
  .cal-cell.sel { outline: 1px solid var(--green); outline-offset: -1px; }
}

@keyframes blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .cursor { animation: none; } }

@media (max-width: 560px) {
  body { font-size: 14px; }
  .prompt-link .g { display: none; }
  .ls { white-space: normal; }
  .ls li span { display: inline-block; min-width: 13ch; }
  .kv { grid-template-columns: 1fr; gap: 0; }
  .kv dd { margin-bottom: 8px; }
}