.shareqr-button{display:inline-flex;align-items:center;justify-content:center;gap:0.35em}
.shareqr-button.slide-btn{gap:0}
.shareqr-button:not(.viewer-btn):not(.slide-btn){cursor:pointer;border:0;background:transparent;color:inherit;font:inherit;padding:0.25em;transition:color .2s ease,transform .2s ease}
.shareqr-button:not(.viewer-btn):not(.slide-btn):hover,.shareqr-button:not(.viewer-btn):not(.slide-btn):focus{color:#2563eb;transform:translateY(-1px)}

.shareqr-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:32px;background:rgba(15,23,42,.55);z-index:1600;overflow:auto}
.shareqr-modal.is-open{display:flex}
.shareqr-modal[hidden]{display:none!important}
body.shareqr-open{overflow:hidden}

.shareqr-backdrop{position:absolute;inset:0}
.shareqr-dialog{position:relative;background:#f8fafc;border-radius:24px;box-shadow:0 40px 80px rgba(15,23,42,.28);padding:28px;width:100%;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;gap:20px;color:#0f172a;outline:0;box-sizing:border-box}
.shareqr-dialog--portrait{max-width:460px;height:640px}
.shareqr-dialog--landscape{max-width:880px;height:480px}
.shareqr-dialog:focus-visible{outline:3px solid rgba(37,99,235,.6)}

.shareqr-close{position:absolute;top:14px;right:14px;border:0;background:rgba(15,23,42,.05);border-radius:999px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:18px;color:#334155;cursor:pointer;transition:background .2s ease,color .2s ease;z-index:2}
.shareqr-close:hover,.shareqr-close:focus{background:rgba(37,99,235,.12);color:#1d4ed8}

.shareqr-main{position:relative;flex:1 1 auto;width:100%;height:100%;display:flex;gap:20px}
.shareqr-dialog--portrait .shareqr-main{display:block}
.shareqr-footer{margin-top:4px}
.shareqr-dialog .shareqr-link{margin-top:8px}

.shareqr-primary{position:relative;background:#fff;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(148,163,184,.18);box-sizing:border-box;width:100%;height:100%;max-height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}
.shareqr-primary--image{display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box;flex-direction:column;gap:12px}
.shareqr-primary--image .shareqr-title{margin:0;text-align:center;width:95%;position:absolute;top:12px;left:50%;transform:translateX(-50%);padding:6px 10px;border-radius:12px;background:rgba(255,255,255,.6);color:#0f172a;backdrop-filter:none;z-index:3;line-height:1.35}
.shareqr-primary>img,.shareqr-primary>video{width:100%;height:100%;object-fit:cover}
.shareqr-primary>*{max-width:100%;max-height:100%}
.shareqr-primary--course{padding:20px;display:block;overflow:auto;height:100%;max-height:100%}
.shareqr-primary--slide{padding:20px;display:flex;align-items:center;justify-content:center;overflow:hidden;height:100%;max-height:100%;min-height:0}
.shareqr-primary--course>*:not(style),.shareqr-primary--slide>*:not(style){margin:0}
.shareqr-primary--course .kokoro-content,.shareqr-primary--slide .kokoro-content{display:flex;flex-direction:column;gap:14px}

.shareqr-secondary{display:flex;flex-direction:column;gap:14px;min-width:360px;background:#fff;color:#0f172a;border-radius:18px;padding:20px;box-shadow:inset 0 0 0 1px rgba(148,163,184,.18);box-sizing:border-box}
.shareqr-secondary--overlay{position:absolute;right:24px;bottom:24px;width:min(35%,240px);min-width:120px;background:rgba(255,255,255,.54);color:#0f172a;padding:10px 12px;border-radius:12px;box-shadow:0 24px 54px rgba(15,23,42,.2);backdrop-filter:blur(8px)}
.shareqr-secondary--overlay .shareqr-title{color:#0f172a}
.shareqr-dialog--landscape .shareqr-secondary{flex:0 0 45%;max-width:480px;min-width:360px;background:#fff;color:#0f172a;border-radius:18px;padding:20px;align-self:stretch;justify-content:space-between;box-shadow:inset 0 0 0 1px rgba(148,163,184,.25)}
.shareqr-dialog--type-course .shareqr-secondary,.shareqr-dialog--type-slide .shareqr-secondary{flex:0 0 20%;max-width:20%;min-width:0}
.shareqr-dialog--landscape .shareqr-secondary .shareqr-title{color:#0f172a}

.shareqr-branding{display:flex;align-items:center;justify-content:center;margin:0 auto 4px auto;gap:10px}
.shareqr-branding__logo{width:20%;height:20%;min-width:72px;min-height:72px;max-width:140px;max-height:140px;object-fit:contain;display:block}
.shareqr-title{font-size:1.35rem;font-weight:800;margin:0;color:#0f172a;text-align:center;line-height:1.4}
.shareqr-site-title{font-size:1.05rem;font-weight:800;margin:0 0 6px;color:#0f172a;text-align:center}
.shareqr-extra{font-size:.95rem;line-height:1.55;color:#475569;text-align:center;display:flex;flex-direction:column;gap:6px}
.shareqr-extra .shareqr-ad{margin:0;font-size:1.05rem;font-weight:700;line-height:1.4;color:#0f172a}
.shareqr-extra .shareqr-extra-note{font-size:.92rem; color:#475569;}
.shareqr-promos{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:320px;overflow:auto}
.shareqr-promos .shareqr-ad{background:#eef2ff;border-radius:12px;padding:10px 12px;text-align:left}
.shareqr-secondary--overlay .shareqr-extra{color:#475569}
.shareqr-dialog--landscape .shareqr-extra{color:#475569}
.shareqr-extra:empty{display:none}

.shareqr-qr{position:relative;align-self:center;justify-content:center;align-items:center;display:flex;background:#fff;padding:10px;border-radius:14px;box-shadow:0 14px 30px rgba(15,23,42,.18);margin:0 auto;text-align:center;max-width:140px}
.shareqr-qr canvas,.shareqr-qr img{width:100px!important;height:100px!important}
.shareqr-qr__logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:15%;height:15%;min-width:15px;min-height:15px;max-width:30px;max-height:30px;border-radius:10px;background:rgba(255,255,255,.96);box-shadow:0 3px 10px rgba(15,23,42,.18);object-fit:contain;padding:4px;box-sizing:border-box;pointer-events:none;z-index:2}
.shareqr-dialog--landscape .shareqr-qr{align-self:center}
.shareqr-qr__fallback{font-size:.8rem;color:#64748b;text-align:center;max-width:150px}
.shareqr-video-poster{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}

.shareqr-link{display:flex;flex-direction:column;gap:8px}
.shareqr-link__input{border-radius:10px;border:1px solid rgba(148,163,184,.35);padding:10px 12px;background:#fff;font-size:.9rem;color:#0f172a}
.shareqr-link__input:focus{outline:2px solid rgba(37,99,235,.4);border-color:rgba(37,99,235,.55)}
.shareqr-actions{display:flex;justify-content:center;align-items:stretch;gap:8px;flex-wrap:nowrap}
.shareqr-action-icon{font-size:1.2rem;line-height:1;display:inline-flex;align-items:center;pointer-events:none}
.shareqr-copy,.shareqr-download{align-self:flex-end;border:0;border-radius:10px;background:#2563eb;color:#fff;padding:8px 16px;font-size:.85rem;cursor:pointer;transition:background .2s ease,transform .2s ease;flex:1;min-width:0;text-align:center;white-space:nowrap;display:flex;align-items:center;justify-content:center}
.shareqr-actions .shareqr-copy,.shareqr-actions .shareqr-download{align-self:stretch}
.shareqr-copy:hover,.shareqr-copy:focus,.shareqr-download:hover,.shareqr-download:focus{background:#1d4ed8;transform:translateY(-1px)}
.shareqr-copy.is-copied{background:#15803d}
.shareqr-download.is-busy{cursor:progress;opacity:.75;transform:none}
.shareqr-download.has-error{background:#b91c1c}
.shareqr-download.has-error:hover,.shareqr-download.has-error:focus{background:#991b1b}
.shareqr-download:disabled{cursor:progress}

.shareqr-preview--image{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.shareqr-preview--image img{width:100%;height:100%;object-fit:contain}
.shareqr-preview--course{height:100%;max-height:100%;overflow:auto}
.shareqr-preview--slide{display:flex;align-items:center;justify-content:center;width:100%;height:100%;max-height:100%;overflow:hidden}
.shareqr-preview--course .course-content{max-width:100%}
.shareqr-preview--slide .slide-stage-outer{width:100%;max-width:100%;height:100%;max-height:100%;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.shareqr-preview--slide .slide-stage{max-width:100%;max-height:100%;transform-origin:center}
.shareqr-preview--course table,.shareqr-preview--slide table{width:100%;border-collapse:collapse}
.shareqr-preview--course table td,.shareqr-preview--course table th,.shareqr-preview--slide table td,.shareqr-preview--slide table th{border:1px solid rgba(148,163,184,.4);padding:6px 8px}

.shareqr-empty{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:.95rem;color:#6b7280;text-align:center;padding:20px}

@media (max-width: 768px){
  .shareqr-modal{padding:16px;align-items:flex-start}
  .shareqr-dialog{padding:20px;width:100%;max-width:100%;height:auto;max-height:none;border-radius:20px;margin:32px auto}
  .shareqr-dialog--portrait{height:auto}
  .shareqr-dialog--landscape{flex-direction:column;height:auto;max-width:100%}
  .shareqr-dialog--portrait .shareqr-main{display:flex}
  .shareqr-dialog--landscape .shareqr-main{flex-direction:column}
  .shareqr-dialog .shareqr-main{flex-direction:column;gap:18px;align-items:stretch}
  .shareqr-footer{margin-top:12px;width:100%}
  .shareqr-primary{height:50vh;max-height:50vh}
  .shareqr-primary--image{padding:20px}
  .shareqr-secondary{position:static;width:100%;max-width:100%;flex-direction:column;align-items:center;align-self:stretch;box-sizing:border-box;min-width:0;text-align:center}
  .shareqr-dialog--landscape .shareqr-secondary{flex:0 0 auto;width:100%;max-width:100%;min-width:0;flex-direction:column;align-items:center;align-self:stretch;gap:16px;box-sizing:border-box;text-align:center}
  .shareqr-dialog--type-course .shareqr-secondary,
  .shareqr-dialog--type-slide .shareqr-secondary{flex:0 0 auto;width:100%;max-width:100%;min-width:0}
  .shareqr-title,.shareqr-extra{text-align:center;width:100%}
  .shareqr-link{width:100%;align-items:center}
  .shareqr-link__input{width:100%;text-align:center}
  .shareqr-actions{width:100%;justify-content:center}
  .shareqr-actions .shareqr-copy,
  .shareqr-actions .shareqr-download{max-width:100%}
  .shareqr-qr{align-self:center;margin-left:auto;margin-right:auto}
  .shareqr-secondary--overlay{position:static;width:100%;max-width:none;margin-top:0;min-width:0}
  .shareqr-dialog--type-image .shareqr-main{flex-direction:row;align-items:stretch}
  .shareqr-dialog--type-image .shareqr-primary{height:100%;min-height:100%;max-height:100%}
  .shareqr-dialog--type-image .shareqr-secondary--overlay{position:absolute;right:16px;bottom:16px;width:min(180px,calc(100% - 32px));min-width:min(120px,calc(100% - 32px));max-width:none}
  .shareqr-dialog--type-image .shareqr-secondary--overlay .shareqr-actions{flex-direction:row;justify-content:center}
  .shareqr-dialog--type-image .shareqr-secondary--overlay .shareqr-copy,
  .shareqr-dialog--type-image .shareqr-secondary--overlay .shareqr-download{width:auto}
}