.site-playback{position:absolute;z-index:9;background:var(--c-navy-deep);overflow:hidden}
.site-playback[hidden],.site-playback [hidden]{display:none}
.site-playback[data-mode="inline"]{border-radius:var(--radius-m);overflow:visible}
.site-playback[data-mode="inline"][data-clipped="true"]{border-radius:0;overflow:hidden}
.site-playback[data-mode="inline"] .site-playback-stage{overflow:hidden;border-radius:inherit}
.site-playback[data-mode="inline"][data-docked="true"]{position:fixed;z-index:30}
body[data-page="work"] .site-playback[data-mode="inline"]{border-radius:0}
.site-playback-stage{width:100%;height:100%;border-radius:0}
.site-playback[data-expanding="true"]{z-index:30;pointer-events:none}
.site-playback-slot{position:relative;min-height:var(--player-min-height);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--sp-8)}
.site-playback-placeholder{color:var(--c-white);font-size:var(--fs-ui-body);line-height:var(--lh-normal);padding:var(--sp-16);text-align:center;margin:0}
.site-playback-placeholder:empty{display:none}
.site-playback-slot-controls{min-height:var(--control-h);margin-bottom:var(--sp-8)}
.site-playback-slot-controls[data-controls=true]{min-height:var(--mini-player-controls-height);margin-bottom:0}
body[data-page=work] .site-playback-slot-controls[data-controls=true]{margin-top:calc(-1 * var(--sp-8))}
.site-playback-load{display:grid;place-items:center;flex:none;width:var(--control-h-lg);height:var(--control-h-lg);padding:0;border:0;border-radius:50%;background:var(--c-white);color:var(--c-navy);font:inherit;font-size:var(--fs-22);cursor:pointer}
.site-playback-load[hidden]{display:none}
.site-playback-minimize{position:absolute;top:100%;left:50%;transform:translateX(-50%);width:calc(var(--sp-40) * 3);height:var(--control-h);padding:0;border:0;border-radius:0 0 var(--radius-l) var(--radius-l);background:transparent;color:var(--c-text-sub);touch-action:none;cursor:pointer}
.site-playback-minimize::after{content:"";position:absolute;inset:0 0 auto;height:var(--sp-20);border:1px solid var(--c-border);border-top:0;border-radius:0 0 var(--radius-l) var(--radius-l);background:var(--c-white)}
.site-playback-minimize::before{content:"";position:absolute;z-index:1;top:var(--sp-4);left:50%;width:var(--sp-8);height:var(--sp-8);border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateX(-50%) rotate(45deg)}
.site-playback-dock[data-dock=top] svg:not([data-dock=top]),.site-playback-dock[data-dock=bottom] svg:not([data-dock=bottom]),.site-playback-dock[data-dock=free] svg:not([data-dock=free]){display:none}
.site-playback-minimize:hover::after{background:var(--c-bg-soft)}
.site-playback-minimize:focus-visible,.site-playback-load:focus-visible,.site-playback-control:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-offset)}
.site-playback[data-mode="mini"]{position:fixed;z-index:30;right:0;bottom:0;margin:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);width:100%;border:0;border-radius:0;box-shadow:none;background:var(--c-navy-deep)}
.site-playback[data-mode="mini"] .site-playback-stage{width:min(100%,calc(var(--mini-player-video-height,0px) * 16 / 9));height:auto;min-height:0;aspect-ratio:16/9;margin-inline:auto}
.site-playback-controls{position:relative;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));align-items:center;color:var(--c-navy);height:var(--mini-player-controls-height);background:var(--c-bg-muted);padding-inline:env(safe-area-inset-left) env(safe-area-inset-right)}
.site-playback-controls::after{content:"";position:absolute;z-index:1;inset:0;border-block:1px solid var(--c-navy);pointer-events:none}
.site-playback-control{display:grid;place-items:center;min-width:0;width:100%;height:var(--mini-player-controls-height);padding:0;border:0;border-radius:0;background:transparent;color:var(--c-navy);font-size:var(--fs-18);line-height:var(--lh-tight);text-decoration:none;cursor:pointer}
.site-playback-control:hover{background:var(--c-bg-soft)}
body[data-festival-ux] .site-playback-control:hover:not(:active){transform:none}
.site-playback-feedback{background:var(--c-white);margin:0;padding:var(--sp-8) var(--sp-12);color:var(--c-error);font-size:var(--fs-ui-meta);line-height:var(--lh-normal)}
body.has-mini-player{padding-bottom:calc(var(--mini-player-height) + var(--sp-32) + env(safe-area-inset-bottom))}
.site-playback[data-mode="mini"] .rehearsal-player{max-height:var(--mini-player-video-height,0px);overflow:hidden;gap:var(--sp-8);padding:min(var(--sp-8),calc(var(--mini-player-video-height,0px) / 2));font-size:var(--fs-ui-meta)}
.site-playback[data-mode="mini"] .rehearsal-player p{margin:0}
@media (min-width: 960px){.site-playback[data-mode="mini"]{margin:env(safe-area-inset-top) max(var(--sp-16),env(safe-area-inset-right)) env(safe-area-inset-bottom) max(var(--sp-16),env(safe-area-inset-left));max-width:var(--mini-player-width);border:2px solid var(--c-navy);box-shadow:var(--shadow-offset) var(--c-border)}}

