/* COP31 Müzakere Masası — ortak stil katmanı
   Palet, COP31 Türkiye/Antalya logosundan örneklendi:
     #1E458A derin mavi · #D52124 lale kırmızısı · yeşiller SETA İklim Programı'ndan
     (setav.org: #004A31 koyu yeşil · #017C01 yeşil · #33CC66 açık yeşil; nane #B8EDC9
     açık yeşilin %65 beyazla açılmış hâli)

   İki yüzey vardır ve ikisi de açıkça boyanır:
     varsayılan  -> AÇIK  (telefon, operatör)
     body.board  -> KOYU  (stand ekranı)
   Cihazların rolü sabit olduğu için işletim sistemi teması dikkate alınmaz. */

:root{
  color-scheme:light;

  --plane:#F1F5F8;
  --paper:#FFFFFF;
  --sunk:#E9EFF4;
  --ink-1:#0F2440;
  --ink-2:#465E7A;
  --ink-3:#7A90A6;
  --line:#D5DFE8;
  --line-2:#B9C9D7;

  --brand:#1E458A;
  --canopy:#004A31;          /* SETA koyu yesili — bant, birincil dugme */
  --brand-2:#017C01;
  --mint:#B8EDC9;

  --support:#017C01;
  --conditional:#1E458A;
  --reservation:#96670F;
  --object:#BC2419;

  --shadow:0 1px 2px rgba(15,36,64,.06),0 10px 24px -16px rgba(15,36,64,.28);
  --radius:2px;
  /* Govde: SETA'nin yazi tipi Montserrat (setav.org ile ayni). Etiketler IBM
     Plex Mono'da kaldi. Ikisi de YEREL (assets/fonts.css). Google Fonts'a
     gidilmiyor: stantta ag kesilirse yazi tipi dusmesin. Yedek yigin
     system-ui, yani font yuklenmeden once de sayfa dogru gorunur. */
  --sans:"Montserrat",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* eski isimler — HTML içindeki satır içi stiller bunlara bakıyor */
  --bg:var(--plane); --panel:var(--paper); --panel2:var(--sunk);
  --text:var(--ink-1); --dim:var(--ink-3); --accent:var(--brand);
  --good:var(--support); --ok:var(--conditional);
  --warn:var(--reservation); --bad:var(--object);
}

body.board{
  color-scheme:dark;

  --plane:#06121F;
  --paper:#0C2135;
  --sunk:#081A2A;
  --ink-1:#EAF2F7;
  --ink-2:#A6BFD1;
  --ink-3:#6F8EA5;
  --line:#173B57;
  --line-2:#21506F;

  --brand:#5AA5EA;
  --brand-2:#33CC66;

  --support:#33CC66;
  --conditional:#6BB6F0;
  --reservation:#E2AC46;
  --object:#F2685C;

  --shadow:0 1px 2px rgba(0,0,0,.4),0 14px 34px -18px rgba(0,0,0,.8);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  margin:0;
  background:var(--plane);
  color:var(--ink-1);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  min-height:100vh;
  overscroll-behavior-y:none;
}
button,input,select,textarea{font:inherit;font-size:16px;color:inherit}
button{touch-action:manipulation}

/* ---------- yerleşim ---------- */
.wrap{max-width:560px;margin:0 auto;padding:14px 14px 44px;display:flex;flex-direction:column;gap:12px}
.card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:17px 18px;
  box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:10px;
}
.card>*{margin:0}
.center{text-align:center}
.hidden{display:none!important}
.row{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- tipografi ---------- */
.kicker{
  font-family:var(--mono);
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brand-2);font-weight:600;
}
h1{font-size:25px;line-height:1.14;letter-spacing:-.015em;font-weight:700;text-wrap:balance}
h2{font-size:18px;line-height:1.25;font-weight:650}
h3{
  font-family:var(--mono);
  font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);font-weight:600;
}
p{line-height:1.55}
small{color:var(--ink-3);font-size:13px}
.dim{color:var(--ink-3)}
.good{color:var(--support)} .ok{color:var(--conditional)}
.warn{color:var(--reservation)} .bad{color:var(--object)}

