:root {
    --studiny-skeleton-primary: #3b82f6;
    --studiny-skeleton-accent: #06b6d4;
    --studiny-skeleton-teal: #14b8a6;
    --studiny-skeleton-base: #e4edf7;
    --studiny-skeleton-highlight: #f8fbff;
}

.studiny-loading-host,
.studiny-partial-loading-host {
    position: relative;
    isolation: isolate;
    min-width: 0;
}

#studiny-page-content {
    min-height: calc(100vh - 126px);
}

.studiny-loading-layer {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: block;
    min-height: 100%;
    padding: 0;
    overflow: hidden;
    border-radius: inherit;
    background: rgba(246, 250, 255, .99);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .1s ease, visibility 0s linear .1s;
}

.studiny-loading-layer[hidden] { display: none !important; }

[data-studiny-loading="true"] > .studiny-loading-layer {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s;
}

#studiny-page-content[data-studiny-loading="true"] > .studiny-page-content-real,
.studiny-partial-loading-host[data-studiny-loading="true"] > :not(.studiny-loading-layer) {
    visibility: hidden !important;
}

.studiny-skeleton {
    width: 100%;
    min-height: 100%;
    padding: clamp(16px, 2.4vw, 28px);
    color: transparent;
}

.studiny-skeleton-pulse {
    position: relative;
    display: block;
    overflow: hidden;
    border: 1px solid rgba(59, 130, 246, .06);
    border-radius: 14px;
    background: var(--studiny-skeleton-base);
}

.studiny-skeleton-pulse::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, transparent 18%, rgba(255,255,255,.9) 48%, transparent 78%);
    transform: translateX(-110%);
    animation: studiny-skeleton-shimmer 1.25s ease-in-out infinite;
}

.studiny-skeleton-heading { margin-bottom: 24px; }
.studiny-skeleton-heading .is-title { width: min(320px, 58%); height: 25px; }
.studiny-skeleton-heading .is-subtitle { width: min(440px, 72%); height: 13px; margin-top: 12px; }
.studiny-skeleton .is-title { width: 220px; max-width: 72%; height: 24px; }
.studiny-skeleton .is-subtitle { width: 150px; max-width: 55%; height: 12px; margin-top: 11px; }

.studiny-skeleton-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 15px;
    margin-bottom: 20px;
}
.studiny-skeleton .is-metric { min-height: 112px; border-radius: 18px; }
.studiny-skeleton-columns { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(260px, .8fr); gap: 18px; }
.studiny-skeleton .is-panel { width: 100%; border-radius: 20px; }
.studiny-skeleton .is-panel-tall { min-height: 300px; }
.studiny-skeleton .is-panel-medium { min-height: 220px; }
.studiny-skeleton .is-panel-short { min-height: 96px; margin-top: 18px; }

.studiny-skeleton-filterbar { display: flex; gap: 12px; margin-bottom: 17px; }
.studiny-skeleton .is-filter { width: 145px; height: 42px; }
.studiny-skeleton .is-filter.is-wide { width: min(280px, 40%); margin-inline-end: auto; }
.studiny-skeleton-table { overflow: hidden; border: 1px solid rgba(148,163,184,.22); border-radius: 18px; background: rgba(255,255,255,.62); }
.studiny-skeleton-row,
.studiny-skeleton-grade-row { display: grid; grid-template-columns: .7fr 1.5fr 1fr .55fr; align-items: center; gap: 18px; min-height: 58px; padding: 13px 16px; border-bottom: 1px solid rgba(148,163,184,.18); }
.studiny-skeleton-row:last-child,
.studiny-skeleton-grade-row:last-child { border-bottom: 0; }
.studiny-skeleton .is-cell { height: 12px; border-radius: 999px; }
.studiny-skeleton .is-cell-short { width: 65%; }
.studiny-skeleton .is-cell-action { width: 38px; height: 28px; justify-self: end; }

.studiny-skeleton-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.studiny-skeleton .is-grid-card { min-height: 172px; border-radius: 20px; }

.studiny-skeleton-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 920px; }
.studiny-skeleton .is-field { height: 70px; }
.studiny-skeleton .is-field.is-wide { grid-column: 1 / -1; }
.studiny-skeleton-actions { display: flex; gap: 12px; grid-column: 1 / -1; padding-top: 8px; }
.studiny-skeleton .is-button { width: 130px; height: 42px; border-radius: 12px; background: rgba(59,130,246,.28); }
.studiny-skeleton .is-button.is-secondary { width: 92px; background: rgba(148,163,184,.25); }

.studiny-skeleton-profile-head { display: flex; align-items: center; gap: 18px; margin-bottom: 24px; }
.studiny-skeleton .is-avatar { width: 74px; height: 74px; flex: 0 0 74px; border-radius: 50%; }
.studiny-skeleton-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.studiny-skeleton .is-detail { height: 76px; }

