/* Aedilis Media: marka kılavuzu v1.0 paleti. Yüzeyler düz, gölgesiz; yapı ince altın çizgilerle kurulur. */

:root {
  --obsidian: #0a0a0a;
  --charcoal: #1b1b1b;
  --stone: #d7ccb2;
  --blood: #8b0d0d;
  --gold: #b08a3e;
  --stone-muted: #a59c86;
  --line: rgba(176, 138, 62, 0.4);
  --line-soft: rgba(215, 204, 178, 0.16);

  --display: 'Cinzel', 'Trajan Pro', Georgia, serif;
  --text: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --measure: 62ch;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --space-section: clamp(4.5rem, 9vw, 8rem);
}

*,
*::before,
*::after { box-sizing: border-box; }

html { color-scheme: dark; scroll-behavior: smooth; scroll-padding-top: 5rem; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--obsidian);
  color: var(--stone);
  font-family: var(--text);
  font-size: 1rem;
  line-height: 1.7;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
p { margin: 0 0 1em; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: 1.15; }
ul, ol { margin: 0; padding: 0; list-style: none; }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
::selection { background: var(--blood); color: var(--stone); }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.skip-link { position: absolute; left: 1rem; top: -4rem; background: var(--gold); color: var(--obsidian); padding: 0.6rem 1rem; z-index: 100; font-weight: 600; text-decoration: none; }
.skip-link:focus { top: 1rem; }

.wrap { width: min(100% - 2 * var(--gutter), 74rem); margin-inline: auto; }

/* ---------- Üst çubuk ---------- */
.topbar {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  padding: 0.7rem max(var(--gutter), calc((100% - 74rem) / 2));
  background: rgba(10, 10, 10, 0.94);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: 0.8rem; text-decoration: none; }
.brand-mark { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; }
.brand-name { font-family: var(--display); font-weight: 700; letter-spacing: 0.16em; font-size: 0.95rem; }

.nav { display: flex; align-items: center; gap: clamp(1rem, 2.4vw, 2rem); }
.nav a { text-decoration: none; font-size: 0.875rem; font-weight: 500; letter-spacing: 0.04em; padding: 0.4rem 0; border-bottom: 1px solid transparent; }
.nav a:hover { border-bottom-color: var(--gold); }
.nav .nav-cta { border: 1px solid var(--gold); padding: 0.45rem 1.1rem; color: var(--gold); }
.nav .nav-cta:hover { background: var(--gold); color: var(--obsidian); }

.nav-toggle { display: none; }

@media (max-width: 52rem) {
  .js .nav-toggle {
    display: inline-flex; align-items: center;
    background: none; color: var(--stone); font: inherit; font-size: 0.875rem; font-weight: 600; letter-spacing: 0.08em;
    border: 1px solid var(--line); padding: 0.45rem 1rem; cursor: pointer;
  }
  .js .nav {
    position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--obsidian); border-bottom: 1px solid var(--line);
    padding: 0.5rem var(--gutter) 1.2rem;
    display: none;
  }
  .js .nav.is-open { display: flex; }
  .js .nav a { padding: 0.9rem 0; border-bottom: 1px solid var(--line-soft); font-size: 1rem; }
  .js .nav .nav-cta { margin-top: 0.8rem; text-align: center; }
  .nav { flex-wrap: wrap; justify-content: flex-end; gap: 0.2rem 1rem; }
}

/* ---------- Meander friz ---------- */
.frieze {
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22'%3E%3Cpath d='M0 22V0H22V16H6V6H16V11' fill='none' stroke='%23b08a3e' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: left center;
  opacity: 0.85;
}
@media (prefers-reduced-motion: no-preference) {
  .frieze-draw { animation: frieze-draw 1.6s cubic-bezier(0.6, 0, 0.2, 1) 0.2s both; }
}
@keyframes frieze-draw { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }

/* ---------- Hero ---------- */
.hero { padding-top: clamp(3rem, 8vw, 6.5rem); }
.hero-grid { display: grid; gap: clamp(2.5rem, 6vw, 5rem); grid-template-columns: 1fr; align-items: end; padding-bottom: clamp(3rem, 7vw, 5.5rem); }
@media (min-width: 62rem) { .hero-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } }

.wordmark { display: flex; flex-direction: column; font-family: var(--display); font-weight: 800; letter-spacing: 0.07em; line-height: 0.98; font-size: clamp(3.2rem, 15.5vw, 8.5rem); color: var(--stone); margin-bottom: 1.2rem; }
.wordmark span:last-child { color: var(--gold); }

.motto { font-weight: 300; font-size: clamp(1.1rem, 2.2vw, 1.5rem); letter-spacing: 0.02em; color: var(--stone); margin-bottom: 1.6rem; }
.lead { max-width: 46ch; font-size: 1.125rem; color: var(--stone-muted); margin-bottom: 2rem; }

.actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-bottom: 2rem; }

.yt-stat { margin: 0; font-size: 0.875rem; color: var(--stone-muted); }
.yt-stat a { text-decoration: none; border-bottom: 1px solid var(--line-soft); }
.yt-stat a:hover { border-bottom-color: var(--gold); color: var(--stone); }
.yt-stat strong { font-family: var(--display); font-size: 1.15rem; color: var(--gold); margin-right: 0.3rem; font-weight: 700; }

.pillars { border-top: 1px solid var(--line); }
.pillars li { display: grid; grid-template-columns: minmax(8.5rem, 0.8fr) 1.2fr; gap: 1.5rem; align-items: baseline; padding: 1.15rem 0; border-bottom: 1px solid var(--line); }
.pillar-name { font-family: var(--display); font-weight: 700; font-size: clamp(1.25rem, 2.4vw, 1.7rem); letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone); }
.pillar-text { font-size: 0.9rem; line-height: 1.6; color: var(--stone-muted); }
@media (max-width: 36rem) { .pillars li { grid-template-columns: 1fr; gap: 0.3rem; } }

.hero-sub .hero-grid-sub { align-items: center; }
.hero-sub .hero-copy { max-width: 40rem; }
.page-title { font-family: var(--display); font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; font-size: clamp(2.2rem, 6vw, 4.2rem); line-height: 1.05; margin-bottom: 1rem; }
.motto-upper { font-family: var(--display); text-transform: uppercase; letter-spacing: 0.18em; color: var(--gold); font-weight: 600; font-size: clamp(0.95rem, 1.8vw, 1.15rem); }
.sub-logo { width: min(22rem, 70%); justify-self: center; }
.crumbs { font-size: 0.875rem; margin-bottom: 1.4rem; }
.crumbs a { color: var(--stone-muted); text-decoration: none; border-bottom: 1px solid var(--line-soft); }
.crumbs a:hover { color: var(--stone); border-bottom-color: var(--gold); }

/* ---------- Düğmeler ve bağlantılar ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; font: inherit; font-size: 0.9rem; font-weight: 600; letter-spacing: 0.05em; color: var(--stone); background: transparent; border: 1px solid var(--stone-muted); padding: 0.8rem 1.6rem; cursor: pointer; transition: background-color 0.18s, color 0.18s, border-color 0.18s; }
.btn:hover { border-color: var(--stone); background: rgba(215, 204, 178, 0.08); }
.btn-primary { background: var(--gold); border-color: var(--gold); color: var(--obsidian); }
.btn-primary:hover { background: var(--stone); border-color: var(--stone); }
.btn-small { padding: 0.5rem 1.1rem; font-size: 0.82rem; }

.text-link { color: var(--gold); font-weight: 600; font-size: 0.9rem; text-decoration: none; border-bottom: 1px solid var(--line); white-space: nowrap; }
.text-link:hover { color: var(--stone); border-bottom-color: var(--stone); }
.mail-link { font-weight: 600; color: var(--stone); text-decoration: none; border-bottom: 1px solid var(--gold); }
.mail-link:hover { color: var(--gold); }

.tag { display: inline-block; margin: 0 0 1rem; padding: 0.2rem 0.7rem; background: var(--blood); color: var(--stone); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.04em; }

/* ---------- Bölümler ---------- */
.section { padding-block: var(--space-section); }
.section-alt { background: var(--charcoal); border-block: 1px solid var(--line-soft); }
.section-head { margin-bottom: clamp(2.2rem, 5vw, 3.6rem); max-width: 44rem; }
.section-title { font-family: var(--display); font-weight: 700; letter-spacing: 0.2em; font-size: clamp(1.7rem, 4vw, 2.6rem); color: var(--stone); margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--gold); display: inline-block; }
.section-desc { color: var(--stone-muted); max-width: 52ch; margin: 0; }
.section-more { margin-top: 2rem; }

/* Bölüm blokları */
.division { display: grid; gap: clamp(1.8rem, 5vw, 4rem); grid-template-columns: 1fr; padding-block: clamp(2.2rem, 5vw, 3.6rem); border-top: 1px solid var(--line); }
.division:first-of-type { border-top: 0; padding-top: 0; }
@media (min-width: 58rem) { .division { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); } .division-id { position: sticky; top: 6rem; align-self: start; } }
.division-logo { width: min(100%, 20rem); margin-bottom: 1.4rem; }
.division-id h3 { font-size: 1.35rem; margin-bottom: 0.6rem; letter-spacing: 0.01em; }
.division-id p { color: var(--stone-muted); max-width: 34ch; margin: 0; }

.parent { padding: 0 0 1.8rem; margin-bottom: 0.4rem; border-bottom: 1px solid var(--line); }
.parent p { max-width: var(--measure); color: var(--stone); }
.project-name { font-size: 1.15rem; margin-bottom: 0.4rem; letter-spacing: 0.01em; }

.project { display: grid; grid-template-columns: 4rem minmax(0, 1fr) auto; gap: 1.2rem; align-items: center; padding: 1.3rem 0; border-bottom: 1px solid var(--line-soft); }
.project:last-child { border-bottom: 0; }
.project-logo { width: 4rem; height: 4rem; object-fit: contain; }
.project-body p { margin: 0; color: var(--stone-muted); font-size: 0.95rem; max-width: 56ch; }
@media (max-width: 40rem) { .project { grid-template-columns: 3.2rem minmax(0, 1fr); } .project .text-link { grid-column: 2; justify-self: start; } .project-logo { width: 3.2rem; height: 3.2rem; } }

