/* Design 20: centered, responsive film with icon-only controls */
.skymt-youtube { width:100%; background:#fff; padding:clamp(48px,8vw,130px) clamp(18px,5vw,90px); box-sizing:border-box; }
.skymt-youtube__frame { position:relative; width:min(100%,1100px); margin:0 auto; aspect-ratio:16/9; background:#111; overflow:hidden; }
.skymt-youtube__poster,.skymt-youtube__embed,.skymt-youtube__embed iframe { position:absolute; inset:0; width:100%; height:100%; }
.skymt-youtube__poster { object-fit:cover; }
.skymt-youtube__embed iframe { border:0; }
.skymt-youtube__control { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:clamp(42px,5vw,70px); height:clamp(42px,5vw,70px); padding:0; border:0; border-radius:0; background:transparent; color:#fff; display:grid; place-items:center; cursor:pointer; z-index:3; filter:drop-shadow(0 2px 8px rgba(0,0,0,.55)); transition:opacity .2s; }
.skymt-youtube__control:hover { transform:translate(-50%,-50%); }
.skymt-youtube__control:focus-visible { outline:2px solid #fff; outline-offset:6px; }
.skymt-youtube__control svg { width:100%; height:100%; }
.skymt-youtube__pause { display:none; }
.skymt-youtube__frame.is-playing .skymt-youtube__play { display:none; }
.skymt-youtube__frame.is-playing .skymt-youtube__pause { display:block; }
.skymt-youtube__frame.is-playing .skymt-youtube__control { opacity:0; }
.skymt-youtube__frame.is-playing:hover .skymt-youtube__control,.skymt-youtube__frame.is-playing .skymt-youtube__control:focus-visible { opacity:1; }
.skymt-youtube__frame.is-loaded .skymt-youtube__poster { display:none; }
.skymt-youtube__notice { display:none; position:absolute; z-index:4; inset:auto 18px 18px; color:#fff; background:rgba(0,0,0,.85); padding:14px; font:14px/1.5 Arial,sans-serif; }
.skymt-youtube__notice.is-visible { display:block; }
.skymt-youtube__notice a { color:#fff; text-decoration:underline; }
@media(max-width:700px) { .skymt-youtube { padding:40px 16px; } }
@media(prefers-reduced-motion:reduce) { .skymt-youtube__control { transition:none; } }

/* Design 21: stable, icon-only play/pause; no circle or scale effects. */
.skymt-youtube__control,.skymt-youtube__control:hover,.skymt-youtube__control:active { background:transparent!important; border-radius:0!important; transform:translate(-50%,-50%)!important; box-shadow:none!important; }

/* Design 22: smaller desktop player; stable custom icons. */
@media (min-width: 701px) {
  .skymt-youtube__frame { max-width:935px; }
}
.skymt-youtube__control,
.skymt-youtube__control:hover,
.skymt-youtube__control:active,
.skymt-youtube__control:focus {
  appearance:none; -webkit-appearance:none;
  background:transparent!important; background-image:none!important;
  border:0!important; border-radius:0!important; box-shadow:none!important;
  transform:translate(-50%,-50%)!important; scale:1!important;
}
.skymt-youtube__control svg,
.skymt-youtube__control:hover svg { transform:none!important; scale:1!important; }

/* Design 23: Show SKYMT play button only before YouTube loads.
   After load, YouTube's own playback overlay is the sole control. */
.skymt-youtube__frame.is-loaded .skymt-youtube__control,
.skymt-youtube__frame.is-loaded:hover .skymt-youtube__control,
.skymt-youtube__frame.is-loaded .skymt-youtube__control:focus-visible {
  display:none!important;
}

/* Design 39: video slider */
.skymt-video-carousel__layout{display:grid;grid-template-columns:clamp(30px,5vw,65px) minmax(0,935px) clamp(30px,5vw,65px);justify-content:center;align-items:center;gap:clamp(8px,2vw,28px);max-width:1150px;margin:auto}
.skymt-video-carousel__viewport{min-width:0;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-x pan-y}
.skymt-video-carousel__viewport::-webkit-scrollbar{display:none}
.skymt-video-carousel__track{display:flex}
.skymt-video-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.skymt-video-slide .skymt-youtube__frame{width:100%;max-width:none}
.skymt-video-carousel__arrow{background:transparent;border:0;padding:0;cursor:pointer;width:100%;display:grid;place-items:center;color:#bcbcbc;transition:color .2s ease,opacity .2s ease}
.skymt-video-carousel__arrow svg{width:clamp(24px,3.5vw,48px);height:auto;display:block}
.skymt-video-carousel__arrow.is-next svg{transform:rotate(180deg)}
@media(hover:hover){.skymt-video-carousel__arrow:not(:disabled):hover{color:#000}}
.skymt-video-carousel__arrow:disabled{opacity:.4;cursor:default}
.skymt-video-carousel__arrow:focus-visible,.skymt-video-carousel__viewport:focus-visible{outline:2px solid #000;outline-offset:3px}
.skymt-video-carousel__count{text-align:center;margin:18px 0 0;font:12px/1.5 Arial,sans-serif;letter-spacing:.14em;color:#777}
@media(max-width:700px){.skymt-video-carousel{padding:45px 10px}.skymt-video-carousel__layout{grid-template-columns:26px minmax(0,1fr) 26px;gap:5px}.skymt-video-carousel__arrow svg{width:21px}}
@media(prefers-reduced-motion:reduce){.skymt-video-carousel__arrow{transition:none}}
