.sev-widget{
  --sev-viewer-h:560px;
  --sev-gap:16px;
  --sev-list-cols-desktop:1;
  --sev-thumb-h:70px;
  --sev-mobile-image-w:64%;
  --sev-mobile-pdf-w:78%;
  display:block;
}

.sev-layout{
  display:grid;
  grid-template-columns:minmax(260px, 34%) 1fr;
  gap:var(--sev-gap);
  align-items:start;
}

.sev-list{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(var(--sev-list-cols-desktop), minmax(0,1fr));
}

.sev-indicators{
  display:none;
}

.sev-item{
  display:flex;
  gap:10px;
  width:100%;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  padding:10px;
  background:#fff;
  text-align:left;
  cursor:pointer;
  transition:all .2s ease;
}

.sev-item:hover{ transform:translateY(-1px); }
.sev-item.is-active{ border-color:#1a73e8; box-shadow:0 0 0 2px rgba(26,115,232,.12); }

.sev-thumb-wrap{
  position:relative;
  width:96px;
  min-width:96px;
  height:var(--sev-thumb-h);
  border-radius:10px;
  overflow:hidden;
  background:#f3f4f6;
}

.sev-thumb{ width:100%; height:100%; object-fit:cover; display:block; }

.sev-pdf-overlay{
  position:absolute;
  inset:auto 6px 6px 6px;
  background:rgba(13,17,23,.75);
  color:#fff;
  font-size:12px;
  padding:6px 8px;
  border-radius:8px;
  text-align:center;
}

.sev-type-tag{
  position:absolute;
  top:6px;
  left:6px;
  background:rgba(255,255,255,.92);
  color:#111;
  font-size:10px;
  font-weight:700;
  letter-spacing:.02em;
  padding:3px 6px;
  border-radius:999px;
}

.sev-meta-wrap{ min-width:0; display:flex; flex-direction:column; gap:6px; }
.sev-title{
  font-size:14px;
  line-height:1.3;
  margin:0;
  white-space:normal;
  overflow-wrap:anywhere;
}

.sev-meta{ font-size:12px; color:#6b7280; display:flex; gap:8px; flex-wrap:wrap; }
.sev-list-desc{ font-size:12px; color:#4b5563; display:block; }

.sev-viewer{
  min-width:0;
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}

.sev-head{ padding:14px 16px 10px; border-bottom:1px solid rgba(0,0,0,.08); }
.sev-head-title{ margin:0 0 6px; font-size:20px; line-height:1.3; }
.sev-head-meta{ display:flex; gap:10px; flex-wrap:wrap; font-size:13px; color:#6b7280; }
.sev-head-desc{ margin-top:8px; font-size:14px; line-height:1.5; color:#111827; }

.sev-stage{ height:var(--sev-viewer-h); background:#f8fafc; position:relative; }
.sev-frame{ width:100%; height:100%; border:0; display:block; }
.sev-pdf-stage{ width:100%; height:100%; position:relative; }
.sev-pdf-object{ width:100%; height:100%; border:0; display:block; }
.sev-pdf-open{
  display:none;
  position:absolute;
  left:50%;
  bottom:12px;
  transform:translateX(-50%);
  background:rgba(17,24,39,.86);
  color:#fff;
  text-decoration:none;
  border-radius:999px;
  padding:8px 12px;
  font-size:12px;
  font-weight:600;
}
.sev-image-stage{ width:100%; height:100%; overflow:auto; touch-action:pan-x pan-y pinch-zoom; }
.sev-main-image{ width:100%; height:100%; object-fit:contain; display:block; background:#111; }

.sev-watermark{
  position:absolute;
  z-index:3;
  pointer-events:none;
  opacity:var(--sev-wm-opacity, .2);
}
.sev-watermark img{ width:var(--sev-wm-size, 160px); height:auto; display:block; }
.sev-watermark--center{ left:50%; top:50%; transform:translate(-50%,-50%); }
.sev-watermark--top-left{ left:14px; top:14px; }
.sev-watermark--top-right{ right:14px; top:14px; }
.sev-watermark--bottom-left{ left:14px; bottom:14px; }
.sev-watermark--bottom-right{ right:14px; bottom:14px; }

.sev-actions{ padding:10px 16px 14px; display:flex; justify-content:flex-end; }
.sev-download{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 14px;
  border-radius:8px;
  background:#1a73e8;
  color:#fff;
  text-decoration:none;
  font-size:13px;
  font-weight:600;
}

.sev-modal{ position:fixed; inset:0; z-index:99999; display:none; }
.sev-modal.is-open{ display:block; }
.sev-modal-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.72); }
.sev-modal-dialog{ position:relative; z-index:2; width:min(100vw,980px); height:min(100vh,100%); margin:0 auto; background:#0f1115; }
.sev-modal-body{ position:absolute; inset:0; overflow:auto; }
.sev-modal-close{
  position:absolute;
  top:10px;
  right:12px;
  z-index:4;
  width:38px;
  height:38px;
  border:0;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:24px;
  line-height:1;
}

.sev-modal-image-wrap{ min-height:100%; display:flex; align-items:center; justify-content:center; overflow:auto; touch-action:pan-x pan-y pinch-zoom; }
.sev-modal-image{ width:100%; height:auto; object-fit:contain; display:block; }
.sev-modal-frame{ width:100%; height:100%; min-height:100vh; border:0; }

@media (max-width: 1024px){
  .sev-layout{ grid-template-columns:1fr; }
}

@media (max-width: 767px){
  .sev-layout{ grid-template-columns:1fr; gap:12px; }

  .sev-list{
    display:flex;
    overflow:auto;
    scroll-snap-type:x mandatory;
    gap:10px;
    padding-inline:2px;
    padding-bottom:4px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .sev-list::-webkit-scrollbar{ display:none; }

  .sev-indicators{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-top:-2px;
    margin-bottom:2px;
  }

  .sev-indicator{
    width:8px;
    height:8px;
    border:0;
    border-radius:999px;
    background:rgba(100,116,139,.45);
    padding:0;
    transition:all .22s ease;
  }

  .sev-indicator.is-active{
    width:22px;
    background:#1a73e8;
  }

  .sev-item{
    flex:0 0 auto;
    width:72%;
    flex-direction:column;
    gap:8px;
    scroll-snap-align:center;
  }

  .sev-item--image{ width:var(--sev-mobile-image-w); }
  .sev-item--pdf{ width:var(--sev-mobile-pdf-w); }

  .sev-thumb-wrap{ width:100%; min-width:0; height:auto; aspect-ratio:16/9; }
  .sev-head-title{ font-size:18px; }
  .sev-stage{ height:min(56vh, 420px); }
  .sev-frame,
  .sev-pdf-object{ -webkit-overflow-scrolling:touch; }
  .sev-modal-dialog{ width:100vw; height:100vh; max-width:none; }
  .sev-is-ios .sev-pdf-open{ display:inline-flex; }
}