

.pdv-rv[data-kind="video"] .pdv-scroller { bottom: 72px; padding-bottom: 20px; }
.pdv-rv[data-kind="video"] .pdv-frame { background: #000; border-radius: 8px 8px 0 0; margin-bottom: 64px; }
.pdv-media-video { border-radius: 8px 8px 0 0; background: #000; object-fit: contain; }
.pdv-media-tc { position: absolute; right: 12px; top: 12px; height: 24px; padding: 0 9px; border-radius: 7px; background: rgba(0, 0, 0, .55); color: #fff; font: 700 12px/24px var(--pdv-font);
  font-variant-numeric: tabular-nums; z-index: 2; pointer-events: none; }
.pdv-media-vctl { position: absolute; left: 0; right: 0; top: 100%; background: #0f1714; border-radius: 0 0 8px 8px; padding: 6px 14px 10px; color: #dfe9e3;
  box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .4); z-index: 3; cursor: default; font-family: var(--pdv-font); }
.pdv-media-tl { position: relative; height: 32px; cursor: pointer; touch-action: none; outline: none; }
.pdv-media-tl:focus-visible { box-shadow: 0 0 0 2px var(--pdv-mint); border-radius: 4px; }
.pdv-media-tl__rail { position: absolute; left: 0; right: 0; top: 19px; height: 6px; border-radius: 3px; background: #2a3832; }
.pdv-media-tl__done { position: absolute; left: 0; width: 0; top: 19px; height: 6px; border-radius: 3px; background: var(--pdv-mint); pointer-events: none; }
.pdv-media-tl__sel { position: absolute; top: 16px; height: 12px; border-radius: 3px; background: rgba(95, 191, 143, .3); border: 1.5px solid var(--pdv-mint); pointer-events: none; }
.pdv-media-tl__marks { position: absolute; inset: 0; pointer-events: none; }
.pdv-media-tl__range { position: absolute; top: 17px; height: 10px; border-radius: 3px; background: rgba(232, 163, 58, .45); border: 1.5px solid #e8a33a; }
.pdv-media-tl__range.is-done { background: rgba(125, 140, 134, .35); border-color: #6d7d75; }
.pdv-media-tl__mk { position: absolute; top: 0; transform: translateX(-50%); width: 18px; height: 18px; padding: 0; border: 0; border-radius: 9px 9px 9px 2px; display: grid; place-items: center;
  font: 800 9.5px/1 var(--pdv-font); color: #fff; background: #c4452e; box-shadow: 0 0 0 2px #0f1714; cursor: pointer; pointer-events: auto; }
.pdv-media-tl__mk.is-range { background: #e8a33a; }
.pdv-media-tl__mk.is-team { background: var(--pdv-accent-fill); }
.pdv-media-tl__mk.is-internal { background: var(--pdv-violet); }
.pdv-media-tl__mk.is-done { background: #6d7d75; }
.pdv-media-tl__mk:hover, .pdv-media-tl__mk:focus-visible { transform: translateX(-50%) scale(1.15); }
.pdv-media-tl__head { position: absolute; left: 0; top: 14px; width: 4px; height: 16px; border-radius: 2px; background: #fff; transform: translateX(-2px); pointer-events: none; }
.pdv-media-cr { display: flex; align-items: center; gap: 14px; font-size: 12.5px; font-weight: 600; }
.pdv-media-play { width: 32px; height: 32px; border-radius: 50%; background: #fff; color: #0f1714; display: grid; place-items: center; border: 0; padding: 0; cursor: pointer; flex: none; }
.pdv-media-play .pdv-media-play__off { display: none; }
.pdv-media-playing .pdv-media-play .pdv-media-play__on { display: none; }
.pdv-media-playing .pdv-media-play .pdv-media-play__off { display: block; }
.pdv-media-time { font-variant-numeric: tabular-nums; white-space: nowrap; }
.pdv-media-time b { color: #fff; }
.pdv-media-sp { margin-left: auto; display: flex; align-items: center; gap: 10px; color: #a9b8b0; }
.pdv-media-sp button { border: 0; background: none; color: inherit; padding: 4px; border-radius: 6px; display: grid; place-items: center; cursor: pointer; font: inherit; }
.pdv-media-sp button:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.pdv-media-sp button[aria-pressed="true"] { color: #e8a33a; }
.pdv-media-sp .pdv-media-rate { padding: 2px 7px; border: 1px solid #34443d; min-width: 34px; }
.pdv-anno .pdv-media-offtime { display: none; }
.pdv-media-at span { font-variant-numeric: tabular-nums; font-size: 12.5px; font-weight: 600; }
.pdv-media-clock.is-on { color: var(--pdv-accent); background: var(--pdv-accent-soft); }
:fullscreen .pdv-media-vctl { position: absolute; }
[data-pdv-canvas]:fullscreen { background: var(--pdv-canvas); }

.pdv-media-ts { display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 7px; border-radius: 6px; background: var(--pdv-ink); color: var(--pdv-surface); border: 0;
  font: 800 11px/1 var(--pdv-font); font-variant-numeric: tabular-nums; cursor: pointer; flex: none; white-space: nowrap; }
.pdv-media-ts .pdv-i { width: 10px; height: 10px; fill: currentColor; }
.pdv-media-ts:hover { background: var(--pdv-accent-fill); color: #fff; }
.pdv-media-ctx { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0 30px; }
.pdv-media-ctx .pdv-chip { height: 22px; font-weight: 600; color: var(--pdv-text); }
.pdv-media-ctx .pdv-i { width: 12px; height: 12px; }
.pdv-reply + .pdv-media-ctx, .pdv-th > .pdv-media-ctx:empty { display: none; }

.pdv-rv[data-kind="website"] .pdv-scroller { top: 46px; padding-top: 72px; }
.pdv-rv[data-kind="website"] [data-pdv-pager] { display: none !important; }
.pdv-rv[data-kind="website"] .pdv-anno { z-index: 3; }
.pdv-rv[data-kind="website"] .pdv-frame { border-radius: 0 0 12px 12px; background: #fff; }
.pdv-media-site { position: relative; width: 100%; height: 100%; }
.pdv-media-bar { position: absolute; left: 0; right: 0; bottom: 100%; height: 44px; display: flex; align-items: center; gap: 10px; padding: 0 14px; background: #f1f3f1;
  border-bottom: 1px solid #e0e4e0; color: #5b6b63; border-radius: 12px 12px 0 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, .06); font-family: var(--pdv-font); }
.pdv-media-bar__dots { display: flex; gap: 6px; flex: none; }
.pdv-media-bar__dots i { width: 11px; height: 11px; border-radius: 50%; background: #d9dcd9; }
.pdv-media-bar__url { flex: 1; min-width: 0; height: 28px; border-radius: 8px; background: #fff; border: 1px solid #e0e4e0; display: flex; align-items: center; gap: 6px; padding: 0 4px 0 10px;
  font-size: 12.5px; color: #3a4a42; }
.pdv-media-bar__url .pdv-ellipsis { flex: 1; min-width: 0; }
.pdv-media-bar__mode { margin-left: auto; display: inline-flex; gap: 2px; align-items: center; flex: none; }
.pdv-media-bar__mode button { height: 22px; padding: 0 8px; border-radius: 6px; border: 0; background: none; font: 700 10.5px/1 var(--pdv-font); color: #5b6b63; cursor: pointer; }
.pdv-media-bar__mode button.is-on { background: #e2f0e7; color: #1a6b45; }
.pdv-media-bar__badge { font-size: 10.5px; font-weight: 800; color: #5b6b63; display: inline-flex; align-items: center; gap: 4px; padding-right: 6px; }
.pdv-media-bar__badge.is-live { color: #1a7a4c; }
.pdv-media-bar__badge.is-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #1a7a4c; }
.pdv-media-bar__b { border: 0; background: none; color: inherit; width: 28px; height: 28px; border-radius: 7px; display: grid; place-items: center; cursor: pointer; flex: none; }
.pdv-media-bar__b:hover:not([disabled]) { background: rgba(0, 0, 0, .06); }
.pdv-media-bar__b[disabled] { opacity: .35; cursor: default; }
html.pdv-theme-dark .pdv-media-bar { background: #1b2420; border-color: #26332d; color: #9aaaa1; }
html.pdv-theme-dark .pdv-media-bar__dots i { background: #3a4741; }
html.pdv-theme-dark .pdv-media-bar__url { background: #121a17; border-color: #2a3832; color: #c4d1c9; }
html.pdv-theme-dark .pdv-media-bar__mode button { color: #9aaaa1; }
html.pdv-theme-dark .pdv-media-bar__mode button.is-on { background: #173527; color: #40bf83; }
.pdv-media-page { position: absolute; inset: 0; overflow: hidden; border-radius: 0 0 12px 12px; background: #fff; }
.pdv-media-iframe { position: absolute; left: 0; top: 0; border: 0; transform-origin: 0 0; background: #fff; }
.pdv-media-shot { display: block; width: 100%; height: 100%; user-select: none; -webkit-user-drag: none; }
.pdv-media-catch { position: absolute; inset: 0; z-index: 1; }
.pdv-media-catch.is-off { pointer-events: none; }
.pdv-media-none { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 40px;
  text-align: center; color: var(--pdv-muted); background: var(--pdv-surface); font-family: var(--pdv-font); }
.pdv-media-none b { color: var(--pdv-ink); font-size: 15px; }
.pdv-media-none p { max-width: 420px; margin: 0 0 8px; font-size: 13px; }
.pdv-media-none .pdv-i.lg { width: 34px; height: 34px; color: var(--pdv-faint); }
.pdv-media-browsing .pdv-scroller.is-pan .pdv-media-iframe { cursor: auto; }
.pdv-media-devices { display: inline-flex; gap: 2px; padding: 2px; border-radius: 9px; background: var(--pdv-sunken); }
.pdv-media-devices .pdv-toolbar__b { height: 28px; min-width: 30px; padding: 0 6px; border-radius: 7px; }
.pdv-media-devices .pdv-toolbar__b.is-on, .pdv-media-devices .pdv-toolbar__b[aria-pressed="true"] { background: var(--pdv-surface); color: var(--pdv-ink); box-shadow: 0 1px 2px rgba(var(--pdv-shadow-rgb), .12); }

.pdv-media-pages { margin-top: 8px; display: flex; flex-direction: column; }
.pdv-media-pages button { display: flex; align-items: center; gap: 8px; padding: 7px 8px; margin: 0 -8px; border: 0; background: none; border-radius: 8px; font: 600 12.5px/1.3 var(--pdv-font);
  color: var(--pdv-text); cursor: pointer; text-align: left; min-width: 0; }
.pdv-media-pages button:hover { background: var(--pdv-hover); }
.pdv-media-pages button.is-on { background: var(--pdv-accent-soft); color: var(--pdv-accent); }
.pdv-media-pages button .pdv-ellipsis { flex: 1; min-width: 0; }
.pdv-media-pages__n { margin-left: auto; font-size: 11px; font-weight: 800; color: var(--pdv-bad-text); background: var(--pdv-bad-soft); padding: 0 7px; border-radius: 9px; line-height: 18px; flex: none; }
.pdv-media-pages__n.is-zero { color: var(--pdv-faint); background: var(--pdv-sunken); }
.pdv-media-pages__add { margin-top: 6px; }
.pdv-media-popctx { margin: 6px 0 0; font-size: 11.5px; color: var(--pdv-faint); }

.pdv-media-filepill { max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; line-height: 28px; }
.pdv-media-filepill:empty { display: none; }

.pdv-media-up__kind { margin: 0 0 14px; }
.pdv-media-up__group, .pdv-media-up__site { margin-top: 14px; }
.pdv-media-choices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.pdv-media-choice { position: relative; display: block; cursor: pointer; margin: 0; }
.pdv-media-choice input { position: absolute; opacity: 0; pointer-events: none; }
.pdv-media-choice span { display: flex; flex-direction: column; gap: 3px; height: 100%; padding: 10px 12px; border-radius: var(--pdv-r-md); border: 1px solid var(--pdv-border); background: var(--pdv-surface);
  font-weight: 400; transition: border-color .12s, box-shadow .12s; }
.pdv-media-choice b { font-size: 12.5px; color: var(--pdv-ink); }
.pdv-media-choice small { font-size: 11.5px; color: var(--pdv-muted); line-height: 1.35; }
.pdv-media-choice input:checked + span { border-color: var(--pdv-accent); box-shadow: 0 0 0 1px var(--pdv-accent); background: var(--pdv-accent-soft); }
.pdv-media-choice input:focus-visible + span { outline: 2px solid var(--pdv-accent); outline-offset: 2px; }
.pdv-media-check { margin-top: 8px; font-size: 12.5px; padding: 8px 10px; border-radius: var(--pdv-r-sm); background: var(--pdv-sunken); color: var(--pdv-text); }
.pdv-media-check.is-ok { background: var(--pdv-good-soft); color: var(--pdv-good); }
.pdv-media-check.is-warn { background: var(--pdv-warn-soft); color: var(--pdv-warn-text); }
.pdv-media-check.is-bad { background: var(--pdv-bad-soft); color: var(--pdv-bad-text); }
.pdv-media-setchip { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 7px; border-radius: 6px; background: var(--pdv-teal-soft);
  color: var(--pdv-teal); font-size: 11px; font-weight: 700; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.pdv-media-setchip .pdv-i { width: 11px; height: 11px; flex: none; }
.pdv-media-setrow { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--pdv-border); }
.pdv-media-setrow:last-child { border-bottom: 0; }

@media (max-width: 760px) {
  .pdv-rv[data-kind="video"] .pdv-scroller { bottom: 64px; padding-bottom: 12px; }
  .pdv-rv[data-kind="video"] .pdv-frame { margin-bottom: 76px; }
  .pdv-media-vctl { padding: 4px 10px 8px; }
  .pdv-media-cr { gap: 8px; }
  .pdv-media-sp { gap: 4px; }
  .pdv-rv[data-kind="website"] .pdv-scroller { top: 40px; padding-top: 60px; }
  .pdv-media-bar { height: 38px; padding: 0 8px; }
  .pdv-media-bar__dots { display: none; }
  .pdv-media-choices { grid-template-columns: 1fr; }
  .pdv-media-filepill { display: none; }
}
