.app-loading {
    box-sizing: border-box;
    position: fixed;
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    margin: 0;
    padding: 24px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #172b4d;
    font-family: 'Public Sans', 'Segoe UI', sans-serif;
    cursor: wait;
    overscroll-behavior: contain;
}

.app-loading[open] { display: grid; place-items: center; }
.app-loading::backdrop { background: rgb(15 30 52 / 24%); backdrop-filter: blur(3px); }
html.app-is-loading { overflow: hidden; }

.app-loading__card {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: min(100%, 320px);
    padding: 32px 28px;
    border: 1px solid rgb(219 229 242 / 85%);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 64px rgb(15 30 52 / 14%);
    text-align: center;
    animation: app-loading-appear 180ms ease-out 120ms both;
}

.app-loading__spinner {
    box-sizing: border-box;
    width: 36px;
    height: 36px;
    margin-bottom: 6px;
    border: 3px solid #e4ecf9;
    border-top-color: #3575df;
    border-radius: 50%;
    animation: app-loading-spin 850ms linear infinite;
}

.app-loading__card strong { font-size: 16px; font-weight: 600; line-height: 1.5; }
.app-loading__card p { margin: 0; color: #65748b; font-size: 14px; line-height: 1.5; }
[data-theme="dark"] .app-loading { color: #edf3fc; }
[data-theme="dark"] .app-loading__card { background: #162238; border-color: #304058; }
[data-theme="dark"] .app-loading__card p { color: #b3c0d3; }
[data-theme="dark"] .app-loading__spinner { border-color: #304058; border-top-color: #7faaff; }

@keyframes app-loading-spin { to { transform: rotate(360deg); } }
@keyframes app-loading-appear { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
    .app-loading__card, .app-loading__spinner { animation: none; }
}
@media print { .app-loading[open] { display: none !important; } }