:root{color-scheme:dark;--bg:#171C25;--navy:#1E232B;--fg:#fff;--gold-hi:#CAB6A1;--gold-grad:linear-gradient(135deg,#D6C5B2 0%,#CAB6A1 55%,#BBA68F 100%);--body:'Archivo',system-ui,Arial,sans-serif}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:#0b0f15;overflow:hidden;color:var(--fg);font-family:var(--body)}
body{display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.vbar{display:flex;align-items:center;gap:14px;padding:8px 16px;background:#141a23;border-bottom:1px solid #2a3340;flex:0 0 auto}
.vbar .logo{display:block;line-height:0}.vbar .logo img{height:38px;width:auto}
.vbar .ttl{font:600 14px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.vbar .ctl{display:flex;align-items:center;gap:8px}
.vb{font:600 13px var(--body);background:#1e2631;color:#fff;border:1px solid #344052;border-radius:2px;padding:9px 13px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.vb:hover{background:#273141}
.vb.pri{background:var(--gold-grad);color:#1A2230;border-color:var(--gold-hi)}
.vcount{font:600 13px var(--body);min-width:84px;text-align:center}
.vmain{flex:1 1 auto;display:flex;min-height:0;position:relative}
.vstage{flex:1;position:relative;display:flex;align-items:center;justify-content:center;min-width:0;background:#0b0f15}
.slide{width:100%;height:100%;background:center/contain no-repeat;position:absolute;inset:0}
.nvb{position:absolute;top:0;bottom:0;width:18%;max-width:160px;border:0;background:transparent;color:#fff;font-size:44px;cursor:pointer;opacity:0;transition:opacity .2s;z-index:2}
.nvb:hover{opacity:.9;background:linear-gradient(90deg,#0008,transparent)}
.nvb.nx{right:0}.nvb.nx:hover{background:linear-gradient(270deg,#0008,transparent)}.nvb.pv{left:0}
.thumbs{width:0;overflow:auto;background:#10151d;border-right:1px solid #2a3340;transition:width .2s;flex:0 0 auto}
.thumbs.open{width:min(300px,70vw)}
.thumbs .in{padding:10px;display:grid;gap:8px;width:min(300px,70vw)}
.thumbs button{all:unset;cursor:pointer;display:block;position:relative;border:2px solid transparent;background:#000;aspect-ratio:16/9}
.thumbs button.on{border-color:var(--gold-hi)}
.thumbs .sp{display:block;width:100%;height:100%;background-size:600% 500%;background-repeat:no-repeat;pointer-events:none}
.thumbs b{position:absolute;left:4px;bottom:3px;font:600 10px var(--body);background:#000a;color:#fff;padding:2px 5px}
.vprog{height:3px;background:#1e2631;flex:0 0 auto}.vprog i{display:block;height:100%;background:var(--gold-hi);width:0}
body.full .vbar,body.full .vprog,body.full .thumbs{display:none}
.fnote{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);background:#000a;color:#fff;font:500 12px var(--body);padding:6px 12px;border-radius:2px;opacity:0;transition:opacity .3s;pointer-events:none}
.fnote.show{opacity:1}
@media(max-width:760px){.vbar .ttl{display:none}.vbar{gap:8px;padding:8px 10px}.vcount{min-width:60px}.vb span{display:none}.vbar .logo img{height:30px}}
@media print{html,body{display:none!important}}