/* ---------- Müzik ---------- */
.featured { border: 1px solid var(--gold); padding: clamp(1.6rem, 4vw, 3rem); margin-bottom: clamp(2.5rem, 6vw, 4rem); background: var(--obsidian); }
.featured-title { font-family: var(--display); text-transform: uppercase; font-weight: 800; letter-spacing: 0.08em; font-size: clamp(1.9rem, 5.5vw, 3.6rem); line-height: 1.05; margin-bottom: 0.8rem; }
.featured-meta { color: var(--stone-muted); margin-bottom: 1.6rem; }
.platform-links { display: flex; flex-wrap: wrap; gap: 0.7rem; }

.catalog { margin-top: clamp(2.2rem, 5vw, 3.4rem); }
.catalog-title { font-size: 1.3rem; margin-bottom: 0.3rem; }
.catalog-note { color: var(--stone-muted); font-size: 0.95rem; margin-bottom: 1rem; }
.catalog-note .text-link { margin-left: 0.5rem; }

.release-list { border-top: 1px solid var(--line); }
.release { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) minmax(8rem, 12rem) auto; gap: 1rem 1.5rem; align-items: center; padding: 1.1rem 0; border-bottom: 1px solid var(--line-soft); }
.release-year { margin: 0; font-family: var(--display); font-weight: 700; color: var(--gold); font-size: 1.15rem; letter-spacing: 0.06em; }
.release-title { font-size: 1.15rem; margin: 0 0 0.15rem; }
.release-note { margin: 0; font-size: 0.875rem; color: var(--stone-muted); }
.release-meta { margin: 0; display: flex; flex-direction: column; font-size: 0.875rem; color: var(--stone-muted); line-height: 1.5; }
.release-meta span:first-child { color: var(--stone); font-weight: 600; }
@media (max-width: 44rem) {
  .release { grid-template-columns: 3.6rem minmax(0, 1fr); }
  .release-meta { grid-column: 2; flex-direction: row; gap: 1rem; }
  .release .btn { grid-column: 2; justify-self: start; }
}

/* ---------- Manifesto ---------- */
.manifesto { padding-block: clamp(4rem, 9vw, 7rem) 0; }
.manifesto-quote { margin: 0; max-width: 56rem; margin-inline: auto; text-align: left; padding-left: clamp(1.2rem, 3vw, 2.4rem); border-left: 3px solid var(--blood); }
.manifesto-quote p { margin: 0; font-weight: 300; font-size: clamp(1.4rem, 3.4vw, 2.3rem); line-height: 1.45; color: var(--stone); }

/* ---------- Videolar ---------- */
.video-grid { display: grid; gap: 2rem 1.6rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
.video-thumb { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--charcoal); border: 1px solid var(--line-soft); }
.video-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.video-thumb:hover img { transform: scale(1.03); }
.video-play { position: absolute; left: 0; bottom: 0; background: var(--blood); color: var(--stone); font-size: 0.85rem; font-weight: 600; padding: 0.4rem 1rem; letter-spacing: 0.05em; }
.video-title { font-size: 1rem; font-weight: 600; line-height: 1.4; margin: 0.9rem 0 0.3rem; }
.video-title a { text-decoration: none; }
.video-title a:hover { color: var(--gold); }
.video-date { margin: 0; font-size: 0.85rem; color: var(--stone-muted); }

/* ---------- Günlük ---------- */
.journal-list { display: grid; gap: 0; border-top: 1px solid var(--line); }
.journal-item { border-bottom: 1px solid var(--line-soft); }
.journal-item > a, .journal-item > div { display: block; padding: 1.5rem 0; text-decoration: none; max-width: 52rem; }
.journal-item > a:hover h3 { color: var(--gold); }
.journal-cat { margin: 0 0 0.4rem; font-size: 0.85rem; color: var(--gold); font-weight: 600; }
.journal-item h3 { font-size: 1.35rem; margin-bottom: 0.5rem; transition: color 0.18s; }
.journal-item p:last-child { margin: 0; color: var(--stone-muted); }

/* ---------- İletişim ---------- */
.contact-grid { display: grid; gap: clamp(2.2rem, 6vw, 5rem); grid-template-columns: 1fr; }
@media (min-width: 58rem) { .contact-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); } }
.contact-info h2, .contact-info h3 { font-size: 1.5rem; margin-bottom: 1rem; }
.contact-info p { color: var(--stone-muted); max-width: 48ch; }
.contact-info p .mail-link { color: var(--stone); }
.social-list { display: flex; flex-wrap: wrap; gap: 0.6rem 1.6rem; margin-top: 1.6rem; }
.social-list a { text-decoration: none; font-weight: 600; font-size: 0.9rem; border-bottom: 1px solid var(--line); padding-bottom: 0.15rem; }
.social-list a:hover { color: var(--gold); border-bottom-color: var(--gold); }

.contact-form { display: grid; gap: 0.5rem; align-content: start; }
.contact-form label { font-size: 0.875rem; font-weight: 600; color: var(--stone-muted); margin-top: 0.7rem; }
.contact-form input, .contact-form textarea { width: 100%; font: inherit; color: var(--stone); background: var(--charcoal); border: 1px solid var(--line-soft); border-bottom-color: var(--stone-muted); border-radius: 2px; padding: 0.85rem 1rem; }
.contact-form textarea { resize: vertical; min-height: 9rem; }
.contact-form input:focus-visible, .contact-form textarea:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-color: var(--gold); }
.contact-form .btn { margin-top: 1.2rem; justify-self: start; }
.form-status { min-height: 1.5em; margin: 0.4rem 0 0; font-size: 0.9rem; color: var(--stone-muted); }
.form-status.is-error { color: #e08b8b; }
.form-status.is-ok { color: var(--gold); }

/* ---------- Metin sayfaları ---------- */
.prose-grid { display: grid; gap: 2rem 4rem; grid-template-columns: 1fr; }
@media (min-width: 58rem) { .prose-grid { grid-template-columns: minmax(0, 16rem) minmax(0, 1fr); } .prose-grid .section-title { align-self: start; } }
.prose { max-width: var(--measure); }
.prose p, .prose li { font-size: 1.0625rem; line-height: 1.8; color: var(--stone); }
.prose h2 { font-family: var(--display); font-size: 1.35rem; letter-spacing: 0.12em; text-transform: uppercase; margin: 2.6rem 0 1rem; color: var(--gold); }
.prose a { color: var(--gold); text-underline-offset: 3px; }
.prose a:hover { color: var(--stone); }
.prose strong { font-weight: 700; }
.prose .note { margin-top: 1.6rem; padding: 1rem 1.2rem; border-left: 2px solid var(--gold); background: var(--charcoal); font-size: 0.95rem; color: var(--stone-muted); }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1.2rem 2rem; margin: 2.4rem 0 0; padding-top: 1.6rem; border-top: 1px solid var(--line); }
.facts dt { font-size: 0.82rem; color: var(--stone-muted); margin-bottom: 0.2rem; }
.facts dd { margin: 0; font-weight: 600; }

.post { padding-block: clamp(3rem, 8vw, 6rem); }
.post-title { font-size: clamp(2rem, 5vw, 3.4rem); }
.post-meta { color: var(--gold); font-weight: 600; font-size: 0.9rem; margin-bottom: 2.4rem; }
.post-meta span { color: var(--stone-muted); font-weight: 400; margin-left: 1rem; }
.notfound { padding-block: 8rem; }

/* ---------- Dinleme penceresi ---------- */
.listen-dialog { border: 1px solid var(--gold); background: var(--charcoal); color: var(--stone); padding: 0; width: min(92vw, 30rem); }
.listen-dialog::backdrop { background: rgba(0, 0, 0, 0.78); }
.dialog-box { padding: clamp(1.5rem, 4vw, 2.2rem); position: relative; }
.dialog-box h3 { font-size: 1.5rem; margin-bottom: 0.3rem; padding-right: 5rem; }
.dialog-meta { color: var(--stone-muted); font-size: 0.9rem; margin-bottom: 1.4rem; }
.dialog-close { position: absolute; top: 1rem; right: 1rem; background: none; border: 1px solid var(--line); color: var(--stone); font: inherit; font-size: 0.82rem; font-weight: 600; padding: 0.35rem 0.8rem; cursor: pointer; }
.dialog-close:hover { border-color: var(--stone); }
.dialog-box .platform-links { flex-direction: column; }
.dialog-box .btn { width: 100%; justify-content: flex-start; }
.dialog-box .tag { margin-bottom: 0.8rem; }

/* ---------- Alt bilgi ---------- */
.footer { margin-top: 0; padding-bottom: 2rem; }
.footer .frieze { opacity: 0.6; margin-bottom: 2.4rem; }
.footer-grid { display: grid; gap: 1.2rem 2rem; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 52rem) { .footer-grid { grid-template-columns: auto 1fr auto; } .footer-nav { justify-content: center; } }
.footer-motto { margin: 0; font-family: var(--display); font-weight: 600; letter-spacing: 0.18em; font-size: 0.82rem; color: var(--gold); }
.footer-nav { display: flex; flex-wrap: wrap; gap: 0.4rem 1.6rem; }
.footer-nav a { text-decoration: none; font-size: 0.875rem; color: var(--stone-muted); }
.footer-nav a:hover { color: var(--stone); }
.footer-copy { margin: 0; font-size: 0.82rem; color: var(--stone-muted); }

/* ---------- Ana sayfa: tek ekranlık tanrılar menüsü ---------- */
.pillars-wide { margin-top: clamp(2rem, 5vw, 3.2rem); }
.god-emblem { aspect-ratio: 200 / 308; height: auto; }
.sub-logo.god-emblem { width: min(15rem, 55%); }

.hub { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; }
.hub > .frieze { flex: none; }
.hub-main { flex: 1; display: grid; place-items: center; padding: clamp(0.5rem, 2svh, 1.5rem) var(--gutter); outline: none; }

.stage { width: min(100%, 72rem); display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: clamp(1rem, 5vw, 5rem); row-gap: clamp(1rem, 4svh, 3rem); }
.gods { display: contents; }

