/* =========================================================================
   Dekorasyon kabuğu — taşınma sineması ve ana oyundaki "Ev Alışverişi" düğmesi
   -------------------------------------------------------------------------
   dekor.css mini oyunun kendi içini biçimlendirir; burası onu ana oyuna
   bağlayan parçaları. Ana oyunun paletiyle aynı, seçiciler dt- / dk-kopru-
   önekli olduğu için ana oyunun stiline karışmaz.
   ========================================================================= */

/* ===================================================== taşınma sineması === */
.dt-perde{
  position:fixed; inset:0; z-index:210;
  background:#07050a;
  overflow:hidden; cursor:pointer;
  opacity:0; transition:opacity .6s ease;
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
}
.dt-perde.dt-acik{opacity:1}
.dt-perde.dt-kapaniyor{opacity:0; transition-duration:.8s}

/* --- birinci perde: kart postal, kapaktaki gibi yavaşça yaklaşır --- */
.dt-foto{position:absolute; inset:0; opacity:1; transition:opacity 1s ease}
.dt-foto-gorsel{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 45%;
  filter:sepia(.24) contrast(1.06) saturate(.82) brightness(1.02);
  transform:scale(1.09);
  animation:dtYaklas 7s ease-out forwards;
}
@keyframes dtYaklas{to{transform:scale(1)}}
.dt-tul{
  position:absolute; inset:0;
  background:
    linear-gradient(rgba(20,14,8,.30) 0%, rgba(20,14,8,0) 30%, rgba(18,12,6,.72) 100%),
    radial-gradient(ellipse at 50% 46%, rgba(0,0,0,0) 44%, rgba(10,7,3,.66) 100%);
}
.dt-cerceve{
  position:absolute; inset:clamp(10px,2.2vmin,24px);
  border:1px solid rgba(140,100,40,.55);
  box-shadow:
    inset 0 0 0 4px rgba(233,220,190,.10),
    inset 0 0 0 5px rgba(140,100,40,.28),
    0 0 0 1px rgba(12,8,4,.35);
  pointer-events:none;
}
.dt-perde.dt-yazida .dt-foto{opacity:0}

/* --- ikinci perde: siyah zemin, tek cümle --- */
.dt-yazit{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  padding:clamp(20px,6vw,64px);
  opacity:0; transition:opacity 1s ease;
}
.dt-perde.dt-yazida .dt-yazit{opacity:1}
/* ikinci sokak fotoğrafı: yalnız bir doku olarak, yazının altında */
.dt-yazit-fon{
  position:absolute; inset:0;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  filter:sepia(.4) saturate(.5) brightness(.5) contrast(1.05);
  opacity:.20;
}
.dt-yazit::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 50% 50%, rgba(7,5,10,.35) 0%, rgba(7,5,10,.92) 78%);
}
.dt-metin{
  position:relative; z-index:1;
  margin:0; max-width:24em; text-align:center;
  font-size:clamp(17px,2.6vw,29px); line-height:1.62; letter-spacing:.04em;
  color:#e9dcbe;
  text-shadow:0 2px 12px rgba(0,0,0,.9);
  opacity:0; transform:translateY(12px);
  transition:opacity 1.1s ease .45s, transform 1.1s ease .45s;
}
.dt-perde.dt-yazida .dt-metin{opacity:.94; transform:none}

.dt-gec{
  position:absolute; right:clamp(14px,3vw,32px); bottom:clamp(12px,2.6vw,26px);
  margin:0; z-index:2;
  font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  color:#d8c8a6; opacity:.34;
}

@media (prefers-reduced-motion:reduce){
  .dt-foto-gorsel{animation:none; transform:none}
  .dt-metin{transition-duration:.01s}
}

