/* Formação: identidade aprovada, isolada das telas de vídeo e demais módulos. */
#portal:has(.formation-lessons){background:radial-gradient(ellipse at 50% 90%,#ffe7a777,transparent 65%),#fff9e8}
#portal .portal-page:has(.formation-lessons){height:100dvh;min-height:0;max-width:1500px;width:100%;padding:12px 22px;display:flex;flex-direction:column;gap:7px;overflow:hidden}
#portal .portal-page:has(.formation-lessons) .portal-header{height:72px;min-height:72px;margin:0;flex:0 0 72px}
#portal .portal-page:has(.formation-lessons) .content-logo{height:72px;width:auto;max-height:72px}
#portal .portal-page:has(.formation-lessons) .page-heading{font-size:clamp(24px,3vw,42px);line-height:1.12;margin:0;text-align:center}
#portal .portal-page:has(.formation-lessons) .grade-caption{font-size:clamp(14px,1.5vw,20px);margin:0}
#portal .portal-page:has(.formation-lessons) .lesson-prompt{font-size:clamp(15px,1.5vw,20px);margin:0 0 4px}
#portal .formation-lessons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));grid-auto-rows:auto;gap:22px;flex:1;min-height:0;width:100%;padding:8px}
#portal .formation-lessons .lesson-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0;min-width:0;padding:6px 12px 10px;gap:0;border:2px solid #ffffffaa;border-radius:38% 32% 28% 33% / 27% 35% 26% 32%;box-shadow:0 6px 0 #bca97533,0 10px 16px #9d793212;overflow:hidden;transition:transform .18s,box-shadow .18s}
#portal .formation-lessons .lesson-card:nth-child(2n){border-radius:28% 38% 32% 25% / 36% 26% 34% 24%}
#portal .formation-lessons .lesson-card:nth-child(3n){border-radius:34% 26% 36% 28% / 25% 34% 26% 38%}
#portal .formation-lessons .color-0{background:linear-gradient(145deg,#ffe0d8,#ffc7bf)}
#portal .formation-lessons .color-1{background:linear-gradient(145deg,#e0f4e6,#bfe8d6)}
#portal .formation-lessons .color-2{background:linear-gradient(145deg,#ddf4fc,#bce6f4)}
#portal .formation-lessons .color-3{background:linear-gradient(145deg,#fff0bf,#ffe294)}
#portal .formation-lessons .iris-lesson-pose{display:block;flex:1;min-height:0;width:100%;max-width:270px;background-image:url('assets/personagens/iris-poses-v1.png');background-repeat:no-repeat;background-size:400% 200%;background-position:var(--pose-x) var(--pose-y);aspect-ratio:1;flex:none;height:auto;width:min(100%,calc((100dvh - 300px)/2));filter:drop-shadow(0 3px 2px #684a3220)}
#portal .formation-lessons .lesson-title{display:block;position:relative;flex:none;margin:-8px 0 0;padding:6px 22px;border-radius:50px;background:#fffdf3;color:#13516a;font-size:clamp(20px,2vw,30px);line-height:1.1;font-weight:700;box-shadow:0 3px 0 #806b3020;white-space:nowrap}
#portal .formation-lessons .lesson-card:focus-visible{outline:3px solid #087d96;outline-offset:3px}
@media(hover:hover){#portal .formation-lessons .lesson-card:hover{transform:translateY(-3px);box-shadow:0 8px 0 #bca97533,0 13px 20px #9d793222}}
#portal .portal-page:has(.formation-lessons) .portal-footer{margin:0;flex:0 0 40px;height:40px;padding:2px}
#portal .portal-page:has(.formation-lessons) .portal-footer img{height:36px;width:auto;max-height:36px}
@media(max-width:1023px){
 #portal .portal-page:has(.formation-lessons){padding:10px 14px;gap:5px}
 #portal .portal-page:has(.formation-lessons) .portal-header{height:66px;min-height:66px;flex-basis:66px}
 #portal .portal-page:has(.formation-lessons) .content-logo{height:66px;max-height:66px}
 #portal .portal-page:has(.formation-lessons) .page-heading{font-size:24px}
 #portal .formation-lessons{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:10px 14px;padding:4px}
 #portal .formation-lessons .lesson-card{padding:2px 7px 5px}
 #portal .formation-lessons .iris-lesson-pose{width:min(100%,calc((100dvh - 376px)/4))}
 #portal .formation-lessons .lesson-title{font-size:18px;padding:4px 15px;margin-top:-7px}
}
@media(max-width:1023px) and (max-height:670px){
 #portal .portal-page:has(.formation-lessons){gap:3px;padding:7px 12px}
 #portal .portal-page:has(.formation-lessons) .portal-header{height:48px;min-height:48px;flex-basis:48px}
 #portal .portal-page:has(.formation-lessons) .content-logo{height:48px;max-height:48px}
 #portal .portal-page:has(.formation-lessons) .page-heading{font-size:20px}
 #portal .formation-lessons{gap:7px 12px}
 #portal .formation-lessons .iris-lesson-pose{width:min(100%,calc((100dvh - 330px)/4))}
 #portal .formation-lessons .lesson-title{font-size:16px;padding:3px 12px}
}
@media(prefers-reduced-motion:reduce){#portal .formation-lessons .lesson-card{transition:none}}

#portal .formation-lessons .lesson-card{container-type:size}
#portal .formation-lessons .iris-lesson-pose{width:min(90cqw,calc(100cqh - 48px));max-width:300px}
#portal .formation-lessons .lesson-title{width:auto;height:auto;min-width:0;min-height:0;max-width:none;aspect-ratio:auto;transform:none}
@media(max-width:1023px){#portal .formation-lessons .iris-lesson-pose{width:min(90cqw,calc(100cqh - 30px))}}

#portal .formation-lessons{max-height:none;align-content:stretch;margin:0}
#portal .formation-lessons .lesson-card{max-height:none;height:auto}

/* Proporções do desenho aprovado: retratos grandes e cartões quase quadrados. */
#portal:has(.formation-lessons){position:relative;background:radial-gradient(ellipse at 50% 35%,#fffdf4 0,#fff8df 85%)}
#portal:has(.formation-lessons)::before{content:"";position:fixed;bottom:-32px;left:-5%;width:110%;height:65px;background:#e1ecc5;border-radius:48% 58% 0 0/45% 60% 0 0;pointer-events:none}
#portal .portal-page:has(.formation-lessons){position:relative;max-width:1500px;gap:3px;padding-top:8px;padding-bottom:8px}
#portal .portal-page:has(.formation-lessons) .page-heading{font-size:clamp(24px,2.3vw,36px);font-weight:800;color:#07547a}
#portal .portal-page:has(.formation-lessons) .grade-caption{font-size:clamp(14px,1.2vw,18px)}
#portal .portal-page:has(.formation-lessons) .lesson-prompt{font-size:clamp(14px,1.1vw,17px);color:#07547a}
#portal .formation-lessons{width:min(100%,calc((100dvh - 208px)*2.3));align-self:center;gap:18px;padding:10px 10px 8px}
#portal .formation-lessons .lesson-card{border:0;overflow:visible;border-radius:30% 24% 22% 20%/25% 24% 18% 22%;box-shadow:0 5px 2px #b6a47825,0 8px 12px #907f3420}
#portal .formation-lessons .lesson-card:nth-child(2n){border-radius:25% 30% 20% 25%/24% 30% 21% 18%;transform:rotate(1deg)}
#portal .formation-lessons .lesson-card:nth-child(3n){border-radius:30% 22% 25% 20%/22% 28% 20% 26%;transform:rotate(-1deg)}
#portal .formation-lessons .lesson-card:nth-child(5){background:linear-gradient(145deg,#d0f2dc,#a8e0c7)}
#portal .formation-lessons .lesson-card:nth-child(6){background:linear-gradient(145deg,#ffd4c8,#ffbcae)}
#portal .formation-lessons .lesson-card:nth-child(7){background:linear-gradient(145deg,#e6e1ff,#c6c1f2)}
#portal .formation-lessons .lesson-card:nth-child(8){background:linear-gradient(145deg,#c7f2f5,#94dce8)}
#portal .formation-lessons .iris-lesson-pose{position:absolute;bottom:12%;left:50%;transform:translateX(-50%);width:min(98cqw,96cqh);max-width:none;z-index:1}
#portal .formation-lessons .lesson-title{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);z-index:3;margin:0;width:74%;padding:5px 4px;font-size:clamp(18px,1.6vw,27px);box-shadow:0 3px 3px #84743b18}
#portal .formation-lessons .lesson-spark{position:absolute;right:10%;top:16%;font-size:clamp(24px,3vw,45px);line-height:1;color:#fffdf1;text-shadow:0 2px 0 #e9b64755;z-index:2;transform:rotate(10deg)}
#portal .formation-lessons .lesson-spark-0{left:9%;right:auto;top:33%;color:#f6c344;transform:rotate(-15deg)}
#portal .formation-lessons .lesson-spark-2,#portal .formation-lessons .lesson-spark-6{color:#ffdf70}
#portal .formation-lessons .lesson-spark-4{left:10%;right:auto;top:45%}
#portal .formation-lessons .lesson-spark-7{font-size:0;width:30px;height:25px;border:2px solid #fff;border-radius:3px;transform:rotate(8deg);background:linear-gradient(90deg,transparent 46%,white 47%,white 52%,transparent 53%)}
@media(max-width:1023px){
 #portal .formation-lessons{width:min(100%,calc((100dvh - 190px)*.65));gap:12px 16px;padding:8px 5px}
 #portal .formation-lessons .iris-lesson-pose{width:min(98cqw,99cqh);bottom:10%}
 #portal .formation-lessons .lesson-title{font-size:18px;padding:3px 4px;bottom:3%}
 #portal .formation-lessons .lesson-spark{font-size:25px;right:8%}
}
@media(max-width:1023px) and (max-height:670px){#portal .formation-lessons{width:100%;gap:9px 15px}#portal .formation-lessons .lesson-title{font-size:15px}#portal .formation-lessons .lesson-spark{font-size:19px}}

/* Mesma composição nas trilhas e músicas, com o elenco original. */
#portal .formation-lessons .lesson-character{position:absolute;inset:0 8% 14%;display:flex;align-items:center;justify-content:center;pointer-events:none}
#portal .formation-lessons .lesson-character .character-art{position:static;display:block;width:100%;height:100%;max-width:100%;max-height:100%;min-width:0;min-height:0;object-fit:contain;transform:none;margin:0;filter:drop-shadow(0 3px 2px #684a3220)}
#portal .music-lessons{grid-template-rows:52px repeat(2,minmax(0,1fr));width:min(100%,calc((100dvh - 270px)*2.3))}
#portal .music-lessons .lesson-card[data-lesson="combinados"]{grid-column:1/-1;justify-self:center;width:250px;border-radius:28px;background:#fff0b9;transform:none;display:flex;flex-direction:row;gap:12px;padding:4px 16px;container-type:normal}
#portal .music-lessons .lesson-card[data-lesson="combinados"] .lesson-character{display:none}
#portal .music-lessons .lesson-card[data-lesson="combinados"] .lesson-title{position:static;transform:none;width:auto;height:auto;font-size:20px;background:none;box-shadow:none;padding:0;display:flex;align-items:center;gap:10px}
#portal .music-lessons .combinados-symbol{font-size:26px}
@media(max-width:1023px){#portal .music-lessons{grid-template-rows:42px repeat(4,minmax(0,1fr));width:min(100%,calc((100dvh - 215px)*.68))}#portal .music-lessons .lesson-card[data-lesson="combinados"]{width:210px}#portal .music-lessons .lesson-card[data-lesson="combinados"] .lesson-title{font-size:18px}}
@media(max-width:1023px) and (max-height:670px){#portal .music-lessons{width:100%;grid-template-rows:36px repeat(4,minmax(0,1fr));gap:7px 15px}}

/* Retratos do elenco: recorte visual preserva os arquivos originais. */
#portal .formation-lessons .lesson-character{inset:1% 4% 14%;overflow:hidden;align-items:flex-start;container-type:size}
#portal .formation-lessons .lesson-character .character-art{position:absolute;top:0;left:50%;transform:translateX(-50%);height:180%;width:auto;max-width:none;max-height:none;object-fit:contain;object-position:top}
#portal .formation-lessons .portrait-curio .character-art{height:115%}
#portal .formation-lessons .portrait-zeca .character-art{height:190%}
#portal .formation-lessons .portrait-ravi .character-art{height:185%}

/* Capas de todos os módulos: título e ação dimensionados pelo player. */
#portal .tablet-screen{container-type:inline-size}
#portal .video-page .video-poster{box-sizing:border-box;padding:3cqw;grid-template-columns:28% minmax(0,1fr);gap:2cqw;min-height:0}
#portal .video-page .video-poster-copy{height:100%;min-height:0;display:flex;justify-content:center;gap:2cqw;padding-bottom:1cqw;box-sizing:border-box}
#portal .video-page .video-poster h2{font-size:clamp(12px,4.3cqw,30px);line-height:1.15;flex:0 1 auto;min-height:0;margin:0;word-break:normal;overflow-wrap:normal}
#portal .video-page .poster-play{flex:0 0 auto;font-size:clamp(13px,3.7cqw,24px);line-height:1.2;padding:1.6cqw 3.5cqw;min-height:0;gap:1.5cqw;box-shadow:0 3px 0 #056b7c}
#portal .video-page .poster-play>span{font-size:inherit}
#portal .video-page .video-poster-art .character-art{height:90%;max-height:none;object-fit:contain}

#portal .view-mailbox{justify-content:center;min-height:100dvh;background:#fff9e8}
#portal .view-mailbox .portal-header{display:none}
.mailbox-card{width:min(100%,660px);margin:auto;text-align:center;padding:20px;border-radius:35px;background:#fffdf5;box-shadow:0 8px 25px #17465615}
.mailbox-card>img{height:clamp(80px,17dvh,160px);max-width:100%;object-fit:contain}
.mailbox-card h1{font-size:clamp(22px,3vw,34px);margin:10px 0;color:#075275}
.mailbox-message{font-size:clamp(15px,2vw,20px);line-height:1.45}
.mailbox-quota{background:#fff0bf;border-radius:20px;padding:14px;margin:16px 0;font-size:16px}
.mailbox-quota p{margin:8px 0 0}
#mailbox-home{display:flex;align-items:center;justify-content:center;gap:10px;margin:auto}
@media(max-height:650px){.mailbox-card{padding:10px}.mailbox-card>img{height:60px}.mailbox-message{font-size:14px}.mailbox-quota{font-size:14px;margin:8px 0;padding:8px}}