:root{
  --bg: #0c0c0d;
  --bg-alt: #151516;
  --card: #1a1a1c;
  --border: #2a2a2c;
  --text: #f2f1ef;
  --text-dim: #9b9a97;
  --accent: #ff3131;
  --radius: 14px;
  --maxw: 1100px;
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

*{ box-sizing: border-box; }
html,body{ margin:0; padding:0; }
body{
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
.wrap{ max-width: var(--maxw); margin:0 auto; padding: 0 20px; }
a{ color: inherit; }

/* Views: только один экран виден одновременно */
.view{ min-height: 100vh; }
.view[hidden]{ display:none; }

/* Верхняя панель навигации (везде, кроме титульной) */
.topbar{
  position: sticky; top:0; z-index: 20;
  display:flex; align-items:center; flex-wrap: wrap; gap: 8px 18px;
  padding: 16px 20px;
  background: rgba(12,12,13,0.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border);
}
.topbar[hidden]{ display:none; }
.topbar-brand{
  display:flex; align-items:center; gap:8px;
  font-weight:800; font-size:15px; letter-spacing:1.5px; text-decoration:none; color:var(--text);
  white-space: nowrap;
}
.topbar-logo{ height: 20px; width:auto; display:block; }
.topbar-brand span{ color: var(--text-dim); font-weight:600; }
.breadcrumb{ display:flex; align-items:center; gap:8px; font-size:13.5px; color: var(--text-dim); flex-wrap:wrap; }
.breadcrumb a{ color: var(--text-dim); text-decoration:none; font-weight:600; }
.breadcrumb a:hover{ color: var(--accent); }
.breadcrumb .sep{ color:#4a4a4a; }
.breadcrumb .current{ color: var(--text); font-weight:700; }

/* --- Экран 1: титульная страница --- */
.view-home{
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  text-align:center;
  padding: 40px 20px;
  background:
    radial-gradient(circle at 20% 15%, rgba(255,49,49,0.18), transparent 42%),
    radial-gradient(circle at 85% 85%, rgba(255,49,49,0.10), transparent 40%),
    var(--bg);
}
.home-inner{ max-width: 640px; }
.home-logo{
  width: min(90%, 460px);
  height:auto;
  margin: 0 auto;
}
.home-brand-sub{
  font-size: 14px; letter-spacing: 6px; color: var(--accent); font-weight:700;
  margin: 14px 0 30px;
}
.view-home h1{
  font-size: clamp(24px, 4vw, 34px);
  font-weight: 700;
  margin: 0 0 12px;
}
.home-lead{ color: var(--text-dim); font-size: 16px; margin: 0 0 26px; }
.home-quote{
  font-style: italic;
  color: var(--text);
  font-size: 15px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 20px 0;
  margin: 0 0 30px;
  line-height:1.6;
}
.home-stats{
  display:flex; justify-content:center; gap: 34px;
  margin-bottom: 36px;
  flex-wrap: wrap;
}
.home-stats .stat-num{ font-size: 26px; font-weight:800; color: var(--accent); }
.home-stats .stat-label{ font-size:12px; color: var(--text-dim); text-transform:uppercase; letter-spacing:.5px; }
.home-cta{
  display:inline-block;
  background: var(--accent);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  padding: 15px 34px;
  border-radius: 999px;
  font-size:15px;
  transition: transform .15s ease, box-shadow .15s ease;
}
.home-cta:hover{ transform: translateY(-2px); box-shadow: 0 10px 30px rgba(255,49,49,0.35); }
.home-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.home-cta-secondary{
  background:transparent;
  border:1px solid var(--border);
  color:var(--text);
}
.home-cta-secondary:hover{
  border-color:var(--accent);
  background:rgba(255,49,49,0.08);
  box-shadow:none;
}
.home-site-link{ margin-top: 16px; }
.home-site-link a{ color: var(--text-dim); font-size: 13px; text-decoration:none; border-bottom: 1px solid var(--border); padding-bottom: 2px; }
.home-site-link a:hover{ color: var(--accent); border-color: var(--accent); }

/* Прогресс коллекции на главной */
.home-progress{ margin: -6px 0 30px; }
.home-progress-empty{ color: var(--text-dim); font-size: 13.5px; margin: 0 0 10px; }
.home-progress-label{ font-size: 14px; color: var(--text-dim); margin-bottom: 8px; }
.home-progress-label strong{ color: var(--accent); font-size:16px; }

/* «Слово основателя» — сворачиваемый блок на титульной странице */
.founder-word{
  margin: 36px 0 0;
  border-top: 1px solid var(--border);
  padding-top: 26px;
  text-align: left;
}
.founder-word summary{
  cursor: pointer;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--accent);
  list-style: none;
}
.founder-word summary::-webkit-details-marker{ display:none; }
.founder-word summary::after{
  content: ' ▾';
}
.founder-word[open] summary::after{
  content: ' ▴';
}
.founder-word-body{
  margin-top: 22px;
  color: var(--text-dim);
  font-size: 14.5px;
  line-height: 1.8;
}
.founder-word-body p{ margin: 0 0 14px; }
.founder-word-sign{
  color: var(--text);
  font-weight: 700;
  font-style: normal;
  margin-top: 20px !important;
}
.progress-bar{
  height: 6px; border-radius: 999px; background: var(--card); border:1px solid var(--border);
  overflow:hidden; max-width: 320px; margin: 0 auto;
}
.progress-bar-fill{ height:100%; background: var(--accent); border-radius:999px; transition: width .3s ease; }

.share-buttons{ display:flex; flex-wrap:wrap; gap:10px; margin-top: 16px; }
.home-progress .share-buttons{ justify-content:center; }
.home-progress .share-status{ margin-left:auto; margin-right:auto; }
.share-collection-btn{
  background: none;
  border: 1px solid var(--border);
  color: var(--text);
  padding: 11px 22px;
  border-radius: 999px;
  font-size: 14px;
  font-weight:700;
  font-family: inherit;
  cursor:pointer;
  transition: border-color .15s ease, background .15s ease;
}
.share-collection-btn:hover{ border-color: var(--accent); background: rgba(255,49,49,0.08); }
.share-status{ margin-top:10px; font-size:12.5px; color: var(--text-dim); max-width:420px; }

/* Переключатель годов на странице года */
.year-switcher{
  display:flex; flex-wrap:wrap; gap:8px;
  margin: 0 0 22px;
}
.year-switch-pill{
  display:inline-block;
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text-dim);
  text-decoration:none;
  padding: 6px 13px;
  border-radius: 999px;
  font-size: 13px;
  font-weight:700;
  transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.year-switch-pill:hover{ border-color: var(--accent); color: var(--text); }
.year-switch-pill.active{ background: var(--accent); border-color: var(--accent); color:#fff; }

/* --- Общие заголовки страниц --- */
.page-title{
  font-size: clamp(26px, 4vw, 38px);
  font-weight: 800;
  margin: 30px 0 8px;
}
.page-lead{ color: var(--text-dim); font-size:15px; margin: 0 0 24px; }

/* --- Экран 2: оглавление по годам --- */
#search{
  width:100%;
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 13px 18px;
  border-radius: 999px;
  font-size: 15px;
  outline: none;
  font-family: inherit;
  margin-bottom: 18px;
}
#search:focus{ border-color: var(--accent); }

.filters-row{
  display:flex; flex-wrap:wrap; gap:10px; align-items:center;
  margin-bottom: 14px;
}
.filters-row select{
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 10px 14px;
  border-radius: 999px;
  font-size: 13.5px;
  font-family: inherit;
  outline:none;
  cursor:pointer;
}
.filters-row select:focus{ border-color: var(--accent); }
.owned-filter-label{
  display:flex; align-items:center; gap:8px;
  font-size: 13.5px;
  color: var(--text-dim);
  cursor:pointer;
  user-select:none;
}
.owned-filter-label input{ accent-color: var(--accent); width:16px; height:16px; cursor:pointer; }

.years-summary{ margin: 0 0 18px; }
.years-summary-text{
  display:block;
  color: var(--accent);
  font-size: 13.5px;
  font-weight:700;
  margin-bottom: 4px;
}
.year-progress{
  color: var(--accent);
  font-size: 13.5px;
  font-weight:700;
  margin: -4px 0 20px;
}

.years-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 14px;
  margin: 20px 0 60px;
}
.year-card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 26px 20px;
  cursor: pointer;
  text-decoration:none;
  color: var(--text);
  display:flex; flex-direction:column; gap:6px;
  transition: transform .15s ease, border-color .15s ease;
}
.year-card:hover{ transform: translateY(-3px); border-color: var(--accent); }
.year-card .yc-year{ font-size: 30px; font-weight:800; }
.year-card .yc-count{ font-size: 12.5px; color: var(--text-dim); }