/* ---------- düğmeler ---------- */
.btn{
  display:block;width:100%;min-height:52px;
  border:1px solid var(--line-2);border-radius:var(--radius);
  background:var(--paper);color:var(--ink-1);
  padding:13px 14px;cursor:pointer;text-align:left;
  transition:border-color .14s,background .14s,box-shadow .14s;
}
.btn:hover{border-color:var(--brand)}
.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.btn.sel{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 9%,var(--paper));
  box-shadow:inset 3px 0 0 var(--brand)}
.btn.primary{
  background:var(--canopy);border-color:var(--canopy);color:#fff;
  text-align:center;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:14px;
}
.btn.primary:hover{background:#005C3D;border-color:#005C3D}
body.board .btn.primary:hover{background:#7FBCF2;border-color:#7FBCF2}
.btn.primary:disabled{opacity:.38;cursor:not-allowed}
.btn.ghost{background:transparent}
.btn b{display:block;font-size:15px;font-weight:650;line-height:1.35}
.btn span{display:block;font-size:12.5px;color:var(--ink-3);margin-top:4px;line-height:1.5}

/* tutum düğmeleri — her tutumun kendi rengi */
.btn.stance-SUPPORT.sel{border-color:var(--support);box-shadow:inset 3px 0 0 var(--support);
  background:color-mix(in srgb,var(--support) 9%,var(--paper))}
.btn.stance-CONDITIONAL.sel{border-color:var(--conditional);box-shadow:inset 3px 0 0 var(--conditional);
  background:color-mix(in srgb,var(--conditional) 9%,var(--paper))}
.btn.stance-RESERVATION.sel{border-color:var(--reservation);box-shadow:inset 3px 0 0 var(--reservation);
  background:color-mix(in srgb,var(--reservation) 9%,var(--paper))}
.btn.stance-OBJECT.sel{border-color:var(--object);box-shadow:inset 3px 0 0 var(--object);
  background:color-mix(in srgb,var(--object) 9%,var(--paper))}

/* hamle kartı — başlık, jargon etiketi, bedeli */
.btn.move b{margin-bottom:6px}
.btn.move .tag{
  display:inline-block;font-style:normal;font-family:var(--mono);
  font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--brand) 30%,transparent);
  border-radius:var(--radius);padding:2px 7px;margin-bottom:7px;
}
.btn.move span{color:var(--ink-2)}

/* ---------- masadaki teklif ---------- */
.offer{
  background:var(--sunk);
  border:1px solid var(--line);
  border-top:3px solid var(--brand-2);
  border-radius:var(--radius);
  padding:15px 16px;
}
.offer-goal{font-size:13px;color:var(--brand-2);font-weight:600;margin-bottom:8px}
.offer-main{font-size:19px;line-height:1.42;font-weight:650;letter-spacing:-.008em}
.offer-main.old{opacity:.5;font-size:15px;font-weight:400;
  text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--object) 65%,transparent)}
.offer-means{
  margin-top:11px;padding-top:10px;border-top:1px solid var(--line);
  font-size:13px;color:var(--ink-2);line-height:1.5;
}
.offer-formal{margin-top:11px}
.offer-formal summary{font-family:var(--mono);font-size:11px;letter-spacing:.06em;
  color:var(--ink-3);cursor:pointer;list-style:none}
.offer-formal summary::-webkit-details-marker{display:none}
.offer-formal summary::before{content:"▸ ";color:var(--brand)}
.offer-formal[open] summary::before{content:"▾ "}

.para{
  background:var(--paper);border:1px solid var(--line);
  border-left:3px solid var(--line-2);border-radius:var(--radius);
  padding:12px 13px;font-size:13.5px;line-height:1.6;color:var(--ink-2);
  font-family:var(--mono);
}
.para.old{opacity:.5;text-decoration:line-through;
  text-decoration-color:color-mix(in srgb,var(--object) 60%,transparent)}
.para em{font-style:normal;font-weight:700;
  background:color-mix(in srgb,var(--reservation) 22%,transparent);
  color:var(--reservation);padding:1px 5px;border-radius:var(--radius)}

