/* PNP_WEBINAR_WC73B_MASTER_ROOM_CSS_MODULE */
/* PNP_WEBINAR_MASTER_ROOM_MOBILE_FIRST_CSS */
/* PNP_WEBINAR_MASTER_ROOM_ACCESSIBLE_SENIORS_CSS */

/* ═══════════════════════════════════════════════════════════
   PNP WEBINAR — MASTER ROOM CSS MODULE v1
   WC73B | mobile-first | dark PRO | gold / navy / black
   Klasy: .pnp-room, .pnp-topbar, .pnp-stage, .pnp-panel,
          .pnp-bottombar, .pnp-btn, .pnp-overlay, .pnp-chat,
          .pnp-people, .pnp-questions, .pnp-statusbar
   ═══════════════════════════════════════════════════════════ */

/* ── RESET & BASE ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ── DESIGN TOKENS ── */
:root {
  --pnp-gold:           #c9a84c;
  --pnp-gold-light:     #e8cc80;
  --pnp-gold-dark:      #8a6a20;
  --pnp-gold-glow:      rgba(201, 168, 76, 0.18);
  --pnp-gold-glow-sm:   rgba(201, 168, 76, 0.10);
  --pnp-navy:           #0d1b2e;
  --pnp-navy-mid:       #162440;
  --pnp-navy-light:     #1e3155;
  --pnp-navy-lighter:   #243a62;
  --pnp-navy-border:    #2a4066;
  --pnp-navy-border-lt: #3a5480;
  --pnp-black:          #08111d;
  --pnp-black-soft:     #0b1624;
  --pnp-white:          #f0f4fa;
  --pnp-text-main:      #d8e4f2;
  --pnp-text-muted:     #7a99bb;
  --pnp-text-dim:       #4a6580;
  --pnp-danger:         #c0392b;
  --pnp-danger-h:       #e74c3c;
  --pnp-danger-glow:    rgba(192, 57, 43, 0.18);
  --pnp-online:         #2ecc71;
  --pnp-online-glow:    rgba(46, 204, 113, 0.20);
  --pnp-radius:         12px;
  --pnp-radius-sm:      8px;
  --pnp-radius-xs:      6px;
  --pnp-radius-pill:    999px;
  --pnp-shadow:         0 4px 24px rgba(0,0,0,.45);
  --pnp-shadow-up:      0 -4px 24px rgba(0,0,0,.35);
  --pnp-shadow-sheet:   0 -8px 40px rgba(0,0,0,.60);
  --pnp-shadow-card:    0 2px 12px rgba(0,0,0,.40);
  --pnp-top-h:          64px;
  --pnp-bottom-h:       84px;
  --pnp-panel-w:        320px;
  --pnp-btn-min:        48px;
  --pnp-avatar-size:    120px;
  --pnp-t-fast:         0.12s ease;
  --pnp-t-mid:          0.20s ease;
}

/* ── DOCUMENT BASE ── */
html, body {
  height: 100%;
  background: var(--pnp-black);
  color: var(--pnp-text-main);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
               'Helvetica Neue', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ── LAYOUT SHELL ── */
.pnp-room {
  display: flex;
  flex-direction: column;
  height: 100dvh;
  height: 100vh;
  overflow: hidden;
  isolation: isolate;
}

/* ── TOP BAR ── */
.pnp-topbar {
  height: var(--pnp-top-h);
  min-height: var(--pnp-top-h);
  flex-shrink: 0;
  background: var(--pnp-navy);
  border-bottom: 1px solid var(--pnp-navy-border);
  display: flex;
  align-items: center;
  padding: 0 20px;
  gap: 16px;
  z-index: 20;
  box-shadow: var(--pnp-shadow);
}

.pnp-topbar__logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  text-decoration: none;
}

.pnp-topbar__logo-mark {
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, var(--pnp-gold-dark), var(--pnp-gold));
  border-radius: var(--pnp-radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 800;
  color: var(--pnp-navy);
  letter-spacing: -1px;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(201,168,76,.30);
}

.pnp-topbar__brand {
  font-size: 15px;
  font-weight: 600;
  color: var(--pnp-gold-light);
  white-space: nowrap;
  letter-spacing: 0.01em;
}

.pnp-topbar__sep {
  width: 1px;
  height: 28px;
  background: var(--pnp-navy-border);
  flex-shrink: 0;
}

