/* PRIVATE SESSION . assets/app.css . the RFC, read by lamplight
   The site is one Request for Comments, typeset: a monospace body at a fixed measure, the running head
   and foot of a printed RFC, numbered sections, key words in small caps, figures drawn in ASCII, rules
   and never boxes, tabular figures, one accent (the amber of a lit pane) kept for the few things that must be found. The night is the
   default; paper is the same memo printed. */

:root {
  /* the night: the brand's slate wall, cream type, amber lamplight (the default) */
  --paper: #121823;
  --paper-2: #1a2230;
  --ink: #ece5d5;
  --ink-2: #a7afbd;
  --ink-3: #6d7688;
  --rule: #2c3647;
  --rule-2: #202938;
  --accent: #ffc46b;
  --accent-2: #fff1cf;
  --accent-ink: #121823;
  --sel: rgba(255, 196, 107, 0.22);
  --plate: #0f141c;
  --measure: 72ch;
  --gut: 3ch;
  --fs: 17px;
  --lh: 1.6;
  color-scheme: dark;
}
/* paper: the same memo printed, amber turned to an ink that reads on cream (5.1:1) */
:root[data-theme="paper"] {
  --paper: #f3efe5;
  --paper-2: #e9e3d6;
  --ink: #151a23;
  --ink-2: #4c5361;
  --ink-3: #868b95;
  --rule: #cbc4b4;
  --rule-2: #ddd7c9;
  --accent: #96590b;
  --accent-2: #6e4106;
  --accent-ink: #f3efe5;
  --sel: rgba(150, 89, 11, 0.16);
  --plate: #151d2a;
  color-scheme: light;
}
@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] {
    --paper: #f3efe5;
    --paper-2: #e9e3d6;
    --ink: #151a23;
    --ink-2: #4c5361;
    --ink-3: #868b95;
    --rule: #cbc4b4;
    --rule-2: #ddd7c9;
    --accent: #96590b;
    --accent-2: #6e4106;
    --accent-ink: #f3efe5;
    --sel: rgba(150, 89, 11, 0.16);
    --plate: #151d2a;
    color-scheme: light;
  }
}

/* ---- reset ------------------------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; border-radius: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Inconsolata", Consolas, ui-monospace, "SFMono-Regular", Menlo, "Liberation Mono", monospace;
  font-size: var(--fs);
  line-height: var(--lh);
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "zero" 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
::selection { background: var(--sel); }
p, ul, ol, pre, table, figure, h1, h2, h3, h4, dl, dd { margin: 0; }
h1, h2, h3, h4 { font-size: 1em; }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
[hidden] { display: none !important; }
a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.22em; text-decoration-color: var(--ink-3); }
a:hover { color: var(--accent); text-decoration-color: var(--accent); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 2px;
}

/* ---- the sheet -------------------------------------------------------------------------------- */
.ps-sheet { max-width: calc(var(--measure) + 2 * var(--gut)); margin: 0 auto; padding: 18px var(--gut) 40px; }

/* the running head: RFC 0x20CC . PRIVATE SESSION . October 2026 */
.ps-run { display: flex; justify-content: space-between; gap: 2ch; white-space: nowrap; color: var(--ink-2); font-size: 0.93em; }
.ps-run > * { flex: 0 0 auto; }
.ps-run .ps-run-c { flex: 1 1 auto; text-align: center; overflow: hidden; text-overflow: ellipsis; }
.ps-run a { text-decoration: none; color: var(--ink); font-weight: 600; letter-spacing: 0.02em; }
.ps-run a:hover { color: var(--accent); }

/* the contents, in two groups */
.ps-nav { margin-top: 10px; padding: 7px 0 8px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 3ch; font-size: 0.93em; }
.ps-nav-g { display: flex; flex-wrap: nowrap; align-items: baseline; gap: 0 1.6ch; white-space: nowrap; }
.ps-nav-h { color: var(--ink-3); font-variant-caps: all-small-caps; letter-spacing: 0.09em; font-size: 1.08em; min-width: 7.5ch; }
.ps-nav a { text-decoration: none; color: var(--ink); }
.ps-nav a b { font-weight: 400; color: var(--ink-3); margin-right: 0.6ch; }
.ps-nav a:hover { color: var(--accent); }
.ps-nav a[aria-current="page"] { color: var(--accent); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.3em; text-decoration-color: var(--accent); }
.ps-nav a[aria-current="page"] b { color: var(--accent); }
.ps-wal { margin-left: auto; display: flex; align-items: baseline; gap: 1.4ch; white-space: nowrap; color: var(--ink-2); }
.ps-wal .ps-wal-s { color: var(--ink-3); }

