:root{font-family:Tahoma,Arial,sans-serif;color:#f8fafc;background:#09182e;font-size:18px}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:flex;flex-direction:column}header{display:flex;justify-content:space-between;align-items:center;padding:1.3rem 3vw;border-bottom:1px solid #34445d;gap:2rem}header strong{font-size:clamp(1.4rem,2.6vw,3rem)}header p{margin:.5rem 0 0;color:#d4e3f8}time{white-space:pre-line;text-align:center;line-height:1.6}nav{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;padding:.7rem;background:#112440}button,select,nav a{font:inherit;border:1px solid #91a7c2;border-radius:6px;padding:.4rem .65rem;background:#193556;color:white;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #facc15}label{font-size:.9rem}main{flex:1;display:grid;align-items:center;padding:2vh 4vw}article{--accent:#5cddab;border-right:9px solid var(--accent);padding:2vh 3vw;background:#132c49;border-radius:12px}article[data-kind=upcoming]{--accent:#ffb75f}#status{color:var(--accent);font-size:clamp(1.2rem,2.3vw,2.6rem);font-weight:bold}h1{font-size:clamp(1.8rem,3.7vw,4.5rem);line-height:1.5;margin:1.2vh 0;overflow-wrap:anywhere}#details{font-size:clamp(1.1rem,2vw,2.3rem);line-height:1.6}#details p{margin:.5vh 0}article[data-kind=upcoming] #place,article[data-kind=upcoming] #dates{color:#ffb75f}footer{display:flex;justify-content:space-between;gap:1rem;color:#c4d3e5;font-size:.9rem;margin-top:2vh}.ticker{display:flex;overflow:hidden;background:#fff;color:#102542;align-items:center;min-height:4rem;font-size:clamp(1rem,1.6vw,1.8rem)}.ticker>b{padding:1rem;background:#2165ae;color:white;z-index:1;flex-shrink:0}.ticker-window{overflow:hidden;flex:1;direction:ltr}#ticker{display:inline-block;white-space:nowrap;direction:rtl;padding:1rem;animation:ticker var(--ticker-seconds,60s) linear infinite}@keyframes ticker{from{transform:translateX(-100%)}to{transform:translateX(100vw)}}body.paused #ticker{animation-play-state:paused}@media(prefers-reduced-motion:reduce){#ticker{animation:none;white-space:normal}}@media(max-width:700px){header{align-items:flex-start;gap:1rem}header p,time{font-size:.8rem}.ticker{display:block}.ticker>b{display:block;padding:.5rem}nav{font-size:.85rem}main{padding:1rem}footer{flex-direction:column}}@media(max-height:700px) and (min-width:900px){header{padding:.5rem 3vw}h1{font-size:2.3rem}#details{font-size:1.2rem}nav{padding:.3rem}}

/* Varied course entrances; course order and display durations stay unchanged. */
#slide[data-entrance]{animation-duration:1.1s;animation-timing-function:ease-out;animation-fill-mode:both}
#slide[data-entrance=fade]{animation-name:tv-fade}
#slide[data-entrance=right]{animation-name:tv-right}
#slide[data-entrance=left]{animation-name:tv-left}
#slide[data-entrance=bottom]{animation-name:tv-bottom}
@keyframes tv-fade{from{opacity:0}to{opacity:1}}
@keyframes tv-right{from{opacity:0;transform:translateX(110%)}to{opacity:1;transform:translateX(0)}}
@keyframes tv-left{from{opacity:0;transform:translateX(-110%)}to{opacity:1;transform:translateX(0)}}
@keyframes tv-bottom{from{opacity:0;transform:translateY(110%)}to{opacity:1;transform:translateY(0)}}
body.paused #slide{animation-play-state:paused}


main{overflow:hidden}
#slide[data-entrance=top]{animation-name:tv-top}
@keyframes tv-top{from{opacity:0;transform:translateY(-110%)}to{opacity:1;transform:translateY(0)}}

.bilingual-title{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);direction:rtl;margin:2vh 0;border:1px solid #647b96;border-radius:10px;background:#102541}
.bilingual-title[hidden]{display:none}
.bilingual-title section{min-width:0;padding:1.3rem}
.bilingual-title section[lang=en]{border-right:1px solid #647b96;text-align:left}
.bilingual-title section[lang=ar]{text-align:right}
.bilingual-title h2{font-size:clamp(1.4rem,2.6vw,3.1rem);line-height:1.5;margin:0 0 1rem;overflow-wrap:anywhere}
.bilingual-title.long-title h2{font-size:clamp(1.3rem,2.1vw,2.5rem)}
.course-dates{font-size:clamp(1rem,1.5vw,1.8rem);line-height:1.6;margin:0;color:#bfe5ff}
article[data-kind=upcoming] .course-dates{color:#ffb75f}
@media(max-width:600px){.bilingual-title{grid-template-columns:1fr}.bilingual-title section[lang=en]{border-right:0;border-top:1px solid #647b96}}
@media(max-height:750px) and (min-width:900px){.bilingual-title section{padding:.7rem}.bilingual-title h2{font-size:1.7rem;margin-bottom:.4rem}.bilingual-title.long-title h2{font-size:1.45rem}.course-dates{font-size:1rem}}
