:root{
  --albums-card-width: 85%;
  --albums-card-max: 1250px;
  --albums-bg: #4C571B;
  --albums-radius: 22px;
  --albums-gap: 16px;
  --album-tile-radius: 16px;
}
.gallery-section{ padding: clamp(16px,3vw,32px); }
.gallery-card{
  width: min(var(--albums-card-max), var(--albums-card-width));
  margin: 0 auto; background: var(--albums-bg); border-radius: var(--albums-radius);
  padding: clamp(16px,3vw,28px); box-shadow: 0 6px 28px rgba(0,0,0,.08);
}
.gallery-card .house-title{ margin:0 0 clamp(12px,2vw,18px); font-weight:300; position:relative; padding-bottom:10px; }
.gallery-card .house-title::after{ content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:0; width:80%; height:1px; background: rgba(0,0,0,.28); border-radius:1px; }

/* Toolbar */
.albums-toolbar{ display:flex; gap:10px; align-items:center; margin: 4px 0 14px; }
.albums-label{ font-size:14px; opacity:.8; }
.albums-select{ border-radius:999px; padding:8px 14px; border:1px solid rgba(0,0,0,.1); background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.06); }

/* Albums grid */
.albums-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr)); gap: var(--albums-gap); }
.album-card{ border:none; padding:0; background:#fff; cursor:pointer; text-align:left; border-radius: var(--album-tile-radius); overflow:hidden; box-shadow:0 1px 12px rgba(0,0,0,.08); transition: transform .15s ease, box-shadow .15s ease; }
.album-card:hover{ transform: translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.14); }
.album-cover{ width:100%; aspect-ratio:4/3; background:#f3f3f3; }
.album-cover img{ width:100%; height:100%; object-fit:cover; display:block; }
.album-cover .no-cover{ width:100%; height:100%; display:grid; place-items:center; color:#888; font-size:14px; }
.album-meta{ display:flex; justify-content:space-between; align-items:center; padding:10px 12px; }
.album-title{ font-weight:600; }
.album-count{ font-size:12px; color:#666; }

/* Current album grid */
.album-current{ margin-top:14px; }
.album-current__title{ font-weight:600; margin: 6px 2px 8px; }
.album-current__grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); gap:12px; }
.album-current__grid img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; border-radius:10px; cursor:pointer; }