/* ---------- rozetler, alıntı, koltuklar ---------- */
.pill{
  display:inline-block;padding:4px 10px;border-radius:var(--radius);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  font-weight:600;border:1px solid var(--line-2);color:var(--ink-2);
}
.pill.good{border-color:var(--support);color:var(--support);
  background:color-mix(in srgb,var(--support) 10%,transparent)}
.pill.warn{border-color:var(--reservation);color:var(--reservation);
  background:color-mix(in srgb,var(--reservation) 10%,transparent)}
.pill.bad{border-color:var(--object);color:var(--object);
  background:color-mix(in srgb,var(--object) 10%,transparent)}

.quote{
  border-left:3px solid var(--reservation);
  background:color-mix(in srgb,var(--reservation) 8%,transparent);
  padding:12px 15px;font-size:15px;line-height:1.5;
}
.quote b{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--reservation)}

.seat{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:10px 0;border-bottom:1px solid var(--line);font-size:14px;
}
.seat:last-child{border-bottom:0}
.seat .who{display:flex;gap:9px;align-items:center;min-width:0}
.seat .flag{font-size:19px;line-height:1}
.seat .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.timer{font-family:var(--mono);font-variant-numeric:tabular-nums;
  font-weight:700;font-size:21px;letter-spacing:.02em}

/* ---------- marka şeridi ---------- */
.brandbar{display:flex;align-items:center;gap:14px;justify-content:center;
  padding:2px 0 0;opacity:.9}
.brandbar img{display:block;height:24px;width:auto}
.brandbar .sep{width:1px;height:20px;background:var(--line-2)}
body.board .brandbar img{background:#fff;border-radius:var(--radius);padding:5px 8px}

/* ---------- hareket ---------- */
.spin{display:inline-block;width:15px;height:15px;border:2px solid var(--line-2);
  border-top-color:var(--brand);border-radius:50%;animation:sp .8s linear infinite;vertical-align:-2px}
@keyframes sp{to{transform:rotate(360deg)}}
.fade{animation:fd .4s cubic-bezier(.2,.7,.3,1)}
@keyframes fd{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* --- 2. turda: hamlenin metni nereye taşıdığı --------------------------- */
.changed{
  background:color-mix(in srgb,var(--reservation) 8%,transparent);
  border:1px solid color-mix(in srgb,var(--reservation) 32%,transparent);
  border-radius:var(--radius);padding:13px 14px;
}
.changed h3{color:var(--reservation);margin-bottom:8px}
.changed .offer-main.old{font-size:14px}
.changed-now{font-size:16px;font-weight:650;line-height:1.4;margin-top:7px}
.changed-now::before{content:"↓ ";color:var(--reservation);font-weight:700}
.gavel-ask{font-size:15.5px;font-weight:600;color:var(--brand);line-height:1.4}

/* ---------- uyarı şeridi ----------
   Gönderim başarısız olduğunda ekranın üstünde belirir. Sabit konumlu:
   telefonda kullanıcı sayfanın neresinde olursa olsun görmeli. */
#uyari{
  position:fixed; left:0; right:0; top:0; z-index:100;
  background:var(--bad); color:#fff;
  font-weight:650; font-size:15px; line-height:1.4;
  padding:14px 16px; text-align:center;
  transform:translateY(-100%); transition:transform .22s ease;
  padding-top:max(14px, env(safe-area-inset-top));
}
#uyari.gorunur{transform:translateY(0)}

/* ---------- koltukta oynanan hamle ----------
   Ekip geri bildirimi: "kimin itiraz ettiğini görüyoruz ama NEDEN itiraz
   ettiğini göremiyoruz." Hamlenin kendisi zaten o nedendir; hüküm anında
   tutumun altına yazılıyor. Ad ile hamle alt alta gelsin diye .who dikey. */
.seat.detayli{align-items:flex-start}
.seat.detayli .who{flex-direction:column;align-items:flex-start;gap:3px;flex:1}
.seat.detayli .ust{display:flex;gap:9px;align-items:center;min-width:0}
.seat .mv{
  font-size:12.5px;line-height:1.45;color:var(--ink-2);
  white-space:normal;padding-left:28px;
}
.seat .mv .tag{
  font-style:normal;font-family:var(--mono);font-size:10px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);
}
.seat .mv .bedel{display:block;color:var(--ink-3);font-size:12px;margin-top:2px}