.stage-center { grid-column: 2; grid-row: 1; text-align: center; }
.stage-logo { width: min(43svh, 36vw, 28rem); aspect-ratio: 1; margin-inline: auto; }
.stage-motto { margin: clamp(0.6rem, 2svh, 1.4rem) 0 0; font-family: var(--display); font-weight: 600; text-transform: uppercase; letter-spacing: 0.22em; font-size: clamp(0.62rem, 1.3svh + 0.2rem, 0.85rem); color: var(--gold); line-height: 1.3; }

.god a { display: grid; justify-items: center; gap: clamp(1.1rem, 2.6svh, 1.8rem); text-decoration: none; text-align: center; padding: 0.4rem; }
.god .god-emblem { height: min(24svh, 22rem); width: auto; transform-origin: 50% 100%; transition: transform 0.35s cubic-bezier(0.2, 0.7, 0.2, 1); }
.god-label { font-family: var(--display); font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; font-size: clamp(0.85rem, 1.6svh + 0.3rem, 1.15rem); color: var(--stone); line-height: 1.2; padding-bottom: 0.3rem; border-bottom: 1px solid transparent; transition: border-color 0.25s, color 0.25s; }
.god .god-emblem.god-square { aspect-ratio: 1; height: min(23svh, 20rem); }
.god a:hover .god-emblem, .god a:focus-visible .god-emblem { transform: translateY(-6px) scale(1.04); }
.god a:hover .god-label, .god a:focus-visible .god-label { border-bottom-color: var(--gold); color: var(--gold); }

/* masaüstü: logo ortada, beş öğe etrafında beşgen düzende (üst Kut Mührü, sağ üst Yapım, sağ alt Günlük, sol alt İletişim, sol üst Müzik); alt orta boş, slogan orada */
@media (min-width: 52rem) {
  .stage { --logo-w: min(36svh, 30vw, 27rem); --pair: calc(max(var(--logo-w) / 2, 7rem) + 8svh + 1.5rem); display: block; position: relative; height: 100%; align-self: stretch; }
  .stage-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
  .stage-logo { width: var(--logo-w); }
  .stage-motto { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); width: 15em; text-wrap: balance; text-align: center; margin: clamp(0.4rem, 1.5svh, 1rem) 0 0; }
  .god { position: absolute; transform: translate(-50%, -50%); }
  .god .god-emblem { height: min(18svh, 17rem); }
  .god .god-emblem.god-square { height: min(17svh, 15rem); }
  .god-label { font-size: clamp(0.8rem, 1.3svh + 0.3rem, 1.05rem); }
  .god-5 { left: 50%; top: 15%; }
  .god-2 { left: 85%; top: 39%; }
  .god-3 { left: calc(50% + var(--pair)); top: 78.3%; }
  .god-4 { left: calc(50% - var(--pair)); top: 78.3%; }
  .god-1 { left: 15%; top: 39%; }
}

/* hover/odak animasyonları: her tanrının simgesi kendi hareketini yapar */
.god-emblem .an { transform-box: fill-box; }
@media (prefers-reduced-motion: no-preference) {
  .god-emblem .an-wing { transform-origin: 50% 50%; }
  .god-emblem .an-o-r { transform-origin: 100% 70%; --d: 1; }
  .god-emblem .an-o-l { transform-origin: 0% 70%; --d: -1; }
  .god-emblem .an-o-br { transform-origin: 100% 100%; --d: 1; }
  .god-emblem .an-o-iris { transform-origin: 100% 25%; --d: 1; }
  .god-emblem .an-ripple { opacity: 0; transform-origin: 50% 50%; }
  .god-emblem .an-sun { transform-origin: 50% 50%; transform-box: view-box; transform-origin: 100px 38px; }
  .god-emblem .an-lyre { transform-origin: 50% 90%; }
  .god-emblem .an-spin, .god-emblem .an-spin-rev { transform-box: view-box; transform-origin: 80px 80px; }

  .god a:hover .an-thump, .god a:focus-visible .an-thump { animation: god-thump 1.5s ease-in-out infinite; }
  .god a:hover .an-ripple, .god a:focus-visible .an-ripple { animation: god-ripple 1.5s ease-out infinite; }
  .god a:hover .an-wing, .god a:focus-visible .an-wing { animation: god-flap 0.7s ease-in-out infinite; }
  .god a:hover .an-o-iris, .god a:focus-visible .an-o-iris { animation-name: god-flutter; animation-duration: 1.1s; }
  .god a:hover .an-sun, .god a:focus-visible .an-sun { animation: god-sun 9s linear infinite; }
  .god a:hover .an-lyre, .god a:focus-visible .an-lyre { animation: god-lyre 2.4s ease-in-out infinite; }
  .god a:hover .an-strings, .god a:focus-visible .an-strings { animation: god-strings 0.14s linear infinite; }
  .god a:hover .an-spin, .god a:focus-visible .an-spin { animation: god-spin 14s linear infinite; }
  .god a:hover .an-spin-rev, .god a:focus-visible .an-spin-rev { animation: god-spin 18s linear infinite reverse; }
}
@keyframes god-thump {
  0%, 100% { transform: translateY(0); }
  35% { transform: translateY(-11px); }
  50% { transform: translateY(0); }
  58% { transform: translateY(-2px); }
  66% { transform: translateY(0); }
}
@keyframes god-ripple {
  0%, 48% { opacity: 0; transform: scale(0.4); }
  50% { opacity: 0.9; transform: scale(0.6); }
  85%, 100% { opacity: 0; transform: scale(4); }
}
@keyframes god-flap { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(calc(24deg * var(--d, 1))); } }
@keyframes god-flutter { 0%, 100% { transform: rotate(0) scaleX(1); } 50% { transform: rotate(calc(12deg * var(--d, 1))) scaleX(0.9); } }
@keyframes god-sun { to { transform: rotate(360deg); } }
@keyframes god-lyre { 0%, 100% { transform: rotate(0); } 30% { transform: rotate(-3deg); } 70% { transform: rotate(3deg); } }
@keyframes god-strings { 0%, 100% { transform: translateX(-0.9px); } 50% { transform: translateX(0.9px); } }
@keyframes god-spin { to { transform: rotate(360deg); } }

.hub-foot { flex: none; text-align: center; padding-bottom: 0.6rem; }
.hub-foot .frieze { margin-bottom: 0.4rem; }
.hub-foot p { margin: 0; line-height: 1.3; font-size: 0.75rem; color: var(--stone-muted); letter-spacing: 0.04em; }

@media (max-width: 51.99rem) {
  .stage { grid-template-columns: repeat(5, minmax(0, 1fr)); align-content: center; column-gap: 0.25rem; row-gap: clamp(0.5rem, 2.5svh, 1.4rem); }
  .stage-center { grid-column: 1 / -1; grid-row: 1; }
  .stage-logo { width: min(40svh, 74vw, 22rem); }
  .god-1 { grid-column: 1; grid-row: 2; justify-self: center; }
  .god-2 { grid-column: 2; grid-row: 2; justify-self: center; }
  .god-3 { grid-column: 3; grid-row: 2; justify-self: center; }
  .god-4 { grid-column: 4; grid-row: 2; justify-self: center; }
  .god-5 { grid-column: 5; grid-row: 2; justify-self: center; }
  .god-1, .god-2, .god-3, .god-4, .god-5 { align-self: end; }
  .god-1, .god-3 { transform: translateY(-1.6svh); }
  .god-2, .god-4 { transform: translateY(1.2svh); }
  .god a { padding: 0.1rem; gap: 0.2rem; }
  .god .god-emblem { width: 100%; height: auto; max-height: 30svh; }
  .god .god-emblem.god-square { width: 100%; height: auto; aspect-ratio: 1; }
  .god-label { letter-spacing: 0.04em; font-size: clamp(0.46rem, 2vw, 0.8rem); white-space: nowrap; }
}

