body.page-art { background: radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--page-accent) 8%, transparent), transparent 28rem), var(--bg); }
.page-art .kicker { color: var(--page-accent); }
.gallery-toolbar { display: flex; flex-wrap: wrap; gap: 8px; padding: 18px 0 34px; }
.filter-btn {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 10px 14px;
  background: transparent;
  cursor: pointer;
  color: var(--muted);
  font-size: .76rem;
  font-weight: 900;
}
.filter-btn.active { background: var(--page-accent); border-color: var(--page-accent); color: #0c1309; }
.gallery { columns: 3 var(--gallery-min); column-gap: 18px; }
.gallery-item {
  break-inside: avoid;
  margin: 0 0 18px;
  border: 1px solid var(--line);
  background: #0e1020;
  overflow: hidden;
  transition: opacity .22s ease, transform .22s ease;
}
.gallery-item:nth-child(odd) { border-radius: 22px 6px; }
.gallery-item:nth-child(even) { border-radius: 6px 22px; }
.gallery-item.hidden { display: none; }
.gallery-trigger { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; text-align: left; }
.gallery-trigger img { width: 100%; height: auto; transition: transform .4s ease; }
.gallery-item:hover img { transform: scale(1.01); }
.gallery-meta { padding: 14px 16px 16px; }
.gallery-meta strong { display: block; font-size: 1rem; }
.gallery-meta span { display: block; margin-top: 3px; color: var(--muted); font-size: .73rem; }
.gallery-note { margin-top: 34px; padding: 20px; border-left: 3px solid var(--page-accent); color: var(--muted); background: color-mix(in srgb, var(--page-accent) 3.5%, transparent); }

.gallery-note[hidden]{display:none!important}
.gallery-item[hidden]{display:none!important}
.art-dialog{width:min(96vw,1500px);max-width:none;height:min(94vh,1100px);padding:0;border:1px solid var(--line);border-radius:18px;background:rgba(7,8,19,.98);color:var(--warm);box-shadow:0 30px 90px #000b}
.art-dialog::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(8px)}
.art-dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 14px;border-bottom:1px solid var(--line)}
.art-dialog-bar span{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.art-dialog-close,.art-dialog-prev,.art-dialog-next{border:1px solid var(--line);background:#0d1020;color:var(--warm);border-radius:12px;min-width:44px;min-height:44px;cursor:pointer;font-size:1.4rem}
.art-dialog-stage{position:relative;height:calc(100% - 70px);display:grid;place-items:center;padding:18px 64px;overflow:auto}
.art-dialog-image{display:block;max-width:100%;max-height:100%;object-fit:contain}
.art-dialog-prev,.art-dialog-next{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.art-dialog-prev{left:10px}.art-dialog-next{right:10px}
@media(max-width:640px){.art-dialog{width:100vw;height:100dvh;border:0;border-radius:0}.art-dialog-stage{padding:12px 48px}.art-dialog-prev{left:4px}.art-dialog-next{right:4px}}

.filter-btn{--category-color:var(--page-accent)}.filter-btn.active{background:var(--category-color);border-color:var(--category-color)}