/* ============================================ ana oyundaki alışveriş düğmesi */
.dk-kopru-dugme{
  position:fixed; left:0; top:50%; transform:translateY(-50%);
  z-index:60;
  display:flex; align-items:center; gap:9px;
  padding:11px 15px 11px 12px;
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  font-size:13px; letter-spacing:.11em; text-transform:uppercase;
  color:#e9dcbe; cursor:pointer;
  background:linear-gradient(rgba(46,29,14,.94), rgba(26,16,7,.94));
  border:1px solid rgba(200,163,60,.55); border-left:0;
  border-radius:0 4px 4px 0;
  box-shadow:4px 4px 16px rgba(0,0,0,.5);
  transition:filter .15s ease, transform .12s ease, opacity .25s ease;
  opacity:.82;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.dk-kopru-dugme svg{width:21px; height:21px; flex:none; color:#c8a33c}
.dk-kopru-dugme[hidden]{display:none}
@media (hover:hover){
  .dk-kopru-dugme:hover{opacity:1; transform:translateY(-50%) translateX(2px); filter:brightness(1.18)}
}
.dk-kopru-dugme:focus-visible{outline:2px solid #c8a33c; outline-offset:3px}

.dk-kopru-bilgi{
  position:fixed; left:0; top:50%; z-index:60;
  transform:translateY(calc(-50% + 44px));
  width:30px; height:30px; padding:0;
  display:grid; place-items:center;
  font-family:inherit; font-size:15px; font-style:italic; font-weight:600; line-height:1;
  color:#c8a33c; cursor:pointer;
  background:rgba(26,16,8,.86);
  border:1px solid rgba(200,163,60,.5); border-left:0;
  border-radius:0 50% 50% 0;
  opacity:.7; transition:opacity .2s ease, filter .15s ease;
}
.dk-kopru-bilgi[hidden]{display:none}
@media (hover:hover){ .dk-kopru-bilgi:hover{opacity:1; filter:brightness(1.2)} }
.dk-kopru-bilgi:focus-visible{outline:2px solid #c8a33c; outline-offset:3px}

/* dar ekran: sol kenarda yer yok, alt köşeye in */
@media (max-width:760px){
  .dk-kopru-dugme{
    top:auto; bottom:12px; transform:none;
    padding:9px 13px 9px 11px; font-size:11.5px; gap:7px;
  }
  @media (hover:hover){
    .dk-kopru-dugme:hover{transform:translateX(2px)}
  }
  .dk-kopru-bilgi{top:auto; bottom:56px; transform:none}
}

/* ----------------------------------------------------- bilgi penceresi ---- */
.dk-kopru-perde{
  position:fixed; inset:0; z-index:120;
  display:none; align-items:center; justify-content:center; padding:20px;
  background:rgba(8,5,2,.82);
}
.dk-kopru-perde.dk-acik{display:flex}
.dk-kopru-kagit{
  position:relative;
  width:min(520px,94vw); max-height:88vh; overflow-y:auto;
  padding:30px clamp(20px,4vw,40px) 26px;
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  color:#2a1c10;
  background:
    linear-gradient(rgba(255,255,255,.14), rgba(120,90,50,.10)),
    radial-gradient(120% 80% at 20% 0%, #f2e7cc 0%, #e9dcbe 45%, #d8c69f 100%);
  border:1px solid rgba(70,50,25,.5); border-radius:3px;
  box-shadow:0 18px 45px rgba(0,0,0,.55), inset 0 0 60px rgba(120,90,45,.28);
}
.dk-kopru-kagit::after{
  content:""; position:absolute; inset:8px; pointer-events:none;
  border:1px solid rgba(90,66,35,.35);
}
.dk-kopru-kagit .dk-kopru-muhur{
  margin:0; text-align:center; text-align-last:center; color:#c8a33c; font-size:24px; line-height:1;
  text-shadow:0 1px 0 rgba(255,255,255,.4);
}
.dk-kopru-kagit h2{
  margin:.3em 0 0; text-align:center;
  font-family:"Aref Ruqaa","Amiri",serif;
  font-size:clamp(21px,4vw,28px); font-weight:700; letter-spacing:.03em;
}
.dk-kopru-rule{
  height:1px; margin:17px auto; width:78%;
  background:linear-gradient(90deg,transparent,rgba(90,66,35,.75),transparent);
}
.dk-kopru-kagit p{
  margin:0 0 .85em; font-size:15.5px; line-height:1.65;
  text-align:justify; text-align-last:left; hyphens:auto;
}
.dk-kopru-kagit p:last-of-type{margin-bottom:0}
.dk-kopru-kapat{
  display:block; margin:22px auto 0; padding:11px 30px;
  font-family:inherit; font-size:14px; letter-spacing:.14em; text-transform:uppercase;
  color:#e9dcbe; cursor:pointer;
  background:linear-gradient(#4a2f1c,#33200f);
  border:1px solid #c8a33c; border-radius:2px;
  box-shadow:0 6px 18px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,220,150,.25);
}
.dk-kopru-kapat:hover{filter:brightness(1.15)}

/* mini oyunun kendi ekranı ana oyunda tam sayfa açılır */
#dekor-ekran{
  position:fixed; inset:0; z-index:100;
  display:none; overflow:auto;
  background:#100c07;
}
#dekor-ekran.dk-acik{display:block}