:root{--gold:#D4AF37;--gold2:#F1D27A;--text:#F3EEE2;--muted:#B5AE9F}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#000;color:var(--text);font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;overflow:hidden}
[hidden]{display:none!important}
.player{position:fixed;inset:0;background:#000;-webkit-user-select:none;user-select:none}
.player video{position:absolute;inset:0;width:100%;height:100%;background:#000}
.pl-top{position:absolute;top:0;left:0;right:0;z-index:4;display:flex;align-items:center;gap:16px;padding:18px 24px;background:linear-gradient(180deg,rgba(0,0,0,.78),rgba(0,0,0,0));transition:opacity .3s}
.pl-back{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.1);color:var(--text);font-size:22px;text-decoration:none}
.pl-back:hover{background:rgba(212,175,55,.3)}
.pl-title strong{display:block;font-family:"Playfair Display",Georgia,serif;font-size:20px;line-height:1.2}
.pl-title span{font-size:13px;color:var(--muted)}
.pl-controls{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:34px 24px max(16px,env(safe-area-inset-bottom));background:linear-gradient(0deg,rgba(0,0,0,.88),rgba(0,0,0,0));transition:opacity .3s}
.player.idle{cursor:none}
.player.idle .pl-controls,.player.idle .pl-top{opacity:0;pointer-events:none}
.pl-progress{position:relative;height:18px;display:flex;align-items:center}
.pl-track,.pl-buf,.pl-fill{position:absolute;left:0;height:4px;border-radius:2px;pointer-events:none}
.pl-track{right:0;background:rgba(255,255,255,.16)}
.pl-buf{width:0;background:rgba(255,255,255,.38)}
.pl-fill{width:0;background:var(--gold)}
.pl-progress:hover .pl-track,.pl-progress:hover .pl-buf,.pl-progress:hover .pl-fill{height:6px}
.pl-progress input[type=range]{position:relative;z-index:1;width:100%;height:18px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
.pl-progress input[type=range]::-webkit-slider-runnable-track{height:18px;background:transparent}
.pl-progress input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;margin-top:1.5px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.25)}
.pl-progress input[type=range]::-moz-range-track{height:18px;background:transparent}
.pl-progress input[type=range]::-moz-range-thumb{width:15px;height:15px;border:0;border-radius:50%;background:var(--gold)}
.pl-row{display:flex;align-items:center;gap:4px;margin-top:6px}
.pl-row button{min-width:42px;padding:8px 10px;border:0;border-radius:8px;background:none;color:var(--text);font:600 15px "Inter",sans-serif;cursor:pointer}
.pl-row button:hover{background:rgba(255,255,255,.1);color:var(--gold2)}
.pl-vol{width:92px;accent-color:var(--gold)}
.pl-time{margin-left:8px;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.pl-spacer{flex:1}
.pl-menu-wrap{position:relative}
.pl-menu{position:absolute;right:0;bottom:48px;min-width:132px;display:grid;gap:2px;padding:6px;background:rgba(18,18,18,.97);border:1px solid #333;border-radius:10px;box-shadow:0 16px 40px rgba(0,0,0,.7)}
.pl-menu button{width:100%;text-align:left;font-weight:500}
.pl-menu button.on{color:var(--gold);background:rgba(212,175,55,.12)}
.pl-big{position:absolute;left:50%;top:50%;z-index:3;width:86px;height:86px;transform:translate(-50%,-50%);padding-left:6px;border:2px solid var(--gold);border-radius:50%;background:rgba(0,0,0,.55);color:var(--gold);font-size:32px;cursor:pointer}
.pl-big:hover{background:rgba(212,175,55,.22)}
.pl-spinner{position:absolute;left:50%;top:50%;z-index:3;width:56px;height:56px;margin:-28px 0 0 -28px;border:3px solid rgba(212,175,55,.22);border-top-color:var(--gold);border-radius:50%;animation:pl-spin .9s linear infinite;pointer-events:none}
@keyframes pl-spin{to{transform:rotate(360deg)}}
.pl-dialog{position:absolute;left:50%;top:50%;z-index:6;width:calc(100% - 32px);max-width:470px;transform:translate(-50%,-50%);padding:26px 28px;text-align:center;background:rgba(14,14,14,.96);border:1px solid #333;border-top:3px solid var(--gold);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.7)}
.pl-dialog h2{margin:0 0 8px;font-family:"Playfair Display",Georgia,serif;color:var(--gold2)}
.pl-dialog p{margin:0 0 18px;color:var(--muted)}
.pl-dialog div{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.btn-gold,.btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:11px 20px;border:1px solid transparent;border-radius:8px;font:600 15px "Inter",sans-serif;text-decoration:none;cursor:pointer}
.btn-gold{background:var(--gold);border-color:var(--gold);color:#111}
.btn-ghost{background:rgba(255,255,255,.08);border-color:#444;color:var(--text)}
@media (max-width:640px){
  .pl-vol,.pl-row [data-act=back],.pl-row [data-act=fwd]{display:none}
  .pl-row button{min-width:34px;padding:8px 7px;font-size:14px}
  .pl-time{font-size:12.5px;margin-left:2px}
  .pl-top{padding:12px 14px}.pl-controls{padding:26px 12px 12px}
}
.pl-skip{display:inline-flex;align-items:center;justify-content:center;min-width:42px;padding:8px 10px;border-radius:8px;color:var(--text);font-size:17px;text-decoration:none}
.pl-skip:hover{background:rgba(255,255,255,.1);color:var(--gold2)}
.pl-count b{color:var(--gold2)}
.pl-row button.on{color:var(--gold)}
video::cue{background:rgba(0,0,0,.72);color:#fff;font-family:"Inter",system-ui,sans-serif;font-size:clamp(16px,2.4vw,30px);line-height:1.35}