.site-playback-dock{touch-action:none;user-select:none;cursor:ns-resize}

.site-playback-load:focus-visible{outline:var(--focus-ring-inverse);outline-offset:var(--focus-offset)}

.site-playback[data-mode=inline][data-controls=true] .site-playback-stage{width:min(100%,calc(var(--inline-player-video-height) * 16 / 9));min-height:0;margin-inline:auto}
.site-playback-slot>:is(.site-playback-placeholder,.site-playback-load){position:relative;z-index:1}
.site-playback-placeholder[hidden]~:is(.site-playback-thumb,.site-playback-provider){display:none}
.site-playback-thumb{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover}
.site-playback-provider{position:absolute;z-index:1;top:var(--sp-8);left:var(--sp-8);display:inline-flex;align-items:center;min-height:var(--tag-h);padding:0 var(--sp-8);border-radius:var(--radius-s);background:var(--c-white);color:var(--c-navy);font-size:var(--fs-ui-meta);font-weight:700;line-height:var(--lh-tight)}
.site-playback-thumb~.site-playback-load{z-index:2}
.site-playback-slot:has(>.site-playback-thumb)>.site-playback-placeholder:not([hidden]):not(:empty){border-radius:var(--radius-m);background:var(--c-overlay)}
.site-playback-grip,.site-playback-resize{display:none}
/* PCの小窓：移動バー（動画の上）と、四隅の大きさ変更つまみ（移動バー・操作バーの両端）。どちらも動画の外にあり、動画の前には重ならない */
@media (min-width: 960px){
.site-playback[data-mode="mini"]{max-width:none;min-width:var(--mini-player-width)}
.site-playback[data-mode="mini"] .site-playback-grip{display:flex;align-items:center;justify-content:center;height:var(--sp-24);width:100%;padding:0;border:0;border-bottom:1px solid var(--c-navy);border-radius:0;background:var(--c-bg-muted);color:var(--c-navy);touch-action:none;cursor:grab}
.site-playback[data-mode="mini"] .site-playback-grip:active{cursor:grabbing}
.site-playback[data-mode="mini"] .site-playback-grip:hover{background:var(--c-bg-soft)}
body[data-festival-ux] .site-playback[data-mode="mini"] :is(.site-playback-grip,.site-playback-resize):is(:hover,:active){transform:none}
.site-playback[data-mode="mini"] .site-playback-resize{display:block;position:absolute;z-index:2;width:var(--sp-16);height:var(--sp-16);padding:0;border:0;background:transparent;touch-action:none}
.site-playback-resize::before{content:"";position:absolute;width:var(--sp-8);height:var(--sp-8);border:0 solid var(--c-navy)}
.site-playback-resize[data-corner="nw"]{top:0;left:0;cursor:nwse-resize}
.site-playback-resize[data-corner="ne"]{top:0;right:0;cursor:nesw-resize}
.site-playback-resize[data-corner="sw"]{bottom:0;left:0;cursor:nesw-resize}
.site-playback-resize[data-corner="se"]{bottom:0;right:0;cursor:nwse-resize}
.site-playback-resize[data-corner="nw"]::before{top:var(--sp-2);left:var(--sp-2);border-top-width:2px;border-left-width:2px}
.site-playback-resize[data-corner="ne"]::before{top:var(--sp-2);right:var(--sp-2);border-top-width:2px;border-right-width:2px}
.site-playback-resize[data-corner="sw"]::before{bottom:var(--sp-2);left:var(--sp-2);border-bottom-width:2px;border-left-width:2px}
.site-playback-resize[data-corner="se"]::before{bottom:var(--sp-2);right:var(--sp-2);border-bottom-width:2px;border-right-width:2px}
.site-playback-grip:focus-visible,.site-playback-resize:focus-visible{outline:var(--focus-ring);outline-offset:calc(-1 * var(--sp-2))}
}