/* dailywall.app/2027 — sayfa katmanı (v8.css + dilek/kagit.css üstüne). Kaynak: tools/site8/statik/dilek/sayfa.css.
   Aşamalar html[data-asama=yakinda|acik|dalga|ani] (sayfa.js /dilek/durum'dan koyar; JS yoksa "acik" metinleri). */

/* ---------- Hero ---------- */
.dilek-hero { padding-bottom: 70px; }
.dilek-hero h1 { font-size: clamp(48px, 7.4vw, 104px); }
.dilek-hero h1 em.isik { font-style: italic; }
.dilek-hero .lede { margin-top: 2px; }
.hero-notlar { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.hero-notlar .not { position: absolute; pointer-events: auto; animation: suzul 7s ease-in-out infinite; }
.hero-notlar .not:nth-child(2) { animation-delay: -2s; } .hero-notlar .not:nth-child(3) { animation-delay: -4s; } .hero-notlar .not:nth-child(4) { animation-delay: -1s; } .hero-notlar .not:nth-child(5) { animation-delay: -3s; }
.hero-notlar .hn1 { left: 3.5%; top: 25%; } .hero-notlar .hn2 { left: 10%; top: 55%; } .hero-notlar .hn3 { right: 4%; top: 22%; } .hero-notlar .hn4 { right: 9.5%; top: 54%; } .hero-notlar .hn5 { left: 1%; top: 80%; }
@media (max-width: 1240px) { .hero-notlar .hn2, .hero-notlar .hn4, .hero-notlar .hn5 { display: none; } .hero-notlar .hn1 { left: 1%; } .hero-notlar .hn3 { right: 1%; } }
@media (max-width: 1020px) { .hero-notlar { display: none; } }

.sayac-kagit {
  position: relative; display: grid; grid-template-columns: auto auto; gap: 0; align-items: stretch; margin: 26px auto 0; max-width: 640px; width: 100%;
  background: var(--kart); border-radius: 18px; box-shadow: var(--golge-buyuk), 0 0 0 1px var(--cizgi); text-align: left; rotate: -.6deg;
}
.sayac-kagit::before { content: ""; position: absolute; top: -13px; left: 50%; width: 120px; height: 28px; translate: -50% 0; rotate: 2deg; opacity: .9;
  background: repeating-linear-gradient(90deg, #FFD25A 0 16px, #F26B5B 16px 32px, #2F7FE0 32px 48px); clip-path: polygon(2% 0, 98% 6%, 100% 50%, 98% 94%, 2% 100%, 0 50%); }
.sayac-sol { padding: 22px 26px; border-right: 2px dashed var(--cizgi-2); display: grid; align-content: center; gap: 4px; }
.sayac-sayi { font: 700 clamp(40px, 5vw, 56px)/1 var(--serif); letter-spacing: -.03em; font-variant-numeric: lining-nums tabular-nums; }
.sayac-sol > span { color: var(--soluk); font-size: 16px; }
.sayac-sol > span b { color: var(--yazi); }
.sayac-sag { padding: 18px 22px; display: grid; align-content: center; gap: 8px; }
.geri-baslik { font: 650 12px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--vurgu); }
.geri { display: flex; gap: 8px; }
.geri span { display: grid; justify-items: center; min-width: 62px; padding: 9px 6px 7px; border-radius: 12px; background: var(--zemin-2); box-shadow: inset 0 0 0 1px var(--cizgi); }
.geri b { font: 700 28px/1 var(--serif); font-variant-numeric: tabular-nums lining-nums; }
.geri small { font-size: 11px; color: var(--silik); margin-top: 4px; letter-spacing: .04em; }
@media (max-width: 640px) {
  .sayac-kagit { grid-template-columns: 1fr; text-align: center; }
  .sayac-sol { border-right: 0; border-bottom: 2px dashed var(--cizgi-2); padding: 20px; }
  .sayac-sag { justify-items: center; padding: 16px 12px 18px; }
  .geri span { min-width: 0; width: 64px; }
}
.dilek-hero .dugmeler { margin-top: 26px; }

/* ---------- Durumlar ---------- */
.acilis-serit { display: none; }
html[data-asama="yakinda"] .acilis-serit { display: flex; }
html[data-asama="dalga"] .durum-rozet b { background: #E23B3B; }

/* Açılış günü */
.acilis-serit { align-items: center; gap: 14px; max-width: 860px; margin: -24px auto 28px; padding: 14px 18px; border-radius: 16px; background: var(--sari-acik); color: #3A2E1A; box-shadow: var(--golge); }
.acilis-ikon { font-size: 26px; }
.acilis-serit p { font-size: 15.5px; }

/* 31 Aralık gece teması */
html[data-asama="dalga"] {
  --zemin: #0D1330; --zemin-2: #121A3D; --kart: #18214A; --kart-2: #1C2652; --yazi: #FFF6E2; --soluk: #C9C6DA; --silik: #9C9AB8;
  --cizgi: rgba(255,246,226,.12); --cizgi-2: rgba(255,246,226,.22); --vurgu: #FFD25A; --isaret: rgba(255,210,90,.35);
  --dugme: #FFD25A; --dugme-yazi: #1F1A14; --doku: none;
  --golge: 0 1px 2px rgba(0,0,0,.4), 0 16px 36px -16px rgba(0,0,0,.8); --golge-buyuk: 0 2px 6px rgba(0,0,0,.4), 0 40px 80px -36px rgba(0,0,0,.9);
  --hero-isik: radial-gradient(900px 560px at 50% -10%, rgba(255,196,92,.28), transparent 70%), radial-gradient(700px 480px at 85% 30%, rgba(120,90,255,.22), transparent 70%), radial-gradient(700px 480px at 10% 40%, rgba(47,127,224,.22), transparent 70%);
}
html[data-asama="dalga"] body { background: radial-gradient(1400px 900px at 50% -200px, #26306A, transparent 70%), #0D1330; }
html[data-asama="dalga"] .isiklar { color: rgba(255,246,226,.35); }
html[data-asama="dalga"] .acilis-serit { display: none; }
html[data-asama="dalga"] #nasil, html[data-asama="dalga"] #sss { background: none; }
html[data-asama="dalga"] .sevilen-bolum { display: none; }
.havai-hero { position: absolute; inset: 0; display: none; }
html[data-asama="dalga"] .havai-hero { display: block; }

.canli-nokta { width: 10px; height: 10px; border-radius: 50%; background: #FF4D4D; box-shadow: 0 0 0 0 rgba(255,77,77,.6); animation: nabiz 1.6s ease-out infinite; }
@keyframes nabiz { 0% { box-shadow: 0 0 0 0 rgba(255,77,77,.6); } 100% { box-shadow: 0 0 0 14px rgba(255,77,77,0); } }

/* ---------- Duvar ---------- */
.duvar-bolum { padding-top: clamp(70px, 8vw, 110px); }
.suzgec { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 auto 26px; }
.suzgec button { display: inline-flex; align-items: center; gap: 7px; padding: 9px 15px; border-radius: 999px; border: 1px solid var(--cizgi-2); background: var(--kart); color: var(--soluk); font-weight: 600; font-size: 14.5px; cursor: pointer; transition: .2s; }
.suzgec button svg { width: 16px; height: 16px; }
.suzgec button:hover { color: var(--yazi); border-color: var(--yazi); }
.suzgec button[aria-pressed="true"] { background: var(--dugme); color: var(--dugme-yazi); border-color: var(--dugme); }
.suzgec-ulke { display: inline-flex; align-items: center; gap: 8px; padding: 6px 8px 6px 14px; border-radius: 999px; background: var(--mavi-acik); color: #123E73; font-weight: 650; font-size: 14.5px; }
.suzgec-ulke button { border: 0; padding: 3px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(0,0,0,.08); color: inherit; }
.suzgec-ulke svg { width: 14px; height: 14px; }
@media (max-width: 640px) {
  .suzgec { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; margin-inline: -20px; padding: 2px 20px; }
  .suzgec::-webkit-scrollbar { display: none; }
  .suzgec button { flex: none; }
}

.duvar-mantar { padding: 58px 34px 46px; }
.duvar-parca { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 34px 14px; --w: 164px; }
.duvar-parca .not { --w: 164px; }
.duvar-parca > *:nth-child(2n) { translate: 0 14px; }
.duvar-parca > *:nth-child(3n) { translate: 0 -6px; }
.duvar-parca.giris > * { animation: as .6s cubic-bezier(.34,1.56,.64,1) both; animation-delay: calc(var(--i, 0) * 28ms); }
@keyframes as { from { opacity: 0; transform: translateY(-26px) scale(1.08) rotate(4deg); } to { opacity: 1; transform: none; } }
.duvar-mantar .havai { border-radius: 18px; }
@media (max-width: 1180px) { .duvar-parca { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 1020px) { .duvar-parca { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .duvar-mantar { padding: 40px 12px 30px; margin-inline: -8px; border-radius: 14px; box-shadow: inset 0 0 0 7px #9C6A3E, inset 0 10px 30px rgba(70,40,15,.35), 0 30px 60px -30px rgba(70,48,24,.55); }
  .duvar-mantar::before { border-width: 7px; }
  .duvar-parca { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 10px; }
  .duvar-parca .not, .duvar-parca { --w: 146px; }
}
.duvar-not { text-align: center; margin-top: 18px; font: 19px/1.3 var(--hand); color: var(--soluk); rotate: -.6deg; }

/* ---------- En sevilenler ---------- */
.sevilen-bolum { padding-top: 40px; }
.sevilen-bas { margin-bottom: 30px; }
.sevilen-serit { display: flex; gap: 30px; overflow-x: auto; padding: 30px 6px 30px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.sevilen-serit > div { flex: none; position: relative; scroll-snap-align: start; }
.sevilen-serit .not { --w: 196px; }
.sira { position: absolute; z-index: 7; top: -16px; left: -10px; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--dugme); color: var(--dugme-yazi); font: 700 16px/1 var(--serif); box-shadow: 0 6px 14px -4px rgba(0,0,0,.4); rotate: -8deg; }
.sevilen-serit > div:first-child .sira { background: #FFD25A; color: #1F1A14; }

/* ---------- Harita ---------- */
.harita-kart { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 0; background: var(--kart); border-radius: 26px; box-shadow: var(--golge-buyuk), 0 0 0 1px var(--cizgi); overflow: hidden; }
.harita { position: relative; padding: 30px 26px; display: grid; align-content: center; background: radial-gradient(600px 300px at 50% 50%, rgba(255,210,90,.12), transparent 70%); }
.harita-zemin { width: 100%; }
.harita-ic { position: relative; }
.harita-noktalar { position: absolute; inset: 0; }
.hn { position: absolute; translate: -50% -50%; border: 0; padding: 0; cursor: pointer; width: var(--d); height: var(--d); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #FF9A8B, #F26B5B 60%, #D9503F); box-shadow: 0 0 0 3px rgba(242,107,91,.18), 0 4px 10px -2px rgba(185,64,46,.5); transition: scale .25s var(--spring); }
.hn:hover, .hn:focus-visible { scale: 1.25; z-index: 3; }
.hn.secili { background: radial-gradient(circle at 35% 30%, #8FC0FF, #2F7FE0 60%, #1A62B8); box-shadow: 0 0 0 4px rgba(47,127,224,.25), 0 0 0 9px rgba(47,127,224,.10); }
.hn-etiket { position: absolute; translate: -50% 0; margin-top: 6px; white-space: nowrap; font: 650 12px/1 var(--sans); color: var(--yazi); background: var(--kart); padding: 4px 8px; border-radius: 999px; box-shadow: var(--golge); pointer-events: none; }
.harita-ipucu { position: absolute; z-index: 5; translate: -50% calc(-100% - 16px); padding: 8px 12px; border-radius: 12px; background: var(--dugme); color: var(--dugme-yazi); font-size: 13px; font-weight: 600; white-space: nowrap; pointer-events: none; }
.harita-liste { padding: 26px 24px; border-left: 1px solid var(--cizgi); background: var(--kart-2); }
.harita-liste h3 { font-size: 20px; margin-bottom: 14px; }
.harita-liste ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.harita-liste li button { width: 100%; display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 8px; padding: 7px 8px; border: 0; border-radius: 10px; background: none; text-align: left; cursor: pointer; font-size: 15px; }
.harita-liste li button:hover { background: var(--cizgi); }
.harita-liste li .b { font-size: 19px; }
.harita-liste li .c { font-variant-numeric: tabular-nums; color: var(--soluk); font-size: 14px; }
.harita-liste li .cubuk { grid-column: 2 / 4; height: 4px; border-radius: 2px; background: var(--cizgi); overflow: hidden; margin-top: -2px; }
.harita-liste li .cubuk i { display: block; height: 100%; background: linear-gradient(90deg, #FFD25A, #F26B5B); }
.harita-dip { margin-top: 12px; color: var(--silik); font-size: 14px; }
@media (max-width: 900px) {
  .harita-kart { grid-template-columns: 1fr; }
  .harita { padding: 18px 10px; }
  .harita-liste { border-left: 0; border-top: 1px solid var(--cizgi); }
  .harita-liste ol { grid-template-columns: 1fr 1fr; column-gap: 10px; }
  .harita-liste li:nth-child(n+11) { display: none; }
  .hn-etiket { display: none; }
  .hn { width: calc(var(--d) * .55); height: calc(var(--d) * .55); box-shadow: 0 0 0 2px rgba(242,107,91,.18), 0 2px 6px -2px rgba(185,64,46,.5); }
}

/* ---------- Nasıl + zaman çizelgesi ---------- */
.zaman-cizelge { list-style: none; margin: 60px auto 0; padding: 0; max-width: 980px; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; }
.zaman-cizelge::before { content: ""; position: absolute; left: 12%; right: 12%; top: 10px; height: 3px; border-radius: 2px; background: repeating-linear-gradient(90deg, var(--cizgi-2) 0 8px, transparent 8px 14px); }
.zaman-cizelge li { position: relative; display: grid; justify-items: center; gap: 4px; text-align: center; padding-top: 32px; font-size: 15px; color: var(--soluk); }
.zaman-cizelge li::before { content: ""; position: absolute; top: 2px; width: 18px; height: 18px; border-radius: 50%; background: var(--kart); border: 3px solid var(--sari-2); }
.zaman-cizelge li b { font: 700 20px/1.1 var(--serif); color: var(--yazi); }
.zaman-cizelge li.parlak::before { background: #FFD25A; box-shadow: 0 0 0 6px rgba(255,210,90,.3), 0 0 22px rgba(255,190,60,.8); }
@media (max-width: 760px) {
  .zaman-cizelge { grid-template-columns: 1fr; gap: 18px; max-width: 320px; }
  .zaman-cizelge::before { left: 8px; right: auto; top: 6px; bottom: 6px; width: 3px; height: auto; background: repeating-linear-gradient(180deg, var(--cizgi-2) 0 8px, transparent 8px 14px); }
  .zaman-cizelge li { justify-items: start; text-align: left; padding: 0 0 0 36px; }
  .zaman-cizelge li::before { left: 0; top: 2px; }
}

/* ---------- Kurallar ---------- */
.kural-izgara { display: grid; grid-template-columns: 1.15fr .85fr; gap: 40px; align-items: center; }
.kural-kagit { position: relative; padding: 44px 40px 36px 64px; color: #2A2118; border-radius: 4px 4px 26px 4px; rotate: -.4deg; box-shadow: var(--golge-buyuk);
  background-color: #FFFEF6;
  background-image: linear-gradient(90deg, transparent 44px, rgba(242,107,91,.5) 44px, rgba(242,107,91,.5) 46px, transparent 46px), repeating-linear-gradient(180deg, transparent 0 32px, rgba(47,127,224,.2) 32px 34px);
  background-size: 100% 100%, 100% 100%; background-repeat: no-repeat, no-repeat; background-position: 0 0, 0 4px; }
.kural-kagit h2 { font-family: var(--hand); font-size: 40px; letter-spacing: 0; color: #1F1A14; }
.kural-giris { margin: 10px 0 14px; color: rgba(42,33,24,.75); }
.kural-liste { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.kural-liste li { position: relative; padding-left: 28px; line-height: 34px; font-size: 17px; }
.kural-liste li::before { content: ""; position: absolute; left: 0; top: 9px; width: 16px; height: 16px; border-radius: 4px; border: 2px solid rgba(42,33,24,.55); }
.kural-liste li::after { content: ""; position: absolute; left: 4px; top: 11px; width: 6px; height: 10px; border-right: 2.5px solid #2F7D4F; border-bottom: 2.5px solid #2F7D4F; rotate: 40deg; }
.guvenlik { display: grid; gap: 14px; }
.guvenlik h3 { display: flex; align-items: center; gap: 10px; }
.guvenlik h3 svg { width: 26px; height: 26px; color: var(--yesil); }
.guvenlik-adim { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; padding: 14px 16px; border-radius: 16px; background: var(--kart); box-shadow: var(--golge); border: 1px solid var(--cizgi); }
.guvenlik-adim b { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--sari-acik); color: #6A4A00; font: 700 15px/1 var(--serif); }
.guvenlik-adim p { font-size: 15.5px; color: var(--soluk); }
.guvenlik-dip { font-size: 15px; color: var(--silik); }
.guvenlik-dip a { color: var(--mavi-yazi); }
@media (max-width: 860px) { .kural-izgara { grid-template-columns: 1fr; } .kural-kagit { padding: 40px 22px 28px 56px; } }

/* ---------- Son ---------- */
.son-notlar { display: flex; justify-content: center; gap: 10px; margin-bottom: 34px; height: 150px; }
.son-notlar .not { --w: 128px; }
.son-notlar .not:nth-child(2) { translate: 0 -12px; }
@media (max-width: 640px) { .son-notlar .not:nth-child(3) { display: none; } }

/* ---------- Not büyütme ---------- */
.isik-kutu { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 20px; background: rgba(20,14,8,.55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.isik-kutu[hidden] { display: none; }
.isik-kutu-ic { position: relative; display: grid; justify-items: center; gap: 22px; padding: 46px 30px 24px; border-radius: 28px; background: var(--kart); box-shadow: var(--golge-buyuk); width: min(440px, 100%); animation: as .5s cubic-bezier(.34,1.56,.64,1); }
.isik-kutu .kapat { position: absolute; right: 14px; top: 14px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--cizgi); display: grid; place-items: center; cursor: pointer; }
.isik-kutu .kapat svg { width: 16px; height: 16px; }
.buyuk-not .not { --w: 290px; cursor: default; }
.buyuk-not .not:hover { transform: none; }
.isik-kutu-arac { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.ben-de { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 999px; border: 0; background: #F26B5B; color: #fff; font-weight: 700; font-size: 16px; cursor: pointer; box-shadow: 0 12px 22px -12px rgba(185,64,46,.9); }
.ben-de svg, .isik-kutu-arac .ikincil svg { width: 18px; height: 18px; }
.ben-de.dolu { background: #B9402E; }
.isik-kutu-arac .ikincil { display: inline-flex; align-items: center; gap: 7px; padding: 12px 16px; border-radius: 999px; border: 1px solid var(--cizgi-2); background: none; font-weight: 600; cursor: pointer; }
.isik-kutu-arac .bildir { color: var(--silik); }
.isik-kutu-dip { font-size: 14px; color: var(--silik); }

html[data-asama="dalga"] .kural-kagit, html[data-asama="dalga"] .not { color-scheme: light; }

html[data-asama="yakinda"] .sevilen-bolum { display: none; }
.duvar-mantar .havai, .app-parca ~ .havai { mix-blend-mode: screen; }


/* ===================== üretim ekleri ===================== */
/* Metin çeşitleri: yalnız sade metin öğelerinde (display: revert UA değerine döner) */
.v { display: none; }
html:not([data-asama]) .v-acik, html[data-asama="acik"] .v-acik, html[data-asama="yakinda"] .v-yakinda,
html[data-asama="dalga"] .v-dalga, html[data-asama="ani"] .v-ani { display: revert; }

.harita-zemin { aspect-ratio: 1000 / 394; height: auto; }
.duvar-parca { min-height: 240px; }
.duvar-durum { grid-column: 1 / -1; align-self: center; padding: 50px 20px; text-align: center; color: #FFF8EC; font: 600 17px/1.4 var(--sans); text-shadow: 0 1px 2px rgba(60,30,10,.5); }
.duvar-durum button { margin-top: 12px; padding: 10px 18px; border-radius: 999px; border: 0; background: #FFFDF8; color: #1F1A14; font: 650 15px/1 var(--sans); cursor: pointer; }
.yukleniyor .duvar-parca { opacity: .55; transition: opacity .2s; }
.not:focus-visible { outline: 3px solid #2F7FE0; outline-offset: 3px; }
.duvar-parca .not, .sevilen-serit .not, .hero-notlar .not { cursor: pointer; }
.suzgec button:focus-visible, .daha:focus-visible, .cip:focus-visible, .ulke-liste button:focus-visible { outline: 3px solid var(--mavi); outline-offset: 2px; }

/* aşama: yakında (teaser) */
html[data-asama="yakinda"] .suzgec, html[data-asama="yakinda"] .akis-alt, html[data-asama="yakinda"] .duvar-not { display: none; }
/* aşama: anı duvarı */
.ani-serit { display: none; align-items: center; gap: 14px; max-width: 860px; margin: -24px auto 28px; padding: 14px 18px; border-radius: 16px; background: var(--mavi-acik); color: #123E73; box-shadow: var(--golge); }
.ani-serit p { font-size: 15.5px; }
html[data-asama="ani"] .ani-serit { display: flex; }
html[data-asama="ani"] .sayac-sag { display: none; }
html[data-asama="ani"] .sayac-kagit { grid-template-columns: 1fr; max-width: 360px; text-align: center; }
html[data-asama="ani"] .sayac-sol { border: 0; }
html.kalp-kapali .not .kalp { cursor: default; }
html.kalp-kapali .ben-de { opacity: .6; cursor: default; }
/* aşama: dalga */
html[data-asama="dalga"] .ani-serit { display: none; }
html[data-asama="dalga"] .hero-notlar .not { color-scheme: light; }
.havai-hero .havai { z-index: 1; }

/* paylaşılan not (?n=) */
.not.paylasilan { box-shadow: 0 0 0 2px rgba(255,201,74,.9), 0 0 34px 6px rgba(255,196,70,.55), var(--kagit-golge); z-index: 4; }

/* sevilen: boşken gizli */
.sevilen-bolum[hidden], .harita-bolum[hidden] { display: none !important; }
.sevilen-serit { scrollbar-width: none; }
.sevilen-serit::-webkit-scrollbar { display: none; }

/* not büyütme: bildir paneli + kısa mesaj */
.bildir-panel { width: 100%; padding: 14px 16px; border-radius: 16px; background: var(--zemin-2); font-size: 14.5px; color: var(--soluk); display: grid; gap: 10px; }
.bildir-panel b { color: var(--yazi); }
.bildir-panel a { justify-self: start; display: inline-flex; padding: 9px 14px; border-radius: 999px; background: var(--dugme); color: var(--dugme-yazi); font-weight: 650; text-decoration: none; }
.tost { position: fixed; left: 50%; bottom: calc(86px + env(safe-area-inset-bottom, 0px)); z-index: 140; translate: -50% 0; padding: 11px 18px; border-radius: 999px; background: #1F1A14; color: #FFFDF8; font: 600 15px/1.2 var(--sans); box-shadow: 0 12px 30px -10px rgba(0,0,0,.5); opacity: 0; transition: opacity .25s; pointer-events: none; max-width: calc(100vw - 32px); text-align: center; }
.tost.gorunur { opacity: 1; }
.isik-kutu .kapat { color: var(--yazi); }
.isik-kutu-arac .ikincil { color: var(--yazi); }
.buyuk-not { max-width: 100%; }
@media (max-width: 400px) { .buyuk-not .not { --w: 250px; } .isik-kutu-ic { padding: 44px 16px 20px; } }

/* hero sayaç/geri sayım küçük ekran */
@media (max-width: 400px) { .geri { gap: 6px; } .geri span { width: 58px; } .sayac-sayi { font-size: 40px; } }
/* mobil: 12 not; parça içi yarım sayfalar sayfa.js'te (gizleme yok) */
.duvar-parca > .bos-yer { --w: 164px; }
@media (max-width: 760px) { .duvar-parca > .bos-yer { --w: 146px; } }

/* koyu mod: kağıtlar açık kalır */
@media (prefers-color-scheme: dark) {
  .not, .kural-kagit, .bos-yer { color-scheme: light; }
  .acilis-serit { color: #3A2E1A; }
  .ani-serit { background: #1C2A40; color: #CFE2FF; }
  .suzgec-ulke { background: #1C2A40; color: #CFE2FF; }
}

/* ===================== 27 Eki 2026 (WB): uygulamayla eşitleme ===================== */
.dw-gizli { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
html.arsivli #dalga, html.arsivli .suzgec, html.arsivli .akis-alt, html.arsivli .duvar-mantar, html.arsivli #harita, html.arsivli #sevilen, html.arsivli .sayac-sag { display: none; }
html.arsivli .ani-serit { display: flex; }

/* ---------- ?n= tek dilek ---------- */
.tek-not { position: relative; padding: calc(clamp(28px, 5vw, 56px) + 76px) 0 clamp(36px, 5vw, 60px); background: radial-gradient(800px 420px at 30% 40%, rgba(255,210,90,.22), transparent 70%); border-bottom: 1px solid var(--cizgi); }
.tek-not[hidden] { display: none; }
.tek-izgara { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); gap: clamp(24px, 5vw, 64px); align-items: center; max-width: 960px; }
.tek-kagit { display: grid; place-items: center; min-height: 260px; padding: 20px; }
.tek-kagit .not { --w: min(300px, 74vw); cursor: default; }
.tek-kagit .not:hover { transform: rotate(var(--r)); }
.tek-yazi { display: grid; gap: 18px; justify-items: start; }
.tek-yazi .kicker { justify-content: flex-start; margin: 0; }
.tek-arac { display: flex; flex-wrap: wrap; gap: 8px; }
.tek-arac .ikincil { display: inline-flex; align-items: center; gap: 7px; padding: 12px 16px; border-radius: 999px; border: 1px solid var(--cizgi-2); background: var(--kart); color: var(--yazi); font-weight: 600; cursor: pointer; }
.tek-arac svg { width: 18px; height: 18px; }
.tek-dugmeler { margin: 0; justify-content: flex-start; }
.tek-yok h2 { font-size: clamp(24px, 3vw, 32px); }
.tek-yok p { color: var(--soluk); margin-top: 6px; }
.tek-bulunamadi .tek-izgara { grid-template-columns: 1fr; }
@media (max-width: 760px) {
  .tek-izgara { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .tek-yazi { justify-items: center; }
  .tek-yazi .kicker, .tek-dugmeler, .tek-arac { justify-content: center; }
  .tek-kagit { min-height: 0; padding: 26px 0 6px; }
}

/* ---------- Gece yarısı dalgası ---------- */
.dalga-bolum { position: relative; z-index: 3; padding: clamp(40px, 6vw, 70px) 0 0; }
.dalga-kart { position: relative; overflow: hidden; border-radius: 26px; padding: clamp(20px, 3vw, 32px); color: #FFF6E2;
  background: radial-gradient(700px 300px at 85% -10%, rgba(255,196,92,.30), transparent 70%), radial-gradient(600px 300px at 0% 110%, rgba(47,127,224,.30), transparent 70%), #121A3D;
  box-shadow: var(--golge-buyuk), 0 0 0 1px rgba(255,246,226,.10); }
.dalga-kart a { color: #FFD25A; }
.dalga-ust { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.dalga-ust h2 { font-size: clamp(26px, 3.4vw, 40px); letter-spacing: -.02em; color: #FFF6E2; margin-right: auto; }
.canli-rozet { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: rgba(255,77,77,.16); color: #FF8A8A; font: 800 12px/1 var(--sans); letter-spacing: .14em; }
.canli-rozet[hidden] { display: none; }
.canli-nokta { width: 9px; height: 9px; border-radius: 50%; background: #FF4D4D; animation: nabiz 1.6s ease-out infinite; }
@keyframes nabiz { 0% { box-shadow: 0 0 0 0 rgba(255,77,77,.6); } 100% { box-shadow: 0 0 0 12px rgba(255,77,77,0); } }
.dalga-sayac { display: grid; gap: 6px; justify-items: end; }
.dalga-sayac[hidden] { display: none; }
.dalga-sayac-b { font: 650 12px/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: #FFD25A; }
.dalga-geri span { background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 1px rgba(255,246,226,.14); min-width: 56px; }
.dalga-geri b { color: #FFF6E2; font-size: 24px; }
.dalga-geri small { color: #C9C6DA; }
.dalga-aciklama { margin: 12px 0 18px; max-width: 760px; color: #C9C6DA; font-size: 16px; }
.dalga-cipler { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 12px; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: rgba(255,246,226,.25) transparent; }
.cip { flex: none; scroll-snap-align: center; display: grid; justify-items: center; gap: 3px; min-width: 92px; padding: 9px 10px 8px; border-radius: 14px; cursor: pointer;
  border: 1px solid rgba(255,246,226,.14); background: rgba(255,255,255,.05); color: #C9C6DA; font: 500 12px/1.2 var(--sans); transition: background .2s, transform .2s var(--spring); }
.cip:hover { background: rgba(255,255,255,.10); }
.cip-bayrak { font-size: 17px; line-height: 1.1; white-space: nowrap; min-height: 19px; }
.cip b { font: 700 14px/1.1 var(--sans); color: #FFF6E2; white-space: nowrap; }
.cip-sayi { font-variant-numeric: tabular-nums; }
.cip.gecti { background: rgba(255,210,90,.12); border-color: rgba(255,210,90,.28); }
.cip.gecti b::after { content: " ✓"; color: #FFD25A; }
.cip.simdi { background: #FFD25A; color: #3A2E1A; border-color: #FFD25A; box-shadow: 0 0 0 4px rgba(255,210,90,.25), 0 0 32px rgba(255,200,80,.55); }
.cip.simdi b { color: #1F1A14; }
.cip.benim { border-style: dashed; border-color: rgba(127,211,255,.7); }
.cip[aria-pressed="true"] { outline: 2px solid #FFF6E2; outline-offset: 2px; transform: translateY(-2px); }
.dalga-panel { position: relative; margin-top: 8px; padding: 18px 0 0; border-top: 1px dashed rgba(255,246,226,.18); }
.dalga-panel-b { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font: 600 16px/1.3 var(--sans); color: #FFF6E2; }
.dalga-panel-ust { flex-basis: 100%; font: 700 12px/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: #FFD25A; }
.dalga-panel-bayrak { font-size: 20px; }
.dalga-panel-b b { font-size: 20px; }
.dalga-panel-ad { color: #C9C6DA; font-weight: 500; }
.dalga-notlar { display: flex; gap: 22px; overflow-x: auto; padding: 30px 8px 24px; min-height: 120px; scrollbar-width: thin; scrollbar-color: rgba(255,246,226,.25) transparent; }
.dalga-notlar .not { flex: none; --w: 150px; cursor: pointer; color-scheme: light; }
.dalga-notlar.yukleniyor { opacity: .5; }
.dalga-bos { align-self: center; color: #C9C6DA; font-size: 15px; padding: 10px 0; }
.dalga-ipucu { font-size: 13px; color: #9C9AB8; }
.dalga-panel .havai { position: absolute; inset: 0; pointer-events: none; opacity: .5; }
@media (max-width: 640px) {
  .dalga-sayac { justify-items: start; width: 100%; }
  .dalga-geri span { min-width: 0; width: 60px; }
  .dalga-notlar .not { --w: 136px; }
}

/* ---------- Sonsuz akış ---------- */
.duvar-parca > .not.giris { animation: as .55s cubic-bezier(.34,1.56,.64,1) both; animation-delay: calc(var(--i, 0) * 22ms); }
.akis-alt { display: grid; justify-items: center; gap: 10px; margin-top: 24px; }
.daha { display: inline-flex; align-items: center; gap: 10px; padding: 13px 22px; border-radius: 999px; border: 0; background: var(--dugme); color: var(--dugme-yazi); font-weight: 650; font-size: 16px; cursor: pointer; box-shadow: 0 14px 26px -14px rgba(31,26,20,.7); }
.daha[hidden], .akis-son[hidden] { display: none; }
.daha:disabled { opacity: .5; cursor: default; }
.akis-son { color: var(--soluk); font: 19px/1.3 var(--hand); }
.akis-gozcu { width: 100%; height: 1px; }
.bos-cta { display: inline-flex; margin-top: 12px; padding: 11px 18px; border-radius: 999px; background: #FFFDF8; color: #1F1A14; font: 650 15px/1 var(--sans); text-decoration: none; text-shadow: none; }

/* ---------- Bütün ülkeler ---------- */
.harita-liste { display: flex; flex-direction: column; min-height: 0; }
.harita-liste h3 { margin-bottom: 4px; }
.ulke-ozet { color: var(--soluk); font-size: 14px; margin-bottom: 12px; }
.ulke-ara input { width: 100%; padding: 10px 14px; border-radius: 12px; border: 1px solid var(--cizgi-2); background: var(--kart); color: var(--yazi); font: 500 15px/1.2 var(--sans); }
.ulke-ara input:focus-visible { outline: 3px solid var(--mavi); outline-offset: 1px; }
.harita-liste .ulke-liste { margin-top: 10px; max-height: 420px; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; grid-template-columns: 1fr !important; }
.harita-liste .ulke-liste li { display: block !important; }
.harita-liste .ulke-liste li[hidden] { display: none !important; }
.ulke-liste li button { grid-template-columns: 26px minmax(0, 1fr) auto; color: var(--yazi); }
.ulke-liste li button[aria-pressed="true"] { background: var(--mavi-acik); color: #123E73; }
.ulke-liste .ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ulke-liste .ad small { display: block; font-size: 11.5px; color: var(--vurgu); font-weight: 650; }
.ulke-liste li.bos .b { opacity: .55; }
.ulke-liste li.bos .ad { color: var(--soluk); }
.ulke-liste li.bos .c { font-size: 12px; color: var(--silik); }
.ulke-liste li.benim button { background: rgba(255,210,90,.16); }
.ulke-liste li.yok { padding: 10px 8px; color: var(--silik); font-size: 14px; }
.harita-ipucu { left: 0; top: 0; }
@media (max-width: 900px) { .harita-liste .ulke-liste { max-height: 360px; } }
@media (prefers-color-scheme: dark) { .ulke-liste li button[aria-pressed="true"] { background: #1C2A40; color: #CFE2FF; } }