/* Shared stream controls: status, audience, device favorites and desktop rails. */
html body [data-phlc-live-hidden="1"], html body .phlc-favorites-dialog:not([open]) { display:none!important; }
html body .phlc-favorite-host { position:relative!important; }
html body .phlc-favorite-toggle { display:inline-flex!important; align-items:center; justify-content:center; gap:6px; box-sizing:border-box; width:40px; min-width:40px; height:40px; min-height:40px; padding:0!important; margin:0; border:1px solid #8e7d9e!important; border-radius:12px; background:#20142feF!important; color:#fff!important; font:700 25px/1 system-ui!important; cursor:pointer; text-decoration:none; box-shadow:0 2px 8px #0004; }
html body .phlc-favorite-host > .phlc-favorite-toggle { position:absolute; top:8px; right:8px; z-index:4; }
html body .phlc-favorite-toggle[aria-pressed="true"] { color:#ffe49a!important; border-color:#e1c17a!important; background:#392a14f2!important; }
html body .phlc-favorite-toggle--labelled { width:auto; padding:0 12px!important; margin-top:10px; font:700 13px/1.2 system-ui!important; }
html body .phlc-favorite-toggle--labelled [data-favorite-icon] { font-size:23px; }
html body .phlc-favorite-card-link { display:contents!important; color:inherit!important; text-decoration:none!important; }
html body .phspb-sidebar-room.phlc-favorite-host { padding-right:47px!important; }
html body .phspb-sidebar-room.phlc-favorite-host > .phlc-favorite-toggle { width:36px; min-width:36px; height:36px; min-height:36px; right:4px; top:50%; transform:translateY(-50%); }
html body .phlc-favorites-note { color:#c8bed3!important; font:400 12px/1.45 system-ui!important; margin:4px 0 12px!important; }
html body .phlc-favorites-empty { color:#d0c7d8!important; font:400 13px/1.5 system-ui!important; }
html body .phlc-favorite-row { position:relative; display:flex; align-items:center; gap:8px; padding:10px 0; border-bottom:1px solid #ffffff20; min-width:0; }
html body .phlc-favorite-profile { display:flex; align-items:center; flex:1; gap:9px; min-width:0; color:#fff!important; text-decoration:none; }
html body .phlc-favorite-profile img { width:52px; height:44px; flex-shrink:0; object-fit:cover; border-radius:8px; }
html body .phlc-favorite-profile > span { display:flex; flex-direction:column; gap:4px; min-width:0; }
html body .phlc-favorite-profile strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:700 13px/1.25 system-ui; }
html body .phlc-favorite-profile small { display:block; color:#c9bfd5; font:500 10px/1.4 system-ui; }
html body .phlc-favorite-row[data-phlc-status="public"] small { color:#b1eccd; }
html body .phlc-favorite-row > .phlc-favorite-toggle { position:static; flex-shrink:0; }
html body .phlc-stream-tools { display:flex; justify-content:flex-end; margin:0 0 12px!important; width:100%; }
html body [data-phlc-favorites-open], html body .phlc-favorites-close { min-height:40px; padding:8px 14px; border:1px solid #9580ab; border-radius:12px; color:#fff; background:#251734; font:700 13px/1.3 system-ui; cursor:pointer; }
/* The model page already has a wrapping actions row for these controls. */
html body.phspb-stream-template .phspb-hero-main-card .phspb-model-page-actions > .phlc-stream-tools { width:auto; max-width:100%; flex:0 1 auto; justify-content:flex-start; margin:0!important; }
html body.phspb-stream-template .phspb-hero-main-card .phspb-model-page-actions > .phlc-stream-tools > [data-phlc-favorites-open] { box-sizing:border-box; min-height:44px; margin:0; }
html body .phlc-favorites-dialog { box-sizing:border-box; position:fixed; inset:0; margin:auto; width:min(520px,calc(100% - 24px)); max-width:calc(100% - 24px); max-height:80vh; max-height:80dvh; overflow:auto; padding:20px; border:1px solid #8f76a6; border-radius:20px; background:#180e25; color:#fff; box-shadow:0 20px 80px #0008; z-index:2147483640; }
html body .phlc-favorites-dialog::backdrop { background:#090510c9; }
html body .phlc-favorites-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
html body .phlc-favorites-heading h2 { margin:0; color:#fff; font:750 24px/1.3 system-ui; }
html body .phlc-favorite-toggle:focus-visible, html body .phlc-favorite-card-link:focus-visible, html body .phlc-favorite-profile:focus-visible, html body [data-phlc-favorites-open]:focus-visible, html body .phlc-favorites-close:focus-visible, html body .phlc-favorites-list:focus { outline:3px solid #edd0ff!important; outline-offset:3px; }
html body .phlc-visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
/* One primary status; audience is always a separate metric, followers are quiet metadata. */
html body .phlc-card .phlc-badge-live, html body .phlc-card .phlc-badge-offline, html body .phspb-smart-preview-card__live, html body .phvv-live-grid-live { top:8px!important; left:8px!important; right:auto!important; display:inline-flex; align-items:center; width:auto!important; min-width:0!important; height:auto!important; min-height:24px!important; padding:4px 8px!important; border-radius:7px!important; font:750 10px/1.3 system-ui!important; letter-spacing:.04em!important; box-shadow:none!important; }
html body .phlc-card .phlc-badge-live > span { display:none!important; }
html body .phlc-card .phlc-viewers-badge { top:auto!important; bottom:8px!important; left:8px!important; right:auto!important; min-height:24px!important; padding:4px 7px!important; font-size:11px!important; background:#130b20e8!important; }
html body .phlc-card .phlc-country-badge { top:auto!important; bottom:8px!important; right:8px!important; left:auto!important; width:27px!important; height:24px!important; min-height:0!important; font-size:18px!important; border-radius:5px!important; }
html body .phlc-card .phlc-home-metric-followers { background:transparent!important; border:0!important; box-shadow:none!important; padding:0!important; min-height:0!important; border-radius:0!important; color:#c4b9d0!important; }
html body .phlc-card .phlc-home-metric-followers::before, html body .phlc-card .phlc-home-metric-followers::after { display:none!important; content:none!important; }
html body .phlc-card .phlc-home-metric-followers strong, html body .phlc-card .phlc-home-metric-followers small { color:#c4b9d0!important; font-size:11px!important; font-weight:500!important; }
html body .phlc-card .phlc-card-name-overlay-text { display:block!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; max-width:100%!important; }
html body .phlc-card.phlc-card-homepage::after { overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; word-break:normal!important; }
@media (min-width:1181px) {
  html.phlc-has-live-layout, html.phlc-has-live-layout body { overflow-x:clip!important; overflow-y:visible!important; }
  html.phlc-has-live-layout body .phspb-model-shortcode, html.phlc-has-live-layout body .phspb-page-layout { overflow:visible!important; }
  html.phlc-has-live-layout body .phspb-page-layout > .phspb-sidebar-panel,
  html.phlc-has-live-layout body .phspb-page-layout > .phspb-sidebar-panel.phspb-sidebar-left.has-expanded-filter,
  html.phlc-has-live-layout body .phspb-page-layout > .phspb-sidebar-panel.phspb-sidebar-right--model {
    position:sticky!important; top:var(--phlc-rail-top,82px)!important; align-self:start!important; height:auto!important;
    max-height:calc(100vh - var(--phlc-rail-top,82px) - 16px)!important; max-height:calc(100dvh - var(--phlc-rail-top,82px) - 16px)!important;
    min-height:0!important; overflow:hidden!important; display:flex!important; flex-direction:column!important;
  }
  html.phlc-has-live-layout body .phspb-page-layout > .phspb-sidebar-panel > .phspb-nav-sidebar-inner,
  html.phlc-has-live-layout body .phspb-sidebar-left.has-expanded-filter > .phspb-nav-sidebar-inner {
    height:auto!important; max-height:inherit!important; min-height:0!important; overflow-x:hidden!important; overflow-y:auto!important;
    overscroll-behavior:auto!important; overscroll-behavior-y:auto!important; scrollbar-width:thin!important; scrollbar-color:#8c729f transparent!important; -ms-overflow-style:auto!important; padding-right:5px!important;
  }
  html.phlc-has-live-layout body .phspb-page-layout > .phspb-sidebar-panel > .phspb-nav-sidebar-inner::-webkit-scrollbar { display:block!important; width:5px!important; }
  html.phlc-has-live-layout body .phspb-page-layout > .phspb-sidebar-panel > .phspb-nav-sidebar-inner::-webkit-scrollbar-thumb { background:#8c729f; border-radius:5px; }
}
@media (max-width:767px) {
  html body .phlc-favorite-host > .phlc-favorite-toggle { width:40px; height:40px; top:5px; right:5px; }
  html body .phlc-favorites-dialog { padding:16px; }
}

html body .phlc-favorite-host:focus-within { outline:2px solid #e7bfff!important; outline-offset:2px; }
/* Compact visible star; the transparent card button retains a 44px target. */
html body .phlc-favorite-host > .phlc-favorite-toggle {
  border:0!important; background:transparent!important; box-shadow:none;
  font-size:18px!important; isolation:isolate;
}
html body .phlc-card.phlc-favorite-host > .phlc-favorite-toggle {
  width:44px; min-width:44px; height:44px; min-height:44px; top:2px; right:2px;
}
html body .phlc-favorite-host > .phlc-favorite-toggle::before {
  content:""; position:absolute; width:28px; height:28px; box-sizing:border-box;
  border:1px solid #8e7d9e; border-radius:9px; background:#20142ff2; z-index:-1;
  box-shadow:0 2px 6px #0004; pointer-events:none;
}
html body .phlc-favorite-host > .phlc-favorite-toggle[aria-pressed="true"]::before {
  border-color:#e1c17a; background:#392a14f2;
}
html.phlc-favorites-open, html.phlc-has-live-layout.phlc-favorites-open, html.phlc-has-live-layout.phlc-favorites-open body { overflow:hidden!important; }

@media (min-width:1181px) and (max-width:1439px) {
  html.phlc-has-live-layout body .phspb-page-layout > .phspb-sidebar-panel.phspb-sidebar-right--model { display:none!important; }
}
/* Resolve legacy high-specificity thumbnail overlays as a single three-part row. */
html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-viewers-badge,
html body .phlc-card.phlc-card-homepage .phlc-thumb-wrap .phlc-viewers-badge {
  inset:auto!important; top:8px!important; left:64px!important; right:auto!important; bottom:auto!important;
  width:max-content!important; min-width:0!important; max-width:calc(100% - 116px)!important;
  height:24px!important; min-height:24px!important; max-height:24px!important;
  padding:3px 6px!important; gap:3px!important; border-radius:7px!important;
  font-size:10px!important; line-height:1!important; background:#160c24ed!important; color:#fff!important;
  opacity:1!important; z-index:3!important; overflow:hidden!important; transform:none!important;
}
html body .phlc-scope .phlc-card.phlc-card-clean .phlc-viewers-count { font-size:10px!important; line-height:1!important; }
html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-badge-live,
html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-badge-offline {
  top:8px!important; left:8px!important; min-height:24px!important; max-height:24px!important; padding:4px 7px!important;
  font-size:10px!important; line-height:16px!important; border-radius:7px!important; transform:none!important;
}
html body .phlc-scope .phlc-card.phlc-card-clean .phlc-home-metric.phlc-home-metric-followers {
  background:transparent!important; border:0!important; box-shadow:none!important; padding:0!important;
}
@media (max-width:767px) {
  /* A titled homepage section already supplies its own shell. Nested directory
   * padding reduced a 390px viewport to 151px cards and repeated "Live Rooms". */
  html body .phspb-home-live-cams-shortcode.phspb-model-shortcode .phspb-page-layout > .phspb-model-block > .phspb-section-card.phspb-home-auto-section {
    padding:12px 0!important; border-left:0!important; border-right:0!important;
  }
  html body .phspb-home-live-cams-shortcode .phspb-home-auto-section .phlc-directory .phlc-section {
    padding:0!important; margin:0!important; border:0!important; background:transparent!important;
  }
  html body .phspb-home-live-cams-shortcode .phspb-home-auto-section .phlc-directory .phlc-section > .phlc-block-head {
    display:none!important;
  }
  /* Keep one readable name on the preview. The legacy desktop body was also
   * absolutely positioned over it on compact mobile cards. */
  html body .phspb-model-shortcode .phlc-scope .phlc-card.phlc-card-clean.phlc-card-homepage .phlc-card-body-desktop {
    display:none!important;
  }
  html body .phspb-model-shortcode .phlc-scope .phlc-card.phlc-card-clean.phlc-card-homepage::after {
    display:none!important; content:none!important;
  }
  /* A second row leaves enough space for the entire abbreviated audience even
   * in a narrow embedded collection, without sharing the favorite's hit area. */
  html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-viewers-badge {
    top:38px!important; left:8px!important; max-width:calc(100% - 16px)!important;
    overflow:visible!important; flex-shrink:0!important;
  }
  html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-viewers-badge > span {
    flex-shrink:0!important; width:auto!important; min-width:max-content!important;
  }
  html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-country-badge { top:52px!important; bottom:auto!important; right:10px!important; }
  html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-card-name-overlay {
    left:8px!important; right:8px!important; width:auto!important; max-width:none!important; padding:0!important;
    height:20px!important; min-height:20px!important; overflow:hidden!important; white-space:nowrap!important;
  }
  html body .phlc-scope .phlc-card.phlc-card-clean .phlc-thumb-wrap .phlc-card-name-overlay-text {
    font-size:12px!important; line-height:20px!important; display:block!important; white-space:nowrap!important;
    width:100%!important; max-width:100%!important; min-height:0!important; padding:0!important;
    overflow:hidden!important; text-overflow:ellipsis!important; word-break:normal!important; -webkit-line-clamp:unset!important;
  }
}