.other-media{margin-top:64px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.other-media>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:24px 0;font-size:15px;letter-spacing:-.01em;min-height:68px}
.other-media>summary::-webkit-details-marker{display:none}.other-media>summary::after{content:'+';font:22px var(--mono);font-weight:200;color:var(--muted)}.other-media[open]>summary::after{content:'−'}
.media-account{padding:0 0 28px;min-width:0}.media-intro{font-size:13px;color:var(--muted);line-height:1.7;margin:0 0 28px}.media-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;border-bottom:1px solid var(--line);margin:0 0 26px}
.media-tab{min-width:0;padding:13px 0 16px;border:0;border-bottom:1px solid transparent;background:none;color:var(--muted);font:12px Arial;text-align:left;margin-bottom:-1px}
.media-tab[aria-selected=true]{border-bottom-color:var(--fg);color:var(--fg)}.media-tab:hover{color:var(--fg)}.media-panel{outline-offset:6px;min-width:0}
.media-stage{min-width:0;background:#f0efeb;color:#242320;min-height:350px;display:flex;align-items:center;justify-content:center;padding:30px}.media-stage svg{width:100%;max-width:760px;height:auto;display:block}
.media-caption{display:grid;grid-template-columns:1fr auto;column-gap:20px;margin:23px 0 32px;align-items:start}.media-caption h3{margin:0;font-size:18px;line-height:1.5;font-weight:400;letter-spacing:-.02em}.media-caption>p{grid-column:1;margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.7}.media-caption>.media-decode{grid-column:2;grid-row:1 / span 2;align-self:center}.media-caption>.selected-token{grid-column:2;grid-row:1 / span 2;align-self:center;font:10px/1.7 var(--mono);text-align:right}
.media-binary{background:#0a0a0a;color:#e9e9e6;min-height:410px;flex-direction:column;gap:35px}.byte-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 44px;max-width:660px;width:100%}.byte-cell{display:flex;justify-content:space-between;font:clamp(13px,1.7vw,22px) var(--mono);gap:2px}.bit-zero{color:#656565}.bit-one{color:#e9e9e6}.byte-meta{font:9px/1.7 var(--mono);letter-spacing:.04em;color:#aaa}.decoded-statement{font:clamp(27px,4vw,49px)/1.5 Georgia,serif;margin:0;text-align:center;white-space:pre-wrap}
.media-tokens{background:#050505;color:#eee;gap:35px;padding:30px 50px;min-height:410px}.media-token-picture{width:56%;max-width:395px;min-width:0;aspect-ratio:1}.media-token-picture canvas{display:block;width:100%;height:100%}.media-token-controls{display:flex;flex-direction:column;gap:0;width:210px;min-width:0}.media-token-choice{display:flex;align-items:center;gap:13px;min-height:46px;text-align:left;padding:10px 8px;background:transparent;border:0;border-bottom:1px solid #282828;color:#999;font:12px var(--mono)}.media-token-choice[aria-pressed=true]{background:#191919;color:#fff}.media-token-choice:hover{color:#fff}.token-pigment{display:block;width:7px;height:7px;border-radius:50%;flex-shrink:0}.media-token-id{margin-left:auto;color:#888;font-size:10px}.media-all-layers{margin-top:18px;align-self:flex-start;padding:8px 0;background:none;border:0;border-bottom:1px solid transparent;color:#999;font:11px Arial}.media-all-layers[aria-pressed=true]{border-color:#aaa;color:#eee}
.media-foot{border-top:1px solid var(--line);padding-top:23px;display:grid;grid-template-columns:1fr auto;gap:8px 20px;font-size:11px;line-height:1.8;color:var(--muted)}.media-foot>p{grid-column:1/-1;margin:0 0 11px;font:italic 17px/1.7 Georgia,serif;color:var(--fg)}.media-context{max-width:610px}.media-context summary{min-height:34px;width:fit-content}.media-context p{margin:8px 0 0}.media-download{align-self:start;justify-self:end;padding-top:0;min-height:34px}.media-foot>.sr-only{margin:0}
@media(min-width:1000px){.media-account{max-width:940px}.other-media>summary{max-width:940px}}
@media(max-width:660px){.other-media{margin-top:42px}.other-media>summary{font-size:14px;padding:21px 0}.media-tabs{gap:12px;margin-bottom:18px}.media-tab{font-size:11px;padding:12px 0 14px}.media-intro{font-size:12px;margin-bottom:17px}.media-stage{padding:14px;min-height:260px}.media-stage svg{min-height:210px}.media-binary{min-height:290px;padding:28px 20px;gap:26px}.byte-grid{gap:21px 18px}.byte-cell{font-size:12px;gap:1px}.media-caption{grid-template-columns:1fr;gap:0;margin:18px 0 24px}.media-caption h3{font-size:17px}.media-caption>.media-decode,.media-caption>.selected-token{grid-column:1;grid-row:auto;justify-self:start;text-align:left;margin-top:9px}.media-tokens{gap:10px;padding:18px 15px;min-height:290px;flex-direction:column}.media-token-picture{width:100%;max-width:290px}.media-token-controls{width:100%;max-width:340px}.media-token-choice{min-height:44px}.media-all-layers{margin-top:10px}.media-foot{grid-template-columns:1fr;gap:12px}.media-foot>p{font-size:16px}.media-download{grid-column:1;justify-self:start}.decoded-statement{font-size:29px}}
@media(max-width:359px){.byte-grid{gap:20px 13px}.byte-cell{font-size:10px}.media-binary{padding:24px 17px}.media-stage:not(.media-binary):not(.media-tokens){padding:6px}.media-tab{font-size:10px}}

.media-entry{display:inline-block;margin-top:12px;padding:6px 0;color:#c2c2bf;font-size:10px;text-underline-offset:4px}.media-entry:hover{color:#fff}
.token-legend{padding:0 0 28px;max-width:940px;min-width:0}.legend-intro{font-size:13px;line-height:1.8;color:var(--muted);margin:0 0 16px}.legend-flow{font:9px/1.8 var(--mono);letter-spacing:.07em;color:var(--muted);margin:0 0 18px}.legend-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:30px;padding:40px;background:#050505;color:#e5e5e1;align-items:center;min-width:0}.legend-controls{min-width:0;text-align:center}.token-glyphs{display:grid;grid-template-columns:repeat(auto-fit,minmax(44px,1fr));gap:4px}.token-glyph{min-width:0;display:flex;flex-direction:column;align-items:center;gap:10px;background:none;border:1px solid transparent;padding:13px 2px 16px;color:#a9a9a7;font-family:var(--mono)}.token-glyph[aria-pressed=true]{background:#121212;border-color:#3b3b3b;color:#f3f3f0}.token-glyph:hover{background:#111;color:white}.glyph-word{font-size:11px;white-space:nowrap}.glyph-id{font-size:9px;color:#858583}.bit-tape{display:flex;flex-direction:column;gap:3px;margin-top:7px}.bit-tape i{width:5px;height:5px;border-radius:50%;display:block}.bit-filled{background:#d2d2cf}.bit-empty{border:1px solid #333}.token-glyph[aria-pressed=true] .bit-filled{background:var(--token-colour)}.glyph-key{font:9px/1.8 var(--mono);color:#999;margin:19px 0 0}.legend-controls .media-all-layers{margin-top:20px}.legend-picture{min-width:0;text-align:center}.legend-picture canvas{width:100%;height:auto;aspect-ratio:1;display:block;background:#000}.legend-selection{font:9px/1.8 var(--mono);color:#aaa;margin:14px 0 0}.legend-arrangement{font-size:12px;line-height:1.8;color:var(--muted);margin:22px 0 14px}.legend-rule{font-size:11px;line-height:1.8;color:var(--muted);max-width:700px}.legend-formula{font:10px/1.8 var(--mono);overflow-wrap:anywhere}.media-token-legend .token-legend{padding-bottom:0}.media-token-legend{min-width:0}.other-media+.other-media{margin-top:0;border-top:0}
@media(max-width:660px){.legend-stage{grid-template-columns:1fr;padding:25px 16px;gap:22px}.legend-controls{width:100%;max-width:380px;justify-self:center}.legend-picture{width:100%;max-width:350px;justify-self:center}.glyph-word{font-size:9px}.glyph-id{font-size:8px}.token-glyph{padding:10px 1px 13px}.legend-flow{font-size:8px;letter-spacing:0}.legend-intro{font-size:12px}.glyph-key{font-size:8px}.legend-selection{font-size:9px}.legend-arrangement{font-size:11px}}

/* The kept representations use the same square format as the passage. */
.legend-shared{font-size:12px;line-height:1.8;color:var(--muted);margin:0 0 22px}
.media-tabs{grid-template-columns:repeat(auto-fit,minmax(40px,1fr));gap:12px}
.media-account .media-panel .media-stage{aspect-ratio:1;min-height:0;width:100%;max-width:620px;margin-inline:auto;padding:0;overflow:hidden;color-scheme:only light;position:relative}
.media-account .media-stage svg{display:block;width:100%;height:100%;min-height:0;max-width:none}
.media-account .media-panel .media-binary{padding:12%;gap:20px}
.media-binary .byte-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px;max-width:370px}
.media-binary .byte-cell{font-size:clamp(10px,1.5vw,17px)}
.media-account .media-panel .media-image{background:#080808}
.media-account .media-panel .media-encoded-square{background:#080808;color:#e5e5e1;padding:9%;display:flex;flex-direction:column;gap:20px}
.media-encoded-square .token-statement{font:23px/1.4 Arial;margin:0 0 8px}
.media-encoded-square .token-glyphs{width:100%;gap:0;grid-template-columns:repeat(5,minmax(0,1fr))}
.media-encoded-square .token-glyph{padding:4px 0;gap:10px}
.media-encoded-square .token-glyph:hover{background:none}
.media-encoded-square .bit-tape{gap:3px;margin-top:3px}.media-encoded-square .bit-tape i{width:4px;height:4px}
.media-encoded-square .glyph-key{font-size:8px;margin:0}
@media(max-width:660px){.media-tabs{gap:7px}.media-tab{font-size:10px}.media-caption h3{font-size:16px}.legend-shared{font-size:11px}.media-account .media-panel .media-binary{gap:17px}.media-binary .byte-grid{gap:10px 22px}.media-account .media-panel .media-encoded-square{gap:13px}.media-encoded-square .token-statement{font-size:17px;margin:0 0 4px}.media-encoded-square .token-glyph{gap:8px}.media-encoded-square .bit-tape{gap:2px}.media-encoded-square .bit-tape i{width:3px;height:3px}.media-encoded-square .glyph-key{font-size:7px}}