/* 15 · #penutup (milik S3). Semua pemilih diawali #penutup atau .pt__
   Lapisan (z): peta 0 · latar G-05 1 · tombol/status/atribusi 3 · pemutar 4 · logo 6 (base .slot-logo).
   s1 dua kolom: kiri = kartu narasi (atas) + tombol demo dan status server (rata bawah dengan pemutar);
   kanan = pemutar cadangan permanen, sejajar atas kartu. Garis 4,2vh: label «Ilustrasi» kiri, logo kanan. */

.pt__narasi .pt__judul h2 { font-size: var(--fs-h1); }
.pt__narasi .narrative__merek { margin-bottom: calc(var(--u) * 1.2); }
.pt__narasi .pt__judul > * { align-self: start; }

/* ── s0: peta Bangka + lapisan temuan ── */
.pt__kab path { fill: none; stroke: rgba(201, 209, 217, .55); stroke-width: 1; }
.pt__temuan { opacity: .14; }
.pt__bukaan { fill: rgba(245, 158, 11, .8); stroke: var(--accent); stroke-width: 1.2; }
.pt__laut { fill: rgba(245, 158, 11, .22); stroke: var(--accent); stroke-width: 1.4; }
.pt__cincin { fill: none; stroke: var(--accent); stroke-width: 1.2; stroke-dasharray: 3 4; vector-effect: non-scaling-stroke; opacity: .85; }
/* Menyala bergantian sekali, lalu meredup (keadaan akhir = redup; gerak dikurangi langsung ke akhir) */
.pt--sorot .pt__temuan--koba { animation: pt-nyala 2.3s var(--ease) .55s both; }
.pt--sorot .pt__temuan--laut { animation: pt-nyala 2.3s var(--ease) 2.25s both; }
@keyframes pt-nyala { 0% { opacity: .14; } 20% { opacity: 1; } 68% { opacity: 1; } 100% { opacity: .14; } }

/* Pudaran tepi mosaik, nilai sama dengan #pembuka (sebaran ≥ blur: tepi luar padat, tanpa garis sambungan) */
.pt__tepi {
  position: absolute; left: 0; top: 0; z-index: 1; pointer-events: none; width: 0; height: 0;
  box-shadow: inset 0 0 calc(var(--u) * 4.4) calc(var(--u) * 4.6) #0a0e13;
}
.pt__tepi[hidden] { display: none; }
/* ?static dan layar sempit: peta tertutup latar G-05, dan kotak bayangan seukuran citra tidak boleh membuat gulir mendatar */
.is-static #penutup .pt__tepi { display: none; }
.pt__atribusi { position: absolute; left: var(--gutter); bottom: 4.2vh; z-index: 3; }
/* Penanda «Peta dasar menyusul» milik mesin: hanya relevan saat peta terlihat (s0) */
#penutup .peta-dasar__penanda { transition: opacity .5s var(--ease); }
#penutup[data-state="1"] .peta-dasar__penanda { opacity: 0; }
.pt--tanpa-citra .pt__atribusi { display: none; }

/* ── s1: latar G-05 redup 60% ── */
#penutup .pt__latar {
  position: absolute; inset: 0; z-index: 1; border-radius: 0; margin: 0;
  opacity: 0; transition: opacity .9s var(--ease);
}
#penutup .pt__latar::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(13, 17, 23, .58) 0%, rgba(13, 17, 23, .6) 55%, rgba(13, 17, 23, .84) 100%);
  transition: background-color .5s var(--ease);
}
#penutup .pt__latar .foto-ai__label { z-index: 2; left: var(--gutter); bottom: 4.2vh; }
#penutup[data-state="1"] .pt__latar { opacity: 1; }

/* ── Kolom aksi kiri: empat tombol demo (Laut + AIS-006 berpasangan) selebar kolom, lalu status ──
   --pt-bawah = tepi bawah panel pemutar (px, dari JS); cadangan sebelum JS: 70% tinggi panel */