/* the foot: PRIVATE SESSION . Standards Track . [Page 3] */
.ps-foot { margin-top: 56px; border-top: 1px solid var(--ink); padding-top: 8px; font-size: 0.93em; color: var(--ink-2); }
.ps-foot .ps-run { color: var(--ink-2); }
.ps-foot-nav { display: flex; justify-content: space-between; gap: 2ch; margin-top: 10px; }
.ps-foot-nav a { text-decoration: none; }
.ps-foot-nav a:hover { text-decoration: underline; }
.ps-foot-links { color: var(--ink); }
.ps-foot-fine { margin-top: 14px; color: var(--ink-3); }
.ps-foot-fine p + p { margin-top: 4px; }
.ps-foot-tools { margin-top: 12px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 3ch; color: var(--ink-3); }
.ps-theme button { background: none; border: 0; padding: 0; margin: 0 0.4ch; cursor: pointer; color: var(--ink-3); text-decoration: none; }
.ps-theme button[aria-pressed="true"] { color: var(--ink); text-decoration: underline; text-underline-offset: 0.25em; }

/* ---- the first page of the memo ---------------------------------------------------------------- */
.ps-memo { margin-top: 30px; display: flex; justify-content: space-between; gap: 2ch; }
.ps-memo div:last-child { text-align: right; }
.ps-title { margin: 44px 0 6px; text-align: center; }
.ps-title h1 { font-size: 2.05em; line-height: 1.12; font-weight: 600; letter-spacing: 0.06em; }
.ps-title p { margin-top: 10px; color: var(--ink-2); letter-spacing: 0.02em; }
.ps-title.ps-title-in { margin-top: 30px; }
.ps-title.ps-title-in h1 { font-size: 1.42em; letter-spacing: 0.04em; }

/* ---- sections --------------------------------------------------------------------------------- */
.ps-sec { margin-top: 34px; }
.ps-sec > h2, .ps-sec > h3, .ps-h { font-weight: 600; }
.ps-sec h2 a.ps-num, .ps-sec h3 a.ps-num { text-decoration: none; color: inherit; }
.ps-sec h2 a.ps-num:hover, .ps-sec h3 a.ps-num:hover { color: var(--accent); }
.ps-sec h2 .ps-num { display: inline-block; min-width: 4ch; }
.ps-sec h3 .ps-num { display: inline-block; min-width: 6ch; }
.ps-sub { margin-top: 24px; }
.ps-body { padding-left: var(--gut); }
.ps-body > * + * { margin-top: 0.85em; }
.ps-sec > .ps-body, .ps-sub > .ps-body { margin-top: 0.75em; }
.ps-lede { color: var(--ink); }
.ps-quiet { color: var(--ink-2); }
.ps-faint { color: var(--ink-3); }
.ps-kw { font-variant-caps: all-small-caps; letter-spacing: 0.07em; font-weight: 600; font-size: 1.06em; }
.ps-sc { font-variant-caps: all-small-caps; letter-spacing: 0.08em; }
em, i { font-style: italic; }
strong, b { font-weight: 600; }
code, .ps-code { font-family: inherit; }
.ps-hex { word-break: break-all; }
.ps-nil { color: var(--ink-3); font-style: italic; }
.ps-acc { color: var(--accent); }

/* RFC lists: "o  item" and "1.  item", hanging */
.ps-ul, .ps-ol { list-style: none; padding: 0; }
.ps-ul > li, .ps-ol > li { position: relative; padding-left: 3ch; }
.ps-ul > li + li, .ps-ol > li + li { margin-top: 0.5em; }
.ps-ul > li::before { content: "o"; position: absolute; left: 0; color: var(--ink-2); }
.ps-ol { counter-reset: ps-ol; }
.ps-ol > li { counter-increment: ps-ol; padding-left: 4ch; }
.ps-ol > li::before { content: counter(ps-ol) "."; position: absolute; left: 0; color: var(--ink-2); }