.search-results{ margin: 4px 0 30px; }
.search-results .cards-grid{ margin-top: 10px; }
.search-empty{ color: var(--text-dim); padding: 20px 0; }

/* --- Экран 3: модели одного года --- */
.milestone-list{ margin-bottom: 22px; }

.cards-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 18px;
  margin-bottom: 60px;
}

.card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease;
}
.card:hover{ transform: translateY(-3px); border-color:#444; }
.card.owned-card{ border-color: var(--accent); }
.card-photo{
  position: relative;
  aspect-ratio: 1 / 1;
  overflow:hidden;
  background: #111;
}
.card-photo img{ width:100%; height:100%; object-fit: cover; }
.card-body{ padding: 14px 16px 16px; }
.card-date{ font-size: 11.5px; color: var(--accent); font-weight:700; letter-spacing:.5px; text-transform: uppercase; margin-bottom:6px;}
.card-name{ font-size: 15px; font-weight:700; margin: 0 0 8px; line-height:1.3; }
.card-specs{ font-size:12.5px; color: var(--text-dim); }
.card-specs span{ display:block; }

/* Отметка «есть в коллекции» на карточке */
.own-toggle{
  position:absolute; top:8px; right:8px;
  width:30px; height:30px;
  border-radius:50%;
  border: 1.5px solid rgba(255,255,255,0.55);
  background: rgba(12,12,13,0.55);
  backdrop-filter: blur(3px);
  cursor:pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.own-toggle:hover{ transform: scale(1.08); border-color:#fff; }
.own-toggle::after{
  content:"";
  position:absolute; inset:0;
  background: no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  opacity:0;
  transition: opacity .12s ease;
}
.own-toggle.owned{ background: var(--accent); border-color: var(--accent); }
.own-toggle.owned::after{ opacity:1; }

/* Бейдж «Лимитка» — модели с указанным тиражом */
.limited-badge{
  display:inline-block;
  background: var(--accent);
  color:#fff;
  font-size: 10.5px;
  font-weight:800;
  letter-spacing:.5px;
  text-transform:uppercase;
  padding: 4px 9px;
  border-radius: 999px;
}
.limited-badge[hidden]{ display:none; }
.card-photo .limited-badge{
  position:absolute; top:8px; left:8px;
}
.limited-badge.editable{
  cursor:pointer;
}
.limited-badge.editable:hover{
  filter: brightness(1.12);
}
.viewer-date-row{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.viewer-date-row .viewer-date{ margin-bottom:0; }

.card.flash{ animation: flashCard 1.4s ease; }
@keyframes flashCard{
  0%   { box-shadow: 0 0 0 3px var(--accent); }
  70%  { box-shadow: 0 0 0 3px var(--accent); }
  100% { box-shadow: 0 0 0 0 rgba(255,49,49,0); }
}

/* Milestone banner */
.milestone{
  border: 1px dashed #3a3a3c;
  border-radius: var(--radius);
  padding: 16px 20px;
  display:flex;
  align-items:center;
  gap:14px;
  background: linear-gradient(90deg, rgba(255,49,49,0.08), transparent);
  margin-bottom: 14px;
}
.milestone-icon{ font-size:20px; }
.milestone-photo{
  width: 54px; height: 54px;
  object-fit: contain;
  border-radius: 8px;
  background: #0c0c0d;
  border: 1px solid var(--border);
  flex-shrink: 0;
}
.milestone-date{ font-size:11.5px; color: var(--accent); font-weight:700; text-transform:uppercase; letter-spacing:.5px; }
.milestone-note{ font-weight:600; font-size:14.5px; }

.empty-state{ text-align:center; color: var(--text-dim); padding: 60px 0; }

/* --- Раздел наград --- */
.view-awards{
  padding-bottom:64px;
  background:
    radial-gradient(circle at 88% 2%, rgba(255,49,49,0.10), transparent 30%),
    var(--bg);
}
.awards-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  padding-top:12px;
}
.page-kicker{
  color:var(--accent);
  font-size:11.5px;
  font-weight:800;
  letter-spacing:1.5px;
  text-transform:uppercase;
  margin-top:24px;
}
.awards-heading .page-title{ margin-top:8px; }
.awards-heading .page-lead{ max-width:760px; }
.awards-total{
  display:flex;
  align-items:center;
  gap:12px;
  flex-shrink:0;
  padding:0 0 25px;
}
.awards-total strong{
  color:var(--accent);
  font-size:48px;
  line-height:1;
  font-weight:800;
}
.awards-total span{
  color:var(--text-dim);
  font-size:12px;
  line-height:1.45;
  text-transform:uppercase;
  letter-spacing:.5px;
}
.awards-podium{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
  margin:12px 0 26px;
}
.podium-card{
  min-width:0;
  display:flex;
  align-items:flex-start;
  gap:16px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:18px;
  background:linear-gradient(145deg, rgba(255,255,255,.035), transparent 65%), var(--card);
}
.podium-rank{
  width:46px;
  height:46px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  color:#111;
  font-size:17px;
  font-weight:800;
}
.podium-1 .podium-rank{ background:#d8ae54; }
.podium-2 .podium-rank{ background:#b9c0c8; }
.podium-3 .podium-rank{ background:#b87955; }
.podium-label{
  font-size:12px;
  color:var(--text-dim);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.55px;
  margin-bottom:8px;
}
.podium-card ul{
  list-style:none;
  padding:0;
  margin:0;
  font-size:12.5px;
  line-height:1.55;
  color:var(--text);
}
.podium-card li span{ color:var(--text-dim); }
.podium-empty{ color:var(--text-dim); font-style:italic; }
.awards-category-summary{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
  margin:0 0 26px;
}
.award-category-card{
  position:relative;
  min-height:122px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:18px;
  background:var(--card);
  color:var(--text);
  text-align:left;
  font-family:inherit;
  cursor:pointer;
  transition:transform .15s ease, border-color .15s ease, background .15s ease;
}
.award-category-card:hover{
  transform:translateY(-2px);
  border-color:#555;
}
.award-category-card.active{
  border-color:var(--accent);
  background:linear-gradient(145deg, rgba(255,49,49,.18), transparent 70%), var(--card);
}
.award-category-index{
  position:absolute;
  top:5px;
  right:14px;
  color:rgba(255,255,255,.06);
  font-size:52px;
  line-height:1;
  font-weight:800;
}
.award-category-name{
  position:relative;
  font-size:15px;
  font-weight:800;
  line-height:1.3;
}
.award-category-count{
  position:relative;
  color:var(--text-dim);
  font-size:11.5px;
  margin-top:5px;
}
.awards-filters{
  display:grid;
  grid-template-columns:minmax(0, 1.6fr) minmax(0, 1fr);
  gap:24px;
  padding:18px 0 22px;
  border-top:1px solid var(--border);
}
.awards-filter-label{
  color:var(--text-dim);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.8px;
  text-transform:uppercase;
}
.awards-toolbar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:8px 0 0;
}
.award-filter{
  border:1px solid var(--border);
  background:var(--card);
  color:var(--text-dim);
  border-radius:999px;
  padding:8px 14px;
  font-family:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition:border-color .15s ease, color .15s ease, background .15s ease;
}
.award-filter:hover{ border-color:var(--accent); color:var(--text); }
.award-filter.active{ border-color:var(--accent); background:var(--accent); color:#fff; }
.award-year{
  display:grid;
  grid-template-columns:110px minmax(0, 1fr);
  gap:20px;
  padding:26px 0 34px;
  border-top:1px solid var(--border);
}
.award-year-label span{
  display:block;
  font-size:30px;
  line-height:1;
  font-weight:800;
}
.award-year-label small{
  display:block;
  color:var(--text-dim);
  font-size:11.5px;
  margin-top:8px;
}
.awards-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}
.award-card{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--card);
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease;
}
.award-card:hover,
.award-card:focus-visible{
  transform:translateY(-3px);
  border-color:#555;
  outline:none;
}
.award-photo{
  position:relative;
  aspect-ratio:3 / 4;
  overflow:hidden;
  background:#111;
}
.award-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 65%, rgba(0,0,0,.45));
  pointer-events:none;
}
.award-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.award-card:hover .award-photo img{ transform:scale(1.02); }
.award-place{
  position:absolute;
  z-index:1;
  top:10px;
  left:10px;
  border-radius:999px;
  padding:5px 10px;
  color:#111;
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.45px;
  text-transform:uppercase;
  box-shadow:0 4px 16px rgba(0,0,0,.25);
}
.award-place-1{ background:#d8ae54; }
.award-place-2{ background:#b9c0c8; }
.award-place-3{ background:#b87955; }
.award-body{ padding:15px 16px 17px; }
.award-date{
  color:var(--accent);
  font-size:11px;
  font-weight:800;
  letter-spacing:.55px;
  text-transform:uppercase;
  margin-bottom:6px;
}
.award-category-chip{
  display:inline-block;
  max-width:100%;
  color:var(--text-dim);
  border:1px solid var(--border);
  border-radius:999px;
  padding:3px 8px;
  font-size:9.5px;
  font-weight:700;
  line-height:1.25;
  margin:0 0 10px;
}
.award-body h4{
  font-size:16px;
  line-height:1.25;
  margin:0 0 3px;
}
.award-diploma-name{
  color:var(--text-dim);
  font-size:11.5px;
  margin-bottom:13px;
}
.award-event{ font-size:12.5px; font-weight:700; }
.award-edition{
  color:var(--text-dim);
  font-size:11.5px;
  margin-top:2px;
}
.award-nomination{
  color:var(--text-dim);
  font-size:11.5px;
  line-height:1.5;
  border-top:1px solid var(--border);
  margin-top:12px;
  padding-top:11px;
}
.award-open{
  color:var(--text);
  font-size:11.5px;
  font-weight:700;
  margin-top:12px;
}
.awards-empty{
  color:var(--text-dim);
  border-top:1px solid var(--border);
  margin:0;
  padding:34px 0 60px;
}

/* Footer */
.site-footer{ border-top:1px solid var(--border); padding: 28px 0; color: var(--text-dim); font-size:13px; }
.footer-disclaimer{ font-size:12px; line-height:1.6; color: var(--text-dim); opacity:.75; margin: 0 0 18px; max-width: 780px; }
.footer-inner{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; }
.footer-links{ display:flex; flex-wrap:wrap; gap:10px; }
.feedback-link{
  color: var(--text-dim);
  text-decoration:none;
  font-weight:600;
  font-size: 13px;
  border: 1px solid var(--border);
  padding: 9px 16px;
  border-radius: 999px;
  transition: border-color .15s ease, color .15s ease;
  white-space: nowrap;
}
.feedback-link:hover{ border-color: var(--accent); color: var(--text); }

.search-empty-feedback{ margin-top:10px; }
.search-empty-feedback a{ color: var(--accent); font-weight:600; text-decoration:none; }
.search-empty-feedback a:hover{ text-decoration:underline; }

/* Viewer (flip mode) */
.viewer{
  position: fixed; inset:0; z-index: 100;
  background: rgba(6,6,7,0.97);
  display:flex; align-items:center; justify-content:center;
  padding: 20px;
}
.viewer[hidden]{ display:none; }
.viewer-card{
  max-width: 1000px;
  width:100%;
  max-height: 90vh;
  display:flex;
  background: var(--card);
  border-radius: var(--radius);
  overflow:hidden;
  border:1px solid var(--border);
}
.viewer-image-wrap{
  flex: 1.2;
  background:#111;
  display:flex; align-items:center; justify-content:center;
  min-width:0;
}
.viewer-image-wrap img{ max-width:100%; max-height: 80vh; object-fit:contain; }
.viewer-info{ flex:1; padding: 34px 34px; overflow-y:auto; }
.viewer-date{ color: var(--accent); font-weight:700; font-size:13px; letter-spacing:.5px; text-transform:uppercase; margin-bottom:10px; }
.viewer-info h2{ font-size: 26px; margin:0 0 20px; line-height:1.25; }
.viewer-specs{ margin:0 0 24px; }
.viewer-specs div{ display:flex; gap:8px; padding:8px 0; border-bottom:1px solid var(--border); font-size:14px; }
.viewer-specs dt{ color: var(--text-dim); min-width:90px; }
.viewer-specs dd{ margin:0; font-weight:600; }

.viewer-own-toggle{
  display:flex; align-items:center; gap:10px;
  background: var(--bg-alt);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 11px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight:600;
  cursor:pointer;
  font-family: inherit;
  margin-bottom: 22px;
  transition: border-color .15s ease, background .15s ease;
}
.viewer-own-toggle:hover{ border-color: var(--accent); }
.viewer-own-toggle .viewer-own-check{
  width:18px; height:18px; border-radius:50%;
  border: 1.5px solid var(--text-dim);
  flex-shrink:0;
  position:relative;
}
.viewer-own-toggle.owned{ background: rgba(255,49,49,0.12); border-color: var(--accent); }
.viewer-own-toggle.owned .viewer-own-check{
  background: var(--accent); border-color: var(--accent);
}
.viewer-own-toggle.owned .viewer-own-check::after{
  content:"";
  position:absolute; inset:0;
  background: no-repeat center/10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

.viewer-position{ color: var(--text-dim); font-size:13px; }
.viewer-close{
  position:absolute; top:18px; right:24px;
  background:none; border:none; color:#fff; font-size:34px; line-height:1;
  cursor:pointer; z-index:2;
}
.viewer-nav{
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--border);
  color:#fff;
  width:52px; height:52px;
  border-radius:50%;
  font-size:28px;
  cursor:pointer;
  flex-shrink:0;
  margin: 0 14px;
}
.viewer-nav:hover{ background: var(--accent); border-color: var(--accent); }

@media (max-width: 760px){
  .awards-heading{ align-items:flex-start; }
  .awards-total{ padding-top:34px; }
  .awards-podium{ grid-template-columns:1fr; }
  .awards-category-summary{ grid-template-columns:1fr; }
  .award-category-card{ min-height:96px; }
  .awards-filters{ grid-template-columns:1fr; gap:16px; }
  .award-year{ grid-template-columns:1fr; gap:14px; }
  .award-year-label{ display:flex; align-items:baseline; gap:10px; }
  .award-year-label small{ margin-top:0; }
  .awards-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .viewer{ padding:0; }
  .viewer-card{ flex-direction:column; max-height:100vh; border-radius:0; overflow-y:auto; }
  .viewer-image-wrap img{ max-height: 46vh; }
  .viewer-info{ padding: 22px 22px 90px; }
  .viewer-nav{ position:fixed; bottom:16px; z-index:3; }
  .viewer-prev{ left:16px; }
  .viewer-next{ right:16px; }
  .viewer-close{ top:10px; right:14px; }
}

/* Мелкие экраны (телефоны) — чуть плотнее кнопки и отступы, чтобы ничего не вылезало за край */
@media (max-width: 420px){
  .view-home{ padding: 32px 16px; }
  .home-cta{ padding: 13px 22px; font-size: 14px; }
  .home-actions{ align-items:stretch; }
  .home-actions .home-cta{ width:100%; }
  .share-collection-btn{ padding: 10px 16px; font-size: 13px; }
  .share-buttons{ width: 100%; }
  .home-progress .share-buttons{ flex-direction: column; align-items: stretch; }
  .home-progress .share-buttons .share-collection-btn{ width: 100%; }
  .home-stats{ gap: 20px; }
  .founder-word-body{ font-size: 13.5px; }
  .awards-heading{ display:block; }
  .awards-total{ padding:0 0 20px; }
  .awards-total strong{ font-size:40px; }
  .awards-grid{ grid-template-columns:1fr; }
  .award-photo{ aspect-ratio:4 / 5; }
}