/* Lightbox */
.album-lightbox{ position:fixed; inset:0; display:none; z-index:99999; }
.album-lightbox.open{ display:block; }
.album-lightbox .alb-backdrop{ position:absolute; inset:0; background:rgba(20,24,18,.92); }
.album-lightbox .alb-content{ position:relative; z-index:1; width:min(96vw, 1100px); margin:5vh auto; background:#0f120e; border-radius:16px; padding:16px; box-shadow:0 10px 40px rgba(0,0,0,.35); }
.album-lightbox .alb-title{ color:#fff; font-weight:600; margin:0 0 8px 2px; opacity:.9; }
.album-lightbox .alb-close,.album-lightbox .alb-prev,.album-lightbox .alb-next{ position:absolute; border:none; border-radius:999px; background:#fff; cursor:pointer; width:40px; height:40px; box-shadow:0 2px 10px rgba(0,0,0,.2); display:flex; align-items:center; justify-content:center; font-size:20px; line-height:1; }
.album-lightbox .alb-close{ top:12px; right:12px; }
.album-lightbox .alb-prev{ top:calc(50% - 20px); left:12px; }
.album-lightbox .alb-next{ top:calc(50% - 20px); right:12px; }
.album-lightbox .alb-image{ width:100%; max-height:70vh; object-fit:contain; background:#000; border-radius:10px; display:block; margin: 0 auto; }
.album-lightbox .alb-grid{ margin-top:8px; display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; max-height:30vh; overflow:auto; background:#0f120e; padding:6px; border-radius:10px; }
.album-lightbox .alb-grid img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; border-radius:8px; cursor:pointer; }

/* Hide any legacy arrows outside of our lightbox */
.glb-prev, .glb-next, .gallery-prev, .gallery-next, .lightbox-prev, .lightbox-next { display:none !important; }

@media (max-width: 900px){
  :root{ --albums-card-width: 88%; }
  .albums-grid{ grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); }
  .album-current__grid{ grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); }
}
@media (max-width: 768px){
  .album-lightbox .alb-content{ width:94vw; margin:3vh auto; padding:12px; border-radius:12px; }
  .album-lightbox .alb-grid{ grid-template-columns: repeat(3, 1fr); max-height: 32vh; }
}
:root{
  --albums-card-width: 80%;
  --albums-card-max: 1150px;
  --albums-bg: #4C571B;
  --albums-radius: 22px;
  --albums-gap: 16px;
  --album-tile-radius: 16px;

  /* Акцент (заголовок, линия, лейбл, селект) */
  --albums-accent: #ece7d4;
  --albums-accent-weak: #ece7d4cc; /* слегка прозрачный вариант */
}

/* Секция/карточка */
.gallery-section{ padding: clamp(16px,3vw,32px); }
.gallery-card{
  width: min(var(--albums-card-max), var(--albums-card-width));
  margin: 0 auto;
  background: var(--albums-bg);
  border-radius: var(--albums-radius);
  padding: clamp(16px,3vw,28px);
  box-shadow: 0 6px 28px rgba(0,0,0,.08);
  color: var(--albums-accent); /* базовый текст светлый внутри плашки */
}

/* Заголовок и линия под ним — акцентного цвета */
.gallery-card .house-title{
  margin:0 0 clamp(12px,2vw,18px);
  font-weight:400;
  position:relative;
  padding-bottom:10px;
  color: var(--albums-accent);
}
.gallery-card .house-title::after{
  content:"";
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:0; width:80%; height:1px;
  background: var(--albums-accent);
  border-radius:1px;
  opacity: .9;
}

/* Панель выбора альбома */
.albums-toolbar{
  display:flex; gap:10px; align-items:center;
  margin: 6px 0 16px;
  flex-wrap: wrap;
}
.albums-label{
  font-size:14px; letter-spacing:.2px;
  color: var(--albums-accent);
  opacity: .95;
}

/* Красивый селект с акцентным цветом */
.albums-select{
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  border-radius: 999px;
  padding: 8px 42px 8px 14px;
  border: 1px solid var(--albums-accent);
  background: transparent;
  color: var(--albums-accent);
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  position: relative;
  /* стрелка */
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23ece7d4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 18px 18px;
}
.albums-select:focus{ outline: 2px solid var(--albums-accent-weak); outline-offset: 2px; }
.albums-select option{
  color: #222; background: #fff; /* выпадающий список читаемый */
}

/* Сетка альбомов */
.albums-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(260px,1fr));
  gap: var(--albums-gap);
}
.album-card{
  border:none; padding:0; background:#fff; cursor:pointer; text-align:left;
  border-radius: var(--album-tile-radius);
  overflow:hidden;
  box-shadow:0 1px 12px rgba(0,0,0,.08);
  transition: transform .15s ease, box-shadow .15s ease;
}
.album-card:hover{ transform: translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.14); }
.album-card.is-active{ outline: 2px solid var(--albums-accent); outline-offset: 2px; }

