
/* NovaClass academic analytics */
.analytics-hero {
    position: relative;
    display: flex;
    min-height: 190px;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    padding: clamp(24px, 4vw, 46px);
    color: #fff;
    background: linear-gradient(125deg, #083d49 0%, #0a7773 54%, #16b9b0 100%);
    border: 0;
}
.analytics-hero::before { content:""; position:absolute; inset:auto -8% -70% 30%; height:210px; border-radius:50%; background:rgba(255,255,255,.09); transform:rotate(-7deg); }
.analytics-hero-copy { position:relative; z-index:1; max-width:720px; }
.analytics-hero h2 { margin:5px 0 10px; color:#fff; font-size:clamp(1.65rem,3vw,2.55rem); }
.analytics-hero p { margin:0; color:rgba(255,255,255,.82); line-height:1.65; }
.analytics-hero .eyebrow { color:#92fff2; }
.analytics-hero-orbit { position:relative; z-index:1; display:grid; width:92px; height:92px; place-items:center; flex:0 0 auto; color:#073b4c; background:#ffd447; border-radius:28px; box-shadow:0 20px 50px rgba(4,35,42,.28); font-size:2rem; transform:rotate(6deg); }
.analytics-filter { display:flex; align-items:end; gap:14px; margin-top:16px; padding:16px 18px; }
.analytics-filter label { display:grid; min-width:min(280px,100%); gap:6px; color:var(--text-gray); font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.analytics-filter select { min-height:44px; color:var(--text); background:var(--surface-soft); border:1px solid var(--border); border-radius:10px; padding:0 12px; font:inherit; font-weight:700; }
.analytics-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:16px 0; }
.analytics-kpis article { position:relative; min-width:0; overflow:hidden; padding:18px; background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow-sm); }
.analytics-kpis article::after { content:""; position:absolute; inset:auto -24px -34px auto; width:90px; height:90px; background:color-mix(in srgb,var(--primary) 12%,transparent); border-radius:50%; }
.analytics-kpis span { display:block; margin-bottom:8px; color:var(--text-gray); font-size:.74rem; font-weight:800; text-transform:uppercase; letter-spacing:.035em; }
.analytics-kpis strong { display:block; max-width:calc(100% - 38px); color:var(--text); font-size:1.85rem; line-height:1.1; overflow-wrap:anywhere; }
.analytics-kpis strong.analytics-best { font-size:.93rem; line-height:1.35; }
.analytics-kpis i { position:absolute; z-index:1; right:17px; top:19px; color:var(--primary); font-size:1.1rem; }
.analytics-insight { display:flex; align-items:center; gap:14px; margin-bottom:16px; padding:17px 20px; border-left:4px solid #f3b51b; }
.analytics-insight > i { display:grid; width:42px; height:42px; place-items:center; flex:0 0 auto; color:#805b00; background:#ffe9a6; border-radius:12px; }
.analytics-insight strong { display:block; margin-bottom:3px; }
.analytics-insight p { margin:0; color:var(--text-gray); line-height:1.5; }
.analytics-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.analytics-card { min-width:0; padding:18px; }
.analytics-card.analytics-wide { grid-column:span 1; }
.analytics-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.analytics-card-head span { display:block; color:var(--text); font-size:.98rem; font-weight:850; }
.analytics-card-head small { display:block; margin-top:4px; color:var(--text-gray); font-size:.72rem; line-height:1.45; }
.analytics-card-head button { display:grid; width:35px; height:35px; place-items:center; flex:0 0 auto; color:var(--primary); background:var(--surface-soft); border:1px solid var(--border); border-radius:10px; cursor:pointer; transition:transform .16s ease,border-color .16s ease,background .16s ease; }
.analytics-card-head button:hover,.analytics-card-head button:focus-visible { transform:translateY(-2px); border-color:var(--primary); background:color-mix(in srgb,var(--primary) 10%,var(--surface)); }
.analytics-canvas-wrap { position:relative; height:300px; min-height:260px; }
.analytics-canvas-wrap.analytics-doughnut,.analytics-canvas-wrap.analytics-polar { height:300px; }
.analytics-canvas-wrap.analytics-tall { height:max(320px,calc(var(--analytics-items,6) * 42px)); }
html[data-theme="dark"] .analytics-hero,body.dark-mode .analytics-hero { background:linear-gradient(125deg,#062b34 0%,#075c59 55%,#118f89 100%); }
@media (min-width:1380px) { .analytics-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .analytics-card.analytics-wide { grid-column:span 2; } }
@media (max-width:980px) { .analytics-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .analytics-grid { grid-template-columns:1fr; } .analytics-card.analytics-wide { grid-column:auto; } }
@media (max-width:640px) { .analytics-hero { min-height:165px; } .analytics-hero-orbit { width:68px; height:68px; border-radius:20px; font-size:1.45rem; } .analytics-filter { align-items:stretch; flex-direction:column; } .analytics-filter label { width:100%; min-width:0; } .analytics-kpis { grid-template-columns:1fr 1fr; gap:10px; } .analytics-kpis article { padding:15px; } .analytics-kpis strong { font-size:1.45rem; } .analytics-canvas-wrap { height:270px; } }

/* NovaClass entry loader */
.novaclass-entry-loader {
    position: fixed;
    z-index: 10050;
    inset: 0;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 18px;
    color: #fff;
    background:
        radial-gradient(circle at 50% 43%, rgba(36, 214, 201, .22), transparent 28%),
        linear-gradient(145deg, #061f27 0%, #073f48 52%, #086c68 100%);
    opacity: 1;
    visibility: visible;
    transition: opacity .46s ease, visibility .46s ease;
}
.novaclass-entry-loader.is-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.entry-loader-glow { position:absolute; width:min(520px,72vw); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(22,193,181,.17),transparent 66%); animation:entryGlow 2.2s ease-in-out infinite; }
.entry-loader-mark { position:relative; display:grid; width:170px; height:170px; place-items:center; }
.entry-loader-mark img { position:relative; z-index:2; width:134px; height:auto; filter:drop-shadow(0 16px 28px rgba(0,0,0,.28)); animation:entryLogoFloat 1.8s ease-in-out infinite; }
.entry-loader-ring { position:absolute; inset:4px; border:2px solid transparent; border-top-color:#22d3c5; border-right-color:rgba(255,209,48,.75); border-radius:50%; animation:entryRing 2.2s linear infinite; }
.entry-loader-ring-b { inset:20px; border-top-color:rgba(255,255,255,.72); border-right-color:transparent; border-bottom-color:#22d3c5; animation-duration:1.55s; animation-direction:reverse; }
.novaclass-entry-loader p { position:relative; z-index:2; margin:0; color:rgba(255,255,255,.9); font-size:.84rem; font-weight:800; letter-spacing:.025em; }
.entry-loader-progress { position:relative; z-index:2; width:190px; height:5px; overflow:hidden; background:rgba(255,255,255,.13); border-radius:99px; }
.entry-loader-progress i { display:block; width:42%; height:100%; background:linear-gradient(90deg,#22d3c5,#ffd130); border-radius:inherit; animation:entryProgress 1.2s ease-in-out infinite; }
@keyframes entryRing { to { transform:rotate(360deg); } }
@keyframes entryLogoFloat { 0%,100% { transform:translateY(0) scale(1); } 50% { transform:translateY(-5px) scale(1.025); } }
@keyframes entryGlow { 0%,100% { transform:scale(.9); opacity:.65; } 50% { transform:scale(1.08); opacity:1; } }
@keyframes entryProgress { 0% { transform:translateX(-120%); } 55%,100% { transform:translateX(340%); } }
@media (max-width:600px) { .entry-loader-mark { width:142px; height:142px; } .entry-loader-mark img { width:112px; } }
@media (prefers-reduced-motion:reduce) { .entry-loader-mark img { animation:none; } .entry-loader-ring { animation-duration:4s; } .entry-loader-progress i { animation-duration:2.2s; } }

/* Global loader depth v2 */
.entry-loader-mark { perspective:700px; }
.entry-loader-mark img { animation:entryLogoApproach 1.45s cubic-bezier(.2,.8,.25,1) infinite; transform-origin:center; will-change:transform,filter,opacity; }
@keyframes entryLogoApproach {
    0% { transform:translateZ(-150px) scale(.7); opacity:.48; filter:blur(2px) drop-shadow(0 8px 16px rgba(0,0,0,.18)); }
    58% { transform:translateZ(18px) scale(1.08); opacity:1; filter:blur(0) drop-shadow(0 20px 34px rgba(0,0,0,.32)); }
    100% { transform:translateZ(0) scale(1); opacity:1; filter:blur(0) drop-shadow(0 16px 28px rgba(0,0,0,.28)); }
}
html.is-page-loading { cursor:progress; }
@media (prefers-reduced-motion:reduce) { .entry-loader-mark img { animation:entryLogoApproach 2.4s ease-in-out infinite !important; } }

/* Login loader logo clarity 2026-09-02 */
.entry-loader-mark {
    width: 210px;
    height: 210px;
}

.entry-loader-mark::after {
    position: absolute;
    z-index: 1;
    width: 174px;
    height: 112px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 22px;
    box-shadow: 0 18px 44px rgba(1, 27, 35, 0.3),
                inset 0 1px 0 rgba(255, 255, 255, 0.92);
    content: "";
    backdrop-filter: blur(8px);
}

.entry-loader-mark img {
    z-index: 2;
    width: 154px;
    filter: drop-shadow(0 7px 12px rgba(7, 40, 46, 0.14));
    opacity: 1;
    animation: entryLogoClear 2.6s ease-in-out infinite;
}

.entry-loader-ring {
    z-index: 0;
}

@keyframes entryLogoClear {
    0%, 100% { transform: translateY(0) scale(1); opacity: 1; }
    50% { transform: translateY(-3px) scale(1.015); opacity: 1; }
}

@media (max-width: 600px) {
    .entry-loader-mark {
        width: 184px;
        height: 184px;
    }

    .entry-loader-mark::after {
        width: 154px;
        height: 100px;
        border-radius: 19px;
    }

    .entry-loader-mark img {
        width: 136px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .entry-loader-mark img {
        animation: none !important;
    }
}

/* Gráficos legibles y orientados al progreso en el tiempo. */
.analytics-trend-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:2px 0 9px}
.analytics-trend-summary>div{min-width:0;padding:10px 11px;background:var(--surface-soft);border:1px solid var(--border);border-radius:10px}
.analytics-trend-summary span{display:block;margin-bottom:4px;color:var(--text-gray);font-size:.66rem;font-weight:800;letter-spacing:.025em;text-transform:uppercase}
.analytics-trend-summary strong{display:block;overflow:hidden;color:var(--text);font-size:.91rem;text-overflow:ellipsis;white-space:nowrap}
.analytics-trend-summary .is-up strong,.analytics-trend-reading.is-up{color:#07866f}
.analytics-trend-summary .is-down strong,.analytics-trend-reading.is-down{color:#d74452}
.analytics-trend-summary .is-neutral strong,.analytics-trend-reading.is-neutral{color:#a36e00}
.analytics-trend-reading{display:flex;align-items:center;gap:7px;margin:0 0 4px;padding:8px 10px;border-radius:9px;background:color-mix(in srgb,currentColor 8%,transparent);font-size:.75rem;font-weight:750;line-height:1.35}
.analytics-canvas-wrap.analytics-timeline{height:330px}
.analytics-canvas-wrap.analytics-status{height:250px}
.analytics-canvas-wrap.analytics-types{height:max(270px,calc(var(--analytics-items,6) * 40px))}
.analytics-card canvas{max-width:100%}
@media(max-width:720px){
 .analytics-trend-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
 .analytics-canvas-wrap.analytics-timeline{height:300px}
 .analytics-canvas-wrap.analytics-status{height:230px}
 .analytics-trend-summary strong{font-size:.82rem}
}
