/* Editorial HUD: paper is the world, controls are quiet marginal notes. */
:root{--paper:#e8e3d8;--ink:#30483f;--muted:#737b70}
header{top:29px;left:36px;right:36px;align-items:flex-start}
.brand{font:27px/1.12 Georgia,'Times New Roman',serif;letter-spacing:-.65px}
.brand span{display:block;font:9px/1.5 Arial,sans-serif;letter-spacing:2.8px;margin:11px 0 0;color:#6c7c71}
.header-actions{padding-top:3px;gap:18px;font-size:11px;letter-spacing:.35px}
.header-actions button{padding:9px 12px;border:1px solid #60725a2b;border-radius:4px;background:#faf7ed70}
.header-actions a{padding:9px 0;border-bottom:1px solid #60725a50}
.room-toolbar{right:30px;bottom:87px}
.room-toolbar button{background:#f9f5eadb;border-color:#77746138;border-radius:4px;box-shadow:0 2px 5px #5a513b07}
.bottom{left:30px;right:30px;bottom:16px}
#status{display:table;max-width:100%;margin:0 auto 9px;padding:8px 15px;font-size:10px;line-height:1.5;letter-spacing:.3px;color:#506153;background:#f9f6ecd9;border:1px solid #9b9b8126;border-radius:5px;text-shadow:none}
.bottom-line{font-size:8px;letter-spacing:1.8px;color:#6c7769}
#interact{bottom:111px;background:#344c40f5;border-radius:7px;font-size:12px;box-shadow:0 4px 17px #3e4b3120}
#room-canvas[data-loaded=true] canvas{animation:paper-reveal .75s ease-out both}
@keyframes paper-reveal{from{opacity:0}to{opacity:1}}
dialog{border-radius:8px;background:#f8f4e8;border:1px solid #b8b79c70;box-shadow:0 20px 90px #3945322b}
dialog h2{font-size:29px}.eyebrow{letter-spacing:2px}#detail-body article{border-color:#67795927}
#back-room{border-radius:5px}#detail-body img{border-radius:3px}
@media(max-width:700px){
 header{top:25px;left:21px;right:20px}.brand{font-size:24px}.brand span{display:block;font-size:8px;letter-spacing:2px;margin-top:10px}
 .header-actions{font-size:10px;padding-top:0}.header-actions button{padding:8px}.header-actions a{display:none}
 .bottom{left:14px;right:14px;bottom:12px}.bottom-line{font-size:6px;letter-spacing:1px}.bottom-line label{font-size:9px}
 #status{font-size:9px;padding:7px 9px;letter-spacing:0;max-width:90vw}
 .room-toolbar{right:19px;bottom:114px}#interact{bottom:177px;font-size:11px}
 #touch-pad{bottom:104px;left:21px}#touch-pad button{border-radius:4px;background:#fbf8edd9;border-color:#6d7a6440}
 dialog{border-radius:13px 13px 0 0}
}
@media(max-height:560px) and (min-width:701px){header{top:15px}.brand{font-size:21px}.brand span{margin-top:5px}.bottom{bottom:9px}.room-toolbar{bottom:66px}#interact{bottom:88px}}
@media(prefers-reduced-motion:reduce){#room-canvas canvas{animation:none}}