/* =========================================================
   FOREST THEME — тёмный мшистый лес + каменные рамки
   Подключается последним, переопределяет базовое оформление.
   Картинки: assets/forest-bg.jpg, assets/frame-*.png, logo.png
========================================================= */
:root{
  --bg:#0A1311;
  --bg-secondary:#122019;
  --ink:#E9EFE3;
  --ink-secondary:#E8B35A;
  --muted:rgba(233,239,227,.82);
  --muted2:rgba(233,239,227,.62);
  --border:rgba(146,178,118,.26);
  --border-hover:rgba(232,168,70,.48);
  --shadow:0 20px 60px rgba(0,0,0,.7), 0 0 0 1px rgba(146,178,118,.12);
  --shadow2:0 12px 40px rgba(0,0,0,.55), 0 0 0 1px rgba(146,178,118,.10);
  --card-bg:rgba(8,18,15,.84);
  --card-bg-hover:rgba(22,40,32,.80);
  --header-bg:linear-gradient(180deg, rgba(6,14,12,.94), rgba(8,18,15,.82));
  --btn-bg:rgba(18,34,28,.78);
  --btn-bg-hover:rgba(40,66,48,.78);
  --input-bg:rgba(6,14,12,.72);
  --accent2:#9CCB57;
  --accent3:#6FC7B8;
  --moss:#8DB866;

  /* рамка: 9-slice, края повторяются плиткой (без растягивания) */
  --frame-wide:url("../assets/frame-wide.png");
  --frame-square:url("../assets/frame-square.png");
  --frame-card:url("../assets/frame-card.png");
}
[data-theme="light"]{
  --bg:#D9E2D4;
  --bg-secondary:#C9D6C3;
  --ink:#16251D;
  --ink-secondary:#3E5238;
  --muted:rgba(22,37,29,.84);
  --muted2:rgba(22,37,29,.66);
  --border:rgba(60,92,52,.28);
  --border-hover:rgba(60,92,52,.48);
  --card-bg:rgba(236,242,231,.90);
  --card-bg-hover:rgba(244,248,240,.96);
  --header-bg:linear-gradient(180deg, rgba(228,236,223,.96), rgba(214,225,208,.92));
  --btn-bg:rgba(232,239,227,.92);
  --btn-bg-hover:rgba(214,226,206,.98);
  --input-bg:rgba(244,248,240,.94);
  --accent:#9A5E0C;
  --accent-hover:#74450A;
}