/* ---------- rol kartında müzakere grubu ----------
   Ekip geri bildirimi: "LMDC, AILAC, BINGO gibi kısaltmaları kimse bilmiyor."
   Kısaltma tek başına bilgi taşımıyordu; açık adı ve ne savunduğu eklendi. */
.grup{
  background:var(--sunk);
  border-left:3px solid var(--brand-2);
  border-radius:var(--radius);
  padding:11px 13px;
}
.grup b{display:block;font-size:14px;font-weight:650;color:var(--ink-1);line-height:1.4}
.grup span{display:block;font-size:13px;color:var(--ink-2);line-height:1.55;margin-top:5px}

/* ---------- genişletilmiş rol kartı ----------
   Ekip geri bildirimi: "ülke bilgileri arttırılıp önemli olan durumlar
   büyük puntoyla kalınla vurgulanabilir." Metin uzadı; okunabilirlik
   paragraf arası boşluk ve net bir hiyerarşiyle korunuyor. */
.rolmetin p{font-size:15px;line-height:1.62;margin:0 0 11px}
.rolmetin p:last-child{margin-bottom:0}

/* kırmızı çizgi — kartın en vurgulu öğesi, gözden kaçmamalı */
.kirmizi{
  background:color-mix(in srgb,var(--object) 8%,transparent);
  border-left:3px solid var(--object);
  border-radius:var(--radius);
  padding:12px 14px;
}
.kirmizi b{
  display:block;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--object);margin-bottom:5px;
}
.kirmizi span{display:block;font-size:15.5px;font-weight:650;line-height:1.45;color:var(--ink-1)}

/* ---------- TERİMLER paneli ----------
   Oyuncular konuya uzak; «köşeli parantez» ya da «preambül» hiçbir yerde
   açıklanmıyordu. Panel her ekranda erişilebilir, oyunu durdurmaz. */
#sozlukAc{
  position:fixed;right:14px;bottom:14px;z-index:90;
  width:46px;height:46px;border-radius:50%;
  border:1px solid var(--brand);background:var(--brand);color:#fff;
  font-size:21px;font-weight:700;line-height:1;cursor:pointer;
  box-shadow:0 4px 14px rgba(15,36,64,.28);
  padding-bottom:max(0px, env(safe-area-inset-bottom));
}
#sozlukAc:hover{background:#17376F}

#sozluk{
  position:fixed;inset:0;z-index:110;
  background:rgba(15,36,64,.5);
  display:flex;align-items:flex-end;justify-content:center;
}
#sozluk[hidden]{display:none}
.sozluk-ic{
  background:var(--paper);width:100%;max-width:560px;max-height:88vh;
  border-radius:var(--radius);display:flex;flex-direction:column;
  box-shadow:0 -8px 40px rgba(15,36,64,.35);
}
.sozluk-ust{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 16px;border-bottom:1px solid var(--line);flex:none;
}
.sozluk-ust b{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--brand)}
.sozluk-ust button{
  border:1px solid var(--line-2);background:var(--paper);color:var(--ink-2);
  border-radius:var(--radius);padding:7px 13px;cursor:pointer;
  font-size:11px;font-family:var(--mono);letter-spacing:.1em;
}
#sozlukGovde{overflow-y:auto;padding:4px 16px 24px;-webkit-overflow-scrolling:touch}

.sz-bolum{padding-top:18px}
.sz-bolum h3{margin:0 0 6px}
.sz-aciklama{margin:0 0 12px;font-size:13.5px;color:var(--ink-2);line-height:1.55}
.sz-madde{padding:9px 0;border-top:1px solid var(--line)}
.sz-madde b{display:block;font-size:14.5px;font-weight:650;color:var(--ink-1);margin-bottom:3px}
.sz-madde span{display:block;font-size:13.5px;color:var(--ink-2);line-height:1.6}
.sz-rozet{
  display:inline-block;font-style:normal;font-family:var(--mono);
  font-size:10px;min-width:17px;text-align:center;
  background:var(--brand);color:#fff;border-radius:var(--radius);
  padding:1px 4px;margin-right:7px;vertical-align:1px;
}


