@font-face { font-family: "Montserrat"; src: url("fonts/montserrat/Montserrat-SemiBold.woff2") format("woff2"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("fonts/montserrat/Montserrat-Bold.woff2") format("woff2"); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("fonts/montserrat/Montserrat-ExtraBold.woff2") format("woff2"); font-style: normal; font-weight: 800; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/ibm-plex-sans/IBMPlexSans-Regular.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/ibm-plex-sans/IBMPlexSans-Italic.woff2") format("woff2"); font-style: italic; font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/ibm-plex-sans/IBMPlexSans-Medium.woff2") format("woff2"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fonts/ibm-plex-sans/IBMPlexSans-SemiBold.woff2") format("woff2"); font-style: normal; font-weight: 600; font-display: swap; }

:root {
    --font-display: "Montserrat", "Avenir Next", "Segoe UI", Arial, sans-serif;
    --font-body: "IBM Plex Sans", "Segoe UI", Roboto, Arial, sans-serif;
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;
    --weight-extrabold: 800;
    --text-xs: clamp(.75rem, .72rem + .12vw, .8125rem);
    --text-sm: clamp(.875rem, .84rem + .15vw, .95rem);
    --text-base: 1rem;
    --text-lead: clamp(1rem, .96rem + .25vw, 1.2rem);
    --text-card-title: clamp(1rem, .94rem + .35vw, 1.3rem);
    --text-h3: clamp(1.4rem, 1.22rem + .8vw, 1.875rem);
    --text-h2: clamp(1.75rem, 1.4rem + 1.5vw, 2.4rem);
    --text-h1: clamp(2rem, 1.45rem + 2.8vw, 3.25rem);
    --navy-950: #020a13;
    --navy-900: #041426;
    --navy-850: #071b31;
    --navy-800: #0a223b;
    --navy-700: #113453;
    --gold-500: #d9a13a;
    --gold-300: #f2c879;
    --cream: #f7f3eb;
    --white: #f7fbff;
    --muted: #aebfd0;
    --line: rgba(255, 255, 255, .14);
    --line-gold: rgba(217, 161, 58, .52);
    --danger: #ff8b8b;
    --success: #69d39d;
    --shadow: 0 24px 70px rgba(0, 0, 0, .36);
    --radius: 20px;
}

* { box-sizing: border-box; }

html { max-width: 100%; overflow-x: hidden; scroll-behavior: smooth; font-size: 16px; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    max-width: 100%;
    min-height: 100vh;
    overflow-x: hidden;
    color: var(--white);
    background:
        radial-gradient(circle at 15% -10%, rgba(26, 75, 116, .72), transparent 38%),
        linear-gradient(180deg, var(--navy-900), var(--navy-950));
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: var(--weight-regular);
    line-height: 1.5;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.dialogOpen { overflow: hidden; }

button { font-family: var(--font-display); font-weight: var(--weight-semibold); }
input, select, textarea { font-family: var(--font-body); font-size: 1rem; line-height: 1.4; }
button { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; }

.skipLink {
    position: fixed;
    z-index: 100;
    left: 12px;
    top: -80px;
    padding: 10px 14px;
    background: var(--gold-300);
    color: var(--navy-950);
    border-radius: 8px;
}

.skipLink:focus { top: 12px; }
.wrap { width: min(1380px, calc(100% - 44px)); margin-inline: auto; }
.hidden { display: none !important; }

.topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    border-bottom: 1px solid var(--line);
    background: rgba(2, 12, 24, .91);
    backdrop-filter: blur(18px);
}

.navBar {
    min-height: 88px;
    display: flex;
    align-items: center;
    gap: 24px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    color: var(--cream);
    font-family: var(--font-display);
    letter-spacing: .03em;
}

.brand img { width: 58px; height: 58px; object-fit: contain; }
.brand span { font-size: 14px; line-height: 1.18; text-align: left; }
.brandButton { padding: 0; border: 0; background: transparent; cursor: pointer; }

.desktopNav {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.navLink {
    padding: 12px 14px;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--white);
    background: transparent;
    cursor: pointer;
}

.navLink:hover, .navLink.active { color: var(--gold-300); border-bottom-color: var(--gold-500); }

.privateButton, .ghostButton, .secondaryButton, .primaryButton, .textButton {
    border-radius: 10px;
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.privateButton, .ghostButton, .secondaryButton {
    border: 1px solid var(--line-gold);
    color: var(--white);
    background: rgba(255, 255, 255, .025);
    padding: 11px 17px;
}

.privateButton:hover, .ghostButton:hover, .secondaryButton:hover { border-color: var(--gold-300); background: rgba(217, 161, 58, .09); }

.primaryButton {
    border: 0;
    padding: 12px 19px;
    color: #071525;
    background: linear-gradient(135deg, #c78a25, #f0c56f);
    font-weight: 800;
    box-shadow: 0 9px 24px rgba(217, 161, 58, .18);
}

.primaryButton:hover, .secondaryButton:hover, .privateButton:hover { transform: translateY(-1px); }
.primaryButton.wide { width: 100%; }

.textButton {
    border: 0;
    color: var(--gold-300);
    background: transparent;
    padding: 8px 0;
    font-weight: 700;
}

.textButton:hover { text-decoration: underline; }
.mobileMenuButton { display: none; border: 0; background: transparent; color: white; font-size: 27px; cursor: pointer; }
.mobileMenu { display: none; }

.publicView { display: none; min-height: 60vh; animation: pageIn .3s ease both; }
.publicView.active { display: block; }

@keyframes pageIn {
    from { opacity: 0; transform: translateY(7px); }
    to { opacity: 1; transform: translateY(0); }
}

.entryHero, .sectionHero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.entryHero { min-height: clamp(390px, 55vh, 650px); }
.sectionHero { min-height: 390px; }
.entryHero > img, .sectionHero > img { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; }

.entryShade {
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(90deg, rgba(2, 10, 19, .95) 0%, rgba(2, 10, 19, .73) 42%, rgba(2, 10, 19, .18) 76%),
        linear-gradient(0deg, var(--navy-900) 0%, transparent 38%);
}

.entryHeroContent, .sectionHeroContent {
    min-height: inherit;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding-block: 72px;
}

.eyebrow, .sectionKicker {
    margin: 0 0 9px;
    color: var(--gold-300);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: 12px;
    font-weight: 800;
}

.entryHero h1, .sectionHero h1 {
    max-width: 750px;
    margin: 0;
    color: var(--cream);
    font: 800 clamp(54px, 7vw, 96px)/.96 var(--font-display);
    letter-spacing: -.035em;
}

.entryHeroContent > p:last-child, .sectionHeroContent > p:last-child {
    max-width: 680px;
    margin: 24px 0 0;
    color: #f0d18b;
    font-size: clamp(20px, 2.1vw, 29px);
    line-height: 1.35;
}

.backHome {
    margin-bottom: 38px;
    padding: 8px 0;
    border: 0;
    color: #dce7f1;
    background: transparent;
    cursor: pointer;
}

.backHome:hover { color: var(--gold-300); }

.gatewayArea { padding: 18px 0 72px; }
.gatewayQuestion { margin: 0 0 16px; color: var(--muted); text-align: center; }

.gatewayGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.gatewayCard {
    position: relative;
    min-height: 390px;
    overflow: hidden;
    border: 1px solid var(--line-gold);
    border-radius: 24px;
    color: white;
    background: var(--navy-800);
    text-align: left;
    cursor: pointer;
    box-shadow: var(--shadow);
}

.gatewayCard > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2,.75,.2,1), filter .35s ease;
}

.gatewayOverlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(2, 11, 22, .96) 0%, rgba(4, 20, 38, .53) 55%, rgba(4, 20, 38, .16) 100%);
}

.gatewayExplora .gatewayOverlay { background: linear-gradient(0deg, rgba(3, 10, 25, .97), rgba(13, 40, 71, .35) 65%, rgba(45, 23, 71, .18)); }

.gatewayContent {
    position: absolute;
    inset: auto 34px 31px;
    display: grid;
    justify-items: start;
}

.gatewayIcon { width: 54px; height: 54px; display: grid; place-items: center; margin-bottom: 15px; border: 1px solid var(--gold-300); border-radius: 50%; color: var(--gold-300); font-size: 27px; }
.gatewayContent strong { color: var(--gold-300); font: 700 clamp(36px, 4vw, 58px)/1 var(--font-display); letter-spacing: -.025em; }
.gatewayContent small { margin-top: 9px; color: #e7eef6; font-size: 17px; }
.gatewayAction { margin-top: 20px; color: var(--gold-300); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; }
.gatewayAction b { display: inline-grid; place-items: center; width: 35px; height: 35px; margin-left: 10px; border-radius: 50%; color: #071525; background: var(--gold-300); font-size: 19px; }
.gatewayCard:hover > img { transform: scale(1.045); filter: saturate(1.08); }
.gatewayCard:focus-visible { outline: 3px solid var(--gold-300); outline-offset: 3px; }

body[data-template="panorama"] .gatewayGrid { grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--line-gold); border-radius: 25px; overflow: hidden; box-shadow: var(--shadow); }
body[data-template="panorama"] .gatewayCard { min-height: 430px; border: 0; border-radius: 0; box-shadow: none; }
body[data-template="panorama"] .gatewayParticipa { clip-path: polygon(0 0,100% 0,91% 100%,0 100%); margin-right: -5%; z-index: 2; }
body[data-template="panorama"] .gatewayExplora { padding-left: 4%; }

body[data-template="editorial"] .gatewayGrid { grid-template-columns: 1.25fr .75fr; }
body[data-template="editorial"] .gatewayParticipa { min-height: 500px; }
body[data-template="editorial"] .gatewayExplora { min-height: 500px; }

.exploraHero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at 76% 34%, rgba(68, 114, 193, .28), transparent 29%), radial-gradient(circle at 88% 65%, rgba(145, 70, 173, .2), transparent 26%);
}

.exploraGlow { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, transparent, rgba(26, 89, 126, .2)); }
.participaBlocks, .exploreBody { padding-block: 54px 90px; }
.participaBlocks { display: flex; flex-direction: column; gap: 58px; }
.contentBlock.isHidden { display: none; }

.sectionHeading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.sectionHeading h2, .exploreIntro h2, .exploreToolbar h2 {
    margin: 0;
    color: var(--cream);
    font: 700 clamp(30px, 3.3vw, 48px)/1.12 var(--font-display);
}

.card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(145deg, rgba(10, 34, 59, .98), rgba(4, 18, 34, .98));
    box-shadow: 0 18px 50px rgba(0, 0, 0, .23);
}