/* the table of contents, dot leaders */
.ps-toc { list-style: none; padding: 0; }
.ps-toc li + li { margin-top: 2px; }
.ps-toc a { display: flex; align-items: baseline; gap: 1ch; }
.ps-toc .ps-toc-n { flex: 0 0 4ch; }
.ps-toc .ps-toc-t { flex: 0 1 auto; }
.ps-toc .ps-toc-d { flex: 1 1 2ch; border-bottom: 2px dotted var(--ink-3); transform: translateY(-0.3em); min-width: 2ch; }
.ps-toc .ps-toc-p { flex: 0 0 auto; }
.ps-toc a { text-decoration: none; }
.ps-toc a:hover .ps-toc-t { color: var(--accent); text-decoration: underline; text-underline-offset: 0.22em; }
.ps-toc li.ps-toc-here .ps-toc-t { font-weight: 600; }

/* key and value lines with leaders (the numbers) */
.ps-kv { list-style: none; padding: 0; }
.ps-kv li { display: flex; align-items: baseline; gap: 1ch; }
.ps-kv li + li { margin-top: 1px; }
.ps-kv .ps-k { flex: 0 1 auto; color: var(--ink-2); }
.ps-kv .ps-d { flex: 1 1 2ch; border-bottom: 1px dotted var(--rule); transform: translateY(-0.32em); min-width: 2ch; }
.ps-kv .ps-v { flex: 0 0 auto; text-align: right; }
.ps-kv .ps-v small { color: var(--ink-3); font-size: 0.86em; margin-left: 0.6ch; }