/* ============================================================
   MARKA ve HAREKET — dort sayfada ortak
   ============================================================ */

/* SETA · COP31 ortak logosu (assets/seta-cop31.svg), setav.org'daki dosyanin
   DEGISTIRILMEMIS kopyasi. Koyu zemin icin beyaz cizilmis; dort sayfada da koyu
   bantta duruyor. Kendi CSS animasyonu var: 40 sn'lik dongunun sonunda SETA
   isareti birkac saniye "20 yil"a donusup geri gelir. Oran 5,5:1 — <img>'deki
   width/height oran icin, gercek boy asagidaki height'tan. */
.marka{ display:flex; align-items:center; gap:12px; min-width:0; }
.marka img{ display:block; height:40px; width:auto; }
body.board .marka img{ height:48px; }

/* ---- donen dunya ----
   #app'in DISINDA, sabit bir arka plan katmani. Bu bilerek: oyuncu sayfasinda
   render() her durum degisiminde #app'in tamamini yeniden kuruyor; kure orada
   olsaydi her 900 ms'de yeniden yaratilir, animasyon bastan baslar ve karar
   ekraninin parmak altinda yenilenmeme kurali da tehlikeye girerdi.

   Hareket saf CSS: JS yok, yeniden cizim yok. Yalniz transform animasyonu
   kullaniliyor (GPU'da bilesikleniyor), boylece telefonda maliyeti dusuk.
   Isletim sisteminde "hareketi azalt" acikken animasyon DURUR. */