.pnp-topbar__title {
  flex: 1;
  min-width: 0;
  font-size: 15px;
  font-weight: 500;
  color: var(--pnp-text-main);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pnp-topbar__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.pnp-topbar__status {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--pnp-text-muted);
}

.pnp-topbar__status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--pnp-online);
  box-shadow: 0 0 6px var(--pnp-online-glow);
}

.pnp-topbar__people {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--pnp-navy-light);
  border: 1px solid var(--pnp-navy-border);
  border-radius: var(--pnp-radius-pill);
  padding: 5px 12px;
  font-size: 13px;
  color: var(--pnp-text-muted);
  user-select: none;
}

/* ── MIDDLE ── */
.pnp-middle {
  flex: 1;
  display: flex;
  overflow: hidden;
  min-height: 0;
}

/* ── STAGE ── */
.pnp-stage {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: var(--pnp-black);
  background-image: radial-gradient(
    ellipse 70% 55% at 50% 40%,
    rgba(13,27,46,.90) 0%,
    var(--pnp-black) 100%
  );
  position: relative;
  overflow: hidden;
  min-width: 0;
}

.pnp-stage__main {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  min-height: 0;
}

.pnp-stage__host-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
  max-width: 440px;
  width: 100%;
}

.pnp-stage__avatar {
  width: var(--pnp-avatar-size);
  height: var(--pnp-avatar-size);
  border-radius: 50%;
  background: linear-gradient(135deg, var(--pnp-navy-light), var(--pnp-navy-mid));
  border: 3px solid var(--pnp-gold-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 42px;
  font-weight: 800;
  color: var(--pnp-gold);
  letter-spacing: -2px;
  box-shadow:
    0 0 0 6px var(--pnp-gold-glow-sm),
    0 0 0 12px rgba(201,168,76,.05),
    var(--pnp-shadow-card);
  flex-shrink: 0;
}

.pnp-stage__host-name {
  font-size: 20px;
  font-weight: 600;
  color: var(--pnp-white);
  letter-spacing: 0.01em;
}

.pnp-stage__waiting {
  font-size: 16px;
  color: var(--pnp-text-muted);
  line-height: 1.65;
}

.pnp-stage__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--pnp-gold-glow-sm);
  border: 1px solid rgba(201,168,76,.28);
  border-radius: var(--pnp-radius-pill);
  padding: 8px 20px;
  font-size: 14px;
  font-weight: 500;
  color: var(--pnp-gold-light);
}

.pnp-stage__badge-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--pnp-gold);
  flex-shrink: 0;
}

/* video grid tiles (future WC74+) */
.pnp-stage__grid {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 8px;
  padding: 12px;
  min-height: 0;
  overflow: hidden;
}