.studiny-skeleton-grade-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-bottom: 18px; }
.studiny-skeleton .is-grade-stat { min-height: 95px; border-radius: 18px; background: linear-gradient(135deg, rgba(59,130,246,.18), rgba(6,182,212,.2)); }
.studiny-skeleton-grade-row { grid-template-columns: 1.7fr repeat(3, .45fr); }
.studiny-skeleton .is-score { width: 48px; height: 28px; justify-self: center; border-radius: 10px; }

.studiny-skeleton-chat { display: grid; grid-template-columns: minmax(210px, 31%) minmax(0, 1fr); min-height: 470px; overflow: hidden; border: 1px solid rgba(148,163,184,.22); border-radius: 20px; background: rgba(255,255,255,.56); }
.studiny-skeleton-chat aside { padding: 16px; border-inline-end: 1px solid rgba(148,163,184,.22); }
.studiny-skeleton .is-chat-search { height: 38px; margin-bottom: 16px; }
.studiny-skeleton-contact { display: flex; align-items: center; gap: 11px; padding: 10px 0; }
.studiny-skeleton-contact > div { flex: 1; }
.studiny-skeleton .is-contact-avatar { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 50%; }
.studiny-skeleton .is-contact-name { width: 70%; height: 11px; }
.studiny-skeleton .is-contact-line { width: 90%; height: 8px; margin-top: 8px; }
.studiny-skeleton-chat section { display: flex; flex-direction: column; min-width: 0; padding: 16px; }
.studiny-skeleton-chat-head { display: flex; align-items: center; gap: 11px; padding-bottom: 13px; border-bottom: 1px solid rgba(148,163,184,.18); }
.studiny-skeleton-messages { display: flex; flex: 1; flex-direction: column; gap: 15px; padding: 24px 8px; }
.studiny-skeleton .is-message { width: 52%; height: 58px; border-radius: 18px 18px 18px 5px; }
[dir="rtl"] .studiny-skeleton .is-message { border-radius: 18px 18px 5px 18px; }
.studiny-skeleton .is-message.is-own { width: 44%; align-self: flex-end; background: rgba(59,130,246,.22); }
.studiny-skeleton .is-composer { height: 45px; border-radius: 16px; }

.studiny-skeleton-documents { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 17px; }
.studiny-skeleton .is-document { min-height: 220px; border-radius: 18px; background: linear-gradient(180deg, var(--studiny-skeleton-base) 0 76%, rgba(59,130,246,.14) 76%); }

.studiny-loading-layer.is-partial { z-index: 10; border-radius: 15px; background: rgba(247,251,255,.98); }
.studiny-loading-layer.is-partial .studiny-skeleton { min-height: 180px; padding: 14px; }
.studiny-loading-layer.is-partial .studiny-skeleton-heading { margin-bottom: 14px; }
.studiny-loading-layer.is-partial .studiny-skeleton-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
.studiny-loading-layer.is-partial .is-panel-tall { min-height: 150px; }

.studiny-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

form[data-studiny-submitting="true"] [type="submit"],
form[data-studiny-submitting="true"] button:not([type="button"]) { pointer-events: none; }

@keyframes studiny-skeleton-shimmer { to { transform: translateX(110%); } }

@media (max-width: 992px) {
    #studiny-page-content { min-height: calc(100vh - 114px); }
    .studiny-skeleton-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .studiny-skeleton-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .studiny-skeleton-documents { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .studiny-skeleton { padding: 15px; }
    .studiny-skeleton-columns,
    .studiny-skeleton-form,
    .studiny-skeleton-detail-grid { grid-template-columns: 1fr; }
    .studiny-skeleton .is-field.is-wide,
    .studiny-skeleton-actions { grid-column: auto; }
    .studiny-skeleton-metrics,
    .studiny-skeleton-grade-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .studiny-skeleton .is-metric { min-height: 90px; }
    .studiny-skeleton-card-grid { grid-template-columns: 1fr; }
    .studiny-skeleton-row { grid-template-columns: .75fr 1.4fr .55fr; gap: 10px; padding-inline: 12px; }
    .studiny-skeleton-row .is-cell:nth-child(3) { display: none; }
    .studiny-skeleton-grade-row { grid-template-columns: 1.4fr repeat(2, .45fr); gap: 8px; }
    .studiny-skeleton-grade-row .is-score:last-child { display: none; }
    .studiny-skeleton-chat { grid-template-columns: 92px minmax(0, 1fr); min-height: 420px; }
    .studiny-skeleton-chat aside { padding: 10px; }
    .studiny-skeleton-contact > div,
    .studiny-skeleton .is-chat-search { display: none; }
    .studiny-skeleton .is-message { width: 76%; }
    .studiny-skeleton-documents { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .studiny-skeleton .is-document { min-height: 160px; }
}

@media (prefers-reduced-motion: reduce) {
    .studiny-loading-layer { transition: none; }
    .studiny-skeleton-pulse::after { animation: none; }
}

@media print { .studiny-loading-layer { display: none !important; } }