/* ---------- ФОН: лес на всю страницу ---------- */
body{ background:#07100E; }
[data-theme="light"] body{ background:#D9E2D4; }
body{ background-image:none !important; }

.bgBase{
  background:
    radial-gradient(120% 90% at 50% 40%, rgba(3,9,8,0) 0%, rgba(3,9,8,.55) 100%),
    linear-gradient(180deg, rgba(4,10,9,.34) 0%, rgba(4,10,9,.52) 60%, rgba(4,10,9,.80) 100%),
    url("../assets/forest-bg.jpg") center top / cover no-repeat;
}
[data-theme="light"] .bgBase{
  background:
    linear-gradient(180deg, rgba(226,236,224,.80) 0%, rgba(214,226,210,.86) 100%),
    url("../assets/forest-bg.jpg") center top / cover no-repeat;
}
.bgAurora{ opacity:.22; }
.liquid{ opacity:.14; }
.bgWrap::after{ opacity:.35; }

/* ---------- ШАПКА ---------- */
header{
  border-bottom:2px solid transparent;
  border-image:linear-gradient(90deg, transparent, rgba(146,178,118,.55) 20%, rgba(232,168,70,.55) 50%, rgba(146,178,118,.55) 80%, transparent) 1;
  box-shadow:0 6px 24px rgba(0,0,0,.35);
}
.brand img{
  border-radius:12px;
  object-fit:cover;
  border:1px solid rgba(146,178,118,.45);
  box-shadow:0 0 0 2px rgba(0,0,0,.35), 0 0 14px rgba(232,168,70,.25);
}

/* ---------- ГЕРОЙ: каменная рамка ---------- */
.heroWrap{
  border:44px solid transparent;
  border-image:var(--frame-wide) 59 / 44px round;
  border-radius:0;
  background:rgba(5,12,10,.30);
  background-clip:padding-box;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  overflow:visible;
  filter:drop-shadow(0 22px 40px rgba(0,0,0,.55));
}
[data-theme="light"] .heroWrap{ background:rgba(232,240,228,.62); background-clip:padding-box; }
.heroWrap::before{ display:none; }
.heroWrap::after{
  inset:0;
  background:radial-gradient(700px 420px at 80% 30%, rgba(232,168,70,.16), transparent 70%);
  opacity:.5;
}
.heroBg{
  background:
    radial-gradient(700px 420px at 15% 10%, rgba(90,140,90,.16), transparent 60%),
    linear-gradient(135deg, rgba(3,9,8,.30), rgba(3,9,8,.05) 50%, rgba(3,9,8,.30));
  opacity:1;
}
.heroBg::before{ background:none; }
.heroBg::after{ display:none; }
[data-theme="light"] .heroBg{
  background:linear-gradient(135deg, rgba(255,255,255,.35), rgba(255,255,255,0) 50%, rgba(200,220,195,.35));
}
.heroGrid{ padding:28px 28px; }
.heroGrid::before{ display:none; }

/* панели внутри героя — мягкое тёмное стекло */
.panel{
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(6,15,12,.66);
}
.panel::before{
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), transparent 18%),
    radial-gradient(360px 220px at 8% 0%, rgba(141,184,102,.12), transparent 72%);
}
[data-theme="light"] .panel{ border:1px solid var(--border); background:rgba(238,244,234,.80); }
[data-theme="light"] .panel:hover{ background:rgba(246,250,243,.94); border-color:var(--border-hover); }

/* логотип: плавно растворяется в рамке */
.logoFrame{
  background:transparent;
  border:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  overflow:visible;
}
.logoFrame:hover{ transform:translateY(-3px); }
.logoFrame::after{ display:none; }
.logoFrame{
  border:36px solid transparent;
  border-image:var(--frame-square) 59 / 36px round;
  border-radius:0;
  background:#07100E;
  background-clip:padding-box;
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.55));
  padding:0;
  overflow:hidden;
  align-self:center;
  justify-self:center;
  width:380px;
  max-width:100%;
  height:auto;
  aspect-ratio:1/1;
}
.logoFrame::before{ display:none; }
.logoFrame img{
  width:100%;
  height:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  display:block;
  -webkit-mask-image:none;
  mask-image:none;
  filter:none;
}