.pnp-stage__tile {
  background: var(--pnp-navy-mid);
  border: 1px solid var(--pnp-navy-border);
  border-radius: var(--pnp-radius);
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pnp-stage__tile-label {
  position: absolute;
  bottom: 10px;
  left: 12px;
  font-size: 13px;
  font-weight: 500;
  color: var(--pnp-white);
  background: rgba(8,17,29,.70);
  border-radius: var(--pnp-radius-xs);
  padding: 3px 8px;
  max-width: calc(100% - 24px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── STATUS BAR ── */
.pnp-statusbar {
  background: rgba(13,27,46,.88);
  border-top: 1px solid var(--pnp-navy-border);
  padding: 8px 20px;
  display: flex;
  align-items: center;
  gap: 20px;
  font-size: 13px;
  color: var(--pnp-text-muted);
  flex-shrink: 0;
  flex-wrap: wrap;
}

.pnp-statusbar__item {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.pnp-statusbar__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

.pnp-statusbar__dot--green { background: var(--pnp-online); }
.pnp-statusbar__dot--gold  { background: var(--pnp-gold); }
.pnp-statusbar__dot--grey  { background: #4a6580; }

/* ── RIGHT PANEL ── */
.pnp-panel {
  width: var(--pnp-panel-w);
  min-width: var(--pnp-panel-w);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  background: var(--pnp-navy);
  border-left: 1px solid var(--pnp-navy-border);
  overflow: hidden;
}

.pnp-panel__tabs {
  display: flex;
  border-bottom: 1px solid var(--pnp-navy-border);
  flex-shrink: 0;
}

.pnp-panel__tab {
  flex: 1;
  padding: 14px 6px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--pnp-text-muted);
  font-size: 13px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  transition: color var(--pnp-t-mid), border-color var(--pnp-t-mid);
  letter-spacing: 0.02em;
  white-space: nowrap;
  min-height: 44px;
}

.pnp-panel__tab:hover { color: var(--pnp-text-main); }

.pnp-panel__tab:focus-visible {
  outline: 2px solid var(--pnp-gold);
  outline-offset: -2px;
}

.pnp-panel__tab.is-active {
  color: var(--pnp-gold);
  border-bottom-color: var(--pnp-gold);
}

.pnp-panel__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}

.pnp-panel__pane {
  flex: 1;
  display: none;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}

.pnp-panel__pane.is-visible { display: flex; }

/* ── CHAT ── */
.pnp-chat__messages {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  scroll-behavior: smooth;
  min-height: 0;
}

.pnp-chat__messages::-webkit-scrollbar { width: 4px; }
.pnp-chat__messages::-webkit-scrollbar-track { background: transparent; }
.pnp-chat__messages::-webkit-scrollbar-thumb {
  background: var(--pnp-navy-border);
  border-radius: 2px;
}

.pnp-chat__system {
  text-align: center;
  font-size: 12px;
  color: var(--pnp-text-dim);
  padding: 7px 14px;
  background: rgba(255,255,255,.04);
  border-radius: var(--pnp-radius-sm);
}

.pnp-chat__bubble {
  display: flex;
  flex-direction: column;
  gap: 3px;
  max-width: 92%;
}

.pnp-chat__bubble--own   { align-self: flex-end;   align-items: flex-end; }
.pnp-chat__bubble--other { align-self: flex-start; align-items: flex-start; }

.pnp-chat__bubble-author {
  font-size: 11px;
  font-weight: 600;
  color: var(--pnp-text-muted);
  letter-spacing: 0.03em;
}

.pnp-chat__bubble-text {
  padding: 9px 13px;
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.5;
  word-break: break-word;
}

.pnp-chat__bubble--own .pnp-chat__bubble-text {
  background: var(--pnp-gold-glow-sm);
  border: 1px solid rgba(201,168,76,.22);
  color: var(--pnp-text-main);
  border-bottom-right-radius: 3px;
}

.pnp-chat__bubble--other .pnp-chat__bubble-text {
  background: var(--pnp-navy-light);
  border: 1px solid var(--pnp-navy-border);
  color: var(--pnp-text-main);
  border-bottom-left-radius: 3px;
}

.pnp-chat__bubble-time {
  font-size: 10px;
  color: var(--pnp-text-dim);
}

.pnp-chat__footer {
  flex-shrink: 0;
  padding: 10px 12px;
  border-top: 1px solid var(--pnp-navy-border);
  display: flex;
  gap: 8px;
  align-items: flex-end;
  background: var(--pnp-navy);
}

.pnp-chat__input {
  flex: 1;
  background: var(--pnp-navy-light);
  border: 1px solid var(--pnp-navy-border);
  border-radius: var(--pnp-radius-sm);
  color: var(--pnp-text-main);
  font-size: 15px;
  font-family: inherit;
  padding: 10px 14px;
  resize: none;
  min-height: 44px;
  max-height: 120px;
  outline: none;
  line-height: 1.4;
  transition: border-color var(--pnp-t-mid);
}

.pnp-chat__input::placeholder { color: var(--pnp-text-dim); }
.pnp-chat__input:focus { border-color: var(--pnp-gold-dark); }

.pnp-chat__send {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  background: var(--pnp-gold);
  border: none;
  border-radius: var(--pnp-radius-sm);
  color: var(--pnp-navy);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--pnp-t-mid), transform var(--pnp-t-fast);
  touch-action: manipulation;
}

.pnp-chat__send:hover { background: var(--pnp-gold-light); }
.pnp-chat__send:active { transform: scale(0.93); }

/* ── PEOPLE ── */
.pnp-people__list {
  flex: 1;
  overflow-y: auto;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
}

.pnp-people__count {
  font-size: 12px;
  color: var(--pnp-text-dim);
  padding: 0 2px 6px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pnp-people__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: var(--pnp-navy-light);
  border: 1px solid var(--pnp-navy-border);
  border-radius: var(--pnp-radius-sm);
  transition: background var(--pnp-t-fast), border-color var(--pnp-t-fast);
}

.pnp-people__item:hover {
  background: var(--pnp-navy-lighter);
  border-color: var(--pnp-navy-border-lt);
}

.pnp-people__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--pnp-gold-dark), var(--pnp-gold));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--pnp-navy);
  flex-shrink: 0;
  letter-spacing: -0.5px;
}

