.resource-viewer[hidden]{display:none!important}
.resource-viewer{
  position:fixed;
  inset:0;
  z-index:10000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(0,0,0,.78);
}
.resource-viewer-panel{
  width:min(1180px,96vw);
  max-height:92vh;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--bg);
  color:var(--text);
  box-shadow:0 24px 80px rgba(0,0,0,.45);
}
.resource-viewer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:15px 18px;
  border-bottom:1px solid var(--line);
}
.resource-viewer-head h2{margin:0;font-size:18px;line-height:1.2}
.resource-viewer-close{
  appearance:none;
  border:1px solid var(--line);
  background:transparent;
  color:var(--text);
  width:38px;
  height:38px;
  border-radius:9px;
  font:inherit;
  font-size:26px;
  line-height:1;
  cursor:pointer;
}
.resource-viewer-close:hover{border-color:var(--accent);color:var(--accent)}
.resource-viewer-frame-wrap{width:100%;height:min(74vh,760px);background:#05080c}
.resource-viewer[data-resource-kind="incibe"] .resource-viewer-frame-wrap{height:auto;aspect-ratio:16/9}
.resource-viewer iframe{display:block;width:100%;height:100%;border:0;background:#05080c}
body.resource-viewer-open{overflow:hidden}
@media(max-width:700px){
  .resource-viewer{padding:10px}
  .resource-viewer-panel{width:98vw}
  .resource-viewer-frame-wrap{height:72vh}
  .resource-viewer[data-resource-kind="incibe"] .resource-viewer-frame-wrap{height:auto}
}