.transparency-page{--film-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20176%20100%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cmask%20id%3D%22m%22%3E%3Crect%20width%3D%22176%22%20height%3D%22100%22%20fill%3D%22white%22%2F%3E%3Cg%20fill%3D%22black%22%3E%3Crect%20x%3D%226%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%226%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2217%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2217%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2228%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2228%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2239%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2239%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2250%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2250%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2261%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2261%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2272%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2272%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2283%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2283%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2294%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2294%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22105%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22105%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22116%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22116%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22127%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22127%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22138%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22138%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22149%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22149%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22160%22%20y%3D%223%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%22160%22%20y%3D%2292%22%20width%3D%225%22%20height%3D%225%22%20rx%3D%221%22%2F%3E%3C%2Fg%3E%3C%2Fmask%3E%3C%2Fdefs%3E%3Crect%20width%3D%22176%22%20height%3D%22100%22%20fill%3D%22white%22%20mask%3D%22url%28%23m%29%22%2F%3E%3C%2Fsvg%3E")}

/* Independent material study: no photograph files or accepted layouts changed. */
.transparency-page .light-table-trial{background:radial-gradient(ellipse at 50% 47%,#292722 0%,#141413 35%,#070808 76%);transition:background-color 1s}
.transparency-page .table-heading{padding-top:76px;padding-bottom:6px}
.transparency-page .table-perspective{width:min(100%,820px);padding:19px 0 23px;perspective:1600px}
.transparency-page .light-pad{isolation:isolate;padding:23px 25px 30px;border-radius:5px;border:1px solid #f6f5ec;background:#fafaf6;transform:rotateX(14deg) rotateZ(-2deg);box-shadow:0 0 2px 1px #fffff4,0 0 12px 3px #ffffef7a,0 0 38px 7px #f7f0d142,0 0 85px 20px #e8dfc51f,0 4px 1px #4c4c45,0 18px 25px #000b;transition:background-color 1.25s,border-color 1.25s,box-shadow 1.25s,transform 1s cubic-bezier(.22,1,.36,1)}
.transparency-page .light-pad::before{inset:-70px;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#fffee631,transparent 70%);opacity:1;transition:opacity 1.25s}
.transparency-page .light-pad::after{content:"";position:absolute;inset:0;border-radius:4px;pointer-events:none;box-shadow:inset 0 0 14px #fffbdf70}
.transparency-page .contact-sheet{gap:17px 19px;position:relative;z-index:2}
.transparency-page .table-print{padding:15px 6px 16px;aspect-ratio:auto;display:block;isolation:isolate;transform-style:preserve-3d;filter:none;transition:transform .85s cubic-bezier(.22,1,.36,1),filter .85s;--angle:-1.2deg}
.transparency-page .table-print::before{content:"";position:absolute;inset:0;background:linear-gradient(112deg,#35261e,#130f0c 37%,#241b14 85%,#48352a);z-index:-1;mask-image:var(--film-mask);mask-size:100% 100%;mask-repeat:no-repeat;border-radius:1px}
.transparency-page .table-print::after{content:"";position:absolute;inset:1px;pointer-events:none;border-top:1px solid #fff3;border-left:1px solid #fff2;border-bottom:1px solid #000c;background:linear-gradient(115deg,#ffffff0c,transparent 24%,transparent 72%,#ffffff08);opacity:.75}
.transparency-page .film-window{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;position:relative;background:#fff;box-shadow:inset 0 0 1px 1px #000b;transition:background-color 1.25s;overflow:hidden}
.transparency-page .table-print img{display:block;border:0;border-radius:0;box-shadow:none;max-width:100%;max-height:100%;width:auto;height:auto;mix-blend-mode:multiply;flex:0 1 auto}
.transparency-page .table-print figcaption{bottom:3px;left:8px;font:6px/1 var(--sans);color:#ffffff8a;letter-spacing:.15em;z-index:3}
.transparency-page .print-2{--angle:1deg}.transparency-page .print-3{--angle:-.6deg}.transparency-page .print-4{--angle:1.3deg}.transparency-page .print-5{--angle:-1deg}.transparency-page .print-6{--angle:.7deg}
.transparency-page .pad-inscription{color:#44443b99;bottom:9px;font-size:6px}
.transparency-page .table-story{padding-top:5px}
.transparency-page .table-story h2{margin-bottom:8px}
.transparency-page .table-quote{margin-bottom:6px}
.transparency-page .table-footer{padding-top:3px;padding-bottom:15px}
.backlight-switch{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:none;border:0;padding:6px 12px;margin:0 0 7px;cursor:pointer;color:#ffffff9c;font:10px/1.2 var(--sans);letter-spacing:.09em}
.backlight-dot{width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 7px 2px #fff5;transition:opacity 1s,box-shadow 1s}
.backlight-switch:focus-visible{outline:1px solid #aaa;outline-offset:3px}
.transparency-page .table-controls button{padding-top:5px;padding-bottom:5px}
.transparency-page .table-hint{margin:5px 0 7px}
.transparency-page .empty-pad{background:#f3f2e8;aspect-ratio:2.1}
.waiting-film{position:relative;width:44%;aspect-ratio:4/3;background:linear-gradient(130deg,#5b4631bc,#33271ec9);border:13px solid #201811;box-sizing:border-box;transform:rotate(-5deg);box-shadow:1px 3px 4px #0005;transition:background-color 1.25s}
.waiting-film::after{content:"";position:absolute;inset:0;border-top:1px solid #ffffff29;pointer-events:none}
.waiting-film span{position:absolute;left:0;right:0;top:40%;font:italic 29px/1 var(--serif);color:#ffffff59}
.transparency-page.light-off .light-pad{background:#1d1e1c;border-color:#363730;box-shadow:0 1px 0 #ffffff17,0 4px 1px #050505,0 20px 28px #000b}
.transparency-page.light-off .light-pad::before{opacity:0}
.transparency-page.light-off .light-pad::after{box-shadow:inset 0 0 15px #0005}
.transparency-page.light-off .film-window{background:#252b2b}
.transparency-page.light-off .backlight-dot{opacity:.25;box-shadow:none}
.transparency-page.light-off .pad-inscription{color:#ffffff40}
.transparency-page.light-off .waiting-film{background:#211b15}
@media(hover:hover) and (pointer:fine){.transparency-page .contact-sheet:hover .table-print{transform:translateY(-2px) rotate(var(--angle))}.transparency-page .contact-sheet .table-print:hover{transform:translateY(-10px) rotate(0deg) rotateX(5deg) scale(1.025);filter:none;z-index:5}.transparency-page .table-print:hover img{box-shadow:none}.transparency-page .table-perspective:has(.contact-sheet:hover) .light-pad{transform:rotateX(12deg) rotateZ(-1.5deg)}}
@media(min-width:601px){.transparency-page .table-perspective{max-width:min(820px,calc((100svh - 380px)*1.9))}}
@media(max-width:600px){.transparency-page .table-heading{padding-top:72px}.transparency-page .table-heading h1{font-size:30px}.transparency-page .table-perspective{width:100%;max-width:min(100%,calc((100svh - 425px)*.76));padding:16px 0 21px}.transparency-page .light-pad{padding:14px 15px 24px;transform:rotateX(9deg) rotateZ(-2deg)}.transparency-page .contact-sheet{gap:11px 13px}.transparency-page .table-print{padding:12px 4px 13px}.transparency-page .table-print figcaption{font-size:5px;bottom:3px;left:5px}.transparency-page .pad-inscription{font-size:5px;bottom:7px}.transparency-page .table-story h2{font-size:26px}.transparency-page .table-date{font-size:8px;margin-bottom:6px}.transparency-page .table-read{font-size:13px;padding:4px 10px}.transparency-page .table-quote{font-size:12px}.transparency-page .table-footer{padding-bottom:13px}.transparency-page .table-hint{font-size:10px}.transparency-page .table-compare a{font-size:10px}.transparency-page .table-compare{gap:20px}.transparency-page .empty-pad{aspect-ratio:.84}.waiting-film{width:70%;border-width:9px}.backlight-switch{font-size:9px;margin-bottom:5px;padding-top:4px;padding-bottom:4px}}
@media(max-width:600px) and (max-height:680px){.transparency-page .table-heading{padding-top:64px}.transparency-page .table-heading h1{font-size:26px}.transparency-page .table-perspective{max-width:min(100%,calc((100svh - 330px)*.7))}.transparency-page .table-story h2{font-size:23px}.transparency-page .table-heading .table-kicker{margin-bottom:6px}.transparency-page .table-footer{padding-bottom:6px}.transparency-page .table-quote{margin-bottom:2px}}
@media(prefers-reduced-motion:reduce){.transparency-page *,.transparency-page *::before,.transparency-page *::after{animation:none!important;transition:none!important}}


@media(max-width:600px){.transparency-page .table-perspective{max-width:min(100%,calc((100svh - 425px)*.67))}}
@media(max-width:600px) and (max-height:680px){.transparency-page .table-perspective{max-width:min(100%,calc((100svh - 330px)*.63))}}

/* Portrait exposures occupy the same frame; the image turns inside the film. */
.transparency-page .print-4{width:auto;justify-self:stretch}
.transparency-page .print-4 .film-window{aspect-ratio:4/3}
.transparency-page .print-4 img{position:absolute;left:50%;top:50%;width:75%;height:133.333333%;max-width:none;max-height:none;object-fit:contain;transform:translate(-50%,-50%) rotate(90deg)}
/* A colour-derived bloom adds light to the image highlights, not an opaque veil. */
.transparency-page .table-print img{filter:brightness(1.22) contrast(1.06) saturate(1.1);transition:filter 1.25s ease}
.transparency-page .film-window::after{content:"";position:absolute;inset:0;background-image:var(--film-image);background-size:100% 100%;background-position:center;filter:blur(5px) brightness(1.8);mix-blend-mode:screen;opacity:.21;pointer-events:none;transition:opacity 1.25s ease}
.transparency-page .print-4 .film-window::after{inset:auto;left:50%;top:50%;width:75%;height:133.333333%;transform:translate(-50%,-50%) rotate(90deg)}
.transparency-page.light-off .table-print img{filter:brightness(1) contrast(1) saturate(1)}
.transparency-page.light-off .film-window::after{opacity:0}

/* The chosen direction: a luminous pad, broad room spill and film-edge transmission. */
.transparency-page .light-table-trial{position:relative;background:#080909}
.transparency-page .light-table-trial::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 65% 43% at 50% 40%,rgba(229,233,219,.29) 0%,rgba(221,228,213,.16) 39%,rgba(205,215,200,.055) 72%,transparent 100%);opacity:1;transition:opacity 1.25s ease}
.transparency-page .light-pad{background:#fffffc;border-color:#fffffc;box-shadow:0 0 3px 1px #fffffc,0 0 18px 5px #ffffedaa,0 0 55px 14px #f8ffe45c,0 0 125px 38px #f3fae438,0 0 210px 65px #e7f0da17,0 4px 1px #575b50,0 19px 27px #0009}
.transparency-page .light-pad::before{inset:-110px;background:radial-gradient(ellipse,#f8ffe54d 0%,#edf6e11f 38%,transparent 72%)}
.transparency-page .light-pad::after{box-shadow:inset 0 0 15px #ffffe8a3}
.transparency-page .film-window{box-shadow:inset 0 0 1px 1px #0008,0 0 5px #fbffe52e}
.transparency-page .film-window::after{opacity:.26;filter:blur(5px) brightness(1.95)}
.film-aura{position:absolute;inset:5px -3px 6px;z-index:2;pointer-events:none;background-image:var(--film-image);background-size:100% 100%;filter:blur(8px) brightness(1.9);mix-blend-mode:screen;opacity:.23;mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-size:100% 100%,calc(100% - 22px) calc(100% - 24px);mask-position:center;mask-repeat:no-repeat;mask-composite:exclude;transition:opacity 1.25s ease}
.transparency-page .print-4 .film-aura{inset:auto;left:50%;top:50%;width:75%;height:133.333333%;transform:translate(-50%,-50%) rotate(90deg)}
.transparency-page.light-off .light-table-trial::before,.transparency-page.light-off .film-aura{opacity:0}
.transparency-page.light-off .film-window{box-shadow:inset 0 0 1px 1px #000b}
@media(prefers-reduced-motion:reduce){.transparency-page .light-table-trial::before,.film-aura{transition:none!important}}

/* Clip neighbouring stories horizontally while allowing illumination to spill vertically. */
.transparency-page .table-viewport{overflow:visible;clip-path:inset(-100vh 0)}


/* Layout, material compositing, and movement each have their own element. */
.film-slot{position:relative;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;perspective:none}
.film-motion{position:relative;width:100%;min-width:0;transform-origin:50% 50%;transform:perspective(1100px) translate3d(0,0,0) rotateX(0deg) rotateY(0deg);transition:transform .7s cubic-bezier(.22,1,.36,1)}
.transparency-page .film-motion .table-print{width:100%;transform-origin:50% 50%;transform:rotate(var(--angle,0deg));will-change:auto}
/* Disable the older scale and whole-pad hover motion on this selected page. */
.transparency-page .contact-sheet:hover .table-print,
.transparency-page .contact-sheet .table-print:hover{transform:rotate(var(--angle,0deg));filter:none}
.transparency-page .table-perspective:has(.contact-sheet:hover) .light-pad{transform:rotateX(14deg) rotateZ(-2deg)}
@media(max-width:600px){.transparency-page .table-perspective:has(.contact-sheet:hover) .light-pad{transform:rotateX(9deg) rotateZ(-2deg)}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .film-slot.is-tilting{z-index:6}
  .film-slot.is-tilting .film-motion{transform:perspective(1100px) translate3d(0,-10px,0) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .24s cubic-bezier(.2,.7,.3,1)}
}
@media(prefers-reduced-motion:reduce){.film-motion{transform:none!important;transition:none!important}.transparency-page .table-perspective:has(.contact-sheet:hover) .light-pad{transform:none}}

/* Contact with the illuminated surface casts no shadow. A lifted film casts a soft one. */
.film-slot::before{content:"";position:absolute;inset:3px;z-index:0;pointer-events:none;background:#000;filter:blur(5px);transform:translateY(3px);opacity:0;transition:opacity .7s cubic-bezier(.22,1,.36,1)}
.film-motion{z-index:1}
.transparency-page .film-window{box-shadow:0 0 5px #fbffe52e}
.transparency-page.light-off .film-window,.transparency-page .waiting-film{box-shadow:none}
/* Keep the glow footprint horizontal; rotate only the source image within it. */
.transparency-page .film-aura{background-image:none}
.transparency-page .film-aura::before{content:"";position:absolute;inset:0;background-image:var(--film-image);background-size:100% 100%;background-position:center}
.transparency-page .print-4 .film-aura{inset:5px -3px 6px;left:-3px;top:5px;width:auto;height:auto;transform:none}
.transparency-page .print-4 .film-aura::before{inset:auto;left:50%;top:50%;width:75%;height:133.333333%;transform:translate(-50%,-50%) rotate(90deg)}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.film-slot.is-tilting::before{opacity:.18}}
@media(prefers-reduced-motion:reduce){.film-slot::before{transition:none}}

/* Size the aperture and perforation clearance in the same frame coordinate system. */
.transparency-page .film-motion .table-print{padding:0;aspect-ratio:80/69}
.transparency-page .film-motion .table-print::before{background:#15110e}
.transparency-page .film-motion .film-window{position:absolute;inset:10% 4%;width:auto;height:auto;min-width:0;min-height:0;aspect-ratio:4/3;display:block;isolation:isolate;overflow:hidden;clip-path:inset(0)}
.transparency-page .film-motion .film-window img{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;transform:none}
.transparency-page .film-motion .print-4 .film-window img{inset:auto;left:50%;top:50%;width:75%;height:133.333333%;max-width:none;max-height:none;transform:translate(-50%,-50%) rotate(90deg)}
.transparency-page .film-motion .film-aura,
.transparency-page .film-motion .print-4 .film-aura{inset:10% 4%;width:auto;height:auto;transform:none;clip-path:inset(0)}

.transparency-page .film-aura{display:none}

/* Subpixel coverage at the rotated exposure edge; keep the aperture and mobile framing fixed. */
@media(min-width:601px){
.transparency-page .film-motion .print-4 .film-window img,
.transparency-page .print-4 .film-window::after{transform:translate(-50%,-50%) rotate(90deg) scale(1.012)}
}

/* Keep the single heading compact so the lightbox and story title sit higher. */
.transparency-page .table-heading{padding:66px 20px 8px}
.transparency-page .table-heading h1{margin:0}
.transparency-page .table-viewport{padding-top:4px}
@media(max-width:600px){.transparency-page .table-heading{padding-top:68px}}
@media(max-width:600px) and (max-height:680px){.transparency-page .table-heading{padding-top:62px}}

/* The official index follows the existing Journal welcome and preserves article return anchors. */
.journal-lightbox-index{scroll-margin-top:-80px}
.journal-entry-anchor{position:absolute;top:0;left:0;scroll-margin-top:-80px}
.journal-lightbox-index .table-footer{padding-bottom:24px}