.pnp-people__name {
  flex: 1;
  font-size: 14px;
  color: var(--pnp-text-main);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pnp-people__role {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--pnp-gold);
  background: var(--pnp-gold-glow-sm);
  border-radius: var(--pnp-radius-xs);
  padding: 2px 7px;
  flex-shrink: 0;
}

.pnp-people__role--host {
  color: var(--pnp-gold-light);
  background: rgba(201,168,76,.18);
  border: 1px solid rgba(201,168,76,.28);
}

.pnp-people__icons { display: flex; gap: 4px; flex-shrink: 0; }
.pnp-people__icon { font-size: 13px; opacity: 0.55; }
.pnp-people__icon--active { opacity: 1; }

/* ── QUESTIONS ── */
.pnp-questions__list {
  flex: 1;
  overflow-y: auto;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}

.pnp-questions__empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--pnp-text-muted);
  font-size: 15px;
  text-align: center;
  padding: 32px;
}

.pnp-questions__icon {
  font-size: 44px;
  opacity: 0.40;
}

.pnp-questions__item {
  background: var(--pnp-navy-light);
  border: 1px solid var(--pnp-navy-border);
  border-radius: var(--pnp-radius-sm);
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pnp-questions__item-text {
  font-size: 14px;
  color: var(--pnp-text-main);
  line-height: 1.5;
}

.pnp-questions__item-meta { font-size: 12px; color: var(--pnp-text-dim); }

.pnp-questions__item-votes {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--pnp-gold);
}

/* ── BOTTOM BAR ── */
.pnp-bottombar {
  height: var(--pnp-bottom-h);
  min-height: var(--pnp-bottom-h);
  flex-shrink: 0;
  background: var(--pnp-navy);
  border-top: 1px solid var(--pnp-navy-border);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  gap: 4px;
  z-index: 20;
  box-shadow: var(--pnp-shadow-up);
}

/* ── CONTROL BUTTONS ── */
.pnp-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: var(--pnp-btn-min);
  min-height: var(--pnp-btn-min);
  padding: 8px 10px;
  background: none;
  border: none;
  border-radius: var(--pnp-radius-sm);
  color: var(--pnp-text-muted);
  font-size: 11px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  transition: background var(--pnp-t-fast), color var(--pnp-t-fast);
  letter-spacing: 0.02em;
  white-space: nowrap;
  user-select: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.pnp-btn:hover { background: var(--pnp-navy-light); color: var(--pnp-text-main); }

.pnp-btn:focus-visible {
  outline: 2px solid var(--pnp-gold);
  outline-offset: 2px;
}

.pnp-btn:active { background: var(--pnp-navy-lighter); }

.pnp-btn__icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transition: background var(--pnp-t-fast);
}

.pnp-btn.is-active { color: var(--pnp-gold); }
.pnp-btn.is-active .pnp-btn__icon { background: var(--pnp-gold-glow); }

.pnp-btn.is-muted { color: var(--pnp-text-dim); }
.pnp-btn.is-muted .pnp-btn__icon { background: rgba(74,101,128,.25); }

.pnp-btn--leave { color: var(--pnp-danger); }
.pnp-btn--leave .pnp-btn__icon { background: var(--pnp-danger-glow); }
.pnp-btn--leave:hover { background: rgba(192,57,43,.12); color: var(--pnp-danger-h); }
.pnp-btn--leave:hover .pnp-btn__icon { background: rgba(192,57,43,.25); }

/* ── MOBILE OVERLAYS / BOTTOM SHEETS ── */
.pnp-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 200;
  flex-direction: column;
}

.pnp-overlay.is-open { display: flex; }

.pnp-overlay__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.68);
}

.pnp-overlay__sheet {
  margin-top: auto;
  position: relative;
  background: var(--pnp-navy);
  border-radius: 20px 20px 0 0;
  border-top: 1px solid var(--pnp-navy-border);
  display: flex;
  flex-direction: column;
  max-height: 82dvh;
  max-height: 82vh;
  box-shadow: var(--pnp-shadow-sheet);
  overflow: hidden;
}

.pnp-overlay__handle {
  width: 40px;
  height: 4px;
  background: var(--pnp-navy-border);
  border-radius: 2px;
  margin: 12px auto 0;
  flex-shrink: 0;
}

