.bucket-preview{max-width:1300px;margin:0 auto;padding:30px 24px 65px;box-sizing:border-box}
.bucket-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:25px}
.bucket-card{padding:18px;border:1px solid #ddd;background:#fff;min-width:0}
.bucket-card h2{font-size:21px}.bucket-card p{line-height:1.6;overflow-wrap:anywhere}
.bucket-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.bucket-photos a{display:flex;align-items:center;justify-content:center;background:#eee}
.bucket-photos img{display:block;width:100%;height:180px;object-fit:contain}

/* v0.2: native-dialog lightbox, isolated to the bucket */
.bucket-lightbox { width: min(96vw, 1500px); max-width: none; max-height: 96dvh; margin: auto; padding: 0; border: 0; border-radius: 5px; color: white; background: #161616; box-shadow: 0 10px 50px #0009; }
.bucket-lightbox::backdrop { background: rgba(0,0,0,.86); }
.bucket-lightbox__panel { position: relative; display: grid; grid-template-columns: 52px minmax(0,1fr) 52px; grid-template-rows: minmax(0,1fr) auto; align-items: center; width: min(96vw, 1500px); max-height: 96dvh; min-height: min(400px,70dvh); padding: 40px 4px 12px; box-sizing: border-box; }
.bucket-lightbox__image { grid-column: 2; grid-row: 1; display: block; width: auto; height: auto; max-width: 100%; max-height: calc(96dvh - 110px); object-fit: contain; justify-self: center; align-self: center; }
.bucket-lightbox__close { position: absolute; top: 3px; right: 9px; border: 0; background: transparent; color: white; font-size: 36px; cursor: pointer; z-index: 2; line-height: 1.1; }
.bucket-lightbox__nav { border: 0; color: white; background: transparent; font-size: 30px; cursor: pointer; padding: 12px 0; }
.bucket-lightbox__nav:disabled { visibility: hidden; }
.bucket-lightbox__prev { grid-column: 1; grid-row: 1; }
.bucket-lightbox__next { grid-column: 3; grid-row: 1; }
.bucket-lightbox__status { grid-column: 1 / -1; grid-row: 2; text-align: center; margin: 8px 0 0; color: #ddd; font-size: 13px; }
.bucket-lightbox button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (max-width: 600px) { .bucket-lightbox__panel { grid-template-columns: 35px minmax(0,1fr) 35px; } .bucket-lightbox__nav { font-size: 23px; } }
