/* Aprendizzaje V4 — Direction of art, premium iconography and material depth. */
:root {
    --v4-ink:#17233b;
    --v4-metal:#dbe4f1;
    --v4-metal-deep:#8392aa;
    --v4-glow:rgba(91,103,232,.20);
    --v4-glass:rgba(255,255,255,.78);
    --v4-line:rgba(49,64,92,.14);
    --v4-teacher:#2d7c93;
    --v4-admin:#5c6ea9;
}

/* Role atmospheres — static, deliberately subtle; V5 owns motion. */
body.role-teacher:not(.pre-reader-body) {
    background-color:#f6fbfc;
    background-image:linear-gradient(rgba(247,252,253,.92),rgba(247,252,253,.92)),url('../img/backgrounds/teacher-grid.svg');
    background-size:cover,cover;
    background-attachment:fixed;
}
body.role-admin:not(.pre-reader-body) {
    background-color:#f7f8fc;
    background-image:linear-gradient(rgba(248,249,253,.93),rgba(248,249,253,.93)),url('../img/backgrounds/admin-grid.svg');
    background-size:cover,cover;
    background-attachment:fixed;
}
html[data-theme="dark"] body.role-teacher,
html[data-theme="dark"] body.role-admin { background-image:none; }

/* Premium icon treatment. Existing paths remain stable, so all previous views inherit V4. */
.al-ui-icon img,.v1-nav-icon img,.topbar-icon-btn img,.v1-sidebar-card__title img {
    filter:drop-shadow(0 5px 8px rgba(21,35,63,.14));
}
.v1-nav-icon,.al-ui-icon {
    background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(231,237,248,.88));
    border:1px solid rgba(70,84,111,.13);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 8px 18px rgba(32,47,75,.08);
}

/* Rich world art — foreground/midground/background now lives inside each SVG. */
.al-map-card__media,.kld-hero__world-art,.v4-level-world {
    position:relative;
    overflow:hidden;
    isolation:isolate;
}
/* Dashboard world art is an overlay inside the hero. Keep V3's absolute positioning;
   changing it to relative makes it participate in the hero grid and breaks the layout. */
.v3-home-world {
    position:absolute;
    overflow:hidden;
    isolation:isolate;
    border:0;
    box-shadow:none;
}
.v3-home-world::after,.al-map-card__media::after,.kld-hero__world-art::after,.v4-level-world::after {
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(145deg,rgba(255,255,255,.32),transparent 28%,rgba(13,25,48,.06) 78%,rgba(13,25,48,.16));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.8),inset 0 -20px 34px rgba(20,35,60,.12);
}
.v3-home-world img,.al-map-card__world-art,.kld-hero__world-art img,.v4-level-world img {
    display:block;width:100%;height:100%;object-fit:cover;
    filter:saturate(1.08) contrast(1.03) drop-shadow(0 16px 22px rgba(28,43,72,.12));
}
.kld-hero__world-art,.v4-level-world {
    border:1px solid rgba(255,255,255,.64);
    box-shadow:0 24px 55px rgba(28,43,72,.20),inset 0 1px 0 rgba(255,255,255,.8);
}
.v3-home-world::after { box-shadow:none; }

/* Mascot v2: more expressive silhouettes with controlled visual weight. */
.al-home-mascot__image,.al-activity-hero__mascot img,.kbdg-empty__mascot,.v4-mascot {
    filter:drop-shadow(0 18px 22px rgba(24,36,59,.20));
}
.al-home-mascot::before,.al-activity-hero__mascot::before {
    content:"";position:absolute;inset:10% 6%;border-radius:50%;z-index:-1;
    background:radial-gradient(circle,rgba(255,255,255,.94),rgba(106,119,239,.16) 56%,transparent 72%);
}

/* Competency artwork shared by teacher/admin/profile. */
.v4-competency-thumb {
    width:76px;aspect-ratio:1.35/1;border-radius:18px;overflow:hidden;flex:0 0 auto;
    border:1px solid rgba(58,73,100,.14);box-shadow:0 12px 24px rgba(31,47,77,.12),inset 0 1px 0 #fff;
    background:#eef3fa;
}
.v4-competency-thumb img { width:100%;height:100%;object-fit:cover;display:block; }
.v4-competency-thumb--large { width:118px;border-radius:24px; }
.v4-competency-card {
    display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px;
}
.v4-competency-card__copy { min-width:0; }
.v4-competency-card__copy strong { color:var(--al-text-strong,var(--v4-ink)); }