.pnp-overlay__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px 12px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--pnp-navy-border);
}

.pnp-overlay__title { font-size: 17px; font-weight: 600; color: var(--pnp-white); }

.pnp-overlay__close {
  width: 36px;
  height: 36px;
  min-width: 36px;
  background: var(--pnp-navy-light);
  border: none;
  border-radius: 50%;
  color: var(--pnp-text-muted);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  transition: background var(--pnp-t-fast), color var(--pnp-t-fast);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.pnp-overlay__close:hover { background: var(--pnp-navy-lighter); color: var(--pnp-text-main); }

.pnp-overlay__close:focus-visible {
  outline: 2px solid var(--pnp-gold);
  outline-offset: 2px;
}

.pnp-overlay__body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
}

.pnp-overlay__body--chat { padding: 0; gap: 0; }

/* ── MEDIA QUERIES ── */
@media (max-width: 1024px) {
  :root { --pnp-panel-w: 280px; }
}

@media (max-width: 768px) {
  :root {
    --pnp-top-h:       56px;
    --pnp-bottom-h:    76px;
    --pnp-avatar-size: 88px;
  }

  .pnp-topbar { padding: 0 14px; gap: 10px; }
  .pnp-topbar__brand  { display: none; }
  .pnp-topbar__sep    { display: none; }
  .pnp-topbar__people { display: none; }

  .pnp-panel { display: none; }

  .pnp-stage__host-name { font-size: 17px; }
  .pnp-stage__waiting   { font-size: 15px; }
  .pnp-stage__badge     { font-size: 13px; padding: 7px 16px; }

  .pnp-statusbar { padding: 6px 14px; font-size: 12px; gap: 12px; }

  .pnp-bottombar { gap: 2px; padding: 0 4px; }

  .pnp-btn { min-width: 52px; padding: 6px 5px; font-size: 10px; }
  .pnp-btn__icon { width: 38px; height: 38px; font-size: 18px; border-radius: 9px; }

  .pnp-btn--reactions { display: none; }
  .pnp-btn--share     { display: none; }
  .pnp-btn--raise     { display: none; }
}

@media (max-width: 480px) {
  .pnp-btn { min-width: 46px; font-size: 9px; }
  .pnp-btn__icon { width: 34px; height: 34px; font-size: 17px; }
}

@media (max-width: 380px) {
  .pnp-btn--questions { display: none; }
  .pnp-stage__main { padding: 16px; }
}

@media (max-height: 500px) and (orientation: landscape) {
  :root {
    --pnp-top-h:       48px;
    --pnp-bottom-h:    64px;
    --pnp-avatar-size: 64px;
  }

  .pnp-stage__host-card { gap: 12px; }
  .pnp-stage__waiting   { display: none; }
  .pnp-statusbar        { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0.01ms !important;
    animation-duration:  0.01ms !important;
  }
}

@media (prefers-color-scheme: light) {
  html, body { background: var(--pnp-black); color: var(--pnp-text-main); }
}

/* ── UTILITY ── */
.pnp-u-hidden  { display: none !important; }
.pnp-u-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.pnp-u-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════════
   PNP_WEBINAR_WC73J_BIG_ROOM_FONT
   Typografia pokoju — minimum 18px, czytelna dla seniorów
   ═══════════════════════════════════════════════════════════ */

html, body { font-size: 18px; }

.pnp-topbar__title   { font-size: 20px; font-weight: 700; }
.pnp-topbar__people  { font-size: 17px; }

.pnp-stage__host-name { font-size: 28px; }
.pnp-stage__waiting   { font-size: 20px; }
.pnp-stage__badge     { font-size: 16px; }

.pnp-panel__tab  { font-size: 16px; }

.pnp-chat__system      { font-size: 17px; }
.pnp-chat__bubble-text { font-size: 18px; line-height: 1.55; }
.pnp-chat__bubble-author { font-size: 14px; }
.pnp-chat__bubble-time   { font-size: 13px; }
.pnp-chat__input         { font-size: 18px; }
.pnp-chat__send          { font-size: 20px; }

.pnp-questions__empty     { font-size: 18px; line-height: 1.6; }
.pnp-questions__item-text { font-size: 18px; }
.pnp-questions__item-meta { font-size: 14px; }

.pnp-people__name { font-size: 18px; }
.pnp-people__role { font-size: 15px; }

