.render-page { max-width: 1540px; margin: auto; }
.render-page .page-heading { margin-bottom: 28px; }
.render-original-link { font-size: 12px; }
.render-loading,.render-empty { padding: 90px 24px; text-align: center; border: 1px solid var(--line); background: var(--surface); }
.render-loading p,.render-empty>p { color: var(--muted); }
.render-loader { display:inline-block; width:23px; height:23px; border:1px solid #8e817155; border-top-color:var(--champagne); border-radius:50%; animation:render-spin .9s linear infinite; }
@keyframes render-spin { to { transform:rotate(360deg); } }
.render-empty>span { display:block; color:var(--champagne); margin-bottom:20px; }
.render-empty>span .icon { width:36px; height:36px; }
.render-empty h2 { font:36px/1.1 var(--serif); margin:14px 0; }
.render-empty>p:last-of-type { max-width:420px; margin:0 auto 24px; }
.render-collection-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }
.render-collections { display:flex; align-items:stretch; border-bottom:1px solid var(--line); gap:28px; }
.render-collections button { border:0; border-bottom:2px solid transparent; background:none; padding:0 0 12px; color:var(--muted); font-size:13px; }
.render-collections button[aria-selected="true"] { color:var(--ink); border-color:var(--champagne); }
.render-collections button span { font-size:10px; padding:3px 6px; margin-left:9px; background:#e8e3db; color:#796d5e; border-radius:2px; }
.render-private { display:flex; gap:7px; align-items:center; color:#817568; font-size:11px; white-space:nowrap; }
.render-private .icon { width:13px; height:13px; }
.render-theater { background:#191917; color:#f6f1e9; border-radius:3px; overflow:hidden; position:relative; }
.render-stage { position:relative; width:100%; aspect-ratio:16/9; min-height:310px; overflow:hidden; background:#1b1b19; }
.render-camera { position:absolute; inset:0; overflow:hidden; outline-offset:-5px; }
.render-vignette { position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,#0b0b0b55 0%,transparent 26%,transparent 60%,#080807b8 100%); }
.render-stage-top { position:absolute; inset:22px 25px auto; display:flex; align-items:center; justify-content:space-between; gap:12px; pointer-events:none; }
.render-mode { display:flex; align-items:center; gap:9px; font-size:10px; letter-spacing:1.7px; text-transform:uppercase; text-shadow:0 1px 5px #000a; }
.render-mode .icon { width:17px; height:17px; }
.render-glass-button { display:flex; align-items:center; gap:8px; background:#14141073; backdrop-filter:blur(12px); border:1px solid #fff5; color:#fffaf0; border-radius:2px; padding:9px 12px; font-size:10px; pointer-events:auto; }
.render-glass-button:hover { background:#141410bb; }
.render-glass-button .icon { width:15px; height:15px; }
.render-scene-caption { position:absolute; inset:auto 32px 27px; display:flex; justify-content:space-between; align-items:flex-end; gap:20px; pointer-events:none; }
.render-scene-number { font-size:9px; text-transform:uppercase; letter-spacing:2px; margin:0 0 9px; color:#e6d4be; }
.render-scene-caption h2 { font:40px/1.02 var(--serif); font-weight:400; margin:0 0 6px; color:#fffaf1; text-shadow:0 1px 14px #0004; }
.render-scene-subtitle { font-size:12px; margin:0; color:#eee6d9; }
.render-scene-arrows { display:flex; gap:8px; pointer-events:auto; }
.render-scene-arrows button { border:1px solid #fff7; width:38px; height:38px; display:grid; place-items:center; background:#16141055; color:#fff9ec; border-radius:50%; }
.render-scene-arrows button:hover { background:#b49c7c; border-color:#b49c7c; }
.render-scene-arrows button:first-child .icon { transform:rotate(180deg); }
.render-hotspots { position:absolute; inset:0; pointer-events:none; }
.render-hotspot { position:absolute; transform:translate(-50%,-50%); pointer-events:auto; background:#2b282279; backdrop-filter:blur(4px); border:1px solid #fff9; border-radius:50%; width:31px; height:31px; color:#fff8e8; display:grid; place-items:center; font-size:10px; box-shadow:0 0 0 5px #fff2; padding:0; }
.render-hotspot:hover,.render-hotspot:focus-visible { background:#ac8d68; }
.render-hotspot small { display:none; position:absolute; top:calc(100% + 10px); padding:7px 10px; background:#1a1916e8; font-size:11px; font-weight:400; width:max-content; max-width:160px; border:1px solid #d8c7ac55; }
.render-hotspot:hover small,.render-hotspot:focus-visible small { display:block; }
.render-point-panel { position:absolute; right:26px; top:79px; width:265px; padding:25px; color:#f4ede3; background:#1b1a16e8; border:1px solid #c4ac8766; backdrop-filter:blur(20px); box-shadow:0 16px 32px #0003; }
.render-point-panel>button { position:absolute; top:10px; right:10px; background:transparent; border:0; color:#dac9af; padding:4px; }
.render-point-panel>button .icon { width:15px; height:15px; }
.render-point-panel>span { color:#bfa688; font-size:8px; letter-spacing:2px; }
.render-point-panel h3 { font:27px/1.1 var(--serif); margin:12px 0; font-weight:400; }
.render-point-panel p { color:#d6cfc1; font-size:12px; line-height:1.65; margin:0; }
.render-scene-loading { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:12px; font-size:12px; color:#ebdfcd; background:#191917cc; pointer-events:none; }
.render-scene-error { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:28px; text-align:center; background:#1c1b18; }
.render-scene-error p { color:#e5d5c0; }
.render-theater [hidden] { display:none !important; }
.render-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 25px; border-bottom:1px solid #ffffff12; color:#d0c5b5; }
.render-gesture { display:flex; gap:8px; align-items:center; font-size:10px; color:#aea89d; }
.render-gesture .icon { width:15px; height:15px; }
.render-toolbar button { display:flex; align-items:center; justify-content:center; border:0; background:transparent; color:inherit; padding:7px; gap:7px; font-size:11px; border-radius:2px; }
.render-toolbar button:hover { background:#ffffff0d; color:#fff3dc; }
.render-toolbar button[aria-pressed="true"] { color:#d8b98d; }
.render-toolbar .icon { width:15px; height:15px; }
.render-camera-controls,.render-explore-controls { display:flex; align-items:center; gap:9px; }
.render-camera-controls>span { font-size:10px; min-width:36px; text-align:center; font-variant-numeric:tabular-nums; }
.render-camera-controls .render-control-divider { min-width:0; width:1px; height:18px; background:#ffffff20; margin:0 3px; }
.render-explore-controls>button:last-child { border-left:1px solid #ffffff20; padding-left:16px; margin-left:4px; }
.render-filmstrip { display:flex; gap:14px; padding:20px 25px 22px; overflow-x:auto; scrollbar-width:thin; scrollbar-color:#75664e #191917; }
.render-thumbnail { flex:1 0 116px; max-width:195px; min-width:0; text-align:left; color:#8f8a80; background:transparent; border:0; padding:0; }
.render-thumbnail>div { position:relative; aspect-ratio:16/9; border:1px solid #ffffff24; padding:3px; transition:border-color .18s; }
.render-thumbnail img { display:block; width:100%; height:100%; object-fit:cover; opacity:.6; transition:opacity .18s; }
.render-thumbnail>strong { display:block; font-size:10px; font-weight:400; margin:9px 2px 0; line-height:1.3; }
.render-thumbnail>div>span { position:absolute; left:8px; bottom:7px; color:#fffaec; font-size:9px; text-shadow:0 1px 3px #000; }
.render-thumbnail i { position:absolute; top:7px; right:7px; font-style:normal; font-size:8px; color:#211f1a; background:#e4d2b9; padding:2px 5px; }
.render-thumbnail.selected { color:#e8d3b4; }
.render-thumbnail.selected>div { border-color:#c2a47e; }
.render-thumbnail.selected img,.render-thumbnail:hover img { opacity:1; }
.render-thumbnail:hover>div { border-color:#9c8b73; }
.render-description { display:grid; grid-template-columns:1fr 1fr; gap:60px; margin:38px 0; }
.render-description .eyebrow { font-size:9px; letter-spacing:2px; margin:0 0 12px; color:#97836b; }
.render-description h2 { font:32px/1.12 var(--serif); margin:0 0 12px; }
.render-description [data-render-description] { max-width:500px; margin:0 0 18px; color:#767066; font-size:13px; line-height:1.7; }
.render-source { font-size:10px; color:#9b9080; }
.render-feature-list>button { width:100%; display:flex; align-items:center; gap:17px; padding:13px 0; text-align:left; background:transparent; border:0; border-bottom:1px solid var(--line); }
.render-feature-list>button:first-child { padding-top:0; }
.render-feature-list>button>span { font:20px var(--serif); color:var(--champagne); align-self:flex-start; }
.render-feature-list h3 { font-weight:400; font-size:12px; margin:0 0 3px; }
.render-feature-list p { margin:0; color:#80776b; font-size:11px; line-height:1.5; }
.render-feature-list .icon { flex-shrink:0; margin-left:auto; width:14px; color:#9b8261; }
.render-feature-list>button:hover h3 { color:#9b8261; }
.render-originals { border-top:1px solid var(--line); padding-top:28px; scroll-margin-top:30px; }
.render-originals>header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.render-originals h2 { font:28px var(--serif); margin:0 0 4px; }
.render-originals>header p { font-size:12px; margin:0; color:#82776a; }
.render-originals>header>.icon { width:24px; height:24px; color:#ac9577; }
.render-document-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.render-document-card { display:flex; align-items:center; gap:14px; padding:19px; border:1px solid var(--line); background:#ffffff2d; }
.render-pdf-icon { display:grid; place-items:center; width:34px; height:44px; border:1px solid #c2ae95; color:#a58a67; font-size:9px; letter-spacing:1px; flex-shrink:0; }
.render-document-card h3 { font-size:12px; font-weight:400; margin:0 0 5px; }
.render-document-card p { color:#8a7e6e; font-size:10px; margin:0; }
.render-document-actions { display:flex; flex-direction:column; align-items:flex-end; gap:9px; margin-left:auto; }
.render-document-actions a { display:flex; align-items:center; gap:6px; font-size:10px; color:#887051; }
.render-document-actions .icon { width:12px; height:12px; }
.render-fidelity-note { color:#91887d; font-size:10px; line-height:1.7; margin:20px 0 0; }
.render-assignment { margin-top:28px; padding-top:22px; border-top:1px solid var(--line); display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; }
.render-assignment label { display:flex; flex-direction:column; gap:8px; font-size:11px; color:#7d7161; }
.render-assignment select { min-width:240px; background:var(--surface); border:1px solid var(--line); padding:10px; font:12px var(--sans); color:var(--ink); }
.render-assignment p { flex-basis:100%; font-size:11px; margin:0; color:#80704f; }
.render-fullscreen-open { overflow:hidden; }
.render-theater:is(:fullscreen,.is-expanded) { display:flex; flex-direction:column; border-radius:0; width:100%; height:100dvh; padding:0; }
.render-theater.is-expanded { position:fixed; inset:0; z-index:1000; }
.render-theater:is(:fullscreen,.is-expanded) .render-stage { aspect-ratio:auto; flex:1; min-height:0; }
.render-theater:is(:fullscreen,.is-expanded) .render-filmstrip { flex-shrink:0; padding:14px 25px; max-height:140px; justify-content:center; }
.render-theater:is(:fullscreen,.is-expanded) .render-thumbnail { flex:0 0 140px; }
.render-theater:is(:fullscreen,.is-expanded) .render-toolbar { flex-shrink:0; }
@media (min-width:1600px) { .render-stage { max-height:740px; } }
@media (max-width:1100px) {
  .render-toolbar { padding:12px 16px; gap:10px; }
  .render-gesture { display:none; }
  .render-filmstrip { padding:16px; gap:11px; }
  .render-thumbnail { flex-basis:115px; }
  .render-document-card { flex-wrap:wrap; }
  .render-document-actions { flex-direction:row; flex-basis:100%; align-items:center; justify-content:flex-end; gap:16px; }
  .render-description { gap:30px; }
  .render-private { display:none; }
}
@media (max-width:650px) {
  .render-page .page-heading { gap:16px; }
  .render-original-link { padding:8px 11px; font-size:10px; min-height:34px; }
  .render-collection-bar { margin-bottom:13px; }
  .render-collections { gap:20px; width:100%; }
  .render-collections button { font-size:11px; padding-bottom:10px; }
  .render-collections button span { margin-left:5px; font-size:8px; }
  .render-stage { aspect-ratio:4/3; min-height:285px; }
  .render-stage-top { inset:14px 13px auto; }
  .render-mode { font-size:8px; letter-spacing:1px; gap:5px; }
  .render-mode .icon { width:13px; height:13px; }
  .render-glass-button { padding:7px; }
  .render-glass-button>span { display:none; }
  .render-scene-caption { inset:auto 17px 19px; gap:8px; }
  .render-scene-caption h2 { font-size:29px; }
  .render-scene-subtitle { font-size:10px; }
  .render-scene-number { font-size:7px; letter-spacing:1.5px; }
  .render-scene-arrows { gap:5px; }
  .render-scene-arrows button { width:29px; height:29px; }
  .render-scene-arrows .icon { width:14px; height:14px; }
  .render-toolbar { flex-wrap:wrap; justify-content:space-between; padding:10px; gap:5px; }
  .render-camera-controls,.render-explore-controls { gap:3px; }
  .render-camera-controls>span { min-width:30px; font-size:9px; }
  .render-toolbar button { padding:6px; font-size:9px; gap:5px; }
  .render-explore-controls>button:last-child { padding-left:8px; margin-left:2px; }
  .render-toolbar .icon { width:13px; height:13px; }
  .render-filmstrip { padding:13px; gap:10px; }
  .render-thumbnail { flex:0 0 110px; }
  .render-thumbnail>strong { font-size:9px; }
  .render-hotspot { width:25px; height:25px; font-size:8px; box-shadow:0 0 0 4px #fff2; }
  .render-point-panel { right:13px; top:57px; width:220px; padding:20px; }
  .render-point-panel h3 { font-size:24px; }
  .render-point-panel p { font-size:11px; }
  .render-description { grid-template-columns:1fr; gap:24px; margin:28px 0; }
  .render-description h2 { font-size:29px; }
  .render-document-grid { grid-template-columns:1fr; gap:10px; }
  .render-document-actions { flex-basis:auto; flex-direction:column; gap:8px; }
  .render-document-card { padding:16px; flex-wrap:nowrap; }
  .render-document-card h3 { font-size:11px; }
  .render-document-card p { font-size:9px; }
  .render-theater:is(:fullscreen,.is-expanded) .render-filmstrip { max-height:117px; justify-content:flex-start; padding:12px; }
  .render-theater:is(:fullscreen,.is-expanded) .render-thumbnail { flex-basis:112px; }
}
@media (prefers-reduced-motion:reduce) { .render-loader { animation:none; } .render-theater * { transition:none !important; } }

.render-original-link[hidden] { display:none; }
.render-theater:is(:fullscreen,.is-expanded) .render-stage { max-height:none; }
