.rail-heading-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.rail-heading-actions button{white-space:nowrap;color:var(--gold)}
.playback-speed{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;font-size:1rem;color:#edf1e8}
.playback-speed select{min-width:0;max-width:65%;background:#203631;color:#fff8e9;font-size:1.125rem}
html.machine-expanded,html.machine-expanded body{overflow:hidden}
.machine-fullscreen{box-sizing:border-box;position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;color:#fff8e9;background:#142522;overflow:hidden}
.machine-fullscreen::backdrop{background:#101b17}
.fullscreen-content{display:grid;grid-template-rows:auto minmax(0,1fr);width:100%;height:100%;min-height:0;background:#142522}
.machine-fullscreen[open]{display:block;animation:machine-enter .3s cubic-bezier(.16,1,.3,1)}
.fullscreen-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:14px 24px;border-bottom:1px solid #62766a}
.fullscreen-heading .eyebrow{font-size:1rem;letter-spacing:.12em}
.fullscreen-heading h2{font:28px/1.2 var(--serif);margin:3px 0 0}
.fullscreen-heading button{flex-shrink:0}
.fullscreen-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;min-height:0}
.fullscreen-stage{display:grid;grid-template-rows:minmax(0,1fr) auto auto auto;min-width:0;min-height:0;background:#233b32}
#fullscreen-scene-slot{min-height:0;position:relative}
.fullscreen-stage #scene{height:100%;min-height:0;width:100%}
.fullscreen-signal{padding:16px 24px;background:#182c26;border-top:1px solid #62766a;display:flex;gap:20px;justify-content:space-between;align-items:center}
.fullscreen-signal .small-label{color:#f0ca85;font-size:1.125rem}
.fullscreen-signal p{font-size:1.125rem;line-height:1.5;margin:4px 0 0}
.fullscreen-readout{display:flex;align-items:center;gap:14px;flex-shrink:0;font:1rem var(--mono);color:#d2ddd5}
.fullscreen-readout span{display:grid;gap:7px}
.fullscreen-readout b{font-size:25px;font-weight:400;color:#f0ca85}
#fullscreen-lamp{color:#a9d9d1}
.fullscreen-stage .scene-toolbar{padding:12px 24px 6px;margin:0}
.fullscreen-model-note{font-size:1rem;line-height:1.5;margin:0;max-width:none;padding:8px 24px 14px;background:#182c26;color:#d2ddd5}
.fullscreen-sidebar{min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;border-left:1px solid #62766a;background:#18201c;scrollbar-width:thin;scrollbar-color:#b5c4b4 #18201c}
.machine-fullscreen .exhibit{border:0;overflow:visible}
.machine-fullscreen .exhibit-top{padding:16px 20px}
.machine-fullscreen .exhibit-top>.small-label{display:none}
.machine-fullscreen .exhibit-top .mode-switch{margin:0}
.machine-fullscreen .mode-switch button{flex:1;padding:9px 10px}
.machine-fullscreen .operator{padding:20px;border:0}
.machine-fullscreen .operator h3{font-size:25px;margin-top:14px}
.machine-fullscreen #phase-description{font-size:1rem;line-height:1.6}
.machine-fullscreen .window-display{margin-top:16px;gap:10px}
.machine-fullscreen .window-display strong{font-size:34px}
.machine-fullscreen .stepping-note{font-size:1rem;min-height:0;margin:10px 0}
.machine-fullscreen .keypress-readout{display:none}
.machine-fullscreen .replay-controls{margin-top:16px}
.machine-fullscreen .machine-status{font-size:1rem;min-height:0}
.machine-fullscreen .scrub-label{font-size:1.125rem}
.machine-fullscreen .chapter-actions button{padding:8px;font-size:1.125rem}
.machine-fullscreen #settings{margin-bottom:0}
.machine-fullscreen .message-tapes,.machine-fullscreen .circuit-panel{padding:20px}
.machine-fullscreen #tape-note,.machine-fullscreen #circuit-note{font-size:1rem}
.machine-fullscreen .circuit-path{grid-template-columns:repeat(3,minmax(0,1fr))}
.machine-fullscreen .circuit-path button{min-width:0}
#fullscreen-inspector{margin:0;border-color:#62766a}
#fullscreen-inspector>summary{padding:18px 20px;color:#f0ca85}
#fullscreen-inspector-slot{margin:0}
.fullscreen-sidebar .part-note,.fullscreen-sidebar .part-note p{font-size:1rem}
@keyframes machine-enter{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
@media(min-width:1500px){.fullscreen-layout{grid-template-columns:minmax(0,1fr) 400px}}
@media(max-width:1050px){.fullscreen-layout{grid-template-columns:minmax(0,1fr) 320px}.fullscreen-signal{display:block;padding:12px 18px}.fullscreen-readout{margin-top:12px}.fullscreen-stage .scene-toolbar{padding-inline:18px}.fullscreen-model-note{padding-inline:18px}}
@media(max-width:700px){.fullscreen-heading{padding:12px 16px;gap:12px}.fullscreen-heading h2{font-size:21px}.fullscreen-heading .eyebrow{font-size:1rem}.fullscreen-heading button{max-width:120px;line-height:1.3}.fullscreen-layout{display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain}.fullscreen-stage{flex:none;min-height:500px;grid-template-rows:minmax(250px,48dvh) auto auto auto}.fullscreen-sidebar{flex:none;overflow:visible;border-left:0;border-top:1px solid #62766a}.fullscreen-signal p{font-size:1rem}.fullscreen-readout{gap:22px}.fullscreen-readout b{font-size:22px}.fullscreen-model-note{font-size:1rem}.machine-fullscreen .operator h3{font-size:27px}}
@media(prefers-reduced-motion:reduce){.machine-fullscreen[open]{animation:none}}

/* A paced first-letter lesson shares the existing renderer and cipher state. */
#keypress-guide{padding:18px 24px;background:#142522;border-bottom:1px solid #62766a}
#keypress-guide[hidden]{display:none}
#keypress-guide h3{font:28px/1.3 var(--serif);margin:12px 0}
#keypress-guide p{font-size:1.125rem;line-height:1.6;margin:10px 0;min-height:3.2em}
.guide-phases{display:flex;flex-wrap:wrap;gap:8px 20px;list-style-position:inside;margin:0;padding:0;font-size:1rem;color:#c6d3c8}
.guide-phases li[aria-current]{color:#ffe0a6;text-decoration:underline;text-underline-offset:5px}
.guide-controls{display:flex;gap:8px;flex-wrap:wrap}
.guiding .fullscreen-layout{grid-template-columns:minmax(0,1fr) 320px}
.guiding #fullscreen-exhibit-slot{display:none}
.guiding #fullscreen-inspector{border:0}
.guiding .fullscreen-stage{display:flex;flex-direction:column;overflow:auto}
.guiding #fullscreen-scene-slot{flex:1;min-height:300px}
.guiding #scene{height:100%;min-height:300px}
@media(max-width:900px){.guiding .fullscreen-layout{grid-template-columns:1fr}.guiding #keypress-guide{padding:16px}.guiding #scene{height:45dvh;min-height:280px}.guide-phases{gap:8px 12px}.guide-controls button{font-size:1.125rem}}


/* Keep reading and control text legible in the expanded machine too. */
.fullscreen-heading{flex-wrap:wrap}.fullscreen-heading .eyebrow{font-size:1rem}
.fullscreen-heading button,.machine-fullscreen button,.machine-fullscreen .chapter-actions button{font-size:1.125rem;line-height:1.5}
.fullscreen-readout{flex-wrap:wrap;row-gap:12px}
.fullscreen-readout span{font-size:1rem}
.machine-fullscreen #phase-description,.machine-fullscreen .machine-status,.fullscreen-sidebar .part-note p{font-size:1.125rem;line-height:1.75}
.fullscreen-model-note{font-size:1rem;line-height:1.7}
.fullscreen-layout{grid-template-columns:minmax(0,1fr) 400px}
.guiding .fullscreen-layout{grid-template-columns:minmax(0,1fr) 360px}
.machine-fullscreen .circuit-path{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1050px){.fullscreen-layout{grid-template-columns:minmax(0,1fr) 360px}}
@media(max-width:900px){.guiding .fullscreen-layout{grid-template-columns:1fr}}
@media(max-width:700px){.fullscreen-heading button{max-width:none}.fullscreen-heading h2{font-size:1.5rem}.fullscreen-model-note{font-size:1rem}.fullscreen-readout{gap:16px 24px}}