.s3wb-session-qr{
  --s3wb-qr-blue:#075cb6;
  --s3wb-qr-cyan:#00a8c8;
  --s3wb-qr-ink:#162238;
  --s3wb-qr-muted:#66758c;
  --s3wb-qr-line:#dbe5f0;
  width:min(100%,560px);
  margin:24px auto;
  padding:28px;
  box-sizing:border-box;
  border:1px solid var(--s3wb-qr-line);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(239,248,255,.96));
  box-shadow:0 22px 65px rgba(20,54,88,.13);
  color:var(--s3wb-qr-ink);
  text-align:center;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.s3wb-session-qr-title{
  margin:0 0 8px;
  color:var(--s3wb-qr-ink);
  font-size:clamp(24px,4vw,36px);
  line-height:1.15;
  font-weight:850;
  overflow-wrap:anywhere;
}
.s3wb-session-qr-status{
  min-height:1.5em;
  margin:0 0 18px;
  color:var(--s3wb-qr-muted);
  font-size:14px;
  line-height:1.5;
}
.s3wb-session-qr-frame{
  width:min(100%,calc(var(--s3wb-qr-size,320px) + 30px));
  min-height:min(calc(var(--s3wb-qr-size,320px) + 30px),calc(100vw - 72px));
  margin:0 auto;
  padding:14px;
  display:grid;
  place-items:center;
  overflow:hidden;
  box-sizing:border-box;
  border:1px solid #dce6f0;
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 34px rgba(20,45,75,.14);
}
.s3wb-session-qr-canvas{
  min-width:150px;
  min-height:150px;
  display:grid;
  place-items:center;
  color:#7a2c2c;
  font-size:13px;
  line-height:1.45;
}
.s3wb-session-qr-canvas canvas{
  display:block;
  max-width:100%;
  height:auto!important;
  image-rendering:pixelated;
}
.s3wb-session-qr-code{
  margin:18px 0 0;
  color:var(--s3wb-qr-blue);
  font-size:clamp(22px,5vw,32px);
  font-weight:900;
  letter-spacing:.18em;
  overflow-wrap:anywhere;
}
.s3wb-session-qr-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin-top:16px;
  padding:9px 16px;
  border-radius:12px;
  background:linear-gradient(135deg,var(--s3wb-qr-blue),#0d76d4);
  color:#fff!important;
  font-size:14px;
  font-weight:800;
  text-decoration:none!important;
  box-shadow:0 9px 22px rgba(7,92,182,.22);
}
.s3wb-session-qr-link:hover,.s3wb-session-qr-link:focus-visible{
  filter:brightness(1.06);
  transform:translateY(-1px);
}
.s3wb-session-qr.is-loading .s3wb-session-qr-frame{opacity:.72}
.s3wb-session-qr.is-error{border-color:#efcaca;background:linear-gradient(145deg,#fff,#fff7f7)}
.s3wb-session-qr.is-error .s3wb-session-qr-status{color:#a12828;font-weight:700}
.s3wb-session-qr-noscript,.s3wb-session-qr-error{
  margin:16px 0;
  padding:12px 14px;
  border:1px solid #efcaca;
  border-radius:12px;
  background:#fff2f2;
  color:#a12828;
  font:600 14px/1.45 system-ui,sans-serif;
}
@media(max-width:600px){
  .s3wb-session-qr{margin:16px auto;padding:20px;border-radius:20px}
  .s3wb-session-qr-frame{padding:10px;min-height:190px}
  .s3wb-session-qr-status{font-size:13px}
}