/* Technical adult role treatment, not decorative noise. */
.role-teacher .r8-teacher-hero,.role-admin .hero-panel-card {
    position:relative;overflow:hidden;isolation:isolate;
    border:1px solid rgba(77,96,129,.14);
    box-shadow:0 24px 55px rgba(32,51,81,.10),inset 0 1px 0 rgba(255,255,255,.88);
}
.role-teacher .r8-teacher-hero::after,.role-admin .hero-panel-card::after {
    content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;z-index:-1;
    background:radial-gradient(circle,rgba(73,158,182,.15),transparent 68%);
}
.role-admin .hero-panel-card::after { background:radial-gradient(circle,rgba(92,110,169,.16),transparent 68%); }
.role-teacher .r8-panel,.role-teacher .r8-student-card,.role-admin .wide-card,.role-admin .metric-card {
    backdrop-filter:saturate(1.05);
    box-shadow:0 18px 42px rgba(31,48,77,.08),inset 0 1px 0 rgba(255,255,255,.82);
}

/* V4 teacher priority visual. */
.v4-teacher-signal { display:flex;align-items:center;gap:14px;min-width:0; }
.v3-teacher-priority__item .v4-competency-thumb { width:64px;border-radius:16px; }
.v3-teacher-priority__copy { min-width:0; }

/* Profile 360 visual language. */
.v3-profile-signal > div,.r8-priority-cards article { position:relative;overflow:hidden; }
.v4-profile-art {
    display:grid;grid-template-columns:110px minmax(0,1fr);gap:18px;align-items:center;
    padding:18px;border:1px solid var(--v4-line);border-radius:24px;background:rgba(255,255,255,.62);
}
.v4-profile-art + .v4-profile-art { margin-top:12px; }

/* Tools: replace emoji-only identity with dedicated three-dimensional vector tiles. */
.ktc-hero__emoji-row { display:flex;gap:10px;justify-content:center;align-items:center; }
.ktc-hero__emoji-row img { width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 10px 13px rgba(23,35,59,.18)); }
.ktc-bg__star { width:9px;height:9px;border-radius:50%;background:radial-gradient(circle,#fff 0 22%,#a5b4fc 24% 45%,transparent 48%);font-size:0;box-shadow:0 0 18px rgba(129,140,248,.55); }
.ktc-tile__icon { display:grid;place-items:center; }
.ktc-tile__icon img { width:112px;height:112px;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(24,36,59,.20)); }
.ktc-tile__spark { font-size:0;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 16px var(--kt-c2); }
.ktc-tile__btn { display:inline-flex;align-items:center;gap:8px; }

/* Login/public: real mascot asset instead of emoji placeholder. */
.lgn-mascot { display:grid;place-items:center; }
.lgn-mascot img { width:min(210px,74%);height:auto;filter:drop-shadow(0 22px 30px rgba(12,24,52,.28)); }
.lgn-proof-chip { display:inline-flex;align-items:center;gap:8px; }
.lgn-proof-chip img { width:25px;height:25px;object-fit:contain; }
.lgn-field-icon img { width:22px;height:22px;display:block; }

/* Level details — scene first, emoji second. */
.kld-hero { position:relative;overflow:hidden; }
.kld-hero__world-art { position:absolute;inset:0;z-index:0;opacity:.32; }
.kld-hero__world-art img { width:100%;height:100%;object-fit:cover; }
.kld-hero__world-art::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.95) 10%,rgba(255,255,255,.72) 48%,rgba(255,255,255,.25)); }
.kld-hero > *:not(.kld-hero__world-art) { position:relative;z-index:1; }
.kld-hero__icon-wrap { width:124px;height:94px;border-radius:24px;overflow:hidden;padding:0; }
.kld-hero__icon-wrap img { width:100%;height:100%;object-fit:cover; }
.kld-card__status-icon img { width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(22,35,60,.14)); }
.kld-card__stars img { width:23px;height:23px;object-fit:contain; }
.kld-star--off img { filter:grayscale(1);opacity:.28; }
.kld-hero__cta img { width:26px;height:26px; }

