:root {
  --s3ql-primary: #163b65;
  --s3ql-secondary: #6d38d8;
  --s3ql-accent: #e13c50;
  --s3ql-bg: #f5f8fc;
  --s3ql-text: #112033;
  --s3ql-muted: #5d6c80;
  --s3ql-border: rgba(22, 59, 101, .14);
  --s3ql-success: #15855a;
  --s3ql-danger: #c83247;
  --s3ql-warning: #b66d08;
  --s3ql-shadow: 0 22px 70px rgba(23, 49, 81, .14);
  --s3ql-radius: 24px;
}

.s3ql-app,
.s3ql-app * { box-sizing: border-box; }
.s3ql-app {
  color: var(--s3ql-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.45;
  text-rendering: optimizeLegibility;
}
.s3ql-app button,
.s3ql-app input,
.s3ql-app select,
.s3ql-app textarea { font: inherit; }
.s3ql-app button { cursor: pointer; }
.s3ql-app img { max-width: 100%; }
.s3ql-app [hidden] { display: none !important; }
.s3ql-app :focus-visible { outline: 3px solid color-mix(in srgb, var(--s3ql-secondary) 70%, white); outline-offset: 3px; }
.s3ql-app .screen-reader-text { clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px; }

body.s3ql-fullscreen { margin: 0 !important; overflow-x: hidden; background: var(--s3ql-bg) !important; }
body.s3ql-fullscreen #wpadminbar,
body.s3ql-fullscreen header:not(.s3ql-live-header),
body.s3ql-fullscreen footer,
body.s3ql-fullscreen .site-header,
body.s3ql-fullscreen .site-footer,
body.s3ql-fullscreen .elementor-location-header,
body.s3ql-fullscreen .elementor-location-footer,
body.s3ql-fullscreen .page-header,
body.s3ql-fullscreen .entry-header { display: none !important; }
body.s3ql-fullscreen .site,
body.s3ql-fullscreen .site-content,
body.s3ql-fullscreen .content-area,
body.s3ql-fullscreen .entry-content,
body.s3ql-fullscreen main,
body.s3ql-fullscreen article { margin: 0 !important; padding: 0 !important; max-width: none !important; width: 100% !important; }
body.s3ql-fullscreen .s3ql-app { min-height: 100vh; }

.s3ql-live-shell {
  min-height: 100vh;
  padding: clamp(16px, 3vw, 44px);
  background:
    radial-gradient(circle at 8% 10%, color-mix(in srgb, var(--s3ql-secondary) 14%, transparent), transparent 35%),
    radial-gradient(circle at 94% 82%, color-mix(in srgb, var(--s3ql-accent) 12%, transparent), transparent 34%),
    linear-gradient(150deg, #fff, var(--s3ql-bg));
  position: relative;
  overflow: hidden;
}
.s3ql-live-shell::before,
.s3ql-live-shell::after {
  content: "";
  position: fixed;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(95px);
  opacity: .13;
  pointer-events: none;
}
.s3ql-live-shell::before { background: var(--s3ql-secondary); top: -230px; left: -170px; }
.s3ql-live-shell::after { background: var(--s3ql-accent); right: -200px; bottom: -250px; }

.s3ql-live-header {
  width: min(1040px, 100%);
  margin: 0 auto 26px;
  display: flex;
  align-items: center;
  gap: 18px;
  position: relative;
  z-index: 2;
}
.s3ql-live-header > img { width: clamp(92px, 15vw, 148px); height: 64px; object-fit: contain; object-position: left center; }
.s3ql-live-header h1 { margin: 2px 0 0; font-size: clamp(1.45rem, 4vw, 2.4rem); line-height: 1.05; color: var(--s3ql-primary); }
.s3ql-eyebrow { display: block; font-size: .72rem; font-weight: 850; letter-spacing: .16em; color: var(--s3ql-secondary); }

.s3ql-live-stage {
  width: min(1040px, 100%);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.s3ql-panel {
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.92);
  border-radius: var(--s3ql-radius);
  box-shadow: var(--s3ql-shadow);
  backdrop-filter: blur(22px);
  padding: clamp(22px, 5vw, 46px);
}
.s3ql-panel--narrow { width: min(620px, 100%); margin-inline: auto; }
.s3ql-panel--center { text-align: center; }
.s3ql-code-access { width: min(620px, 100%); margin: clamp(18px, 4vw, 42px) auto; }
.s3ql-panel h2 { font-size: clamp(1.45rem, 4vw, 2.15rem); line-height: 1.14; margin: 0 0 12px; color: var(--s3ql-primary); }
.s3ql-panel h3 { color: var(--s3ql-primary); }
.s3ql-lead { margin: 0 0 24px; color: var(--s3ql-muted); font-size: 1.05rem; }

.s3ql-form { display: grid; gap: 18px; }
.s3ql-field { display: grid; gap: 8px; text-align: left; }
.s3ql-field > label { font-weight: 750; font-size: .95rem; color: var(--s3ql-primary); }
.s3ql-field input[type="text"],
.s3ql-field input[type="email"],
.s3ql-field input[type="number"],
.s3ql-field input[type="search"],
.s3ql-field select,
.s3ql-field textarea {
  width: 100%;
  min-height: 52px;
  border: 1px solid var(--s3ql-border);
  border-radius: 14px;
  background: #fff;
  padding: 12px 15px;
  color: var(--s3ql-text);
  box-shadow: inset 0 1px 1px rgba(22,59,101,.03);
}
.s3ql-code-input { text-transform: uppercase; letter-spacing: .18em; font-size: 1.35rem !important; text-align: center; font-weight: 850; }
.s3ql-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  text-align: left;
  border-radius: 12px;
  color: var(--s3ql-muted);
}
.s3ql-check input { width: 21px; height: 21px; margin-top: 1px; flex: 0 0 auto; }
.s3ql-check a { color: var(--s3ql-secondary); font-weight: 700; }

.s3ql-button {
  min-height: 52px;
  border: 0;
  border-radius: 15px;
  padding: 12px 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  text-decoration: none;
  font-weight: 820;
  color: #fff;
  background: linear-gradient(135deg, var(--s3ql-primary), var(--s3ql-secondary));
  box-shadow: 0 12px 28px color-mix(in srgb, var(--s3ql-primary) 22%, transparent);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.s3ql-button:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 16px 34px color-mix(in srgb, var(--s3ql-primary) 28%, transparent); }
.s3ql-button:active { transform: translateY(0); }
.s3ql-button:disabled { cursor: not-allowed; opacity: .52; transform: none; filter: grayscale(.25); }
.s3ql-button--secondary { background: #fff; color: var(--s3ql-primary); border: 1px solid var(--s3ql-border); box-shadow: none; }
.s3ql-button--secondary:hover { color: var(--s3ql-primary); background: #f8faff; box-shadow: 0 8px 22px rgba(22,59,101,.1); }
.s3ql-button--danger { background: var(--s3ql-danger); }
.s3ql-button--success { background: var(--s3ql-success); }
.s3ql-button--small { min-height: 42px; padding: 9px 14px; font-size: .9rem; border-radius: 12px; }
.s3ql-button-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.s3ql-button-row--center { justify-content: center; }

.s3ql-avatar-title { margin: 4px 0 10px; color: var(--s3ql-primary); font-weight: 780; text-align: left; }
.s3ql-avatar-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(74px, 1fr));
  gap: 10px;
  max-height: 310px;
  overflow: auto;
  padding: 4px;
}
.s3ql-avatar-option { position: relative; }
.s3ql-avatar-option input { position: absolute; opacity: 0; pointer-events: none; }
.s3ql-avatar-option span {
  min-height: 82px;
  display: grid;
  place-items: center;
  gap: 4px;
  border-radius: 16px;
  border: 2px solid transparent;
  background: #f3f6fb;
  padding: 8px;
  transition: .18s ease;
}
.s3ql-avatar-option img { width: 52px; height: 52px; }
.s3ql-avatar-option small { display: none; }
.s3ql-avatar-option input:checked + span { border-color: var(--s3ql-secondary); background: color-mix(in srgb, var(--s3ql-secondary) 8%, white); transform: translateY(-2px); box-shadow: 0 8px 18px rgba(90,55,190,.13); }
.s3ql-avatar-option input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--s3ql-secondary) 55%, white); outline-offset: 2px; }

