.nbt-preview-lightbox { width: min(1200px, calc(100% - 32px)); max-width: none; max-height: 92vh; max-height: 92dvh; margin: auto; padding: 0; border: 1px solid var(--line, #444); border-radius: 18px; background: var(--surface, #17181c); color: var(--text, #fff); box-shadow: 0 28px 100px #0009; overflow: hidden; }
.nbt-preview-lightbox::backdrop { background: #080a10dc; backdrop-filter: blur(8px); }
.nbt-preview-toolbar { display: flex; align-items: center; gap: 16px; padding: 12px 18px; border-bottom: 1px solid var(--line, #444); }
.nbt-preview-toolbar strong { margin-right: auto; font-size: 14px; }
.nbt-preview-toolbar a { color: var(--accent, #ffdf58); font-size: 12px; }
.nbt-preview-toolbar button { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line, #444); border-radius: 50%; background: var(--bg, #101114); color: inherit; font: 28px/1 sans-serif; cursor: pointer; }
.nbt-preview-toolbar :focus-visible { outline: 2px solid var(--accent, #ffdf58); outline-offset: 3px; }
.nbt-preview-canvas { max-height: calc(92vh - 70px); max-height: calc(92dvh - 70px); overflow: auto; overscroll-behavior: contain; padding: 18px; text-align: center; }
.nbt-preview-canvas img { display: block; width: auto; max-width: 100%; height: auto; margin: auto; border-radius: 8px; }
.nbt-preview-canvas [hidden] { display: none; }
.nbt-preview-canvas p { padding: 30px 12px; }
@media (max-width: 600px) {
    .nbt-preview-lightbox { width: calc(100% - 16px); border-radius: 12px; }
    .nbt-preview-toolbar { gap: 10px; padding: 10px; }
    .nbt-preview-toolbar strong { font-size: 12px; }
    .nbt-preview-toolbar a { font-size: 10px; }
    .nbt-preview-canvas { padding: 8px; }
}
