/* Landscape -> faded veil -> inset, opaque reading/shopping canvas. */
:root{--cc-scene-image:none;--cc-scene-inset:clamp(10px,2vw,48px)}
:root[data-scene=woods]{--cc-scene-image:url('/scenes/woods.webp')}:root[data-scene=stream]{--cc-scene-image:url('/scenes/stream.webp')}:root[data-scene=stars]{--cc-scene-image:url('/scenes/stars.webp')}:root[data-scene=meadow]{--cc-scene-image:url('/scenes/meadow.webp')}:root[data-scene=mountains]{--cc-scene-image:url('/scenes/mountains.webp')}:root[data-scene=lake]{--cc-scene-image:url('/scenes/lake.webp')}
/* Scripting-disabled browsers keep the original woodland fallback. */
@media(scripting:none){:root{--cc-scene-image:url('/scenes/woods.webp')}}
body.site-page{position:relative;isolation:isolate;padding:var(--cc-scene-inset);min-height:100dvh;background:var(--cc-canvas)}
body.site-page::before,body.site-page::after{content:'';position:fixed;inset:0;pointer-events:none}
body.site-page::before{z-index:-2;background:var(--cc-scene-image) center/cover no-repeat}
body.site-page::after{z-index:-1;background:linear-gradient(180deg,#f6f7f138,#f6f7f15c 55%,#f6f7f19c)}
.site-canvas{position:relative;min-width:0;min-height:calc(100dvh - 2 * var(--cc-scene-inset));background:var(--cc-canvas);border:1px solid var(--cc-border);border-radius:20px;box-shadow:0 16px 70px #10291e40}
.site-canvas>.site-header{border-radius:19px 19px 0 0}.site-canvas>.site-footer{border-radius:0 0 19px 19px}
@media screen{:root:not([data-theme="light"]) body.site-page::after{background:linear-gradient(180deg,#10231b40,#10231b73 55%,#10231bb0)}}
@media(max-width:700px){:root{--cc-scene-inset:8px}.site-canvas{border-radius:12px}.site-canvas>.site-header{border-radius:11px 11px 0 0}.site-canvas>.site-footer{border-radius:0 0 11px 11px}.site-page .site-main{padding-inline:12px}}

/* Portrait cover already clips these outer columns. Keep every original row,
   center/framing and density; only omit pixels the viewport cannot display. */
@media screen and (max-width:700px) and (max-aspect-ratio:3/4){:root[data-scene=woods]{--cc-scene-image:url('/scenes/woods-portrait-1d4c4578c10ee269128a5a03e8c00508d6748db4ddd3fb28a9c8b45b749fddd7.webp')}:root[data-scene=stream]{--cc-scene-image:url('/scenes/stream-portrait-5ec60b086fba53366218622b1e04a076720f2e49836361a8e38d3a1f430d4df4.webp')}:root[data-scene=stars]{--cc-scene-image:url('/scenes/stars-portrait-a6b0dea25eab62b1f9dd8e78600fc0b163db4404475c13f05d7cf58c029c6bc3.webp')}:root[data-scene=meadow]{--cc-scene-image:url('/scenes/meadow-portrait-70f84504c7999eb804afa3ca8a4f7d49bc02832f9287af4e6ad538af89cf35bf.webp')}:root[data-scene=mountains]{--cc-scene-image:url('/scenes/mountains-portrait-7709d07c9fb1ab466994d1a7b60ff31ef0e43373520ede3a3e99cc6f7baf80d2.webp')}:root[data-scene=lake]{--cc-scene-image:url('/scenes/lake-portrait-a31a45baabd9cb6c04ae9c0b7e11d07e7108c2142e7b9f687e73812070ee02a0.webp')}}
@media screen and (max-width:700px) and (max-aspect-ratio:3/4) and (scripting:none){:root{--cc-scene-image:url('/scenes/woods-portrait-1d4c4578c10ee269128a5a03e8c00508d6748db4ddd3fb28a9c8b45b749fddd7.webp')}}