.album-cover{ width:100%; aspect-ratio:4/3; background:#f3f3f3; }
.album-cover img{ width:100%; height:100%; object-fit:cover; display:block; }
.album-cover .no-cover{
  width:100%; height:100%; display:grid; place-items:center;
  color:#888; font-size:14px;
}

.album-meta{
  display:flex; justify-content:space-between; align-items:center;
  padding:10px 12px; color:#222;
}
.album-title{ font-weight:600; }
.album-count{ font-size:12px; color:#666; }

/* Текущий альбом */
.album-current{ margin-top:14px; }
.album-current__title{
  font-weight:600; margin: 6px 2px 8px;
  color: var(--albums-accent);
}
.album-current__grid{
  display:grid; grid-template-columns: repeat(auto-fill, minmax(220px,1fr));
  gap:12px;
}
.album-current__grid img{
  width:100%; aspect-ratio:4/3; object-fit:cover; display:block;
  border-radius:10px; cursor:pointer;
  box-shadow:0 1px 10px rgba(0,0,0,.06);
}

/* Лайтбокс */
.album-lightbox{ position:fixed; inset:0; display:none; z-index:99999; }
.album-lightbox.open{ display:block; }
.album-lightbox .alb-backdrop{ position:absolute; inset:0; background:rgba(20,24,18,.92); }
.album-lightbox .alb-content{
  position:relative; z-index:1;
  width:min(96vw, 1100px); margin:5vh auto;
  background:#0f120e; border-radius:16px; padding:16px;
  box-shadow:0 10px 40px rgba(0,0,0,.35);
}
.album-lightbox .alb-title{
  color:#fff; font-weight:600; margin:0 0 8px 2px; opacity:.9;
}
.album-lightbox .alb-close,
.album-lightbox .alb-prev,
.album-lightbox .alb-next{
  position:absolute; border:none; border-radius:999px; background:#fff; cursor:pointer;
  width:44px; height:44px;
  box-shadow:0 2px 10px rgba(0,0,0,.2);
  display:flex; align-items:center; justify-content:center; font-size:22px; line-height:1;
}
.album-lightbox .alb-close{ top:12px; right:12px; }
.album-lightbox .alb-prev{ top:calc(50% - 22px); left:12px; }
.album-lightbox .alb-next{ top:calc(50% - 22px); right:12px; }
.album-lightbox .alb-image{
  width:100%; max-height:70vh; object-fit:contain; background:#000;
  border-radius:10px; display:block; margin: 0 auto;
}
.album-lightbox .alb-grid{
  margin-top:8px; display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:10px; max-height:30vh; overflow:auto; background:#0f120e; padding:6px; border-radius:10px;
}
.album-lightbox .alb-grid img{
  width:100%; aspect-ratio:4/3; object-fit:cover; display:block; border-radius:8px; cursor:pointer;
}

/* Прячем любые старые стрелки, если вдруг остались */
.glb-prev, .glb-next, .gallery-prev, .gallery-next, .lightbox-prev, .lightbox-next { display:none !important; }

/* ===== Адаптив ===== */
@media (max-width: 1024px){
  :root{ --albums-card-width: 88%; }
  .albums-grid{ grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); }
  .album-current__grid{ grid-template-columns: repeat(auto-fill, minmax(200px,1fr)); }
}
@media (max-width: 820px){
  .albums-toolbar{ gap:8px; }
  .albums-select{ padding:8px 40px 8px 12px; }
  .albums-grid{ grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); }
  .album-current__grid{ grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); }
}
@media (max-width: 640px){
  :root{ --albums-card-width: 92%; }
  .gallery-section{ padding: 14px; }
  .gallery-card{ padding: 14px; border-radius: 18px; }
  .gallery-card .house-title{ font-size: 22px; padding-bottom: 8px; }
  .albums-label{ font-size:13px; }
  .albums-select{ width: 100%; }
  .albums-grid{ grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .album-current__grid{ grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .album-lightbox .alb-content{ width:94vw; margin:3vh auto; padding:12px; border-radius:12px; }
  .album-lightbox .alb-grid{ grid-template-columns: repeat(3, 1fr); max-height: 32vh; }
  .album-lightbox .alb-close,
  .album-lightbox .alb-prev,
  .album-lightbox .alb-next{ width:48px; height:48px; font-size:24px; }
}
@media (max-width: 400px){
  .albums-grid{ grid-template-columns: 1fr; }
  .album-current__grid{ grid-template-columns: 1fr 1fr; }
}
/* === Плитки и бейдж "+N" для лимита 9 === */
.album-current__grid .album-tile{
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 1px 10px rgba(0,0,0,.06);
  cursor: pointer;
}
.album-current__grid .album-tile img{
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  display: block;
}
.album-current__grid .album-tile__more{
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.55));
  color: #fff; font-weight: 700;
  font-size: clamp(18px, 4vw, 28px);
  text-shadow: 0 2px 8px rgba(0,0,0,.4);
  letter-spacing: .3px;
  user-select: none;
}
/* === Рамки для 9 превью-фото в текущем альбоме === */
:root{
  /* Цвет рамки и фона «паспарту» — в цвет твоей темы */
  --album-frame-border: #ece7d4;
  --album-frame-bg: #f6f3e8;   /* чуть светлее #ece7d4, можно менять */
  --album-frame-pad: 1px;      /* толщина рамки/паспарту */
}