/* Library/rewards material language. */
.kbdg-card__medal { background:linear-gradient(145deg,#fff,#e8edf6);border:1px solid rgba(91,103,232,.16);box-shadow:inset 0 1px 0 #fff,0 16px 30px rgba(31,47,77,.15); }
.kbdg-card__ico { filter:drop-shadow(0 9px 10px rgba(39,49,70,.18)); }

/* Writing surfaces receive paper material; no animation belongs here. */
[data-v3-activity-type="writing_guided"] .al-activity-workspace,
[data-v3-activity-type="free_writing"] .al-activity-workspace,
[data-v3-activity-type="writing_review"] .al-activity-workspace,
[data-v3-activity-type="correction"] .al-activity-workspace,
[data-v3-activity-type="tracing"] .al-activity-workspace {
    background-color:#fffdf7;
    background-image:linear-gradient(rgba(255,255,255,.92),rgba(255,255,255,.92)),url('../img/materials/paper.svg');
}

/* Dark/high-contrast safety. */
html[data-theme="dark"] .v4-profile-art,
html[data-theme="dark"] .v1-nav-icon,
html[data-theme="dark"] .al-ui-icon { background:linear-gradient(145deg,#202b40,#121b2a);border-color:rgba(255,255,255,.10); }
.is-high-contrast .v4-competency-thumb,.is-high-contrast .v3-home-world,.is-high-contrast .kld-hero__world-art { box-shadow:none; }
@media (forced-colors:active){.v4-competency-thumb,.v3-home-world,.kld-hero__world-art,.v1-nav-icon,.al-ui-icon{border:1px solid CanvasText;box-shadow:none}}
@media (max-width:820px){
    .v4-competency-thumb--large{width:90px}.v4-profile-art{grid-template-columns:82px minmax(0,1fr)}
    .kld-hero__world-art::after{background:linear-gradient(rgba(255,255,255,.88),rgba(255,255,255,.68))}
}
@media (max-width:560px){
    .v4-competency-thumb{width:58px;border-radius:14px}.v4-competency-thumb--large{width:74px}.v4-profile-art{grid-template-columns:1fr}.v4-profile-art .v4-competency-thumb{width:100%;aspect-ratio:2/1}
    .ktc-hero__emoji-row img{width:42px;height:42px}.ktc-tile__icon img{width:92px;height:92px}
}

/* Role-specific icon dialects: child = dimensional, teacher = analytic teal, admin = technical indigo. */
.role-teacher .v1-nav-icon { background:linear-gradient(145deg,#f4fbfc,#dff1f4);border-color:rgba(45,124,147,.18); }
.role-teacher .v1-nav-link.is-active .v1-nav-icon { background:linear-gradient(145deg,#dff4f7,#c9e9ee); }
.role-admin .v1-nav-icon { background:linear-gradient(145deg,#f6f7fc,#e5e9f5);border-color:rgba(92,110,169,.18); }
.role-admin .v1-nav-link.is-active .v1-nav-icon { background:linear-gradient(145deg,#e9ecf8,#d9dff2); }

.v3-teacher-priority__item { grid-template-columns:auto auto minmax(0,1fr) auto; }
.r8-area-row.v4-competency-card > .v4-competency-card__copy { display:grid;gap:7px;min-width:0; }
.r8-area-row.v4-competency-card > .v4-competency-card__copy > div:first-child { display:flex;justify-content:space-between;gap:12px; }
.v4-profile-competencies { display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 18px; }
.v4-profile-art small { display:block;color:var(--al-text-muted);font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:.68rem;margin-bottom:5px; }
.v4-profile-art strong { display:block;color:var(--al-text-strong);font-size:1rem;line-height:1.25; }
.v4-profile-art p { margin:6px 0 0;color:var(--al-text-muted);font-size:.78rem; }
.lesson-icon img { width:52px;height:52px;object-fit:contain;display:block;filter:drop-shadow(0 8px 12px rgba(25,39,66,.14)); }
.lesson-icon.v4-competency-thumb img { width:100%;height:100%;object-fit:cover;filter:none; }
.lesson-hero-panel .v4-level-world { width:100%;aspect-ratio:2.2/1;border-radius:20px;margin:0 0 14px; }
.kid-hero-card__mascot img.v4-mascot { width:118px;height:118px;object-fit:contain; }
@media (max-width:820px){.v4-profile-competencies{grid-template-columns:1fr}.v3-teacher-priority__item{grid-template-columns:auto auto minmax(0,1fr) auto}}
@media (max-width:560px){.v3-teacher-priority__item{grid-template-columns:auto minmax(0,1fr) auto}.v3-teacher-priority__avatar{display:none}.v4-profile-competencies{grid-template-columns:1fr}.lesson-hero-panel .v4-level-world{aspect-ratio:1.8/1}}
