/* SINSATIONULL holding page. No outside fonts or scripts. Always night. */
:root { --bog:#0a0c0a; --bone:#d9cfae; --bone-dim:#a39b7e; --brass:#a8863d; --moon:#e8ecdd;
  --serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,"URW Palladio L",Georgia,serif; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; background:var(--bog); color:var(--bone); }
body { font-family:var(--serif); -webkit-font-smoothing:antialiased; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.stage { position:relative; min-height:100dvh; display:grid; grid-template-rows:1fr auto auto 1fr; justify-items:center; align-items:center; padding:24px 16px 40px; overflow:hidden; }
.bog { position:absolute; inset:0; background:url(assets/bog.jpg) center 35% / cover no-repeat; }
.bog::after { content:""; position:absolute; inset:0;
  background: radial-gradient(ellipse 70% 60% at 50% 45%, rgba(10,12,10,.15), rgba(10,12,10,.82) 78%),
              linear-gradient(180deg, rgba(10,12,10,.35), rgba(10,12,10,.92) 100%); }
.moonlight { position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 24% 12%, rgba(232,236,221,.20), transparent 28%); }
.mark { position:relative; grid-row:2; width:min(92vw,1100px); aspect-ratio:1578/272; cursor:grab; touch-action:pan-y; }
.mark:active { cursor:grabbing; }
.mark:focus-visible { outline:2px solid #7dff6a; outline-offset:8px; }
.mark canvas { position:absolute; inset:0; width:100%; height:100%; display:block; }
.fallback { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; transition:opacity .8s ease; }
.mark.is-ready .fallback { opacity:0; }
.line { grid-row:3; position:relative; margin:28px 0 0; text-align:center; font-size:clamp(17px,2.4vw,22px); line-height:1.6; letter-spacing:.04em; color:var(--bone-dim); }
.line span { color:var(--bone); letter-spacing:.32em; font-size:.82em; }
@media (prefers-reduced-motion: reduce) { .fallback { transition:none; } }