/* StreamNode public embed player: ArtPlayer UI (vendored) + StreamNode chrome. Standalone page (no admin.css);
   16:9, works down to 320px. Skin after the hindisub ArtPlayer skin: accent #23ade5, floating control pills, round
   play button. Deliberately light: no web fonts, no images, no backdrop-filter over the playing video. */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;height:100%;background:#000}
body.snp-page{display:flex;align-items:center;justify-content:center;overflow:hidden;color:#e8edf2;font:13px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
[hidden]{display:none !important}

.snp{position:relative;width:100%;max-width:calc(100vh * 16 / 9);aspect-ratio:16 / 9;max-height:100vh;background:#000;overflow:hidden;outline:none;-webkit-tap-highlight-color:transparent}
.snp-art{position:absolute;inset:0}
/* Poster = the 8:3 thumbnail collage (1920x720): letterboxed on black, never stretched or cropped (docs/MEDIA_PIPELINE.md 9.1). */
.snp-page .snp .art-video-player .art-poster{background-size:contain;background-color:#000}
.snp-page .snp .art-video-player{
  --art-theme:#23ade5;
  --art-font-color:#eef2f5;
  --art-background-color:#000;
  --art-border-radius:4px;
  --art-progress-height:5px;
  --art-progress-color:rgba(255,255,255,.25);
  --art-loaded-color:rgba(255,255,255,.25);
  --art-hover-color:rgba(255,255,255,.55);
  --art-control-height:34px;
  --art-control-icon-size:24px;
  --art-control-icon-scale:1;
  --art-control-opacity:1;
  --art-bottom-gap:9px;
  --art-bottom-height:125px;
  --art-padding:12px;
  --art-state-size:56px;
  --art-state-opacity:1;
  --art-settings-icon-size:22px;
  --art-settings-max-height:min(300px, calc(100vh - 70px));
  --art-selector-max-height:min(300px, calc(100vh - 70px));
  --art-widget-background:rgba(0,0,0,.85);
  --art-tip-background:rgba(0,0,0,.7);
  --art-highlight-width:4px;
  --art-highlight-color:#f4ff00;
  --art-subtitle-font-size:clamp(14px,3.4vw,26px);
  --art-subtitle-gap:4px;
  --art-subtitle-bottom:14px;
  --art-mini-progress-height:3px;
  font-family:inherit;
}
.snp-page .snp .art-video-player.art-mobile{--art-control-height:32px;--art-control-icon-size:22px;--art-state-size:50px;--art-settings-max-height:min(200px, calc(100vh - 56px));--art-selector-max-height:min(200px, calc(100vh - 56px));--art-padding:6px}
.snp .art-video-player:focus-visible,.snp .art-control:focus-visible,.snp .art-setting-item:focus-visible{outline:2px solid #6cc9ef;outline-offset:-2px;border-radius:3px}

/* Bottom bar: full-width timeline above two floating control pills (hindisub skin) */
.snp .art-bottom{background-image:linear-gradient(transparent,rgba(0,0,0,.12),rgba(0,0,0,.55)) !important;padding-bottom:10px;overflow:visible}
.snp .art-controls{height:var(--art-control-height);justify-content:space-between;gap:12px}
.snp .art-controls-left,.snp .art-controls-right{flex:0 0 auto;align-items:center;gap:0;padding:0 7px;border-radius:30px;background:rgba(15,15,15,.78)}
.snp .art-controls-center{display:none}
.snp .art-control{min-width:32px;padding:0 4px;border-radius:30px;color:#fff;font-weight:400}
.snp .art-control:hover{background:rgba(255,255,255,.1)}
.snp .art-control .art-icon{display:flex;align-items:center;justify-content:center}
.snp .art-control-time{font-size:12px;font-weight:500;padding:0 9px 0 5px;font-variant-numeric:tabular-nums;color:#fff}
.snp .art-progress-loaded,.snp .art-progress-played,.snp .art-progress .art-control-progress-inner{border-radius:8px}
.snp .art-progress-played{background:#23ade5}
/* Right pill order: -10 +10 +85 | audio language | CC | screenshot | settings | PiP | AirPlay | web full screen | full screen */
.snp .art-controls-right .art-control-snp-back10{order:0}.snp .art-controls-right .art-control-snp-fwd10{order:1}.snp .art-controls-right .art-control-snp-fwd85{order:2}
.snp .art-controls-right .art-control-snp-audio-lang{order:3}.snp .art-controls-right .art-control-snp-cc{order:4}.snp .art-controls-right .art-control-snp-screenshot{order:5}.snp .art-controls-right .art-control-setting{order:6}
.snp .art-controls-right .art-control-pip{order:7}.snp .art-controls-right .art-control-airplay{order:8}.snp .art-controls-right .art-control-fullscreenWeb{order:9}.snp .art-controls-right .art-control-fullscreen{order:10}
/* Outline icons: keep ArtPlayer's global svg fill rule from filling them */
.snp .art-control svg.snp-seek{width:24px;height:24px;fill:none !important;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.snp .art-control svg.snp-seek path{fill:none !important}
.snp .art-control svg.snp-seek text{fill:currentColor !important;stroke:none !important;font:600 8px Arial,sans-serif}
.snp .art-control-snp-screenshot svg,.snp .art-control-snp-screenshot svg path,.snp .art-control-snp-screenshot svg circle,.snp .art-setting-item-left-icon svg[fill="none"],.snp .art-setting-item-left-icon svg[fill="none"] *{fill:none !important}
.snp .art-control-snp-cc svg{width:22px;height:22px}
.snp .art-control-snp-cc.is-active{color:#6cc9ef}
.snp .art-control-snp-cc.is-active::after{content:"";position:absolute;left:25%;right:25%;bottom:5px;height:2px;border-radius:1px;background:#23ade5}
.snp .art-control-snp-cc{position:relative}

/* Audio-language picker (embed-player.js "audio-language picker"): globe + native language name, own dropdown */
.snp .art-control-snp-audio-lang{position:relative;padding:0}
.snp .art-control-snp-audio-lang:hover{background:none}
.snp .snp-alang-btn{display:flex;align-items:center;gap:5px;height:var(--art-control-height);margin:0;padding:0 9px 0 5px;border:0;border-radius:30px;background:none;color:inherit;font:inherit;font-size:12.5px;font-weight:500;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
.snp .snp-alang-btn:hover,.snp .art-control-snp-audio-lang.is-open .snp-alang-btn{background:rgba(255,255,255,.1)}
.snp .snp-alang-btn:focus-visible{outline:2px solid #6cc9ef;outline-offset:-2px}
.snp .art-control-snp-audio-lang svg,.snp .art-control-snp-audio-lang svg *{fill:none !important}
.snp .snp-alang-btn svg{flex:0 0 auto;width:22px;height:22px}
.snp .snp-alang-label{max-width:128px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.snp .snp-alang-label:empty{display:none}
.snp .snp-alang-menu{position:absolute;right:0;bottom:calc(100% + 8px);z-index:5;display:flex;flex-direction:column;min-width:156px;max-width:230px;max-height:300px;overflow-x:hidden;overflow-y:auto;padding:5px 0;border-radius:6px;background:rgba(0,0,0,.85);border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 24px rgba(0,0,0,.5);overscroll-behavior:contain}
.snp .snp-alang-item{display:flex;align-items:center;gap:8px;flex:0 0 auto;width:100%;margin:0;padding:8px 16px 8px 10px;border:0;background:none;color:#fff;font:inherit;font-size:13px;line-height:1.35;text-align:left;white-space:nowrap;cursor:pointer}
.snp .snp-alang-item:hover,.snp .snp-alang-item:focus-visible{background:rgba(255,255,255,.1);outline:none}
.snp .snp-alang-item.is-active{color:#6cc9ef;font-weight:600}
.snp .snp-alang-check{display:flex;align-items:center;justify-content:center;flex:0 0 16px;width:16px;height:16px}
.snp .snp-alang-check svg{width:16px;height:16px;max-width:16px;max-height:16px}
.snp .snp-alang-text{min-width:0;overflow:hidden;text-overflow:ellipsis}
@media (max-width:480px){
  /* Icon only; controls 28 px wide (ArtPlayer: min-width = control height, 32 px on phones) so the extra button fits at 360-390 px */
  .snp-page .snp .art-video-player .art-controls .art-control{min-width:28px}
  .snp .snp-alang-label{display:none}
  .snp .snp-alang-btn{padding:0 1px}
  .snp .snp-alang-btn svg{width:21px;height:21px}
  .snp .snp-alang-item{padding:9px 14px 9px 9px}
}

/* Big play: round, dark, hindisub triangle */
.snp-page .snp .art-video-player .art-mask .art-state{border-radius:50%;background:rgba(20,15,20,.62);box-shadow:0 3px 15px rgba(0,0,0,.2);display:flex;align-items:center;justify-content:center;transition:background .15s,opacity .2s,transform .2s}
.snp-page .snp .art-video-player .art-mask .art-state:hover{background:rgba(35,173,229,.9)}
.snp-page .snp .art-video-player .art-mask .art-state .art-icon{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.snp-page .snp .art-video-player .art-mask .art-state svg{width:46%;height:46%;margin-left:4%;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}

/* AniSkip: Skip Intro / Skip Outro button and progress-bar markers */
.snp .snp-skip{position:absolute;right:14px;bottom:78px;z-index:75;padding:9px 18px;background:rgba(0,0,0,.73);border:1px solid rgba(255,255,255,.8);border-radius:6px;color:#fff;font:500 14px/1.4 inherit;font-family:inherit;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.snp .snp-skip:hover{background:rgba(0,0,0,.87);border-color:#fff}
.snp .snp-skip:focus-visible{outline:2px solid #6cc9ef;outline-offset:2px}
.snp .art-progress-highlight .snp-skip-marker{background:#f4ff00;opacity:.85;border-radius:8px;pointer-events:none}

/* Auto-next countdown */
.snp .snp-next{position:absolute;right:14px;bottom:78px;z-index:85;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 14px;border-radius:6px;background:rgba(0,0,0,.82);border:1px solid rgba(255,255,255,.25);color:#fff;font-size:13px}
.snp .snp-next b{font-variant-numeric:tabular-nums}
.snp .snp-next button{padding:5px 12px;border-radius:4px;border:1px solid rgba(255,255,255,.35);background:none;color:inherit;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.snp .snp-next .snp-next-now{background:#23ade5;border-color:#23ade5;color:#04121a}
.snp .snp-next button:hover{filter:brightness(1.12)}
.snp .snp-next button:focus-visible{outline:2px solid #6cc9ef;outline-offset:1px}

/* Settings panel */
.snp .art-settings{color:#fff;border-radius:6px;border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 24px rgba(0,0,0,.5)}
.snp .art-setting-item{font-size:13px}
.snp .art-setting-item:hover{background:rgba(255,255,255,.08)}
.snp .art-setting-item-right-tooltip{color:#9fb0bf;font-size:12px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.snp .art-setting-item.art-current{color:#6cc9ef;font-weight:600}
.snp .art-setting-item-left-icon svg{width:20px;height:20px}
.snp .art-notice{padding:52px 10px 0;justify-content:center}
.snp .art-notice-inner{border-radius:4px;background:rgba(10,14,20,.82);font-size:12px;font-weight:600;padding:5px 10px}

/* Subtitles (drawn from hls.js cues into ArtPlayer's layer) */
.snp .art-subtitle-line{display:inline-block;margin:0 auto 2px;padding:1px 8px;border-radius:3px;background:rgba(0,0,0,.66);color:#fff;line-height:1.3;white-space:pre-line;text-shadow:none}
.snp .art-subtitle{flex-direction:column;align-items:center}

/* Title bar (ArtPlayer layer), visible with the controls */
.snp-top{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:8px;padding:10px 14px 22px;background:linear-gradient(rgba(0,0,0,.66),rgba(0,0,0,0));transition:opacity .25s;z-index:3;pointer-events:none}
.snp-page .snp .art-video-player .art-layers .art-layer-snp-title{position:absolute;inset:0 0 auto 0;height:auto;pointer-events:none}
.snp .art-video-player:not(.art-control-show) .snp-top{opacity:0}
.snp-title{min-width:0;flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;font-weight:600;letter-spacing:.01em;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.snp-subtitle{font-weight:400;color:#c6cfd8}
.snp-badge{flex:0 0 auto;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:2px 6px;border-radius:3px;background:#b8860b;color:#111}

/* Messages (unavailable / error) — also used by embed/not-found */
.snp-message,.snp-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:16px;text-align:center;background:rgba(5,8,12,.86);z-index:200}
.snp-overlay{display:none}.snp-overlay.is-visible{display:flex}
.snp-message strong,.snp-overlay strong{font-size:15px;font-weight:600}
.snp-message p,.snp-overlay p{margin:0;max-width:420px;color:#aab6c2;font-size:12.5px}
.snp-retry{margin-top:8px;padding:6px 14px;border:1px solid rgba(255,255,255,.3);border-radius:4px;background:none;color:inherit;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.snp-retry:hover{background:rgba(255,255,255,.1)}
.snp-retry:focus-visible{outline:2px solid #6cc9ef;outline-offset:1px}
.snp-static{display:block}
.snp[data-state="unavailable"] .art-bottom,.snp[data-state="error"] .art-bottom,.snp[data-state="unavailable"] .art-mask,.snp[data-state="error"] .art-mask{visibility:hidden}

@media (max-width:600px){
  .snp-page .snp .art-video-player{--art-control-height:30px;--art-control-icon-size:22px;--art-padding:7px;--art-state-size:46px}
  .snp .art-controls{gap:5px}
  .snp .art-controls-left,.snp .art-controls-right{padding:0 4px}
  .snp .art-control{min-width:27px;padding:0 2px}
  .snp .art-control svg{max-width:21px;max-height:21px}
  .snp .art-control-time{font-size:10px;padding:0 4px !important}
  .snp .art-controls-right .art-control-snp-screenshot,.snp .art-controls-right .art-control-fullscreenWeb{display:none !important}
  .snp .snp-skip{bottom:62px;right:8px;padding:6px 12px;font-size:12px}
  .snp .snp-next{bottom:62px;right:8px;gap:6px;padding:6px 8px 6px 10px;font-size:12px}
  .snp .snp-next button{padding:4px 8px}
}
@media (max-width:520px){
  .snp-top{padding:6px 10px 16px}
  .snp-title{font-size:12px}
  .snp-subtitle{display:none}
}
@media (max-width:360px){
  .snp .art-controls-right .art-control-pip{display:none !important}
}
@media (prefers-reduced-motion:reduce){.snp-top,.snp .art-state{transition:none}}
/* No title bar over the video: the title stays in the page title / aria-label (and screenshot names). Only the admin
   "Preview · Draft" badge is shown, without the dark gradient. */
.snp-top .snp-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.snp-top{background:none;justify-content:flex-end;padding:10px 14px}
/* "Report a problem" (built on first click; covers the player, stays inside it in full screen). */
.snp-report{position:absolute;inset:0;z-index:210;display:flex;align-items:center;justify-content:center;padding:10px;background:rgba(5,8,12,.72)}.snp-report[hidden]{display:none}
.snp-report-card{width:min(440px,100%);max-height:100%;overflow:auto;box-sizing:border-box;padding:14px 16px;border-radius:10px;background:#11161d;border:1px solid #243040;color:#e6edf3;font:13px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;box-shadow:0 12px 40px rgba(0,0,0,.5)}
.snp-report-card h2{margin:0 0 2px;font-size:15px;font-weight:600}.snp-report-lead{margin:0 0 10px;color:#9aa7b4;font-size:12px}
.snp-report-reasons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px;margin-bottom:8px}.snp-report-reasons label{display:flex;gap:6px;align-items:flex-start;padding:4px 2px;cursor:pointer;font-size:12.5px}.snp-report-reasons input{margin:2px 0 0;accent-color:#3aa0ff;flex:none}
.snp-report-card textarea{display:block;width:100%;box-sizing:border-box;resize:vertical;min-height:44px;padding:7px 9px;border-radius:7px;border:1px solid #2c3a4b;background:#0b1016;color:#e6edf3;font:inherit}.snp-report-card textarea:focus{outline:2px solid #3aa0ff;outline-offset:0;border-color:transparent}
.snp-report-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.snp-report-captcha:not(:empty){margin-top:8px;min-height:65px}.snp-report-status{min-height:17px;margin:6px 0 0;font-size:12px;color:#9aa7b4}.snp-report-status[data-kind=error]{color:#ff8a80}.snp-report-status[data-kind=ok]{color:#7ee2a8}
.snp-report-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.snp-report-actions button{min-height:32px;padding:0 14px;border-radius:7px;border:1px solid #2c3a4b;background:#18212b;color:#e6edf3;font:inherit;cursor:pointer}.snp-report-actions .snp-report-send{background:#2f81f7;border-color:#2f81f7;color:#fff;font-weight:600}.snp-report-actions button:disabled{opacity:.6;cursor:default}.snp-report-actions button:focus-visible{outline:2px solid #3aa0ff;outline-offset:2px}
.snp-report-done .snp-report-reasons,.snp-report-done textarea,.snp-report-done .snp-report-captcha,.snp-report-done [data-report-send]{display:none}
@media (max-width:420px){.snp-report-reasons{grid-template-columns:1fr}.snp-report-card{padding:10px 12px}.snp-report-lead{display:none}}
.snp-report-select{display:none;width:100%;box-sizing:border-box;min-height:32px;margin-bottom:8px;padding:5px 8px;border-radius:7px;border:1px solid #2c3a4b;background:#0b1016;color:#e6edf3;font:inherit}
.snp-report-compact{padding:6px}.snp-report-compact .snp-report-card{padding:8px 12px}.snp-report-compact .snp-report-card h2{font-size:13.5px;margin-bottom:6px}.snp-report-compact .snp-report-lead,.snp-report-compact .snp-report-reasons{display:none}.snp-report-compact .snp-report-select{display:block}.snp-report-compact .snp-report-card textarea{min-height:32px}.snp-report-compact .snp-report-status{min-height:0;margin-top:4px}.snp-report-compact .snp-report-actions{margin-top:6px}.snp-report-compact .snp-report-actions button{min-height:28px}
.snp-report-done .snp-report-select,.snp-report-compact.snp-report-done .snp-report-select{display:none}
.snp .art-controls-right .art-control-snp-report{order:5}