.pt__aksi {
  position: absolute; z-index: 3; left: var(--gutter); width: calc(50vw - var(--gutter) - 1.6vw);
  top: var(--pt-bawah, 70%); transform: translateY(-100%);
  display: flex; flex-direction: column; gap: calc(var(--u) * .9);
}
.pt__tombol { display: flex; flex-wrap: wrap; align-items: stretch; gap: calc(var(--u) * .8); }
.pt__tombol > * { flex: 1 1 auto; }
.pt__grup { display: inline-flex; align-items: stretch; flex-grow: 1.6; }
.pt__grup .pt__btn:first-child { flex: 1 1 auto; }
.pt__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em; cursor: pointer;
  min-height: calc(var(--u) * 3.7); padding: 0 calc(var(--u) * 1.3);
  border-radius: 12px; border: 1px solid rgba(139, 148, 158, .45);
  background: rgba(22, 27, 34, .9); color: var(--text-primary); text-decoration: none; white-space: nowrap;
  font-size: max(16px, calc(var(--u) * 1.15)); font-weight: 600; line-height: 1.2;
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  transition: border-color .25s, background-color .25s, color .25s, box-shadow .25s;
}
.pt__btn:hover, .pt__btn:focus-visible { border-color: var(--accent); background: var(--bg-card); }
.pt__grup .pt__btn:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.pt__btn--kecil {
  min-width: 0; padding: 0 calc(var(--u) * .85); margin-left: -1px;
  border-top-left-radius: 0; border-bottom-left-radius: 0;
  font-family: var(--mono); font-size: var(--fs-label); font-weight: 500; color: var(--text-secondary);
}

/* Status kecil server demo, di bawah tombol */
.pt__status {
  margin: 0; display: inline-flex; align-items: center; gap: .55em; white-space: nowrap;
  font-size: var(--fs-label); color: var(--text-secondary); text-shadow: 0 1px 2px rgba(0, 0, 0, .7);
}
.pt__s { display: none; }
.pt--server-ada .pt__s--ada, .pt--server-tidak .pt__s--tidak { display: inline; }
/* Selama pemeriksaan pertama tidak ada klaim apa pun: baris status disembunyikan */
.pt--server-cek .pt__status { visibility: hidden; }
.pt--server-ada .pt__status .titik { background: var(--good); }

/* ── Pemutar cadangan (permanen di s1): kanan atas, sejajar kartu narasi ──
   Lebar = setengah layar dikurangi gutter, dibatasi tinggi ruang di atas garis logo (--pt-h).
   Tinggi panel ≈ 0,625 × lebar layar gambar + keterangan dua baris + kendali + bantalan (±120 px). */
.pt__pemutar {
  --pt-h: calc(100vh - var(--nav-h) - 4vh - 4.2vh - clamp(36px, calc(var(--u) * 3.4), 64px) - 3vh);
  position: absolute; z-index: 4; right: var(--gutter); top: calc(var(--nav-h) + 4vh);
  width: min(calc(50vw - var(--gutter) - 1.6vw), calc((var(--pt-h) - 120px) * 1.6 + 24px));
  padding: 12px; border-radius: 14px; background: rgba(13, 17, 23, .88); border: 1px solid rgba(139, 148, 158, .32);
  box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .8);
}
.pt__pemutar .pemutar { gap: 8px; --c-fg: var(--text-primary); --c-fg-2: var(--text-secondary); }
/* Keterangan terbaca di 1366×768; dua baris dipesan agar panel tidak naik-turun antarbingkai */
.pt__pemutar .pemutar__teks { font-size: max(15px, calc(var(--u) * 1.05)); line-height: 1.4; min-height: 2.8em; color: var(--text-primary); }

/* Logo pengirim GTS (teks putih): base .slot-logo (pojok kanan bawah) */
.pt__logo { z-index: 6; }

/* ?static: latar G-05 dan pemutar tampil (pemutar tanpa putar otomatis) */
.is-static #penutup .pt__latar { opacity: 1; }
/* Peta s0 tertutup latar G-05 di mode statis: atribusinya tidak relevan dan akan menimpa label «Ilustrasi» */
.is-static #penutup .pt__atribusi { display: none; }

@media (max-width: 860px) {
  #penutup .pt__panel { flex-direction: column; align-items: stretch; justify-content: flex-end; gap: 14px; padding: 24px 16px 96px; }
  .pt__aksi, .pt__pemutar { position: relative; inset: auto; left: auto; right: auto; bottom: auto; top: auto; transform: none; width: auto; }
  .pt__aksi { order: 2; }
  .pt__status { white-space: normal; }
  .pt__btn { min-height: 44px; padding: 0 14px; font-size: 15px; }
  .pt__tombol { gap: 8px; }
}