.pnp-btn       { font-size: 13px; }
.pnp-btn__icon { font-size: 24px; width: 52px; height: 52px; }

.pnp-statusbar { font-size: 15px; }

.pnp-overlay__title { font-size: 20px; }
.pnp-overlay__body  { font-size: 18px; }

@media (max-width: 768px) {
  html, body { font-size: 17px; }
  .pnp-stage__host-name  { font-size: 22px; }
  .pnp-stage__waiting    { font-size: 18px; }
  .pnp-chat__bubble-text { font-size: 17px; }
  .pnp-chat__input       { font-size: 17px; }
  .pnp-btn               { font-size: 11px; }
  .pnp-btn__icon         { font-size: 21px; width: 42px; height: 42px; }
}
/* /PNP_WEBINAR_WC73J_BIG_ROOM_FONT */

/* ═══════════════════════════════════════════════════════════
   PNP_WEBINAR_ROOM_SENIOR_BASE_UI
   Classic Conference — jasny, czytelny styl bazowy dla seniorów
   Bez skórek testowych, medalionów i przełącznika trybów (WC74C)
   ═══════════════════════════════════════════════════════════ */

body[data-pnp-room-model="classic-conference"] {
  --pnp-room-bg:           #f4f6f8;
  --pnp-room-surface:        #ffffff;
  --pnp-room-surface-soft:   #eef2f6;
  --pnp-room-text:           #0f172a;
  --pnp-room-text-muted:     #475569;
  --pnp-room-border:         #dbe3ec;
  --pnp-room-accent:         #2563eb;
  --pnp-room-accent-soft:    rgba(37, 99, 235, 0.12);
  --pnp-room-brand-line:     rgba(154, 110, 0, 0.22);
  --pnp-room-danger:         #c0392b;
  --pnp-room-danger-soft:    rgba(192, 57, 43, 0.10);
  --pnp-room-online:         #16a34a;
  --pnp-room-bottom-h:       96px;
  --pnp-room-btn-min-w:      84px;
  --pnp-room-btn-min-h:      76px;
  --pnp-room-icon-size:      34px;
  --pnp-room-font-base:      21px;
  --pnp-room-font-chat:      21px;
  --pnp-room-font-label:     17px;
  background: var(--pnp-room-bg);
  color: var(--pnp-room-text);
  font-size: var(--pnp-room-font-base);
  line-height: 1.45;
}

body[data-pnp-room-model="classic-conference"] .pnp-room {
  background: var(--pnp-room-bg);
  color: var(--pnp-room-text);
}

/* ── Typografia senior ── */
body[data-pnp-room-model="classic-conference"] .pnp-topbar__title {
  font-size: 22px;
  font-weight: 700;
  color: var(--pnp-room-text);
}

body[data-pnp-room-model="classic-conference"] .pnp-topbar__brand {
  color: var(--pnp-room-text);
  font-size: 18px;
}

body[data-pnp-room-model="classic-conference"] .pnp-topbar__people,
body[data-pnp-room-model="classic-conference"] .pnp-topbar__status span {
  font-size: 18px;
  color: var(--pnp-room-text-muted);
}

body[data-pnp-room-model="classic-conference"] .pnp-stage__host-name {
  font-size: clamp(28px, 3vw, 36px);
  font-weight: 700;
  color: var(--pnp-room-text);
}

body[data-pnp-room-model="classic-conference"] .pnp-stage__waiting {
  font-size: 21px;
  color: var(--pnp-room-text-muted);
}

body[data-pnp-room-model="classic-conference"] .pnp-stage__badge {
  font-size: 17px;
  color: var(--pnp-room-text-muted);
}

body[data-pnp-room-model="classic-conference"] .pnp-panel__tab {
  font-size: 18px;
}

body[data-pnp-room-model="classic-conference"] .pnp-chat__bubble-text,
body[data-pnp-room-model="classic-conference"] .pnp-chat__input,
body[data-pnp-room-model="classic-conference"] .pnp-questions__item-text,
body[data-pnp-room-model="classic-conference"] .pnp-questions__empty,
body[data-pnp-room-model="classic-conference"] .pnp-people__name,
body[data-pnp-room-model="classic-conference"] .pnp-overlay__body {
  font-size: var(--pnp-room-font-chat);
  line-height: 1.5;
}

body[data-pnp-room-model="classic-conference"] .pnp-chat__system {
  font-size: 19px;
  color: var(--pnp-room-text-muted);
}

