/* The reading room is a full-size working surface, with source text in HTML. */
body.reading-room-open { background:#d5ba85; }
.reading-room-open>.grain,.reading-room-open .masthead,.reading-room-open .foot,.reading-room-open .totop { display:none!important; }
.reading-room-open #main.wrap { margin:0; padding:0; max-width:none; min-height:100svh; }
.reading-room { --ri:#273429; --rm:#656a56; --rp:rgba(255,252,235,.87); --rl:rgba(54,65,41,.2); --ra:#49654e; position:relative; width:100%; min-height:100svh; color:var(--ri); background:#dbc599 url('assets/reading-oak.png') center/cover; isolation:isolate; }
.reading-room[data-light=night] { --ri:#f1e5c9; --rm:#bdb599; --rp:rgba(30,38,31,.88); --rl:rgba(233,224,193,.25); --ra:#bed3a2; }
.room-scene { position:absolute; inset:0; overflow:hidden; }
.room-scene canvas { display:block; width:100%; height:100%; touch-action:none; cursor:grab; }
.room-scene canvas:active { cursor:grabbing; }
.room-scene canvas.is-card { cursor:pointer; }
.room-header { position:relative; z-index:5; display:flex; justify-content:space-between; gap:20px; align-items:flex-start; padding:28px 38px; pointer-events:none; }
.room-header>* { pointer-events:auto; }
.room-brand { display:flex; flex-direction:column; color:var(--ri); text-shadow:0 1px 15px #fff4; }
.room-brand>b { font:500 29px/.95 var(--sans); letter-spacing:-.07em; }
.room-brand>b>span { font:400 .75rem var(--sans); vertical-align:top; margin-left:3px; }
.room-brand>span { font:.75rem var(--mono); text-transform:uppercase; letter-spacing:.09em; margin-top:9px; }
.room-header-right { display:flex; align-items:center; gap:12px; }
.room-saved,.room-menu>summary { display:flex; align-items:center; justify-content:center; gap:15px; min-height:43px; padding:10px 17px; border:1px solid var(--rl); border-radius:40px; font-size:.875rem; background:var(--rp); backdrop-filter:blur(18px); color:var(--ri); cursor:pointer; }
.room-saved>span { font:.75rem var(--mono); background:var(--ra); color:#fffbe9; border-radius:50%; padding:3px 6px; }
.room-menu { position:relative; }
.room-menu>summary { list-style:none; }
.room-menu>summary::-webkit-details-marker { display:none; }
.room-menu>nav { position:absolute; right:0; top:53px; width:240px; background:var(--rp); backdrop-filter:blur(25px); padding:14px; border:1px solid var(--rl); border-radius:15px; box-shadow:0 15px 50px #273b2833; }
.room-menu nav a { display:flex; justify-content:space-between; padding:10px; color:var(--ri); font-size:.875rem; border-radius:7px; }
.room-menu nav a:hover { background:var(--rl); }
.room-intro { position:relative; z-index:2; width:310px; padding:30px 0 25px; margin-left:38px; pointer-events:none; }
.room-intro>* { pointer-events:auto; }
.room-eyebrow { font:.75rem var(--mono); letter-spacing:.025em; margin-bottom:16px; color:var(--rm); }
.room-intro h1 { font:400 clamp(58px,6.1vw,90px)/.9 var(--display); letter-spacing:-.035em; margin:0; }
.room-intro h1 em { color:var(--ra); }
.room-intro>p { font-size:1rem; line-height:1.5; margin:20px 0 34px; color:var(--rm); }
#roomSearch { background:var(--rp); border:1px solid #fff6; border-radius:15px; padding:17px; backdrop-filter:blur(24px); box-shadow:0 14px 40px -28px #28362988; }
#roomSearch>label { display:block; font:.75rem var(--mono); margin-bottom:12px; color:var(--rm); }
.room-searchbox { display:flex; align-items:center; border-bottom:1px solid var(--rl); padding-bottom:10px; gap:5px; }
.room-searchbox input { width:100%; min-width:0; background:none; border:0; border-radius:0; outline:none; color:var(--ri); font-size:1rem; }
.room-searchbox input::placeholder { color:var(--rm); }
.room-searchbox button { width:30px; height:32px; flex-shrink:0; font-size:22px; color:var(--ra); }
.room-filters { display:flex; gap:9px; margin-top:13px; }
.room-filters label { min-width:0; flex:1; }
.room-filters select { font:.875rem var(--sans); color:var(--ri); background:transparent; width:100%; padding:4px 0; border:0; appearance:auto; }
.room-filters option { background:#fffcee; color:#263329; }
.room-search-help { font:.75rem/1.5 var(--sans); color:var(--rm); margin:10px 0 0; }
.room-result-meta { font:.75rem var(--mono); margin:19px 0 11px; color:var(--rm); }
.room-page-controls { display:flex; align-items:center; gap:14px; font:.75rem var(--mono); }
.room-page-controls button { width:33px; height:33px; display:grid; place-items:center; border:1px solid var(--rl); border-radius:50%; font-size:16px; background:var(--rp); }
.reading-room button:disabled { opacity:.38; cursor:default; }
.room-instruments { position:relative; z-index:2; display:flex; align-items:center; justify-content:center; gap:12px; padding:15px 25px; flex-wrap:wrap; }
.room-layout,.room-tool-row { display:flex; align-items:center; padding:5px; background:var(--rp); border:1px solid var(--rl); border-radius:40px; backdrop-filter:blur(20px); box-shadow:0 10px 30px -20px #16231377; }
.room-layout button,.room-tool-row button { color:var(--ri); min-height:36px; padding:8px 13px; border-radius:30px; font-size:.875rem; white-space:nowrap; }
.room-layout button[aria-pressed=true],#roomLens[aria-pressed=true] { background:var(--ra); color:#fffeee; }
.room-hover { position:absolute; z-index:4; pointer-events:none; max-width:280px; padding:11px 15px; background:var(--rp); border:1px solid var(--rl); border-radius:8px; color:var(--ri); font-size:.875rem; transform:translate(-50%,-120%); box-shadow:0 10px 30px #0001; }
.room-hover:empty { display:none; }
.room-lens-note { position:absolute; bottom:185px; right:38px; width:270px; z-index:3; border:1px solid var(--rl); border-radius:14px; background:var(--rp); backdrop-filter:blur(15px); padding:18px; }
.room-lens-note>span { font:.75rem var(--mono); color:var(--rm); text-transform:uppercase; }
.room-lens-note strong { display:block; margin:10px 0 15px; font:400 25px/1.15 var(--display); }
.room-lens-note button { font-size:.875rem; color:var(--ra); }
.room-folio { position:relative; z-index:2; margin:20px 38px 0; }
.room-folio-head { display:flex; justify-content:space-between; gap:15px; font:.75rem var(--mono); color:var(--rm); border-top:1px solid var(--rl); padding:13px 0; }
.room-folio-head button { font-size:.875rem; color:var(--ri); }
.room-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; padding:6px 0 24px; }
.room-card { text-align:left; background:var(--rp); border:1px solid var(--rl); border-top:3px solid var(--ra); color:var(--ri); padding:18px; border-radius:4px; transition:transform .2s; box-shadow:0 12px 25px -20px #15261499; }
.room-card:hover { transform:translateY(-5px); }
.room-card>span { display:flex; justify-content:space-between; gap:10px; font:.75rem var(--mono); color:var(--rm); }
.room-card strong { display:block; margin:15px 0 12px; font:400 24px/1.1 var(--display); overflow-wrap:anywhere; }
.room-card small { color:var(--rm); font-size:.875rem; }
.room-footer { display:flex; justify-content:space-between; gap:24px; position:relative; z-index:2; padding:18px 38px 24px; color:var(--rm); font:.75rem/1.6 var(--mono); }
.room-empty { position:absolute; left:45%; top:38%; z-index:2; padding:30px; border-radius:15px; background:var(--rp); max-width:350px; border:1px solid var(--rl); }
.room-empty h2 { font:400 32px/1.1 var(--display); margin:0 0 15px; }
.room-empty p { line-height:1.6; margin:0 0 20px; font-size:1rem; }
.room-empty button { color:var(--ra); }
.reading-room [hidden] { display:none!important; }
.reading-room :focus-visible { outline:2px solid var(--ra); outline-offset:4px; }
.has-table { height:100svh; min-height:790px; background:none; }
.has-table .room-intro { position:absolute; left:0; top:110px; padding-top:20px; }
.has-table .room-instruments { position:absolute; bottom:105px; left:340px; right:25px; padding:0; }
.has-table .room-folio { position:absolute; bottom:48px; left:0; right:0; }
.has-table .room-cards { position:absolute; bottom:45px; left:0; right:0; max-height:56svh; overflow:auto; border:1px solid var(--rl); padding:20px; background:var(--rp); backdrop-filter:blur(28px); border-radius:15px; }
.has-table .room-footer { position:absolute; bottom:0; left:0; right:0; }
.room-reader { --paper:#fcfaf2; --surface:#fffdf7; --ink:#242d26; --ink-2:#475147; --ink-3:#697061; --line:#dfdfd2; --line-2:#c5cbbb; --accent:#46614b; color:var(--ink); background:var(--paper); border:1px solid #c2c9b3; padding:0; width:min(820px,calc(100vw - 40px)); max-height:calc(100svh - 50px); border-radius:9px; box-shadow:0 35px 120px #111b1777; overflow:hidden; }
.room-reader::backdrop { background:rgba(28,38,26,.45); backdrop-filter:blur(7px); }
.room-reader[open] { display:flex; flex-direction:column; animation:room-reader-in .28s ease-out; }
@keyframes room-reader-in { from { opacity:0; transform:translateY(25px) rotate(-1deg); } to { opacity:1; transform:none; } }
.room-reader-bar { display:flex; justify-content:space-between; align-items:center; padding:17px 27px; border-bottom:1px solid var(--line); flex-shrink:0; font:.75rem var(--mono); }
.room-reader-bar button { font-size:.875rem; color:var(--ink); padding:6px; }
.room-reader-scroll { overflow:auto; padding:34px; scrollbar-width:thin; }
.room-reader-heading>span,.room-source-label { font:.75rem var(--mono); color:var(--ink-3); }
.room-reader-heading h2 { font:400 clamp(32px,4vw,50px)/1.06 var(--display); margin:18px 0 25px; overflow-wrap:anywhere; }
.room-reader-actions { display:flex; align-items:center; gap:20px; flex-wrap:wrap; font-size:.875rem; }
.room-reader-actions button { padding:11px 16px; border-radius:25px; color:#fffef1; background:var(--accent); font-size:.875rem; }
.room-reader-actions a { color:var(--accent); }
.room-reader-status { min-height:20px; font:.75rem/1.5 var(--mono); color:var(--accent); margin:15px 0 20px; }
.room-source-label { padding:16px 0; border-top:1px solid var(--line); }
.room-index-excerpt { padding:22px; background:#f0f0e5; border-left:2px solid var(--accent); }
.room-index-excerpt>span { font:.75rem var(--mono); color:var(--ink-3); }
.room-index-excerpt p { white-space:pre-wrap; font-size:1rem; line-height:1.7; margin:15px 0 0; }
.room-load { font-size:.875rem; line-height:1.7; color:var(--ink-3); margin:22px 0; }
.room-reader .msg { box-shadow:none; background:transparent; border:0; padding:16px 0; }
.room-reader .msg-body { font-size:1rem; line-height:1.8; }
.room-reader .msg-head { flex-wrap:wrap; }
.room-thread summary { cursor:pointer; font-size:.875rem; padding:20px 0; border-top:1px solid var(--line); color:var(--accent); }
@media(max-width:1100px) { .room-intro { width:265px; margin-left:28px; } .room-intro h1 { font-size:68px; } .room-header { padding:25px 28px; } .has-table .room-instruments { left:295px; gap:8px; flex-direction:column; } .room-layout button,.room-tool-row button { padding:8px 10px; } .room-footer { font-family:var(--sans); } }
@media(max-width:720px) { .has-table { min-height:1040px; height:100svh; } .room-header { padding:23px 20px; } .room-header-right { gap:7px; } .room-saved,.room-menu>summary { padding:9px 12px; } .room-brand>b { font-size:25px; } .room-brand>span { font-size:.65rem; } .room-intro,.has-table .room-intro { position:relative; top:auto; width:auto; margin:12px 20px 0; padding:0; } .room-intro h1 { font-size:54px; line-height:.94; } .room-intro h1 br { display:none; } .room-eyebrow { margin-bottom:12px; } .room-intro>p { margin:13px 0 22px; } #roomSearch { max-width:none; padding:14px; } .room-search-help { margin-top:6px; } .room-result-meta { margin:12px 0; } .room-page-controls { position:absolute; bottom:-1px; right:0; } .has-table .room-instruments { left:10px; right:10px; bottom:135px; } .room-footer { padding:14px 20px; flex-direction:column; gap:4px; } .has-table .room-folio { bottom:63px; } .room-folio { margin:15px 20px 0; } .room-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } .room-card { padding:14px; } .room-card>span { flex-direction:column; gap:5px; } .room-lens-note { right:20px; bottom:255px; width:235px; padding:14px; } .room-empty { left:20px; right:20px; top:50%; } .room-reader { width:calc(100vw - 20px); max-height:calc(100svh - 20px); } .room-reader-scroll { padding:23px; } .room-reader-bar { padding:13px 20px; } }
@media(max-width:390px) { .room-brand>span { display:none; } .room-header-right { font-size:.75rem; } .room-cards { grid-template-columns:1fr; } .room-tool-row button { font-size:.8rem; padding:8px; } }
@media(prefers-reduced-motion:reduce) { .room-reader[open] { animation:none; } .room-card { transition:none; } }

/* Optical controls float above the physical table. Text remains native, selectable HTML. */
.reading-room { --glass-line:rgba(255,255,255,.62); --glass-shadow:0 12px 30px -18px #15251d55,0 2px 5px #15251d0c; }
.reading-room[data-light=night] { --glass-line:rgba(236,249,238,.29); --glass-shadow:0 14px 35px -15px #0007,0 2px 6px #0002; }
.reading-room :is(.room-saved,.room-menu>summary,#roomSearch,.room-layout,.room-tool-row,.room-lens-note,.room-page-controls button) {
  background:linear-gradient(145deg,#ffffffe0,#f4f5e4ad);
  border:1px solid var(--glass-line);
  box-shadow:var(--glass-shadow),inset 0 1px 0 #fff7,inset 0 -1px 0 #687e5620;
  -webkit-backdrop-filter:blur(18px) saturate(1.45);
  backdrop-filter:blur(18px) saturate(1.45);
}
.reading-room[data-light=night] :is(.room-saved,.room-menu>summary,#roomSearch,.room-layout,.room-tool-row,.room-lens-note,.room-page-controls button) { background:linear-gradient(145deg,#34483dd9,#182e25c7); box-shadow:var(--glass-shadow),inset 0 1px 0 #fff2; }
.reading-room.glass-optics :is(.room-saved,.room-menu>summary) { background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none; border-color:#ffffff30; box-shadow:0 10px 28px -20px #12291e40; }
#roomSearch { border-radius:26px; padding:20px; }
.room-lens-note { border-radius:24px; }
.room-layout,.room-tool-row { gap:2px; padding:5px; }
.room-layout { position:relative; isolation:isolate; }
.room-layout button { position:relative; z-index:1; transition:color .18s; }
.room-layout .room-glass-selection { position:absolute; z-index:0; left:0; top:5px; height:calc(100% - 10px); border-radius:30px; background:#ffffff87; border:1px solid #ffffffa8; box-shadow:0 2px 8px #1a322425,inset 0 1px 0 #fff9; pointer-events:none; }
.reading-room:not(.has-table) .room-glass-selection { display:none; }
.has-table .room-layout button[aria-pressed=true] { background:transparent; color:var(--ri); text-shadow:0 0 .35px currentColor; }
.glass-optics .room-glass-selection { background:#ffffff87; border-color:#ffffffa8; }
.reading-room[data-light=night] .room-glass-selection { background:#cfe3d521; border-color:#e0f0dc44; }
#roomLens[aria-pressed=true] { background:#315d4130; color:var(--ri); box-shadow:inset 0 1px 0 #fff4; }
.reading-room[data-light=night] #roomLens[aria-pressed=true] { background:#c9e9c227; }
.room-tool-row button:active,.room-layout button:active { transform:scale(.96); }
.room-menu>nav { border-radius:26px; padding:12px; max-height:calc(100svh - 110px); overflow:auto; overscroll-behavior:contain; background:rgba(249,250,238,.94); -webkit-backdrop-filter:blur(25px); backdrop-filter:blur(25px); border-color:var(--glass-line); box-shadow:0 20px 65px -20px #14241e66,inset 0 1px 0 #fff9; }
.reading-room[data-light=night] .room-menu>nav { background:rgba(30,45,36,.96); }
.room-menu nav a { border-radius:13px; padding:10px 12px; }
.room-material { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; border-top:1px solid var(--rl); margin-top:8px; padding:17px 10px 8px; color:var(--ri); text-align:left; font-size:.875rem; }
.room-material small { display:block; margin-top:5px; font-size:.75rem; color:var(--rm); }
.room-material-switch { width:34px; height:21px; border-radius:20px; background:#64796344; flex-shrink:0; padding:3px; }
.room-material-switch::after { content:''; display:block; width:15px; height:15px; border-radius:50%; background:#fffcf2; box-shadow:0 1px 4px #0003; transition:transform .2s; }
.room-material[aria-pressed=true] .room-material-switch { background:#4b7559; }
.room-material[aria-pressed=true] .room-material-switch::after { transform:translateX(13px); }
.reading-room[data-material=solid] :is(.room-saved,.room-menu>summary,.room-menu>nav,#roomSearch,.room-layout,.room-tool-row,.room-lens-note,.room-page-controls button) { background:#faf9ef; -webkit-backdrop-filter:none; backdrop-filter:none; border-color:#798773; }
.reading-room[data-material=solid][data-light=night] :is(.room-saved,.room-menu>summary,.room-menu>nav,#roomSearch,.room-layout,.room-tool-row,.room-lens-note,.room-page-controls button) { background:#20382d; border-color:#8ca88e; }
@media(max-width:720px) { #roomSearch { padding:16px; } .room-layout,.room-tool-row { gap:0; } }
@media(prefers-reduced-transparency:reduce) {
  .reading-room :is(.room-saved,.room-menu>summary,.room-menu>nav,#roomSearch,.room-layout,.room-tool-row,.room-lens-note,.room-page-controls button) { background:#faf9ef; -webkit-backdrop-filter:none; backdrop-filter:none; border-color:#798773; }
  .reading-room[data-light=night] :is(.room-saved,.room-menu>summary,.room-menu>nav,#roomSearch,.room-layout,.room-tool-row,.room-lens-note,.room-page-controls button) { background:#20382d; border-color:#8ca88e; }
}
@media(forced-colors:active) {
  .reading-room :is(.room-saved,.room-menu>summary,.room-menu>nav,#roomSearch,.room-layout,.room-tool-row,.room-lens-note,.room-page-controls button) { background:Canvas; color:CanvasText; border-color:ButtonText; -webkit-backdrop-filter:none; backdrop-filter:none; }
  .room-layout button[aria-pressed=true],#roomLens[aria-pressed=true] { background:Highlight; color:HighlightText; }
}
@media(prefers-reduced-motion:reduce) { .room-layout button,.room-material-switch::after { transition:none; } .room-tool-row button:active,.room-layout button:active { transform:none; } }

/* The same projected paper becomes the readable correspondence surface. */
.room-reader.paper-reader { height:min(900px,calc(100svh - 32px)); background:var(--surface); border-radius:18px; border:1px solid #ccd5d0; transform-origin:0 0; isolation:isolate; }
.room-reader.paper-reader[open] { animation:none; }
.room-reader.paper-reader::backdrop { background:rgb(16 28 24 / calc(.36 * var(--paper-backdrop,1))); -webkit-backdrop-filter:blur(calc(4px * var(--paper-backdrop,1))); backdrop-filter:blur(calc(4px * var(--paper-backdrop,1))); }
.room-reader.paper-reader.paper-in-flight { will-change:transform; }
.room-reader.paper-reader>.paper-mirror { position:absolute; inset:0; width:100%; height:100%; z-index:8; pointer-events:none; border-radius:inherit; }
.room-reader.paper-reader>.room-reader-scroll,.room-reader.paper-reader>.room-reader-bar { opacity:var(--paper-content,1); }
.room-reader.paper-reader>.room-reader-bar { position:absolute; left:14px; right:14px; top:14px; z-index:5; border-radius:22px; padding:8px 14px; border:1px solid #ffffffa3; background:rgba(255,255,255,.2); -webkit-backdrop-filter:blur(18px) saturate(1.3); backdrop-filter:blur(18px) saturate(1.3); box-shadow:0 8px 25px -14px #1b392a55,inset 0 1px #fffc; }
.room-reader.paper-reader>.room-reader-bar button { background:#ffffff26; border:1px solid #ffffff80; }
.room-reader.paper-reader>.room-reader-scroll { padding-top:var(--paper-toolbar-clearance,112px); width:100%; height:100%; max-height:100%; }
.reading-room.is-reading .room-hover,.reading-room.is-reading .room-lens-note { visibility:hidden; }
[data-material=solid] .room-reader.paper-reader>.room-reader-bar { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; border-color:#b9c7bc; }
@media(max-width:760px) { .room-reader.paper-reader { height:calc(100svh - 16px); border-radius:20px; } .room-reader.paper-reader>.room-reader-bar { left:10px; right:10px; top:10px; padding:8px; gap:6px; border-radius:18px; } .room-reader.paper-reader>.room-reader-scroll { padding-top:var(--paper-toolbar-clearance,116px); } }
@media(prefers-reduced-motion:reduce) { .room-reader.paper-reader { will-change:auto; } }
@media(forced-colors:active) { .room-reader.paper-reader>.room-reader-bar { background:Canvas; border:1px solid CanvasText; } }

[data-theme=dark] .room-reader.paper-reader>.room-reader-bar { background:rgba(25,35,32,.36); border-color:#cce5d438; box-shadow:0 8px 25px -14px #0009,inset 0 1px #ffffff26; }
.room-reader.paper-reader>.room-reader-bar.interface-glass { -webkit-backdrop-filter:var(--interface-filter,blur(8px) saturate(1.2)); backdrop-filter:var(--interface-filter,blur(8px) saturate(1.2)); }
