/* PlotLuck 10.74 — real, public, first-response HTML gateway.
   Served directly by index.html to ALL visitors and crawlers. A separate
   bootstrap layer stays visible until React is painted behind it, then fades
   away over 180ms. No user-agent detection or hidden crawler-only content. */
/* Keep the original public HTML in its own layer: React never clears this DOM.
   The layer MUST stay visible and navigable if JavaScript fails to load. */
#plotluck-first-response { position:fixed; inset:0; z-index:2147483000; background:#020b2d; opacity:1; pointer-events:auto; transition:opacity 180ms ease-in-out; }
#plotluck-first-response.plotluck-first-response--retiring { opacity:0; pointer-events:none; }
@media (prefers-reduced-motion:reduce) { #plotluck-first-response { transition-duration:0ms; } }
:root{color-scheme:dark}
html,body,#root{margin:0;min-height:100%;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:#020b2d}
.plotluck-bootstrap{min-height:100vh;min-height:100dvh;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#fff;background:#020b2d url('/plotluck-gateway-world.png') center center/cover no-repeat}
@media(min-width:900px){.plotluck-bootstrap{background-size:100% 100%}}
.plotluck-bootstrap *{box-sizing:border-box}
.plotluck-bootstrap-ticket{flex:0 0 auto;position:relative;width:min(375px,96vw,calc(97dvh * 375 / 667));aspect-ratio:375/667;isolation:isolate}
.plotluck-bootstrap-art{position:absolute;inset:.5%;width:99%;height:99%;overflow:visible;filter:saturate(1.07) contrast(1.04) drop-shadow(0 18px 34px rgba(0,0,0,.72))}
.plotluck-bootstrap-title{position:absolute;left:6%;right:6%;top:4.2%;display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.7vw,9px);white-space:nowrap;}
.plotluck-bootstrap-title h1{font-weight:950;letter-spacing:.025em;font-size:clamp(1.5rem,7.6vw,2.2rem);margin:0;line-height:1.02;color:#ffc928;background:linear-gradient(180deg,#fffef0 0%,#fff3a2 10%,#ffd84c 24%,#ffb10d 45%,#b86600 61%,#f5a609 72%,#ffd95a 84%,#8b4300 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:1.05px rgba(51,23,0,.98);paint-order:stroke fill;filter:drop-shadow(0 1px 0 rgba(255,190,35,.7)) drop-shadow(0 3px 0 rgba(99,43,0,.94)) drop-shadow(0 5px 7px rgba(0,0,0,.78))}
.plotluck-bootstrap-icon{width:clamp(50px,14vw,62px);height:clamp(50px,14vw,62px);object-fit:cover;border-radius:18%;border:2px solid #9cf5ff;box-shadow:0 0 24px rgba(34,211,238,.48)}
.plotluck-bootstrap-description,.plotluck-gateway-public-intro{position:absolute;top:30%;left:15%;right:15%;font-weight:650;font-size:clamp(8px,2.5vw,11px);line-height:1.5;text-align:center;color:#ecf9ff;text-shadow:0 1px 3px #020512;}
.plotluck-bootstrap-code{position:absolute;left:26.5%;top:46%;width:47%;height:clamp(44px,6.8vh,52px);border:1px solid rgba(255,221,107,.88);border-radius:6px;background:linear-gradient(180deg,#020712,#070912);box-shadow:0 0 14px rgba(250,204,21,.3);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.plotluck-bootstrap-code span{font-weight:900;font-style:italic;font-size:clamp(7px,1.85vw,8.5px);letter-spacing:.035em;color:#d3f4ff}
.plotluck-bootstrap-code strong{font-size:clamp(9px,2.45vw,11px);letter-spacing:.018em;color:#e0b87d;font-weight:900;white-space:nowrap}
.plotluck-bootstrap-enter{position:absolute;left:14%;width:72%;top:62.5%;border:2px solid #fff1a1;border-radius:9px;padding:clamp(8px,1.3vh,11px);text-align:center;font-size:clamp(9px,2.85vw,12px);font-weight:900;letter-spacing:.075em;color:#171106;background:linear-gradient(90deg,#8b4a05,#ffd84b,#8b4a05);box-shadow:0 0 18px rgba(255,194,31,.42)}
.plotluck-bootstrap-return{position:absolute;top:73.2%;left:0;right:0;text-align:center;white-space:nowrap;font-size:clamp(10px,3.1vw,13px);font-weight:900;letter-spacing:.09em;color:#e2fbff}
.plotluck-bootstrap-return small{display:block;margin-top:2px;font-size:clamp(9px,2.8vw,12px);color:#a5eafc}
.plotluck-bootstrap-download{position:absolute;left:0;right:0;top:83.2%;text-align:center;white-space:nowrap;font-size:clamp(8px,2.45vw,10.5px);font-weight:900;letter-spacing:.075em;color:#e5fbff}
.plotluck-bootstrap-bottom{position:absolute;bottom:1.8%;left:4%;right:4%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.plotluck-bootstrap-gulag{font-size:clamp(7px,2.05vw,9px);font-weight:900;letter-spacing:.07em;color:#c9f3ff;white-space:nowrap}
.plotluck-bootstrap-nav{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;column-gap:clamp(5px,1.4vw,8px);row-gap:3px;font-size:clamp(8px,1.95vw,9.5px);font-weight:900;letter-spacing:.04em;line-height:1.15}
.plotluck-bootstrap-nav a{color:#e7faff;text-decoration:none}
.plotluck-bootstrap-nav a:hover,.plotluck-bootstrap-nav a:focus{color:#a5ecff;text-decoration:underline}
.plotluck-bootstrap-nonjs{position:absolute;top:88%;left:15%;right:15%;font-size:9px;text-align:center;color:#fff}

.plotluck-gateway-public-intro{z-index:30;margin:0;}
/* Landscape first-response content must fit the short VIP Pass, without masking
   the pass field, existing-user label, download cue, or public links. */
@media (max-height:450px) {
  .plotluck-bootstrap-description,.plotluck-gateway-public-intro{top:26%;font-size:8px;line-height:1.25}
  .plotluck-bootstrap-return{top:70%;font-size:10px}
  .plotluck-bootstrap-return small{font-size:9px}
  .plotluck-bootstrap-download{top:78%;font-size:8px}
  .plotluck-bootstrap-bottom{bottom:.5%;gap:1px}
  .plotluck-bootstrap-nav{font-size:8px;line-height:1.1;row-gap:2px}
}
@media (max-height:450px) {
  .plotluck-bootstrap-enter {padding:4px 4px;font-size:9px}
  .plotluck-gateway-verify-button {padding-top:4px !important;padding-bottom:4px !important}
  .plotluck-gateway-secondary-action {top:70% !important}
  .plotluck-gateway-download-wrap {top:78% !important}
  .plotluck-gateway-footer-nav {font-size:8px;line-height:1.1;row-gap:2px}
}