/* ==========================================================================
           #M  The sidebar — the log's contents page
           --------------------------------------------------------------------------
           Migrated into the deck log on 2026-09-07, at the same time as its contents were
           settled. Drawn by public/31-markup-home.js.

           On the number: the deck-log band is 11–17 and full; 17a is Notifications, so this
           takes 17b. A part added to the band gets the next letter until the band is
           renumbered. See the stylesheet table in this document.

           It opens from one place only — the left corner control on Home's night plate —
           which is why it does not need to name the app: see the head's own note.
           ========================================================================== */
        .sidebar {
            position: fixed;
            top: 0;
            left: -300px;
            width: 300px;
            height: 100vh;
            /* Chart stock, not the outgoing world's --bg-secondary. */
            background: var(--log-stock);
            /* Ruled, not floated. The One-Plane Rule: no shadow in this world, so the
               drawer's edge against the page is a firm rule and nothing else. */
            box-shadow: none;
            border-right: 1px solid var(--log-rule-firm);
            transition: left 0.3s ease;
            z-index: 2000;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
        }

        .sidebar.active { left: 0; }

        .sidebar-overlay {
            display: none;
            position: fixed;
            inset: 0;
            /* The oilskin at a low pressure, not the outgoing world's warm grey. */
            background: rgba(22, 25, 26, 0.42);
            z-index: 1999;
        }

        .sidebar-overlay.active { display: block; }

        /* ---- the head ---------------------------------------------------------- */

        .sidebar-header {
            padding: calc(var(--sp-xl) + env(safe-area-inset-top, 0px)) var(--sp-lg) var(--sp-md);
            border-bottom: 1px solid var(--log-rule-firm);
            display: flex;
            flex-direction: column;
            gap: var(--sp-xs);
        }

        /* The same two words as the login masthead and the cover title, in the same face. */
        .sidebar-wordmark {
            font-family: var(--log-print);
            font-weight: 600;
            font-size: 1.35rem;
            line-height: 1.05;
            letter-spacing: 0.01em;
            color: var(--log-ink);
        }

        /* The subject line: printed matter, so print caps at the micro floor. The sign-in
           sheet sets the same three phrases as its column heads — there they are three
           cells of a form and take rules between them; here they are one sentence and take
           stops. */
        .sidebar-phases {
            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);
        }

        /* ---- the rows --------------------------------------------------------- */

        .sidebar-menu {
            padding: 0;
            display: flex;
            flex-direction: column;
        }

        /* One destination is one ruled row at the sheet's own pitch. No icons: an action in
           this world is a word in print caps, which is the same rule that emptied the bottom
           bar of its glyphs. The three that were here and are not any more — My journeys,
           Travel stats and Boswell — were Home, the Register and the bar's third
           destination, each of them one tap away from the page this drawer opens over. */
        .sidebar-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: var(--sp-md);
            width: 100%;
            min-height: var(--log-row);
            padding: var(--sp-sm) var(--sp-lg);
            background: none;
            border: none;
            border-bottom: 1px solid var(--log-rule);
            text-align: left;
            font-family: var(--log-print);
            font-size: var(--fs-small);
            font-weight: 600;
            letter-spacing: 0.16em;
            text-transform: uppercase;
            color: var(--log-ink);
            cursor: pointer;
        }

        /* Settings is not another destination in the same list; it is where the app is
           adjusted rather than read. A firm rule says so, laid over the hairline above it —
           the same way the bottom bar's current item lays its 2px over the bar's own line. */
        .sidebar-item.is-apart {
            border-top: 1px solid var(--log-rule-firm);
            margin-top: -1px;
        }

        /* The Stamped-State Rule's two sidebar rows are gone, and so is the styling that
           dressed them. Tool kit stopped being a stamp on 2026-09-07, Sync and About on
           2026-09-08, and the note left here on 2026-09-07 said that a row still marked
           this way in a month should come out rather than keep standing there. It did not
           take a month. `.sidebar-item.is-soon` and `.sidebar-stamp` had no user left in
           any script or page, and a selector kept for a class nothing writes is a rule that
           reads as live and is not — the Removal Rule. The stamp itself is not gone from
           the world: Settings keeps it, for Passkey and Language, where things that do not
           exist yet are now kept. */

        /* The Ink-Not-Glow Rule: pressing thickens the row's own baseline rather than
           tinting its ground. */
        .sidebar-item:active {
            box-shadow: inset 0 -2px 0 0 var(--log-ink);
        }

        .sidebar :focus-visible {
            outline: 2px solid var(--log-ink);
            outline-offset: -2px;
        }

        /* The Ruled-To-The-Foot Rule: the rest of the drawer keeps the ruling at the pitch
           rather than ending in blank stock. */
        .sidebar-rule-out {
            flex: 1;
            min-height: calc(var(--log-row) * 2);
            background-image: repeating-linear-gradient(to bottom,
                transparent 0,
                transparent calc(var(--log-row) - 1px),
                var(--log-rule) calc(var(--log-row) - 1px),
                var(--log-rule) var(--log-row));
        }