html,
body {
background: #09090b;
}
#splash {
position: fixed;
inset: 0;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
background: #09090b;
transition:
opacity 0.4s ease,
visibility 0.4s ease;
}
/* Silent-Reload: boot.js setzt die Klasse pre-paint im (bevor #splash
existiert) — so blitzt der Splash nach App-eigenen reload()s nie auf.
Das Element selbst entfernt boot.js nach dem DOM-Parse. */
.taly-no-splash #splash {
display: none;
}
#splash.hidden {
opacity: 0;
visibility: hidden;
pointer-events: none;
}
#splash img {
width: 80px;
height: 80px;
border-radius: 16px;
animation: splashPulse 1.5s ease-in-out infinite;
}
#splash p {
color: #8e8e99;
font-family: Inter, system-ui, sans-serif;
font-size: 12px;
margin-top: 16px;
letter-spacing: 0.1em;
text-transform: uppercase;
}
@keyframes splashPulse {
0%,
100% {
transform: scale(1);
opacity: 0.8;
}
50% {
transform: scale(1.05);
opacity: 1;
}
}
#boot-error {
position: fixed;
inset: 0;
z-index: 10000;
display: none;
align-items: center;
justify-content: center;
flex-direction: column;
background: #09090b;
color: #f4f4f5;
font-family: Inter, system-ui, sans-serif;
padding: 24px;
text-align: center;
}
#boot-error.visible {
display: flex;
}
#boot-error h1 {
font-size: 16px;
font-weight: 600;
margin: 0 0 8px;
}
#boot-error p {
font-size: 12px;
color: #8e8e99;
margin: 0 0 20px;
max-width: 320px;
line-height: 1.5;
}
#boot-error button {
background: #2490e8;
color: #fff;
border: 0;
padding: 10px 20px;
border-radius: 8px;
font-size: 13px;
font-weight: 500;
cursor: pointer;
margin: 4px;
}
#boot-error button.secondary {
background: transparent;
color: #8e8e99;
border: 1px solid #3f3f46;
}