/* tables: rules, never boxes */
.ps-tw { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ps-t { border-collapse: collapse; width: 100%; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.ps-t th, .ps-t td { text-align: left; vertical-align: top; padding: 4px 1.2ch 4px 0; }
.ps-t th:last-child, .ps-t td:last-child { padding-right: 0; }
.ps-t thead th { font-weight: 600; border-bottom: 1px solid var(--rule); padding-top: 6px; padding-bottom: 5px; }
.ps-t tbody tr + tr td, .ps-t tbody tr + tr th { border-top: 1px solid var(--rule-2); }
.ps-t tbody th { font-weight: 400; color: var(--ink-2); }
.ps-t .ps-r { text-align: right; }
.ps-t caption { caption-side: bottom; text-align: left; padding-top: 8px; color: var(--ink-3); font-size: 0.93em; }
.ps-t-cmp td:nth-child(3) { color: var(--ink); }
.ps-t-cmp td:nth-child(2) { color: var(--ink-2); }
.ps-t-cmp th[scope="row"] { width: 22%; }

/* figures: ASCII, drawn to the column */
.ps-fig { margin: 1.2em 0 0; }
.ps-fig pre { font-family: inherit; font-size: 0.93em; line-height: 1.32; white-space: pre; overflow-x: auto; color: var(--ink); }
.ps-fig pre b { font-weight: 600; }
.ps-fig pre i { font-style: normal; color: var(--accent); }
.ps-fig pre em { font-style: normal; color: var(--ink-3); }
.ps-fig figcaption { margin-top: 0.8em; text-align: center; color: var(--ink-2); }
.ps-fig-n { display: none; }

/* the plate: the door, the memo's one illustration */
.ps-plate { margin: 26px auto 0; max-width: 300px; }
.ps-plate img { width: 100%; height: auto; background: var(--plate); }
.ps-plate figcaption { margin-top: 10px; text-align: center; color: var(--ink-2); }
.ps-plate figcaption b { font-weight: 400; color: var(--ink-3); margin-right: 1ch; }

/* the blank nameplate: what the chain does not say (the brand's brass plate, with nobody's name on it) */
.ps-red { display: inline-block; width: 16ch; height: 1em; vertical-align: -0.14em; background: linear-gradient(180deg, #c49a55 0%, #9c7639 55%, #7e5d2b 100%); box-shadow: inset 0 0 0 1px rgba(20, 14, 6, 0.55), inset 0 0 0 3px rgba(255, 236, 196, 0.18); }
.ps-red.ps-red-s { width: 9ch; }

/* the specimen: a session as the chain sees it */
.ps-spec { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 10px 0; }
.ps-spec-row { display: grid; grid-template-columns: 13ch 1fr; gap: 0 1ch; }
.ps-spec-row + .ps-spec-row { margin-top: 2px; }
.ps-spec-k { color: var(--ink-3); }
.ps-spec-v small { color: var(--ink-3); font-size: 0.9em; margin-left: 0.5ch; }

/* ---- controls ---------------------------------------------------------------------------------- */
.ps-btn {
  background: none; border: 0; padding: 1px 0.4ch; margin: 0; cursor: pointer; color: var(--ink); font-weight: 600;
  white-space: nowrap; text-decoration: none; display: inline-block;
}
.ps-btn::before { content: "[ "; font-weight: 400; color: var(--ink-3); }
.ps-btn::after { content: " ]"; font-weight: 400; color: var(--ink-3); }
.ps-btn:hover { background: var(--ink); color: var(--paper); }
.ps-btn:hover::before, .ps-btn:hover::after { color: var(--paper); }
.ps-btn.ps-go { color: var(--accent); }
.ps-btn.ps-go:hover { background: var(--accent); color: var(--accent-ink); }
.ps-btn.ps-go:hover::before, .ps-btn.ps-go:hover::after { color: var(--accent-ink); }
.ps-btn[disabled], .ps-btn[aria-disabled="true"] { color: var(--ink-3); cursor: not-allowed; background: none; }
.ps-btn[disabled]::before, .ps-btn[disabled]::after { color: var(--rule); }
.ps-btns { display: flex; flex-wrap: wrap; gap: 6px 2ch; align-items: baseline; }

.ps-field { display: grid; grid-template-columns: minmax(12ch, 22ch) 1fr; gap: 2px 1ch; align-items: baseline; }
.ps-field + .ps-field { margin-top: 8px; }
.ps-field > label, .ps-field > .ps-lab { color: var(--ink-2); }
.ps-field .ps-hint { grid-column: 2; color: var(--ink-3); font-size: 0.93em; }
.ps-in, .ps-sel {
  border: 0; border-bottom: 1px dotted var(--ink-2); background: transparent; padding: 1px 0.3ch; outline: 0;
  font-variant-numeric: tabular-nums; min-width: 0; width: 100%; max-width: 30ch;
}
.ps-in:focus, .ps-sel:focus { border-bottom: 1px solid var(--accent); }
.ps-in.ps-num { text-align: right; max-width: 22ch; }
.ps-in::placeholder { color: var(--ink-3); }
.ps-sel { appearance: none; -webkit-appearance: none; padding-right: 2.5ch; cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink-2) 50%), linear-gradient(135deg, var(--ink-2) 50%, transparent 50%);
  background-position: calc(100% - 1.2ch) 55%, calc(100% - 0.7ch) 55%; background-size: 0.5ch 0.5ch, 0.5ch 0.5ch; background-repeat: no-repeat; }
.ps-sel option { background: var(--paper); color: var(--ink); }
textarea.ps-ta { width: 100%; min-height: 9em; border: 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: transparent; padding: 6px 0; resize: vertical; font-size: 0.9em; line-height: 1.4; }
textarea.ps-ta:focus { outline: 0; border-color: var(--accent); }

/* ASCII radios and checks: ( ) (*) [ ] [x] */
.ps-opts { display: flex; flex-wrap: wrap; gap: 4px 2.4ch; }
.ps-opt { position: relative; cursor: pointer; white-space: nowrap; }
.ps-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ps-opt span::before { content: "( ) "; color: var(--ink-3); white-space: pre; }
.ps-opt input:checked + span::before { content: "(*) "; color: var(--accent); }
.ps-opt input:checked + span { color: var(--ink); }
.ps-opt input[type="checkbox"] + span::before { content: "[ ] "; }
.ps-opt input[type="checkbox"]:checked + span::before { content: "[x] "; color: var(--accent); }
.ps-opt input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.ps-opt input:disabled + span { color: var(--ink-3); cursor: not-allowed; }

/* notices: the loud one is inverse, like overstrike on a line printer */
.ps-warn { background: var(--ink); color: var(--paper); padding: 8px 1.5ch; }
.ps-warn b, .ps-warn strong { color: var(--paper); }
.ps-warn a { color: var(--paper); text-decoration-color: var(--paper); }
.ps-warn .ps-warn-h { font-variant-caps: all-small-caps; letter-spacing: 0.1em; font-weight: 600; margin-right: 1ch; }
.ps-note { border-left: 2px solid var(--ink); padding-left: 1.5ch; }
.ps-note.ps-note-acc { border-left-color: var(--accent); }
.ps-status { color: var(--ink-2); min-height: 1.62em; }
.ps-status.ps-bad { color: var(--ink); font-weight: 600; }
.ps-status.ps-good { color: var(--accent); }

/* the ASCII progress line */
.ps-prog { white-space: pre; overflow: hidden; text-overflow: clip; color: var(--ink-2); }
.ps-prog b { color: var(--accent); font-weight: 600; }

/* an inactive part of a page: the contracts do not exist yet */
.ps-off { opacity: 0.55; }

/* the inner pages' abstract and the "not launched" line */
.ps-abs { margin-top: 18px; }
.ps-stamp { display: inline-block; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 0 1ch; font-variant-caps: all-small-caps; letter-spacing: 0.12em; font-weight: 600; }
.ps-dot { display: inline-block; width: 0.62em; height: 0.62em; background: var(--ink-3); vertical-align: 0.05em; margin-right: 0.6ch; }
.ps-dot.ps-live { background: var(--accent); }

/* ---- narrow screens ----------------------------------------------------------------------------- */
/* questions: each a line that opens, Q. in the margin */
.ps-faq { border-top: 1px solid var(--rule-2); }
.ps-faq:last-of-type { border-bottom: 1px solid var(--rule-2); }
.ps-faq > summary { cursor: pointer; list-style: none; position: relative; padding: 6px 0 6px 4ch; font-weight: 600; }
.ps-faq > summary::-webkit-details-marker { display: none; }
.ps-faq > summary::before { content: "Q."; position: absolute; left: 0; color: var(--ink-3); font-weight: 400; }
.ps-faq[open] > summary::before { color: var(--accent); }
.ps-faq > summary:hover { color: var(--accent); }
.ps-faq > div { padding: 0 0 12px 4ch; }
.ps-faq > div > p { margin: 0; }

@media (max-width: 760px) {
  :root { --fs: 13.5px; --gut: 2ch; }
  .ps-nav { gap: 4px 2ch; }
  .ps-wal { margin-left: 0; width: 100%; }
  .ps-t-cmp th[scope="row"] { width: auto; }
}
@media (max-width: 560px) {
  :root { --fs: 12.5px; --gut: 16px; }
  .ps-sheet { padding: 14px 16px 32px; }
  .ps-body { padding-left: 0; }
  .ps-run { gap: 1ch; }
  .ps-run .ps-run-x { display: none; }
  .ps-memo { font-size: 0.92em; }
  .ps-memo .ps-memo-x { display: none; }
  .ps-title { margin-top: 30px; }
  .ps-title h1 { font-size: 1.62em; letter-spacing: 0.04em; }
  .ps-nav-h { min-width: 7ch; }
  .ps-nav-g { gap: 0 1.3ch; }
  .ps-fig-w { display: none; }
  .ps-fig-n { display: block; }
  .ps-field { grid-template-columns: 1fr; }
  .ps-field .ps-hint { grid-column: 1; }
  .ps-in, .ps-sel { max-width: none; }
  .ps-in.ps-num { max-width: none; }
  .ps-spec-row { grid-template-columns: 11ch 1fr; }
  .ps-red { width: 12ch; }
  .ps-t-cmp thead { display: none; }
  .ps-t-cmp, .ps-t-cmp tbody, .ps-t-cmp tr, .ps-t-cmp th, .ps-t-cmp td { display: block; width: 100%; }
  .ps-t-cmp tbody tr { padding: 6px 0; }
  .ps-t-cmp tbody tr + tr { border-top: 1px solid var(--rule-2); }
  .ps-t-cmp tbody tr + tr td, .ps-t-cmp tbody tr + tr th { border-top: 0; }
  .ps-t-cmp th[scope="row"] { padding: 0; font-weight: 600; color: var(--ink); }
  .ps-t-cmp td { padding: 0 0 0 2ch; }
  .ps-t-cmp td::before { content: attr(data-h) ": "; color: var(--ink-3); }
  .ps-foot-nav { flex-direction: column; }
}
@media (max-width: 360px) {
  :root { --fs: 12px; }
}
@media print {
  .ps-nav, .ps-wal, .ps-foot-tools, .ps-btn { display: none !important; }
  body { background: #fff; color: #000; }
}