/* Обёртка одной плитки */
.album-current__grid .album-tile{
  position: relative;
  padding: var(--album-frame-pad);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(246,243,232,.98), rgba(246,243,232,.92));
  border: 2px solid var(--album-frame-border);
  box-shadow:
    0 4px 18px rgba(0,0,0,.12),
    inset 0 0 0 1px rgba(255,255,255,.35); /* лёгкий «блик» на рамке */
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  cursor: pointer;
}

/* Картинка внутри рамки */
.album-current__grid .album-tile img{
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  display: block;
  border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.05); /* тонкая внутренняя линия */
}

/* Тонкая «волосяная» внутренняя рамка по краю изображения */
.album-current__grid .album-tile::after{
  content:"";
  position: absolute;
  inset: calc(var(--album-frame-pad) - 2px);
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
  pointer-events: none;
}

/* Ховер — лёгкий подъём и тень */
.album-current__grid .album-tile:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.35);
  border-color: #efe9d8; /* можно чуть светлее при наведении */
}

/* Бейдж +N поверх рамки — остаётся читаемым */
.album-current__grid .album-tile__more{
  position: absolute; inset: var(--album-frame-pad);
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.6));
  color: #fff; font-weight: 800;
  font-size: clamp(18px, 4vw, 28px);
  letter-spacing: .3px; text-shadow: 0 2px 8px rgba(0,0,0,.4);
  border-radius: 10px;
  user-select: none;
}

/* Мобилка: рамку чуть тоньше, чтобы не «съедала» место */
@media (max-width: 640px){
  :root{ --album-frame-pad: 1px; }
  .album-current__grid .album-tile{ border-width: 1.5px; }
}
/* === Mobile tuning: компактные «папки» (альбомы) === */
:root{
  /* Легко настраиваемые параметры для мобилок */
  --mobile-album-min: 120px;     /* минимальная ширина карточки альбома */
  --mobile-album-aspect: 1/1;    /* соотношение сторон обложки на мобилке (1/1 = квадрат) */
}

/* до 820px — чуть мельче сетка */
@media (max-width: 820px){
  .albums-grid{
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 12px;
  }
}

/* до 640px — используем более компактные плитки */
@media (max-width: 640px){
  /* 3 колонки на ширине iPhone 14 */
  .albums-grid{
    grid-template-columns: repeat(auto-fill, minmax(var(--mobile-album-min), 1fr));
    gap: 10px;
  }

  /* делаем обложки квадратными, чтобы экономить высоту */
  .album-cover{ aspect-ratio: var(--mobile-album-aspect); }

  /* компактная подпись */
  .album-meta{ padding: 6px 8px; }
  .album-title{
    font-size: 12px; line-height: 1.2; font-weight: 600;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 100%;
  }
  .album-count{ font-size: 11px; color: #666; }

  /* сами карточки делаем чуть легче визуально */
  .album-card{ border-radius: 12px; box-shadow: 0 1px 8px rgba(0,0,0,.08); }
}

/* очень узкие экраны (390–430px): фиксируем ровно 3 в ряд */
@media (max-width: 430px){
  .albums-grid{
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
}

/* превью внутри выбранного альбома — 3 колонки, чтобы 9 фото были 3×3 */
@media (max-width: 640px){
  .album-current__grid{
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
}

/* рамки у превью оставляем, но делаем тоньше на маленьких экранах */
@media (max-width: 640px){
  .album-current__grid .album-tile{ border-width: 1.5px; }
}