        /* ==========================================================================
           #H  Boswell — the journal's companion
           --------------------------------------------------------------------------
           2026-09-06. Brief: .impeccable/surfaces/public-11-ai-chat-js.md
           A correspondence in the log's own hand: the ask in print caps, Boswell's words
           typed, a rule between exchanges — not two colours of bubble. Since 2026-09-19
           Boswell speaks first, in a note at the head, and cards by the writing line
           offer what it can do; today's column and its margin are gone.
           The page is exactly the screen: the head at the top, the writing line at the
           foot above the bar, the body scrolling between.
           ========================================================================== */

        /* .active only: the bare id also matched the page when another was showing,
           and a 100dvh flex column that is display:flex whether or not it is the page
           stood above every other page once it had been drawn once (2026-09-06). */
        #boswellPage.active {
            background: var(--log-stock);
            display: flex;
            flex-direction: column;
            height: 100vh;
            height: 100dvh;
            min-height: 0;
            overflow: hidden;
            overflow: clip;   /* see #savedPage: a hidden box still scrolls under a focus */
            padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px));
        }

        /* The head and its title are the room head (.room-bar, css/11-home.css, since
           2026-09-16). What is this room's own: the page is a column with its own scroller,
           so the head must not shrink; and a floor height, because entered from the bottom
           bar at rest both side cells are empty and the head would otherwise be only as tall
           as the word BOSWELL. */
        #boswellPage .bo-bar {
            flex: none;
            min-height: calc(44px + 2 * var(--sp-2xs) + 1px + env(safe-area-inset-top, 0px));
        }
        #boswellPage .bo-bar > :first-child { justify-self: start; }
        #boswellPage .bo-bar > :last-child { justify-self: end; }

        #boswellPage .bo-word {
            font-family: var(--log-print);
            font-size: var(--fs-micro);
            font-weight: 600;
            letter-spacing: 0.16em;
            text-transform: uppercase;
            color: var(--log-ink);
            text-decoration: underline;
            text-underline-offset: 0.25em;
            text-decoration-thickness: 1px;
            background: none;
            border: none;
            padding: 0;
            cursor: pointer;
            min-height: 44px;
            display: inline-flex;
            align-items: center;
            white-space: nowrap;
        }
        #boswellPage .bo-word:disabled { color: var(--log-ink-soft); cursor: default; }
        /* The word set to hidden is gone: .bo-word's own display outranks the attribute otherwise (review, 2026-09-19). */
        #boswellPage .bo-word[hidden] { display: none; }

        /* ---- The body --------------------------------------------------------------- */
        #boswellPage .bo-body {
            flex: 1 1 auto;
            min-height: 0;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
        }

        /* A journey's name is printed, even inside a written sentence. */
        #boswellPage .bo-print {
            font-family: var(--log-print);
            font-size: var(--fs-micro);
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        /* Spoken, never drawn: what Boswell is doing, for whoever reads with their ears. */
        #boswellPage .bo-status {
            position: absolute;
            width: 1px;
            height: 1px;
            margin: -1px;
            padding: 0;
            overflow: hidden;
            clip: rect(0 0 0 0);
            clip-path: inset(50%);
            white-space: nowrap;
            border: 0;
        }

        /* The correspondence. */
        #boswellPage .bo-exchange { padding: 0 var(--sp-lg); }
        #boswellPage .bo-entry {
            padding: var(--sp-md) 0;
            border-bottom: 1px solid var(--log-rule);
        }
        #boswellPage .bo-entry:last-child { border-bottom: none; }
        #boswellPage .bo-ask-line {
            margin: 0 0 var(--sp-xs);
            font-family: var(--log-print);
            font-size: var(--fs-micro);
            font-weight: 600;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            line-height: 1.5;
            color: var(--log-ink);
        }
        /* Boswell's words are in its own typewriter hand (owner, 2026-09-19: 老式打字机那种字体 … 好区分), 12px on 1.6. */
        #boswellPage .bo-answer {
            margin: 0;
            font-family: var(--log-type);
            font-size: var(--fs-small);
            line-height: 1.6;
            color: var(--log-ink);
        }
        #boswellPage .bo-answer p { margin: 0 0 var(--sp-xs); }
        #boswellPage .bo-answer p:last-child { margin-bottom: 0; }
        #boswellPage .bo-answer.is-quiet,
        #boswellPage .bo-quiet {
            font-family: var(--log-write);
            font-size: var(--fs-small);
            color: var(--log-ink-soft);
            margin: 0;
        }
        #boswellPage .bo-quiet { padding: var(--sp-sm) 0; }

        /* While Boswell writes, the line breathes — the Wall's waiting idiom — so the
           page is not still; and when the answer comes it is written on a paragraph
           at a time, a beat apart, rather than dropped whole. */
        #boswellPage .bo-answer.is-writing { animation: wall-breathe 1.8s ease-in-out infinite; }
        #boswellPage .bo-answer.is-arriving p {
            opacity: 0;
            animation: bo-line-in 0.45s ease forwards;
            animation-delay: calc(var(--i, 0) * 0.32s);
        }
        @keyframes bo-line-in {
            from { opacity: 0; transform: translateY(3px); }
            to { opacity: 1; transform: none; }
        }
        @media (prefers-reduced-motion: reduce) {
            #boswellPage .bo-answer.is-writing { animation: none; }
            #boswellPage .bo-answer.is-arriving p { animation: none; opacity: 1; }
        }

        /* ---- Boswell's note, and the cards by the writing line (2026-09-19) ---------- */
        /* What Boswell says first, in its typewriter hand: a printed byline, two or three sentences, a quieter aside. */
        #boswellPage .bo-note { padding: var(--sp-md) var(--sp-lg); border-bottom: 1px solid var(--log-rule); }
        #boswellPage .bo-note-by {
            display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-sm); margin: 0 0 var(--sp-xs);
            font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--log-ink-soft);
        }
        #boswellPage .bo-note-p { margin: 0; font-family: var(--log-type); font-size: var(--fs-small); line-height: 1.6; color: var(--log-ink); text-wrap: pretty; }
        #boswellPage .bo-note-p + .bo-note-p { margin-top: var(--sp-xs); }
        #boswellPage .bo-note-p.is-aside { color: var(--log-ink-soft); }
        #boswellPage .bo-note-pr { font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
        #boswellPage .bo-note-t { font-variant-numeric: tabular-nums; white-space: nowrap; }
        #boswellPage .bo-note-acts { display: flex; gap: var(--sp-md); margin: 0; }
        /* Once something is said, the note folds to its first line, which opens it again. */
        #boswellPage .bo-note-fold {
            display: block; width: 100%; min-height: 44px; padding: var(--sp-xs) var(--sp-lg); text-align: left; background: none; border: none;
            border-bottom: 1px solid var(--log-rule); font-family: var(--log-type); font-size: var(--fs-small); line-height: 1.5; color: var(--log-ink-soft);
            white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer;
        }
        #boswellPage .bo-note-fold:focus-visible { outline: 2px solid var(--log-ink); outline-offset: -2px; }

        /* The cards: two and a half by the thumb, the next showing its edge, going round. No rule above them (owner). */
        #boswellPage .bo-cards {
            position: relative; flex: none; display: flex; gap: var(--sp-sm); overflow-x: auto; scroll-snap-type: x mandatory;
            scroll-padding-inline: var(--sp-lg); padding: var(--sp-sm) var(--sp-lg); scrollbar-width: none;
        }
        #boswellPage .bo-cards[hidden] { display: none; }
        #boswellPage .bo-cards::-webkit-scrollbar { display: none; }
        #boswellPage .bo-card {
            flex: 0 0 64%; scroll-snap-align: start; display: flex; flex-direction: column; gap: 5px; min-height: 68px;
            padding: 9px var(--sp-sm) 10px; background: var(--log-stock-band); border: 1px solid var(--log-rule-firm);
            text-align: left; color: var(--log-ink); cursor: pointer; font: inherit;
        }
        #boswellPage .bo-card:focus-visible { outline: 2px solid var(--log-ink); outline-offset: 2px; }
        #boswellPage .bo-card-kind { font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--log-ink-soft); }
        #boswellPage .bo-card-say { font-family: var(--log-write); font-size: 13px; font-weight: 500; line-height: 1.35; color: var(--log-ink); text-wrap: pretty; }

        /* ---- The writing line ------------------------------------------------------ */
        /* A ruled entry at the foot: the label in the margin column, the words, the one
           word that sends. Held above the bar; the body scrolls beneath it. */
        /* Entered from a trip: the app's bar is hidden and the trip's own tab bar
           stands at the foot instead, drawn with the trip page's classes so it is the
           same bar. The page's allowance for the app's bar goes with it. */
        body.bar-hidden #boswellPage.active { padding-bottom: env(safe-area-inset-bottom, 0px); }
        #boswellPage .bo-tabbar { flex: none; position: static; }

        #boswellPage .bo-line {
            position: relative;
            flex: none;
            display: grid;
            grid-template-columns: auto 1fr auto auto;   /* the mark, the words, FILE, ASK */
            align-items: center;
            gap: var(--sp-sm);
            padding: 0 var(--sp-lg) 0 0;
            border-top: 1px solid var(--log-rule-firm);
            background: var(--log-stock);
        }
        /* The traveller's mark — their square, as on the Profile — signs the line;
           the one word Ask at the right sends it. */
        #boswellPage .bo-line-who {
            width: 40px;
            height: 40px;
            margin-left: var(--sp-sm);
            display: flex;
            align-items: center;
            justify-content: center;
            background: var(--log-stock-band);
            border: 1px solid var(--log-rule-firm);
            font-family: var(--log-print);
            font-size: var(--fs-small);
            font-weight: 600;
            color: var(--log-ink);
            overflow: hidden;
            cursor: text;
        }
        #boswellPage .bo-line-who img { width: 100%; height: 100%; object-fit: cover; display: block; }
        #boswellPage .bo-input {
            min-height: 52px;
            padding: var(--sp-sm) var(--sp-xs);
            background: transparent;
            border: none;
            outline: none;
            font-family: var(--log-write);
            font-size: var(--fs-base);
            color: var(--log-ink);
            caret-color: var(--log-ink);
        }
        #boswellPage .bo-input::placeholder { color: var(--log-ink-soft); opacity: 1; }
        #boswellPage .bo-line:focus-within { background: var(--log-stock-lit, #DEE4E2); box-shadow: inset 0 -2px 0 0 var(--log-ink); }

        #boswellPage :focus-visible { outline: 2px solid var(--log-ink); outline-offset: 2px; }
        #boswellPage .bo-input:focus-visible { outline: none; }

        /* ==========================================================================
           Filing a booking (2026-09-17) — 38-boswell-filing.js
           Direction: .impeccable/mocks/boswell-filing/, the owner's ③ with ①'s slip. What
           Boswell would write rises as a slip docked on the writing line: a band head (what,
           which of how many, into which journey), a row per value with the words it was read
           from beneath it, stamps for what the document did not print or what needs checking,
           and a band of acts whose magenta word is the only one that writes. The questions
           before a slip — the year, the journey, a day past the journey's end — are rows in
           the correspondence, where the reading is.
           ========================================================================== */
        #boswellPage .bo-word.is-rec { color: var(--log-magenta); }
        #boswellPage .bo-word[aria-disabled="true"] { color: var(--log-ink-soft); text-decoration: none; cursor: default; }
        #boswellPage .bo-sr {
            position: absolute; width: 1px; height: 1px; overflow: hidden;
            clip: rect(0 0 0 0); white-space: nowrap;
        }
        #boswellPage .bo-file-name { text-decoration: underline dotted; text-underline-offset: 0.25em; overflow-wrap: anywhere; }

        /* The questions, as rows of written words; a state on a row is the boxed stamp. */
        #boswellPage .bo-choices { display: flex; flex-direction: column; margin: var(--sp-xs) 0 0; border-top: 1px solid var(--log-rule); }
        #boswellPage .bo-choice {
            display: flex; align-items: center; justify-content: space-between; gap: var(--sp-sm);
            width: 100%; min-height: 48px; padding: var(--sp-2xs) 0;
            border: none; border-bottom: 1px solid var(--log-rule); background: none; cursor: pointer; text-align: left;
            font-family: var(--log-write); font-size: var(--fs-body); line-height: 1.35; color: var(--log-ink);
        }
        #boswellPage .bo-choice:active { box-shadow: inset 0 -2px 0 0 currentColor; }
        #boswellPage .bo-choice.is-input { cursor: default; }
        #boswellPage .bo-stamp {
            flex: none; display: inline-flex; align-items: center; align-self: center;
            padding: 4px 6px 3px; border: 1px solid var(--log-ink);
            font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600; line-height: 1.2;
            letter-spacing: 0.12em; text-transform: uppercase; color: var(--log-ink); white-space: nowrap;
        }
        #boswellPage .bo-stamp.is-open { border-style: dashed; border-color: var(--log-ink-soft); color: var(--log-ink-soft); }

        /* The slip. Its own scroller, so a long booking never pushes the writing line off the screen. */
        #boswellPage .bo-slip {
            flex: none; max-height: 62%; overflow-y: auto; overscroll-behavior: contain;
            /* No shadow: nothing in this world is lifted off the sheet (DESIGN.md). Its edge is the firm rule, and the
               band of its head (finish review, 2026-09-17). */
            background: var(--log-stock); border-top: 1px solid var(--log-rule-firm);
        }
        #boswellPage .bo-slip[hidden] { display: none; }
        /* The head and the act band are sticky: a row scrolled to for the keyboard stops clear of both (review, 2026-09-17). */
        #boswellPage .bo-slip { scroll-padding-block: 48px 60px; }
        #boswellPage .bo-slip-head, #boswellPage .bo-slip-acts {
            position: sticky; z-index: 1;
            display: flex; align-items: center; justify-content: space-between; gap: var(--sp-sm);
            min-height: 44px; padding: 0 var(--sp-lg); background: var(--log-stock-band);
        }
        #boswellPage .bo-slip-head { top: 0; border-bottom: 1px solid var(--log-rule-firm); }
        #boswellPage .bo-slip-acts { bottom: 0; min-height: 52px; border-top: 1px solid var(--log-rule-firm); }
        /* A batch slip carries three words (back, leave out, add): they wrap rather than crowd (2026-09-19). */
        #boswellPage .bo-slip-acts { flex-wrap: wrap; column-gap: var(--sp-md); }

        #boswellPage .bo-slip-what, #boswellPage .bo-slip-to {
            font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600;
            letter-spacing: 0.14em; text-transform: uppercase; color: var(--log-ink);
        }
        #boswellPage .bo-slip-to { color: var(--log-ink-soft); display: inline-flex; align-items: center; gap: 6px; }
        #boswellPage .bo-slip-note {
            margin: 0; padding: var(--sp-xs) var(--sp-lg); border-bottom: 1px solid var(--log-rule);
            font-family: var(--log-write); font-size: var(--fs-small); line-height: 1.5; color: var(--log-ink);
        }
        #boswellPage .bo-slip-note.is-fault { font-weight: 600; }
        /* What a receipt was read as, and the word that changes it (2026-09-19). */
        /* THE BY-HAND CORRECTION ROWS WERE DRESSED HERE AND ARE GONE (2026-09-25).

           `.bo-row` and its parts — `.bo-lab`, `.bo-val`, `.bo-src`, `.bo-row.is-kept`,
           `.bo-row.is-editing`, `.bo-edit-acts` — with `.bo-slip-kind`, `.bo-slip-kind-acts`
           and `.bo-quiet-word`: a filed booking laid out as label, value and source, each value
           a press that corrected it. It shipped in b2743f1 and 1989fde redrew the same job as a
           slip printed one at a time, to be filed and torn off. The markup went with that
           redesign; the dress stayed, eighteen months of nobody noticing in a file everybody
           reads.

           Confirmed three ways before cutting, because a reading scan cannot see markup built
           at run time: css-dead’s read, its --probe against a running app, and a search of
           every script for the names — assembled from a prefix as well as written whole. None
           of the eleven appears anywhere.

           `git show 35b599e:public/css/13-boswell.css` has them, if correcting a booking by
           hand is ever built (DEBTS §7 keeps it on the owner’s list). It will be designed
           against the slip that exists now, not against the rows that preceded it. */

        /* A value is written words on a hairline, and a press on it corrects it. */
        #boswellPage .bo-inputs { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
        #boswellPage .bo-slip-input {
            width: 100%; min-height: 44px; box-sizing: border-box; padding: 0; border: none; border-radius: 0; background: transparent;
            font-family: var(--log-write); font-size: var(--fs-base); color: var(--log-ink);
            box-shadow: inset 0 -2px 0 0 var(--log-ink); outline: none; -webkit-appearance: none; appearance: none;
        }
        #boswellPage .bo-slip-input.is-year { width: 7em; box-shadow: inset 0 -1px 0 0 var(--log-rule-firm); }
        #boswellPage .bo-slip-input[aria-invalid="true"] { box-shadow: inset 0 -2px 0 0 var(--log-port); }
        #boswellPage .bo-slip-check { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-family: var(--log-write); font-size: var(--fs-body); color: var(--log-ink); }

        /* On today's page a booking being filed is written under the spread, at the page's full measure. */
        #boswellPage .bo-exchange.is-files { border-top: 1px solid var(--log-rule-firm); }
        /* A field being written shows where the keyboard is: the input rule above set no outline, and came after the page's
           own :focus-visible rule at the same weight (finish review, 2026-09-17). */
        #boswellPage .bo-slip-input:focus-visible { outline: 2px solid var(--log-ink); outline-offset: 2px; }
        #boswellPage .bo-slip-what:focus-visible, #boswellPage .bo-question:focus-visible, #boswellPage .bo-answer:focus-visible,
        #boswellPage .bo-slip-note:focus-visible { outline: 2px solid var(--log-ink); outline-offset: 2px; }
        #boswellPage .bo-choice .bo-word { min-height: 0; }


        /* Writing up a day (26b-boswell-writeup.js): Boswell asks in its typed hand, the traveller's answers stand in
           theirs, and the draft on the slip is written in the write face, to be corrected before it is saved. */
        #boswellPage .is-writeup .bo-answer + .bo-answer,
        #boswellPage .bo-writeup-said + .bo-answer { margin-top: var(--sp-xs); }
        #boswellPage .bo-writeup-said { margin: 2px 0 0; font-family: var(--log-write); font-size: var(--fs-base); line-height: 1.5; color: var(--log-ink); white-space: pre-wrap; }
        #boswellPage .bo-writeup-acts, #boswellPage .bo-writeup-again { display: flex; flex-wrap: wrap; gap: 0 var(--sp-sm); margin-top: var(--sp-xs); }
        #boswellPage .bo-writeup-again { padding: 0 var(--sp-lg); }
        #boswellPage .bo-writeup-text {
            display: block; width: calc(100% - 2 * var(--sp-lg)); box-sizing: border-box; margin: var(--sp-xs) var(--sp-lg) 0; padding: var(--sp-xs) 0; resize: vertical;
            border: none; border-radius: 0; background: transparent; box-shadow: inset 0 -2px 0 0 var(--log-ink); outline: none;
            font-family: var(--log-write); font-size: var(--fs-base); line-height: 1.55; color: var(--log-ink);
        }
        #boswellPage .bo-writeup-text:focus-visible { outline: 2px solid var(--log-ink); outline-offset: 2px; }
        #boswellPage .bo-writeup-saves { display: flex; gap: var(--sp-md); }

        /* ---- Boswell's printer (38b-boswell-printer.js, owner 2026-09-20) ----------------------------------------------
           What FILE read prints one at a time from a printer that counts n / N; the paper is Boswell's typed hand, torn at
           its foot; its acts carry icons, each with its word. The printer's body is the night plate the app already uses
           for the one dark object on a page; the paper is a lighter stock than the sheet, so it reads as a thing on it. */
        #boswellPage .bo-printer {
            position: relative; z-index: 2; margin-top: var(--sp-md); padding: 10px 14px 14px; border-radius: 10px 10px 4px 4px;
            background: var(--log-night-plate); color: var(--log-on-night-plate);
        }
        #boswellPage .bo-pr-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-sm); min-height: 32px; }
        #boswellPage .bo-pr-journey {
            min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: none; border: 0; padding: 0; color: inherit; text-align: left;
            font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
        }
        #boswellPage button.bo-pr-journey { cursor: pointer; text-decoration: underline; text-underline-offset: 4px; min-height: 44px; }
        #boswellPage .bo-pr-count { display: inline-flex; align-items: center; gap: 8px; flex: none; font-family: var(--log-type); font-size: 15px; font-weight: 700; letter-spacing: 0.06em; }
        #boswellPage .bo-pr-led { width: 7px; height: 7px; border-radius: 50%; background: #6E7A77; }
        #boswellPage .bo-printer.is-busy .bo-pr-led { background: #7FD1A8; animation: bo-blink .5s steps(2) infinite; }
        #boswellPage .bo-printer.is-done .bo-pr-led { background: #7FD1A8; }
        @keyframes bo-blink { 50% { opacity: .25; } }
        #boswellPage .bo-pr-slot { margin-top: 10px; height: 8px; border-radius: 4px; background: #05080F; }

        #boswellPage .bo-pr-feed { position: relative; z-index: 1; overflow: hidden; margin: -12px 12px 0; padding-top: 8px; }
        #boswellPage .bo-rc {
            position: relative; padding: 16px 16px 26px; background: #F3F5F2; color: var(--log-ink); font-family: var(--log-type); font-size: var(--fs-small);
            -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x;
                    mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x;
        }
        #boswellPage .bo-rc::before { content: ""; position: absolute; inset: 0 0 auto; height: 14px; background: linear-gradient(rgba(5, 8, 15, .18), transparent); pointer-events: none; }
        @keyframes bo-print { from { transform: translateY(-101%); } to { transform: none; } }
        #boswellPage .bo-rc.is-torn { animation: bo-tear .75s cubic-bezier(.5, 0, .75, .2) forwards; }
        @keyframes bo-tear { 18% { transform: translate(-3px, 6px) rotate(-1.5deg); } 100% { transform: translate(40px, 115%) rotate(9deg); opacity: 0; } }

        #boswellPage .bo-rc-head { display: flex; justify-content: space-between; gap: var(--sp-sm); font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--log-ink-soft); }
        #boswellPage .bo-rc-dash { border: 0; border-top: 1.5px dashed var(--log-rule); margin: 12px 0; }
        #boswellPage .bo-rc-line { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; column-gap: var(--sp-sm); }
        #boswellPage .bo-rc-soft { color: var(--log-ink-soft); }
        #boswellPage .bo-rc-val {
            min-height: 44px; padding: 2px 0; background: none; border: 0; color: inherit; font: inherit; text-align: inherit; cursor: pointer;
            overflow-wrap: anywhere; text-decoration: underline dotted var(--log-rule); text-underline-offset: 4px;
        }
        #boswellPage .bo-rc-val:focus-visible { outline: 2px solid var(--log-ink); outline-offset: 2px; }
        #boswellPage .bo-rc-big { font-size: 20px; font-weight: 700; line-height: 1.2; text-align: left; }
        #boswellPage .bo-rc-route { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: start; gap: 8px; margin-top: 6px; }
        #boswellPage .bo-rc-route > div { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
        #boswellPage .bo-rc-route > .bo-rc-to { align-items: flex-end; text-align: right; }
        #boswellPage .bo-rc-place { font-size: 17px; font-weight: 700; line-height: 1.25; }
        #boswellPage .bo-rc-time { font-size: var(--fs-small); }
        #boswellPage .bo-rc-arrow { padding-top: 6px; color: var(--log-ink-soft); }
        #boswellPage .bo-rc-kind { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; column-gap: var(--sp-sm); color: var(--log-ink-soft); }
        #boswellPage .bo-rc-kind-acts { display: flex; flex-wrap: wrap; column-gap: var(--sp-md); }
        #boswellPage .bo-rc-rows { display: flex; flex-direction: column; }
        #boswellPage .bo-rc-row { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--sp-sm); align-items: center; }
        #boswellPage .bo-rc-lab { color: var(--log-ink-soft); margin: 0; }
        #boswellPage .bo-rc-cell { display: flex; justify-content: flex-end; align-items: center; gap: 8px; text-align: right; min-width: 0; }
        #boswellPage .bo-rc .is-new { color: var(--log-starboard); font-weight: 700; }
        #boswellPage .bo-rc-mark {
            flex: none; font-family: var(--log-print); font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
            color: var(--log-ink); border: 1.5px solid currentColor; padding: 2px 5px; line-height: 1;
        }
        #boswellPage .bo-rc-mark.is-open { border-style: dashed; color: var(--log-ink-soft); }
        #boswellPage .bo-rc-checks { margin: 8px 0 0; color: var(--log-ink-soft); display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
        #boswellPage .bo-rc-src { grid-column: 1 / -1; margin: 2px 0 6px; padding: 6px 8px; background: #E6EAE7; font-size: 11.5px; line-height: 1.4; color: var(--log-ink-soft); }
        #boswellPage .bo-rc-src:empty { display: none; }
        #boswellPage .bo-rc-edit { margin: 8px 0; padding: 8px 0; border-top: 1px solid var(--log-rule); border-bottom: 1px solid var(--log-rule); }
        #boswellPage .bo-rc-edit .bo-slip-input { font-family: var(--log-write); }
        #boswellPage .bo-rc-edit-acts { display: flex; justify-content: flex-end; gap: var(--sp-md); }
        #boswellPage .bo-rc-status { margin: 0; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
        #boswellPage .bo-rc-note { margin: 4px 0 0; line-height: 1.5; }
        #boswellPage .bo-rc-note.is-soft { color: var(--log-ink-soft); font-size: 11.5px; }
        #boswellPage .bo-rc-note.is-fault { font-weight: 700; color: var(--log-port); }
        #boswellPage .bo-rc-maybe { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; column-gap: var(--sp-sm); }

        /* The acts: an icon, and its word under it. */
        #boswellPage .bo-rc-acts { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 14px; padding-top: 8px; border-top: 1.5px dashed var(--log-rule); }
        #boswellPage .bo-rc-act {
            display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-height: 56px; padding: 4px;
            background: none; border: 0; border-radius: 6px; color: var(--log-ink); cursor: pointer; text-align: center;
            font-family: var(--log-print); font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
        }
        #boswellPage .bo-rc-act svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
        #boswellPage .bo-rc-act.is-rec { color: var(--log-magenta); }
        #boswellPage .bo-rc-act.is-still { color: var(--log-ink-soft); cursor: default; }
        #boswellPage .bo-rc-act[aria-disabled="true"] { opacity: .5; }
        #boswellPage .bo-rc-act:focus-visible { outline: 2px solid var(--log-ink); outline-offset: 2px; }
        #boswellPage .bo-rc-act:active svg { transform: scale(.92); }

        #boswellPage .bo-rc-stamp {
            position: absolute; right: 16px; bottom: 120px; padding: 6px 10px; border: 2.5px solid currentColor; color: var(--log-magenta);
            font-family: var(--log-print); font-size: 18px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
            transform: rotate(-8deg) scale(1.6); opacity: 0; pointer-events: none;
        }
        #boswellPage .bo-rc-stamp:empty { display: none; }
        #boswellPage .bo-rc-stamp.is-down { animation: bo-stamp .28s cubic-bezier(.25, 1, .5, 1) forwards; }
        #boswellPage .bo-rc-stamp.is-out { color: var(--log-ink-soft); }
        @keyframes bo-stamp { to { transform: rotate(-8deg) scale(1); opacity: .92; } }


        #boswellPage .bo-stubs { list-style: none; margin: var(--sp-sm) 0 0; padding: 0; }
        #boswellPage .bo-stubs li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-sm); padding: 10px 0; border-top: 1px solid var(--log-rule); font-family: var(--log-type); font-size: var(--fs-small); line-height: 1.4; }
        #boswellPage .bo-stubs li:last-child { border-bottom: 1px solid var(--log-rule); }
        #boswellPage .bo-stubs small { display: block; color: var(--log-ink-soft); font-size: 11.5px; }
        #boswellPage .bo-stub-word { font-family: var(--log-print); font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--log-ink-soft); padding-top: 3px; }
        #boswellPage .bo-stub-word.is-rec { color: var(--log-magenta); }

        @media (prefers-reduced-motion: reduce) {
            #boswellPage .bo-rc, #boswellPage .bo-rc.is-torn, #boswellPage .bo-printer.is-busy .bo-pr-led { animation: none !important; }
            #boswellPage .bo-rc-stamp.is-down { animation: none; opacity: .92; transform: rotate(-8deg); }
        }
        #boswellPage .bo-rc-nights { margin: 6px 0 0; font-family: var(--log-print); font-size: var(--fs-micro); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--log-ink-soft); }