.kure{
  position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.kure svg{ width:min(118vmin,1150px); height:auto; }
.kure .cizgi{ fill:none; stroke:var(--brand-2); stroke-width:.7; }
.kure .govde{ opacity:.15; }

/* Stand ekraninda body::after bir gradyan katmani ve z-index:0 ile kurenin
   USTUNE dusuyor (uretilen icerik DOM sirasinda cocuklardan sonra boyanir).
   Kureyi bir kat yukari aliyoruz; .board da z-index:1 ama DOM'da SONRA
   geldigi icin icerik yine kurenin ustunde kaliyor. */
body.board .kure{ z-index:1; }
body.board .kure .govde{ opacity:.13; }

/* Boylamlar: bir meridyen 360 derece donerken izdusumu cos egrisi cizer,
   yani genislik 1 -> 0 -> -1 -> 0 -> 1. scaleX ile taklit ediliyor. */
@keyframes kure-don{
  0%   { transform:scaleX(1); }
  12.5%{ transform:scaleX(.707); }
  25%  { transform:scaleX(.02); }
  37.5%{ transform:scaleX(-.707); }
  50%  { transform:scaleX(-1); }
  62.5%{ transform:scaleX(-.707); }
  75%  { transform:scaleX(.02); }
  87.5%{ transform:scaleX(.707); }
  100% { transform:scaleX(1); }
}
/* Boylamlar KENDI grubunda: paraleller de <ellipse> oldugu icin nth-of-type
   onlari da sayardi ve gecikmeler kayardi. */
.kure .boylamlar ellipse{
  transform-box:fill-box; transform-origin:center;
  animation:kure-don 72s linear infinite;
}
.kure .boylamlar ellipse:nth-child(2){ animation-delay:-12s; }
.kure .boylamlar ellipse:nth-child(3){ animation-delay:-24s; }
.kure .boylamlar ellipse:nth-child(4){ animation-delay:-36s; }
.kure .boylamlar ellipse:nth-child(5){ animation-delay:-48s; }
.kure .boylamlar ellipse:nth-child(6){ animation-delay:-60s; }

@media (prefers-reduced-motion:reduce){
  .kure .boylamlar ellipse{ animation:none; }
}

/* Icerik kurenin ustunde kalir. */
.wrap, .board, .kapi{ position:relative; z-index:1; }

/* Kitap durusu etiketi: baskentin bekledigi tutum/hamle, karar ekraninda. */
.tag.kitap{ color:var(--support); border-color:var(--support); margin-left:6px; }

/* ==== OYUN EKRANLARI — kapinin kimligi ic sayfalarda (v0.109, 7 Eylul) ====
   Kapi bir kimlik kurdu (kanopi bandi, agac, yesil); uc oyun ekrani eski
   sozlukte kalmisti. Asagidakiler o dili tasiyor. Hepsi BILGI tasiyan
   ogeler: bant kim oldugunu, ray oyunun neresinde oldugunu, kare tutumun
   rengini, koltuklar masanin dolusunu soyler. */

/* dunya: telefon/operatorde sag alta kayar, bant onu kismen orter */
body:not(.board) .kure{ align-items:flex-end; justify-content:flex-end; }
body:not(.board) .kure svg{ width:min(150vmin,1100px); transform:translate(30%,32%); }

/* kanopi bandi */
.bant{ background:var(--canopy); color:#fff; position:relative; z-index:1; }
.bant-ic{ max-width:560px; margin:0 auto; padding:12px 16px 0; }
.bant .satir{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.bant .marka img{ height:30px; }
.bant .masa{ font-family:var(--mono); font-size:10px; letter-spacing:.14em; color:var(--mint);
  text-transform:uppercase; text-align:right; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kim{ display:flex; align-items:center; gap:12px; margin-top:16px; }
.kim .bayrak{ font-size:30px; line-height:1; width:44px; height:44px; flex:none; display:flex; align-items:center; justify-content:center;
  background:rgba(184,237,201,.12); border:1px solid rgba(184,237,201,.28); border-radius:var(--radius); }
.kim b{ display:block; font-size:19px; line-height:1.15; letter-spacing:-.01em; font-weight:700; }
.kim span{ display:block; font-size:12.5px; color:var(--mint); margin-top:3px; line-height:1.35; }

/* hukum blogu: Baskanin cumlesi en koyu yuzeyde */
.hukum{ margin-top:18px; padding-top:16px; border-top:1px solid rgba(184,237,201,.22); }
.hukum .kicker{ color:var(--mint); }
.hukum .pill{ margin-top:10px; margin-right:6px; }
.hukum .pill.good{ border-color:#33CC66; color:#33CC66; background:rgba(51,204,102,.12); }
.hukum .pill.warn{ border-color:#E0B15A; color:#E0B15A; background:rgba(224,177,90,.12); }
.hukum .pill.bad{ border-color:#F0857A; color:#F0857A; background:rgba(240,133,122,.12); }
.hukum .pill:not(.good):not(.warn):not(.bad){ border-color:rgba(184,237,201,.5); color:var(--mint); }
.soz{ font-size:20px; line-height:1.36; font-weight:700; letter-spacing:-.012em; margin:12px 0 0; text-wrap:balance; }
.soz::before{ content:"\201C"; color:var(--mint); margin-right:2px; }
.soz::after{ content:"\201D"; color:var(--mint); margin-left:2px; }
.oneri{ margin-top:12px; font-size:13px; line-height:1.5; color:var(--mint); }
.oneri b{ font-family:var(--mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; display:block; margin-bottom:3px; color:rgba(184,237,201,.7); }

/* faz rayi */
.ray{ display:grid; grid-template-columns:repeat(6,1fr); gap:4px; margin-top:16px; padding-bottom:12px; }
.ray div{ font-family:var(--mono); font-size:8.5px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(184,237,201,.55); padding-top:6px; border-top:3px solid rgba(184,237,201,.22); white-space:nowrap; overflow:hidden; }
.ray .oldu{ color:var(--mint); border-top-color:var(--mint); }
.ray .simdi{ color:#fff; border-top-color:#fff; font-weight:700; }

/* operator bandi */
.masa-bas{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-top:18px; }
.masa-bas h1{ margin:0; font-size:26px; line-height:1.1; letter-spacing:-.015em; font-weight:700; color:#fff; }
.masa-bas .kod{ font-family:var(--mono); font-size:12px; letter-spacing:.18em; color:var(--mint); margin-top:6px; text-transform:uppercase; }
.masa-bas .faz{ text-align:right; flex:none; }
.masa-bas .faz b{ display:block; font-size:14px; font-weight:650; line-height:1.3; }
.masa-bas .faz span{ display:block; font-size:12px; color:var(--mint); margin-top:2px; }

/* tutum karesi: dugmede ve kim-ne-yapti listesinde */
.btn.tutum{ position:relative; padding-left:30px; }
.nokta{ position:absolute; left:12px; top:19px; width:10px; height:10px; border-radius:1px; }
.n-SUPPORT,.k-SUPPORT{ background:var(--support); }
.n-CONDITIONAL,.k-CONDITIONAL{ background:var(--conditional); }
.n-RESERVATION,.k-RESERVATION{ background:var(--reservation); }
.n-OBJECT,.k-OBJECT{ background:var(--object); }
.kare{ display:inline-block; width:10px; height:10px; border-radius:1px; flex:none; vertical-align:middle; margin-right:2px; }
.lejant{ display:flex; gap:12px; flex-wrap:wrap; margin-top:8px; }
.lejant span{ display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); }
.lejant i{ width:8px; height:8px; border-radius:1px; display:inline-block; }

/* etiket cipi (hamle jargonu, kitap cipi) — .btn.move .tag ile ayni bicim, her yerde */
.tag{ display:inline-block; font-style:normal; font-family:var(--mono); font-size:10px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--brand); background:color-mix(in srgb,var(--brand) 10%,transparent);
  padding:2px 7px; border-radius:var(--radius); margin:4px 6px 4px 0; }
.tag.kitap{ color:var(--support); background:color-mix(in srgb,var(--support) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--support) 45%,transparent); margin-left:0; }
.altyazi{ font-size:12px; color:var(--ink-3); text-align:center; line-height:1.5; margin:0; }
.altyazi:empty{ display:none; }
.hukum-metin .offer{ border-top-color:var(--reservation); }

/* operator: 8 koltuk, konu listesi, baglantilar */
.koltuklar{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.koltuk{ border:1px solid var(--line); border-top:3px solid var(--brand-2); border-radius:var(--radius); padding:10px 10px 9px;
  min-height:78px; background:var(--paper); display:flex; flex-direction:column; justify-content:space-between; gap:6px; }
.koltuk .bayrak{ font-size:22px; line-height:1; }
.koltuk .ad{ font-size:11px; font-weight:650; line-height:1.25; letter-spacing:-.005em; }
.koltuk .durum{ font-family:var(--mono); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--support); }
.koltuk .durum.bekliyor{ color:var(--reservation); }
.koltuk.bos{ border:1px dashed var(--line-2); background:transparent; justify-content:center; align-items:center; }
.koltuk.bos span{ font-family:var(--mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); }
.konu{ border:1px solid var(--line-2); border-radius:var(--radius); padding:12px 14px; display:flex; flex-direction:column; gap:3px; opacity:.55; }
.konu b{ font-size:14.5px; font-weight:650; line-height:1.3; }
.konu span{ font-size:12.5px; color:var(--ink-3); line-height:1.45; }
.konu.sel{ opacity:1; border-top:3px solid var(--brand-2); background:color-mix(in srgb,var(--brand-2) 7%,var(--paper)); }
.konu .etiket{ font-family:var(--mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--brand-2); font-weight:600; }
.konular-kucuk{ display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.konular-kucuk .konu{ padding:9px 12px; }
.baglar{ display:grid; grid-template-columns:130px 1fr; gap:14px; align-items:start; }
@media (max-width:480px){
  .koltuklar{ grid-template-columns:repeat(2,1fr); }
  .baglar{ grid-template-columns:1fr; }
  .konular-kucuk{ grid-template-columns:1fr; }
}

/* kim-ne-yapti satiri: uzun delegasyon adi (FRANSA / AVRUPA BIRLIGI) tutum
   etiketinin altina giriyordu — ad sarilir, etiket sag kenarda sabit kalir */
.seat .who{ flex:1; min-width:0; }
.seat .ust{ min-width:0; max-width:100%; }
.seat.detayli .nm{ white-space:normal; line-height:1.3; }
.seat .st{ flex:none; white-space:nowrap; text-align:right; }

/* .row icindeki dugmeler yan yana dursun (.btn width:100% onlari alt alta diziyordu) */
.row .btn{ flex:1 1 200px; width:auto; }