.s3ql-identity-card {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin: 15px auto 24px;
  padding: 10px 18px 10px 10px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--s3ql-border);
  box-shadow: 0 8px 20px rgba(22,59,101,.08);
}
.s3ql-identity-card img { width: 55px; height: 55px; }
.s3ql-identity-card strong { display:block; font-size: 1.05rem; }
.s3ql-identity-card small { color: var(--s3ql-muted); }

.s3ql-wait-orbit {
  width: 130px;
  height: 130px;
  margin: 5px auto 25px;
  border-radius: 50%;
  position: relative;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #fff, #e9eff8);
  box-shadow: inset 0 0 0 1px var(--s3ql-border), 0 20px 40px rgba(22,59,101,.11);
}
.s3ql-wait-orbit img { width: 74px; height: 74px; }
.s3ql-wait-orbit::before {
  content: "";
  position: absolute;
  inset: -7px;
  border: 4px solid transparent;
  border-top-color: var(--s3ql-secondary);
  border-right-color: var(--s3ql-accent);
  border-radius: 50%;
  animation: s3ql-spin 2s linear infinite;
}
@keyframes s3ql-spin { to { transform: rotate(360deg); } }

.s3ql-question-shell { display: grid; gap: 18px; }
.s3ql-progress-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; color: var(--s3ql-muted); font-weight: 720; }
.s3ql-progress-track { height: 9px; background: #e8eef6; border-radius: 999px; overflow: hidden; }
.s3ql-progress-track > span { display: block; height: 100%; background: linear-gradient(90deg, var(--s3ql-secondary), var(--s3ql-accent)); transition: width .25s ease; }
.s3ql-question-card-public {
  display: grid;
  gap: 18px;
  background: rgba(255,255,255,.93);
  border: 1px solid rgba(255,255,255,.9);
  border-radius: var(--s3ql-radius);
  padding: clamp(20px, 4vw, 40px);
  box-shadow: var(--s3ql-shadow);
}
.s3ql-question-top { display: flex; align-items: flex-start; gap: 16px; }
.s3ql-question-top > div:first-child { flex: 1; }
.s3ql-question-kicker { color: var(--s3ql-secondary); font-size: .77rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.s3ql-question-card-public h2 { margin: 7px 0 0; color: var(--s3ql-primary); font-size: clamp(1.35rem, 4.2vw, 2.35rem); line-height: 1.18; }
.s3ql-bonus-badge { display: inline-flex; align-items: center; border-radius: 999px; background: #fff1c9; color: #8a5600; font-weight: 850; padding: 7px 11px; white-space: nowrap; }
.s3ql-question-image { max-height: 340px; width: 100%; object-fit: contain; border-radius: 18px; background: #edf2f8; }

.s3ql-timer {
  --progress: 1;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  position: relative;
  flex: 0 0 88px;
  background: conic-gradient(var(--s3ql-secondary) calc(var(--progress) * 1turn), #e6ecf5 0);
}
.s3ql-timer::before { content:""; position:absolute; inset: 8px; border-radius:50%; background:#fff; }
.s3ql-timer strong { z-index:1; font-size:1.55rem; color:var(--s3ql-primary); }
.s3ql-timer.is-warning { background: conic-gradient(var(--s3ql-warning) calc(var(--progress) * 1turn), #f4e9d8 0); }
.s3ql-timer.is-danger { background: conic-gradient(var(--s3ql-danger) calc(var(--progress) * 1turn), #f7e3e7 0); animation: s3ql-pulse .8s ease-in-out infinite alternate; }
@keyframes s3ql-pulse { to { transform: scale(1.045); } }

.s3ql-choices { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }
.s3ql-choice-button {
  min-height: 82px;
  width: 100%;
  border: 2px solid var(--s3ql-border);
  border-radius: 17px;
  padding: 13px 16px;
  display: flex;
  align-items: center;
  gap: 13px;
  text-align: left;
  background: #fff;
  color: var(--s3ql-text);
  font-weight: 750;
  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.s3ql-choice-button:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--s3ql-secondary) 45%, white); box-shadow: 0 10px 22px rgba(22,59,101,.1); }
.s3ql-choice-button.is-selected { border-color: var(--s3ql-secondary); background: color-mix(in srgb, var(--s3ql-secondary) 8%, white); box-shadow: 0 10px 25px color-mix(in srgb, var(--s3ql-secondary) 16%, transparent); }
.s3ql-choice-button.is-correct { border-color: var(--s3ql-success); background: #e9f8f1; }
.s3ql-choice-button.is-wrong { border-color: var(--s3ql-danger); background: #fcedef; }
.s3ql-choice-button:disabled { cursor: default; opacity: 1; }
.s3ql-choice-marker { width: 40px; height: 40px; border-radius: 12px; flex: 0 0 40px; display:grid; place-items:center; background:var(--s3ql-primary); color:#fff; font-weight:900; }
.s3ql-choice-button:nth-child(2) .s3ql-choice-marker { background: var(--s3ql-secondary); }
.s3ql-choice-button:nth-child(3) .s3ql-choice-marker { background: var(--s3ql-accent); }
.s3ql-choice-button:nth-child(4) .s3ql-choice-marker { background: #128b88; }
.s3ql-choice-button:nth-child(5) .s3ql-choice-marker { background: #ad6b09; }
.s3ql-choice-button:nth-child(6) .s3ql-choice-marker { background: #4f6076; }
.s3ql-choice-button img { width: 70px; height: 58px; object-fit: cover; border-radius: 9px; }
.s3ql-choice-button span:last-child { flex: 1; }
.s3ql-answer-entry { display: flex; gap: 10px; }
.s3ql-answer-entry input { flex: 1; min-height: 58px; border: 2px solid var(--s3ql-border); border-radius: 16px; padding: 12px 16px; }

.s3ql-submitted {
  display: grid;
  place-items: center;
  min-height: 250px;
  text-align: center;
}
.s3ql-submitted-icon { width: 92px; height: 92px; border-radius: 50%; display:grid; place-items:center; color:#fff; background:var(--s3ql-success); font-size:3rem; box-shadow:0 16px 38px rgba(21,133,90,.25); margin-bottom:18px; }
.s3ql-submitted h2 { margin:0 0 8px; }
.s3ql-submitted p { color:var(--s3ql-muted); margin:0; }

.s3ql-result-banner { border-radius: 20px; padding: 22px; display:flex; align-items:center; gap:18px; }
.s3ql-result-banner.is-correct { background:#e8f8f0; border:1px solid #a3d8bf; }
.s3ql-result-banner.is-incorrect { background:#fcedef; border:1px solid #e7b3ba; }
.s3ql-result-icon { width:60px; height:60px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:1.75rem; font-weight:900; flex:0 0 60px; }
.is-correct .s3ql-result-icon { background:var(--s3ql-success); }
.is-incorrect .s3ql-result-icon { background:var(--s3ql-danger); }
.s3ql-result-banner strong { display:block; font-size:1.18rem; color:var(--s3ql-primary); }
.s3ql-result-banner small { color:var(--s3ql-muted); }
.s3ql-explanation { border-left:4px solid var(--s3ql-secondary); border-radius:0 14px 14px 0; background:#f3f0ff; padding:16px 18px; }
.s3ql-explanation h3 { margin:0 0 7px; }
.s3ql-explanation p { margin:5px 0; }
.s3ql-source { font-size:.86rem; color:var(--s3ql-muted); word-break:break-word; }
.s3ql-me-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.s3ql-me-stats > div { text-align:center; border:1px solid var(--s3ql-border); background:#fff; border-radius:16px; padding:13px 9px; }
.s3ql-me-stats strong { display:block; font-size:1.35rem; color:var(--s3ql-primary); }
.s3ql-me-stats small { color:var(--s3ql-muted); }

.s3ql-leaderboard { display:grid; gap:9px; }
.s3ql-leader-row { display:grid; grid-template-columns:42px 48px minmax(0,1fr) auto; gap:10px; align-items:center; min-height:64px; background:#fff; border:1px solid var(--s3ql-border); border-radius:16px; padding:8px 14px; }
.s3ql-leader-row.is-me { border-color:var(--s3ql-secondary); background:color-mix(in srgb,var(--s3ql-secondary) 7%,white); }
.s3ql-leader-rank { font-weight:900; color:var(--s3ql-primary); text-align:center; font-size:1.1rem; }
.s3ql-leader-row img { width:44px; height:44px; }
.s3ql-leader-row strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.s3ql-leader-points { color:var(--s3ql-secondary); font-weight:850; white-space:nowrap; }

.s3ql-final { text-align:center; }
.s3ql-final h2 { font-size:clamp(1.7rem,5vw,3rem); }
.s3ql-podium { display:flex; align-items:flex-end; justify-content:center; gap:clamp(8px,2vw,22px); min-height:330px; margin:25px auto; }
.s3ql-podium-place { width:min(180px,31%); display:grid; justify-items:center; position:relative; }
.s3ql-podium-avatar { width:clamp(74px,13vw,118px); height:clamp(74px,13vw,118px); border-radius:50%; background:#fff; padding:8px; border:5px solid #d1d9e4; box-shadow:0 18px 40px rgba(22,59,101,.18); z-index:2; }
.s3ql-podium-place--1 .s3ql-podium-avatar { width:clamp(90px,16vw,142px); height:clamp(90px,16vw,142px); border-color:#f3c948; }
.s3ql-podium-place--2 .s3ql-podium-avatar { border-color:#bfc7d2; }
.s3ql-podium-place--3 .s3ql-podium-avatar { border-color:#d29667; }
.s3ql-podium-place strong { margin:10px 0 3px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.s3ql-podium-place small { color:var(--s3ql-muted); }
.s3ql-podium-block { width:100%; border-radius:18px 18px 5px 5px; margin-top:10px; display:grid; place-items:center; color:#fff; font-size:2rem; font-weight:900; background:linear-gradient(160deg,var(--s3ql-primary),var(--s3ql-secondary)); }
.s3ql-podium-place--1 .s3ql-podium-block { height:150px; background:linear-gradient(160deg,#f0b71d,#cf8a0b); }
.s3ql-podium-place--2 .s3ql-podium-block { height:110px; background:linear-gradient(160deg,#8795a8,#5d6d83); }
.s3ql-podium-place--3 .s3ql-podium-block { height:82px; background:linear-gradient(160deg,#be7950,#8d5332); }
.s3ql-winner-gif { max-height:220px; width:auto; border-radius:20px; margin:0 auto 20px; box-shadow:0 18px 50px rgba(22,59,101,.2); }
.s3ql-email-result { margin-top:26px; text-align:left; border-top:1px solid var(--s3ql-border); padding-top:24px; }
.s3ql-email-result h3 { margin:0 0 8px; }
.s3ql-email-result p { color:var(--s3ql-muted); }

.s3ql-message { border-radius:14px; padding:14px 16px; border:1px solid var(--s3ql-border); background:#fff; }
.s3ql-message--error { color:#8f2030; background:#fcedef; border-color:#e7b3ba; }
.s3ql-message--success { color:#126842; background:#e9f8f1; border-color:#a3d8bf; }
.s3ql-toast { position:fixed; left:50%; bottom:24px; transform:translateX(-50%); z-index:999999; max-width:min(90vw,620px); background:#112033; color:#fff; border-radius:14px; padding:12px 18px; box-shadow:0 18px 45px rgba(0,0,0,.25); font-weight:700; }
.s3ql-loading { min-height:240px; display:flex; align-items:center; justify-content:center; gap:12px; color:var(--s3ql-muted); }
.s3ql-spinner { width:27px; height:27px; border-radius:50%; border:3px solid #dce4ef; border-top-color:var(--s3ql-secondary); animation:s3ql-spin .8s linear infinite; }

/* Host */
.s3ql-host-app {
  min-height:100vh;
  background:var(--s3ql-bg);
}
.s3ql-host-toolbar { min-height:74px; padding:10px clamp(14px,3vw,34px); background:#fff; border-bottom:1px solid var(--s3ql-border); display:flex; align-items:center; justify-content:space-between; gap:16px; position:sticky; top:0; z-index:50; }
.admin-bar .s3ql-host-toolbar { top:32px; }
.s3ql-brand-mini { display:flex; align-items:center; gap:11px; color:var(--s3ql-primary); }
.s3ql-brand-mini img { width:100px; height:44px; object-fit:contain; }
.s3ql-host-toolbar__actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.s3ql-host-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,360px); min-height:calc(100vh - 74px); }
.s3ql-host-main { padding:clamp(16px,3vw,38px); min-width:0; }
.s3ql-host-side { padding:clamp(16px,2vw,26px); background:#fff; border-left:1px solid var(--s3ql-border); min-width:0; }
.s3ql-host-panel { background:#fff; border:1px solid var(--s3ql-border); border-radius:22px; padding:clamp(18px,3vw,34px); box-shadow:0 14px 45px rgba(22,59,101,.1); }
.s3ql-host-panel h1 { margin:0; color:var(--s3ql-primary); font-size:clamp(1.65rem,3.2vw,2.65rem); line-height:1.15; }
.s3ql-host-panel h2 { color:var(--s3ql-primary); }
.s3ql-session-code-hero { font-size:clamp(2.6rem,8vw,6rem); letter-spacing:.13em; line-height:1; font-weight:950; color:var(--s3ql-primary); margin:16px 0; }
.s3ql-lobby-grid { display:grid; grid-template-columns:minmax(220px,320px) minmax(0,1fr); gap:24px; align-items:start; }
.s3ql-qr-card { background:#fff; border:1px solid var(--s3ql-border); border-radius:20px; padding:18px; text-align:center; }
.s3ql-qr-card svg { width:100%; height:auto; display:block; }
.s3ql-join-url { font-size:.8rem; color:var(--s3ql-muted); word-break:break-all; margin-top:10px; }
.s3ql-participant-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:10px; }
.s3ql-participant-card { position:relative; display:grid; justify-items:center; gap:5px; text-align:center; border:1px solid var(--s3ql-border); border-radius:16px; padding:12px 8px; background:#f8faff; }
.s3ql-participant-card.is-offline { opacity:.55; filter:grayscale(.7); }
.s3ql-participant-card img { width:58px; height:58px; }
.s3ql-participant-card strong { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.s3ql-participant-card small { color:var(--s3ql-muted); }
.s3ql-participant-menu { position:absolute; right:4px; top:4px; border:0; border-radius:10px; width:32px; height:32px; background:#fff; color:var(--s3ql-muted); }
.s3ql-host-side h3 { margin:0 0 12px; color:var(--s3ql-primary); }
.s3ql-side-metric { display:flex; justify-content:space-between; align-items:center; padding:11px 0; border-bottom:1px solid var(--s3ql-border); }
.s3ql-side-metric strong { font-size:1.15rem; color:var(--s3ql-primary); }
.s3ql-host-question-image { max-height:320px; width:100%; object-fit:contain; border-radius:18px; background:#edf2f8; margin:18px 0; }
.s3ql-host-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:20px; }
.s3ql-host-choice { display:grid; grid-template-columns:42px 1fr auto; gap:11px; align-items:center; min-height:74px; border:2px solid var(--s3ql-border); border-radius:16px; padding:12px; background:#fff; }
.s3ql-host-choice.is-correct { border-color:var(--s3ql-success); background:#e9f8f1; }
.s3ql-host-choice-count { font-size:1.25rem; font-weight:900; color:var(--s3ql-primary); }
.s3ql-distribution-bar { height:8px; border-radius:999px; background:#e5ebf3; overflow:hidden; grid-column:2 / -1; }
.s3ql-distribution-bar span { display:block; height:100%; background:var(--s3ql-secondary); }
.s3ql-host-counter { display:flex; align-items:center; justify-content:center; gap:20px; padding:16px; margin-top:20px; border-radius:18px; background:#f1f5fb; }
.s3ql-host-counter strong { font-size:2rem; color:var(--s3ql-primary); }
.s3ql-host-countdown-overlay { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; z-index:4; }
.s3ql-host-countdown-overlay strong { width:130px; height:130px; border-radius:50%; display:grid; place-items:center; color:#fff; background:var(--s3ql-secondary); font-size:4rem; box-shadow:0 22px 60px rgba(92,55,201,.35); }

/* Projection */
.s3ql-screen-app { min-height:100vh; background:linear-gradient(145deg,#f8fbff,var(--s3ql-bg)); }
.s3ql-screen-stage { min-height:100vh; padding:clamp(22px,4vw,60px); display:grid; align-content:center; }
.s3ql-screen-card { width:min(1500px,100%); margin:auto; background:rgba(255,255,255,.94); border:1px solid rgba(255,255,255,.9); border-radius:clamp(22px,3vw,40px); padding:clamp(25px,4vw,64px); box-shadow:0 28px 90px rgba(22,59,101,.17); }
.s3ql-screen-header { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:25px; }
.s3ql-screen-logo { width:clamp(130px,14vw,230px); }
.s3ql-screen-code { display:flex; align-items:center; gap:14px; color:var(--s3ql-muted); font-size:clamp(1rem,1.5vw,1.4rem); }
.s3ql-screen-code strong { font-size:clamp(1.6rem,3vw,3rem); letter-spacing:.12em; color:var(--s3ql-primary); }
.s3ql-screen-lobby { display:grid; grid-template-columns:minmax(260px,430px) minmax(0,1fr); gap:clamp(25px,5vw,70px); align-items:center; }
.s3ql-screen-qr svg { width:100%; height:auto; }
.s3ql-screen-lobby h1 { font-size:clamp(2.3rem,5vw,5rem); line-height:1.03; margin:0 0 18px; color:var(--s3ql-primary); }
.s3ql-screen-lobby p { font-size:clamp(1.1rem,2vw,1.7rem); color:var(--s3ql-muted); }
.s3ql-screen-participants { display:flex; flex-wrap:wrap; gap:10px; margin-top:25px; }
.s3ql-screen-participant { display:flex; align-items:center; gap:8px; border:1px solid var(--s3ql-border); background:#fff; border-radius:999px; padding:7px 14px 7px 7px; font-weight:750; }
.s3ql-screen-participant img { width:40px; height:40px; }
.s3ql-screen-question { display:grid; gap:22px; }
.s3ql-screen-question-top { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:25px; align-items:start; }
.s3ql-screen-question h1 { margin:5px 0 0; font-size:clamp(2rem,4.3vw,4.7rem); line-height:1.08; color:var(--s3ql-primary); }
.s3ql-screen-question .s3ql-timer { width:clamp(105px,11vw,160px); height:clamp(105px,11vw,160px); flex-basis:auto; }
.s3ql-screen-question .s3ql-timer strong { font-size:clamp(2rem,4vw,3.7rem); }
.s3ql-screen-question-image { max-height:40vh; width:100%; object-fit:contain; border-radius:24px; background:#edf2f8; }
.s3ql-screen-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.s3ql-screen-choice { min-height:100px; border-radius:20px; border:3px solid var(--s3ql-border); padding:16px 20px; display:grid; grid-template-columns:55px minmax(0,1fr) auto; gap:16px; align-items:center; font-size:clamp(1rem,1.6vw,1.55rem); font-weight:780; background:#fff; }
.s3ql-screen-choice.is-correct { border-color:var(--s3ql-success); background:#e9f8f1; }
.s3ql-screen-choice.is-wrong { opacity:.62; }
.s3ql-screen-choice .s3ql-choice-marker { width:50px; height:50px; font-size:1.3rem; }
.s3ql-screen-choice-count { font-size:clamp(1.25rem,2vw,2.1rem); font-weight:900; color:var(--s3ql-primary); }
.s3ql-screen-leaderboard .s3ql-leader-row { min-height:82px; grid-template-columns:65px 65px minmax(0,1fr) auto; font-size:clamp(1.1rem,2vw,1.8rem); }
.s3ql-screen-leaderboard .s3ql-leader-row img { width:60px; height:60px; }
.s3ql-screen-final h1 { text-align:center; font-size:clamp(2.4rem,5.5vw,5.5rem); color:var(--s3ql-primary); margin:0; }
.s3ql-screen-final .s3ql-podium { min-height:43vh; }
.s3ql-screen-final .s3ql-podium-place strong { font-size:clamp(1rem,2vw,1.8rem); }
.s3ql-screen-final .s3ql-podium-place small { font-size:clamp(.85rem,1.4vw,1.3rem); }
.s3ql-confetti-canvas { position:fixed; inset:0; z-index:999998; pointer-events:none; }

@media (max-width: 980px) {
  .s3ql-host-layout { grid-template-columns:1fr; }
  .s3ql-host-side { border-left:0; border-top:1px solid var(--s3ql-border); }
  .s3ql-lobby-grid { grid-template-columns:1fr; }
  .s3ql-qr-card { max-width:320px; margin:auto; }
  .s3ql-screen-lobby { grid-template-columns: minmax(190px,300px) 1fr; }
}
@media (max-width: 700px) {
  .s3ql-live-shell { padding:14px; }
  .s3ql-live-header { margin-bottom:14px; }
  .s3ql-live-header > img { width:90px; }
  .s3ql-choices,
  .s3ql-host-choice-grid,
  .s3ql-screen-choices { grid-template-columns:1fr; }
  .s3ql-question-top { display:grid; grid-template-columns:1fr auto; }
  .s3ql-question-top > div:first-child { grid-column:1 / -1; }
  .s3ql-timer { width:74px; height:74px; flex-basis:74px; }
  .s3ql-me-stats { grid-template-columns:1fr 1fr; }
  .s3ql-host-toolbar { align-items:flex-start; }
  .s3ql-brand-mini strong { display:none; }
  .s3ql-host-toolbar__actions { gap:5px; }
  .s3ql-host-toolbar__actions .s3ql-button { min-height:40px; padding:8px 10px; font-size:.79rem; }
  .s3ql-screen-stage { padding:12px; }
  .s3ql-screen-card { padding:20px; }
  .s3ql-screen-lobby { grid-template-columns:1fr; text-align:center; }
  .s3ql-screen-qr { max-width:240px; margin:auto; }
  .s3ql-screen-header { align-items:flex-start; }
  .s3ql-screen-logo { width:110px; }
  .s3ql-screen-question-top { grid-template-columns:1fr; }
  .s3ql-screen-question .s3ql-timer { width:90px; height:90px; }
  .s3ql-podium { min-height:270px; }
  .s3ql-podium-place--1 .s3ql-podium-block { height:115px; }
  .s3ql-podium-place--2 .s3ql-podium-block { height:85px; }
  .s3ql-podium-place--3 .s3ql-podium-block { height:65px; }
}
@media (max-width: 480px) {
  .s3ql-panel { padding:20px 16px; border-radius:20px; }
  .s3ql-avatar-grid { grid-template-columns:repeat(4,1fr); }
  .s3ql-avatar-option span { min-height:65px; padding:5px; }
  .s3ql-avatar-option img { width:43px; height:43px; }
  .s3ql-choice-button { min-height:68px; padding:10px; }
  .s3ql-leader-row { grid-template-columns:32px 40px minmax(0,1fr) auto; padding:7px; }
  .s3ql-leader-row img { width:38px; height:38px; }
  .s3ql-podium { gap:4px; }
}

@media (prefers-reduced-motion: reduce) {
  .s3ql-app *, .s3ql-app *::before, .s3ql-app *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; }
}

/* Live controls and final celebration */
.s3ql-participant-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:7px; font-size:.73rem; }
.s3ql-participant-actions button { border:0; background:none; cursor:pointer; padding:2px; }
.s3ql-side-actions { margin-top:20px; }
.s3ql-side-winner { margin-top:24px; }
.s3ql-screen-controls { position:fixed; top:12px; right:12px; z-index:9999; display:flex; gap:7px; }
.s3ql-screen-control { border:1px solid rgba(22,59,101,.18); background:rgba(255,255,255,.92); color:var(--s3ql-primary); border-radius:999px; padding:8px 13px; font-weight:750; cursor:pointer; box-shadow:0 6px 20px rgba(22,59,101,.12); }
.s3ql-screen-control[aria-pressed="true"] { background:var(--s3ql-primary); color:#fff; }
.s3ql-score-ring { width:130px; height:130px; border-radius:50%; display:grid; place-items:center; align-content:center; background:#e9f8f1; color:var(--s3ql-success); text-align:center; flex:none; }
.s3ql-score-ring strong { font-size:2rem; }
.s3ql-score-ring small { display:block; }
.s3ql-screen-title { color:var(--s3ql-primary); font-size:clamp(2rem,4vw,4.5rem); margin:8px 0 24px; }
.s3ql-screen-message { text-align:center; padding:8vh 3vw; }
.s3ql-screen-message h1 { color:var(--s3ql-primary); font-size:clamp(2.4rem,5vw,5.5rem); }
.s3ql-screen-message p { font-size:clamp(1.2rem,2vw,2rem); color:var(--s3ql-muted); }
.s3ql-screen-final-actions { display:flex; justify-content:center; margin:10px 0 24px; }
.s3ql-winner-celebration { position:fixed; inset:0; z-index:999997; display:grid; place-items:center; background:rgba(15,26,42,.55); backdrop-filter:blur(6px); }
.s3ql-winner-celebration[hidden] { display:none; }
.s3ql-winner-celebration > div { width:min(720px,88vw); background:#fff; border-radius:32px; padding:clamp(25px,5vw,55px); display:grid; justify-items:center; text-align:center; box-shadow:0 35px 100px rgba(0,0,0,.32); }
.s3ql-winner-celebration img { max-width:min(430px,70vw); max-height:42vh; object-fit:contain; }
.s3ql-winner-celebration strong { color:var(--s3ql-primary); font-size:clamp(2rem,5vw,5rem); line-height:1.05; }
.s3ql-winner-celebration small { color:var(--s3ql-secondary); font-size:clamp(1.1rem,2vw,2rem); font-weight:850; margin-top:8px; }
.s3ql-screen-choice img,.s3ql-host-choice img { width:70px; height:58px; object-fit:cover; border-radius:11px; }
.s3ql-choice-button img { width:68px; height:58px; object-fit:cover; border-radius:10px; }
.s3ql-app.is-busy { cursor:progress; }
.s3ql-app.is-busy button { pointer-events:none; opacity:.72; }
@media(max-width:700px){.s3ql-screen-controls{top:5px;right:5px}.s3ql-screen-control{font-size:.72rem;padding:6px 9px}.s3ql-score-ring{width:100px;height:100px}.s3ql-score-ring strong{font-size:1.45rem}}

.s3ql-choice-image {
  width: 72px;
  height: 54px;
  object-fit: cover;
  border-radius: 10px;
  flex: 0 0 auto;
  background: rgba(255,255,255,.75);
}
.s3ql-screen-choice .s3ql-choice-image { width: clamp(72px, 8vw, 132px); height: clamp(54px, 6vw, 96px); }
@media (max-width: 680px) {
  .s3ql-choice-image { width: 58px; height: 44px; }
}

/* -------------------------------------------------------------------------
 * v1.2.0 - protection contre les débordements de textes, codes et URL
 * ---------------------------------------------------------------------- */
.s3ql-live-shell,
.s3ql-live-header,
.s3ql-live-stage,
.s3ql-panel,
.s3ql-question-shell,
.s3ql-question-card-public,
.s3ql-question-top,
.s3ql-host-app,
.s3ql-host-layout,
.s3ql-host-main,
.s3ql-host-side,
.s3ql-host-stage,
.s3ql-host-panel,
.s3ql-host-toolbar,
.s3ql-host-toolbar__actions,
.s3ql-host-choice-grid,
.s3ql-host-choice,
.s3ql-screen-app,
.s3ql-screen-stage,
.s3ql-screen-card,
.s3ql-screen-header,
.s3ql-screen-question,
.s3ql-screen-question-top,
.s3ql-screen-choices,
.s3ql-screen-choice,
.s3ql-choices,
.s3ql-choice-button,
.s3ql-lobby-grid,
.s3ql-participant-card,
.s3ql-participant-grid,
.s3ql-leaderboard,
.s3ql-leader-row,
.s3ql-podium,
.s3ql-podium-place,
.s3ql-result-banner,
.s3ql-result-email,
.s3ql-identity-card,
.s3ql-qr-card,
.s3ql-message,
.s3ql-callout {
  min-width: 0;
  max-width: 100%;
}

.s3ql-app h1,
.s3ql-app h2,
.s3ql-app h3,
.s3ql-app h4,
.s3ql-app p,
.s3ql-app li,
.s3ql-app label,
.s3ql-app small,
.s3ql-app strong,
.s3ql-app span,
.s3ql-app code,
.s3ql-app pre,
.s3ql-app a,
.s3ql-app button,
.s3ql-app input,
.s3ql-app textarea,
.s3ql-join-url,
.s3ql-session-code-hero,
.s3ql-screen-code,
.s3ql-screen-code strong,
.s3ql-code,
.s3ql-message,
.s3ql-choice-button,
.s3ql-host-choice,
.s3ql-screen-choice,
.s3ql-leader-row,
.s3ql-podium-place,
.s3ql-person,
.s3ql-participant-name,
.s3ql-question-card-public h2,
.s3ql-screen-question h1,
.s3ql-screen-question h2,
.s3ql-host-stage h1,
.s3ql-host-stage h2 {
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

.s3ql-app pre,
.s3ql-app code,
.s3ql-join-url,
.s3ql-session-code-hero,
.s3ql-screen-code {
  white-space: normal;
}

.s3ql-app pre {
  overflow-x: auto;
}

.s3ql-live-header > *,
.s3ql-question-top > *,
.s3ql-screen-question-top > *,
.s3ql-host-toolbar > *,
.s3ql-host-layout > *,
.s3ql-screen-header > *,
.s3ql-leader-row > *,
.s3ql-participant-card > * {
  min-width: 0;
}

.s3ql-join-url,
.s3ql-session-code-hero,
.s3ql-screen-code,
.s3ql-code {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
}

.s3ql-choice-button,
.s3ql-host-choice,
.s3ql-screen-choice {
  white-space: normal;
  text-align: left;
}

.s3ql-choice-button > *,
.s3ql-host-choice > *,
.s3ql-screen-choice > * {
  min-width: 0;
}

.s3ql-app img,
.s3ql-app video,
.s3ql-app canvas,
.s3ql-app svg {
  max-width: 100%;
}

@media (max-width: 700px) {
  .s3ql-live-header,
  .s3ql-question-top,
  .s3ql-screen-question-top,
  .s3ql-host-toolbar,
  .s3ql-screen-header {
    flex-wrap: wrap;
  }

  .s3ql-session-code-hero,
  .s3ql-screen-code {
    font-size: clamp(1.35rem, 11vw, 3.25rem);
    letter-spacing: .08em;
  }
}

/* 1.3.0 — modes de jeu, médias enrichis, équipes et commandes de projection. */
.s3ql-session-preview{margin:0 0 1rem;padding:1rem;border:1px solid color-mix(in srgb,var(--s3ql-primary) 22%,#dce2ee);border-radius:14px;background:color-mix(in srgb,var(--s3ql-primary) 5%,#fff);min-width:0}
.s3ql-session-preview h3{margin:.45rem 0 .25rem;overflow-wrap:anywhere}.s3ql-session-preview p{margin:0;color:#596579}
.s3ql-mode-badge{display:inline-flex;padding:.3rem .65rem;border-radius:999px;background:var(--s3ql-primary);color:#fff;font-size:.75rem;font-weight:850;text-transform:uppercase;letter-spacing:.05em}
.s3ql-code-check{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.6rem}.s3ql-code-check .s3ql-button{white-space:nowrap}
.s3ql-team-picker{margin:1rem 0;padding:0;border:0;min-width:0}.s3ql-team-picker legend{font-weight:850;margin-bottom:.7rem}.s3ql-team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.65rem}
.s3ql-team-option{position:relative;display:block}.s3ql-team-option input{position:absolute;opacity:0}.s3ql-team-option span{display:block;padding:.8rem 1rem;border:2px solid #d8deea;border-radius:12px;background:#fff;text-align:center;font-weight:800;cursor:pointer;overflow-wrap:anywhere}.s3ql-team-option input:checked+span{border-color:var(--s3ql-primary);background:color-mix(in srgb,var(--s3ql-primary) 9%,#fff);box-shadow:0 0 0 3px color-mix(in srgb,var(--s3ql-primary) 12%,transparent)}
.s3ql-team-name{display:block;color:var(--s3ql-primary)!important;font-weight:800!important}.s3ql-team-avatar{display:grid!important;place-items:center;flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--s3ql-primary),var(--s3ql-secondary));color:#fff;font-weight:950;font-size:1.1rem}
.s3ql-question-media,.s3ql-host-question-media,.s3ql-screen-question-image{display:block;width:min(100%,850px);max-width:100%;max-height:min(54vh,520px);height:auto;margin:1rem auto;border:1px solid #d9dfeb;border-radius:16px;background:#fff;object-fit:contain}
video.s3ql-question-media,video.s3ql-host-question-media,video.s3ql-screen-question-image{background:#111}
.s3ql-question-audio,.s3ql-screen-question-audio{display:block;width:min(100%,760px);max-width:100%;margin:1rem auto}
.s3ql-choice-copy{display:grid;gap:.35rem;min-width:0;text-align:left}.s3ql-choice-copy img,.s3ql-host-choice img,.s3ql-screen-choice-copy img{display:block;max-width:min(100%,240px);max-height:145px;object-fit:contain;border-radius:8px;background:#fff}
.s3ql-choice-button.is-correct{border-color:#16814d!important;background:#eaf8f1!important}.s3ql-choice-button.is-wrong{border-color:#bd3026!important;background:#fff0ee!important}
.s3ql-answer-confirm{text-align:center;padding:2rem 1rem}.s3ql-answer-confirm .dashicons{font-size:3rem;width:3rem;height:3rem;color:#16814d}.s3ql-answer-progress{text-align:center;color:#68748a}
.s3ql-result-banner{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem 1.2rem;margin:1rem 0;border-radius:14px;font-weight:850}.s3ql-result-banner.is-correct{background:#eaf8f1;color:#10643b;border:1px solid #a5d8bd}.s3ql-result-banner.is-wrong{background:#fff0ee;color:#8e241d;border:1px solid #edb2ad}
.s3ql-correction-summary{margin:1rem 0;padding:1rem 1.1rem;border-left:5px solid var(--s3ql-primary);border-radius:12px;background:#f7f8fc;overflow-wrap:anywhere}.s3ql-correction-summary p{margin:.45rem 0}
.s3ql-final-score{display:grid;place-items:center;margin:1.2rem auto;padding:1.3rem;width:min(100%,320px);border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--s3ql-primary) 10%,#fff),#fff);border:1px solid color-mix(in srgb,var(--s3ql-primary) 25%,#ddd)}.s3ql-final-score strong{font-size:2.5rem;color:var(--s3ql-primary)}.s3ql-final-score span{text-transform:uppercase;font-size:.75rem;font-weight:850}.s3ql-final-score small{margin-top:.45rem;color:#647087}
.s3ql-identity-card>b{margin-left:auto;color:var(--s3ql-primary);white-space:nowrap}.s3ql-leader-row strong small{display:block;color:#6d7788;font-size:.72rem;font-weight:650}
.s3ql-host-join-grid{display:grid;grid-template-columns:minmax(250px,420px) minmax(0,1fr);gap:2rem;align-items:center}.s3ql-copy-field{width:100%;max-width:100%;padding:.75rem;border:1px solid #cdd5e2;border-radius:10px;overflow-wrap:anywhere}.s3ql-code-display{font-size:clamp(2.7rem,7vw,6rem);font-weight:950;letter-spacing:.12em;color:var(--s3ql-primary);overflow-wrap:anywhere}
.s3ql-host-question-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem;align-items:start}.s3ql-host-question-head h1{overflow-wrap:anywhere}.s3ql-host-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.s3ql-host-choice{display:grid;grid-template-columns:42px minmax(0,1fr);gap:.75rem;padding:1rem;border:1px solid #dce2ec;border-radius:14px;background:#fff;min-width:0}.s3ql-host-choice.is-correct{border-color:#54ae7f;background:#eaf8f1}.s3ql-host-choice strong{display:block;overflow-wrap:anywhere}.s3ql-host-choice small{display:block;margin-top:.4rem;color:#657085}.s3ql-distribution-bar{height:7px;margin-top:.45rem;border-radius:999px;background:#e6e9f0;overflow:hidden}.s3ql-distribution-bar span{display:block;height:100%;background:var(--s3ql-primary);border-radius:inherit}
.s3ql-roster-row>span:nth-of-type(2){min-width:0}.s3ql-roster-row strong,.s3ql-roster-row small{display:block;overflow-wrap:anywhere}.s3ql-roster-actions{display:flex;gap:.25rem;margin-left:auto}.s3ql-roster-actions button{width:30px;height:30px;border:1px solid #d7dde7;border-radius:8px;background:#fff;cursor:pointer}
.s3ql-screen-app--managed{padding-top:62px}.s3ql-screen-controls{position:fixed;top:0;left:0;right:0;z-index:10000;display:flex;align-items:center;gap:.45rem;min-width:0;padding:.55rem .75rem;background:rgba(15,20,43,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.18);overflow-x:auto;color:#fff;box-shadow:0 7px 24px rgba(0,0,0,.25)}
.s3ql-screen-control-brand{font-weight:900;white-space:nowrap;margin-right:.35rem}.s3ql-screen-control{flex:0 0 auto;border:1px solid rgba(255,255,255,.35);border-radius:9px;padding:.55rem .75rem;background:rgba(255,255,255,.1);color:#fff;font-weight:800;cursor:pointer}.s3ql-screen-control:hover{background:rgba(255,255,255,.2)}.s3ql-screen-control.is-primary{background:#fff;color:#17155d}.s3ql-screen-control.is-danger{border-color:#ff9fa8;color:#ffdadd}.s3ql-screen-control:disabled{opacity:.45;cursor:wait}
.s3ql-screen-question video,.s3ql-screen-question audio{max-width:100%}.s3ql-screen-choice{min-width:0}.s3ql-screen-choice-copy{min-width:0}.s3ql-screen-choice strong{overflow-wrap:anywhere}.s3ql-hidden-winner-media{position:fixed!important;width:1px!important;height:1px!important;opacity:.001!important;pointer-events:none!important;left:-10px!important;bottom:-10px!important}
.s3ql-podium-avatar.s3ql-team-avatar{width:86px;height:86px;margin:auto;font-size:2rem}
@media(max-width:900px){.s3ql-host-join-grid{grid-template-columns:1fr}.s3ql-host-choices{grid-template-columns:1fr}.s3ql-host-question-head{grid-template-columns:1fr}.s3ql-code-check{grid-template-columns:1fr}.s3ql-code-check .s3ql-button{width:100%}}
@media(max-width:620px){.s3ql-screen-app--managed{padding-top:54px}.s3ql-screen-controls{padding:.4rem}.s3ql-screen-control{padding:.45rem .6rem;font-size:.78rem}.s3ql-screen-control-brand{display:none}.s3ql-team-grid{grid-template-columns:1fr 1fr}.s3ql-identity-card>b{width:100%;margin:.4rem 0 0;text-align:center}}

/* 1.6.0 — GIF et musique MP3 avant la première question. */
.s3ql-intro-card{text-align:center;overflow:hidden}
.s3ql-intro-card h1,.s3ql-intro-card h2,.s3ql-screen-intro h1{margin:.45rem 0 1rem;overflow-wrap:anywhere}
.s3ql-intro-visual{display:grid;place-items:center;width:min(100%,760px);min-height:220px;margin:1rem auto;padding:1rem;border:1px solid color-mix(in srgb,var(--s3ql-primary) 20%,#dce2ee);border-radius:22px;background:radial-gradient(circle at 50% 30%,#fff 0%,color-mix(in srgb,var(--s3ql-primary) 8%,#fff) 65%,color-mix(in srgb,var(--s3ql-secondary) 10%,#fff) 100%);box-shadow:0 18px 44px rgba(25,28,72,.11);overflow:hidden}
.s3ql-intro-gif{display:block;width:auto;max-width:100%;height:auto;max-height:min(48vh,440px);margin:auto;object-fit:contain;border-radius:16px}
.s3ql-intro-brand{display:grid;place-items:center;width:min(72vw,300px);aspect-ratio:1;border-radius:50%;background:linear-gradient(135deg,var(--s3ql-primary),var(--s3ql-secondary));color:#fff;font-size:clamp(2.2rem,8vw,5rem);font-weight:950;letter-spacing:.06em;box-shadow:0 16px 40px color-mix(in srgb,var(--s3ql-primary) 28%,transparent)}
.s3ql-intro-countdown{display:grid;place-items:center;gap:.15rem;width:min(100%,300px);margin:1rem auto;padding:1rem 1.2rem;border-radius:18px;background:color-mix(in srgb,var(--s3ql-primary) 7%,#fff);border:1px solid color-mix(in srgb,var(--s3ql-primary) 22%,#dce2ee)}
.s3ql-intro-countdown strong{font-size:clamp(2.3rem,7vw,4.8rem);line-height:1;color:var(--s3ql-primary);font-variant-numeric:tabular-nums}
.s3ql-intro-countdown span{color:#657085;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.s3ql-screen-card--intro{display:grid;place-items:center;text-align:center}
.s3ql-screen-intro{width:min(100%,1050px);margin:auto}
.s3ql-screen-intro .s3ql-intro-visual{width:min(100%,900px);min-height:min(45vh,430px)}
.s3ql-screen-intro .s3ql-intro-gif{max-height:min(52vh,520px)}
.s3ql-screen-intro-note{margin:.8rem 0 0;color:#68748a}
.s3ql-hidden-intro-media{position:fixed!important;width:1px!important;height:1px!important;opacity:.001!important;pointer-events:none!important;left:-10px!important;bottom:-10px!important}
@media(max-width:620px){.s3ql-intro-visual{min-height:170px;padding:.65rem;border-radius:16px}.s3ql-intro-gif{max-height:310px}.s3ql-intro-countdown{padding:.8rem}.s3ql-intro-countdown span{font-size:.72rem}}
@media(prefers-reduced-motion:reduce){.s3ql-intro-countdown strong{animation:none!important}}


/* 1.9.2 — identité joueur simplifiée. */
.s3ql-person-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;align-items:start}
.s3ql-optional{font-size:.78rem;font-weight:650;color:#657085}
.s3ql-privacy-note{margin:.85rem 0 1rem;padding:.85rem 1rem;border:1px solid #dce2ec;border-radius:12px;background:#f7f8fc;color:#596579;font-size:.86rem;line-height:1.5}
.s3ql-privacy-note strong{color:#30394a}.s3ql-privacy-note a{font-weight:800}
@media(max-width:620px){.s3ql-person-grid{grid-template-columns:1fr}}

/* 1.9.3 — classement dynamique, indicateurs de série et résultat final sur tous les écrans. */
.s3ql-leader-row{grid-template-columns:auto auto auto minmax(0,1fr) auto auto!important}
.s3ql-rank-variation,.s3ql-player-status{display:inline-grid;place-items:center;flex:0 0 auto;width:30px;height:30px;border-radius:999px;font-size:1.05rem;background:#f2f4f8}
.s3ql-rank-variation.is-up{background:#e7f8ee}.s3ql-rank-variation.is-down{background:#fff0ee}.s3ql-rank-variation.is-stable{opacity:.6}
.s3ql-player-status{font-size:1.25rem;background:linear-gradient(135deg,#fff7d6,#fff)}
.s3ql-final-popup{position:fixed;inset:0;z-index:999999;display:grid;place-items:center;padding:1rem;background:rgba(9,12,32,.78);backdrop-filter:blur(10px);overflow:auto}
.s3ql-final-popup-card{position:relative;width:min(100%,920px);max-height:94vh;overflow:auto;padding:clamp(1rem,3vw,2rem);border-radius:24px;background:#fff;box-shadow:0 30px 90px rgba(0,0,0,.38);text-align:center}
.s3ql-final-popup-close{position:absolute;right:.8rem;top:.65rem;width:42px;height:42px;border:0;border-radius:50%;background:#eef1f7;font-size:1.8rem;cursor:pointer}
.s3ql-final-gif-wrap{position:relative;isolation:isolate;width:min(100%,420px);max-height:280px;margin:.5rem auto 1rem;border-radius:18px;overflow:hidden;background:#fff}
.s3ql-final-winner-gif{position:relative;z-index:1;display:block;width:100%;max-height:280px;object-fit:contain;margin:0;border-radius:inherit}
.s3ql-winner-celebration .s3ql-final-gif-wrap{width:min(430px,70vw);max-height:42vh;margin:0 auto 1rem}
.s3ql-winner-celebration .s3ql-final-gif-wrap img{display:block;width:100%;max-width:100%;max-height:42vh;object-fit:contain}
.s3ql-emoji-rain{position:absolute;inset:0;z-index:2;overflow:hidden;border-radius:inherit;pointer-events:none;contain:layout paint;user-select:none}
.s3ql-emoji-rain__item{position:absolute;top:-24%;line-height:1;filter:drop-shadow(0 3px 3px rgba(0,0,0,.28));will-change:top,transform;animation-name:s3ql-emoji-fall;animation-timing-function:linear;animation-iteration-count:infinite}
@keyframes s3ql-emoji-fall{0%{top:-24%;opacity:0;transform:translate3d(-50%,0,0) rotate(0deg)}8%{opacity:1}92%{opacity:1}100%{top:115%;opacity:.9;transform:translate3d(calc(-50% + var(--s3ql-emoji-drift)),0,0) rotate(var(--s3ql-emoji-turn))}}
.s3ql-mini-podium{display:flex;align-items:end;justify-content:center;gap:.65rem;margin:1rem auto 1.5rem}
.s3ql-mini-podium-place{display:grid;gap:.25rem;place-items:center;width:min(30%,190px);padding:.8rem .45rem;border-radius:16px 16px 6px 6px;background:#eef1f7}.s3ql-mini-podium-place.is-1{min-height:145px;background:#fff1ad}.s3ql-mini-podium-place.is-2{min-height:115px;background:#e7eaf0}.s3ql-mini-podium-place.is-3{min-height:95px;background:#f2d2b4}.s3ql-mini-podium-place strong{font-size:1.5rem}.s3ql-mini-podium-place span{font-weight:850;overflow-wrap:anywhere}.s3ql-mini-podium-place small{font-size:.75rem}
@media(max-width:620px){.s3ql-leader-row{grid-template-columns:auto auto 40px minmax(0,1fr) auto!important}.s3ql-player-status{grid-column:5}.s3ql-leader-points{grid-column:4/6}.s3ql-mini-podium{gap:.3rem}.s3ql-mini-podium-place{width:32%;padding:.55rem .25rem}.s3ql-final-popup-card{border-radius:16px}}
@media(prefers-reduced-motion:reduce){.s3ql-emoji-rain{display:none!important}.s3ql-emoji-rain__item{animation:none!important}}

/* 1.9.4 — sons pilotés depuis l’interface principale et classement temporisé cinq secondes. */
.s3ql-leaderboard-transition{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.45rem;width:min(100%,430px);margin:1rem auto 1.25rem;padding:.75rem 1rem;border:1px solid color-mix(in srgb,var(--s3ql-primary) 25%,#dce2ee);border-radius:16px;background:color-mix(in srgb,var(--s3ql-primary) 7%,#fff);font-weight:800;text-align:center}
.s3ql-leaderboard-transition strong{display:inline-grid;place-items:center;min-width:46px;min-height:46px;border-radius:50%;background:var(--s3ql-primary);color:#fff;font-size:1.65rem;line-height:1;font-variant-numeric:tabular-nums}
.s3ql-host-toolbar-status,.s3ql-screen-control-status{display:inline-flex;align-items:center;gap:.35rem;padding:.58rem .78rem;border-radius:12px;background:#eef2f8;color:#2f3a50;font-weight:800;white-space:nowrap}
.s3ql-host-toolbar-status strong,.s3ql-screen-control-status strong{min-width:1.3em;text-align:center;color:var(--s3ql-primary);font-variant-numeric:tabular-nums}
.s3ql-final-popup-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem;margin-top:1.25rem}
.s3ql-hidden-winner-media{position:fixed!important;width:1px!important;height:1px!important;opacity:.001!important;pointer-events:none!important;left:-10px!important;bottom:-10px!important}
@media(max-width:620px){.s3ql-leaderboard-transition{gap:.3rem;padding:.65rem .75rem}.s3ql-leaderboard-transition strong{min-width:40px;min-height:40px;font-size:1.35rem}.s3ql-host-toolbar-status,.s3ql-screen-control-status{width:100%;justify-content:center;white-space:normal}.s3ql-final-popup-actions .s3ql-button{width:100%}}

/* 1.10.7 — avatars compacts, classement entier et déplacements entre questions.
 * Scoping keeps administration, secretariat and the participant form unchanged. */
[data-s3ql-host] .s3ql-roster {
  display:grid; grid-template-columns:repeat(var(--s3ql-roster-columns,1),minmax(0,1fr)); gap:4px;
}
[data-s3ql-host] .s3ql-roster-row {
  display:grid; grid-template-columns:5px var(--s3ql-roster-avatar,32px) minmax(0,1fr) auto;
  align-items:center; gap:5px; padding:2px 0; min-width:0; font-size:var(--s3ql-roster-font,13px);
}
[data-s3ql-host] .s3ql-roster-row img {
  display:block; width:var(--s3ql-roster-avatar,32px); height:var(--s3ql-roster-avatar,32px); object-fit:contain;
}
[data-s3ql-host] .s3ql-roster-row strong,
[data-s3ql-host] .s3ql-roster-row small { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.15; }
[data-s3ql-host] .s3ql-roster-actions { gap:2px; }
[data-s3ql-host] .s3ql-roster-actions button {
  width:clamp(14px,var(--s3ql-roster-avatar,26px),26px); height:clamp(14px,var(--s3ql-roster-avatar,26px),26px);
  padding:0; line-height:1; border-radius:5px; font-size:inherit;
}
[data-s3ql-host] .s3ql-presence { width:5px; height:5px; border-radius:50%; background:#b8bec8; }
[data-s3ql-host] .s3ql-presence.is-online { background:#15855a; }
[data-s3ql-host] .s3ql-side-card h2 { margin:0 0 12px; font-size:1rem; }
[data-s3ql-screen][data-game-view="leaderboard"] .s3ql-screen-stage {
  min-height:0; height:calc(100vh - var(--s3ql-controls-height,0px)); height:calc(100dvh - var(--s3ql-controls-height,0px));
  padding:14px; align-content:start;
}
[data-s3ql-screen].s3ql-screen-app--managed { --s3ql-controls-height:62px; }
[data-s3ql-screen][data-game-view="leaderboard"] .s3ql-screen-card { margin:0 auto; padding:14px; border-radius:20px; }
[data-s3ql-screen] .s3ql-screen-card--ranking h1,
[data-s3ql-host] .s3ql-host-card--ranking h1 { margin:3px 0 6px; font-size:clamp(1.2rem,2.5vw,2rem); line-height:1.15; }
[data-game-view="leaderboard"] .s3ql-leaderboard-transition { width:fit-content; margin:6px auto 10px; padding:5px 12px; gap:7px; font-size:.88rem; }
[data-game-view="leaderboard"] .s3ql-leaderboard-transition strong { min-width:28px; min-height:28px; font-size:1.2rem; }
[data-s3ql-host][data-game-view="leaderboard"] .s3ql-host-layout { min-height:0; }
[data-s3ql-host][data-game-view="leaderboard"] .s3ql-host-main { padding:12px; }
[data-s3ql-fit-ranking] {
  display:grid; grid-template-columns:repeat(var(--s3ql-ranking-columns,1),minmax(0,1fr));
  gap:var(--s3ql-ranking-gap,5px); align-content:start;
}
.s3ql-app [data-s3ql-fit-ranking] .s3ql-leader-row {
  position:relative; grid-template-columns:1.55em 2.25em var(--s3ql-ranking-avatar,32px) minmax(0,1fr) 1.7em auto!important;
  min-height:0; height:var(--s3ql-ranking-height,48px); padding:var(--s3ql-ranking-padding,2px) 5px; gap:.32em;
  font-size:var(--s3ql-ranking-font,14px); border-radius:8px; line-height:1.1;
}
.s3ql-app [data-s3ql-fit-ranking] .s3ql-leader-row>img,
.s3ql-app [data-s3ql-fit-ranking] .s3ql-team-avatar { width:var(--s3ql-ranking-avatar,32px); height:var(--s3ql-ranking-avatar,32px); object-fit:contain; font-size:1em; }
.s3ql-app [data-s3ql-fit-ranking] .s3ql-leader-rank { font-size:1em; }
.s3ql-app [data-s3ql-fit-ranking] .s3ql-rank-variation { width:2.25em; height:1.8em; font-size:.83em; font-weight:900; white-space:nowrap; }
.s3ql-app [data-s3ql-fit-ranking] .s3ql-player-status { width:1.7em; height:1.7em; font-size:.9em; grid-column:auto; }
.s3ql-app [data-s3ql-fit-ranking] .s3ql-leader-points { grid-column:auto; font-size:.9em; }
.s3ql-app [data-s3ql-fit-ranking] strong small { font-size:.65em; line-height:1; }
.s3ql-app [data-s3ql-fit-ranking] .is-rising { border-color:#7cc8a1; background:#eefbf3; }
.s3ql-app [data-s3ql-fit-ranking] .is-falling { border-color:#e8b199; background:#fff4ee; }
@media(max-width:620px) {
  [data-s3ql-screen].s3ql-screen-app--managed { --s3ql-controls-height:54px; }
  [data-s3ql-screen][data-game-view="leaderboard"] .s3ql-screen-stage { padding:7px; }
  [data-s3ql-screen][data-game-view="leaderboard"] .s3ql-screen-card { padding:10px; }
}
/* Pendant les cinq secondes du classement, la liste latérale ferait doublon. */
[data-s3ql-host][data-game-view="leaderboard"] .s3ql-host-layout { grid-template-columns:minmax(0,1fr); }
[data-s3ql-host][data-game-view="leaderboard"] .s3ql-host-side { display:none; }
[data-s3ql-screen] .s3ql-screen-controls .s3ql-screen-control-status { flex:0 0 auto; width:auto; white-space:nowrap; }