/*
 * MT-66 + MT-74: web shell layout + WASM splash styling.
 *
 * #splash overlays the page until Compose mounts its <canvas>, then the
 * MutationObserver in index.html fades it out (opacity → 0, removed after
 * 300ms transition). Background colour matches the app's DarkBackground
 * token (theme/Theme.kt) so the transition from splash → first paint is
 * seamless in dark mode. Light-mode users see one frame of dark before
 * Compose paints over it; acceptable.
 *
 * Icon border-radius matches the rasterised PNG's natural rounded-square
 * corners (24px on a 120px-displayed image ≈ 18% radius). CSS rounding
 * isn't strictly needed because the source PNG is already rounded — left
 * in as a defensive double-rounding so a future flat icon export still
 * presents properly.
 */

html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

#composeApp {
    width: 100%;
    height: 100%;
}

#splash {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0B1220; /* theme/Theme.kt DarkBackground */
    z-index: 9999;
    transition: opacity 0.3s ease;
}

.splash-icon {
    width: 120px;
    height: 120px;
    border-radius: 24px;
}