@media (prefers-reduced-motion: no-preference) {
  .stage-logo, .god { animation: hub-in 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
  .god-5 { animation-delay: 0.65s; }
  .god-1 { animation-delay: 0.25s; } .god-2 { animation-delay: 0.35s; } .god-3 { animation-delay: 0.45s; } .god-4 { animation-delay: 0.55s; }
}
@keyframes hub-in { from { opacity: 0; } to { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* müzik sayfası: evrenler, proje başlıkları, yayın kartları */
.music-intro { display: grid; grid-template-columns: minmax(0, 9rem) minmax(0, 1fr); gap: clamp(1.2rem, 4vw, 2.4rem); align-items: center; margin-bottom: clamp(2rem, 5vw, 3.2rem); }
.music-intro-logo { width: 100%; }
.music-intro h3 { font-size: 1.35rem; margin-bottom: 0.4rem; letter-spacing: 0.01em; }
.music-intro p { margin: 0; color: var(--stone-muted); max-width: 52ch; }
@media (max-width: 36rem) { .music-intro { grid-template-columns: 5.5rem minmax(0, 1fr); } }

.universes { display: grid; gap: clamp(1rem, 3vw, 1.6rem); grid-template-columns: 1fr; margin-bottom: clamp(2.5rem, 6vw, 4rem); }
@media (min-width: 52rem) { .universes { grid-template-columns: 1fr 1fr; } }
.universe { border: 1px solid var(--line); padding: clamp(1.4rem, 3vw, 2.2rem); display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem; transition: border-color 0.2s; }
.universe:hover { border-color: var(--gold); }
.universe-logo { width: 5rem; height: 5rem; object-fit: contain; margin-bottom: 0.6rem; }
.universe h3 { font-size: 1.4rem; margin: 0; letter-spacing: 0.01em; }
.universe-tag { margin: 0; font-family: var(--display); text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.78rem; color: var(--gold); }
.universe p:not([class]) { margin: 0.4rem 0 0; color: var(--stone-muted); font-size: 0.95rem; max-width: 52ch; }
.universe-stats { margin: 0.6rem 0 0; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.04em; color: var(--stone); }
.universe-actions { margin: auto 0 0; padding-top: 1.2rem; display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; }

.proj-head { display: grid; grid-template-columns: minmax(0, 7.5rem) minmax(0, 1fr); gap: clamp(1.2rem, 4vw, 2.6rem); align-items: start; margin-bottom: 2rem; }
.proj-logo { width: 100%; max-width: 7.5rem; object-fit: contain; }
@media (max-width: 36rem) { .proj-head { grid-template-columns: 4.5rem minmax(0, 1fr); } }
.proj-title { font-family: var(--display); font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; font-size: clamp(1.5rem, 3.6vw, 2.3rem); margin: 0 0 0.5rem; }
.proj-tag { margin: 0 0 1.1rem; font-family: var(--display); text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.8rem; color: var(--gold); }
.proj-text { margin: 0 0 0.9rem; color: var(--stone-muted); max-width: 64ch; }
.proj-note { margin: 0; padding-left: 1rem; border-left: 2px solid var(--blood); font-size: 0.88rem; color: var(--stone-muted); max-width: 64ch; }
.proj-quote { margin: 1.4rem 0 0; padding-left: 1rem; border-left: 2px solid var(--gold); max-width: 64ch; }
.proj-quote p { margin: 0; font-family: var(--display); font-size: 1.02rem; letter-spacing: 0.02em; font-style: italic; }
.proj-quote footer { margin-top: 0.3rem; font-size: 0.85rem; color: var(--stone-muted); }
.proj-platforms { margin: 1.6rem 0 0; }

.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 0; margin: 0; border-block: 1px solid var(--line-soft); }
.facts > div { padding: 1rem 1.2rem 1rem 0; }
.facts dt { font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 0.2rem; }
.facts dd { margin: 0; font-size: 0.95rem; }

.rgroup-title { font-size: 1.15rem; letter-spacing: 0.06em; margin: clamp(2.4rem, 5vw, 3.4rem) 0 1.2rem; padding-bottom: 0.7rem; border-bottom: 1px solid var(--line); display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.rgroup-title span { font-family: var(--text); font-size: 0.85rem; font-weight: 500; letter-spacing: 0.02em; color: var(--stone-muted); }
.rgrid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.rcard { display: flex; flex-direction: column; gap: 0.35rem; border: 1px solid var(--line-soft); background: var(--obsidian); padding: 1.3rem 1.3rem 1.2rem; transition: border-color 0.2s; }
.section:not(.section-alt) .rcard { background: var(--charcoal); }
.rcard:hover { border-color: var(--line); }
.rcard-top { margin: 0; display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.rcard-type { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone); }
.rcard-title { font-size: 1.2rem; margin: 0.2rem 0 0; line-height: 1.3; letter-spacing: 0.01em; }
.rcard-meta { margin: 0; font-size: 0.82rem; color: var(--stone-muted); }
.rcard-actions { margin-top: auto; padding-top: 1rem; }
.tracks { margin-top: 0.7rem; border-top: 1px solid var(--line-soft); padding-top: 0.7rem; }
.tracks summary { cursor: pointer; font-size: 0.82rem; font-weight: 600; letter-spacing: 0.04em; color: var(--gold); list-style: none; }
.tracks summary::-webkit-details-marker { display: none; }
.tracks summary::before { content: '+'; display: inline-block; width: 1.1rem; }
.tracks[open] summary::before { content: '–'; }
.tracks summary:hover { color: var(--stone); }
.tracks ol { margin: 0.7rem 0 0; padding: 0; list-style: none; counter-reset: t; }
.tracks li { counter-increment: t; display: flex; gap: 0.7rem; align-items: baseline; padding: 0.3rem 0; font-size: 0.86rem; border-bottom: 1px dotted var(--line-soft); }
.tracks li:last-child { border-bottom: 0; }
.tracks li::before { content: counter(t); min-width: 1.3rem; font-variant-numeric: tabular-nums; color: var(--stone-muted); font-size: 0.78rem; }
.tracks li span { flex: 1; min-width: 0; }
.tracks time { color: var(--stone-muted); font-variant-numeric: tabular-nums; font-size: 0.8rem; }

.cast { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.cast-item, .podcast { border: 1px solid var(--line-soft); padding: 1.3rem; background: var(--charcoal); }
.cast-item h4, .podcast h4 { font-size: 1.15rem; margin: 0.1rem 0 0.5rem; }
.cast-item p:last-child, .podcast p:last-child { margin: 0; font-size: 0.92rem; color: var(--stone-muted); }
.cast-role { margin: 0; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }
.podcast { margin-top: clamp(2.4rem, 5vw, 3.4rem); max-width: 46rem; display: flex; align-items: center; gap: 1.4rem; }
.podcast-logo { flex: none; width: clamp(6.5rem, 22vw, 9rem); height: auto; mix-blend-mode: lighten; }
@media (max-width: 30rem) { .podcast { flex-direction: column; align-items: flex-start; } }

.former { font-family: var(--text); font-size: 0.62em; font-weight: 500; letter-spacing: 0.02em; text-transform: none; color: var(--stone-muted); white-space: nowrap; }
.proj-title .former { font-size: 0.4em; letter-spacing: 0.04em; }
.status-badge { display: inline-block; margin-left: 0.6rem; padding: 0.05rem 0.55rem; border: 1px solid var(--stone-muted); color: var(--stone-muted); font-family: var(--text); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; vertical-align: 0.1em; }
.proj-note + .proj-quote { margin-top: 1.4rem; }

.roles { margin: 1.2rem 0 0; font-size: 0.9rem; color: var(--stone-muted); }
.chips-title { font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); font-family: var(--text); font-weight: 600; margin: 1.8rem 0 0.8rem; }
.chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.chips li { padding: 0.35rem 0.9rem; border: 1px solid var(--line); font-size: 0.88rem; }
.cast-lineup { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.cast-lineup .cast-item { background: transparent; }
.cast-lineup h4 { margin: 0.2rem 0 0; }
.page-title .former { font-size: 0.2em; letter-spacing: 0.04em; display: block; margin-top: 0.5rem; text-transform: none; }

/* DZS yeni kimlik: logo, kapaklar, kadro fotoğrafları, görsel dünya */
.universe-logo, .universe-logo-wide { width: auto; height: 6rem; max-width: 100%; margin-bottom: 0.6rem; }
.proj-head, .proj-head:has(.proj-logo-wide) { grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); }
.proj-logo, .proj-logo-wide { height: 7rem; width: auto; max-width: 100%; }
@media (max-width: 36rem) { .proj-head, .proj-head:has(.proj-logo-wide) { grid-template-columns: 1fr; } .proj-logo, .proj-logo-wide { height: 5.5rem; } }
.sub-logo-wide { width: min(26rem, 80%); height: auto; }

.rcard.has-cover { padding-top: 0; }
.rcard-cover { display: block; width: calc(100% + 2.6rem); max-width: none; margin: 0 -1.3rem 0.9rem; aspect-ratio: 1; object-fit: cover; background: #000; border-bottom: 1px solid var(--line-soft); }
.rcard-note { margin: 0; font-size: 0.85rem; color: var(--stone-muted); }

.featured.has-cover { display: grid; gap: clamp(1.4rem, 4vw, 2.6rem); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 40rem) { .featured.has-cover { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); } }
.featured-cover { width: 100%; max-width: 15rem; aspect-ratio: 1; object-fit: cover; border: 1px solid var(--line); }
.featured.has-cover .featured-title { font-size: clamp(1.8rem, 4.6vw, 3rem); overflow-wrap: anywhere; }

.upcoming { margin-top: clamp(1.6rem, 4vw, 2.4rem); padding: 1.2rem 1.4rem; border: 1px dashed var(--gold); }
.upcoming .tag { margin: 0 0 0.3rem; }
.upcoming-title { font-size: 1.25rem; margin: 0 0 0.4rem; letter-spacing: 0.04em; }
.upcoming p:last-child { margin: 0; color: var(--stone-muted); font-size: 0.92rem; }

.cast-lineup { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.cast-item.has-photo { padding: 0; overflow: hidden; }
.cast-photo { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-bottom: 1px solid var(--line-soft); }
.cast-body { padding: 1.1rem 1.3rem 1.3rem; }
.cast-item:not(.has-photo) .cast-body { padding: 0; }
.cast-tone { margin: 0.45rem 0 0; font-size: 0.86rem; color: var(--stone-muted); }
.cast-tone span { display: inline-block; min-width: 3.6rem; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
.cast-item p.cast-tone:last-child { font-size: 0.86rem; }

.swatches { list-style: none; margin: 0 0 0.8rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem 1.4rem; font-size: 0.88rem; }
.swatches li { display: inline-flex; align-items: center; gap: 0.5rem; }
.swatches code { color: var(--stone-muted); font-size: 0.8rem; }
.swatch { width: 1.1rem; height: 1.1rem; border: 1px solid var(--line); display: inline-block; }
.visual-note { margin: 0 0 1.6rem; font-size: 0.88rem; color: var(--stone-muted); max-width: 64ch; }
.gallery { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.8rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.gallery img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid var(--line-soft); }
.cast-lead { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); margin-bottom: 1rem; }
.cast-lead .cast-item { background: transparent; }
.cast-tone span { display: block; min-width: 0; margin-bottom: 0.1rem; }
.cast-lineup { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }

/* Yayın kartları: tıklanabilir, hover'da parlama; kilitli (yakında) kart */
.rcard:not(.rcard-locked) { cursor: pointer; position: relative; transition: border-color 0.25s, box-shadow 0.35s, transform 0.35s; }
.rcard:not(.rcard-locked):hover, .rcard:not(.rcard-locked):focus-within {
  border-color: var(--gold);
  box-shadow: 0 0 0 1px rgba(176, 138, 62, 0.35), 0 0 1.6rem rgba(228, 176, 64, 0.22), 0 0.8rem 2rem rgba(0, 0, 0, 0.5);
  transform: translateY(-3px);
}
.rcard-cover { transition: filter 0.35s, transform 0.5s; }
.rcard:hover .rcard-cover { filter: brightness(1.12) saturate(1.08); }
.rcard.has-cover { overflow: hidden; }
.rcard::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; background: linear-gradient(115deg, transparent 35%, rgba(255, 236, 190, 0.1) 50%, transparent 65%); transform: translateX(-60%); }
.rcard:not(.rcard-locked):hover::after { opacity: 1; transform: translateX(60%); transition: transform 0.9s ease, opacity 0.3s; }
@media (prefers-reduced-motion: reduce) { .rcard:not(.rcard-locked):hover { transform: none; } .rcard:hover::after { display: none; } }

.rcard-locked { position: relative; cursor: default; border-style: dashed; border-color: var(--gold); }
.locked-ghost { display: flex; flex-direction: column; gap: 0.35rem; filter: blur(8px) saturate(0.8); opacity: 0.85; user-select: none; pointer-events: none; flex: 1; }
.locked-cover { background: radial-gradient(circle at 30% 25%, #3a2e12, #0b0b0b 70%); }
.locked-badge { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.6rem; color: var(--gold); background: rgba(10, 10, 10, 0.35); }
.locked-label { font-family: var(--display); text-transform: uppercase; letter-spacing: 0.3em; font-size: 0.85rem; font-weight: 700; }
.rcard-locked::after { display: none; }

/* Yayın sayfaları */
.rel-page { padding-top: clamp(2rem, 5vw, 3.5rem); }
.rel-grid { display: grid; gap: clamp(1.6rem, 5vw, 3.4rem); grid-template-columns: 1fr; align-items: center; margin-top: 1.4rem; }
@media (min-width: 46rem) { .rel-grid { grid-template-columns: minmax(0, 24rem) minmax(0, 1fr); } }
.rel-cover { width: 100%; max-width: 24rem; aspect-ratio: 1; object-fit: cover; border: 1px solid var(--line); box-shadow: 0 0 2.4rem rgba(228, 176, 64, 0.12); }
.rel-title { font-family: var(--display); text-transform: uppercase; letter-spacing: 0.06em; font-size: clamp(2rem, 6vw, 3.6rem); line-height: 1.05; margin: 0.2rem 0 0.6rem; overflow-wrap: anywhere; }
.rel-artist { margin: 0 0 0.4rem; font-weight: 600; letter-spacing: 0.04em; }
.rel-meta { margin: 0 0 1rem; color: var(--stone-muted); font-size: 0.92rem; }
.rel-note { margin: 0 0 1rem; color: var(--stone-muted); max-width: 52ch; }
.rel-info .chips-title { margin-top: 1.4rem; }
.rel-cols { display: grid; gap: clamp(1.6rem, 5vw, 3.4rem); grid-template-columns: 1fr; margin-top: clamp(2.4rem, 6vw, 4rem); }
@media (min-width: 52rem) { .rel-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.rel-tracks { list-style: none; margin: 0; padding: 0; counter-reset: t; }
.rel-tracks li { counter-increment: t; display: flex; gap: 0.9rem; align-items: baseline; padding: 0.65rem 0; border-bottom: 1px dotted var(--line); }
.rel-tracks li::before { content: counter(t); min-width: 1.6rem; color: var(--gold); font-variant-numeric: tabular-nums; font-size: 0.85rem; }
.rel-tracks li span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.rel-tracks time { color: var(--stone-muted); font-variant-numeric: tabular-nums; font-size: 0.88rem; }
.player { border: 1px dashed var(--line); padding: 1.4rem; display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }
.player p { margin: 0; color: var(--stone-muted); font-size: 0.9rem; }
.player iframe { display: block; border-radius: 12px; }
.player:has(iframe) { padding: 0; border: 0; }
.rel-nav { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-top: clamp(2.4rem, 6vw, 4rem); padding-top: 1.4rem; border-top: 1px solid var(--line); }
.rel-nav-link { display: flex; flex-direction: column; gap: 0.15rem; text-decoration: none; color: var(--stone); font-family: var(--display); letter-spacing: 0.04em; }
.rel-nav-link span { font-family: var(--text); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }
.rel-nav-link:hover { color: var(--gold); }
.dialog-more { margin: 1.2rem 0 0; }

/* DZS hero: eski VHS kaydı hissi */
.hero-vhs { position: relative; overflow: hidden; }
.hero-vhs::before { content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 1; background: repeating-linear-gradient(to bottom, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 3px); mix-blend-mode: screen; }
.vhs-play, .vhs-date { position: absolute; z-index: 2; font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size: clamp(0.72rem, 1.6vw, 0.95rem); letter-spacing: 0.12em; color: rgba(237, 237, 237, 0.82); text-shadow: 1px 0 rgba(255, 0, 0, 0.45), -1px 0 rgba(0, 180, 255, 0.4); }
.vhs-play { top: 1rem; left: clamp(1rem, 3vw, 2rem); }
.vhs-date { bottom: 1.4rem; right: clamp(1rem, 3vw, 2rem); }
@media (prefers-reduced-motion: no-preference) {
  .hero-vhs .sub-logo { animation: vhs-jitter 6s steps(1) infinite; }
  .vhs-play { animation: vhs-blink 2.4s steps(1) infinite; }
}
@keyframes vhs-jitter { 0%, 93%, 100% { transform: none; filter: none; } 94% { transform: translateX(3px); filter: drop-shadow(-3px 0 rgba(255, 0, 0, 0.5)) drop-shadow(3px 0 rgba(0, 200, 255, 0.45)); } 96% { transform: translateX(-2px); } 97% { transform: none; filter: brightness(1.2); } }
@keyframes vhs-blink { 0%, 80% { opacity: 1; } 81%, 100% { opacity: 0.35; } }
.locked-date { font-size: 0.95rem; letter-spacing: 0.08em; color: var(--stone); }
.locked-count { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--stone-muted); }

/* Şarkı hikayeleri */
.rel-tracks li { align-items: flex-start; }
.rel-tracks li::before { padding-top: 0.15rem; }
.track-story, .track-plain { flex: 1; min-width: 0; }
.track-story summary, .track-plain { display: flex; gap: 0.9rem; align-items: baseline; }
.track-story summary { cursor: pointer; list-style: none; }
.track-story summary::-webkit-details-marker { display: none; }
.track-story summary span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.track-story summary::after { content: '+'; color: var(--gold); font-size: 1.1rem; line-height: 1; order: 3; width: 1rem; text-align: center; }
.track-story[open] summary::after { content: '–'; }
.track-story summary:hover span { color: var(--gold); }
.track-story p { margin: 0.7rem 0 0.4rem; padding-left: 0.9rem; border-left: 2px solid var(--gold); color: var(--stone-muted); font-size: 0.93rem; line-height: 1.65; max-width: 62ch; }
.track-story summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.story-note { margin: 1rem 0 0; font-size: 0.8rem; color: var(--stone-muted); }

/* ---------- Müzik landing: kartın tamamı tıklanır ---------- */
.universe { position: relative; }
.universe .stretch::after { content: ''; position: absolute; inset: 0; }
.featured-more { margin: 1.2rem 0 0; }
.universe-dn { border-color: rgba(163, 20, 28, 0.6); background: radial-gradient(120% 90% at 50% 0%, rgba(139, 13, 13, 0.28), transparent 70%), #0a0606; }
.universe-dn:hover { border-color: #d94a4a; box-shadow: 0 0 2rem rgba(163, 20, 28, 0.35); }
.universe-dn h3 { font-family: 'New Rocker', var(--display); font-size: 1.9rem; font-weight: 400; letter-spacing: 0.03em; }
.universe-dn .universe-tag { color: #e0605f; }
.universe-dn .btn { border-color: #a3141c; }
.universe-dn .btn:hover { background: rgba(163, 20, 28, 0.22); border-color: #d94a4a; }
.universe-dn .universe-logo { mix-blend-mode: lighten; }

/* ---------- Demonium Nihil teması: gotik, karanlık, kan kırmızısı ---------- */
body.theme-dn {
  --obsidian: #060404;
  --charcoal: #120a0a;
  --stone: #dcd1c6;
  --stone-muted: #b0a396;
  --gold: #e0605f;
  --blood: #8b0d0d;
  --line: rgba(163, 20, 28, 0.55);
  --line-soft: rgba(215, 150, 140, 0.16);
  --display: 'New Rocker', 'Cinzel', Georgia, serif;
  background: radial-gradient(130% 55% at 50% -8%, rgba(139, 13, 13, 0.32), transparent 62%), #060404;
  background-attachment: scroll;
}
.theme-dn ::selection { background: #8b0d0d; color: #fff; }
.theme-dn :focus-visible { outline-color: #e0605f; }
.theme-dn .topbar { background: rgba(6, 4, 4, 0.95); border-bottom-color: rgba(163, 20, 28, 0.4); }
.theme-dn .brand-name { color: var(--stone); }
.theme-dn .nav-cta { border-color: #a3141c; color: #e0605f; }
.theme-dn .page-title, .theme-dn .section-title, .theme-dn h3, .theme-dn h4, .theme-dn .rel-title, .theme-dn .rgroup-title, .theme-dn .featured-title {
  font-family: 'New Rocker', 'Cinzel', serif; text-transform: none; letter-spacing: 0.03em; font-weight: 400;
}
.theme-dn .page-title { font-size: clamp(3rem, 9vw, 6rem); line-height: 1; font-weight: 400; }
.theme-dn .section-title { font-size: clamp(2.2rem, 5vw, 3.4rem); letter-spacing: 0.01em; border-bottom: 0; padding-bottom: 0.2rem; text-shadow: 0 0 1.4rem rgba(163, 20, 28, 0.55); }
.theme-dn .section-count { font-family: var(--text); font-size: 0.8rem; font-weight: 500; letter-spacing: 0.04em; color: var(--stone-muted); text-shadow: none; margin-left: 0.8rem; }
.theme-dn .rgroup-title { font-size: 1.7rem; border-bottom: 1px solid var(--line); }
.theme-dn .rcard-title, .theme-dn .cast-item h3, .theme-dn .podcast h3 { font-size: 1.5rem; font-weight: 400; line-height: 1.15; }
.theme-dn .rel-title { font-size: clamp(2.4rem, 6vw, 4rem); }
.theme-dn .btn { border-color: #a3141c; }
.theme-dn .btn:hover { border-color: #e0605f; background: rgba(163, 20, 28, 0.2); }
.theme-dn .btn-primary { background: #8b0d0d; border-color: #c2272d; color: #fff; }
.theme-dn .btn-primary:hover { background: #b3141c; border-color: #e0605f; color: #fff; }
.theme-dn .text-link { color: #e0605f; }
.theme-dn .tag { background: #8b0d0d; color: #fff; }
.theme-dn .status-badge { border-color: #a3141c; color: #e0605f; }
.theme-dn .frieze { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 22 22'%3E%3Cpath d='M0 22V0H22V16H6V6H16V11' fill='none' stroke='%23a3141c' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E"); }
.theme-dn .footer-motto { color: #e0605f; }

/* Hero */
.hero-dn { position: relative; overflow: hidden; padding: clamp(3rem, 7vw, 5.5rem) 0 clamp(3rem, 7vw, 5rem); text-align: center; isolation: isolate; }
.hero-dn::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 55% at 50% 36%, rgba(163, 20, 28, 0.38), transparent 70%); }
.hero-dn::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 30%; z-index: -1; background: linear-gradient(to bottom, transparent, #060404); }
.dn-hero-inner { display: flex; flex-direction: column; align-items: center; }
.hero-dn .crumbs { align-self: flex-start; }
.dn-sigil { width: clamp(9rem, 26vw, 15rem); height: auto; mix-blend-mode: lighten; filter: drop-shadow(0 0 2.2rem rgba(200, 30, 40, 0.55)); margin: 0.6rem 0 0.8rem; }
.dn-title { margin: 0.2rem 0 0.4rem; text-shadow: 0 0 2.4rem rgba(200, 30, 40, 0.65), 0 0.2rem 0 #000; }
.dn-tag { font-family: var(--display); font-size: clamp(1.3rem, 3vw, 1.8rem); color: #e0605f; margin: 0 0 1.4rem; letter-spacing: 0.04em; }
.dn-lead { max-width: 54ch; margin-inline: auto; text-align: center; font-size: 1.1rem; }
.dn-motto { margin: 0.4rem auto 2rem; padding: 0; border: 0; max-width: 40rem; }
.dn-motto p { font-family: var(--display); font-style: italic; font-size: clamp(1.15rem, 2.6vw, 1.5rem); color: var(--stone); margin: 0 0 0.3rem; line-height: 1.3; }
.dn-motto footer { font-size: 0.9rem; color: var(--stone-muted); }
.dn-actions { display: flex; gap: 0.9rem; flex-wrap: wrap; justify-content: center; margin: 0; }
.dn-star { position: absolute; z-index: -1; left: 50%; top: 4rem; width: min(46rem, 130vw); aspect-ratio: 1; transform: translateX(-50%); color: rgba(190, 30, 40, 0.22); pointer-events: none; }
.embers { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.embers span { position: absolute; bottom: -10px; border-radius: 50%; background: #ff6a3d; box-shadow: 0 0 8px 2px rgba(255, 90, 40, 0.7); opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  .dn-star { animation: dn-spin 140s linear infinite; }
  .embers span { animation: dn-ember linear infinite; }
  .dn-title { animation: dn-flicker 7s infinite; }
}
@keyframes dn-spin { to { transform: translateX(-50%) rotate(360deg); } }
@keyframes dn-ember { 0% { transform: translate(0, 0); opacity: 0; } 12% { opacity: 0.9; } 100% { transform: translate(var(--drift, 0), -34rem); opacity: 0; } }
@keyframes dn-flicker { 0%, 100% { text-shadow: 0 0 2.4rem rgba(200, 30, 40, 0.65), 0 0.2rem 0 #000; } 46% { text-shadow: 0 0 2.4rem rgba(200, 30, 40, 0.65), 0 0.2rem 0 #000; } 48% { text-shadow: 0 0 1rem rgba(200, 30, 40, 0.35), 0 0.2rem 0 #000; } 50% { text-shadow: 0 0 3rem rgba(230, 40, 50, 0.85), 0 0.2rem 0 #000; } }
@media (prefers-reduced-motion: reduce) { .embers { display: none; } }

/* Ayraç: ters haç */
.dn-rule { display: flex; align-items: center; gap: 1.2rem; width: min(100% - 2 * var(--gutter), 46rem); margin: 0 auto; color: #a3141c; }
.dn-rule::before, .dn-rule::after { content: ''; flex: 1; height: 1px; background: linear-gradient(to right, transparent, #a3141c 40%, #a3141c 60%, transparent); }
.dn-rule svg { flex: none; filter: drop-shadow(0 0 6px rgba(200, 30, 40, 0.7)); }

.dn-section { padding-block: clamp(3rem, 7vw, 5.5rem); }
.dn-status { color: var(--stone-muted); font-size: 0.95rem; border-left: 2px solid #a3141c; padding-left: 1rem; margin-top: 1.4rem; }
.theme-dn .facts { border-block-color: rgba(163, 20, 28, 0.5); margin-top: 2rem; }

/* Kartlar */
.theme-dn .cast-item, .theme-dn .podcast, .theme-dn .rcard { background: linear-gradient(180deg, #150b0b, #0a0606); border-color: rgba(163, 20, 28, 0.35); }
.theme-dn .cast-item { position: relative; border-top: 2px solid #a3141c; }
.theme-dn .rcard:not(.rcard-locked):hover, .theme-dn .rcard:not(.rcard-locked):focus-within {
  border-color: #e0605f;
  box-shadow: 0 0 0 1px rgba(224, 96, 95, 0.4), 0 0 2rem rgba(200, 30, 40, 0.4), 0 0.8rem 2rem rgba(0, 0, 0, 0.6);
}
.theme-dn .rcard::after { background: linear-gradient(115deg, transparent 35%, rgba(255, 120, 100, 0.12) 50%, transparent 65%); }
.theme-dn .rcard-cover { border-bottom-color: rgba(163, 20, 28, 0.5); }
.theme-dn .rcard-type { color: #e0605f; }
.theme-dn .release-year { color: #e0605f; }
.theme-dn .rel-cover { border-color: rgba(163, 20, 28, 0.7); box-shadow: 0 0 3rem rgba(200, 30, 40, 0.3); }
.theme-dn .rel-nav-link span, .theme-dn .chips-title, .theme-dn .cast-role { color: #e0605f; }
.theme-dn .podcast { max-width: 52rem; }
.theme-dn .platform-links .btn { border-color: #a3141c; }
.theme-dn .dialog-box { border-color: #a3141c; }

.theme-dn .brand-name, .theme-dn .footer-motto { font-family: 'Cinzel', Georgia, serif; }
.theme-dn .dn-tag, .theme-dn .dn-motto p { font-family: 'New Rocker', 'Cinzel', serif; font-style: normal; }
.universe-dn .universe-logo { height: 7rem; }
.mail-link { overflow-wrap: anywhere; }

/* ---------- DZS teması: uzay, synth, 80'ler ---------- */
.universe-dzs { background: radial-gradient(120% 90% at 50% 0%, rgba(120, 60, 255, 0.22), transparent 70%), #07051a; border-color: rgba(160, 110, 255, 0.5); }
.universe-dzs:hover { border-color: #ff3cac; box-shadow: 0 0 2rem rgba(255, 60, 172, 0.28); }
.universe-dzs h3 { font-family: 'Audiowide', var(--display); font-weight: 400; letter-spacing: 0.04em; }
.universe-dzs .universe-tag { color: #2de2e6; }
.universe-dzs .btn { border-color: #2de2e6; }
.universe-dzs .btn:hover { background: rgba(45, 226, 230, 0.14); border-color: #7ff6f8; }

body.theme-dzs {
  --obsidian: #05030d;
  --charcoal: #0e0a24;
  --stone: #ebe6f7;
  --stone-muted: #aaa4c6;
  --gold: #e4b040;
  --line: rgba(170, 120, 255, 0.5);
  --line-soft: rgba(170, 150, 255, 0.2);
  --neon-pink: #ff3cac;
  --neon-cyan: #2de2e6;
  --display: 'Audiowide', 'Cinzel', Georgia, sans-serif;
  position: relative;
  background: linear-gradient(180deg, #05030d 0%, #0a0624 38%, #05030d 100%);
}
.theme-dzs::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: 0.8;
  background-image:
    radial-gradient(1.2px 1.2px at 18px 40px, #fff, transparent 60%),
    radial-gradient(1px 1px at 120px 90px, #cfd8ff, transparent 60%),
    radial-gradient(1.6px 1.6px at 210px 20px, #ffd9f1, transparent 60%),
    radial-gradient(1px 1px at 70px 170px, #fff, transparent 60%),
    radial-gradient(1.4px 1.4px at 180px 210px, #b6fbff, transparent 60%),
    radial-gradient(1px 1px at 250px 140px, #fff, transparent 60%);
  background-size: 280px 260px;
}
@media (prefers-reduced-motion: no-preference) { .theme-dzs::before { animation: dzs-twinkle 6s ease-in-out infinite alternate; } }
@keyframes dzs-twinkle { from { opacity: 0.45; } to { opacity: 0.95; } }
.theme-dzs ::selection { background: #ff3cac; color: #fff; }
.theme-dzs :focus-visible { outline-color: #2de2e6; }
.theme-dzs .topbar { background: rgba(5, 3, 13, 0.92); border-bottom: 1px solid rgba(170, 120, 255, 0.35); }
.theme-dzs .brand-name { color: var(--stone); }
.theme-dzs .nav-cta { border-color: #2de2e6; color: #2de2e6; }
.theme-dzs .page-title, .theme-dzs .section-title, .theme-dzs h3, .theme-dzs h4, .theme-dzs .rel-title, .theme-dzs .rgroup-title, .theme-dzs .featured-title {
  font-family: 'Audiowide', 'Cinzel', sans-serif; font-weight: 400; letter-spacing: 0.06em;
}
.theme-dzs .prose h3.chips-title, .theme-dzs h3.chips-title, .theme-dzs .chips-title { font-family: var(--text); font-weight: 600; letter-spacing: 0.16em; color: #2de2e6; }
.theme-dzs .section-title {
  font-size: clamp(1.6rem, 4vw, 2.5rem); letter-spacing: 0.1em; border-bottom: 0; padding-bottom: 0.3rem;
  background: linear-gradient(90deg, #ff7ad9, #ffd34d); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 0.9rem rgba(255, 60, 172, 0.45)); width: fit-content;
}
.theme-dzs .section-desc { color: var(--stone-muted); }
.theme-dzs .section-alt { background: linear-gradient(180deg, rgba(60, 30, 140, 0.16), rgba(20, 8, 60, 0.08)); }
.theme-dzs .btn { border-color: #2de2e6; }
.theme-dzs .btn:hover { border-color: #7ff6f8; background: rgba(45, 226, 230, 0.12); }
.theme-dzs .btn-primary { background: #e4b040; border-color: #e4b040; color: #0a0600; box-shadow: 0 0 1.4rem rgba(228, 176, 64, 0.35); }
.theme-dzs .btn-primary:hover { background: #ffd34d; border-color: #ffd34d; }
.theme-dzs .text-link, .theme-dzs .prose a { color: #2de2e6; }
.theme-dzs .tag { background: #ff3cac; color: #1a0212; font-weight: 700; }
.theme-dzs .frieze { height: 3px; background: linear-gradient(90deg, transparent, #ff3cac, #2de2e6, transparent); box-shadow: 0 0 12px rgba(255, 60, 172, 0.6); opacity: 1; }
.theme-dzs .footer-motto { color: #2de2e6; }
.theme-dzs .chips li { border-color: rgba(45, 226, 230, 0.5); color: var(--stone); background: rgba(45, 226, 230, 0.05); }
.theme-dzs .facts { border-block-color: rgba(170, 120, 255, 0.4); }
.theme-dzs .facts dt, .theme-dzs .cast-role, .theme-dzs .rel-nav-link span { color: #2de2e6; }
.theme-dzs .prose .note { border-left-color: #ff3cac; background: rgba(60, 30, 140, 0.18); }
.theme-dzs .cast-item { background: linear-gradient(180deg, rgba(40, 20, 100, 0.35), rgba(8, 5, 24, 0.7)); border-color: rgba(170, 120, 255, 0.35); }
.theme-dzs .cast-lead .cast-item { background: transparent; }
.theme-dzs .rcard { background: linear-gradient(180deg, #0f0a2a, #070416); border-color: rgba(170, 120, 255, 0.3); }
.theme-dzs .rcard:not(.rcard-locked):hover, .theme-dzs .rcard:not(.rcard-locked):focus-within {
  border-color: #ff3cac;
  box-shadow: 0 0 0 1px rgba(255, 60, 172, 0.4), 0 0 1.8rem rgba(255, 60, 172, 0.35), 0 0 3rem rgba(45, 226, 230, 0.16), 0 0.8rem 2rem rgba(0, 0, 0, 0.6);
}
.theme-dzs .rcard::after { background: linear-gradient(115deg, transparent 35%, rgba(180, 240, 255, 0.14) 50%, transparent 65%); }
.theme-dzs .rcard-cover { border-bottom-color: rgba(170, 120, 255, 0.4); }
.theme-dzs .rcard-type, .theme-dzs .release-year { color: #ff7ad9; }
.theme-dzs .rcard-locked { border-color: #ff3cac; }
.theme-dzs .locked-badge { color: #ff7ad9; border-color: #ff3cac; }
.theme-dzs .rel-cover { border-color: rgba(255, 60, 172, 0.6); box-shadow: 0 0 3rem rgba(255, 60, 172, 0.28), 0 0 5rem rgba(45, 226, 230, 0.12); }
.theme-dzs .rel-title { font-size: clamp(2rem, 5vw, 3.4rem); }
.theme-dzs .track-story summary::after, .theme-dzs .track-story summary:hover span { color: #2de2e6; }
.theme-dzs .track-story p { border-left-color: #ff3cac; }
.theme-dzs .gallery img { border-color: rgba(170, 120, 255, 0.35); }
.theme-dzs .swatch { border-color: rgba(255, 255, 255, 0.4); }
.theme-dzs .player { border-color: rgba(170, 120, 255, 0.5); }
.theme-dzs .dialog-box { border-color: #ff3cac; }
.theme-dzs .mail-link { border-bottom-color: #2de2e6; }

/* Hero: retro güneş, perspektifli ızgara, kayan yıldız */
.hero-dzs { --dzs-floor: clamp(10rem, 24vw, 15rem); position: relative; overflow: hidden; isolation: isolate; text-align: center; padding: clamp(3rem, 7vw, 5rem) 0 clamp(14rem, 30vw, 20rem); }
.hero-dzs::before { z-index: 3; }
.dzs-hero-inner { position: relative; z-index: 4; display: flex; flex-direction: column; align-items: center; }
.hero-dzs .crumbs { align-self: flex-start; }
.dzs-hero-logo { width: min(24rem, 78vw); height: auto; margin: 0.4rem 0 0.8rem; filter: drop-shadow(0 0 2rem rgba(255, 60, 172, 0.45)) drop-shadow(0 0 0.6rem rgba(228, 176, 64, 0.35)); }
.dzs-title { font-size: clamp(1.6rem, 4.6vw, 3rem); margin: 0.2rem 0 0.5rem; background: linear-gradient(180deg, #fff 30%, #ff9ee6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; filter: drop-shadow(0 0 1.2rem rgba(255, 60, 172, 0.55)); text-transform: none; }
.dzs-title .former { -webkit-text-fill-color: var(--stone-muted); color: var(--stone-muted); font-size: 0.42em; letter-spacing: 0.06em; display: block; margin-top: 0.4rem; filter: none; }
.dzs-tag { font-family: 'Audiowide', var(--display); color: #2de2e6; letter-spacing: 0.3em; text-transform: uppercase; font-size: clamp(0.9rem, 2vw, 1.15rem); margin: 0 0 1.2rem; text-shadow: 0 0 1rem rgba(45, 226, 230, 0.7); }
.dzs-lead { max-width: 52ch; margin-inline: auto; text-align: center; color: #cfc8ea; text-shadow: 0 0 1rem #05030d, 0 0 0.4rem #05030d; }
.dzs-actions { display: flex; gap: 0.9rem; flex-wrap: wrap; justify-content: center; margin: 0; }
.dzs-sky { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.shooting-star { position: absolute; top: 14%; left: 78%; width: 9rem; height: 2px; background: linear-gradient(90deg, rgba(255, 255, 255, 0.95), transparent); transform: rotate(-24deg); opacity: 0; filter: drop-shadow(0 0 6px #fff); }
.shooting-star.s2 { top: 30%; left: 18%; width: 6rem; }
.dzs-sun {
  position: absolute; z-index: 1; left: 50%; bottom: calc(var(--dzs-floor) - 7rem); width: min(38rem, 90vw); aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%;
  background: linear-gradient(180deg, #ffd34d 0%, #ff8a3c 36%, #ff3cac 66%, #8a2bff 100%);
  -webkit-mask-image: linear-gradient(to bottom, #000 0 52%, transparent 52% 56%, #000 56% 63%, transparent 63% 68%, #000 68% 76%, transparent 76% 82%, #000 82% 90%, transparent 90% 95%, #000 95%);
  mask-image: linear-gradient(to bottom, #000 0 52%, transparent 52% 56%, #000 56% 63%, transparent 63% 68%, #000 68% 76%, transparent 76% 82%, #000 82% 90%, transparent 90% 95%, #000 95%);
  opacity: 0.46; filter: blur(0.3px) drop-shadow(0 0 3rem rgba(255, 60, 172, 0.5));
}
.dzs-floor { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; height: var(--dzs-floor); overflow: hidden; perspective: 22rem; perspective-origin: 50% 0; background: linear-gradient(to bottom, #12062e, #05030d); border-top: 1px solid rgba(255, 60, 172, 0.7); box-shadow: 0 -0.4rem 2.4rem rgba(255, 60, 172, 0.35); }
.dzs-floor div { position: absolute; left: -60%; right: -60%; top: 0; height: 200%; transform-origin: 50% 0; transform: rotateX(68deg);
  background: linear-gradient(rgba(255, 60, 172, 0.75) 2px, transparent 2px) 0 0 / 100% 3.2rem, linear-gradient(90deg, rgba(45, 226, 230, 0.6) 2px, transparent 2px) 0 0 / 4.4rem 100%; }
.dzs-floor::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(5, 3, 13, 0) 0%, rgba(5, 3, 13, 0.85) 100%); }
@media (prefers-reduced-motion: no-preference) {
  .dzs-floor div { animation: dzs-grid 1.6s linear infinite; }
  .shooting-star { animation: dzs-shoot 7s ease-in infinite; }
  .shooting-star.s2 { animation-delay: 3.6s; animation-duration: 9s; }
  .dzs-hero-logo { animation: vhs-jitter 6s steps(1) infinite; }
  .dzs-sun { animation: dzs-pulse 5s ease-in-out infinite alternate; }
}
@keyframes dzs-grid { from { background-position: 0 0, 0 0; } to { background-position: 0 3.2rem, 0 0; } }
@keyframes dzs-shoot { 0%, 78% { opacity: 0; transform: translate(0, 0) rotate(-24deg); } 80% { opacity: 1; } 92% { opacity: 0; transform: translate(-22rem, 10rem) rotate(-24deg); } 100% { opacity: 0; } }
@keyframes dzs-pulse { from { opacity: 0.38; } to { opacity: 0.55; } }

/* Ayraç: neon çizgi + dört köşeli yıldız */
.dzs-rule { display: flex; align-items: center; gap: 1.2rem; width: min(100% - 2 * var(--gutter), 52rem); margin: 0 auto; color: #2de2e6; }
.dzs-rule::before, .dzs-rule::after { content: ''; flex: 1; height: 2px; background: linear-gradient(to right, transparent, #ff3cac 35%, #2de2e6 70%, transparent); box-shadow: 0 0 10px rgba(255, 60, 172, 0.5); }
.dzs-rule svg { flex: none; filter: drop-shadow(0 0 7px rgba(45, 226, 230, 0.9)); }

/* Kimlik: iki dönem */
.eras { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); margin: 1.4rem 0 0.4rem; }
.era { border: 1px solid var(--line); padding: 1.1rem 1.2rem 0.4rem; }
.era-label { margin: 0 0 0.2rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gold); }
.era-title { font-size: 1.15rem; margin: 0 0 0.5rem; }
.era p:last-child { font-size: 0.95rem; color: var(--stone-muted); }
.theme-dzs .era { background: linear-gradient(180deg, rgba(60, 30, 140, 0.25), rgba(8, 5, 24, 0.6)); }
.theme-dzs .era:last-child { border-color: #ff3cac; box-shadow: 0 0 1.6rem rgba(255, 60, 172, 0.15); }
.theme-dzs .era-label { color: #2de2e6; }

/* Sahne: tek figür */
.cast-feature { display: grid; gap: clamp(1.4rem, 4vw, 2.8rem); grid-template-columns: 1fr; align-items: center; margin-top: 1.6rem; }
@media (min-width: 52rem) { .cast-feature { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); } }
.cast-feature-img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid var(--line); }
.cast-feature-name { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 0.1rem 0 1rem; }
.cast-feature-body p { font-size: 1rem; color: var(--stone); }
.cast-feature-body .cast-tone { color: var(--stone-muted); font-size: 0.9rem; margin: 0.2rem 0 0; }
.theme-dzs .cast-feature-img { border-color: #ff3cac; box-shadow: 0 0 2.4rem rgba(255, 60, 172, 0.3), 0 0 4rem rgba(45, 226, 230, 0.12); }
@media (prefers-reduced-motion: no-preference) { .theme-dzs .cast-feature-img { animation: vhs-jitter 7s steps(1) infinite; } }

/* TLNB çıkış (hyperfollow) sayfası */
.locked-link { position: relative; z-index: 2; margin-top: 0.5rem; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; color: #2de2e6; text-underline-offset: 3px; }
.rcard-locked { cursor: pointer; }
.tlnb { --dzs-floor: clamp(7rem, 16vw, 11rem); position: relative; overflow: hidden; isolation: isolate; padding: clamp(2.5rem, 6vw, 4.5rem) 0 calc(var(--dzs-floor) + 3rem); min-height: calc(100vh - 4.5rem); }
.tlnb-grid { position: relative; z-index: 4; display: grid; gap: clamp(1.8rem, 5vw, 4rem); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 56rem) { .tlnb-grid { grid-template-columns: minmax(0, 28rem) minmax(0, 1fr); } }
.tlnb-cover { width: 100%; max-width: 28rem; aspect-ratio: 1; object-fit: cover; border: 1px solid #ff3cac; box-shadow: 0 0 3rem rgba(255, 60, 172, 0.4), 0 0 6rem rgba(45, 226, 230, 0.16); margin-inline: auto; }
.tlnb-info > * + * { margin-top: 1rem; }
.tlnb-logo { height: 4.2rem; width: auto; filter: drop-shadow(0 0 1rem rgba(255, 60, 172, 0.4)); }
.tlnb-state { margin: 0; }
.tlnb-title { font-size: clamp(1.9rem, 5vw, 3.3rem); margin: 0; background: linear-gradient(180deg, #fff 30%, #ff9ee6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 1.2rem rgba(255, 60, 172, 0.5)); text-transform: none; }
.tlnb-meta { margin: 0; color: var(--stone-muted); letter-spacing: 0.04em; }
.tlnb-count { display: flex; gap: 0.7rem; flex-wrap: wrap; }
.tlnb-count > div { min-width: 4.6rem; padding: 0.7rem 0.6rem 0.5rem; text-align: center; border: 1px solid rgba(45, 226, 230, 0.5); background: rgba(8, 5, 24, 0.7); }
.tlnb-count b { display: block; font-family: 'Audiowide', var(--display); font-weight: 400; font-size: 1.9rem; line-height: 1; color: #fff; text-shadow: 0 0 1rem rgba(45, 226, 230, 0.7); font-variant-numeric: tabular-nums; }
.tlnb-count span { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--stone-muted); }
.tlnb-actions { display: flex; gap: 0.8rem; flex-wrap: wrap; margin: 0 0 0.4rem; }
.tlnb-note { margin: 0.8rem 0 0; font-size: 0.9rem; color: var(--stone-muted); }
.tlnb [hidden] { display: none !important; }
.tlnb-info, .tlnb-info h1, .tlnb-info p { text-align: left; }
.tlnb-info .tlnb-logo, .tlnb-info > img { margin-bottom: 0.6rem; }

/* Ondan Sonra haritası */
.harita-cta p { margin-top: 1.4rem; }
.harita { height: clamp(26rem, 68vh, 40rem); border: 1px solid var(--gold); background: #11100d; z-index: 0; }
.harita .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) brightness(0.82) contrast(0.92) saturate(0.55) sepia(0.35); }
.harita .leaflet-container { font-family: inherit; }
.harita-note { margin-top: 0.9rem; font-size: 0.82rem; color: var(--stone-muted); }
.harita-routes { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.chip-btn { font: inherit; font-size: 0.84rem; color: var(--stone); background: transparent; border: 1px solid var(--line); padding: 0.45rem 1rem; cursor: pointer; }
.chip-btn:hover { border-color: var(--gold); }
.chip-btn[aria-pressed='true'] { background: var(--gold); border-color: var(--gold); color: var(--obsidian); font-weight: 600; }
.pin { background: none; border: 0; }
.pin span { display: block; width: 22px; height: 22px; border-radius: 50%; background: var(--gold); border: 3px solid #0a0a0a; box-shadow: 0 0 0 2px var(--gold), 0 0 14px rgba(228, 176, 64, 0.6); transition: opacity 0.2s, transform 0.2s; }
.pin:hover span { transform: scale(1.2); }
.pin.dim span { opacity: 0.25; box-shadow: none; }
.harita .leaflet-popup-content-wrapper, .harita .leaflet-popup-tip { background: #14110c; color: var(--stone); border: 1px solid var(--gold); border-radius: 0; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.6); }
.harita .leaflet-popup-content { margin: 0.9rem 1.1rem; font-size: 0.88rem; line-height: 1.45; }
.harita .leaflet-popup-content .pop strong { font-family: var(--display); letter-spacing: 0.06em; color: var(--gold); }
.harita .leaflet-popup-content p { margin: 0.2rem 0 0; }
.harita .leaflet-popup-content .pop-area { color: var(--stone-muted); font-size: 0.8rem; }
.harita .leaflet-popup-content ul { margin: 0.6rem 0 0; padding-left: 1.1rem; }
.harita .leaflet-popup-content a { color: var(--gold); }
.harita .leaflet-container a.leaflet-popup-close-button { color: var(--stone-muted); }
.harita .leaflet-control-attribution { background: rgba(10, 10, 10, 0.75) !important; color: var(--stone-muted) !important; }
.harita .leaflet-control-attribution a { color: var(--stone) !important; }
.places { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.2rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
.place { border: 1px solid var(--line); padding: 1.1rem 1.2rem; background: var(--obsidian); }
.place-name { font: inherit; font-family: var(--display); font-size: 1.05rem; letter-spacing: 0.06em; color: var(--gold); background: none; border: 0; padding: 0; cursor: pointer; text-align: left; }
.place-name:hover { color: var(--stone); }
.place-area { margin: 0.2rem 0 0; font-size: 0.82rem; color: var(--stone-muted); }
.place-note { margin: 0.5rem 0 0; font-size: 0.88rem; }
.place-videos { margin: 0.7rem 0 0; padding-left: 1.1rem; font-size: 0.86rem; }
.place-videos a { color: var(--stone); }
.section-more .text-link + .text-link { margin-left: 1.4rem; }

/* Ondan Sonra durak yazıları */
.durak .durak-lead { max-width: var(--measure); color: var(--stone-muted); font-size: 1.15rem; margin: 0 0 1.4rem; }
.durak .durak-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.8rem 1.6rem; margin: 0 0 0.8rem; }
/* Yazı + sağda gömülü videolar */
.durak-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 3rem; grid-template-areas: "head" "media" "text"; }
.durak-head { grid-area: head; }
.durak-text { grid-area: text; min-width: 0; }
.durak-media { grid-area: media; display: flex; flex-direction: column; gap: 1.4rem; margin: 0 0 2rem; }
.durak .embed { margin: 0; }
.durak .embed-frame { position: relative; aspect-ratio: 16 / 9; background: var(--charcoal); border: 1px solid rgba(215, 204, 178, 0.18); }
.durak .embed-short .embed-frame { aspect-ratio: 9 / 16; max-width: 260px; }
.durak .embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.durak .embed figcaption { margin-top: 0.5rem; font-size: 0.84rem; color: var(--stone-muted); }
@media (min-width: 62rem) {
  .durak-grid { grid-template-columns: minmax(0, 1fr) 24rem; grid-template-areas: "head media" "text media"; align-items: start; }
  .durak-media { position: sticky; top: 5.5rem; margin: 0; max-height: calc(100vh - 7rem); overflow-y: auto; padding-right: 0.2rem; }
}
.durak .prose ul { padding-left: 1.2rem; }
.durak .prose li { margin-bottom: 0.4rem; }
.durak .durak-note { max-width: var(--measure); margin-top: 2.4rem; padding: 1rem 1.2rem; border-left: 2px solid var(--gold); background: var(--charcoal); font-size: 0.92rem; color: var(--stone-muted); }
.durak .durak-note a { color: var(--gold); }
.durak .durak-nav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.6rem 1.6rem; margin-top: 2rem; }
.place-read { margin: 0.4rem 0 0; }
.harita .pop p a { color: var(--gold); }
.harita .pop p a.btn-primary { color: var(--obsidian); }
.place-read .btn { margin-top: 0.2rem; }

.dzs-tag-tr { margin: -0.7rem 0 1.2rem; font-size: 0.95rem; letter-spacing: 0.12em; color: var(--stone-muted); }

.era-current { margin: 1.4rem 0 1.6rem; }
.archive { margin: 1.6rem 0 0; border: 1px solid var(--line); background: rgba(8, 5, 24, 0.5); }
.archive summary { cursor: pointer; padding: 0.9rem 1.2rem; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.archive summary::-webkit-details-marker { display: none; }
.archive summary::after { content: '+'; color: #2de2e6; font-size: 1.3rem; line-height: 1; }
.archive[open] summary::after { content: '\2212'; }
.archive summary:focus-visible { outline: 2px solid #2de2e6; outline-offset: 2px; }
.archive p { margin: 0; padding: 0 1.2rem 1rem; font-size: 0.95rem; color: var(--stone-muted); }

/* Metin bloklari iki yana yaslı */
.prose p, .prose li, .section-desc, .cast-feature-body p:not(.cast-role):not(.cast-tone), .era p, .archive p, .universe > p:not(.universe-tag):not(.universe-stats):not(.universe-actions), .track-story p, .rel-note, .durak-lead, .durak-note, .harita-note, .place-note { text-align: justify; text-justify: inter-word; hyphens: auto; -webkit-hyphens: auto; }