body[data-pnp-room-model="classic-conference"] .pnp-statusbar {
  font-size: 17px;
  color: var(--pnp-room-text-muted);
}

/* ── Topbar ── */
body[data-pnp-room-model="classic-conference"] .pnp-topbar {
  background: var(--pnp-room-surface);
  border-bottom: 1px solid var(--pnp-room-border);
  box-shadow: 0 1px 0 var(--pnp-room-brand-line);
}

body[data-pnp-room-model="classic-conference"] .pnp-topbar__logo-mark {
  background: linear-gradient(135deg, #1e3a5f, #2563eb);
  color: #fff;
  border-radius: 10px;
}

body[data-pnp-room-model="classic-conference"] .pnp-topbar__sep {
  background: var(--pnp-room-border);
}

body[data-pnp-room-model="classic-conference"] .pnp-topbar__status-dot {
  background: var(--pnp-room-online);
}

/* ── Scena ── */
body[data-pnp-room-model="classic-conference"] .pnp-stage {
  background: var(--pnp-room-bg);
}

body[data-pnp-room-model="classic-conference"] .pnp-stage__host-card {
  background: var(--pnp-room-surface);
  border: 1px solid var(--pnp-room-border);
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.06);
}

body[data-pnp-room-model="classic-conference"] .pnp-stage__avatar {
  background: var(--pnp-room-surface-soft);
  color: var(--pnp-room-accent);
  border: 2px solid var(--pnp-room-border);
}

body[data-pnp-room-model="classic-conference"] .pnp-stage__badge-dot {
  background: var(--pnp-room-online);
}

/* ── Prawy panel ── */
body[data-pnp-room-model="classic-conference"] .pnp-panel {
  background: var(--pnp-room-surface);
  border-left: 1px solid var(--pnp-room-border);
  box-shadow: -4px 0 20px rgba(15, 23, 42, 0.04);
}

body[data-pnp-room-model="classic-conference"] .pnp-panel__tab {
  color: var(--pnp-room-text-muted);
  border-bottom: 2px solid transparent;
}

body[data-pnp-room-model="classic-conference"] .pnp-panel__tab.is-active {
  color: var(--pnp-room-accent);
  border-bottom-color: var(--pnp-room-accent);
  background: transparent;
}

body[data-pnp-room-model="classic-conference"] .pnp-chat__input,
body[data-pnp-room-model="classic-conference"] textarea,
body[data-pnp-room-model="classic-conference"] input,
body[data-pnp-room-model="classic-conference"] select {
  background: var(--pnp-room-surface);
  border: 1px solid var(--pnp-room-border);
  color: var(--pnp-room-text);
  border-radius: 12px;
  min-height: 52px;
  padding: 12px 16px;
}

body[data-pnp-room-model="classic-conference"] .pnp-chat__bubble--own .pnp-chat__bubble-text {
  background: var(--pnp-room-accent-soft);
  color: var(--pnp-room-text);
}

body[data-pnp-room-model="classic-conference"] .pnp-chat__bubble--other .pnp-chat__bubble-text {
  background: var(--pnp-room-surface-soft);
  color: var(--pnp-room-text);
}

/* ── Dolny pasek — czysty, bez medalionów ── */
body[data-pnp-room-model="classic-conference"] .pnp-bottombar {
  height: var(--pnp-room-bottom-h);
  min-height: var(--pnp-room-bottom-h);
  background: var(--pnp-room-surface);
  border-top: 1px solid var(--pnp-room-border);
  box-shadow: 0 -4px 18px rgba(15, 23, 42, 0.05);
  gap: 8px;
  padding: 0 16px;
}

