body.intro-playing{overflow:hidden}
#school-intro{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#050807;color:#fff;overflow:hidden;box-shadow:none}
#school-intro::backdrop{background:#050807}
#intro-stage{position:relative;width:100%;height:100%;background:#050807}
#intro-stage:fullscreen{width:100vw;height:100dvh}
#intro-frame{position:absolute;inset:0;width:100%;height:100%}
#school-intro video{display:block;width:100%;height:100%;object-fit:contain;background:#050807}
.intro-actions{position:absolute;top:max(20px,env(safe-area-inset-top));right:max(20px,env(safe-area-inset-right));left:max(20px,env(safe-area-inset-left));z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px}
.intro-actions button{min-height:44px;padding:12px 20px;border:1px solid #e6cc9770;border-radius:5px;background:#101819d9;color:#f5e7cc;font-size:13px;backdrop-filter:blur(8px)}
.intro-actions button:focus-visible{outline:3px solid #f5db98;outline-offset:4px}
/* Rotate the complete player, including its controls, when a phone stays portrait.
   Once the device rotates (or Android accepts the orientation lock), use its natural landscape viewport. */
@media (max-width:900px) and (orientation:portrait){
  #intro-frame{inset:auto;top:50%;left:50%;width:100vh;width:100dvh;height:100vw;height:100dvw;transform:translate(-50%,-50%) rotate(90deg)}
  .intro-actions{top:12px;left:max(16px,env(safe-area-inset-top),env(safe-area-inset-left));right:max(16px,env(safe-area-inset-bottom),env(safe-area-inset-right))}
}
@media (max-height:600px) and (orientation:landscape){
  .intro-actions{top:max(12px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right))}
}