/* ============================================================
   v10 — Animated logo preloader + link-preview suppression
   + final site-wide mobile responsiveness pass (ABSOLUTE LAST)
   ============================================================ */

/* ---------- 1. Page fade-in while loading ---------- */
html.v10-loading, html.v10-loading body { overflow: hidden !important; }

.v10-page-fade {
    opacity: 0;
    filter: blur(6px);
    transition: opacity .55s ease, filter .55s ease;
}
html.v10-ready .v10-page-fade { opacity: 1; filter: none; }

/* ---------- 2. Loader overlay ---------- */
#v10-loader {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: grid;
    place-items: center;
    background:
        radial-gradient(1200px 600px at 15% 10%, rgba(59,130,246, .28), transparent 60%),
        radial-gradient(900px 500px at 85% 90%, rgba(245, 158, 11, .22), transparent 60%),
        linear-gradient(160deg, #ffffff 0%, #f6f4ff 55%, #f3efff 100%);
    transition: opacity .5s ease, visibility .5s ease;
    padding: 24px;
}
html[data-theme="dark"] #v10-loader,
body.dark #v10-loader {
    background:
        radial-gradient(1200px 600px at 15% 10%, rgba(59,130,246, .35), transparent 60%),
        linear-gradient(160deg, #1c1508 0%, #2e230a 55%, #1a1405 100%);
}
#v10-loader.v10-hide { opacity: 0; visibility: hidden; pointer-events: none; }

.v10-loader-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    text-align: center;
    max-width: 90vw;
}

/* Halo rings around the logo */
.v10-logo-stage {
    position: relative;
    width: 148px;
    height: 148px;
    display: grid;
    place-items: center;
}
.v10-logo-stage::before,
.v10-logo-stage::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 3px solid rgba(109, 40, 217, .35);
    border-top-color: rgba(245, 158, 11, .95);
    border-right-color: rgba(109, 40, 217, .85);
    animation: v10-spin 1.5s cubic-bezier(.55, .15, .35, .9) infinite;
}
.v10-logo-stage::after {
    inset: 14px;
    border-width: 2px;
    border-top-color: rgba(34, 197, 94, .9);
    animation: v10-spin 2.1s linear infinite reverse;
}

.v10-logo-disc {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: #fff;
    display: grid;
    place-items: center;
    box-shadow: 0 18px 45px rgba(146,109,17, .28);
    animation: v10-pop .8s cubic-bezier(.2, .9, .25, 1) both, v10-breathe 2.4s ease-in-out .8s infinite;
    overflow: hidden;
}
.v10-logo-disc img {
    width: 74px;
    height: 74px;
    object-fit: contain;
    animation: v10-sheen 2.8s ease-in-out infinite;
}
.v10-logo-disc .v10-fallback {
    font-weight: 900;
    font-size: 28px;
    color: #1d4ed8;
    letter-spacing: 1px;
}

.v10-loader-name {
    font-weight: 900;
    font-size: clamp(16px, 4.5vw, 22px);
    color: #40320f;
    letter-spacing: .3px;
    animation: v10-rise .7s ease .15s both;
}
html[data-theme="dark"] .v10-loader-name { color: #f4e9ff; }

.v10-loader-sub {
    font-weight: 700;
    font-size: clamp(11px, 3.2vw, 13px);
    color: rgba(59, 29, 120, .70);
    animation: v10-rise .7s ease .3s both;
}
html[data-theme="dark"] .v10-loader-sub { color: rgba(244, 233, 255, .75); }

.v10-bar {
    width: min(240px, 70vw);
    height: 6px;
    border-radius: 999px;
    background: rgba(109, 40, 217, .15);
    overflow: hidden;
}
.v10-bar span {
    display: block;
    height: 100%;
    width: 40%;
    border-radius: 999px;
    background: linear-gradient(90deg, #1d4ed8, #f59e0b, #22c55e);
    animation: v10-slide 1.25s ease-in-out infinite;
}

@keyframes v10-spin { to { transform: rotate(360deg); } }
@keyframes v10-pop {
    0%   { transform: scale(.4) rotate(-25deg); opacity: 0; }
    70%  { transform: scale(1.08) rotate(6deg); opacity: 1; }
    100% { transform: scale(1) rotate(0); opacity: 1; }
}
@keyframes v10-breathe {
    0%, 100% { transform: translateY(0) scale(1); box-shadow: 0 18px 45px rgba(146,109,17, .28); }
    50%      { transform: translateY(-7px) scale(1.04); box-shadow: 0 28px 60px rgba(146,109,17, .38); }
}
@keyframes v10-sheen {
    0%, 100% { filter: drop-shadow(0 0 0 rgba(245, 158, 11, 0)); }
    50%      { filter: drop-shadow(0 0 12px rgba(245, 158, 11, .55)); }
}
@keyframes v10-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes v10-slide {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(260%); }
}

@media (prefers-reduced-motion: reduce) {
    #v10-loader *, .v10-page-fade { animation: none !important; transition: opacity .2s linear !important; filter: none !important; }
}

/* ---------- 3. JS-driven links (no status-bar URL preview) ---------- */
[data-v10-link] { cursor: pointer; }

/* ---------- 4. Site-wide mobile responsiveness (final pass) ---------- */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, canvas, svg, iframe { max-width: 100%; }
img, video { height: auto; }
pre, code { white-space: pre-wrap; word-break: break-word; }
h1, h2, h3, h4, h5, p, a, span, td, th, li, label, div { overflow-wrap: anywhere; }

/* Any wide table becomes horizontally scrollable instead of breaking layout */
.table-wrap, .table-responsive, .card > table, table.table { max-width: 100%; }
@media (max-width: 900px) {
    table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    table thead th, table tbody td { white-space: nowrap; }
    .print-area table, .doc table, .result-sheet table { display: table; white-space: normal; }
}

@media (max-width: 768px) {
    .grid, .cards, .stats, .stat-grid, .grid-2, .grid-3, .grid-4, .row-2, .cols-2, .cols-3, .cols-4 {
        grid-template-columns: 1fr !important;
    }
    .card, .panel, .box, .tile { width: auto !important; min-width: 0 !important; }
    form .row, .form-row, .field-row { display: block !important; }
    form .row > *, .form-row > * { width: 100% !important; margin-bottom: 10px; }
    input, select, textarea, .btn, button { max-width: 100%; }
    input, select, textarea { font-size: 16px; } /* stops iOS zoom-on-focus */
    .btn, button { min-height: 42px; }
    .modal, .popup, .dialog, .sheet {
        width: min(94vw, 480px) !important;
        max-height: 86vh !important;
        overflow-y: auto !important;
    }
    .toolbar, .actions, .filters, .page-head {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
    .toolbar > *, .actions > *, .filters > * { flex: 1 1 auto; min-width: 0; }
}

@media (max-width: 480px) {
    .container, .wrap, .content, main { padding-left: 12px !important; padding-right: 12px !important; }
    h1 { font-size: clamp(19px, 6vw, 26px) !important; }
    h2 { font-size: clamp(17px, 5.2vw, 22px) !important; }
    .btn, button { font-size: 14px; }
    .hide-xs { display: none !important; }
}

/* Respect safe areas on notched phones */
@supports (padding: max(0px)) {
    @media (max-width: 768px) {
        .footer { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
    }
}