/* Typography and silver/pastel sheen from GSI brand.css and design-tokens.css. */
@font-face{font-family:'Rungine Orbitron';src:url('/assets/fonts/Orbitron-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'Rungine Garamond';src:url('/assets/fonts/EBGaramond.ttf') format('truetype');font-weight:400 800;font-display:swap}
#app-loading{position:fixed;inset:0;z-index:2147483000;display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;background:#020511;transition:opacity .35s ease;pointer-events:none}
#app-loading.leaving{opacity:0}
.loading-art{position:absolute;inset:0;z-index:0;min-height:0;overflow:hidden}
.loading-art img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center;display:block;mix-blend-mode:screen}
.loading-art::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,5,17,.42),transparent 25%,transparent 72%,rgba(2,5,17,.68));pointer-events:none}
.loading-lights{position:absolute;pointer-events:none;mix-blend-mode:screen}
.loading-mote{position:absolute;width:var(--size);height:var(--size);border-radius:50%;opacity:0;background:radial-gradient(circle,#fff 0 16%,#e4f6ff 28%,#84caff 48%,rgba(44,115,255,.4) 68%,transparent 74%);box-shadow:0 0 8px 2px #87cfff99,0 0 22px 5px #216aff66;animation:loading-rise var(--duration) var(--delay) linear infinite;will-change:transform,opacity}
.loading-mote:nth-child(3n){filter:blur(1px)}
@keyframes loading-rise{0%{opacity:0;transform:translate(-50%,0) scale(.3)}12%{opacity:.85}45%{opacity:.95;transform:translate(calc(-50% + var(--drift)*.35 + var(--sway)),calc(var(--rise)*.45)) scale(1)}78%{opacity:.5}100%{opacity:0;transform:translate(calc(-50% + var(--drift)),var(--rise)) scale(.35)}}
.loading-publisher{position:relative;grid-row:3;z-index:1;display:flex;align-items:center;flex-direction:column;padding:12px 24px max(24px,env(safe-area-inset-bottom));gap:7px;text-align:center}
.loading-publisher-title{font-family:'Rungine Orbitron',sans-serif;font-size:clamp(22px,4.6vmin,42px);font-weight:600;letter-spacing:-.025em;line-height:1.2;color:#f9faff;background-image:linear-gradient(110deg,transparent 40%,rgba(174,226,237,.42) 46%,rgba(204,192,235,.42) 50%,rgba(239,203,219,.42) 54%,transparent 60%),linear-gradient(100deg,#d0ebf0 0%,#e0e9f0 19%,#e0d9ed 36%,#ecdde7 54%,#f0eadb 73%,#f5f6fa 90%);background-size:250% 100%,100% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:loading-sheen 5.8s ease-in-out infinite}
.loading-publisher-tagline{font-family:'Rungine Garamond',Georgia,serif;font-weight:500;font-size:clamp(15px,3.2vmin,28px);line-height:1.2;white-space:nowrap;background:linear-gradient(94deg,#aeb5c9,#f9faff 50%,#a4abbe);background-clip:text;-webkit-background-clip:text;color:#f9faff;-webkit-text-fill-color:transparent;text-shadow:0 0 1.1rem rgba(226,231,248,.22)}
@keyframes loading-sheen{0%,20%{background-position:100% 0,0 0}80%,100%{background-position:-100% 0,0 0}}
/* The approved sky is the complete splash surface; title and lockup remain legible above it. */
@media (orientation:portrait){.loading-art img{object-position:center}}
@media (max-height:450px){.loading-publisher{padding-top:4px;padding-bottom:max(12px,env(safe-area-inset-bottom));gap:3px}.loading-publisher-title{font-size:22px}}
@media (prefers-reduced-motion:reduce){#app-loading{transition:none}.loading-publisher-title{animation:none}.loading-mote{animation:none;will-change:auto;opacity:.55;transform:translate(calc(-50% + var(--drift)*.5),calc(var(--rise)*.5)) scale(.65)}}

/* Startup constellations belong to the shared sky, never to three separate
   coloured canvases left over from the user's selected background. */
.loading-constellation{position:absolute;display:block;pointer-events:none;mix-blend-mode:screen;background:transparent!important}
/* Reserve a separate row so the app name never overlaps the book or publisher. */
.loading-app-title{position:relative;grid-row:1;z-index:1;padding:max(24px,env(safe-area-inset-top)) 20px 0;text-align:center;font-family:"Rungine Garamond",Georgia,serif;font-size:clamp(40px,8vmin,88px);font-weight:500;line-height:1.05;letter-spacing:.01em;color:#f9faff;text-shadow:0 0 24px #b6dafa88,0 0 48px #5a9cff44}
@media(max-height:450px){.loading-app-title{padding-top:max(12px,env(safe-area-inset-top));font-size:32px}}