body[data-pnp-room-model="classic-conference"] .pnp-btn {
  min-width: var(--pnp-room-btn-min-w);
  min-height: var(--pnp-room-btn-min-h);
  padding: 10px 12px 8px;
  gap: 7px;
  border-radius: 14px;
  background: var(--pnp-room-surface-soft);
  border: 1px solid var(--pnp-room-border);
  color: var(--pnp-room-text);
  font-size: var(--pnp-room-font-label);
  font-weight: 600;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

body[data-pnp-room-model="classic-conference"] .pnp-btn:hover,
body[data-pnp-room-model="classic-conference"] .pnp-btn:focus-visible {
  background: #fff;
  border-color: #c7d2e0;
  color: var(--pnp-room-text);
  outline: 2px solid var(--pnp-room-accent);
  outline-offset: 2px;
}

body[data-pnp-room-model="classic-conference"] .pnp-btn.is-active {
  color: var(--pnp-room-accent);
  border-color: rgba(37, 99, 235, 0.35);
  background: var(--pnp-room-accent-soft);
}

body[data-pnp-room-model="classic-conference"] .pnp-btn.is-muted {
  color: var(--pnp-room-text-muted);
  opacity: 0.85;
}

body[data-pnp-room-model="classic-conference"] .pnp-btn--leave {
  color: var(--pnp-room-danger);
  border-color: rgba(192, 57, 43, 0.22);
  background: var(--pnp-room-danger-soft);
}

body[data-pnp-room-model="classic-conference"] .pnp-btn--leave:hover {
  background: rgba(192, 57, 43, 0.14);
  border-color: rgba(192, 57, 43, 0.35);
  color: #a93226;
}

/* Ikony SVG — liniowe, bez kafelków */
body[data-pnp-room-model="classic-conference"] .pnp-btn__icon,
body[data-pnp-room-model="classic-conference"] .pnp-pro-icon {
  width: auto;
  height: auto;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
  font-size: 0;
}

body[data-pnp-room-model="classic-conference"] .pnp-btn__icon svg,
body[data-pnp-room-model="classic-conference"] .pnp-pro-icon svg {
  width: var(--pnp-room-icon-size);
  height: var(--pnp-room-icon-size);
  display: block;
  stroke: currentColor;
}

/* Mic / Cam — przełączanie SVG przez aria-pressed */
body[data-pnp-room-model="classic-conference"] #pnpBtnMic[aria-pressed="true"] .pnp-svg-off,
body[data-pnp-room-model="classic-conference"] #pnpBtnCam[aria-pressed="true"] .pnp-svg-off {
  display: none;
}

body[data-pnp-room-model="classic-conference"] #pnpBtnMic[aria-pressed="true"] .pnp-svg-on,
body[data-pnp-room-model="classic-conference"] #pnpBtnCam[aria-pressed="true"] .pnp-svg-on {
  display: block;
}

body[data-pnp-room-model="classic-conference"] #pnpBtnMic[aria-pressed="false"] .pnp-svg-on,
body[data-pnp-room-model="classic-conference"] #pnpBtnCam[aria-pressed="false"] .pnp-svg-on {
  display: none;
}

body[data-pnp-room-model="classic-conference"] #pnpBtnMic[aria-pressed="false"] .pnp-svg-off,
body[data-pnp-room-model="classic-conference"] #pnpBtnCam[aria-pressed="false"] .pnp-svg-off {
  display: block;
}

/* ── Mobile overlay ── */
body[data-pnp-room-model="classic-conference"] .pnp-overlay__backdrop {
  background: rgba(15, 23, 42, 0.45);
}

body[data-pnp-room-model="classic-conference"] .pnp-overlay__sheet {
  background: var(--pnp-room-surface);
  border-top: 1px solid var(--pnp-room-border);
  color: var(--pnp-room-text);
}

body[data-pnp-room-model="classic-conference"] .pnp-overlay__title {
  font-size: 22px;
  color: var(--pnp-room-text);
}

/* ── Mobile ── */
@media (max-width: 768px) {
  body[data-pnp-room-model="classic-conference"] {
    --pnp-room-font-base:  19px;
    --pnp-room-font-chat:  20px;
    --pnp-room-font-label: 15px;
    --pnp-room-icon-size:  32px;
    --pnp-room-btn-min-w:  64px;
    --pnp-room-btn-min-h:  60px;
    --pnp-room-bottom-h:   88px;
  }

  body[data-pnp-room-model="classic-conference"] .pnp-bottombar {
    gap: 4px;
    padding: 0 8px;
  }

  body[data-pnp-room-model="classic-conference"] .pnp-btn {
    min-width: var(--pnp-room-btn-min-w);
    min-height: var(--pnp-room-btn-min-h);
    padding: 8px 6px 6px;
    font-size: var(--pnp-room-font-label);
  }

  body[data-pnp-room-model="classic-conference"] .pnp-btn__icon svg,
  body[data-pnp-room-model="classic-conference"] .pnp-pro-icon svg {
    width: 30px;
    height: 30px;
  }
}

/* /PNP_WEBINAR_ROOM_SENIOR_BASE_UI */