/* v76: channel, subject animations and integrated workspace */
.whatsapp-button{background:#167b58!important;color:white!important;border:1px solid #167b58!important;gap:8px;font-size:13px;box-shadow:0 4px 14px #167b5818}
.whatsapp-button svg{width:21px;height:21px;flex:none}.whatsapp-button:hover{background:#116346!important;transform:translateY(-1px)}
.program-whatsapp{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:30px 0;padding:24px 28px;border:1px solid #c7ded1;background:#eef7f1;border-radius:18px}
.program-whatsapp h2{font-size:24px;line-height:1.35;margin:5px 0 6px}.program-whatsapp p{font-size:14px;margin:0;color:#51645a}.program-whatsapp .eyebrow{font-size:10px;letter-spacing:1.4px}.program-whatsapp .button{flex:none}
.roadmap-ready>.whatsapp-button{margin-top:16px}.written-jumps .button{padding:12px 16px;font-size:13px}
.subject-art{color:var(--subject-accent);width:min(100%,340px);margin:auto;pointer-events:none}.subject-art svg{width:100%;display:block;overflow:visible}
.subject-float{animation:subject-float 6s ease-in-out infinite;transform-origin:180px 150px}.subject-turn{animation:subject-turn 24s linear infinite;transform-origin:180px 169px}.subject-orbit{animation:subject-turn 18s linear infinite;transform-origin:180px 150px}.subject-sway{animation:subject-sway 5s ease-in-out infinite;transform-origin:180px 100px}
.art-thin{stroke-width:1.5;opacity:.45}.art-fill{fill:currentColor;stroke:#fff;stroke-width:2}.art-wash{fill:currentColor;fill-opacity:.16}.art-ink,.art-rung{animation:subject-ink 4s ease-in-out infinite;animation-delay:var(--delay,0s)}.art-bubble{animation:subject-bubble 3s ease-in infinite;animation-delay:var(--delay,0s)}
@keyframes subject-float{50%{transform:translateY(-9px) rotate(2deg)}}@keyframes subject-turn{to{transform:rotate(360deg)}}@keyframes subject-sway{50%{transform:rotate(5deg)}}@keyframes subject-ink{50%{opacity:.35}}@keyframes subject-bubble{0%{transform:translateY(0);opacity:.9}100%{transform:translateY(-45px);opacity:0}}
.program-split-link{display:inline-flex;padding:0;border:0;background:none;color:#98501f;font-size:12px;font-weight:650;gap:7px;margin-top:12px;text-decoration:underline;text-underline-offset:4px}
.study-workspace{width:min(1440px,96vw);max-width:none;max-height:94dvh;height:90dvh;padding:0;border:1px solid #dedfd7;border-radius:20px;background:#faf9f5;color:#24352c;overflow:hidden}
.study-workspace[open]{display:flex;flex-direction:column}.study-workspace::backdrop{background:#102b36aa;backdrop-filter:blur(5px)}
.workspace-header{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;gap:15px;background:white;border-bottom:1px solid #e4e5dd;flex:none}.workspace-header small{font-size:10px;color:#9b633b;letter-spacing:1.2px}.workspace-header h2{font-size:20px;margin:4px 0;line-height:1.3}.workspace-close{border:1px solid #ddd;background:white;border-radius:50%;width:38px;height:38px;flex:none;font-size:26px}
.workspace-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 22px;background:#f1f2ec;flex:none}.workspace-toolbar button{border:1px solid #d5d8cb;border-radius:8px;background:white;padding:8px 12px;font-size:12px}.workspace-toolbar button[aria-pressed="true"]{background:#ee6c29;border-color:#ee6c29;color:white}.workspace-toolbar a{font-size:11px;margin-left:auto;color:#6d705f;text-decoration:underline}
.workspace-content{display:grid;grid-template-columns:1fr;flex:1;min-height:0;overflow:auto;gap:18px;padding:18px}.study-workspace[data-mode="split"] .workspace-content{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.workspace-pdf{position:relative;min-height:420px;background:#e6e8e2;border:1px solid #dfe1d7;border-radius:12px;overflow:hidden}.workspace-pdf iframe{border:0;width:100%;height:100%;min-height:420px;background:#fff}.workspace-pdf[hidden],.workspace-video[hidden]{display:none}
.workspace-video{min-width:0;align-self:start}.workspace-player{width:100%;min-height:220px;aspect-ratio:16/9;background:#152331;border-radius:12px;overflow:hidden}.workspace-player iframe{border:0;width:100%;height:100%;min-height:220px;display:block}.study-workspace[data-mode="video"] .workspace-video{width:min(100%,1000px);margin:auto}
.workspace-player-note,.workspace-progress-note{font-size:12px;color:#737a70;line-height:1.6;margin:12px 0}.workspace-pdf-gate{position:absolute;inset:0;background:#f8faf5f0;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:24px;text-align:center}.workspace-pdf-gate[hidden]{display:none}.workspace-pdf-gate>span{font-size:36px;color:#ee6c29}.workspace-pdf-gate h3{font-size:21px;margin:12px 0}.workspace-pdf-gate p{font-size:13px}.workspace-pdf-gate button{font-size:13px}.workspace-pdf-empty{padding:60px 25px;text-align:center}.workspace-pdf-empty[hidden]{display:none}
@media(max-width:900px){.program-whatsapp{padding:20px;flex-wrap:wrap}.program-whatsapp h2{font-size:21px}.subject-art{width:260px}.workspace-header{padding:12px 16px}.workspace-header h2{font-size:17px}.workspace-content{gap:12px;padding:12px}.study-workspace[data-mode="split"] .workspace-content{grid-template-columns:1fr;overflow:auto}.study-workspace[data-mode="split"] .workspace-video{grid-row:1}.study-workspace[data-mode="split"] .workspace-pdf{min-height:550px}.workspace-toolbar{padding:10px 14px}}
@media(max-width:600px){.subject-art{width:190px;margin:12px auto 0}.written-lesson-hero.has-subject-art{display:block}.program-whatsapp{margin:22px 0;padding:18px;gap:14px}.program-whatsapp h2{font-size:20px}.program-whatsapp p{font-size:13px}.program-whatsapp .button{font-size:12px}.study-workspace{width:100vw;height:100dvh;max-height:100dvh;border-radius:0;border:0}.workspace-toolbar{gap:6px}.workspace-toolbar button{font-size:11px;padding:8px 10px}.workspace-toolbar a{font-size:10px}.workspace-header h2{font-size:15px}.workspace-header small{font-size:9px}.workspace-content{padding:10px}.workspace-pdf{min-height:480px}}
@media(prefers-reduced-motion:reduce){.subject-art *{animation:none!important}.whatsapp-button{transition:none!important}}

/* Channel invitation in the landing sidebar. */
.program-invitation.whatsapp-invitation{background:linear-gradient(145deg,#138756,#075e45);border-color:#ffffffb0;padding:24px 20px;gap:12px;box-shadow:inset 0 1px 0 #ffffff50,0 12px 28px #08734d22}
.whatsapp-invitation-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:#ffffff18;color:white}.whatsapp-invitation-icon svg{width:33px;height:33px}
.program-board .whatsapp-invitation h2{color:white;font-size:clamp(20px,1.75vw,25px);line-height:1.25;letter-spacing:-.4px;margin:0}
.whatsapp-invitation p{color:#e0f7eb;font-size:13px;line-height:1.5;margin:0;max-width:260px}
.whatsapp-invitation .whatsapp-button{background:white!important;color:#09633f!important;border-color:white!important;min-height:42px;padding:10px 24px;border-radius:12px;font-size:14px;box-shadow:0 5px 12px #003f2526}
.whatsapp-invitation .whatsapp-button:hover{background:#e5faec!important;transform:translateY(1px)}
/* v80: tactile channel button, matching the header press treatment. */
.whatsapp-invitation .whatsapp-button{transform:translateY(-1px);box-shadow:0 3px 0 #91b9a5,0 5px 10px #003f2533;animation:channel-button-press 3.8s ease-in-out infinite;transition:none}
.whatsapp-invitation .whatsapp-button:hover,.whatsapp-invitation .whatsapp-button:active{background:white!important;color:#09633f!important;animation:none;transform:translateY(2px);box-shadow:inset 0 2px 4px #125c3d45,0 1px 0 #91b9a5}
.whatsapp-invitation .whatsapp-button:focus-visible{outline:3px solid #baf8d2;outline-offset:6px}
@keyframes channel-button-press{0%,60%,85%,100%{transform:translateY(-1px);box-shadow:0 3px 0 #91b9a5,0 5px 10px #003f2533}68%,75%{transform:translateY(1px);box-shadow:0 1px 0 #91b9a5,0 3px 7px #003f2533}}
@media(prefers-reduced-motion:reduce){.whatsapp-invitation .whatsapp-button{animation:none}}
/* v81: shared title row aligns the channel card with the grade cards. */
.program-board>#program-entry-title{grid-column:1/-1;margin:0}
.whatsapp-invitation{isolation:isolate}
.whatsapp-invitation .whatsapp-invitation-icon{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%) rotate(-12deg);width:225px;height:225px;border-radius:0;background:none;opacity:.09;pointer-events:none;z-index:-1}
.whatsapp-invitation .whatsapp-invitation-icon svg{width:100%;height:100%}
/* v83: larger subject illustrations in the right-hand hero area. */
@media(min-width:1101px){
 .written-lesson-hero.has-subject-art:not(.has-atom){grid-template-columns:minmax(0,1fr) 300px;gap:28px;padding-top:32px}
 .written-lesson-hero.has-subject-art:not(.has-atom) .subject-art{width:300px;max-width:none;margin:0;align-self:center;justify-self:end;transform:translate(22px,-24px) scale(1.18)}
}
@media(min-width:701px) and (max-width:1100px){
 .written-lesson-hero.has-subject-art:not(.has-atom){grid-template-columns:minmax(0,1fr) 240px;gap:22px;padding-top:28px}
 .written-lesson-hero.has-subject-art:not(.has-atom) .subject-art{width:240px;max-width:none;margin:0;align-self:center;justify-self:end;transform:translate(0,-16px) scale(1.1)}
}
@media(max-width:700px){
 .written-lesson-hero.has-subject-art:not(.has-atom){display:block}
 .written-lesson-hero.has-subject-art:not(.has-atom) .subject-art{width:min(230px,85%);margin:18px auto 0;transform:none}
}
/* v84: all subjects use the approved Din Kulturu illustration frame. */
@media(min-width:1101px){
 .written-lesson-hero.has-subject-art{grid-template-columns:minmax(0,1fr) 300px;gap:28px;padding-top:32px}
 .written-lesson-hero.has-atom .lesson-atom{width:300px;max-width:none;margin:0;align-self:center;justify-self:end;transform:translate(22px,-24px) scale(1.18)}
}
@media(min-width:701px) and (max-width:1100px){
 .written-lesson-hero.has-subject-art{grid-template-columns:minmax(0,1fr) 240px;gap:22px;padding-top:28px}
 .written-lesson-hero.has-atom .lesson-atom{width:240px;max-width:none;margin:0;align-self:center;justify-self:end;transform:translate(0,-16px) scale(1.1)}
}
@media(max-width:700px){
 .written-lesson-hero.has-subject-art{display:block}
 .written-lesson-hero.has-atom .lesson-atom{width:min(230px,85%);max-width:none;margin:18px auto 0;transform:none}
}

/* Keep close icon geometrically centered regardless of global button padding. */
.workspace-close{display:grid;place-items:center;padding:0;line-height:1;box-sizing:border-box}.workspace-close svg{display:block;width:20px;height:20px}