.featuredEvent { min-height: 340px; overflow: hidden; }
.featuredInner { display: grid; grid-template-columns: 1.1fr .9fr; min-height: 340px; }
.featuredCopy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 42px; }
.featuredCopy h3 { margin: 6px 0 17px; font: 700 clamp(31px, 4vw, 54px)/1.08 var(--font-display); }
.featuredMeta { display: flex; flex-wrap: wrap; gap: 11px 18px; color: #dbe7f2; }
.featuredImage { min-height: 310px; overflow: hidden; background: #0c2a47; }
.featuredImage img { width: 100%; height: 100%; object-fit: cover; display: block; }
.autoPoster { height: 100%; min-height: 310px; display: grid; place-items: center; padding: 28px; color: var(--cream); background: radial-gradient(circle at top, #1d507a, #071b31 62%); text-align: center; font: 700 35px/1.12 var(--font-display); }

.groupLayout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, .6fr); gap: 18px; }
.groupRanking { padding: 18px; }
.rankRow { display: grid; grid-template-columns: 42px 48px minmax(120px, 1fr) 100px; gap: 13px; align-items: center; padding: 13px 10px; border-bottom: 1px solid rgba(255,255,255,.07); }
.rankRow:last-child { border-bottom: 0; }
.rankPosition { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; background: #1b3854; font-family: var(--font-display); font-weight: 700; font-variant-numeric: tabular-nums; }
.rankPosition.gold { color: #071525; background: var(--gold-500); }
.rankIcon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; font-size: 22px; }
.rankTrack { height: 8px; margin-top: 7px; overflow: hidden; border-radius: 99px; background: rgba(0,0,0,.3); }
.rankTrack span { display: block; height: 100%; border-radius: inherit; }
.rankPoints { text-align: right; color: var(--gold-300); font-family: var(--font-display); font-size: 21px; font-weight: 700; font-variant-numeric: tabular-nums; }

.leaderCard { padding: 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: radial-gradient(circle at top, rgba(217,161,58,.18), rgba(4,18,34,.98) 58%); }
.leaderTrophy { font-size: 70px; }
.leaderCard h3 { margin: 10px 0 4px; font: 700 34px var(--font-display); }
.leaderCard strong { color: var(--gold-300); font-size: 28px; }

.studentRanking { padding: 12px 20px; }
.studentRow { display: grid; grid-template-columns: 42px 46px minmax(120px, 1fr) 100px; gap: 13px; align-items: center; padding: 12px 4px; border-bottom: 1px solid rgba(255,255,255,.07); }
.studentRow:last-child { border-bottom: 0; }
.studentInstrument { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.04); font-size: 21px; }
.studentAttendances { color: var(--gold-300); text-align: right; font-weight: 800; }

.searchPanel { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; padding: 36px; align-items: center; }
.searchPanel h2 { margin: 4px 0 10px; font: 700 40px var(--font-display); }
.searchPanel p { color: var(--muted); }
.studentSearchBox { padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.035); }
.studentSearchBox label, .adminContent label, .loginPanel label { display: grid; gap: 7px; color: #dce6f0; font-weight: 680; font-size: 14px; }
.studentSearchBox > div { display: flex; gap: 8px; margin-top: 9px; }
.studentSearchBox input { flex: 1; }
.studentResult { min-height: 25px; margin: 15px 0 0; color: var(--muted); }
.studentResult.resultFound { color: var(--cream); }

.field {
    width: 100%;
    min-width: 0;
    padding: 12px 13px;
    border: 1px solid #385777;
    border-radius: 10px;
    color: var(--white);
    background: #0d2946;
}

.field::placeholder { color: #859bb0; }
.field:focus { outline: 2px solid var(--gold-500); border-color: transparent; }
textarea.field { resize: vertical; line-height: 1.5; }
select.field { appearance: auto; }

.spotifyPanel { padding: 22px; }
.spotifyHead { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 15px; }
.spotifyHead h3 { margin: 0; font: 700 28px var(--font-display); }
.spotifyEmbed { width: 100%; height: 352px; border: 0; border-radius: 14px; background: #06182d; }
.playlistTabs { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; padding-bottom: 5px; }
.playlistTabs button { flex: 0 0 auto; padding: 8px 13px; border: 1px solid var(--line); border-radius: 99px; color: white; background: rgba(255,255,255,.05); cursor: pointer; }
.playlistTabs button.active { color: #071525; background: var(--gold-300); }
.emptyState { grid-column: 1/-1; padding: 34px; border: 1px dashed var(--line); border-radius: 15px; color: var(--muted); text-align: center; }

.agendaTabs { display: inline-flex; margin-bottom: 18px; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: rgba(0,0,0,.15); }
.agendaTabs button { padding: 9px 15px; border: 0; border-radius: 8px; color: #dce6ef; background: transparent; cursor: pointer; }
.agendaTabs button.active { color: #071525; background: var(--gold-300); font-weight: 700; }
.agendaTabs span { display: inline-grid; place-items: center; min-width: 22px; height: 22px; margin-left: 5px; border-radius: 50%; background: rgba(0,0,0,.18); }
.eventGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.eventCard { overflow: hidden; }
.eventPoster { aspect-ratio: 4/3; overflow: hidden; background: #102c49; }
.eventPoster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eventPosterPdf { height: 100%; display: grid; place-items: center; color: var(--gold-300); font: 600 25px var(--font-display); }
.eventCardBody { padding: 18px; }
.eventCardBody h3 { margin: 0 0 10px; color: var(--gold-300); font: 600 var(--text-card-title)/1.2 var(--font-display); }
.eventCardBody p { color: var(--muted); font-size: 14px; }

.exploreIntro { max-width: 850px; margin-bottom: 24px; }
.exploreIntro p { color: var(--muted); font-size: 18px; }
.categoryGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 28px 0 60px; }
.categoryCard { min-height: 210px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; color: white; background: linear-gradient(145deg, rgba(13,45,72,.98), rgba(5,20,37,.98)); text-align: left; cursor: pointer; box-shadow: 0 16px 40px rgba(0,0,0,.2); }
.categoryCard:nth-child(2) { background: linear-gradient(145deg, rgba(26,45,86,.98), rgba(8,18,39,.98)); }
.categoryCard:nth-child(3) { background: linear-gradient(145deg, rgba(55,34,82,.92), rgba(14,18,42,.98)); }
.categoryCard:nth-child(4) { background: linear-gradient(145deg, rgba(61,36,57,.9), rgba(14,20,38,.98)); }
.categoryCard:hover, .categoryCard.active { border-color: var(--gold-300); transform: translateY(-2px); }
.categoryCard .categoryIcon { display: block; margin-bottom: 28px; font-size: 34px; }
.categoryCard strong { display: block; color: var(--gold-300); font: 700 27px/1.12 var(--font-display); }
.categoryCard small { display: block; margin-top: 10px; color: #cbd7e3; font-size: 14px; }
.exploreToolbar { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 20px; }
.contentGrid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.contentCard { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; color: white; background: linear-gradient(145deg, rgba(10,34,59,.98), rgba(4,18,34,.98)); text-align: left; cursor: pointer; box-shadow: 0 18px 48px rgba(0,0,0,.22); }
.contentCard:hover { transform: translateY(-3px); border-color: var(--line-gold); }
.contentCover { position: relative; height: 220px; overflow: hidden; background: radial-gradient(circle at center, #164369, #06172a 70%); }
.contentCover img { width: 100%; height: 100%; object-fit: cover; }
.contentCoverMark { height: 100%; display: grid; place-items: center; color: var(--gold-300); font: 700 34px var(--font-display); text-align: center; }
.contentCardBody { padding: 21px; }
.contentCardBody h3 { margin: 0 0 8px; font: 700 27px/1.12 var(--font-display); }
.contentCardBody p { color: var(--muted); }
.contentReadMore { color: var(--gold-300); font-family: var(--font-display); font-size: 13px; font-weight: 600; }

footer { padding: 45px 0 25px; border-top: 1px solid var(--line); background: rgba(0,5,11,.36); }
.footerGrid { display: grid; grid-template-columns: 1.1fr .8fr 1fr; gap: 34px; }
.footerBrand { display: flex; align-items: center; gap: 14px; font-family: var(--font-display); }
.footerBrand img { width: 72px; }
footer p { color: var(--muted); line-height: 1.7; }
footer button { padding: 0; border: 0; color: var(--gold-300); background: transparent; cursor: pointer; }
.socialLink { display: inline-block; margin: 6px 10px 0 0; color: var(--gold-300); text-decoration: none; }
.footerCopy { margin-top: 24px; padding-top: 19px; border-top: 1px solid rgba(255,255,255,.08); color: #8298ad; text-align: center; font-size: 13px; }
.projectCredit { width: min(var(--wrap), calc(100% - 32px)); margin: 12px auto 0; color: rgba(169,185,201,.62); font-size: 10px; line-height: 1.35; letter-spacing: .015em; text-align: right; }
.projectCredit span { display: block; }
.bottomNav { display: none; }

.overlay {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    overflow: auto;
    background: radial-gradient(circle at top left, #123b60, #041426 45%, #020a13);
}
.overlay.show { display: block; }
.overlayHeader { position: sticky; top: 0; z-index: 2; border-bottom: 1px solid var(--line); background: rgba(2,12,24,.94); backdrop-filter: blur(15px); }
.overlayNav { min-height: 76px; display: flex; align-items: center; justify-content: space-between; }
.overlayNav .brand img { width: 48px; height: 48px; }
.article { max-width: 980px; padding-block: 55px 90px; }
.article h1 { margin: 10px 0 15px; color: var(--cream); font: 800 clamp(42px,6vw,70px)/1.08 var(--font-display); }
.articleLead { color: #e3ebf3; font-size: 21px; }
.articleBody { margin-top: 28px; color: #e8eff6; font-size: 18px; line-height: 1.8; white-space: pre-wrap; }
.articleMedia { max-width: 760px; margin-bottom: 30px; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; }
.articleMedia img { width: 100%; display: block; }
.articleActions { display: flex; flex-wrap: wrap; gap: 10px; margin: 25px 0; }
.embedFrame, .widgetFrame { width: 100%; border: 1px solid var(--line); border-radius: 16px; background: #06182d; }
.embedFrame { height: 72vh; min-height: 520px; }
.widgetFrame { height: 430px; }

.modalDialog, .adminDialog {
    color: var(--white);
    border: 1px solid var(--line);
    background: #06182d;
    box-shadow: var(--shadow);
}
.modalDialog::backdrop, .adminDialog::backdrop { background: rgba(0,0,0,.78); backdrop-filter: blur(5px); }
.modalDialog { width: min(900px, 94vw); max-height: 88vh; padding: 28px; border-radius: 18px; }
.dialogClose { float: right; }
.dialogTable { width: 100%; border-collapse: collapse; margin-top: 20px; }
.dialogTable th, .dialogTable td { padding: 10px; border-bottom: 1px solid var(--line); text-align: left; }

.adminDialog { width: min(1480px, 97vw); height: min(900px, 95vh); max-width: none; max-height: none; padding: 0; overflow: hidden; border-radius: 22px; }
.adminShell { height: 100%; display: flex; flex-direction: column; background: linear-gradient(145deg, #081e35, #041321); }
.adminHeader { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 25px; border-bottom: 1px solid var(--line); }
.adminHeader h2 { margin: 0; font: 700 34px var(--font-display); }
.adminHeader .sectionKicker { margin: 0; }

.loginPanel {
    flex: 1;
    width: min(1080px, calc(100% - 42px));
    margin: auto;
    padding: clamp(26px, 4vh, 54px) 0;
    display: grid;
    gap: clamp(22px, 3vw, 34px);
    align-content: center;
    overflow: auto;
}
.loginIntro {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 20px;
    align-items: center;
    max-width: 780px;
    padding: 0;
}
.loginIcon { display: grid; place-items: center; width: 68px; height: 68px; border: 1px solid var(--line-gold); border-radius: 50%; color: var(--gold-300); background: rgba(239,189,85,.045); font-size: 33px; }
.loginIntro h3 { margin: 5px 0 7px; color: var(--cream); font: 760 clamp(32px, 4vw, 48px)/1.02 var(--font-display); }
.loginIntro p { max-width: 66ch; margin: 0; color: var(--muted); line-height: 1.55; }
.loginAccessGrid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(300px, .92fr); gap: clamp(18px, 2.4vw, 28px); align-items: stretch; }
.loginAccessCard {
    min-width: 0;
    min-height: 390px;
    display: grid;
    align-content: start;
    gap: 16px;
    padding: clamp(24px, 3vw, 34px);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.022));
    box-shadow: 0 18px 48px rgba(0,0,0,.18);
}
.managementAccessCard { grid-template-rows: auto auto auto auto 1fr; }
.loginAccessHeading { display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 14px; align-items: center; margin-bottom: 4px; }
.loginAccessNumber { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid var(--line-gold); border-radius: 15px; color: var(--gold-300); background: rgba(239,189,85,.06); font: 800 14px var(--font-display); letter-spacing: .08em; }
.loginAccessHeading strong { display: block; color: var(--cream); font: 760 24px/1.1 var(--font-display); }
.loginAccessHeading small { display: block; margin-top: 5px; color: var(--muted); line-height: 1.4; }
.loginAccessCard label { align-self: start; }
.loginAccessCard .formMessage { align-self: end; margin: 0; }
.formMessage { min-height: 21px; color: var(--muted); }
.formMessage.error { color: var(--danger); }
.formMessage.success { color: var(--success); }

.adminWorkspace { flex: 1; min-height: 0; display: grid; grid-template-columns: 245px minmax(0,1fr); }
.adminSidebar { overflow-y: auto; padding: 18px 12px; border-right: 1px solid var(--line); background: rgba(0,0,0,.15); }
.adminSidebar button { width: 100%; margin-bottom: 6px; padding: 11px 13px; border: 1px solid transparent; border-radius: 9px; color: #d8e3ed; background: transparent; text-align: left; cursor: pointer; }
.adminSidebar button:hover, .adminSidebar button.active { border-color: var(--line-gold); color: var(--gold-300); background: rgba(217,161,58,.07); }
.adminSidebar .logoutButton { margin-top: 20px; color: #ffb0b0; }
.adminContent { min-width: 0; overflow: auto; padding: 28px; }
.adminPanel { display: none; max-width: 1120px; margin-inline: auto; }
.adminPanel.active { display: block; }
.adminTitle { display: flex; align-items: start; justify-content: space-between; gap: 22px; margin-bottom: 22px; }
.adminTitle h3 { margin: 0 0 4px; color: var(--cream); font: 700 38px var(--font-display); }
.adminTitle p, .adminHint { margin: 4px 0; color: var(--muted); }

.pagePreviewGrid { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; margin-bottom: 18px; }
.pagePreview { padding: 0 0 14px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; color: white; background: rgba(255,255,255,.03); text-align: left; cursor: pointer; }
.pagePreview.active { border-color: var(--gold-300); box-shadow: 0 0 0 2px rgba(217,161,58,.12); }
.previewImage { display: block; height: 92px; margin-bottom: 12px; background-position: center; background-size: cover; }
.pagePreview strong, .pagePreview small { display: block; margin-inline: 14px; }
.pagePreview strong { color: var(--gold-300); font-size: 17px; }
.pagePreview small { margin-top: 3px; color: var(--muted); }

.designEditorCard, .editorCard, .dropPanel {
    padding: 23px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255,255,255,.028);
}
.designEditorCard h4, .editorCard h4 { margin: 0 0 16px; color: var(--cream); font: 700 25px var(--font-display); }
.designPagePanel { display: none; }
.designPagePanel.active { display: block; }
.formGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.fullField { grid-column: 1/-1; }
.formTop { margin-top: 18px; }
fieldset { margin: 0; padding: 17px; border: 1px solid var(--line); border-radius: 13px; }
fieldset legend { padding: 0 7px; color: var(--gold-300); font-weight: 800; }
fieldset label + label { margin-top: 11px; }
.fileLabel { margin-top: 18px; }
.blockEditor { display: grid; gap: 9px; margin: 17px 0; }
.blockEditorRow { display: grid; grid-template-columns: auto 1fr auto auto; gap: 9px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: rgba(0,0,0,.12); }
.blockEditorRow .moveButtons { display: flex; gap: 5px; }
.iconButton { width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 8px; color: white; background: rgba(255,255,255,.04); cursor: pointer; }
.editorFooter { display: flex; align-items: center; gap: 15px; margin-top: 15px; }
.editorActions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.advancedField { grid-column: 1/-1; }

.switchLabel { display: flex !important; grid-template-columns: none !important; flex-direction: row; align-items: center; gap: 10px; margin-top: 16px; cursor: pointer; }
.switchLabel input { position: absolute; opacity: 0; pointer-events: none; }
.switchLabel span { position: relative; width: 44px; height: 24px; border-radius: 99px; background: #314b62; transition: background .2s ease; }
.switchLabel span::after { content: ""; position: absolute; width: 18px; height: 18px; left: 3px; top: 3px; border-radius: 50%; background: white; transition: transform .2s ease; }
.switchLabel input:checked + span { background: var(--gold-500); }
.switchLabel input:checked + span::after { transform: translateX(20px); }

.adminList { display: grid; gap: 10px; margin-top: 18px; }
.adminListItem { display: grid; grid-template-columns: 72px minmax(0,1fr) auto; gap: 13px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.025); }
.adminThumb { width: 72px; height: 58px; overflow: hidden; border-radius: 9px; background: #0d2a46; }
.adminThumb img { width: 100%; height: 100%; object-fit: cover; }
.adminListItem h4 { margin: 0 0 3px; }
.adminListItem p { margin: 0; color: var(--muted); font-size: 13px; }
.adminItemActions { display: flex; gap: 7px; }

.groupsEditor { display: grid; gap: 11px; margin-bottom: 13px; }
.groupEditorRow { display: grid; grid-template-columns: 1.1fr 110px 72px 78px 1.7fr auto; gap: 9px; align-items: end; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.025); }
.groupEditorRow label { min-width: 0; }
.groupEditorRow input[type="color"] { min-height: 44px; padding: 3px; }
.dropPanel { max-width: 720px; display: grid; gap: 16px; }
.dropZone { min-height: 170px; display: flex !important; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed var(--line-gold); border-radius: 14px; color: var(--gold-300) !important; background: rgba(217,161,58,.045); cursor: pointer; text-align: center; }
.dropZone span { margin-top: 5px; color: var(--muted); font-weight: 500; }
.dropZone input { margin-top: 15px; }
.searchAdmin { display: flex; gap: 9px; margin-bottom: 14px; }
.searchAdmin input { flex: 1; }
.tableWrap { overflow: auto; border: 1px solid var(--line); border-radius: 13px; }
.adminTable { width: 100%; min-width: 760px; border-collapse: collapse; }
.adminTable th, .adminTable td { padding: 11px 12px; border-bottom: 1px solid rgba(255,255,255,.08); text-align: left; }
.adminTable th { color: var(--gold-300); background: rgba(0,0,0,.15); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.adminTable tr:last-child td { border-bottom: 0; }
.securityGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.securityGrid .editorCard { display: grid; gap: 13px; align-content: start; }

.toast { position: fixed; z-index: 120; right: 20px; bottom: 20px; max-width: 380px; padding: 13px 17px; border: 1px solid var(--line); border-radius: 11px; color: white; background: #0d2a46; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transform: translateY(12px); transition: opacity .2s ease, transform .2s ease; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { border-color: rgba(255,139,139,.5); background: #4a2028; }

@media (max-width: 1100px) {
    .eventGrid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .categoryGrid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .contentGrid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .adminWorkspace { grid-template-columns: 210px minmax(0,1fr); }
    .groupEditorRow { grid-template-columns: 1fr 100px 68px 75px; }
    .groupEditorRow .departmentsField { grid-column: 1/-2; }
}

@media (max-width: 850px) {
    .wrap { width: min(100% - 28px, 1380px); }
    .desktopNav, .privateButton { display: none; }
    .navBar { min-height: 74px; }
    .brand { flex: 1; }
    .brand img { width: 49px; height: 49px; }
    .brand span { font-size: 12px; }
    .mobileMenuButton { display: block; }
    .mobileMenu.open { display: grid; padding: 7px 14px 15px; border-top: 1px solid var(--line); }
    .mobileMenu button { padding: 12px; border: 0; border-bottom: 1px solid rgba(255,255,255,.07); color: white; background: transparent; text-align: left; }
    .entryHero { min-height: 440px; }
    .entryShade { background: linear-gradient(0deg, var(--navy-900), rgba(2,10,19,.48) 65%, rgba(2,10,19,.32)); }
    .entryHeroContent, .sectionHeroContent { justify-content: flex-end; padding-block: 55px; }
    .gatewayGrid, body[data-template="editorial"] .gatewayGrid { grid-template-columns: 1fr; }
    .gatewayCard, body[data-template="editorial"] .gatewayParticipa, body[data-template="editorial"] .gatewayExplora { min-height: 310px; }
    body[data-template="panorama"] .gatewayGrid { display: grid; grid-template-columns: 1fr; gap: 14px; border: 0; overflow: visible; box-shadow: none; }
    body[data-template="panorama"] .gatewayCard { min-height: 310px; border: 1px solid var(--line-gold); border-radius: 20px; box-shadow: var(--shadow); }
    body[data-template="panorama"] .gatewayParticipa { clip-path: none; margin-right: 0; }
    .featuredInner, .groupLayout, .searchPanel { grid-template-columns: 1fr; }
    .featuredImage { min-height: 260px; order: -1; }
    .footerGrid { grid-template-columns: 1fr 1fr; }
    .footerBrand { grid-column: 1/-1; }
    .adminDialog { width: 100vw; height: 100dvh; border-radius: 0; }
    .adminWorkspace { grid-template-columns: 1fr; grid-template-rows: auto minmax(0,1fr); }
    .adminSidebar { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }
    .adminSidebar button { width: auto; flex: 0 0 auto; margin: 0 5px 0 0; }
    .adminSidebar .logoutButton { margin-top: 0; }
    .loginPanel { width: min(720px, calc(100% - 30px)); gap: 22px; padding-block: 24px; }
    .loginIntro { grid-template-columns: 58px minmax(0,1fr); gap: 15px; padding: 0; }
    .loginIcon { width: 56px; height: 56px; font-size: 27px; }
    .loginIntro h3 { font-size: 34px; }
    .loginAccessGrid { grid-template-columns: 1fr; }
    .loginAccessCard { min-height: 0; }
        .pagePreviewGrid { grid-template-columns: 1fr; }
    .pagePreview { display: grid; grid-template-columns: 110px 1fr; align-items: center; padding: 0; }
    .previewImage { grid-row: 1/3; height: 82px; margin: 0 12px 0 0; }
    .pagePreview strong, .pagePreview small { margin: 0; }
    .formGrid, .securityGrid { grid-template-columns: 1fr; }
    .fullField, .advancedField { grid-column: auto; }
}

@media (max-width: 620px) {
    body { padding-bottom: 68px; }
    .entryHero { min-height: 390px; }
    .entryHero h1, .sectionHero h1 { font-size: 48px; }
    .entryHeroContent > p:last-child, .sectionHeroContent > p:last-child { font-size: 19px; }
    .sectionHero { min-height: 330px; }
    .gatewayArea { padding-bottom: 48px; }
    .gatewayCard { min-height: 265px; }
    .gatewayContent { inset: auto 21px 22px; }
    .gatewayIcon { width: 44px; height: 44px; margin-bottom: 10px; }
    .gatewayContent strong { font-size: 35px; }
    .gatewayContent small { font-size: 15px; }
    .participaBlocks, .exploreBody { padding-block: 37px 55px; }
    .participaBlocks { gap: 42px; }
    .sectionHeading { align-items: start; flex-direction: column; }
    .featuredCopy { padding: 25px; }
    .featuredMeta { display: grid; }
    .rankRow { grid-template-columns: 34px 40px minmax(0,1fr) 70px; gap: 7px; padding-inline: 2px; }
    .rankIcon { width: 36px; height: 36px; }
    .rankPoints { font-size: 16px; }
    .studentRanking { padding-inline: 12px; }
    .studentRow { grid-template-columns: 34px 38px minmax(0,1fr) 62px; gap: 7px; }
    .studentSearchBox > div { flex-direction: column; }
    .searchPanel { padding: 23px; }
    .eventGrid, .categoryGrid, .contentGrid { grid-template-columns: 1fr; }
    .categoryGrid { margin-bottom: 45px; }
    .categoryCard { min-height: 165px; }
    .categoryCard .categoryIcon { margin-bottom: 16px; }
    .contentCover { height: 195px; }
    .footerGrid { grid-template-columns: 1fr; }
    .footerBrand { grid-column: auto; }
    .bottomNav { position: fixed; z-index: 45; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(5,1fr); min-height: 66px; padding-bottom: env(safe-area-inset-bottom); border-top: 1px solid var(--line); background: rgba(2,12,24,.96); backdrop-filter: blur(16px); }
    .bottomNav button { display: grid; place-items: center; align-content: center; gap: 2px; border: 0; color: #aebfd0; background: transparent; font-size: 11px; }
    .bottomNav button span { font-size: 21px; line-height: 1; }
    .bottomNav button.active { color: var(--gold-300); }
    .article { width: min(100% - 28px, 980px); padding-top: 38px; }
    .embedFrame { min-height: 410px; }
    .adminHeader { min-height: 73px; padding: 12px 16px; }
    .adminHeader h2 { font-size: 27px; }
    .adminContent { padding: 18px 13px; }
    .adminTitle { flex-direction: column; }
    .adminTitle h3 { font-size: 32px; }
    .designEditorCard, .editorCard, .dropPanel { padding: 16px; }
    .blockEditorRow { grid-template-columns: auto 1fr auto; }
    .blockEditorRow .moveButtons { grid-column: 2/4; justify-content: flex-end; }
    .adminListItem { grid-template-columns: 58px minmax(0,1fr); }
    .adminThumb { width: 58px; }
    .adminItemActions { grid-column: 1/-1; justify-content: flex-end; }
    .groupEditorRow { grid-template-columns: 1fr 85px; }
    .groupEditorRow .departmentsField { grid-column: 1/-1; }
    .searchAdmin { flex-direction: column; }
    .toast { left: 12px; right: 12px; bottom: 82px; max-width: none; }
}

/* v5.5 RC2 · tarjetas del Gestor de contenidos unificadas con la agenda */
.exploreContentsModule .contentGrid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.managedContentCard { position: relative; min-height: 370px; display: block; overflow: hidden; padding: 0; border-radius: 22px; isolation: isolate; }
.managedContentBackground { position: absolute; inset: 0; z-index: -3; display: block; overflow: hidden; background: radial-gradient(circle at center,#164369,#06172a 70%); }
.managedContentBackground > img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .5s ease; }
.managedContentBackground > .contentCoverMark { width: 100%; height: 100%; }
.managedContentShade { position: absolute; inset: 0; z-index: -2; display: block; background: linear-gradient(90deg,rgba(3,10,17,.22),rgba(3,10,17,.54)),linear-gradient(0deg,rgba(2,8,14,.72),transparent 65%); }
.managedContentInfo { position: absolute; z-index: 2; top: 24px; right: 24px; bottom: 24px; width: min(62%,430px); display: flex; flex-direction: column; justify-content: center; overflow: auto; padding: 24px; border-radius: 17px; color: #fff; background: rgba(7,9,12,.84); backdrop-filter: blur(4px); }
.managedContentInfo h3 { margin: 0 0 10px; color: var(--gold-300); font: 750 clamp(23px,2.35vw,34px)/1.08 var(--font-display); }
.managedContentInfo p { margin: 0 0 18px; display: -webkit-box; overflow: hidden; color: #edf2f6; font-size: 15px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 5; }
.managedContentInfo .contentReadMore { margin-top: auto; padding-top: 8px; color: var(--gold-300); font-weight: 800; }
.managedContentCard:hover .managedContentBackground > img { transform: scale(1.025); }
body[data-theme="light"] .managedContentCard { color: #fff; background: #0a1724; }
.exploreContentsModule { scroll-margin-top: 110px; }
.exploreContentsModule.categoryFocused { position: relative; }
.exploreContentsModule.categoryFocused::before { content: ""; position: absolute; inset: -17px; z-index: -1; border: 1px solid rgba(217,161,58,.32); border-radius: 22px; background: linear-gradient(145deg,rgba(217,161,58,.045),transparent 52%); animation: categoryFocusGlow .65s ease both; }
.contentGrid.isRefreshing > * { animation: managedCardArrival .48s ease both; }
.contentGrid.isRefreshing > :nth-child(2) { animation-delay: .06s; }
.contentGrid.isRefreshing > :nth-child(3) { animation-delay: .12s; }
.contentGrid.isRefreshing > :nth-child(4) { animation-delay: .18s; }
@keyframes managedCardArrival { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes categoryFocusGlow { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: scale(1); } }

@media (max-width: 850px) {
    .exploreContentsModule .contentGrid { grid-template-columns: 1fr; }
    .managedContentCard { min-height: 390px; }
    .managedContentInfo { width: min(70%,390px); }
}

@media (max-width: 620px) {
    .managedContentCard { min-height: 400px; border-radius: 18px; }
    .managedContentInfo { top: auto; right: 14px; bottom: 14px; left: 14px; width: auto; max-height: calc(100% - 28px); padding: 18px; border-radius: 14px; }
    .managedContentInfo h3 { font-size: clamp(22px,7vw,29px); }
    .managedContentInfo p { font-size: 14px; -webkit-line-clamp: 4; }
    .exploreContentsModule { scroll-margin-top: 82px; }
}

@media (prefers-reduced-motion: reduce) {
    .contentGrid.isRefreshing > *, .exploreContentsModule.categoryFocused::before { animation: none; }
}

/* v5.5 · ponderaciones, herramientas y edición visual con contenido real */
.advancedOptions { padding: 11px 13px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.025); }
.advancedOptions summary { cursor: pointer; color: var(--gold-300); font-weight: 800; }
.advancedOptions[open] summary { margin-bottom: 12px; }
.advancedOptions label { display: grid; gap: 6px; }
.advancedOptions small { color: var(--muted); line-height: 1.4; }
.configurationNotice { margin-bottom: 16px; padding: 14px 16px; border: 1px solid #bd744a; border-radius: 12px; color: #ffe1c7; background: rgba(154,67,36,.18); }
.configurationNotice strong { color: #ffd18a; }
.configurationNotice ul { margin: 8px 0 0; padding-left: 19px; }
.configurationNotice.isReady { border-color: #3f9775; color: #d9ffef; background: rgba(39,116,83,.18); }
.configurationNotice.isReady strong { color: #82e0b6; }
.configurationNotice p { margin: 5px 0 0; }

.groupsEditor { display: grid; gap: 15px; }
.groupEditorRow.competitionGroupCard { display: grid; grid-template-columns: 1fr; gap: 14px; padding: 16px; }
.competitionGroupHead { display: grid; grid-template-columns: minmax(220px,1fr) 90px 100px auto; gap: 10px; align-items: end; }
.departmentEditor { display: grid; gap: 9px; padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: rgba(0,0,0,.13); }
.departmentEditorTitle { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 7px; color: var(--muted); }
.departmentEditorTitle strong { color: var(--white); }
.departmentRow { display: grid; grid-template-columns: minmax(210px,1fr) minmax(140px,.35fr) minmax(145px,.3fr) auto; gap: 9px; align-items: end; }
.departmentWeight { min-height: 47px; display: grid; align-content: center; color: var(--muted); font-size: 11px; }
.departmentWeight output { color: var(--gold-300); font-size: 14px; font-weight: 800; }
.weightSummary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 18px; padding: 13px; border-radius: 11px; color: var(--muted); background: rgba(217,161,58,.08); }
.weightSummary strong { display: block; color: var(--gold-300); font-size: 20px; }
.weightSummary small { grid-column: 1/-1; }

.eventPosterPreview { min-height: 130px; margin-top: 14px; display: grid; grid-template-columns: minmax(180px,360px) 1fr; align-items: center; gap: 14px; padding: 10px; border: 1px dashed var(--line); border-radius: 12px; color: var(--muted); }
.eventPosterPreview img { width: 100%; height: 150px; object-fit: cover; border-radius: 9px; }

.toolsGrid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
.exploreToolsModule.noPublishedTools { display: none !important; }
.toolCard { min-width: 0; display: grid; grid-template-rows: 170px 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; color: var(--white); background: linear-gradient(145deg,#0d2b48,#06182d); text-decoration: none; box-shadow: var(--shadow); }
.toolCardImage { display: grid; place-items: center; overflow: hidden; color: var(--gold-300); font-size: 55px; background: radial-gradient(circle,#16476f,#07192b); }
.toolCardImage img { width: 100%; height: 100%; object-fit: cover; }
.toolCardBody { display: grid; align-content: start; gap: 8px; padding: 17px; }
.toolCardBody small,.toolCardBody b { color: var(--gold-300); }
.toolCardBody h3,.toolCardBody p { margin: 0; }
.toolCardBody p { color: var(--muted); line-height: 1.45; }
.toolPermissions { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 15px; }

.layoutEditorModule { grid-template-rows: auto auto minmax(120px,1fr) auto auto; }
.layoutLivePreview { grid-column: 1/-1; position: relative; min-height: 120px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; background: var(--navy-950); pointer-events: none; }
.layoutLivePreview > * { width: 166.666%; min-height: 220px !important; margin: 0 !important; transform: scale(.6); transform-origin: left top; }
.visualLayoutEditor[data-device="mobile"] { max-width: 470px; margin-inline: auto; grid-template-columns: 1fr; border-width: 2px; background: #020b14; box-shadow: 0 0 0 8px #151b21; }
.visualLayoutEditor[data-device="mobile"] .layoutEditorModule { grid-column: 1 !important; }
.visualLayoutEditor[data-device="mobile"] .layoutLivePreview > * { width: 138.9%; transform: scale(.72); }

body[data-theme="light"] .toolCard { color: #172b40; border-color: #cdd9e4; background: white; }
body[data-theme="light"] .departmentEditorTitle strong { color: #17324c; }

@media (max-width: 850px) {
    .toolsGrid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .competitionGroupHead { grid-template-columns: 1fr 90px 90px; }
    .competitionGroupHead .iconButton { grid-column: 3; }
}

@media (max-width: 620px) {
    .competitionGroupHead { grid-template-columns: 1fr 80px; }
    .competitionGroupHead > label:first-child { grid-column: 1/-1; }
    .competitionGroupHead .iconButton { grid-column: auto; }
    .departmentRow { grid-template-columns: 1fr 96px auto; }
    .departmentRow > label:first-child { grid-column: 1/-1; }
    .departmentWeight { grid-column: 1/3; }
    .weightSummary { grid-template-columns: 1fr; }
    .weightSummary small { grid-column: 1; }
    .eventPosterPreview { grid-template-columns: 1fr; }
    .toolsGrid { grid-template-columns: 1fr; }
    .toolCard { grid-template-columns: 110px 1fr; grid-template-rows: 1fr; }
    .toolCardImage { min-height: 150px; }
}

body[data-theme="light"] .contentCard.managedContentCard {
    color: #fff;
    border-color: rgba(217,161,58,.5);
    background: #0a1724;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* v5.1 · Identidad institucional y diseño mobile first */
.navBar {
    display: grid;
    grid-template-columns: minmax(250px, 1fr) auto minmax(250px, 1fr);
    min-height: 86px;
    gap: 18px;
}

.schoolBrand {
    grid-column: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-width: 390px;
    padding: 7px 16px;
    border: 0;
    color: var(--cream);
    background: transparent;
}

.schoolInitials, .footerInitials {
    display: inline-flex;
    align-items: baseline;
    white-space: nowrap;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 34px;
    line-height: .9;
    letter-spacing: -.055em;
}

.schoolInitials b, .footerInitials b { color: #f3f6fa; }
.schoolInitials strong, .footerInitials strong { color: var(--gold-500); }
.schoolFullName { color: #e4ebf2; font-size: 11px; line-height: 1.25; text-align: left; text-transform: uppercase; letter-spacing: .13em; }
.desktopNav { grid-column: 1; grid-row: 1; justify-content: flex-start; }
.headerActions { grid-column: 3; grid-row: 1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.mobileMenuButton { grid-column: 1; grid-row: 1; }

.entryShell {
    position: relative;
    min-height: calc(100dvh - 87px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 16px;
    padding-block: clamp(18px, 3vh, 34px);
}

.entryIntro { display: flex; align-items: end; justify-content: space-between; gap: 25px; }
.entryIntro .eyebrow { flex: 0 0 auto; margin-bottom: 5px; }
.entryIntro h1 { margin: 0; color: var(--cream); font: 800 clamp(31px, 3.7vw, 52px)/1.08 var(--font-display); letter-spacing: -.035em; }
.entryIntro > p:last-child { max-width: 540px; margin: 0; color: var(--muted); text-align: right; }
.gatewayArea { padding: 0; }
.gatewayQuestion { display: none; }
.gatewayGrid, body[data-template="panorama"] .gatewayGrid, body[data-template="editorial"] .gatewayGrid {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
    gap: 16px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.gatewayCard,
body[data-template="panorama"] .gatewayCard,
body[data-template="editorial"] .gatewayParticipa,
body[data-template="editorial"] .gatewayExplora {
    min-height: 0;
    height: 100%;
    border: 1px solid var(--line-gold);
    border-radius: 24px;
    box-shadow: var(--shadow);
    clip-path: none;
    margin: 0;
    padding: 0;
}

body[data-template="panorama"] .gatewayParticipa,
body[data-template="panorama"] .gatewayExplora { clip-path: none; margin: 0; padding: 0; }
.gatewayContent { inset: 26px; align-content: end; }
.gatewayParticipa .gatewayContent { inset: 25px 30px; grid-template-rows: auto auto auto 1fr auto; align-content: stretch; }
.programIdentity { align-self: start; display: grid; gap: 4px; }
.programIdentity > span { color: var(--gold-300); font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.programIdentity strong { max-width: 760px; color: var(--cream); font: 800 clamp(35px, 5vw, 70px)/1.02 var(--font-display); letter-spacing: -.035em; }
.gatewayProgramLogo { width: clamp(118px,12vw,168px); height: auto; border-radius: 8px; object-fit: contain; object-position: left center; }
.gatewayParticipa .gatewayContent > small { max-width: 570px; color: #f4deb0; font-size: clamp(15px, 1.55vw, 20px); }
.gatewayLiveData { align-self: end; display: grid; grid-template-columns: 1.35fr .8fr; gap: 9px; width: min(100%, 690px); margin-top: 12px; }
.gatewayLiveItem { min-width: 0; display: grid; gap: 2px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 11px; background: rgba(2,12,24,.72); }
.gatewayLiveItem b { color: var(--gold-300); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.gatewayLiveItem span { overflow: hidden; color: #f3f7fa; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.gatewayParticipa .gatewayAction { margin-top: 12px; }
.gatewayExplora .gatewayContent { inset: auto 25px 25px; }
.gatewayExplora .gatewayContent strong { font-size: clamp(35px, 4vw, 55px); }

.programCarousel {
    position: relative;
    min-height: clamp(450px, 62vh, 700px);
    overflow: hidden;
    isolation: isolate;
    background: #06182d;
}
.programFallback, .programSlide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.programFallback { z-index: -4; }
.programSlides { position: absolute; inset: 0; z-index: -3; }
.programSlide { opacity: 0; transform: scale(1.025); transition: opacity .7s ease, transform 5s ease; }
.programSlide.active { opacity: 1; transform: scale(1); }
.programShade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(2,10,19,.94), rgba(2,10,19,.57) 52%, rgba(2,10,19,.17)), linear-gradient(0deg, #041426 0%, transparent 38%); }
.programHeroContent { min-height: inherit; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-block: 62px; }
.programHeroLogo { width: clamp(230px,25vw,340px); height: auto; object-fit: contain; object-position: left center; margin: 12px 0; border-radius: 12px; filter: drop-shadow(0 4px 12px rgba(0,0,0,.45)); }
.programHeroContent h1 { max-width: 850px; margin: 0; color: var(--cream); font: 800 clamp(50px, 7vw, 84px)/1.02 var(--font-display); letter-spacing: -.04em; }
.programHeroContent > p:not(.programEyebrow) { max-width: 690px; margin: 20px 0 0; color: #f4deb0; font-size: clamp(18px, 2vw, 27px); }
.programEyebrow { margin: 0 0 10px; color: var(--gold-300); font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: .08em; }
.programParticipateButton { margin-top: 24px; }
.carouselButton { position: absolute; z-index: 4; top: 50%; width: 44px; height: 54px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.28); border-radius: 12px; color: white; background: rgba(2,12,24,.6); font-size: 37px; cursor: pointer; transform: translateY(-50%); }
.carouselPrevious { left: 16px; }
.carouselNext { right: 16px; }
.carouselDots { position: absolute; z-index: 4; left: 50%; bottom: 18px; display: flex; gap: 7px; transform: translateX(-50%); }
.carouselDots button { width: 9px; height: 9px; padding: 0; border: 1px solid white; border-radius: 50%; background: transparent; cursor: pointer; }
.carouselDots button.active { border-color: var(--gold-300); background: var(--gold-300); }
.carouselDots:empty, .programCarousel.singleSlide .carouselButton { display: none; }

.footerInitials { font-size: 31px; }
.overlaySchoolBrand { display: flex; align-items: center; gap: 4px; font-size: 24px; }
.overlaySchoolBrand b { color: white; }
.overlaySchoolBrand strong { color: var(--gold-500); }
.overlaySchoolBrand span { margin-left: 9px; color: #d8e3ed; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }

.carouselAdminCard { margin: 18px 0; padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: rgba(0,0,0,.12); }
.carouselEditor { display: grid; gap: 8px; margin-top: 14px; }
.carouselEditorRow { display: grid; grid-template-columns: 82px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 8px; border: 1px solid var(--line); border-radius: 10px; }
.carouselEditorRow img { width: 82px; height: 55px; object-fit: cover; border-radius: 7px; }
.fieldHelp { display: block; margin-top: 7px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.eventExcelImporter { margin-bottom: 18px; border-color: rgba(217,161,58,.46); }
.downloadTemplateButton { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; white-space: nowrap; }
.eventImportWarnings { border-color: rgba(110,168,254,.4); color: #d9e9ff; }
.eventProgram { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); }
.eventProgram h3 { margin: 0 0 12px; color: var(--gold-300); }
.eventProgram ol { display: grid; gap: 10px; margin: 0; padding-left: 22px; }
.eventProgram li span { display: block; }
.eventProgram li span + span { margin-top: 2px; color: var(--muted); }
.carouselEditorActions { display: flex; gap: 5px; }
.attendancePreview { margin-top: 3px; padding: 16px; border: 1px solid var(--line-gold); border-radius: 13px; background: rgba(217,161,58,.055); }
.attendancePreview h4 { margin: 0 0 10px; color: var(--gold-300); }
.attendanceSummaryGrid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: 12px 0; }
.attendanceSummaryItem { padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: rgba(0,0,0,.13); }
.attendanceSummaryItem strong { display: block; color: var(--gold-300); font-size: 21px; }
.attendanceEventPreview, .attendanceWarning { margin-top: 8px; padding: 10px; border-radius: 9px; background: rgba(255,255,255,.035); }
.attendanceWarning { border: 1px solid rgba(255,190,100,.35); color: #ffe0aa; }
.attendanceWarningList { margin: 10px 0 0; padding-left: 20px; }
.eventDateBlock { display: grid; place-content: center; min-width: 70px; min-height: 70px; padding: 8px; border-radius: 12px; background: var(--navy-900); color: #fff; text-align: center; font-family: var(--font-display); }
.eventDateBlock strong { font-size: 1.55rem; line-height: 1; }
.eventDateBlock span { margin-top: 4px; color: var(--gold-300); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.eventOrganizer { margin-top: 8px; color: var(--muted); }
.eventOrganizer em { font-style: italic; }
.eventOrganizer span { font-style: normal; color: var(--white); }
.eventMetaList { display: grid; gap: 4px; margin: 9px 0 12px; color: var(--muted); }
.eventCardBody { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 12px; align-items: center; }
.eventCardBody h3 { margin: 0; }
.eventCardBody .eventMetaList, .eventCardBody .eventOrganizer, .eventCardBody .textButton { grid-column: 1 / -1; }

@media (max-width: 1000px) {
    .navBar { grid-template-columns: auto 1fr auto; }
    .schoolBrand { grid-column: 2; min-width: 0; }
    .desktopNav, .headerActions { display: none; }
    .mobileMenuButton { display: block; }
    .entryIntro > p:last-child { display: none; }
}

@media (max-width: 850px) {
    .entryShell { min-height: calc(100dvh - 75px); }
    .gatewayGrid, body[data-template="panorama"] .gatewayGrid, body[data-template="editorial"] .gatewayGrid { grid-template-columns: 1fr; grid-template-rows: minmax(310px, 1.6fr) minmax(170px, .8fr); }
    .programHeroContent { justify-content: flex-end; padding-block: 48px 64px; }
    .programShade { background: linear-gradient(0deg, rgba(2,10,19,.97), rgba(2,10,19,.43) 72%, rgba(2,10,19,.24)); }
}

@media (max-width: 620px) {
    .topbar { min-height: 66px; }
    .navBar { min-height: 66px; grid-template-columns: 40px minmax(0,1fr) 40px; gap: 5px; }
    .schoolBrand { gap: 7px; padding: 4px; }
    .schoolInitials { font-size: 27px; }
    .schoolFullName { font-size: 8.5px; letter-spacing: .075em; }
    .mobileMenuButton { width: 40px; padding: 0; font-size: 24px; }
    .entryShell { min-height: calc(100dvh - 132px); gap: 9px; padding-block: 9px 11px; }
    .entryIntro { min-height: 47px; display: block; }
    .entryIntro .eyebrow { display: none; }
    .entryIntro h1 { font-size: 32px; line-height: 1.04; }
    .entryIntro > p:last-child { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .gatewayGrid, body[data-template="panorama"] .gatewayGrid, body[data-template="editorial"] .gatewayGrid { grid-template-rows: minmax(270px, 1.7fr) minmax(135px, .75fr); gap: 9px; }
    .gatewayCard, body[data-template="panorama"] .gatewayCard, body[data-template="editorial"] .gatewayParticipa, body[data-template="editorial"] .gatewayExplora { min-height: 0; border-radius: 17px; }
    .gatewayParticipa .gatewayContent { inset: 15px; }
    .gatewayProgramLogo { width: 108px; height: auto; }
    .programIdentity > span { font-size: 8px; }
    .programIdentity strong { font-size: clamp(31px, 10vw, 42px); }
    .gatewayParticipa .gatewayContent > small { margin-top: 4px; font-size: 12px; }
    .gatewayLiveData { grid-template-columns: 1fr 1fr; gap: 5px; margin-top: 7px; }
    .gatewayLiveItem { padding: 6px 7px; }
    .gatewayLiveItem b { font-size: 7.5px; }
    .gatewayLiveItem span { font-size: 10px; }
    .gatewayAction { margin-top: 6px; font-size: 9px; }
    .gatewayAction b { width: 28px; height: 28px; font-size: 15px; }
    .gatewayExplora .gatewayContent { inset: auto 15px 12px; grid-template-columns: auto 1fr auto; column-gap: 9px; align-items: center; }
    .gatewayExplora .gatewayIcon { width: 37px; height: 37px; margin: 0; grid-row: 1/4; font-size: 19px; }
    .gatewayExplora .gatewayContent strong { font-size: 28px; }
    .gatewayExplora .gatewayContent small { margin: 0; font-size: 11px; }
    .gatewayExplora .gatewayAction { grid-column: 3; grid-row: 1/4; font-size: 0; }
    .gatewayExplora .gatewayAction b { margin: 0; }
    .programCarousel { min-height: min(540px, calc(100dvh - 66px)); }
    .programHeroLogo { width: min(210px,58vw); height: auto; margin: 6px 0; }
    .programHeroContent h1 { font-size: clamp(48px, 15vw, 68px); }
    .programHeroContent > p:not(.programEyebrow) { margin-top: 13px; font-size: 17px; line-height: 1.3; }
    .programParticipateButton { margin-top: 17px; }
    .carouselButton { top: 42%; width: 36px; height: 44px; font-size: 29px; }
    .carouselPrevious { left: 8px; }
    .carouselNext { right: 8px; }
    .attendanceSummaryGrid { grid-template-columns: 1fr 1fr; }
    .carouselEditorRow { grid-template-columns: 64px minmax(0,1fr); }
    .carouselEditorRow img { width: 64px; height: 48px; }
    .carouselEditorActions { grid-column: 1/-1; justify-content: flex-end; }
}

@media (max-width: 370px), (max-height: 680px) and (max-width: 620px) {
    .entryShell { padding-top: 6px; }
    .entryIntro { min-height: 37px; }
    .entryIntro h1 { font-size: 28px; }
    .entryIntro > p:last-child { display: none; }
    .gatewayGrid, body[data-template="panorama"] .gatewayGrid, body[data-template="editorial"] .gatewayGrid { grid-template-rows: minmax(245px, 1.65fr) minmax(120px, .72fr); }
    .gatewayLiveItem { padding-block: 4px; }
    .gatewayProgramLogo { display: none; }
    .gatewayParticipa .gatewayContent { grid-template-rows: auto auto 1fr auto; }
    .programIdentity strong { font-size: 30px; }
}

/* v5.2 · Reel de entrada, cabecera compacta y agenda visual */
#viewEntrada { position: relative; isolation: isolate; overflow: hidden; }
.entryReel { position: absolute; inset: 0; z-index: -2; opacity: 0; transition: opacity .35s ease; }
.entryReel.hasSlides { opacity: 1; }
.entryReelSlides, .entryReelSlide { position: absolute; inset: 0; width: 100%; height: 100%; }
.entryReelSlide { object-fit: cover; opacity: 0; transform: scale(1.025); transition: opacity .75s ease, transform 6s ease; }
.entryReelSlide.active { opacity: 1; transform: scale(1); }
.entryReelShade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(2,10,19,.72), rgba(2,10,19,.88)), radial-gradient(circle at center, transparent, rgba(2,10,19,.62)); }
.entryReel.hasSlides + .entryShell .entryIntro h1 { text-shadow: 0 2px 18px rgba(0,0,0,.8); }
.entryReel.hasSlides + .entryShell .gatewayCard { box-shadow: 0 22px 65px rgba(0,0,0,.55); }

.programCarousel { min-height: clamp(132px, 18dvh, 188px); }
.programHeroContent { min-height: inherit; display: grid; grid-template-columns: auto minmax(0,1fr) auto; grid-template-rows: 1fr; gap: 16px; align-items: center; padding-block: 20px; }
.programHeroContent .backHome { position: absolute; top: 8px; left: 22px; margin: 0; font-size: 11px; }
.programHeroLogo { width: clamp(82px,10vw,128px); margin: 8px 0 0; border-radius: 9px; }
.programCompactCopy { min-width: 0; margin-top: 7px; }
.programCompactCopy .programEyebrow { margin-bottom: 2px; font-size: 9px; }
.programHeroContent .programCompactCopy h1 { margin: 0; font-size: clamp(23px,3vw,38px); line-height: 1; }
.programHeroContent .programCompactCopy > p:not(.programEyebrow) { max-width: 680px; margin: 5px 0 0; color: #f4deb0; font-size: clamp(12px,1.4vw,16px); line-height: 1.25; }
.programParticipateButton { margin: 7px 0 0; padding: 10px 14px; font-size: 12px; }
.programCarousel .carouselButton, .programCarousel .carouselDots { display: none; }
.participaBlocks { padding-top: 24px; }

.featuredEvent.featuredPosterEvent { min-height: 0; overflow: visible; border: 0; background: transparent; box-shadow: none; }
.activityPosterCard { position: relative; width: 100%; min-height: 390px; display: block; overflow: hidden; padding: 0; border: 0; border-radius: 25px; color: white; background: #0a1724; text-align: left; box-shadow: 0 22px 60px rgba(0,0,0,.34); cursor: pointer; isolation: isolate; }
.activityPosterBackground, .activityPosterBackground > img, .activityPosterBackground > .autoPoster, .activityPosterBackground > .eventPosterPdf { position: absolute; inset: 0; width: 100%; height: 100%; }
.activityPosterBackground > img { object-fit: cover; }
.posterFocus-center { object-position: center; }.posterFocus-top { object-position: center top; }.posterFocus-bottom { object-position: center bottom; }.posterFocus-left { object-position: left center; }.posterFocus-right { object-position: right center; }
.activityPosterShade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,8,13,.12), rgba(3,8,13,.3)), linear-gradient(0deg, rgba(3,8,13,.35), transparent 60%); }
.activityBadgeStack { position: absolute; z-index: 3; top: 28px; left: 28px; display: grid; justify-items: start; gap: 9px; }
.activityDateBadge { position: absolute; z-index: 2; top: 28px; left: 28px; min-width: 94px; display: grid; place-items: center; padding: 15px 12px 13px; border-radius: 18px; background: rgba(5,7,10,.88); box-shadow: 0 10px 28px rgba(0,0,0,.28); }
.activityBadgeStack .activityDateBadge { position: static; }
.activityDateBadge strong { font: 800 clamp(34px,4vw,54px)/1 var(--font-display); }
.activityDateBadge small { margin-top: 5px; font: 600 14px var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.scoringBadge { --scoring-color: #D9A13A; display: block; width: 94px; max-width: 100%; overflow: hidden; border-radius: 17px; background: transparent; filter: drop-shadow(0 8px 18px rgba(0,0,0,.3)) drop-shadow(0 0 2px var(--scoring-color)); }
.scoringBadgeImage { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; object-position: center; }
.activityScoringBadge { width: 108px; border-radius: 19px; }
.entryScoringBadge { width: 78px; margin-bottom: 7px; }
.detailScoringBadge { width: 116px; margin-bottom: 12px; }
.tableScoringBadge { display: inline-block; width: 54px; margin: 5px 0 0 8px; vertical-align: middle; }
.activityInfoPanel { position: absolute; z-index: 2; top: 28px; right: 28px; width: min(54%, 520px); min-height: calc(100% - 56px); max-height: calc(100% - 56px); display: flex; flex-direction: column; justify-content: center; overflow: auto; padding: 25px; border-radius: 18px; color: #fff; background: rgba(7,9,12,.82); backdrop-filter: blur(4px); }
.activityTags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 9px; }
.activityTags b { padding: 5px 8px; border-radius: 99px; color: #081421; background: var(--gold-300); font: 700 10px var(--font-display); letter-spacing: .04em; text-transform: uppercase; }
.activityTitle { color: #ffbd25; font: 700 clamp(22px,2.5vw,35px)/1.08 var(--font-display); text-transform: uppercase; }
.activitySummary { margin-top: 10px; color: #fff; font-size: clamp(14px,1.5vw,18px); line-height: 1.35; }
.activityMeta { display: grid; gap: 7px; margin-top: 14px; }
.activityMeta > span { display: grid; grid-template-columns: 18px 1fr; gap: 5px; align-items: start; }
.activityMeta b { font-family: var(--font-body); font-weight: 500; }
.activityInfoPanel .eventOrganizer { display: grid; gap: 2px; margin-top: 12px; color: #fff; font-family: var(--font-body); }
.activityInfoPanel .eventOrganizer em { color: #d8d8d8; font-style: italic; }
.activityInfoPanel .eventOrganizer > span { color: #fff; font-style: normal; }
.activityPosterCard:focus-visible { outline: 4px solid var(--gold-300); outline-offset: 4px; }
.activityPosterCard:hover .activityPosterBackground > img { transform: scale(1.025); transition: transform .5s ease; }
.featuredActivityCard { min-height: clamp(390px,52vh,570px); }

.agendaMonthNav { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 24px 0 18px; }
.agendaMonthNav h3 { margin: 0; color: var(--cream); font: 700 clamp(28px,4vw,48px)/1.1 var(--font-display); }
.agendaMonthNav > div { display: flex; gap: 9px; }
.agendaMonthNav button { width: 48px; height: 48px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--cream); background: rgba(255,255,255,.06); font-size: 31px; cursor: pointer; }
.agendaMonthNav button:disabled { opacity: .3; cursor: default; }
.eventGrid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.eventGrid .activityPosterCard { min-height: 420px; }

.eventDetail { display: grid; grid-template-columns: minmax(250px,.8fr) minmax(300px,1.2fr); gap: 26px; max-width: 980px; }
.eventDetailPoster { max-height: 74vh; display: grid; place-items: center; overflow: auto; border-radius: 16px; background: #061323; }
.eventDetailPoster img { width: 100%; height: 100%; max-height: 74vh; object-fit: contain; }
.eventDetailCopy h2 { margin: 8px 0 14px; }
.eventDetailCopy .eventOrganizer { display: grid; gap: 2px; margin: 15px 0; }
.eventDetailDescription { white-space: pre-line; line-height: 1.6; }

.singleImagePreview { min-height: 76px; display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 8px; border: 1px dashed var(--line); border-radius: 10px; color: var(--muted); }
.singleImagePreview:empty { display: none; }
.singleImagePreview img { width: 100px; height: 68px; object-fit: cover; border-radius: 7px; }
.pendingImagePreview { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.pendingImagePreview img { width: 82px; height: 58px; object-fit: cover; border: 2px solid var(--gold-300); border-radius: 8px; }

@media (max-width: 760px) {
    .programCarousel { min-height: clamp(126px, 18dvh, 154px); }
    .programHeroContent { grid-template-columns: 70px minmax(0,1fr) auto; gap: 9px; padding: 17px 22px 10px; }
    .programHeroLogo { width: 70px; margin-top: 8px; }
    .programCompactCopy .programEyebrow { display: none; }
    .programHeroContent .programCompactCopy h1 { font-size: clamp(21px,6vw,29px); }
    .programHeroContent .programCompactCopy > p:not(.programEyebrow) { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .programParticipateButton { padding: 9px; font-size: 0; }
    .programParticipateButton::after { content: "↓"; font-size: 20px; }
    .participaBlocks { padding-top: 18px; }
    .participaBlocks > .contentBlock:first-child .sectionHeading { margin-bottom: 10px; }
    .participaBlocks > .contentBlock:first-child .sectionHeading h2 { font-size: 25px; }
    .activityPosterCard, .featuredActivityCard, .eventGrid .activityPosterCard { min-height: 410px; border-radius: 19px; }
    .activityBadgeStack { top: 18px; left: 18px; gap: 7px; }
    .activityDateBadge { top: 18px; left: 18px; min-width: 75px; padding: 11px 8px 9px; border-radius: 14px; }
    .activityDateBadge strong { font-size: 37px; }.activityDateBadge small { font-size: 11px; }
    .activityScoringBadge { width: 86px; border-radius: 15px; }
    .activityInfoPanel { top: auto; right: 16px; bottom: 16px; width: min(72%, 360px); min-height: 0; max-height: calc(100% - 32px); padding: 17px; border-radius: 15px; }
    .activityTitle { font-size: clamp(19px,6vw,27px); }
    .activitySummary { font-size: 14px; }
    .activityMeta { gap: 5px; margin-top: 10px; font-size: 14px; }
    .activityInfoPanel .eventOrganizer { margin-top: 8px; font-size: 14px; }
    .activityTags b:nth-child(n+4) { display: none; }
    .eventGrid { grid-template-columns: 1fr; }
    .agendaMonthNav button { width: 42px; height: 42px; }
    .eventDetail { grid-template-columns: 1fr; }
    .eventDetailPoster { max-height: 56vh; }
}

@media (max-width: 390px) {
    .programHeroContent { grid-template-columns: 60px minmax(0,1fr) 38px; padding-inline: 16px; }
    .programHeroLogo { width: 60px; }
    .programHeroContent .programCompactCopy h1 { font-size: 21px; }
    .activityInfoPanel { width: calc(100% - 32px); }
    .activityDateBadge { z-index: 3; }
    .activityScoringBadge { width: 86px; border-radius: 15px; }
}

.scoringBadgeAdminGrid { display: grid; grid-template-columns: minmax(160px,.55fr) minmax(260px,1fr) minmax(150px,.55fr); align-items: end; gap: 16px; }
.scoringBadgeAdminGrid .editorActions { grid-column: 2 / -1; margin: 0; }
.scoringBadgePreview { --scoring-color: #D9A13A; min-height: 190px; display: flex; align-items: center; justify-content: center; padding: 18px; border: 1px solid var(--line-gold); border-radius: 18px; background: rgba(2,10,19,.72); }
.scoringBadgePreview .scoringBadgeImage { width: min(220px,100%); border-radius: 22px; filter: drop-shadow(0 10px 25px rgba(0,0,0,.38)) drop-shadow(0 0 2px var(--scoring-color)); }
.colorField { min-height: 54px; padding: 7px; }
@media (max-width: 760px) {
    .scoringBadgeAdminGrid { grid-template-columns: 1fr; }
    .scoringBadgeAdminGrid .editorActions { grid-column: auto; }
}

/* v5.3 · Editor responsive, reels visibles y tema claro */
.themeToggle { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 99px; color: #f7fbff; background: rgba(255,255,255,.05); cursor: pointer; }
.themeToggle:hover { border-color: var(--gold-300); }

.responsiveLayout { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); align-items: start; gap: 22px; }
.responsiveLayout > [data-layout-module] { min-width: 0; order: var(--desktop-order,0); grid-column: span var(--desktop-span,12); min-height: var(--desktop-height,0); }
@media (min-width: 761px) { .layoutHidden-desktop { display: none !important; } }

#viewEntrada { overflow: visible; }
.entryShell { min-height: 0; grid-template-rows: none; padding-block: clamp(16px,2.5vh,30px) 34px; }
.entryIntro { width: 100%; min-height: 0; }
.entryReel { position: relative; inset: auto; z-index: 0; width: 100%; height: max(190px,var(--desktop-height,240px)); min-height: 190px; overflow: hidden; opacity: 1; border: 1px solid var(--line-gold); border-radius: 24px; background: #06182d; box-shadow: var(--shadow); isolation: isolate; }
.entryReelSlides, .entryReelSlide, .entryReelFallback { position: absolute; inset: 0; width: 100%; height: 100%; }
.entryReelSlide, .entryReelFallback { object-fit: cover; }
.entryReelFallback { z-index: -4; }
.entryReelSlides { z-index: -3; }
.entryReelShade { z-index: -2; background: linear-gradient(90deg,rgba(2,10,19,.78),rgba(2,10,19,.2) 72%),linear-gradient(0deg,rgba(2,10,19,.55),transparent 55%); }
.entryReel .carouselButton { top: 50%; }
.entryReel .carouselDots { bottom: 13px; }
.entryReel.singleSlide .carouselButton, .entryReel .carouselDots:empty { display: none; }
.gatewayGrid, body[data-template="panorama"] .gatewayGrid, body[data-template="editorial"] .gatewayGrid { min-height: var(--desktop-height,330px); grid-template-columns: 1fr; grid-template-rows: minmax(120px,.72fr) minmax(180px,1.28fr); }
.gatewayExplora .gatewayContent { inset: auto 19px 18px; }
.gatewayParticipa .programIdentity strong { font-size: clamp(29px,3.3vw,49px); }
.gatewayParticipa .gatewayProgramLogo { width: clamp(92px,9vw,126px); }

.participaBlocks { display: grid; padding-block: 28px 80px; }
.participaBlocks > [data-layout-module] { width: 100%; margin: 0; }
.exploreBody { display: grid; }
.exploreBody > [data-layout-module] { width: 100%; margin: 0; }
.exploreContentsModule { display: block; }

.exploraHero { min-height: clamp(150px,20dvh,220px); }
.exploraSlides, .exploraSlide { position: absolute; inset: 0; width: 100%; height: 100%; }
.exploraSlides { z-index: -3; }
.exploraSlide { object-fit: cover; opacity: 0; transform: scale(1.025); transition: opacity .7s ease,transform 5s ease; }
.exploraSlide.active { opacity: 1; transform: scale(1); }
.hasExploraSlides #exploraHeroImage { visibility: hidden; }
.exploraHero .sectionHeroContent { min-height: inherit; display: grid; grid-template-columns: auto minmax(0,1fr); grid-template-rows: auto auto auto; align-content: center; column-gap: 28px; padding-block: 22px; }
.exploraHero .backHome { grid-column: 1/-1; margin: 0 0 6px; }
.exploraHero .eyebrow { grid-column: 1; grid-row: 2; align-self: end; }
.exploraHero h1 { grid-column: 1; grid-row: 3; font-size: clamp(30px,4vw,50px); }
.exploraHero .sectionHeroContent > p:last-child { grid-column: 2; grid-row: 2/4; align-self: center; margin: 0; font-size: clamp(15px,2vw,22px); }
.singleExploraSlide .exploraHero .carouselButton, .exploraHero .carouselDots:empty { display: none; }

.responsiveEditorToolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 18px 0 12px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.035); }
.responsiveEditorToolbar > label { min-width: 160px; }
.deviceSelector { display: inline-flex; padding: 4px; border: 1px solid var(--line); border-radius: 11px; background: rgba(0,0,0,.18); }
.deviceSelector button { padding: 9px 14px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; cursor: pointer; }
.deviceSelector button.active { color: #071525; background: var(--gold-300); }
.layoutEditorHelp { display: grid; gap: 3px; margin: 10px 0; color: var(--muted); }
.layoutEditorHelp strong { color: var(--cream); }
.visualLayoutEditor { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 10px; min-height: 180px; margin-bottom: 18px; padding: 12px; border: 1px dashed var(--line-gold); border-radius: 15px; background: rgba(0,0,0,.14); }
.layoutEditorModule { position: relative; grid-column: span var(--editor-span,12); min-height: clamp(150px,var(--editor-height,220px),360px); display: grid; grid-template-columns: auto minmax(0,1fr) auto; grid-template-rows: auto auto 1fr; gap: 10px; padding: 14px 18px 25px 14px; border: 1px solid var(--line); border-radius: 13px; background: linear-gradient(145deg,rgba(16,50,80,.96),rgba(5,22,40,.98)); box-shadow: 0 12px 28px rgba(0,0,0,.18); transition: opacity .2s,border-color .2s; }
.layoutEditorModule.isInvisible { opacity: .5; }
.layoutEditorModule.isDragging { opacity: .35; }
.layoutEditorModule.isDropTarget { border-color: var(--gold-300); }
.layoutEditorModule.isResizing { outline: 2px solid var(--gold-300); }
.layoutDragHandle { width: 34px; height: 34px; border: 0; border-radius: 8px; color: var(--gold-300); background: rgba(255,255,255,.06); font-size: 20px; cursor: grab; }
.layoutModuleTitle { display: grid; align-content: start; }
.layoutModuleTitle small { color: var(--muted); }
.layoutVisibility { justify-self: end; font-size: 13px; }
.layoutEditorModule > label:not(.layoutVisibility) { align-self: start; font-size: 12px; }
.compactField { min-width: 112px; padding: 7px 9px; }
.layoutHeightControl { grid-column: 2/-1; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; }
.layoutHeightControl input { min-width: 80px; }
.layoutMoveButtons { align-self: end; display: flex; gap: 5px; }
.layoutResizeHandle { position: absolute; right: 5px; bottom: 5px; width: 24px; height: 24px; border: 0; background: linear-gradient(135deg,transparent 42%,var(--gold-300) 43% 52%,transparent 53% 64%,var(--gold-300) 65% 74%,transparent 75%); cursor: nwse-resize; touch-action: none; }

body[data-theme="light"] { color: #172b40; background: #fff; }
body[data-theme="light"] main, body[data-theme="light"] .publicView, body[data-theme="light"] .participaBlocks, body[data-theme="light"] .exploreBody { background: #fff; }
body[data-theme="light"] .topbar, body[data-theme="light"] footer, body[data-theme="light"] .bottomNav { color: #fff; background: #28559a; }
body[data-theme="light"] .topbar { border-bottom-color: rgba(255,255,255,.24); }
body[data-theme="light"] .navLink, body[data-theme="light"] .privateButton, body[data-theme="light"] .themeToggle, body[data-theme="light"] footer p, body[data-theme="light"] .footerCopy { color: #fff; }
body[data-theme="light"] .mobileMenu { background: #214a89; }
body[data-theme="light"] .entryIntro h1, body[data-theme="light"] .sectionHeading h2, body[data-theme="light"] .exploreIntro h2, body[data-theme="light"] .exploreToolbar h2 { color: #142b43; }
body[data-theme="light"] .entryIntro > p:last-child, body[data-theme="light"] .exploreIntro p { color: #53687d; }
body[data-theme="light"] .card, body[data-theme="light"] .searchPanel, body[data-theme="light"] .spotifyPanel { color: #172b40; border-color: #d7e0e8; background: #fff; box-shadow: 0 14px 36px rgba(25,54,83,.12); }
body[data-theme="light"] .rankRow { border-bottom-color: #e5ebf0; }
body[data-theme="light"] .studentRow { border-bottom-color: #e5ebf0; }
body[data-theme="light"] .studentRow small, body[data-theme="light"] .featuredMeta, body[data-theme="light"] .eventMetaList { color: #53687d; }
body[data-theme="light"] main .studentSearchBox { border-color: #d7e0e8; background: #f4f7fa; }
body[data-theme="light"] main .studentSearchBox label { color: #243c54; }
body[data-theme="light"] main .field { color: #172b40; border-color: #bccbd8; background: #fff; }
body[data-theme="light"] main .studentResult { color: #53687d; }
body[data-theme="light"] main .studentResult.resultFound { color: #172b40; }
body[data-theme="light"] .rankPoints, body[data-theme="light"] .leaderCard strong, body[data-theme="light"] .studentAttendances, body[data-theme="light"] .categoryCard strong, body[data-theme="light"] .contentReadMore { color: #966006; }
body[data-theme="light"] .categoryCard, body[data-theme="light"] .contentCard { color: #172b40; border-color: #d7e0e8; background: #fff; box-shadow: 0 12px 34px rgba(25,54,83,.12); }
body[data-theme="light"] .categoryCard small, body[data-theme="light"] .contentCardBody p { color: #53687d; }
body[data-theme="light"] .contentCover { background: radial-gradient(circle at center,#e4edf5,#cad9e6); }
body[data-theme="light"] .agendaTabs { border-color: #d7e0e8; background: #eef3f7; }
body[data-theme="light"] .agendaTabs button { color: #29445e; }
body[data-theme="light"] .agendaMonthNav h3 { color: #142b43; }
body[data-theme="light"] .agendaMonthNav button { color: #142b43; border-color: #ccd8e3; background: #f3f6f9; }
body[data-theme="light"] .textButton { color: #a76805; }
body[data-theme="light"] .emptyState { color: #5c7185; border-color: #ccd8e3; }
body[data-theme="light"] .programCarousel, body[data-theme="light"] .exploraHero, body[data-theme="light"] .activityPosterCard, body[data-theme="light"] .gatewayCard, body[data-theme="light"] .entryReel { color: #fff; }
body[data-theme="light"] footer button, body[data-theme="light"] footer a { color: #f6d27f; }

@media (max-width: 760px) {
    .responsiveLayout { gap: 12px; }
    .responsiveLayout > [data-layout-module] { order: var(--mobile-order,0); grid-column: span var(--mobile-span,12); min-height: var(--mobile-height,0); }
    .layoutHidden-mobile { display: none !important; }
    .entryShell { min-height: 0; padding-block: 9px 18px; }
    .entryIntro { min-height: 0; }
    .entryReel { height: max(145px,var(--mobile-height,180px)); min-height: 145px; border-radius: 17px; }
    .entryReel .carouselButton, .exploraHero .carouselButton { width: 34px; height: 42px; font-size: 27px; }
    .gatewayGrid, body[data-template="panorama"] .gatewayGrid, body[data-template="editorial"] .gatewayGrid { min-height: var(--mobile-height,390px); grid-template-columns: 1fr; grid-template-rows: minmax(215px,1.2fr) minmax(145px,.8fr); }
    .gatewayParticipa .programIdentity strong { font-size: clamp(29px,9vw,38px); }
    .participaBlocks { padding-block: 18px 56px; }
    .exploreBody { padding-block: 28px 55px; }
    .exploraHero { min-height: clamp(140px,19dvh,170px); }
    .exploraHero .sectionHeroContent { grid-template-columns: 1fr; grid-template-rows: auto auto auto auto; padding: 16px 54px 16px 22px; }
    .exploraHero .backHome { grid-column: 1; margin: 0; font-size: 10px; }
    .exploraHero .eyebrow { display: none; }
    .exploraHero h1 { grid-column: 1; grid-row: 2; font-size: 28px; }
    .exploraHero .sectionHeroContent > p:last-child { grid-column: 1; grid-row: 3; margin-top: 3px; font-size: 13px; }
    .exploraHero .carouselDots { bottom: 8px; }
    .responsiveEditorToolbar { align-items: stretch; }
    .responsiveEditorToolbar > * { flex: 1 1 100%; }
    .deviceSelector { display: grid; grid-template-columns: 1fr 1fr; }
    .visualLayoutEditor { grid-template-columns: 1fr; }
    .layoutEditorModule { grid-column: 1 !important; min-height: clamp(160px,var(--editor-height,220px),300px); }
    .layoutHeightControl { grid-column: 1/-1; }
    body[data-theme="light"] .bottomNav button { color: #d8e5f6; }
    body[data-theme="light"] .bottomNav button.active { color: #f6d27f; }
}

/* v5.3.1 · Portada limpia e identidad institucional completa */
.entryShell {
    width: min(1240px, calc(100% - 44px));
    gap: 18px;
    padding-block: 10px 30px;
}

.entryReelShade {
    background: linear-gradient(0deg, rgba(2,10,19,.2), transparent 42%);
}

.gatewayGrid,
body[data-template="panorama"] .gatewayGrid,
body[data-template="editorial"] .gatewayGrid {
    height: max(280px, var(--desktop-height, 300px));
    grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
    grid-template-rows: minmax(0, 1fr);
    gap: 18px;
}

.gatewayGrid > .gatewayCard,
body[data-template="panorama"] .gatewayGrid > .gatewayCard,
body[data-template="editorial"] .gatewayGrid > .gatewayCard {
    width: 100%;
    height: 100%;
    min-height: 0;
}

.footerBrand {
    min-width: 0;
    align-items: center;
    gap: 18px;
}

.footerBrand .footerInstitutionalLogo {
    flex: 0 0 auto;
    width: 96px;
    height: 92px;
    object-fit: contain;
    border-radius: 9px;
}

.footerSchoolLockup {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 13px;
}

.footerSchoolLockup .schoolFullName {
    font-family: var(--font-display);
    font-weight: 600;
}

.footerSchoolLockup .footerInitials { font-size: 38px; }

@media (max-width: 760px) {
    .entryShell {
        gap: 10px;
        padding-block: 7px 16px;
    }

    .gatewayGrid,
    body[data-template="panorama"] .gatewayGrid,
    body[data-template="editorial"] .gatewayGrid {
        height: max(320px, var(--mobile-height, 345px));
        grid-template-columns: 1fr;
        grid-template-rows: minmax(205px, 1.25fr) minmax(135px, .75fr);
        gap: 10px;
    }

    .footerBrand {
        display: grid;
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 13px;
    }

    .footerBrand .footerInstitutionalLogo {
        width: 72px;
        height: 72px;
    }

    .footerSchoolLockup { gap: 9px; }
    .footerSchoolLockup .footerInitials { font-size: 29px; }
    .footerSchoolLockup .schoolFullName { font-size: 8px; letter-spacing: .07em; }
}

/* v5.4 · Encuadre fotográfico y fichas dinámicas */
.entryReelSlide,
.programSlide,
.exploraSlide { object-position: var(--desktop-object-position, center); }

.carouselCropControls { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 9px; }
.carouselCropControls label { display: grid; gap: 3px; color: var(--muted); font-size: 10px; }
.carouselCropControls select { min-width: 105px; color: var(--white); border: 1px solid var(--line); border-radius: 7px; background: #0b2945; }
.pendingImagePreview { display: grid; grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap: 10px; }
.pendingCropCard { display: grid; gap: 8px; padding: 9px; border: 1px solid var(--line-gold); border-radius: 11px; background: rgba(217,161,58,.06); }
.pendingCropCard > img { width: 100%; height: 110px; object-fit: cover; border-radius: 8px; }

.contentCard { display: block; text-decoration: none; }
.contentCardCategory { display: block; margin-bottom: 7px; color: var(--gold-300); font: 600 10px var(--font-display); letter-spacing: .09em; text-transform: uppercase; }
.rankSheetLink { display: block; margin-top: 3px; color: var(--gold-300); font-size: 11px; text-decoration: none; }

#contentOverlay { top: 86px; z-index: 35; background: var(--navy-950); }
#contentOverlay.isFullscreen { inset: 0; }
#contentOverlay .overlayHeader { position: sticky; top: 0; z-index: 30; }
.contentViewerHeader { box-shadow: 0 10px 28px rgba(0,0,0,.2); }
.contentViewerNav { display: grid; grid-template-columns: minmax(150px,auto) minmax(180px,1fr) minmax(150px,auto); gap: 16px; }
.contentBackButton { min-height: 44px; justify-self: start; }
.contentViewerIdentity { min-width: 0; display: grid; justify-items: center; gap: 3px; text-align: center; }
.contentViewerIdentity small { color: var(--gold-300); font: 600 9px var(--font-display); letter-spacing: .11em; text-transform: uppercase; }
.contentViewerIdentity strong { width: 100%; overflow: hidden; color: var(--cream); font: 700 clamp(14px,1.8vw,20px)/1.2 var(--font-display); text-overflow: ellipsis; white-space: nowrap; }
.contentViewerActions { display: flex; justify-self: end; gap: 8px; }
.contentViewerActions .ghostButton { min-height: 42px; padding-inline: 14px; }
.contentViewerActions .ghostButton:disabled { opacity: .42; cursor: not-allowed; }
.contentBackToTop { position: fixed; right: clamp(14px,3vw,38px); bottom: clamp(18px,4vw,42px); z-index: 45; min-height: 46px; display: flex; align-items: center; gap: 8px; padding: 10px 14px; border: 1px solid var(--line-gold); border-radius: 999px; color: var(--navy-950); background: var(--gold-300); box-shadow: 0 14px 34px rgba(0,0,0,.3); font: 700 12px var(--font-display); opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s ease,transform .2s ease; }
.contentBackToTop.show { opacity: 1; transform: translateY(0); pointer-events: auto; }
.contentBackToTop span { font-size: 18px; line-height: 1; }
.contentSheet { width: 100%; min-height: 100%; color: var(--white); background: var(--navy-950); }
.sheetHero { position: relative; min-height: clamp(300px, 47dvh, 520px); display: grid; align-items: end; overflow: hidden; isolation: isolate; background: radial-gradient(circle at 15% 15%, #174c77, #06182d 62%); }
.sheetHero picture, .sheetHero picture img { position: absolute; inset: 0; width: 100%; height: 100%; }
.sheetHero picture { z-index: -3; }
.sheetHero picture img { object-fit: cover; object-position: var(--hero-desktop-position, center); }
.sheetHeroShade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(0deg, rgba(2,10,19,.97), rgba(2,10,19,.22) 72%), linear-gradient(90deg, rgba(2,10,19,.66), transparent 68%); }
.sheetHeroContent { padding-block: 54px 46px; }
.sheetBreadcrumb { display: block; margin-bottom: 18px; color: #d4e0eb; font-size: 13px; }
.sheetCategory { display: block; margin-bottom: 9px; color: var(--gold-300); font: 600 12px var(--font-display); letter-spacing: .1em; text-transform: uppercase; }
.sheetHero h1 { max-width: 1000px; margin: 0; color: var(--cream); font: 800 clamp(38px, 6vw, 76px)/1.02 var(--font-display); letter-spacing: -.045em; }
.sheetHero p { max-width: 760px; margin: 17px 0 0; color: #edf3f8; font-size: clamp(17px, 2vw, 23px); line-height: 1.45; }

.sheetLayout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: clamp(28px, 5vw, 70px); align-items: start; padding-block: 54px 75px; }
.sheetInfoPanel { grid-column: 2; grid-row: 1; position: sticky; top: 95px; padding: 24px; border: 1px solid var(--line-gold); border-radius: 18px; background: linear-gradient(145deg, rgba(13,45,73,.98), rgba(5,24,43,.98)); box-shadow: var(--shadow); }
.sheetInfoPanel h2 { margin: 0 0 15px; font: 700 23px var(--font-display); }
.sheetInfoPanel dl { margin: 0; display: grid; gap: 0; }
.sheetInfoPanel dl div { padding: 12px 0; border-bottom: 1px solid var(--line); }
.sheetInfoPanel dl div:last-child { border-bottom: 0; }
.sheetInfoPanel dt { color: var(--gold-300); font: 600 10px var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.sheetInfoPanel dd { margin: 5px 0 0; color: #f4f7fa; line-height: 1.45; }
.sheetMain { grid-column: 1; grid-row: 1; min-width: 0; }
.sheetBlock { margin: 0 0 34px; }
.sheetBlock h2, .sheetRelated h2 { margin: 0 0 15px; color: var(--cream); font: 700 clamp(24px, 3vw, 36px)/1.15 var(--font-display); }
.sheetText p, .sheetCallout p, .sheetCta p { margin: 0 0 16px; color: #dfe8f0; font-size: 18px; line-height: 1.75; }
.sheetImage { overflow: hidden; border-radius: 18px; }
.sheetImage img { width: 100%; max-height: 680px; display: block; object-fit: cover; }
.sheetImage figcaption { padding: 12px 3px 0; color: var(--muted); }
.sheetGallery { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 76%); gap: 14px; overflow-x: auto; padding-bottom: 10px; scroll-snap-type: x mandatory; overscroll-behavior-inline: contain; }
.sheetGallery figure { margin: 0; scroll-snap-align: start; }
.sheetGallery img { width: 100%; height: clamp(240px, 38vw, 450px); object-fit: cover; border-radius: 15px; }
.sheetGallery figcaption { padding: 7px 2px; color: var(--muted); }
.responsiveEmbed { position: relative; min-height: 260px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: #06182d; aspect-ratio: 16/9; }
.responsiveEmbed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sheetExternalLink { display: inline-block; margin-top: 10px; color: var(--gold-300); }
.embedFallback { min-height: 120px; display: grid; place-items: center; gap: 12px; padding: 24px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); background: rgba(255,255,255,.025); text-align: center; }
.embedFallback p { margin: 0; }
.pdfViewer { display: grid; gap: 13px; }
.pdfViewer iframe { width: 100%; height: min(64dvh, 620px); border: 1px solid var(--line); border-radius: 15px; background: white; }
.sheetAudio { width: 100%; }
.sheetCallout { padding: 23px; border-left: 5px solid var(--gold-300); border-radius: 10px; background: rgba(217,161,58,.1); }
.sheetQuote { padding: 20px 26px; border-left: 2px solid var(--gold-300); color: var(--cream); font: 500 clamp(20px, 3vw, 29px)/1.5 var(--font-body); }
.sheetQuote cite { display: block; margin-top: 12px; color: var(--gold-300); font-size: 14px; }
.sheetSeparator { margin: 45px 0; border: 0; border-top: 1px solid var(--line); }
.sheetTableWrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 13px; }
.sheetTable { width: 100%; min-width: 520px; border-collapse: collapse; }
.sheetTable th, .sheetTable td { padding: 12px; border-bottom: 1px solid var(--line); text-align: left; }
.sheetTable th { color: var(--gold-300); background: rgba(255,255,255,.04); }
.sheetRelated { padding-bottom: 80px; }
.relatedContentGrid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.relatedContentCard { display: grid; grid-template-rows: 170px 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; color: var(--white); background: #071b31; text-decoration: none; }
.relatedThumb { overflow: hidden; }
.relatedThumb img { width: 100%; height: 100%; object-fit: cover; }
.relatedThumb .contentCoverMark { height: 100%; }
.relatedContentCard > span:last-child { display: grid; align-content: start; gap: 8px; padding: 18px; }
.relatedContentCard small, .relatedContentCard b { color: var(--gold-300); }
.relatedContentCard strong { font: 700 20px/1.2 var(--font-display); }
.relatedContentCard p { margin: 0; color: var(--muted); }

.contentSheetEditor { display: grid; gap: 22px; }
.contentPackageFields { display: grid; gap: 16px; padding: 18px; border: 1px solid var(--line-gold); border-radius: 15px; background: linear-gradient(145deg,rgba(11,44,77,.62),rgba(3,16,30,.7)); }
.contentPackageFields.hidden { display: none; }
.contentModeGrid { margin-bottom: 14px; }
.packageFileLabel { padding: 14px; border: 1px dashed rgba(239,185,77,.72); border-radius: 12px; background: rgba(239,185,77,.06); }
.packageWorkflow { padding: 14px; border: 1px solid var(--line); border-radius: 13px; background: rgba(0,0,0,.18); }
.packageWorkflowList { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.packageWorkflowList li { display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: start; gap: 10px; min-height: 92px; padding: 13px; border: 1px solid var(--line); border-radius: 11px; color: var(--muted); background: rgba(255,255,255,.025); }
.packageWorkflowList li > span { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-weight: 800; }
.packageWorkflowList li div { display: grid; gap: 5px; }
.packageWorkflowList strong { color: var(--cream); font: 700 16px/1.25 var(--font-display); }
.packageWorkflowList small { line-height: 1.4; }
.packageWorkflowList li.complete { color: #8fe0b2; border-color: rgba(83,190,127,.52); background: rgba(27,125,74,.18); }
.packageWorkflowList li.complete > span { color: #08271a; border-color: #8fe0b2; background: #8fe0b2; }
.packageWorkflowList li.current { color: var(--gold-300); border-color: var(--line-gold); background: rgba(239,185,77,.08); }
.packageWorkflowList li.current > span { color: var(--navy-950); border-color: var(--gold-300); background: var(--gold-300); }
.contentEditorActions button:disabled { opacity: .46; cursor: not-allowed; }
/* Respaldo para que el cargador se muestre incluso si el navegador conserva
   temporalmente una versión anterior del JavaScript. */
#contentsAdmin:has(#contentMode option[value="package"]:checked) #contentPackageFields { display: grid !important; }
.packageSwitch { align-self: end; min-height: 48px; }
.packageApproval, .packageSecurityReport, .packageVersions { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: rgba(0,0,0,.16); }
.packageApproval h5, .packageSecurityReport h5, .packageVersions h5 { margin: 0 0 9px; font: 700 16px var(--font-display); }
.packageApproval label { display: inline-flex; align-items: center; gap: 7px; margin: 5px 16px 5px 0; overflow-wrap: anywhere; }
.packageSecurityReport ul { margin: 10px 0; padding-left: 20px; color: var(--muted); line-height: 1.55; }
.packageReportStatus { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 10px; border-radius: 9px; }
.packageReportStatus.valid { color: #c8f6db; background: rgba(27,125,74,.24); }
.packageReportStatus.invalid { color: #ffc6c6; background: rgba(151,43,43,.24); }
.packageVersionRow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--line); }
.packageVersionRow span { display: grid; gap: 3px; }
.packageVersionRow small { color: var(--muted); }
.packageSheetMain { padding: clamp(14px,3vw,38px); background: var(--navy-950); }
.packageSheetToolbar { width: min(1180px,100%); margin: 0 auto 12px; display: flex; justify-content: flex-end; align-items: end; gap: 10px; }
.packageSheetToolbar label { display: grid; gap: 4px; color: var(--muted); font-size: 12px; }
.packageSheetToolbar .field { min-width: 150px; min-height: 40px; padding-block: 6px; }
.packageToolbarSpacer { flex: 1; }
.packagePreviewDevices { display: flex; flex-wrap: wrap; gap: 6px; }
.packagePreviewDevices .secondaryButton { min-height: 40px; padding: 8px 12px; }
.packagePreviewDevices .secondaryButton.active { color: var(--navy-950); border-color: var(--gold); background: var(--gold); }
.packageFrameShell { position: relative; width: min(1180px,100%); margin: 0 auto; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #001b35; box-shadow: 0 24px 70px rgba(0,0,0,.28); transition: width .24s ease; }
.packageFrameShell.fullWidth { width: 100%; border-radius: 12px; }
.packageFrameShell.preview-mobile { width: min(390px,100%); }
.packageFrameShell.preview-tablet { width: min(820px,100%); }
.packageFrameShell.preview-desktop { width: min(1180px,100%); }
.packageFrameShell.preview-full { width: 100%; }
.packageFrameStatus { display: none; position: absolute; inset: 0; z-index: 2; margin: 0; place-content: center; justify-items: center; gap: 12px; color: var(--cream); background: #001b35; text-align: center; }
.packageFrameShell.loading .packageFrameStatus { display: grid; }
.packageFrameStatus .secondaryButton { display: none; }
.packageFrameShell.slow .packageFrameStatus .secondaryButton { display: inline-flex; }
.contentPackageFrame { display: block; width: 100%; height: min(76dvh,760px); min-height: 420px; border: 0; background: #001b35; }
.packageSheetFooter { width: min(1180px,100%); margin: 12px auto 0; display: flex; justify-content: flex-end; align-items: center; gap: 9px; color: rgba(201,214,225,.65); font-size: 10px; text-align: right; }
.packageSheetFooter strong { color: #f5f6f7; font-size: 18px; }
.packageSheetFooter strong span { color: var(--gold-300); }
body[data-theme="light"] .packageSheetMain { background: #f4f7fa; }
body[data-theme="light"] .packageFrameShell { border-color: #ccd7e2; background: white; }
.contentEditorPreview { min-height: 0; }
.contentEditorPreview:not(:empty) { display: grid; grid-template-columns: 180px 1fr; gap: 14px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: 12px; }
.contentEditorPreview img { width: 180px; height: 105px; object-fit: cover; border-radius: 9px; }
.repeatableEditorSection { padding-top: 20px; border-top: 1px solid var(--line); }
.repeatableEditorHead { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 12px; margin-bottom: 13px; }
.repeatableEditorHead h4 { margin: 0; font: 700 22px var(--font-display); }
.repeatableEditorHead p { margin: 4px 0 0; }
.repeatableEditorHead > label { min-width: 210px; }
.repeatableEditor, .contentBlocksEditor { display: grid; gap: 10px; }
.repeatableEditorRow { display: grid; align-items: center; gap: 9px; padding: 10px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.025); }
.infoEditorRow { grid-template-columns: 24px minmax(120px,.7fr) minmax(180px,1.3fr) auto; }
.dragMark { color: var(--gold-300); font-size: 20px; cursor: grab; }
.rowActions { display: flex; gap: 5px; }
.contentBlockEditor { overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: rgba(0,0,0,.12); }
.contentBlockEditor > header { display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: 10px; padding: 12px; background: rgba(255,255,255,.045); }
.contentBlockEditor > header div:nth-child(2) { display: grid; }
.contentBlockEditor > header small { color: var(--muted); }
.blockFieldGrid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding: 14px; }
.blockFieldGrid > label { display: grid; gap: 6px; }
.blockGalleryFiles { grid-column: 1/-1; display: flex; flex-wrap: wrap; gap: 7px; }
.blockGalleryFiles span { position: relative; }
.blockGalleryFiles img { width: 85px; height: 64px; object-fit: cover; border-radius: 7px; }
.blockGalleryFiles button { position: absolute; top: 2px; right: 2px; width: 24px; height: 24px; border: 0; border-radius: 50%; color: white; background: rgba(0,0,0,.78); }
.pendingFile { color: var(--gold-300); }
.relatedSelector { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.relatedSelector label { display: grid; grid-template-columns: auto 1fr auto; gap: 9px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: 10px; }
.relatedSelector small { color: var(--muted); }
.contentEditorActions { position: sticky; bottom: 0; z-index: 3; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: rgba(6,24,45,.96); backdrop-filter: blur(14px); }
.contentAdminItem { grid-template-columns: 72px minmax(0,1fr) auto; }

@media (max-width: 760px) {
    .packageWorkflowList { grid-template-columns: 1fr; }
    .packageWorkflowList li { min-height: 0; }
    .contentEditorActions { display: grid; grid-template-columns: 1fr 1fr; }
    .contentEditorActions .primaryButton { grid-column: 1/-1; }
}

body[data-theme="light"] .contentSheet { color: #172b40; background: #fff; }
body[data-theme="light"] .contentViewerHeader { color: white; background: rgba(28,67,118,.97); }
body[data-theme="light"] .contentViewerIdentity strong { color: white; }
body[data-theme="light"] footer .projectCredit { color: rgba(255,255,255,.58); }
body[data-theme="light"] .sheetLayout, body[data-theme="light"] .sheetRelated { background: #fff; }
body[data-theme="light"] .sheetBlock h2, body[data-theme="light"] .sheetRelated h2 { color: #142b43; }
body[data-theme="light"] .sheetText p, body[data-theme="light"] .sheetCta p { color: #334d65; }
body[data-theme="light"] .sheetInfoPanel { color: white; }
body[data-theme="light"] .relatedContentCard { color: #172b40; border-color: #d7e0e8; background: white; box-shadow: 0 12px 30px rgba(25,54,83,.12); }
body[data-theme="light"] .relatedContentCard p { color: #53687d; }

@media (max-width: 850px) {
    #contentOverlay { top: 74px; }
    .sheetLayout { grid-template-columns: 1fr; }
    .sheetInfoPanel { grid-column: 1; grid-row: 1; position: static; }
    .sheetMain { grid-column: 1; grid-row: 2; }
    .relatedContentGrid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
    .entryReelSlide, .programSlide, .exploraSlide { object-position: var(--mobile-object-position, center); }
    .sheetHero picture img { object-position: var(--hero-mobile-position, center); }
    .sheetHero { min-height: clamp(280px, 46dvh, 410px); }
    .sheetHeroContent { padding-block: 35px 30px; }
    .sheetBreadcrumb { margin-bottom: 11px; font-size: 11px; }
    .sheetHero h1 { font-size: clamp(32px, 10vw, 49px); }
    .sheetHero p { margin-top: 10px; font-size: 16px; }
    .sheetLayout { gap: 28px; padding-block: 25px 50px; }
    .sheetInfoPanel { padding: 18px; }
    .sheetInfoPanel dl { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 15px; }
    .sheetText p { font-size: 16px; line-height: 1.65; }
    .responsiveEmbed { min-height: 190px; }
    .pdfViewer iframe { height: min(50dvh, 430px); }
    .sheetGallery { grid-auto-columns: 88%; }
    .sheetGallery img { height: 260px; }
    .relatedContentGrid { grid-template-columns: 1fr; }
    .relatedContentCard { grid-template-columns: 110px 1fr; grid-template-rows: 1fr; }
    .infoEditorRow { grid-template-columns: 20px 1fr auto; }
    .infoEditorRow [data-info-value] { grid-column: 2/4; }
    .blockFieldGrid { grid-template-columns: 1fr; }
    .blockFieldGrid .fullField, .blockGalleryFiles { grid-column: 1; }
    .relatedSelector { grid-template-columns: 1fr; }
    .contentEditorPreview:not(:empty) { grid-template-columns: 100px 1fr; }
    .contentEditorPreview img { width: 100px; height: 80px; }
    .contentAdminItem { grid-template-columns: 58px minmax(0,1fr); }
    .packageSheetMain { padding: 8px; }
    .packageFrameShell, .packageFrameShell.fullWidth { border-radius: 12px; }
    .contentPackageFrame { min-height: 360px; }
    .packageVersionRow { align-items: stretch; flex-direction: column; }
    .packageVersionRow .secondaryButton { width: 100%; }
    .packageSheetToolbar { justify-content: stretch; }
    .packageSheetToolbar { align-items: stretch; flex-direction: column; }
    .packageSheetToolbar label, .packageSheetToolbar .field, .packageSheetToolbar > .secondaryButton { width: 100%; }
    .packagePreviewDevices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .packagePreviewDevices .secondaryButton { width: 100%; }
    .packageSheetFooter { padding-right: 4px; }
}

@media (max-width: 620px) {
    #contentOverlay { top: 66px; bottom: 66px; }
    #contentOverlay.isFullscreen { inset: 0; }
    #contentOverlay .overlayNav { min-height: 62px; }
    .contentViewerNav { width: calc(100% - 20px); grid-template-columns: auto minmax(90px,1fr) auto; gap: 7px; }
    .contentBackButton { min-height: 40px; padding: 8px 9px; font-size: 11px; }
    .contentViewerIdentity { gap: 0; }
    .contentViewerIdentity small { display: none; }
    .contentViewerIdentity strong { font-size: 12px; }
    .contentViewerActions { gap: 5px; }
    .contentViewerActions .ghostButton { width: 40px; min-height: 40px; padding: 0; font-size: 0; }
    #shareContentButton::before { content: "↗"; font-size: 19px; }
    #fullscreenContentButton::before { content: "⛶"; font-size: 19px; }
    .contentBackToTop { right: 12px; bottom: 80px; min-width: 44px; min-height: 44px; justify-content: center; padding: 9px; }
    .contentBackToTop b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
    .sheetInfoPanel dl { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .contentBackToTop { transition: none; }
}

/* v5.6 · redimensionado real, tipografía adaptativa y contacto operativo */
.responsiveLayout > [data-layout-module] {
    container-type: inline-size;
    overflow-wrap: anywhere;
}

.layoutHeight-fixed-desktop {
    height: var(--desktop-height, auto) !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: auto !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.layoutHeight-auto-desktop {
    height: auto !important;
}

.layoutDensity-tight-desktop .sectionHeading { margin-bottom: 10px; }
.layoutDensity-tight-desktop .sectionHeading h2,
.layoutDensity-tight-desktop .exploreToolbar h2 { font-size: clamp(21px, 3cqi, 30px); }
.layoutDensity-tight-desktop .sectionHeading p,
.layoutDensity-tight-desktop .activitySummary { font-size: 13px; }
.layoutDensity-compact-desktop .sectionHeading p,
.layoutDensity-compact-desktop .activitySummary,
.layoutDensity-compact-desktop .eventOrganizer { display: none; }
.layoutDensity-compact-desktop .sectionHeading h2,
.layoutDensity-compact-desktop .exploreToolbar h2 { font-size: clamp(18px, 2.7cqi, 25px); }

.layoutEditorModule {
    min-height: 200px;
    height: clamp(200px, var(--editor-height, 260px), 520px);
    max-height: 520px;
    overflow: auto;
}

.layoutEditorModule .layoutLivePreview {
    min-height: 130px;
    max-height: 280px;
}

.layoutEditorModule [data-layout-height-mode] { min-width: 132px; }
.layoutEditorModule [data-layout-height]:disabled { opacity: .45; cursor: not-allowed; }

.activityPosterCard,
.managedContentCard,
.gatewayCard {
    container-type: inline-size;
}

.activityTitle {
    max-width: 100%;
    font-size: clamp(17px, 4.2cqi, 32px);
    line-height: 1.08;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

.activityInfoPanel { overflow-x: hidden; }
.activityInfoPanel b,
.activityMeta b { overflow-wrap: anywhere; }

@container (max-width: 700px) {
    .sectionHeading h2,
    .exploreToolbar h2 { font-size: clamp(23px, 8cqi, 34px); }
    .sectionHeading p { font-size: clamp(13px, 3.8cqi, 16px); }
    .managedContentInfo h3 { font-size: clamp(20px, 6.5cqi, 30px); overflow-wrap: anywhere; }
}

@container (max-width: 600px) {
    .activityBadgeStack {
        top: 14px;
        left: 14px;
    }
    .activityInfoPanel {
        top: 14px;
        right: 14px;
        bottom: 14px;
        left: clamp(120px, 38%, 145px);
        width: auto;
        min-height: 0;
        max-height: calc(100% - 28px);
        padding: clamp(14px, 5cqi, 20px);
    }
    .activityDateBadge {
        top: 14px;
        left: 14px;
        min-width: 68px;
        padding: 10px 8px;
    }
    .activityDateBadge strong { font-size: clamp(30px, 12cqi, 40px); }
    .activityTitle { font-size: clamp(17px, 6.7cqi, 27px); }
    .activitySummary {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
    }
}

@container (max-width: 360px) {
    .activityTags,
    .activitySummary,
    .activityInfoPanel .eventOrganizer { display: none; }
    .activityInfoPanel { padding: 13px; }
    .activityTitle { font-size: clamp(16px, 8cqi, 22px); }
    .activityMeta { font-size: 12px; }
    .managedContentInfo p { -webkit-line-clamp: 2; }
}

.footerContactBlock { min-width: 0; }
#contactHeading:focus-visible { outline: 3px solid var(--gold-300); outline-offset: 6px; }
#footerContact {
    display: grid;
    gap: 5px;
    margin-top: 10px;
    color: var(--muted);
    font-style: normal;
}
#footerContact a {
    width: fit-content;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    color: var(--gold-300);
    overflow-wrap: anywhere;
}

.exploreContentsModule.noCategoryContents { display: none !important; }
.exploreToolsModule { scroll-margin-top: 110px; }
.exploreToolsModule.categoryFocused { position: relative; }
.exploreToolsModule.categoryFocused::before {
    content: "";
    position: absolute;
    inset: -17px;
    z-index: -1;
    border: 1px solid rgba(217,161,58,.32);
    border-radius: 22px;
    background: linear-gradient(145deg,rgba(217,161,58,.045),transparent 52%);
    animation: categoryFocusGlow .65s ease both;
}
.toolsGrid.isRefreshing > * { animation: managedCardArrival .48s ease both; }
.toolsGrid.isRefreshing > :nth-child(2) { animation-delay: .06s; }
.toolsGrid.isRefreshing > :nth-child(3) { animation-delay: .12s; }

@media (max-width: 760px) {
    .layoutHeight-fixed-mobile {
        height: var(--mobile-height, auto) !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }
    .layoutHeight-auto-mobile { height: auto !important; }
    .layoutDensity-tight-mobile .sectionHeading { margin-bottom: 9px; }
    .layoutDensity-tight-mobile .sectionHeading h2,
    .layoutDensity-tight-mobile .exploreToolbar h2 { font-size: clamp(19px, 7cqi, 26px); }
    .layoutDensity-compact-mobile .sectionHeading p,
    .layoutDensity-compact-mobile .activitySummary,
    .layoutDensity-compact-mobile .eventOrganizer { display: none; }
    .layoutDensity-compact-mobile .sectionHeading h2,
    .layoutDensity-compact-mobile .exploreToolbar h2 { font-size: clamp(17px, 6.5cqi, 22px); }
    .layoutEditorModule {
        height: clamp(220px, var(--editor-height, 280px), 460px);
        max-height: 460px;
    }
    .exploreToolsModule { scroll-margin-top: 82px; }
    #footerContact a { min-height: 38px; }
}

@media (prefers-reduced-motion: reduce) {
    .exploreToolsModule.categoryFocused::before,
    .toolsGrid.isRefreshing > * { animation: none; }
}

/* v5.7 · módulos plenamente jugables, navegación dinámica y evento en el reel */
.entryReelFallback { z-index: 0; }
.entryReelSlides { z-index: 1; }
.entryReelShade { z-index: 2; pointer-events: none; }
.entryReel .carouselButton,
.entryReel .carouselDots { z-index: 4; }
.entryReelSlide { z-index: 0; border: 0; opacity: 0; pointer-events: none; }
.entryReelSlide.active { z-index: 1; opacity: 1; pointer-events: auto; }
.entryEventSlide { display: block; padding: 0; color: #fff; background: #06182d; text-align: left; cursor: pointer; }
.entryEventBackground,
.entryEventBackground > img,
.entryEventShade { position: absolute; inset: 0; width: 100%; height: 100%; }
.entryEventBackground > img { object-fit: cover; object-position: var(--desktop-object-position,center); }
.entryEventFallback { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(240,189,84,.72); background: radial-gradient(circle at 78% 20%,#174c77,#06182d 64%); font-size: clamp(90px,18vw,210px); }
.entryEventShade { background: linear-gradient(90deg,rgba(2,10,19,.94),rgba(2,10,19,.54) 58%,rgba(2,10,19,.18)),linear-gradient(0deg,rgba(2,10,19,.48),transparent 54%); }
.entryEventContent { position: absolute; z-index: 2; left: clamp(28px,6vw,84px); bottom: clamp(28px,12%,70px); width: min(660px,72%); display: grid; gap: 8px; text-shadow: 0 3px 20px rgba(0,0,0,.8); }
.entryEventContent small { color: var(--gold-300); font: 700 11px var(--font-display); letter-spacing: .12em; text-transform: uppercase; }
.entryEventContent strong { color: var(--cream); font: 800 clamp(25px,4.1vw,54px)/1.02 var(--font-display); overflow-wrap: anywhere; }
.entryEventContent span { color: #e9f0f6; font-size: clamp(12px,1.6vw,17px); }
.entryEventContent b { width: fit-content; margin-top: 3px; color: var(--gold-300); font-size: 12px; }

.categoryCard { position: relative; display: flex; flex-direction: column; }
.categoryCopy {
    min-height: 112px;
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-template-rows: auto minmax(0,1fr) auto;
    overflow: hidden;
}
.categoryName,
.categoryDynamicText {
    position: static;
    grid-column: 1;
    margin: 0 !important;
    overflow-wrap: anywhere;
    transition: opacity .38s ease,transform .58s cubic-bezier(.2,.78,.2,1),color .38s ease;
}
.categoryName {
    grid-row: 1;
    align-self: start;
    color: var(--gold-300);
    font: 700 clamp(27px,2vw,34px)/1.08 var(--font-display) !important;
}
.categoryDynamicText {
    grid-row: 2;
    align-self: start;
    margin-top: 10px !important;
    color: #eef4fa;
    font: 400 14px/1.35 var(--font-body);
}
.categoryCard.isContentTurn .categoryName {
    grid-row: 3;
    align-self: end;
    font: 700 clamp(27px,2vw,34px)/1.08 var(--font-display) !important;
    animation: categoryNameSettle .58s cubic-bezier(.2,.78,.2,1) both;
}
.categoryCard.isContentTurn .categoryDynamicText {
    grid-row: 1;
    align-self: start;
    display: -webkit-box;
    margin-top: 0 !important;
    overflow: hidden;
    color: #fff;
    font: 700 clamp(27px,2vw,34px)/1.08 var(--font-display);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    animation: categoryContentArrival .48s ease both;
}
.categoryCard.isContentTurn.hasLongDynamicTitle .categoryDynamicText { font-size: clamp(22px,1.7vw,28px); }
.categoryCard.isContentTurn.hasVeryLongDynamicTitle .categoryDynamicText { font-size: clamp(18px,1.45vw,24px); }
@keyframes categoryNameSettle { from { opacity: .35; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes categoryContentArrival { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.categoryShowAll { align-self: center; min-height: 48px; padding: 11px 17px; border: 1px solid var(--gold-300); border-radius: 999px; color: var(--gold-300); background: rgba(4,18,34,.94); font-weight: 800; cursor: pointer; }
.categoryGrid.hasSelection {
    position: sticky;
    top: 82px;
    z-index: 18;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) auto;
    align-items: stretch;
    gap: 10px;
    margin: 12px 0 24px;
    padding: 10px;
    overflow: visible !important;
    border: 1px solid rgba(217,161,58,.35);
    border-radius: 18px;
    background: rgba(3,16,30,.88);
    box-shadow: 0 18px 50px rgba(0,0,0,.36);
    backdrop-filter: blur(18px);
}
.categoryGrid.hasSelection .categoryCard { height: 112px; min-height: 112px; padding: 12px 14px; box-shadow: none; }
.categoryGrid.hasSelection .categoryIcon { position: absolute; top: 12px; left: 14px; margin: 0; font-size: 20px; }
.categoryGrid.hasSelection .categoryCopy { min-height: 84px; }
.categoryGrid.hasSelection .categoryName,
.categoryGrid.hasSelection .categoryCard.isContentTurn .categoryName {
    grid-row: 3;
    align-self: end;
    font: 700 clamp(16px,1.25vw,20px)/1.08 var(--font-display) !important;
    animation: none;
}
.categoryGrid.hasSelection .categoryDynamicText {
    grid-row: 1;
    align-self: start;
    display: -webkit-box;
    margin: 0 0 0 34px !important;
    overflow: hidden;
    opacity: 0;
    color: #fff;
    font: 700 clamp(12px,1vw,15px)/1.12 var(--font-display);
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.categoryGrid.hasSelection .categoryCard.isContentTurn .categoryDynamicText {
    grid-row: 1;
    opacity: 1;
    font: 700 clamp(12px,1vw,15px)/1.12 var(--font-display);
    animation: categoryContentArrival .38s ease both;
}
.categoryGrid.hasSelection .categoryCard.isContentTurn.hasLongDynamicTitle .categoryDynamicText,
.categoryGrid.hasSelection .categoryCard.isContentTurn.hasVeryLongDynamicTitle .categoryDynamicText { font-size: 11px; -webkit-line-clamp: 2; }
.categoryGrid.hasSelection .categoryShowAll { min-height: 112px; align-self: stretch; border-radius: 14px; }
.exploreContentsModule,
.exploreToolsModule { scroll-margin-top: 210px; }

.layoutEditorModule { height: max(250px,var(--editor-height,260px)); min-height: 250px; max-height: none; overflow: hidden; grid-template-rows: auto minmax(90px,1fr) auto auto; touch-action: pan-y; }
.layoutEditorModule .layoutLivePreview { min-height: 90px; max-height: none; overflow: hidden; }
.layoutEditorModule .layoutLivePreview > * { min-height: 0 !important; }
.layoutEditorModule.isResizing { user-select: none; touch-action: none; }
.layoutDragHandle { touch-action: none; }

@media (min-width: 761px) {
    .layoutHeight-fixed-desktop {
        container-type: size;
        height: var(--desktop-height,auto) !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: hidden !important;
    }
    .layoutHeight-auto-desktop { height: auto !important; overflow: visible !important; }
    .layoutHeight-fixed-desktop.contentBlock,
    .layoutHeight-fixed-desktop.exploreContentsModule,
    .layoutHeight-fixed-desktop.exploreToolsModule { display: flex; flex-direction: column; }
    .layoutHeight-fixed-desktop.contentBlock > :last-child,
    .layoutHeight-fixed-desktop.exploreContentsModule > :last-child,
    .layoutHeight-fixed-desktop.exploreToolsModule > :last-child { min-height: 0; flex: 1 1 auto; overflow: auto; scrollbar-width: thin; }
    .layoutHeight-fixed-desktop .featuredEvent,
    .layoutHeight-fixed-desktop .activityPosterCard { height: 100%; min-height: 0; }
    .layoutHeight-fixed-desktop.gatewayGrid,
    body[data-template="panorama"] .layoutHeight-fixed-desktop.gatewayGrid,
    body[data-template="editorial"] .layoutHeight-fixed-desktop.gatewayGrid { min-height: 0; grid-template-rows: minmax(0,.78fr) minmax(0,1.22fr); }
    .layoutHeight-fixed-desktop.categoryGrid { align-content: stretch; margin-block: 0; }
    .layoutHeight-fixed-desktop.categoryGrid:not(.hasSelection) .categoryCard { min-height: 0; }

    .layoutDensity-compact-desktop .sectionHeading { margin-bottom: 7px; }
    .layoutDensity-compact-desktop .sectionKicker,
    .layoutDensity-compact-desktop .textButton,
    .layoutDensity-compact-desktop .leaderCard,
    .layoutDensity-compact-desktop .agendaMonthNav { display: none; }
    .layoutDensity-compact-desktop .groupLayout { grid-template-columns: 1fr; }
    .layoutDensity-compact-desktop .rankRow,
    .layoutDensity-compact-desktop .studentRow { padding-block: 7px; }
    .layoutDensity-compact-desktop .searchPanel { grid-template-columns: 1fr; gap: 8px; padding: 15px; }
    .layoutDensity-compact-desktop .searchPanel p,
    .layoutDensity-compact-desktop .studentResult,
    .layoutDensity-compact-desktop .spotifyHead { display: none; }
    .layoutDensity-compact-desktop .studentSearchBox { padding: 11px; }
    .layoutDensity-compact-desktop .spotifyPanel { padding: 10px; }
    .layoutDensity-compact-desktop .spotifyEmbed { height: 100%; min-height: 120px; }
    .layoutDensity-compact-desktop .agendaTabs { margin-bottom: 8px; }
    .layoutDensity-compact-desktop .eventGrid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
    .layoutDensity-compact-desktop .eventGrid .activityPosterCard { min-height: 170px; }
    .layoutDensity-micro-desktop .sectionHeading p,
    .layoutDensity-micro-desktop .activityTags,
    .layoutDensity-micro-desktop .activitySummary,
    .layoutDensity-micro-desktop .activityInfoPanel .eventOrganizer,
    .layoutDensity-micro-desktop .gatewayLiveData,
    .layoutDensity-micro-desktop .gatewayContent small,
    .layoutDensity-micro-desktop .gatewayProgramLogo,
    .layoutDensity-micro-desktop .agendaTabs { display: none; }
    .layoutDensity-micro-desktop .activityBadgeStack { top: 9px; left: 9px; gap: 4px; }
    .layoutDensity-micro-desktop .activityDateBadge { top: 9px; left: 9px; min-width: 56px; padding: 7px; }
    .layoutDensity-micro-desktop .activityDateBadge strong { font-size: 25px; }
    .layoutDensity-micro-desktop .activityScoringBadge { width: 64px; }
    .layoutDensity-micro-desktop .activityInfoPanel { inset: 9px 9px 9px auto; width: min(62%,420px); min-height: 0; max-height: none; padding: 10px; }
    .layoutDensity-micro-desktop .activityTitle { font-size: clamp(14px,3.4cqi,20px); }
    .layoutDensity-micro-desktop.gatewayGrid { grid-template-rows: 1fr 1fr; }
    .layoutDensity-micro-desktop .gatewayContent { inset: auto 12px 10px; }
    .layoutDensity-micro-desktop .gatewayContent strong,
    .layoutDensity-micro-desktop .programIdentity strong { font-size: clamp(17px,4cqi,24px); }
    .layoutDensity-micro-desktop .gatewayAction { margin-top: 5px; }
    .layoutDensity-micro-desktop .gatewayAction b { width: 25px; height: 25px; }
}

@media (max-width: 760px) {
    .entryEventBackground > img { object-position: var(--mobile-object-position,center); }
    .entryEventShade { background: linear-gradient(0deg,rgba(2,10,19,.96),rgba(2,10,19,.22) 82%); }
    .entryEventContent { right: 22px; bottom: 23px; left: 22px; width: auto; gap: 5px; }
    .entryEventContent strong { font-size: clamp(22px,7.5vw,34px); }
    .entryEventContent span { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

    .categoryGrid.hasSelection { top: 66px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(150px,58vw); grid-template-columns: none; overflow-x: auto !important; padding: 8px; scroll-snap-type: x proximity; }
    .categoryGrid.hasSelection .categoryCard { height: 104px; min-height: 104px; scroll-snap-align: start; }
    .categoryGrid.hasSelection .categoryName,
    .categoryGrid.hasSelection .categoryCard.isContentTurn .categoryName { font-size: 17px !important; }
    .categoryGrid.hasSelection .categoryShowAll { min-width: 94px; min-height: 104px; }
    .exploreContentsModule,
    .exploreToolsModule { scroll-margin-top: 190px; }

    .layoutHeight-fixed-desktop { height: auto !important; min-height: 0 !important; overflow: visible !important; }
    .layoutDensity-tight-desktop .sectionHeading { margin-bottom: 18px; }
    .layoutDensity-tight-desktop .sectionHeading h2,
    .layoutDensity-tight-desktop .exploreToolbar h2,
    .layoutDensity-compact-desktop .sectionHeading h2,
    .layoutDensity-compact-desktop .exploreToolbar h2 { font-size: clamp(25px,8vw,38px); }
    .layoutDensity-tight-desktop .sectionHeading p { font-size: inherit; }
    .layoutDensity-tight-desktop .activitySummary { font-size: 14px; }
    .layoutDensity-compact-desktop .sectionHeading p,
    .layoutDensity-compact-desktop .activitySummary { display: revert; }
    .layoutDensity-compact-desktop .eventOrganizer { display: grid; }

    .layoutHeight-fixed-mobile {
        container-type: size;
        height: var(--mobile-height,auto) !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: hidden !important;
    }
    .layoutHeight-auto-mobile { height: auto !important; overflow: visible !important; }
    .layoutHeight-fixed-mobile.contentBlock,
    .layoutHeight-fixed-mobile.exploreContentsModule,
    .layoutHeight-fixed-mobile.exploreToolsModule { display: flex; flex-direction: column; }
    .layoutHeight-fixed-mobile.contentBlock > :last-child,
    .layoutHeight-fixed-mobile.exploreContentsModule > :last-child,
    .layoutHeight-fixed-mobile.exploreToolsModule > :last-child { min-height: 0; flex: 1 1 auto; overflow: auto; scrollbar-width: thin; }
    .layoutHeight-fixed-mobile .featuredEvent,
    .layoutHeight-fixed-mobile .activityPosterCard { height: 100%; min-height: 0; }
    .layoutHeight-fixed-mobile.gatewayGrid,
    body[data-template="panorama"] .layoutHeight-fixed-mobile.gatewayGrid,
    body[data-template="editorial"] .layoutHeight-fixed-mobile.gatewayGrid { min-height: 0; grid-template-rows: minmax(0,1.2fr) minmax(0,.8fr); }
    .layoutHeight-fixed-mobile.categoryGrid { margin-block: 0; }
    .layoutHeight-fixed-mobile.categoryGrid:not(.hasSelection) { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .layoutHeight-fixed-mobile.categoryGrid:not(.hasSelection) .categoryCard { min-height: 0; padding: 14px; }

    .layoutDensity-compact-mobile .sectionHeading { margin-bottom: 7px; }
    .layoutDensity-compact-mobile .sectionKicker,
    .layoutDensity-compact-mobile .textButton,
    .layoutDensity-compact-mobile .leaderCard,
    .layoutDensity-compact-mobile .agendaMonthNav { display: none; }
    .layoutDensity-compact-mobile .groupLayout { grid-template-columns: 1fr; }
    .layoutDensity-compact-mobile .rankRow,
    .layoutDensity-compact-mobile .studentRow { padding-block: 6px; }
    .layoutDensity-compact-mobile .searchPanel { grid-template-columns: 1fr; gap: 7px; padding: 13px; }
    .layoutDensity-compact-mobile .searchPanel p,
    .layoutDensity-compact-mobile .studentResult,
    .layoutDensity-compact-mobile .spotifyHead { display: none; }
    .layoutDensity-compact-mobile .studentSearchBox { padding: 10px; }
    .layoutDensity-compact-mobile .spotifyPanel { padding: 9px; }
    .layoutDensity-compact-mobile .spotifyEmbed { height: 100%; min-height: 100px; }
    .layoutDensity-compact-mobile .eventGrid { gap: 8px; }
    .layoutDensity-compact-mobile .eventGrid .activityPosterCard { min-height: 170px; }

    .layoutDensity-micro-mobile .sectionHeading p,
    .layoutDensity-micro-mobile .activityTags,
    .layoutDensity-micro-mobile .activitySummary,
    .layoutDensity-micro-mobile .activityInfoPanel .eventOrganizer,
    .layoutDensity-micro-mobile .gatewayLiveData,
    .layoutDensity-micro-mobile .gatewayContent small,
    .layoutDensity-micro-mobile .gatewayProgramLogo,
    .layoutDensity-micro-mobile .agendaTabs { display: none; }
    .layoutDensity-micro-mobile .activityBadgeStack { top: 8px; left: 8px; gap: 3px; }
    .layoutDensity-micro-mobile .activityDateBadge { top: 8px; left: 8px; min-width: 52px; padding: 6px; }
    .layoutDensity-micro-mobile .activityDateBadge strong { font-size: 23px; }
    .layoutDensity-micro-mobile .activityScoringBadge { width: 60px; }
    .layoutDensity-micro-mobile .activityInfoPanel { inset: 8px 8px 8px auto; width: 64%; min-height: 0; max-height: none; padding: 9px; }
    .layoutDensity-micro-mobile .activityTitle { font-size: clamp(13px,5.5cqi,18px); }
    .layoutDensity-micro-mobile.gatewayGrid { grid-template-rows: 1fr 1fr; }
    .layoutDensity-micro-mobile .gatewayContent { inset: auto 10px 8px; }
    .layoutDensity-micro-mobile .gatewayContent strong,
    .layoutDensity-micro-mobile .programIdentity strong { font-size: clamp(16px,6cqi,21px); }
    .layoutDensity-micro-mobile .gatewayAction { margin-top: 3px; }
    .layoutDensity-micro-mobile .gatewayAction b { width: 23px; height: 23px; }

    .visualLayoutEditor { grid-template-columns: 1fr; }
    .layoutEditorModule { grid-column: 1 !important; }
}

body[data-theme="light"] .categoryGrid.hasSelection { background: rgba(255,255,255,.92); box-shadow: 0 18px 45px rgba(25,54,83,.18); }
body[data-theme="light"] .categoryShowAll { color: #895600; background: #fff; }

@container (max-width: 520px) {
    .sectionHeading { align-items: start; flex-direction: column; gap: 7px; }
    .sectionHeading h2,
    .exploreToolbar h2 { font-size: clamp(19px,8cqi,29px); }
    .gatewayContent { inset: auto 16px 14px; }
    .gatewayContent strong,
    .programIdentity strong { font-size: clamp(21px,10cqi,36px); overflow-wrap: anywhere; }
    .gatewayContent small { font-size: clamp(12px,4cqi,15px); }
    .gatewayLiveData { grid-template-columns: 1fr; gap: 5px; }
    .gatewayLiveItem:nth-child(n+2) { display: none; }
    .rankRow { grid-template-columns: 34px minmax(0,1fr) auto; gap: 8px; }
    .rankRow .rankIcon { display: none; }
    .rankPoints { font-size: 16px; }
    .studentRow { grid-template-columns: 34px minmax(0,1fr) auto; gap: 8px; }
    .studentInstrument { display: none; }
    .searchPanel { grid-template-columns: 1fr; gap: 12px; padding: 18px; }
    .searchPanel h2 { font-size: clamp(22px,9cqi,34px); }
    .managedContentInfo h3,
    .toolCardBody h3 { font-size: clamp(18px,7.5cqi,28px); overflow-wrap: anywhere; }
    .managedContentInfo p,
    .toolCardBody p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
}

@container (max-width: 340px) {
    .sectionHeading p,
    .gatewayContent small,
    .gatewayLiveData,
    .rankTrack,
    .managedContentInfo p,
    .toolCardBody p { display: none; }
    .gatewayProgramLogo { width: 68px; }
    .gatewayAction { margin-top: 8px; }
    .studentSearchBox > div { align-items: stretch; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
    .categoryName,
    .categoryDynamicText { transition: none; animation: none !important; }
}

/* v5.12 RC1 · cierre persistente y navegación estable del visor */
.adminHeader {
    flex: 0 0 auto;
    padding-top: max(18px, env(safe-area-inset-top));
}
.adminHeader #closeAdminButton { flex: 0 0 auto; position: relative; z-index: 4; }
.adminPanelCloseBar {
    position: sticky;
    top: 0;
    z-index: 12;
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: -12px 0 18px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(239,189,85,.24);
    background: linear-gradient(180deg, #061a2f 70%, rgba(6,26,47,.9));
    backdrop-filter: blur(14px);
}
.adminPanelCloseBar small { min-width: 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.adminPanelCloseBar .ghostButton { flex: 0 0 auto; min-height: 42px; border-color: var(--line-gold); color: var(--gold-300); }

.contentViewerNavigation { display: flex; justify-self: start; align-items: center; gap: 8px; }
.contentViewerNavigation .ghostButton { min-height: 42px; padding-inline: 13px; }
.contentCloseButton { border-color: rgba(255,139,139,.5); color: #ffd2d2; }

.sheetDestinations {
    padding-block: 8px 82px;
    background: var(--navy-950);
}
.sheetDestinationsHeader { max-width: 760px; margin-bottom: 20px; }
.sheetDestinationsHeader h2 { margin: 5px 0 8px; color: var(--cream); font: 700 clamp(25px,3.2vw,38px)/1.12 var(--font-display); }
.sheetDestinationsHeader p { margin: 0; color: var(--muted); line-height: 1.55; }
.sheetDestinationGrid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.sheetDestinationButton {
    width: 100%;
    min-height: 132px;
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 21px;
    border: 1px solid var(--line-gold);
    border-radius: 17px;
    color: var(--white);
    background: linear-gradient(145deg,rgba(13,45,73,.96),rgba(5,24,43,.98));
    box-shadow: 0 16px 36px rgba(0,0,0,.18);
    text-align: left;
    cursor: pointer;
}
.sheetDestinationButton:hover, .sheetDestinationButton:focus-visible { transform: translateY(-2px); border-color: var(--gold-300); box-shadow: 0 20px 44px rgba(0,0,0,.28); }
.sheetDestinationButton:focus-visible { outline: 3px solid rgba(239,189,85,.48); outline-offset: 3px; }
.sheetDestinationIcon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--line-gold); border-radius: 50%; color: var(--gold-300); font-size: 23px; }
.sheetDestinationCopy { min-width: 0; display: grid; gap: 6px; }
.sheetDestinationCopy strong { color: var(--cream); font: 700 21px/1.18 var(--font-display); }
.sheetDestinationCopy small { color: var(--muted); font-size: 14px; line-height: 1.45; }
.sheetDestinationArrow { color: var(--gold-300); font-size: 23px; }
.sheetDestinationButton.isUnavailable { opacity: .64; cursor: not-allowed; }

.declaredDestinations { display: grid; gap: 8px; }
.declaredDestinations:not(:empty) { margin-bottom: 12px; padding: 12px; border: 1px solid rgba(239,189,85,.28); border-radius: 12px; background: rgba(239,189,85,.055); }
.declaredDestinationRow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }
.declaredDestinationRow code { padding: 3px 7px; border-radius: 6px; color: var(--gold-300); background: rgba(0,0,0,.25); }
.destinationEditor { display: grid; gap: 10px; }
.destinationEditorRow { display: grid; grid-template-columns: minmax(145px,.75fr) minmax(180px,1fr) minmax(180px,1fr) auto; gap: 10px; align-items: end; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.025); }
.destinationEditorRow .destinationDescriptionField { grid-column: 1/4; }
.destinationEditorRow .destinationOptions { grid-column: 1/4; display: grid; grid-template-columns: minmax(110px,.35fr) minmax(90px,.25fr) minmax(180px,1fr); gap: 10px; align-items: end; }
.destinationEditorRow .rowActions { grid-row: 1/3; grid-column: 4; align-self: center; }
.destinationEditorEmpty { padding: 16px; border: 1px dashed var(--line); border-radius: 11px; color: var(--muted); text-align: center; }

body[data-theme="light"] .sheetDestinations { background: #fff; }
body[data-theme="light"] .sheetDestinationsHeader h2 { color: #142b43; }
body[data-theme="light"] .sheetDestinationButton { color: #172b40; border-color: #d7b15b; background: white; box-shadow: 0 12px 30px rgba(25,54,83,.12); }
body[data-theme="light"] .sheetDestinationCopy strong { color: #142b43; }
body[data-theme="light"] .sheetDestinationCopy small { color: #53687d; }

@media (max-width: 850px) {
    .adminPanelCloseBar { margin-top: -6px; }
    .destinationEditorRow { grid-template-columns: 1fr 1fr auto; }
    .destinationEditorRow .destinationLabelField { grid-column: 1/3; }
    .destinationEditorRow .destinationDescriptionField { grid-column: 1/3; }
    .destinationEditorRow .destinationOptions { grid-column: 1/3; }
    .destinationEditorRow .rowActions { grid-column: 3; grid-row: 1/4; }
}

@media (max-width: 760px) {
    .sheetDestinationGrid { grid-template-columns: 1fr; }
    .sheetDestinations { padding-bottom: 64px; }
    .sheetDestinationButton { min-height: 112px; padding: 17px; }
    .destinationEditorRow { grid-template-columns: 1fr auto; }
    .destinationEditorRow > label, .destinationEditorRow .destinationLabelField, .destinationEditorRow .destinationDescriptionField, .destinationEditorRow .destinationOptions { grid-column: 1; }
    .destinationEditorRow .destinationOptions { grid-template-columns: 1fr; }
    .destinationEditorRow .rowActions { grid-column: 2; grid-row: 1/6; flex-direction: column; }
}

@media (max-width: 620px) {
    .contentViewerNav { grid-template-columns: auto minmax(76px,1fr) auto; }
    .contentViewerNavigation { gap: 4px; }
    .contentViewerNavigation .ghostButton { width: 40px; min-height: 40px; padding: 0; font-size: 0; }
    #contentBackButton::before { content: "←"; font-size: 20px; }
    #contentHomeButton::before { content: "⌂"; font-size: 19px; }
    #closeContentButton::before { content: "×"; font-size: 25px; }
    .adminPanelCloseBar small { display: none; }
    .adminPanelCloseBar { justify-content: flex-end; }
}

.viewerModuleReturnBar {
    position: fixed;
    z-index: 120;
    top: max(10px, env(safe-area-inset-top));
    left: 50%;
    width: min(760px, calc(100% - 24px));
    min-height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 12px 10px 18px;
    border: 1px solid var(--line-gold);
    border-radius: 16px;
    background: rgba(5,24,43,.97);
    box-shadow: 0 18px 50px rgba(0,0,0,.38);
    backdrop-filter: blur(16px);
    transform: translateX(-50%);
}
.viewerModuleReturnBar > span { min-width: 0; display: grid; gap: 2px; }
.viewerModuleReturnBar small { color: var(--gold-300); }
.viewerModuleReturnBar strong { overflow: hidden; color: var(--cream); text-overflow: ellipsis; white-space: nowrap; }
.viewerModuleReturnBar > div { display: flex; gap: 8px; flex: 0 0 auto; }
.destinationUnavailable { max-width: 620px; }
.destinationUnavailable h2 { margin: 8px 0; font: 700 clamp(26px,4vw,40px)/1.1 var(--font-display); }
.destinationUnavailable p { margin: 0 0 22px; color: var(--muted); line-height: 1.6; }

body[data-theme="light"] .viewerModuleReturnBar { background: rgba(255,255,255,.97); box-shadow: 0 16px 40px rgba(25,54,83,.2); }
body[data-theme="light"] .viewerModuleReturnBar strong { color: #142b43; }

@media (max-width: 620px) {
    .viewerModuleReturnBar { align-items: stretch; padding: 9px; }
    .viewerModuleReturnBar > span { display: none; }
    .viewerModuleReturnBar > div { width: 100%; }
    .viewerModuleReturnBar button { flex: 1 1 50%; }
}

/* v5.13 RC1 · navegación limpia, categorías visuales y estabilidad responsive */

/* Área privada: un único cierre, el de la cabecera general. */
.adminPanelCloseBar { display: none !important; }
.adminHeader { position: sticky; top: 0; z-index: 40; }

/* Los interruptores permanecen dentro de su etiqueta: evita saltos de foco y scroll. */
.switchLabel { position: relative; isolation: isolate; }
.switchLabel input {
    position: absolute;
    left: 18px;
    top: 50%;
    width: 1px;
    height: 1px;
    margin: 0;
    transform: translateY(-50%);
    opacity: 0;
    pointer-events: none;
}
.eventStatusSwitches { position: relative; min-height: 56px; contain: layout; }

/* Visor de fichas: la cabecera institucional permanece; esta barra solo aporta acciones. */
#contentOverlay { overflow-anchor: none; }
.contentViewerToolbar {
    position: sticky;
    top: 0;
    z-index: 34;
    border-bottom: 1px solid var(--line);
    background: rgba(2,12,24,.93);
    box-shadow: 0 10px 28px rgba(0,0,0,.2);
    backdrop-filter: blur(16px);
}
.contentViewerToolbarInner {
    min-height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.contentViewerUtilities { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.contentViewerToolbar .ghostButton { min-height: 42px; }
.contentViewerTitleVisuallyHidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}
.contentSheet { min-height: 0; }

/* Fichas ZIP: altura real, sin grandes espacios vacíos ni doble scroll. */
.packageFrameShell { overflow: hidden; }
.contentPackageFrame {
    height: 240px;
    min-height: 0;
    max-height: none;
    overflow: hidden;
    transition: height .18s ease;
}
.packageFrameShell.loading .contentPackageFrame { min-height: 240px; }

/* Logotipo de actividad puntuable contenido y más discreto. */
.scoringBadge {
    width: clamp(62px, 6vw, 82px);
    max-height: 112px;
    border-radius: 14px;
}
.scoringBadgeImage {
    width: 100%;
    height: 100%;
    max-height: 112px;
    object-fit: contain;
}
.activityBadgeStack { max-width: min(116px, 24%); }
.activityScoringBadge { margin-inline: auto; }
.entryScoringBadge { width: clamp(54px, 5.5vw, 76px); }
.detailScoringBadge { width: clamp(70px, 9vw, 92px); }
.tableScoringBadge { width: 42px; max-height: 52px; }

/* El evento del reel reutiliza el componente de Actividad destacada. */
.homeFeaturedEventSlide.activityPosterCard {
    min-height: 0;
    border-radius: 0;
    box-shadow: none;
}
.homeFeaturedEventSlide .activityPosterBackground > img {
    object-position: var(--desktop-object-position, center);
}
.homeFeaturedEventSlide .activityBadgeStack { top: clamp(14px, 4%, 30px); left: clamp(18px, 5%, 62px); }
.homeFeaturedEventSlide .activityInfoPanel {
    top: clamp(14px, 6%, 36px);
    right: clamp(18px, 5%, 58px);
    bottom: clamp(20px, 7%, 46px);
}
.homeFeaturedEventSlide .activitySummary { -webkit-line-clamp: 3; }

/* Texto responsive: ninguna tarjeta depende de una altura rígida incompatible. */
.gatewayGrid { min-height: var(--desktop-height, 300px); height: auto; align-items: stretch; }
.gatewayGrid > .gatewayCard { min-height: clamp(280px, var(--desktop-height, 300px), 520px); }
.gatewayContent { inset: auto clamp(20px, 4cqi, 34px) clamp(20px, 4cqi, 31px); max-width: calc(100% - clamp(40px, 8cqi, 68px)); }
.gatewayContent strong { font-size: clamp(30px, 7.2cqi, 58px); overflow-wrap: anywhere; }
.gatewayContent small {
    max-width: 100%;
    font-size: clamp(14px, 2.5cqi, 17px);
    line-height: 1.35;
    overflow-wrap: anywhere;
}
.gatewayAction { margin-top: clamp(10px, 2.6cqi, 20px); }
.managedContentInfo { min-width: 0; }
.managedContentInfo h3 { overflow-wrap: anywhere; hyphens: auto; }
.managedContentInfo p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}
.activityInfoPanel { min-width: 0; overflow: hidden; }
.activityTitle { display: block; overflow-wrap: anywhere; hyphens: auto; }
.activityMeta span { min-width: 0; }
.activityMeta b { overflow-wrap: anywhere; }

/* Categorías educativas: sin iconos, con fotografía y descripción protagonista. */
.categoryIcon { display: none !important; }
.categoryCard {
    isolation: isolate;
    min-height: 210px;
    padding: 0;
    overflow: hidden;
}
.categoryImage,
.categoryImage img,
.categoryImageShade { position: absolute; inset: 0; width: 100%; height: 100%; }
.categoryImage { z-index: -3; }
.categoryImage img { display: block; object-fit: cover; transform: scale(1.01); transition: transform .45s ease; }
.categoryImageShade {
    z-index: -2;
    background: linear-gradient(0deg, rgba(2,10,19,.96), rgba(2,10,19,.28) 76%), linear-gradient(90deg, rgba(2,10,19,.66), transparent 72%);
}
.categoryCard.hasImage:hover .categoryImage img { transform: scale(1.045); }
.categoryCopy {
    min-height: 100%;
    padding: clamp(20px, 2.6vw, 30px);
    justify-content: end;
    align-content: end;
}
.categoryName { font-size: clamp(29px, 2.35vw, 38px) !important; }
.categoryDynamicText { max-width: 48ch; font-size: clamp(15px, 1.2vw, 17px); line-height: 1.42; }
.categoryCard:not([data-auto-content="true"]) .categoryDynamicText { opacity: 1 !important; transform: none !important; }
.categoryGrid.hasSelection .categoryCard { padding: 0; }
.categoryGrid.hasSelection .categoryCopy { min-height: 100%; padding: 12px 14px; }
.categoryGrid.hasSelection .categoryDynamicText { margin-left: 0 !important; }

/* Editor de categorías educativas. */
.categoryDesignSection { display: grid; gap: 14px; margin-top: 24px; }
.categoryDesignEditor { display: grid; gap: 14px; }
.categoryDesignCard {
    display: grid;
    grid-template-columns: minmax(150px, .35fr) minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(4,20,38,.58);
}
.categoryDesignPreview {
    min-height: 130px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px dashed var(--line);
    border-radius: 13px;
    color: var(--muted);
    background: rgba(2,10,19,.5);
}
.categoryDesignPreview img { width: 100%; height: 130px; display: block; object-fit: cover; }
.categoryDesignFields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.categoryDescriptionField, .categoryAutomaticSwitch { grid-column: 1 / -1; }
.categoryDesignActions { align-self: end; }

/* Contenidos de una categoría: tamaño adaptativo según el número visible. */
.contentGrid.adaptiveContentGrid { align-items: stretch; grid-auto-flow: row; }
.contentGrid.adaptiveContentGrid .managedContentCard { height: auto; min-height: 0; }
@media (min-width: 1101px) {
    .contentGrid.adaptiveContentGrid.contentCount-1 { grid-template-columns: minmax(0, 1fr); }
    .contentGrid.adaptiveContentGrid.contentCount-1 .managedContentCard { min-height: 430px; }
    .contentGrid.adaptiveContentGrid.contentCount-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contentGrid.adaptiveContentGrid.contentCount-2 .managedContentCard { min-height: 390px; }
    .contentGrid.adaptiveContentGrid.contentCount-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .contentGrid.adaptiveContentGrid.contentCount-3 .managedContentCard { min-height: 335px; }
    .contentGrid.adaptiveContentGrid.contentCount-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .contentGrid.adaptiveContentGrid.contentCount-4 .managedContentCard { min-height: 300px; }
    .contentGrid.adaptiveContentGrid.contentCount-5,
    .contentGrid.adaptiveContentGrid.contentCount-6,
    .contentGrid.adaptiveContentGrid.contentCount-many { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .contentGrid.adaptiveContentGrid.contentCount-5 .managedContentCard,
    .contentGrid.adaptiveContentGrid.contentCount-6 .managedContentCard { min-height: 238px; }
    .contentGrid.adaptiveContentGrid.contentCount-5 .managedContentInfo,
    .contentGrid.adaptiveContentGrid.contentCount-6 .managedContentInfo { padding: 18px; }
    .contentGrid.adaptiveContentGrid.contentCount-5 .managedContentInfo h3,
    .contentGrid.adaptiveContentGrid.contentCount-6 .managedContentInfo h3 { font-size: clamp(21px, 2vw, 30px); }
    .contentGrid.adaptiveContentGrid.contentCount-5 .managedContentInfo p,
    .contentGrid.adaptiveContentGrid.contentCount-6 .managedContentInfo p { -webkit-line-clamp: 2; font-size: 14px; }
}

/* Importador de fichas: altura y mensajes estables durante el proceso. */
.contentSheetEditor { overflow-anchor: none; }
.contentSheetEditor.isProcessing { pointer-events: none; }
.contentSheetEditor.isProcessing::after {
    content: "Procesando ficha…";
    position: sticky;
    bottom: 14px;
    z-index: 15;
    width: fit-content;
    display: block;
    margin: 0 auto;
    padding: 10px 16px;
    border: 1px solid var(--line-gold);
    border-radius: 999px;
    color: var(--navy-950);
    background: var(--gold-300);
    box-shadow: 0 12px 32px rgba(0,0,0,.3);
    font-weight: 800;
}
#contentMessage { min-height: 26px; }
#contentPackageFields { overflow-anchor: none; }

@media (max-width: 1100px) {
    .categoryDesignCard { grid-template-columns: 150px minmax(0,1fr); }
    .categoryDesignActions { grid-column: 2; }
    .contentGrid.adaptiveContentGrid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .contentGrid.adaptiveContentGrid .managedContentCard { min-height: 300px; }
}

@media (max-width: 760px) {
    #contentOverlay { overflow-x: hidden; }
    .contentViewerToolbarInner { width: calc(100% - 20px); min-height: 58px; gap: 7px; }
    .contentViewerUtilities { gap: 5px; }
    .contentViewerToolbar .ghostButton { min-height: 40px; padding-inline: 10px; font-size: 11px; }
    #shareContentButton, #fullscreenContentButton { width: 40px; padding: 0; font-size: 0; }
    #shareContentButton::before { content: "↗"; font-size: 19px; }
    #fullscreenContentButton::before { content: "⛶"; font-size: 19px; }
    .contentPackageFrame { height: 190px; min-height: 0; }
    .packageFrameShell.loading .contentPackageFrame { min-height: 190px; }
    .homeFeaturedEventSlide .activityPosterBackground > img { object-position: var(--mobile-object-position, center); }
    .homeFeaturedEventSlide .activityBadgeStack { top: 12px; left: 12px; }
    .homeFeaturedEventSlide .activityInfoPanel { top: 12px; right: 12px; bottom: 12px; left: clamp(105px, 36%, 135px); }
    .homeFeaturedEventSlide .activitySummary, .homeFeaturedEventSlide .activityTags { display: none; }
    .gatewayGrid { height: auto; min-height: var(--mobile-height, 345px); }
    .gatewayGrid > .gatewayCard { min-height: 165px; }
    .categoryGrid:not(.hasSelection) { grid-template-columns: 1fr; }
    .categoryCard { min-height: 190px; }
    .categoryName { font-size: clamp(27px, 8vw, 34px) !important; }
    .categoryDynamicText { font-size: 15px; }
    .categoryDesignCard { grid-template-columns: 1fr; }
    .categoryDesignPreview, .categoryDesignPreview img { min-height: 170px; height: 170px; }
    .categoryDesignFields { grid-template-columns: 1fr; }
    .categoryDescriptionField, .categoryAutomaticSwitch, .categoryDesignActions { grid-column: 1; }
    .contentGrid.adaptiveContentGrid { grid-template-columns: 1fr; }
    .contentGrid.adaptiveContentGrid .managedContentCard { min-height: 270px; }
    .scoringBadge { width: clamp(54px, 18vw, 72px); max-height: 92px; }
    .activityBadgeStack { max-width: 88px; }
}

@media (prefers-reduced-motion: reduce) {
    .contentPackageFrame, .categoryImage img { transition: none; }
}

/* v5.13 RC1 · protección adicional contra desbordamiento en accesos de Inicio. */
.gatewayCard { container-type: size; }
.gatewayParticipa .gatewayContent,
.gatewayExplora .gatewayContent { overflow: hidden; }

@container (max-height: 340px) {
    .gatewayParticipa .gatewayContent {
        inset: 18px 22px;
        grid-template-rows: auto auto auto auto;
        align-content: end;
        gap: 5px;
    }
    .gatewayParticipa .gatewayProgramLogo { width: clamp(66px, 20cqi, 88px); }
    .gatewayParticipa .programIdentity { gap: 2px; }
    .gatewayParticipa .programIdentity > span { font-size: 9px; }
    .gatewayParticipa .programIdentity strong {
        font-size: clamp(26px, 8.2cqi, 38px);
        line-height: 1.02;
    }
    .gatewayParticipa .gatewayContent > small {
        display: -webkit-box;
        margin-top: 1px;
        overflow: hidden;
        font-size: clamp(12px, 3.5cqi, 15px);
        line-height: 1.28;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .gatewayParticipa .gatewayLiveData { display: none; }
    .gatewayParticipa .gatewayAction { margin-top: 4px; }
    .gatewayParticipa .gatewayAction b { width: 29px; height: 29px; }

    .gatewayExplora .gatewayContent { inset: auto 18px 16px; }
    .gatewayExplora .gatewayIcon { width: 44px; height: 44px; margin-bottom: 8px; font-size: 22px; }
    .gatewayExplora .gatewayContent strong { font-size: clamp(30px, 11cqi, 44px); }
    .gatewayExplora .gatewayContent small {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .gatewayExplora .gatewayAction { margin-top: 8px; }
}

@media (max-width: 760px) {
    .gatewayCard { container-type: size; }
}

/* El evento del carrusel mantiene la composición de Participa, adaptada a la altura disponible. */
.homeFeaturedEventSlide { container-type: size; }
.homeFeaturedEventSlide .activityTags,
.homeFeaturedEventSlide .activitySummary,
.homeFeaturedEventSlide .eventOrganizer { display: none; }
.homeFeaturedEventSlide .activityInfoPanel {
    justify-content: center;
    overflow: hidden;
}
.homeFeaturedEventSlide .activityTitle {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

@container (max-height: 340px) {
    .homeFeaturedEventSlide .activityBadgeStack { top: 14px; left: 48px; gap: 6px; }
    .homeFeaturedEventSlide .activityDateBadge { min-width: 72px; padding: 8px 10px; }
    .homeFeaturedEventSlide .activityDateBadge strong { font-size: 36px; }
    .homeFeaturedEventSlide .activityScoringBadge { width: 70px; max-height: 74px; }
    .homeFeaturedEventSlide .activityInfoPanel {
        inset: 14px 44px 14px auto;
        width: min(45%, 510px);
        min-height: 0;
        max-height: none;
        padding: 14px 18px;
        border-radius: 16px;
    }
    .homeFeaturedEventSlide .activityTitle {
        font-size: clamp(22px, 3.15cqi, 34px);
        line-height: 1.04;
        -webkit-line-clamp: 3;
    }
    .homeFeaturedEventSlide .activityMeta { margin-top: 8px; gap: 5px; font-size: 12px; }
    .homeFeaturedEventSlide .activityMeta span { gap: 7px; }
}


/* v5.14 RC1 · cabecera fija, identidad visual, mapas y exportación común */
:root { --topbar-height: 86px; }
html { scroll-padding-top: calc(var(--topbar-height) + 18px); }
body { padding-top: var(--topbar-height); }
.topbar {
    position: fixed !important;
    inset: 0 0 auto !important;
    z-index: 200 !important;
    width: 100%;
}
#contentOverlay {
    top: var(--topbar-height) !important;
    z-index: 190 !important;
}
#contentOverlay.isFullscreen { inset: 0 !important; z-index: 400 !important; }
body.contentFullscreen { padding-top: 0; }
body.contentFullscreen .topbar { visibility: hidden; pointer-events: none; }
body.contentFullscreen #contentOverlay { top: 0 !important; }
[id] { scroll-margin-top: calc(var(--topbar-height) + 76px); }

/* Máscara institucional: solo diapositivas fotográficas normales. */
.homePhotoSlide { overflow: hidden; background: var(--navy-950); }
.homePhotoSlide > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--desktop-object-position, center); }
.homeIdentityMask { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; padding: clamp(22px,6vw,82px); pointer-events: none; color: #fff; background: linear-gradient(90deg, rgba(1,13,26,var(--identity-mask-opacity,.55)) 0%, rgba(1,13,26,calc(var(--identity-mask-opacity,.55) * .74)) 38%, rgba(1,13,26,calc(var(--identity-mask-opacity,.55) * .18)) 72%, transparent 100%); }
.homeIdentityMask.position-center { justify-content: center; text-align: center; background: rgba(1,13,26,var(--identity-mask-opacity,.55)); }
.homeIdentityMask.position-right { justify-content: flex-end; text-align: right; background: linear-gradient(270deg, rgba(1,13,26,var(--identity-mask-opacity,.55)) 0%, rgba(1,13,26,calc(var(--identity-mask-opacity,.55) * .74)) 38%, rgba(1,13,26,calc(var(--identity-mask-opacity,.55) * .18)) 72%, transparent 100%); }
.homeIdentityCopy { width: min(620px,76%); opacity: var(--identity-text-opacity,.78); text-shadow: 0 4px 28px rgba(0,0,0,.42); }
.homeIdentityInitials { display: flex; align-items: baseline; width: fit-content; font: 900 clamp(52px,9.5vw,138px)/.82 var(--font-display); letter-spacing: -.085em; }
.position-center .homeIdentityInitials { margin-inline: auto; }
.position-right .homeIdentityInitials { margin-left: auto; }
.homeIdentityInitials b { color: rgba(255,255,255,.94); }
.homeIdentityInitials strong { color: var(--gold-300); }
.homeIdentityCopy small { display: block; width: min(460px,100%); margin-top: clamp(13px,2.2vw,24px); color: rgba(255,255,255,.92); font: 650 clamp(13px,1.65vw,22px)/1.25 var(--font-display); letter-spacing: .015em; }
.position-center .homeIdentityCopy small { margin-inline: auto; }
.position-right .homeIdentityCopy small { margin-left: auto; }
.identityOverlayEditor { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.identityOverlayEditor > div, .identityOverlayEditor > .switchLabel { grid-column: 1/-1; }
.identityOverlayEditor output { display: inline-block; min-width: 52px; margin-left: 8px; color: var(--gold-300); font-weight: 700; }

/* Ubicación discreta: el aspecto permanece como texto normal. */
.eventMapLocation { cursor: default; touch-action: manipulation; -webkit-user-select: none; user-select: none; text-decoration: none; }
.eventMapLocation:focus-visible { outline: 2px solid var(--gold-300); outline-offset: 3px; border-radius: 3px; }
.eventMapOtherFields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.eventMapOtherFields.hidden { display: none !important; }
.eventMapDialog { width: min(980px,calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 1px solid var(--line-gold); border-radius: 22px; color: var(--cream); background: var(--navy-950); box-shadow: 0 24px 80px rgba(0,0,0,.54); }
.eventMapDialog::backdrop { background: rgba(0,7,16,.78); backdrop-filter: blur(7px); }
.eventMapDialogShell { display: grid; gap: 14px; padding: 16px; }
.eventMapDialogHeader { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.eventMapDialogHeader h2 { margin: 2px 0 0; font: 800 clamp(22px,4vw,34px)/1.05 var(--font-display); }
.eventMapFrameWrap { min-height: min(62dvh,560px); overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: #e7edf2; }
.eventMapFrameWrap iframe { display: block; width: 100%; height: min(62dvh,560px); border: 0; }
.eventMapDirections { justify-self: end; text-decoration: none; }

/* Estado de exportación sin dobles pulsaciones ni saltos. */
.packageFrameShell.exporting::after { content: 'Preparando exportación…'; position: absolute; inset: 0; z-index: 24; display: grid; place-items: center; color: var(--cream); background: rgba(2,12,24,.84); backdrop-filter: blur(5px); font: 750 14px var(--font-display); }
body.sheetExportBusy button { cursor: wait; }

@media (max-width: 760px) {
    .homePhotoSlide > img { object-position: var(--mobile-object-position, center); }
    .homeIdentityMask { padding: 20px; background: linear-gradient(90deg,rgba(1,13,26,var(--identity-mask-opacity,.55)),rgba(1,13,26,calc(var(--identity-mask-opacity,.55) * .54)) 70%,transparent); }
    .homeIdentityCopy { width: min(88%,430px); }
    .homeIdentityInitials { font-size: clamp(48px,19vw,84px); }
    .homeIdentityCopy small { font-size: clamp(12px,4vw,16px); }
    .identityOverlayEditor, .eventMapOtherFields { grid-template-columns: 1fr; }
    .eventMapDialogShell { padding: 11px; }
    .eventMapFrameWrap, .eventMapFrameWrap iframe { min-height: 64dvh; height: 64dvh; }
    .eventMapDirections { width: 100%; justify-content: center; }
}

/* v5.15 RC1 · widgets educativos, visor limpio y agenda calendario */

/* Widgets integrados dentro de cada categoría educativa. */
.categoryWidgetsGrid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(18px, 2.6vw, 30px);
    margin: 0 0 clamp(24px, 4vw, 44px);
}
.categoryWidgetsGrid.hidden { display: none !important; }
.categoryWidgetCard {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--line-gold);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(11, 44, 77, .98), rgba(2, 18, 34, .98));
    box-shadow: var(--shadow);
}
.categoryWidgetHeader {
    min-height: 84px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px clamp(18px, 3vw, 30px);
    border-bottom: 1px solid var(--line);
}
.categoryWidgetHeader > div { min-width: 0; }
.categoryWidgetHeader h3 {
    margin: 3px 0 0;
    color: var(--cream);
    font: 800 clamp(25px, 3.2vw, 42px)/1.05 var(--font-display);
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
    -webkit-hyphens: none;
    text-wrap: balance;
}
.categoryWidgetHeader p {
    max-width: 780px;
    margin: 8px 0 0;
    color: var(--muted);
    line-height: 1.45;
}
.categoryWidgetHeader .textButton { flex: 0 0 auto; }
.categoryWidgetFrame {
    display: block;
    width: 100%;
    height: var(--widget-height, 430px);
    min-height: 220px;
    border: 0;
    background: var(--navy-950);
}
.categorySpotifyWidget .spotifyPanel {
    min-height: 0;
    padding: clamp(18px, 2.4vw, 28px);
    border: 0;
    border-radius: 0;
    background: transparent;
}
.categorySpotifyWidget .spotifyHead { display: none; }
.categorySpotifyWidget .spotifyEmbed {
    min-height: 352px;
    border-radius: 16px;
}

/* Las herramientas completas abren su propio documento, sin una segunda barra intermedia. */
.toolsGrid .toolCard { min-width: 0; }

/* Visor de Fichas Dinámicas: solo dos controles flotantes, como las herramientas. */
#contentOverlay {
    overflow-x: hidden;
    overscroll-behavior: contain;
}
.contentFloatingControls {
    position: fixed;
    inset: calc(var(--topbar-height) + 16px) 0 auto;
    z-index: 360;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-inline: clamp(12px, 2.2vw, 34px);
    pointer-events: none;
}
.contentFloatingButton {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 18px;
    border: 1px solid var(--line-gold);
    border-radius: 999px;
    color: var(--cream);
    background: rgba(3, 20, 38, .92);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .38);
    backdrop-filter: blur(14px);
    font: 750 13px/1 var(--font-display);
    cursor: pointer;
    pointer-events: auto;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.contentFloatingButton:hover { transform: translateY(-1px); border-color: var(--gold-300); background: rgba(9, 42, 72, .97); }
.contentFloatingButton:focus-visible { outline: 3px solid #2f8cff; outline-offset: 3px; }
.contentFloatingButton:disabled { opacity: .48; cursor: wait; }
.contentFloatingMaximize { margin-left: auto; }
body.contentFullscreen .contentFloatingControls { inset: 16px 0 auto; }
body.contentFullscreen .contentFloatingButton { background: rgba(3, 20, 38, .88); }
#contentArticle { position: relative; min-height: 0; }
#contentOverlay .contentViewerToolbar,
#contentOverlay .contentViewerHeader,
#contentOverlay .overlayHeader { display: none !important; }
#contentOverlay .contentBackToTop { display: none !important; }

/* Los títulos de actividades nunca se parten con guiones automáticos. */
.activityTitle,
.homeFeaturedEventSlide .activityTitle,
.agendaCompleteTitle,
.agendaEventDetail h3 {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
    text-wrap: balance;
}

/* Agenda completa: lista, calendario mensual y suscripción iCalendar. */
.modalDialog.agendaDialogMode {
    width: min(1240px, calc(100vw - 28px));
    max-height: calc(100dvh - 28px);
    padding: clamp(20px, 3vw, 34px);
}
.agendaDialogHeader {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
    margin: 0 0 24px;
    padding-right: 74px;
}
.agendaDialogHeader h2 {
    margin: 4px 0 0;
    color: var(--cream);
    font: 800 clamp(34px, 5vw, 58px)/1 var(--font-display);
    letter-spacing: -.035em;
}
.agendaDialogActions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.agendaViewTabs {
    display: inline-flex;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255,255,255,.035);
}
.agendaViewTabs button,
.agendaCalendarNav button {
    min-height: 42px;
    padding: 9px 16px;
    border: 0;
    border-radius: 999px;
    color: var(--muted);
    background: transparent;
    font: 750 13px var(--font-display);
    cursor: pointer;
}
.agendaViewTabs button.active { color: var(--navy-950); background: var(--gold-300); }
.agendaCompleteList {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
}
.agendaCompleteRow {
    width: 100%;
    min-height: 76px;
    display: grid;
    grid-template-columns: minmax(150px, .75fr) minmax(300px, 2fr) minmax(92px, .5fr) minmax(200px, 1fr);
    align-items: center;
    gap: 16px;
    padding: 15px 20px;
    border: 0;
    border-bottom: 1px solid var(--line);
    color: var(--cream);
    background: transparent;
    text-align: left;
    cursor: pointer;
}
.agendaCompleteRow:last-child { border-bottom: 0; }
.agendaCompleteRow:hover,
.agendaCompleteRow:focus-visible { background: rgba(239,189,85,.07); }
.agendaCompleteDate { font-weight: 720; }
.agendaCompleteTitle { min-width: 0; display: flex; align-items: center; gap: 10px; font: 740 clamp(15px, 1.5vw, 20px)/1.25 var(--font-display); }
.agendaCompleteTitle .tableScoringBadge { flex: 0 0 auto; }
.agendaCalendarNav {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 48px;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
}
.agendaCalendarNav h3 {
    margin: 0;
    color: var(--cream);
    font: 800 clamp(24px, 3.2vw, 36px)/1.05 var(--font-display);
    text-align: center;
}
.agendaCalendarNav button {
    width: 46px;
    min-height: 46px;
    padding: 0;
    border: 1px solid var(--line-gold);
    color: var(--cream);
    font-size: 30px;
    line-height: 1;
}
.agendaCalendarWeekdays,
.agendaCalendarGrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.agendaCalendarWeekdays {
    overflow: hidden;
    border: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 16px 16px 0 0;
    background: rgba(255,255,255,.035);
}
.agendaCalendarWeekdays span { padding: 10px 6px; color: var(--gold-300); font: 760 12px var(--font-display); text-align: center; text-transform: uppercase; letter-spacing: .05em; }
.agendaCalendarGrid {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 0 0 16px 16px;
    background: rgba(255,255,255,.018);
}
.agendaCalendarDay {
    position: relative;
    min-width: 0;
    min-height: 128px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 9px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: rgba(2, 18, 34, .32);
}
.agendaCalendarDay:nth-child(7n) { border-right: 0; }
.agendaCalendarDay:nth-last-child(-n+7) { border-bottom: 0; }
.agendaCalendarDay.outsideMonth { opacity: .42; }
.agendaCalendarDay.isToday .agendaDayNumber {
    color: var(--navy-950);
    background: var(--gold-300);
}
.agendaDayNumber {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    align-self: flex-end;
    border-radius: 50%;
    color: var(--cream);
    font: 750 13px var(--font-display);
}
.agendaCalendarEvent,
.agendaCalendarMore {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    gap: 5px;
    padding: 6px 7px;
    overflow: hidden;
    border: 1px solid rgba(239,189,85,.24);
    border-radius: 8px;
    color: var(--cream);
    background: rgba(11, 44, 77, .88);
    font-size: 10px;
    text-align: left;
    cursor: pointer;
}
.agendaCalendarEvent time { color: var(--gold-300); font-weight: 750; }
.agendaCalendarEvent span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agendaCalendarMore { grid-template-columns: 1fr; color: var(--gold-300); background: transparent; }
.agendaEventDetail { display: grid; gap: 16px; }
.agendaBackButton { justify-self: start; }
.agendaEventDetailCard {
    display: grid;
    grid-template-columns: minmax(260px, .9fr) minmax(0, 1.4fr);
    gap: clamp(22px, 4vw, 42px);
    align-items: start;
    padding: clamp(18px, 3vw, 32px);
    border: 1px solid var(--line-gold);
    border-radius: 20px;
    background: linear-gradient(145deg, rgba(11,44,77,.92), rgba(2,18,34,.95));
}
.agendaEventDetailImage { overflow: hidden; border-radius: 16px; }
.agendaEventDetailImage img { display: block; width: 100%; max-height: 520px; object-fit: cover; }
.agendaEventDetail h3 { margin: 7px 0 12px; color: var(--cream); font: 800 clamp(30px, 4vw, 52px)/1.04 var(--font-display); }
.agendaEventDetail p { color: var(--muted); line-height: 1.58; }
.agendaEventActions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }

/* Visor claro: los estados de exportación no pueden bloquear indefinidamente la página. */
.packageFrameShell.exporting { position: relative; }
.packageFrameShell.exporting::after { pointer-events: none; }

@media (max-width: 900px) {
    .agendaDialogHeader { flex-direction: column; padding-right: 58px; }
    .agendaDialogActions { width: 100%; justify-content: flex-start; }
    .agendaCompleteRow { grid-template-columns: minmax(120px, .7fr) minmax(0, 1.8fr) 78px; }
    .agendaCompleteRow > :last-child { grid-column: 2 / -1; color: var(--muted); }
    .agendaCalendarDay { min-height: 104px; padding: 6px; }
    .agendaCalendarEvent { grid-template-columns: 1fr; }
    .agendaCalendarEvent time { display: none; }
    .agendaEventDetailCard { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
    .categoryWidgetHeader { align-items: flex-start; flex-direction: column; }
    .categoryWidgetHeader .textButton { align-self: flex-start; }
    .categoryWidgetFrame { height: min(var(--widget-height, 430px), 72dvh); }
    .categorySpotifyWidget .spotifyEmbed { min-height: 420px; }

    .contentFloatingControls {
        inset: calc(var(--topbar-height) + 10px) 0 auto;
        padding-inline: 9px;
    }
    .contentFloatingButton {
        min-height: 42px;
        max-width: calc(50vw - 14px);
        padding: 9px 12px;
        font-size: 11px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    body.contentFullscreen .contentFloatingControls { inset: 10px 0 auto; }

    .modalDialog.agendaDialogMode { width: calc(100vw - 12px); max-height: calc(100dvh - 12px); padding: 16px 12px 22px; }
    .agendaDialogHeader { gap: 14px; margin-bottom: 17px; padding-right: 50px; }
    .agendaDialogActions { display: grid; grid-template-columns: 1fr; }
    .agendaViewTabs { width: 100%; }
    .agendaViewTabs button { flex: 1; }
    .agendaDialogActions .secondaryButton { width: 100%; }
    .agendaCompleteList { border-radius: 14px; }
    .agendaCompleteRow {
        min-height: 0;
        grid-template-columns: 1fr auto;
        gap: 7px 12px;
        padding: 14px;
    }
    .agendaCompleteDate { grid-column: 1; color: var(--gold-300); }
    .agendaCompleteTitle { grid-column: 1 / -1; grid-row: 2; }
    .agendaCompleteRow > :nth-child(3) { grid-column: 2; grid-row: 1; }
    .agendaCompleteRow > :last-child { grid-column: 1 / -1; grid-row: 3; }
    .agendaCalendarWeekdays span { padding: 8px 2px; font-size: 9px; }
    .agendaCalendarDay { min-height: 62px; padding: 4px; }
    .agendaDayNumber { width: 24px; height: 24px; font-size: 10px; }
    .agendaCalendarEvent { display: block; min-height: 8px; padding: 0; border: 0; border-radius: 999px; background: var(--gold-300); font-size: 0; }
    .agendaCalendarEvent span, .agendaCalendarEvent time { display: none; }
    .agendaCalendarMore { display: none; }
    .agendaEventDetailCard { padding: 15px; }
    .agendaEventActions > * { width: 100%; justify-content: center; }

    .homeFeaturedEventSlide .activityInfoPanel {
        left: clamp(112px, 34vw, 145px) !important;
        right: 10px !important;
        padding: 14px !important;
    }
    .homeFeaturedEventSlide .activityTitle {
        font-size: clamp(18px, 5.8vw, 27px) !important;
        line-height: 1.05 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .contentFloatingButton { transition: none; }
}

/* Los módulos abiertos desde una ficha usan también controles flotantes, sin una barra adicional. */
.viewerModuleReturnBar {
    top: calc(var(--topbar-height) + 16px) !important;
    left: 0 !important;
    width: 100% !important;
    min-height: 0 !important;
    justify-content: stretch !important;
    padding: 0 clamp(12px, 2.2vw, 34px) !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    transform: none !important;
    pointer-events: none;
}
.viewerModuleReturnBar > span { display: none !important; }
.viewerModuleReturnBar > div {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.viewerModuleReturnBar button {
    min-height: 48px;
    padding: 11px 18px;
    border: 1px solid var(--line-gold);
    border-radius: 999px;
    color: var(--cream);
    background: rgba(3,20,38,.92);
    box-shadow: 0 12px 32px rgba(0,0,0,.38);
    backdrop-filter: blur(14px);
    pointer-events: auto;
}

@media (max-width: 760px) {
    #contentOverlay #contentBackButton,
    #contentOverlay #fullscreenContentButton {
        width: auto !important;
        max-width: calc(50vw - 14px) !important;
        min-height: 42px !important;
        padding: 9px 12px !important;
        font-size: 11px !important;
    }
    #contentBackButton::before,
    #fullscreenContentButton::before { content: none !important; }
    .viewerModuleReturnBar {
        top: calc(var(--topbar-height) + 10px) !important;
        padding-inline: 9px !important;
    }
    .viewerModuleReturnBar > div { width: 100% !important; }
    .viewerModuleReturnBar button {
        flex: 0 1 auto !important;
        min-height: 42px;
        max-width: calc(50vw - 14px);
        padding: 9px 12px;
        overflow: hidden;
        font-size: 11px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* v5.16 RC1 · orden manual de Explora y cierre de Agenda */

/* Orden público mixto de fichas, herramientas y widgets. */
.exploreMixedGrid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.2vw, 28px);
    align-items: stretch;
    margin: 0 0 clamp(24px, 4vw, 44px);
}
.exploreMixedGrid.hidden { display: none !important; }
.exploreMixedGrid .exploreMixedItem { min-width: 0; }
.exploreMixedGrid .exploreMixedItem.isWide { grid-column: 1 / -1; }
.exploreMixedGrid .managedContentCard,
.exploreMixedGrid .toolCard { min-height: 280px; height: auto; }
.exploreMixedGrid[data-item-count="1"] .managedContentCard,
.exploreMixedGrid[data-item-count="1"] .toolCard { min-height: 430px; }
.exploreMixedGrid[data-item-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.exploreMixedGrid[data-item-count="2"] .managedContentCard,
.exploreMixedGrid[data-item-count="2"] .toolCard { min-height: 390px; }
.exploreMixedGrid[data-item-count="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.exploreMixedGrid[data-item-count="4"] .managedContentCard,
.exploreMixedGrid[data-item-count="4"] .toolCard { min-height: 300px; }
.exploreMixedGrid[data-item-count="5"] .managedContentCard,
.exploreMixedGrid[data-item-count="6"] .managedContentCard,
.exploreMixedGrid[data-item-count="5"] .toolCard,
.exploreMixedGrid[data-item-count="6"] .toolCard { min-height: 245px; }
.publicToolsSection.hiddenForCategoryOrder { display: none !important; }

/* Ordenación accesible desde Diseño visual. */
.sortableAdminCard,
.exploreOrderRow { transition: border-color .18s ease, background .18s ease, opacity .18s ease, transform .18s ease; }
.sortableAdminCard.isDragging,
.exploreOrderRow.isDragging { opacity: .42; transform: scale(.99); }
.sortableAdminCard.isDropTarget,
.exploreOrderRow.isDropTarget { border-color: var(--gold-300) !important; background: rgba(239,189,85,.10) !important; }
.categoryOrderHead {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.categoryOrderHead > div:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.categoryOrderHead strong { color: var(--cream); font: 760 17px/1.2 var(--font-display); }
.categoryOrderHead small { color: var(--muted); }
.categoryOrderHead .orderButtonGroup { margin-left: auto; }
.dragHandle {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 10px;
    color: var(--gold-300);
    background: rgba(255,255,255,.035);
    font: 900 17px/1 monospace;
    letter-spacing: -4px;
    cursor: grab;
    user-select: none;
}
.dragHandle:active { cursor: grabbing; }
.dragHandle:focus-visible { outline: 3px solid rgba(239,189,85,.42); outline-offset: 2px; }
.orderButtonGroup { display: inline-flex; gap: 6px; }
.iconOrderButton {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 10px;
    color: var(--cream);
    background: rgba(255,255,255,.035);
    font: 800 17px/1 var(--font-display);
    cursor: pointer;
}
.iconOrderButton:hover:not(:disabled),
.iconOrderButton:focus-visible { border-color: var(--line-gold); color: var(--gold-300); }
.iconOrderButton:disabled { opacity: .28; cursor: default; }
.categoryContentOrderEditor { display: grid; gap: 16px; margin-top: 18px; }
.exploreOrderCategory {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(4,20,38,.52);
}
.exploreOrderCategory > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 15px 17px;
    border-bottom: 1px solid var(--line);
    background: rgba(255,255,255,.025);
}
.exploreOrderCategory h5 { margin: 2px 0 0; color: var(--cream); font: 780 21px/1.1 var(--font-display); }
.exploreOrderCategory > header > small { color: var(--muted); }
.exploreOrderCategory ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.exploreOrderRow {
    min-width: 0;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    border-bottom: 1px solid var(--line);
}
.exploreOrderRow:last-child { border-bottom: 0; }
.exploreOrderMain { min-width: 0; display: grid; gap: 3px; }
.exploreOrderMain strong { overflow: hidden; color: var(--cream); font: 720 15px/1.25 var(--font-display); text-overflow: ellipsis; white-space: nowrap; }
.exploreOrderMain small { color: var(--muted); }
.compactEmpty { margin: 12px; }

.eventCancelledBadge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 5px 9px;
    border: 1px solid rgba(255,120,120,.48);
    border-radius: 999px;
    color: #ffd6d6;
    background: rgba(136,24,35,.46);
    font: 760 10px/1 var(--font-display);
    letter-spacing: .035em;
    text-transform: uppercase;
}

/* Estados de cancelación en agenda y carteles. */
.activityCancellationBadge { align-self: flex-start; margin-bottom: 2px; }
.detailCancellationBadge { margin: 0 0 8px; }
.tableCancellationBadge { margin-left: 8px; vertical-align: middle; }
.adminCancellationBadge { margin-left: 8px; }
.activityPosterCard:has(.activityCancellationBadge) .activityPosterBackground { filter: saturate(.55) brightness(.72); }

/* Agenda: tabla clásica en Lista y día completo pulsable en Calendario. */
.agendaCompleteTableWrap {
    width: 100%;
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(2,18,34,.34);
}
.agendaCompleteTable { width: 100%; border-collapse: collapse; min-width: 720px; }
.agendaCompleteTable th {
    padding: 13px 17px;
    border-bottom: 1px solid var(--line-gold);
    color: var(--gold-300);
    background: rgba(255,255,255,.035);
    font: 770 12px/1.2 var(--font-display);
    letter-spacing: .045em;
    text-align: left;
    text-transform: uppercase;
}
.agendaCompleteTable td { padding: 15px 17px; border-bottom: 1px solid var(--line); color: var(--muted); vertical-align: middle; }
.agendaCompleteTable tbody tr:last-child td { border-bottom: 0; }
.agendaCompleteTable tbody tr { cursor: pointer; transition: background .16s ease; }
.agendaCompleteTable tbody tr:hover,
.agendaCompleteTable tbody tr:focus-visible { outline: 0; background: rgba(239,189,85,.075); }
.agendaCompleteTable td:nth-child(1),
.agendaCompleteTable td:nth-child(3) { white-space: nowrap; }
.agendaCompleteTable td:nth-child(2) strong { color: var(--cream); font: 740 clamp(15px, 1.4vw, 19px)/1.25 var(--font-display); word-break: normal; overflow-wrap: normal; hyphens: none; }
.agendaCompleteTable tr.isCancelled td { opacity: .76; }
.agendaCompleteTable tr.isCancelled td:nth-child(2) strong { text-decoration: line-through; text-decoration-thickness: 1px; }
.compactAgendaTable { border-radius: 14px; }
.compactAgendaTable .agendaCompleteTable { min-width: 620px; }
.compactAgendaTable .agendaCompleteTable th,
.compactAgendaTable .agendaCompleteTable td { padding-block: 11px; }

button.agendaCalendarDay {
    width: 100%;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
button.agendaCalendarDay:hover,
button.agendaCalendarDay:focus-visible,
.agendaCalendarDay.isSelected {
    z-index: 1;
    outline: 0;
    background: rgba(239,189,85,.10);
    box-shadow: inset 0 0 0 2px rgba(239,189,85,.42);
}
.agendaDayEventSummary {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 5px;
    padding: 5px 6px;
    overflow: hidden;
    border: 1px solid rgba(239,189,85,.22);
    border-radius: 7px;
    color: var(--cream);
    background: rgba(11,44,77,.82);
    font-size: 10px;
}
.agendaDayEventSummary time { color: var(--gold-300); font-weight: 780; }
.agendaDayEventSummary > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agendaDayEventSummary.isCancelled { opacity: .6; text-decoration: line-through; }
.agendaDayCount { color: var(--gold-300); font: 750 10px/1.2 var(--font-display); }
.agendaDayMarkers { display: none; gap: 3px; align-items: center; }
.agendaDayMarkers i { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-300); }
.agendaSelectedDayPanel {
    display: grid;
    gap: 12px;
    margin-top: 18px;
    padding: clamp(14px, 2.5vw, 22px);
    border: 1px solid var(--line-gold);
    border-radius: 16px;
    background: rgba(11,44,77,.46);
}
.agendaSelectedDayPanel h4 { margin: 3px 0 0; color: var(--cream); font: 800 clamp(23px, 3vw, 34px)/1.05 var(--font-display); }

@media (max-width: 1100px) {
    .exploreMixedGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .exploreMixedGrid[data-item-count="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .exploreMixedGrid,
    .exploreMixedGrid[data-item-count="2"],
    .exploreMixedGrid[data-item-count="4"] { grid-template-columns: 1fr; }
    .exploreMixedGrid .managedContentCard,
    .exploreMixedGrid .toolCard,
    .exploreMixedGrid[data-item-count="1"] .managedContentCard,
    .exploreMixedGrid[data-item-count="1"] .toolCard,
    .exploreMixedGrid[data-item-count="2"] .managedContentCard,
    .exploreMixedGrid[data-item-count="2"] .toolCard { min-height: 275px; }
    .categoryOrderHead { align-items: flex-start; }
    .categoryOrderHead .orderButtonGroup { margin-left: 0; }
    .exploreOrderRow { grid-template-columns: 38px minmax(0, 1fr); }
    .exploreOrderRow .orderButtonGroup { grid-column: 2; justify-self: start; }

    .agendaCalendarDay { min-height: 62px; }
    .agendaDayEventSummary,
    .agendaDayCount { display: none; }
    .agendaDayMarkers { display: flex; flex-wrap: wrap; max-width: 26px; margin-top: auto; }
    .agendaCalendarDay.hasEvents .agendaDayNumber { color: var(--navy-950); background: var(--gold-300); }
    .agendaSelectedDayPanel { padding: 13px; }
    .agendaCompleteTableWrap { overflow: visible; border: 0; background: transparent; }
    .agendaCompleteTable,
    .agendaCompleteTable tbody,
    .agendaCompleteTable tr,
    .agendaCompleteTable td { display: block; width: 100%; min-width: 0; }
    .agendaCompleteTable thead { display: none; }
    .agendaCompleteTable tbody { display: grid; gap: 10px; }
    .agendaCompleteTable tr {
        padding: 13px 14px;
        border: 1px solid var(--line);
        border-radius: 14px;
        background: rgba(2,18,34,.44);
    }
    .agendaCompleteTable td {
        display: grid;
        grid-template-columns: minmax(72px, .38fr) minmax(0, 1fr);
        gap: 10px;
        padding: 5px 0;
        border: 0;
        white-space: normal !important;
    }
    .agendaCompleteTable td::before { content: attr(data-label); color: var(--gold-300); font: 740 10px/1.4 var(--font-display); letter-spacing: .04em; text-transform: uppercase; }
    .agendaCompleteTable td:nth-child(2) strong { font-size: 16px; }
}

/* v5.16 RC2 · acceso privado optimizado y eventos completamente interconectados. */

/* Los títulos públicos nunca parten palabras con guiones automáticos. */
.activityTitle,
.eventDetailCopy h2,
.agendaCompleteTable strong {
    -webkit-hyphens: none !important;
    hyphens: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    text-wrap: balance;
}

/* Metadatos canónicos: el mismo conjunto de datos se reutiliza en todas las tarjetas. */
.eventMetaList {
    min-width: 0;
    display: grid;
    gap: 7px;
}
.eventMetaList > span {
    min-width: 0;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 7px;
    align-items: start;
}
.eventMetaList i {
    color: var(--gold-300);
    font-style: normal;
    line-height: 1.25;
    text-align: center;
}
.eventMetaList b {
    min-width: 0;
    color: inherit;
    font-family: var(--font-body);
    font-weight: 520;
    overflow-wrap: anywhere;
}
.eventPeople {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 16px;
    margin-top: 12px;
}
.eventPeople .eventOrganizer,
.eventPeople .eventResponsible {
    min-width: 0;
    display: grid;
    gap: 2px;
    margin: 0;
    color: var(--muted);
}
.eventPeople em {
    color: #d8d8d8;
    font-style: italic;
    font-size: .82em;
}
.eventPeople > span > span {
    min-width: 0;
    color: var(--white);
    overflow-wrap: anywhere;
}
.activityInfoPanel .activityPeople { grid-template-columns: 1fr; }
.activityInfoPanel .eventResponsible {
    display: grid;
    gap: 2px;
    color: #fff;
    font-family: var(--font-body);
}
.activityInfoPanel .eventResponsible em { color: #d8d8d8; font-style: italic; }
.activityInfoPanel .eventResponsible > span { color: #fff; font-style: normal; }
.activityOpenHint {
    align-self: flex-start;
    margin-top: 13px;
    padding-top: 9px;
    border-top: 1px solid rgba(255,255,255,.16);
    color: var(--gold-300);
    font: 760 11px/1.2 var(--font-display);
    letter-spacing: .05em;
    text-transform: uppercase;
}

/* Detalle único para cualquier acceso: Inicio, Participa, Agenda o Calendario. */
.eventDetailUnified { display: grid; gap: 16px; }
.eventDetailBack { justify-self: start; }
.eventDetailMeta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 20px;
    margin: 14px 0 0;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255,255,255,.035);
}
.eventDetailPeople {
    margin: 12px 0 0;
    padding: 0 2px;
}
.eventDetailActions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}
.eventDetailPdf { min-height: 260px; }
.eventDetailCopy { min-width: 0; }
.eventDetailCopy h2 { color: var(--cream); font: 800 clamp(32px, 4vw, 56px)/1.02 var(--font-display); }

/* La tabla conserva su diseño, pero muestra el contexto disponible sin crear nuevas columnas. */
.agendaActivitySupplement {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}
.agendaTablePlace { font-weight: 500; }
.agendaCompleteTable tr[role="button"] { cursor: pointer; }
.agendaCompleteTable tr[role="button"]:hover td,
.agendaCompleteTable tr[role="button"]:focus-visible td { background: rgba(239,189,85,.055); }
.agendaCompleteTable tr[role="button"]:focus-visible { outline: 3px solid rgba(239,189,85,.46); outline-offset: -3px; }

@container (max-width: 480px) {
    .activitySummary { -webkit-line-clamp: 2; }
    .activityPeople { display: none; }
    .activityMetaDate { display: none !important; }
    .activityOpenHint { display: none; }
}

@media (max-width: 760px) {
    .eventDetailMeta { grid-template-columns: 1fr; }
    .eventPeople { grid-template-columns: 1fr; }
    .activityInfoPanel .eventPeople { margin-top: 8px; }
}

@media (max-width: 620px) {
    .loginPanel { width: min(100% - 24px, 620px); padding-block: 18px 26px; }
    .loginIntro { grid-template-columns: 1fr; text-align: center; justify-items: center; }
    .loginIntro p { max-width: 48ch; }
    .loginAccessCard { padding: 22px; border-radius: 18px; }
    .loginAccessHeading { grid-template-columns: 46px minmax(0,1fr); }
    .loginAccessNumber { width: 44px; height: 44px; border-radius: 12px; }
    .loginAccessHeading strong { font-size: 21px; }
    }

/* v5.16 RC3 · corrección visual del detalle común de actividades. */
.eventDetail {
    width: 100%;
    max-width: 1180px;
    grid-template-columns: minmax(260px, .82fr) minmax(0, 1.18fr);
    align-items: start;
}
.eventDetail.noPoster {
    max-width: 900px;
    grid-template-columns: minmax(0, 1fr);
}
.eventDetailPoster {
    align-self: start;
    max-height: none;
    overflow: hidden;
    border: 1px solid rgba(217,161,58,.22);
    background: rgba(2,10,19,.58);
}
.eventDetailPoster img {
    display: block;
    width: 100%;
    height: auto;
    max-height: min(62vh, 620px);
    object-fit: contain;
}
.eventDetailIdentity {
    min-height: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 14px;
}
.eventDetailIdentity .activityTags {
    align-self: center;
    margin: 0;
}
.eventDetailIdentity .detailScoringBadge,
.eventDetailIdentity .agendaDetailScoringBadge {
    display: block !important;
    flex: 0 0 auto;
    width: clamp(78px, 8vw, 108px);
    max-height: 132px;
    margin: 0;
}
.eventDetailIdentity .detailScoringBadge .scoringBadgeImage,
.eventDetailIdentity .agendaDetailScoringBadge .scoringBadgeImage {
    display: block !important;
    width: 100%;
    height: auto;
    max-height: 132px;
    object-fit: contain;
}
.eventDetailCopy h2 {
    margin-top: 0;
}
.eventDetailPeople {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
    gap: 10px;
    padding: 0;
}
.eventDetailPeople .eventOrganizer,
.eventDetailPeople .eventResponsible {
    display: grid;
    gap: 4px;
    padding: 11px 13px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
}
.eventDetailPeople em {
    display: block;
    color: var(--gold-300);
    font-style: normal;
    font-size: 11px;
    font-weight: 760;
    letter-spacing: .055em;
    text-transform: uppercase;
}
.eventDetailPeople > span > span {
    display: block;
    color: var(--cream);
    font-size: 15px;
    font-weight: 560;
    line-height: 1.35;
}
.eventDetailOrigin-agenda .agendaDetailScoringBadge {
    filter: drop-shadow(0 8px 20px rgba(0,0,0,.32)) drop-shadow(0 0 3px var(--scoring-color));
}

@media (max-width: 820px) {
    .eventDetail {
        grid-template-columns: 1fr;
        max-width: 760px;
    }
    .eventDetailPoster img {
        max-height: 52vh;
    }
}

@media (max-width: 620px) {
    .eventDetailIdentity .detailScoringBadge,
    .eventDetailIdentity .agendaDetailScoringBadge {
        width: clamp(72px, 24vw, 92px);
    }
    .eventDetailPeople {
        grid-template-columns: 1fr;
    }
    .eventDetailPoster img {
        max-height: 44vh;
    }
}


/* RESP-01 v3 · móvil S/M/L estable sobre v1.2.7.
   Conserva las mejoras validadas de v2: reel de Inicio, QR/fecha sin solape y Explora horizontal desde primera entrada.
   Corrige regresiones de v2: desplazamiento vertical y título visible de Actividad destacada. */
@media (max-width: 760px) {
    html { overflow-y: auto; }
    body:not(.dialogOpen) { overflow-y: visible; }
    main, .publicView.active { touch-action: pan-y pinch-zoom; }
    .responsiveLayout { min-width: 0; }
    .responsiveLayout > [data-layout-module] { min-width: 0; }

    /* Alturas automáticas: los módulos normales fluyen por contenido. Los componentes
       visuales sin altura intrínseca reciben una altura móvil explícita. */
    .responsiveLayout > [data-layout-module].layoutHeight-auto-mobile:not(.entryReel):not(.gatewayGrid) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
    .responsiveLayout > [data-layout-module].layoutHeight-fixed-mobile {
        height: var(--mobile-height, var(--mobile-height-base, auto)) !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    /* Inicio: el reel contiene hijos absolutamente posicionados, por lo que height:auto
       lo colapsaba a cero. Mantener siempre una caja real proporcional al móvil. */
    #entryReel.layoutHeight-auto-mobile,
    #entryReel {
        height: clamp(210px, 61vw, 270px) !important;
        min-height: 210px !important;
        max-height: 270px !important;
        overflow: hidden !important;
        aspect-ratio: auto !important;
    }
    #entryReel.layoutHeight-fixed-mobile {
        height: max(clamp(210px, 61vw, 270px), var(--mobile-height, 210px)) !important;
        max-height: none !important;
    }
    #entryReel .entryReelSlides,
    #entryReel .entryReelSlide,
    #entryReel .entryReelFallback { width: 100%; height: 100%; }

    /* Accesos de Inicio: en automático no heredan una altura rígida; cada tarjeta
       conserva una altura legible y la rejilla crece con ellas. */
    .gatewayGrid.layoutHeight-auto-mobile,
    body[data-template="panorama"] .gatewayGrid.layoutHeight-auto-mobile,
    body[data-template="editorial"] .gatewayGrid.layoutHeight-auto-mobile {
        height: auto !important;
        min-height: 0 !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: none !important;
        grid-auto-rows: minmax(165px, auto);
    }
    .gatewayGrid.layoutHeight-auto-mobile > .gatewayCard { min-height: clamp(165px, 48vw, 210px); }

    /* Participa · Actividad destacada: reserva una columna izquierda exclusiva
       para fecha/QR y otra para texto; nunca se superponen. */
    #featuredEvent .featuredActivityCard {
        min-height: clamp(400px, 112vw, 485px) !important;
        border-radius: 19px;
    }
    #featuredEvent .featuredActivityCard .activityBadgeStack {
        top: 14px !important;
        left: 14px !important;
        width: 78px;
        max-width: 78px !important;
        gap: 7px;
    }
    #featuredEvent .featuredActivityCard .activityDateBadge {
        min-width: 72px;
        width: 72px;
        padding: 10px 7px 9px;
    }
    #featuredEvent .featuredActivityCard .activityDateBadge strong { font-size: 35px; }
    #featuredEvent .featuredActivityCard .activityScoringBadge,
    #featuredEvent .featuredActivityCard .scoringBadge {
        width: 72px !important;
        max-width: 72px !important;
        max-height: 86px;
        margin: 0 !important;
    }
    #featuredEvent .featuredActivityCard .activityInfoPanel {
        inset: 14px 12px 14px 104px !important;
        width: auto !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-height: none !important;
        justify-content: flex-start !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-y;
        overscroll-behavior-y: contain;
        padding: 14px !important;
        border-radius: 15px;
        scrollbar-width: thin;
    }
    #featuredEvent .featuredActivityCard .activityTitle {
        display: block !important;
        flex: 0 0 auto;
        visibility: visible !important;
        opacity: 1 !important;
        margin: 2px 0 8px !important;
        color: #ffbd25 !important;
        font-size: clamp(17px, 5.5vw, 24px) !important;
        line-height: 1.06 !important;
        overflow: visible !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
    #featuredEvent .featuredActivityCard .activitySummary,
    #featuredEvent .featuredActivityCard .activityTags,
    #featuredEvent .featuredActivityCard .activityPeople { display: none !important; }
    #featuredEvent .featuredActivityCard .activityMeta {
        margin-top: 10px;
        gap: 6px;
        font-size: clamp(12px, 3.7vw, 14px);
    }
    #featuredEvent .featuredActivityCard .activityOpenHint { margin-top: 10px; font-size: 10px; }

    /* Explora: las categorías adoptan desde el PRIMER render el mismo carrusel
       horizontal que antes solo aparecía tras una segunda entrada. */
    #categoryGrid,
    #categoryGrid:not(.hasSelection),
    #categoryGrid.hasSelection {
        position: relative;
        top: auto;
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        display: grid !important;
        grid-template-columns: none !important;
        grid-auto-flow: column !important;
        grid-auto-columns: clamp(150px, 58vw, 220px) !important;
        align-items: stretch;
        gap: 10px;
        margin: 12px 0 26px;
        padding: 8px;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x proximity;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x pan-y pinch-zoom;
        border: 1px solid rgba(217,161,58,.28);
        border-radius: 16px;
        background: rgba(3,16,30,.6);
        box-shadow: none;
        backdrop-filter: none;
    }
    #categoryGrid .categoryCard,
    #categoryGrid.hasSelection .categoryCard {
        width: auto;
        height: 116px !important;
        min-height: 116px !important;
        padding: 0 !important;
        scroll-snap-align: start;
        border-radius: 14px;
    }
    #categoryGrid .categoryCopy,
    #categoryGrid.hasSelection .categoryCopy {
        min-height: 100% !important;
        display: grid;
        align-content: end;
        gap: 4px;
        padding: 12px 13px !important;
    }
    #categoryGrid .categoryName,
    #categoryGrid.hasSelection .categoryName,
    #categoryGrid .categoryCard.isContentTurn .categoryName,
    #categoryGrid.hasSelection .categoryCard.isContentTurn .categoryName {
        grid-row: auto;
        align-self: end;
        font-size: 18px !important;
        line-height: 1.05 !important;
        animation: none !important;
    }
    #categoryGrid .categoryDynamicText,
    #categoryGrid.hasSelection .categoryDynamicText,
    #categoryGrid .categoryCard.isContentTurn .categoryDynamicText,
    #categoryGrid.hasSelection .categoryCard.isContentTurn .categoryDynamicText {
        grid-row: auto;
        align-self: end;
        display: -webkit-box;
        margin: 0 !important;
        max-width: 100%;
        overflow: hidden;
        opacity: 1;
        color: rgba(255,255,255,.92);
        font: 600 11px/1.18 var(--font-body) !important;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        animation: none !important;
    }
    #categoryGrid .categoryShowAll,
    #categoryGrid.hasSelection .categoryShowAll {
        min-width: 92px;
        min-height: 116px;
        height: 116px;
        scroll-snap-align: start;
        border-radius: 14px;
    }

    /* Rejillas de contenidos y agenda: una columna real en móvil. */
    .eventGrid,
    .contentGrid,
    .contentGrid.adaptiveContentGrid,
    .toolsGrid,
    .exploreMixedGrid,
    .exploreMixedGrid[data-item-count="2"],
    .exploreMixedGrid[data-item-count="4"] {
        grid-template-columns: minmax(0, 1fr) !important;
        min-width: 0;
    }
}

@media (max-width: 375px) {
    html[data-mobile-size="s"] #entryReel { height: 220px !important; min-height: 220px !important; }
    html[data-mobile-size="s"] #featuredEvent .featuredActivityCard { min-height: 405px !important; }
    html[data-mobile-size="s"] #featuredEvent .featuredActivityCard .activityInfoPanel { left: 100px !important; padding: 12px !important; }
    html[data-mobile-size="s"] #categoryGrid,
    html[data-mobile-size="s"] #categoryGrid:not(.hasSelection),
    html[data-mobile-size="s"] #categoryGrid.hasSelection { grid-auto-columns: minmax(148px, 62vw) !important; }
}

@media (min-width: 376px) and (max-width: 410px) {
    html[data-mobile-size="m"] #entryReel { height: 235px !important; min-height: 235px !important; }
    html[data-mobile-size="m"] #featuredEvent .featuredActivityCard { min-height: 435px !important; }
}

@media (min-width: 411px) and (max-width: 760px) {
    html[data-mobile-size="l"] #entryReel { height: clamp(245px, 58vw, 285px) !important; min-height: 245px !important; max-height: 285px !important; }
    html[data-mobile-size="l"] #featuredEvent .featuredActivityCard { min-height: clamp(455px, 105vw, 520px) !important; }
    html[data-mobile-size="l"] #featuredEvent .featuredActivityCard .activityInfoPanel { left: 112px !important; }
    html[data-mobile-size="l"] #categoryGrid,
    html[data-mobile-size="l"] #categoryGrid:not(.hasSelection),
    html[data-mobile-size="l"] #categoryGrid.hasSelection { grid-auto-columns: minmax(170px, 52vw) !important; }
}


/* RESP-01 v4 + FIC-01 · pendientes validados en iPhone real.
   1) Evento del reel: versión móvil compacta con título prioritario y detalles desplegables.
   2) Identidad EMMDH del reel: una sola línea, menor y estable en S/M/L.
   3) Fichas dinámicas: fallback de maximización para Safari iOS. */
@media (max-width: 760px) {
    /* El título del evento es la pieza principal. Fecha/QR conservan su columna izquierda. */
    .homeFeaturedEventSlide .activityInfoPanel {
        inset: auto 12px 12px clamp(96px, 31%, 118px) !important;
        width: auto !important;
        min-height: 0 !important;
        max-height: calc(100% - 24px) !important;
        display: flex !important;
        justify-content: flex-start !important;
        gap: 0 !important;
        padding: 11px 12px !important;
        overflow: hidden !important;
        border-radius: 14px !important;
        background: rgba(5,9,15,.88) !important;
        -webkit-overflow-scrolling: touch;
    }
    .homeFeaturedEventSlide .activityTitle {
        order: -10;
        display: block !important;
        width: 100%;
        margin: 0 !important;
        padding: 2px 22px 2px 0;
        overflow: visible !important;
        color: var(--gold-300) !important;
        font-size: clamp(15px, 5.25vw, 20px) !important;
        line-height: 1.06 !important;
        letter-spacing: -.01em;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
        -webkit-hyphens: none !important;
        -webkit-line-clamp: unset !important;
        cursor: pointer;
        touch-action: manipulation;
        position: relative;
        z-index: 2;
    }
    .homeFeaturedEventSlide .activityTitle::after {
        content: "⌄";
        position: absolute;
        top: 0;
        right: 1px;
        color: var(--gold-300);
        font: 800 18px/1 var(--font-display);
        transition: transform .18s ease;
    }
    .homeFeaturedEventSlide.mobileDetailsOpen .activityTitle::after { transform: rotate(180deg); }

    /* Estado compacto: solo título; los datos secundarios aparecen al tocar el título. */
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .eventLifecycleBadge,
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .eventResultsBadge,
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityCancellationBadge,
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityTags,
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activitySummary,
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityMeta,
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityPeople,
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityOpenHint {
        display: none !important;
    }
    .homeFeaturedEventSlide.mobileDetailsOpen .activityInfoPanel {
        top: 12px !important;
        bottom: 12px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior-y: contain;
        touch-action: pan-y;
        gap: 6px !important;
    }
    .homeFeaturedEventSlide.mobileDetailsOpen .eventLifecycleBadge,
    .homeFeaturedEventSlide.mobileDetailsOpen .eventResultsBadge,
    .homeFeaturedEventSlide.mobileDetailsOpen .activityCancellationBadge {
        display: inline-flex !important;
        align-self: flex-start;
        order: -5;
    }
    .homeFeaturedEventSlide.mobileDetailsOpen .activityMeta {
        display: grid !important;
        margin-top: 6px !important;
        gap: 5px !important;
        font-size: clamp(10.5px, 3.25vw, 13px) !important;
    }
    .homeFeaturedEventSlide.mobileDetailsOpen .activityPeople {
        display: grid !important;
        margin-top: 7px !important;
        gap: 6px !important;
        font-size: clamp(10.5px, 3vw, 12.5px) !important;
    }
    .homeFeaturedEventSlide.mobileDetailsOpen .activityOpenHint {
        display: block !important;
        margin-top: 6px !important;
        padding-top: 6px !important;
        font-size: 9px !important;
    }
    .homeFeaturedEventSlide .activitySummary,
    .homeFeaturedEventSlide .activityTags { display: none !important; }

    /* Identidad sobre fotografías: nunca separar EMM / DH ni partir letras. */
    .homeIdentityMask {
        padding: clamp(12px, 4vw, 18px) !important;
    }
    .homeIdentityCopy {
        width: min(78%, 280px) !important;
        max-width: 280px;
    }
    .homeIdentityInitials,
    .homeIdentityInitials b,
    .homeIdentityInitials strong {
        white-space: nowrap !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
        -webkit-hyphens: none !important;
    }
    .homeIdentityInitials {
        flex-wrap: nowrap !important;
        font-size: clamp(34px, 13.5vw, 54px) !important;
        line-height: .88 !important;
        letter-spacing: -.06em !important;
    }
    .homeIdentityCopy small {
        width: min(210px, 100%) !important;
        margin-top: 8px !important;
        font-size: clamp(9px, 2.8vw, 12px) !important;
        line-height: 1.15 !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
}

@media (max-width: 375px) {
    html[data-mobile-size="s"] .homeFeaturedEventSlide .activityInfoPanel {
        left: 94px !important;
        right: 9px !important;
        bottom: 9px !important;
        padding: 9px 10px !important;
    }
    html[data-mobile-size="s"] .homeFeaturedEventSlide.mobileDetailsOpen .activityInfoPanel { top: 9px !important; }
    html[data-mobile-size="s"] .homeFeaturedEventSlide .activityTitle { font-size: clamp(14px, 4.9vw, 17px) !important; }
    html[data-mobile-size="s"] .homeIdentityInitials { font-size: clamp(32px, 12.5vw, 42px) !important; }
    html[data-mobile-size="s"] .homeIdentityCopy small { font-size: 9px !important; }
}

@media (min-width: 376px) and (max-width: 410px) {
    html[data-mobile-size="m"] .homeFeaturedEventSlide .activityTitle { font-size: clamp(16px, 4.8vw, 19px) !important; }
    html[data-mobile-size="m"] .homeIdentityInitials { font-size: clamp(38px, 12vw, 49px) !important; }
}

@media (min-width: 411px) and (max-width: 760px) {
    html[data-mobile-size="l"] .homeFeaturedEventSlide .activityInfoPanel { left: 112px !important; }
    html[data-mobile-size="l"] .homeFeaturedEventSlide .activityTitle { font-size: clamp(17px, 4.1vw, 21px) !important; }
    html[data-mobile-size="l"] .homeIdentityInitials { font-size: clamp(42px, 10.5vw, 58px) !important; }
}

/* FIC-01 · Safari iOS: maximización interna cuando Fullscreen API no está disponible. */
#contentOverlay.isPseudoFullscreen {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: var(--content-visual-height, 100dvh) !important;
    max-width: none !important;
    max-height: none !important;
    z-index: 400 !important;
    display: block !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}
body.contentPseudoFullscreen {
    overflow: hidden !important;
    padding-top: 0 !important;
}
body.contentPseudoFullscreen .topbar {
    visibility: hidden !important;
    pointer-events: none !important;
}
body.contentPseudoFullscreen .contentFloatingControls { inset: 10px 0 auto !important; }
body.contentPseudoFullscreen .contentFloatingButton { background: rgba(3,20,38,.92); }
#contentOverlay.isPseudoFullscreen #contentArticle { min-height: 100%; }


/* RESP-01 v5 + FIC-02 · ajuste fino validado sobre v4.
   - Evento destacado: título más centrado, a la derecha y elevado, también desplegado.
   - Fichas dinámicas en móvil: un único scroll táctil estable dentro del iframe. */
@media (max-width: 760px) {
    /* Estado compacto: desplazar el bloque a una zona central-derecha, sin tocar fecha/QR. */
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityInfoPanel {
        left: clamp(124px, 33.5vw, 136px) !important;
        right: 12px !important;
        top: 48% !important;
        bottom: auto !important;
        transform: translateY(-50%) !important;
        padding: 10px 12px !important;
    }
    .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityTitle {
        padding-left: 2px !important;
        text-align: left;
    }

    /* Estado abierto: misma referencia horizontal; lectura desde arriba y scroll propio si hace falta. */
    .homeFeaturedEventSlide.mobileDetailsOpen .activityInfoPanel {
        left: clamp(124px, 33.5vw, 136px) !important;
        right: 12px !important;
        top: 12px !important;
        bottom: 12px !important;
        transform: none !important;
    }

    /* FIC-02: Safari/iOS funciona mejor cuando el iframe es el único dueño del scroll de la ficha.
       Evita alternar entre el scroll del documento padre y el de la ficha embebida. */
    #contentOverlay {
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        touch-action: pan-y !important;
        overscroll-behavior-y: auto !important;
        scroll-behavior: auto !important;
    }
    .packageFrameShell.mobileScrollHost {
        height: var(--mobile-package-frame-height, 62dvh) !important;
        min-height: 320px !important;
        max-height: none !important;
        overflow: hidden !important;
        overscroll-behavior: none;
    }
    .packageFrameShell.mobileScrollHost .contentPackageFrame {
        display: block !important;
        width: 100% !important;
        height: var(--mobile-package-frame-height, 62dvh) !important;
        min-height: 320px !important;
        max-height: none !important;
        border: 0 !important;
        -webkit-overflow-scrolling: touch;
    }
    #contentOverlay.isPseudoFullscreen .packageFrameShell.mobileScrollHost {
        margin-top: 58px;
        height: var(--mobile-package-frame-height, calc(100dvh - 66px)) !important;
    }
    #contentOverlay.isPseudoFullscreen .packageFrameShell.mobileScrollHost .contentPackageFrame {
        height: var(--mobile-package-frame-height, calc(100dvh - 66px)) !important;
    }
}

@media (max-width: 375px) {
    html[data-mobile-size="s"] .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityInfoPanel,
    html[data-mobile-size="s"] .homeFeaturedEventSlide.mobileDetailsOpen .activityInfoPanel {
        left: 124px !important;
        right: 9px !important;
    }
    html[data-mobile-size="s"] .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityInfoPanel {
        top: 47% !important;
    }
}

@media (min-width: 376px) and (max-width: 410px) {
    html[data-mobile-size="m"] .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityInfoPanel,
    html[data-mobile-size="m"] .homeFeaturedEventSlide.mobileDetailsOpen .activityInfoPanel {
        left: 130px !important;
    }
}

@media (min-width: 411px) and (max-width: 760px) {
    html[data-mobile-size="l"] .homeFeaturedEventSlide:not(.mobileDetailsOpen) .activityInfoPanel,
    html[data-mobile-size="l"] .homeFeaturedEventSlide.mobileDetailsOpen .activityInfoPanel {
        left: 136px !important;
    }
}


/* FIC-03 · Proceso de admisión y matrícula.
   Al maximizar se comporta como «Prepara tu prueba de acceso»: la cabecera
   externa de la web queda fuera y permanece únicamente la ficha con los
   controles flotantes Restaurar / Volver a Inicio. */
#contentOverlay.contentAdmissionEnrollmentSheet.isFullscreen .sheetHero,
#contentOverlay.contentAdmissionEnrollmentSheet.isPseudoFullscreen .sheetHero,
#contentOverlay.contentAdmissionEnrollmentSheet.isFullscreen .packageSheetFooter,
#contentOverlay.contentAdmissionEnrollmentSheet.isPseudoFullscreen .packageSheetFooter,
#contentOverlay.contentAdmissionEnrollmentSheet.isFullscreen .sheetDestinations,
#contentOverlay.contentAdmissionEnrollmentSheet.isPseudoFullscreen .sheetDestinations,
#contentOverlay.contentAdmissionEnrollmentSheet.isFullscreen .sheetRelated,
#contentOverlay.contentAdmissionEnrollmentSheet.isPseudoFullscreen .sheetRelated {
    display: none !important;
}
#contentOverlay.contentAdmissionEnrollmentSheet.isFullscreen .contentSheet,
#contentOverlay.contentAdmissionEnrollmentSheet.isPseudoFullscreen .contentSheet {
    min-height: 100% !important;
}
#contentOverlay.contentAdmissionEnrollmentSheet.isFullscreen .packageSheetMain {
    min-height: 100% !important;
    padding-top: 78px !important;
}
#contentOverlay.contentAdmissionEnrollmentSheet.isPseudoFullscreen .packageSheetMain {
    min-height: 100% !important;
}


/* BASE-01 · Importador moderno de planificación de actividades (fusionado desde producción) */
.eventImportSummary { grid-template-columns: repeat(6,minmax(0,1fr)); }
.eventImportToolbar { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.eventImportToolbar .secondaryButton { min-height: 38px; padding: 8px 12px; font-size: 12px; }
.eventImportTableWrap { max-height: min(62vh,680px); overflow: auto; border: 1px solid var(--line); border-radius: 12px; background: rgba(2,13,25,.35); }
.eventImportTable { width: 100%; min-width: 980px; border-collapse: collapse; }
.eventImportTable th { position: sticky; top: 0; z-index: 1; padding: 11px 10px; color: var(--gold-300); background: #071c31; text-align: left; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.eventImportTable td { padding: 11px 10px; border-top: 1px solid var(--line); vertical-align: top; }
.eventImportTable tr.isExcluded { opacity: .48; }
.eventImportTable td strong, .eventImportTable td small { display: block; }
.eventImportTable td small { margin-top: 4px; color: var(--muted); line-height: 1.35; }
.eventImportTable .eventImportMissing { color: #ffd08a; }
.eventImportCheck { display: inline-flex; align-items: center; gap: 7px; min-height: 30px; font-size: 12px; font-weight: 700; }
.eventImportCheck input { width: 18px; height: 18px; accent-color: var(--gold-500); }
.eventImportOperation { display: inline-flex; padding: 5px 8px; border: 1px solid rgba(103,181,239,.42); border-radius: 999px; color: #a8d9ff; font-size: 10px; text-transform: uppercase; }
.eventImportOperation.update { border-color: rgba(239,189,85,.46); color: var(--gold-300); }
@media (max-width: 850px) {
  .eventImportSummary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .eventImportToolbar { display: grid; grid-template-columns: 1fr 1fr; }
  .eventImportToolbar .secondaryButton { width: 100%; }
}
.eventWorkflowStatus { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:center; margin-top:18px; padding:17px 19px; border:1px solid rgba(217,161,58,.42); border-radius:16px; background:linear-gradient(135deg,rgba(217,161,58,.10),rgba(255,255,255,.025)); }
.eventWorkflowStatus > div { display:grid; gap:5px; }
.eventWorkflowStatus span { color:var(--gold-300); font-size:11px; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }
.eventWorkflowStatus strong { color:var(--cream); font-size:clamp(17px,1.6vw,20px); line-height:1.25; }
.eventWorkflowStatus p { margin:0; color:var(--muted); line-height:1.5; }
.eventWorkflowStatus > b { padding:9px 12px; border:1px solid rgba(217,161,58,.5); border-radius:999px; color:var(--gold-200); background:rgba(4,20,38,.58); white-space:nowrap; }
.eventWorkflowStatus.isPublished { border-color:rgba(53,201,148,.48); background:linear-gradient(135deg,rgba(53,201,148,.12),rgba(255,255,255,.025)); }
.eventWorkflowStatus.isPublished > b { border-color:rgba(53,201,148,.52); color:#8ce8c5; }
.eventWorkflowStatus.hasPendingChanges { border-style:dashed; }
.eventEditorActions { align-items:center; }
#eventQrNextButton { margin-left:auto; }
@media (max-width:620px) { .eventWorkflowStatus { grid-template-columns:1fr; } .eventWorkflowStatus > b { justify-self:start; white-space:normal; } #eventQrNextButton { width:100%; margin-left:0; } }