/* ---------- ПОДВАЛ ---------- */
footer{
  background:linear-gradient(180deg, rgba(4,10,9,.88), rgba(3,8,7,.97));
  border-top:2px solid transparent;
  border-image:linear-gradient(90deg, transparent, rgba(146,178,118,.5) 25%, rgba(232,168,70,.5) 50%, rgba(146,178,118,.5) 75%, transparent) 1;
  color:rgba(233,239,227,.86);
}
[data-theme="light"] footer{ background:linear-gradient(180deg, rgba(214,226,208,.94), rgba(200,214,194,.98)); color:#16251D; }

/* ---------- КАРТОЧКИ РАЗДЕЛОВ ---------- */
.card{
  border:22px solid transparent;
  border-image:var(--frame-card) 59 / 22px round;
  border-radius:0;
  background:rgba(7,16,13,.78);
  background-clip:padding-box;
  box-shadow:none;
  filter:drop-shadow(0 12px 20px rgba(0,0,0,.45));
  padding:14px 18px;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.card:hover{ filter:drop-shadow(0 16px 26px rgba(0,0,0,.55)) drop-shadow(0 0 12px rgba(232,168,70,.18)); }
[data-theme="light"] .card{ background:rgba(236,242,231,.86); background-clip:padding-box; }

/* ---------- МОДАЛЬНЫЕ ОКНА ---------- */
.modal{
  border:32px solid transparent;
  border-image:var(--frame-wide) 59 / 32px round;
  border-radius:0;
  background:var(--card-bg);
  background-clip:padding-box;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#ticketsModal .modal{ border-radius:0; }
.modalOverlay{ background:rgba(2,6,5,.66); }
[data-theme="light"] .modalOverlay{ background:rgba(20,32,24,.46); }

/* ---------- КНОПКИ / ПОЛЯ: мшистый оттенок ---------- */
.btn,.miniBtn{ border-color:var(--border); }
.btn:hover,.miniBtn:hover{ border-color:var(--border-hover); }
.input,.select,.textarea,input,select,textarea{ border-color:var(--border); }
::selection{ background:rgba(141,184,102,.45); color:#fff; }

/* ---------- МОБИЛЬНЫЕ ---------- */
@media (max-width:720px){
  .heroWrap{ border-width:24px; border-image-width:24px; }
  .heroGrid{ padding:14px 8px; gap:18px; min-height:0; }
  .modal{ border-width:20px; border-image-width:20px; }
  .card{ border-width:16px; border-image-width:16px; }
  .logoFrame{ border-width:26px; border-image-width:26px; width:min(360px, 92%); }
}

/* ---------- ГЕРОЙ НА ВСЮ ШИРИНУ ЭКРАНА ---------- */
.hero{ padding:10px 0 10px; }
.hero > .container{ width:calc(100% - 20px); max-width:none; }
.heroGrid{ align-items:center; padding:28px clamp(20px, 3.5vw, 70px); gap:clamp(24px, 4vw, 80px); }
@media (min-width:901px){
  .heroWrap{ min-height:calc(100vh - 128px); display:flex; }
  .heroWrap > .heroGrid{ flex:1; }
}

@media (min-width:901px){
  .heroGrid{ grid-template-columns:minmax(0,1fr) auto; }
  .heroGrid > .logoFrame{ justify-self:end; }
}

/* ---------- ШАПКА: бренд и меню слева, профиль и «Играть» справа ---------- */
@media (min-width:1000px){
  header > .container{ width:calc(100% - 48px); max-width:none; }
  header .nav{ justify-content:flex-start; gap:clamp(20px, 3vw, 56px); flex-wrap:nowrap; }
  header .nav nav{ margin-right:auto; }
  header .nav nav ul{ justify-content:flex-start; flex-wrap:nowrap; }
}

/* ---------- УБРАТЬ «ПЯТНО» ПРИ НАВЕДЕНИИ ---------- */
.panel::after,
.card::after,
.logoFrame::after{ display:none !important; }
.panel:hover{ transform:none; box-shadow:0 18px 40px rgba(0,0,0,.16); }

/* ---------- Инкубатор ---------- */
#incubatorModal .incChamber{display:flex;gap:16px;align-items:center;margin-bottom:14px}
#incubatorModal .incEgg{font-size:44px;line-height:1;filter:drop-shadow(0 0 12px rgba(140,200,110,.5))}
#incubatorModal .incEgg.dim{opacity:.55;filter:none}
#incubatorModal .incTiers{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:12px 0}
#incubatorModal .incTier{padding:10px 6px;text-align:center;border:1px solid rgba(255,255,255,.12);border-radius:10px;opacity:.55;display:flex;flex-direction:column;gap:4px;font-size:12px}
#incubatorModal .incTier.on{opacity:1;border-color:rgba(150,205,110,.7);background:rgba(90,140,60,.18)}
#incubatorModal .incTier.declined{opacity:.6}
#incubatorModal .incOffer{margin:14px 0;padding:16px;border:1px solid rgba(150,205,110,.6);border-radius:12px;background:rgba(60,100,40,.22)}
#incubatorModal .incOffer h3{margin:4px 0;font-size:22px}
#incubatorModal .incHow{margin:8px 0 0;padding-left:20px;display:grid;gap:8px;font-size:14px;line-height:1.45}
#incubatorModal .incTaken{margin-top:12px;font-size:13px;opacity:.85}
@media (max-width:720px){#incubatorModal .incTiers{grid-template-columns:repeat(3,1fr)}}

/* Разделы сайта: все карточки одного размера */
.grid3{ grid-auto-rows:1fr; }
