/* ============================================================
   JATIA CLUB — style.css
   Palet: logo turuncusu (#FF5400 / #F03000), sıcak siyah, kırık beyaz
   Display: Chakra Petch · Body: Space Grotesk · Veri: JetBrains Mono
   ============================================================ */

:root{
  --ember:      #FF5400;
  --ember-hot:  #F03000;
  --amber:      #FFB35C;
  --coal:       #0B0806;
  --coal-2:     #15100B;
  --coal-3:     #1F1811;
  --paper:      #F7F2EA;
  --ash:        #A79C8F;
  --line:       rgba(255,180,120,.14);

  --bg:         var(--coal);
  --surface:    rgba(255,168,100,.05);
  --surface-2:  rgba(255,168,100,.09);
  --text:       var(--paper);
  --muted:      var(--ash);
  --glass-brd:  rgba(255,180,120,.16);
  --shadow:     0 24px 60px -24px rgba(0,0,0,.7);
  --glow:       0 0 42px -6px rgba(255,84,0,.55);

  --font-d: "Chakra Petch", sans-serif;
  --font-b: "Space Grotesk", sans-serif;
  --font-m: "JetBrains Mono", monospace;

  --rad: 14px;
  --cut: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
  --ease: cubic-bezier(.22,.9,.28,1);
}

html[data-theme="light"]{
  --bg:        #F5EFE6;
  --surface:   rgba(255,255,255,.6);
  --surface-2: rgba(255,255,255,.85);
  --text:      #1C130B;
  --muted:     #6E5F51;
  --line:      rgba(190,90,20,.16);
  --glass-brd: rgba(190,90,20,.22);
  --shadow:    0 24px 50px -28px rgba(120,50,0,.35);
  --glow:      0 0 36px -8px rgba(255,84,0,.35);
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--font-b);
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  line-height:1.6;
  transition:background .5s var(--ease), color .5s var(--ease);
}
::selection{ background:var(--ember); color:#fff; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
em{ font-style:normal; color:var(--ember); }
.mono{ font-family:var(--font-m); }

/* Scrollbar */
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--bg); }
::-webkit-scrollbar-thumb{ background:linear-gradient(var(--ember),var(--ember-hot)); border-radius:8px; }

/* ============ ARKA PLAN ATMOSFERİ ============ */
.bg-aurora{
  position:fixed; inset:0; z-index:-3; pointer-events:none;
  background:
    radial-gradient(60vw 40vh at 18% -5%, rgba(255,84,0,.14), transparent 60%),
    radial-gradient(50vw 45vh at 85% 15%, rgba(240,48,0,.10), transparent 65%),
    radial-gradient(70vw 50vh at 50% 110%, rgba(255,179,92,.08), transparent 60%);
  filter:blur(2px);
}
html[data-theme="light"] .bg-aurora{ opacity:.8; }

/* ============ EMBER SAKURA — GERÇEKÇİ KENAR AĞAÇLARI ============ */
.sakura-side{
  position:fixed; top:0; bottom:0; width:min(300px,22vw);
  z-index:-2; pointer-events:none;
}
.sakura-left{ left:0; }
.sakura-right{ right:0; }
.sakura-side img{
  width:100%; height:100%; object-fit:cover; object-position:top;
  filter:drop-shadow(0 0 34px rgba(255,84,0,.22));
  animation:sway 9s ease-in-out infinite alternate;
  transform-origin:bottom center;
}
/* içerik tarafına doğru eriyerek kaybolsun — üst üste binme hissini yok eder */
.sakura-left img{
  object-position:top left;
  -webkit-mask-image:linear-gradient(to right, #000 58%, transparent 97%);
          mask-image:linear-gradient(to right, #000 58%, transparent 97%);
}
.sakura-right img{
  object-position:top right; animation-delay:-4.5s;
  -webkit-mask-image:linear-gradient(to left, #000 58%, transparent 97%);
          mask-image:linear-gradient(to left, #000 58%, transparent 97%);
}
@keyframes sway{
  from{ transform:rotate(-.45deg) translateX(-3px); }
  to{   transform:rotate(.45deg)  translateX(3px); }
}
html[data-theme="light"] .sakura-side img{
  filter:drop-shadow(0 0 30px rgba(255,84,0,.18)) saturate(1.05);
}
/* ara ekranlar: şerit daralır ve soluklaşır, içerikle yarışmaz */
@media (max-width:1240px){
  .sakura-side{ width:15vw; opacity:.72; }
}
@media (max-width:980px){
  .sakura-side{ width:11vw; opacity:.5; }
}

#petals{
  position:fixed; inset:0; z-index:-1; pointer-events:none;
}

/* ============ INTRO ============ */
#intro{
  position:fixed; inset:0; z-index:100;
  background:var(--coal);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .8s var(--ease), visibility .8s;
}
#intro.done{ opacity:0; visibility:hidden; }
.intro-stage{ text-align:center; perspective:900px; }
.intro-logo{
  display:block; max-width:min(560px, 82vw); width:auto;
  height:min(var(--logo-intro-h, 96px), 46vh); object-fit:contain;
  margin:0 auto 34px;
  animation:logoSpin 2.4s var(--ease);
  filter:drop-shadow(0 0 34px var(--glow-color, #FF5400));
}
@keyframes logoSpin{
  0%{ transform:rotateY(0deg) scale(.6); opacity:0; }
  55%{ transform:rotateY(360deg) scale(1.04); opacity:1; }
  100%{ transform:rotateY(360deg) scale(1); }
}
.intro-bar{
  width:min(260px,60vw); height:3px; margin:0 auto 14px;
  background:rgba(255,255,255,.1); overflow:hidden;
  clip-path:polygon(0 0,calc(100% - 3px) 0,100% 100%,3px 100%);
}
.intro-bar span{
  display:block; height:100%; width:0%;
  background:linear-gradient(90deg,var(--ember-hot),var(--ember),var(--amber));
  transition:width .25s linear;
}
.intro-tag{
  font-family:var(--font-m); font-size:11px; letter-spacing:.5em;
  color:var(--ash);
}

/* ============ CUSTOM CURSOR ============ */
.cursor-dot,.cursor-ring{
  position:fixed; top:0; left:0; z-index:99; pointer-events:none;
  border-radius:50%; transform:translate(-50%,-50%);
}
.cursor-dot{
  width:6px; height:6px; background:var(--ember);
  box-shadow:0 0 12px var(--ember);
}
.cursor-ring{
  width:34px; height:34px; border:1.5px solid var(--ember);
  opacity:.55; transition:width .25s var(--ease),height .25s var(--ease),opacity .25s,border-color .25s;
}
.cursor-ring.hovering{ width:56px; height:56px; opacity:.95; border-color:var(--amber); }
@media (hover:none), (pointer:coarse){
  .cursor-dot,.cursor-ring{ display:none; }
}

/* ============ GLASS ============ */
.glass{
  background:var(--surface);
  backdrop-filter:blur(18px) saturate(1.3);
  -webkit-backdrop-filter:blur(18px) saturate(1.3);
  border:1px solid var(--glass-brd);
  box-shadow:var(--shadow);
}

/* ============ NAV ============ */
.nav{
  position:fixed; top:14px; left:50%; transform:translateX(-50%);
  /* --nav-w: logo büyüdükçe JS genişletir, yazılar sıkışmaz */
  width:min(var(--nav-w, 1180px), calc(100% - 28px));
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:10px 18px; z-index:50; border-radius:var(--rad);
  transition:box-shadow .4s, background .4s;
}
.nav.scrolled{ box-shadow:var(--shadow), 0 0 0 1px var(--line); background:var(--surface-2); }
.nav-logo{ flex:0 0 auto; display:flex; align-items:center; }
.nav-logo img{ height:34px; width:auto; object-fit:contain; flex:0 0 auto; filter:drop-shadow(0 0 10px rgba(255,84,0,.4)); }
.nav-links{ display:flex; gap:26px; flex:0 0 auto; }
.nav-links a{
  white-space:nowrap; flex:0 0 auto;
  font-family:var(--font-d); font-weight:600; font-size:13.5px;
  letter-spacing:.08em; text-transform:uppercase; color:var(--muted);
  position:relative; padding:4px 0; transition:color .25s;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; height:2px; width:0;
  background:linear-gradient(90deg,var(--ember),var(--amber));
  transition:width .3s var(--ease);
}
.nav-links a:hover{ color:var(--text); }
.nav-links a:hover::after,.nav-links a.active::after{ width:100%; }
.nav-links a.active{ color:var(--ember); }
.nav-actions{ display:flex; align-items:center; gap:12px; flex:0 0 auto; }

.theme-toggle{
  width:38px; height:38px; border-radius:10px; display:grid; place-items:center;
  border:1px solid var(--glass-brd); transition:transform .3s var(--ease), box-shadow .3s;
}
@media (hover:hover) and (pointer:fine){
  .theme-toggle:hover{ transform:rotate(20deg); box-shadow:var(--glow); }
}
.theme-toggle:active{ transform:scale(.9); }
.theme-toggle svg{ width:18px; height:18px; fill:none; stroke:var(--ember); stroke-width:2; stroke-linecap:round; }
html[data-theme="dark"] .ic-moon{ display:none; }
html[data-theme="light"] .ic-sun{ display:none; }

.nav-burger{ display:none; flex-direction:column; gap:5px; padding:8px; }
.nav-burger span{ width:22px; height:2px; background:var(--text); transition:.3s var(--ease); }

/* ============ BUTONLAR ============ */
.btn{
  position:relative; display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-d); font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; font-size:14px;
  padding:15px 30px; clip-path:var(--cut);
  transition:transform .25s var(--ease), box-shadow .25s, background .25s, color .25s;
  overflow:hidden; isolation:isolate;
}
.btn .ic{ width:19px; height:19px; fill:currentColor; }
.btn-sm{ padding:10px 18px; font-size:12.5px; }
.btn-primary{
  background:linear-gradient(135deg,var(--ember) 0%,var(--ember-hot) 100%);
  color:#fff;
}
.btn-primary::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);
  transform:translateX(-120%);
}
.btn-primary:hover{ transform:translateY(-3px); box-shadow:var(--glow); }
.btn-primary:hover::before{ transition:transform .7s var(--ease); transform:translateX(120%); }
.btn-ghost{
  border:none; color:var(--text);
  background:var(--glass-brd); /* kesik koseli "kenarlik" rengi */
}
.btn-ghost::after{
  content:""; position:absolute; inset:1.5px; z-index:-1;
  clip-path:var(--cut); background:var(--coal-2);
  transition:background .25s;
}
html[data-theme="light"] .btn-ghost::after{ background:#FBF6EE; }
.btn-ghost:hover{ transform:translateY(-3px); background:var(--ember); color:var(--ember); box-shadow:var(--glow); }
.btn:active{ transform:translateY(0) scale(.97); }
.btn:focus-visible, a:focus-visible, button:focus-visible{
  outline:2px solid var(--amber); outline-offset:3px;
}

/* ============ HERO ============ */
.hero{
  min-height:100svh; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center;
  padding:140px 24px 80px; position:relative;
}
.eyebrow{
  font-family:var(--font-m); font-size:11.5px; font-weight:700;
  letter-spacing:.42em; color:var(--ember); margin-bottom:22px;
}
.hero-title{
  font-family:var(--font-d); font-weight:700;
  font-size:clamp(40px, 8.2vw, 104px);
  line-height:.98; text-transform:uppercase; letter-spacing:-.01em;
}
.hero-title .line{ display:block; overflow:hidden; }
.hero-title .line > span{ display:inline-block; }
.hero-title .tick{ color:var(--ember); text-shadow:0 0 30px rgba(255,84,0,.8); }
.hero-desc{
  max-width:640px; margin:28px auto 0; color:var(--muted);
  font-size:clamp(15px,1.6vw,18px);
}
.hero-cta{ display:flex; gap:16px; flex-wrap:wrap; justify-content:center; margin-top:38px; }
.hero-live{
  display:inline-flex; align-items:center; gap:10px; margin-top:34px;
  font-family:var(--font-m); font-size:13px; color:var(--muted);
  padding:9px 18px; border-radius:99px;
  border:1px solid var(--glass-brd); background:var(--surface);
  backdrop-filter:blur(10px);
}
.hero-live strong{ color:var(--ember); font-size:15px; }
.pulse{
  width:9px; height:9px; border-radius:50%; background:#3BE86B;
  box-shadow:0 0 0 0 rgba(59,232,107,.6); animation:pulse 1.8s infinite;
}
@keyframes pulse{
  70%{ box-shadow:0 0 0 10px rgba(59,232,107,0); }
  100%{ box-shadow:0 0 0 0 rgba(59,232,107,0); }
}
.scroll-hint{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  width:26px; height:44px; border:2px solid var(--line); border-radius:16px;
}
.scroll-hint span{
  position:absolute; top:8px; left:50%; width:4px; height:9px;
  margin-left:-2px; border-radius:4px; background:var(--ember);
  animation:wheel 1.8s var(--ease) infinite;
}
@keyframes wheel{ 0%{ transform:translateY(0); opacity:1; } 80%{ transform:translateY(16px); opacity:0; } 100%{ opacity:0; } }

/* ============ BÖLÜMLER ============ */
.section{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto; padding:110px 0;
}
.sec-head{ display:flex; flex-wrap:wrap; align-items:end; gap:14px 24px; margin-bottom:48px; }
.sec-head h2{
  font-family:var(--font-d); font-weight:700; text-transform:uppercase;
  font-size:clamp(30px,4.4vw,52px); line-height:1.02; flex:1 1 auto;
}
.sec-head .eyebrow{ width:100%; margin-bottom:6px; }

.grid{ display:grid; gap:22px; }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-2{ grid-template-columns:repeat(2,1fr); }

.card{
  border-radius:var(--rad); padding:30px;
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s;
  position:relative; overflow:hidden;
}
.card::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0;
  background:radial-gradient(420px 200px at var(--mx,50%) var(--my,0%), rgba(255,84,0,.13), transparent 60%);
  transition:opacity .35s;
}
.card:hover{ transform:translateY(-6px); border-color:rgba(255,84,0,.45); box-shadow:var(--shadow), var(--glow); }
.card:hover::after{ opacity:1; }
.card-ic{
  width:52px; height:52px; margin-bottom:20px; display:grid; place-items:center;
  clip-path:var(--cut); background:linear-gradient(135deg,var(--ember),var(--ember-hot));
}
.card-ic svg{ width:26px; height:26px; fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.card h3{ font-family:var(--font-d); text-transform:uppercase; font-size:19px; letter-spacing:.03em; margin-bottom:10px; }
.card p{ color:var(--muted); font-size:15px; }
.card-title{
  font-family:var(--font-d); text-transform:uppercase; font-size:17px;
  margin-bottom:20px; display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.tag{
  font-size:10.5px; color:var(--ember); border:1px solid var(--line);
  padding:3px 9px; border-radius:99px; letter-spacing:.15em;
}

/* ============ CANLI ============ */
.live-strip{
  display:grid; grid-template-columns:repeat(4,1fr);
  border-radius:var(--rad); margin-bottom:22px; overflow:hidden;
}
.live-cell{
  padding:28px 20px; text-align:center; position:relative;
}
.live-cell + .live-cell::before{
  content:""; position:absolute; left:0; top:22%; bottom:22%;
  width:1px; background:var(--line);
}
.live-cell .big{ font-size:clamp(26px,3.4vw,40px); font-weight:700; color:var(--ember); display:block; }
.live-cell .lbl{
  font-family:var(--font-m); font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--muted);
}
.room-list{ list-style:none; display:flex; flex-direction:column; gap:12px; }
.room{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 18px; border:1px solid var(--line); border-radius:10px;
  font-size:14.5px; transition:border-color .3s, transform .3s var(--ease);
  background:var(--surface);
}
.room:hover{ border-color:var(--ember); transform:translateX(6px); }
.room .cnt{ font-family:var(--font-m); color:var(--ember); font-weight:700; white-space:nowrap; }
.room.skeleton span{
  display:block; height:14px; width:70%; border-radius:6px;
  background:linear-gradient(90deg,var(--surface),var(--surface-2),var(--surface));
  background-size:220% 100%; animation:shimmer 1.4s infinite;
}
@keyframes shimmer{ from{ background-position:220% 0; } to{ background-position:-20% 0; } }
.avatar-wall{ display:flex; flex-wrap:wrap; gap:10px; min-height:56px; }
.avatar-wall img{
  width:46px; height:46px; border-radius:12px; object-fit:cover;
  border:2px solid transparent; transition:transform .25s var(--ease), border-color .25s;
}
.avatar-wall img:hover{ transform:translateY(-4px) scale(1.08); border-color:var(--ember); }
.hint{ margin-top:16px; font-family:var(--font-m); font-size:11.5px; color:var(--muted); }

/* ============ CHART ============ */
.chart-card canvas{ width:100% !important; }

/* ============ ETKİNLİK ============ */
.event-list{ display:flex; flex-direction:column; gap:16px; }
.event{
  display:grid; grid-template-columns:110px 1fr auto; gap:22px; align-items:center;
  padding:24px 28px; border-radius:var(--rad);
  transition:transform .3s var(--ease), border-color .3s, box-shadow .3s;
}
.event:hover{ transform:translateX(8px); border-color:rgba(255,84,0,.5); box-shadow:var(--glow); }
.event-date{
  text-align:center; font-family:var(--font-d); text-transform:uppercase;
  border-right:1px solid var(--line); padding-right:22px;
}
.event-date .d{ font-size:34px; font-weight:700; color:var(--ember); line-height:1; display:block; }
.event-date .m{ font-family:var(--font-m); font-size:11px; letter-spacing:.3em; color:var(--muted); }
.event-info h3{ font-family:var(--font-d); text-transform:uppercase; font-size:18px; margin-bottom:4px; }
.event-info p{ color:var(--muted); font-size:14px; }
.event-type{
  font-family:var(--font-m); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  padding:6px 14px; border-radius:99px; white-space:nowrap;
  border:1px solid var(--ember); color:var(--ember);
}
.event-type.t2{ border-color:var(--amber); color:var(--amber); }

/* ============ ÜYE KARTLARI ============ */
.member{
  border-radius:var(--rad); padding:28px; text-align:center;
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s;
}
.member:hover{ transform:translateY(-8px) rotate(-.4deg); box-shadow:var(--shadow), var(--glow); border-color:rgba(255,84,0,.5); }
.member-ava{
  width:88px; height:88px; margin:0 auto 16px; clip-path:var(--cut);
  background:linear-gradient(135deg,var(--ember),var(--ember-hot));
  display:grid; place-items:center;
  font-family:var(--font-d); font-weight:700; font-size:30px; color:#fff;
}
.member h3{ font-family:var(--font-d); text-transform:uppercase; font-size:18px; }
.member .role{ font-family:var(--font-m); font-size:11px; letter-spacing:.24em; color:var(--ember); text-transform:uppercase; margin:4px 0 16px; }
.member-stats{
  display:flex; justify-content:center; gap:22px; margin-bottom:18px;
  font-family:var(--font-m); font-size:12px; color:var(--muted);
}
.member-stats b{ display:block; color:var(--text); font-size:16px; }
.badges{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.badge{
  font-family:var(--font-m); font-size:10.5px; letter-spacing:.06em;
  padding:5px 11px; border-radius:99px; border:1px solid var(--line);
  color:var(--muted); transition:.25s;
}
.badge:hover{ border-color:var(--ember); color:var(--ember); transform:translateY(-2px); }
.badge.gold{ border-color:var(--amber); color:var(--amber); }

/* ============ BLOG ============ */
.post{
  border-radius:var(--rad); overflow:hidden; display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s;
  height:100%;
}
.carousel .grid{ align-items:stretch; grid-auto-rows:1fr; }
/* kart gövdesi esnesin, banner sabit — böylece kartlar eşit yükseklikte kalır */
.post-body{ flex:1 1 auto; display:flex; flex-direction:column; }
.post-body .post-tools, .post-body .more{ margin-top:auto; }
.post:hover{ transform:translateY(-6px); box-shadow:var(--shadow), var(--glow); border-color:rgba(255,84,0,.5); }
.post-banner{
  height:120px; position:relative;
  background:
    linear-gradient(135deg, rgba(255,84,0,.55), rgba(240,48,0,.25)),
    repeating-linear-gradient(-45deg, transparent 0 14px, rgba(255,255,255,.05) 14px 15px);
}
.post-banner span{
  position:absolute; left:20px; bottom:14px;
  font-family:var(--font-m); font-size:10.5px; letter-spacing:.26em; color:#fff;
}
.post-body{ padding:24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.post-body h3{ font-family:var(--font-d); text-transform:uppercase; font-size:17px; }
.post-body p{ color:var(--muted); font-size:14px; flex:1; }
.post-body .meta{ font-family:var(--font-m); font-size:11px; color:var(--muted); letter-spacing:.1em; }
.post-body .more{ font-family:var(--font-d); text-transform:uppercase; font-size:12.5px; letter-spacing:.1em; color:var(--ember); }
.post-body .more:hover{ text-decoration:underline; }

/* ============ SON CTA + FOOTER ============ */
.final-cta{ text-align:center; }
.cta-box{ border-radius:var(--rad); padding:70px 30px; position:relative; overflow:hidden; }
.cta-logo{ width:200px; margin:0 auto 26px; filter:drop-shadow(0 0 26px rgba(255,84,0,.5)); }
.cta-box h2{ font-family:var(--font-d); text-transform:uppercase; font-size:clamp(26px,4vw,44px); margin-bottom:12px; }
.cta-box p{ color:var(--muted); margin-bottom:30px; }
.footer{
  text-align:center; padding:50px 20px 40px; border-top:1px solid var(--line);
  color:var(--muted); font-size:13.5px;
}
.footer-logo{ width:120px; margin:0 auto 14px; opacity:.85; }

/* ============ REVEAL (GSAP fallback dahil) ============ */
.reveal, .gs-reveal{ opacity:1; }

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
  .live-strip{ grid-template-columns:repeat(2,1fr); }
  .live-cell:nth-child(3)::before{ display:none; }
}
/* linkleri tablet + küçük masaüstünde hamburger menüye al (taşmayı önler) */
@media (max-width:1024px){
  .nav-links{
    position:fixed; inset:72px 14px auto 14px; z-index:60;
    flex-direction:column; gap:6px; padding:18px; align-items:stretch;
    background:var(--bg);
    background-image:linear-gradient(180deg, var(--surface-2), var(--surface));
    backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
    border:1px solid var(--glass-brd); border-radius:var(--rad);
    box-shadow:0 30px 70px -20px rgba(0,0,0,.85), var(--glow);
    transform:translateY(-16px); opacity:0; pointer-events:none;
    transition:.35s var(--ease); max-height:80svh; overflow:auto;
  }
  .nav-links.open{ transform:none; opacity:1; pointer-events:auto; }
  .nav-links a{ padding:12px 8px; font-size:14px; }
  .nav-burger{ display:flex; }
  .nav-burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .nav-burger.open span:nth-child(2){ opacity:0; }
  .nav-burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
}
@media (max-width:980px){
  .grid-3{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:760px){
  .grid-2,.grid-3{ grid-template-columns:1fr; }
  .nav .btn{ padding:9px 13px; font-size:11px; }
  .nav-auth{ gap:6px; }
  .event{ grid-template-columns:auto 1fr; gap:14px; }
  .section{ padding:72px 0; }
  .sakura-side{ display:none; }
  .modal{ padding:28px 20px 24px; }
  .car-nav{ width:38px; height:38px; font-size:20px; }
  .carousel{ padding:0 46px; }
}
@media (max-width:440px){
  .nav{ padding:8px 12px; width:calc(100% - 20px); }
  .nav-logo img{ height:28px; }
  .sq-btn, .theme-toggle{ width:34px; height:34px; }
  .nav-ava{ width:34px; height:34px; }
  .car-nav{ width:34px; height:34px; font-size:18px; }
  .carousel{ padding:0 40px; }
  .event-type{ font-size:10px; padding:5px 9px; }
}

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
  html{ scroll-behavior:auto; }
  #petals{ display:none; }
}

/* ============ OAUTH — kullanıcı çipi & kişisel kart ============ */
.user-chip{
  display:inline-flex; align-items:center; gap:10px;
  padding:7px 14px 7px 8px; border-radius:99px;
  font-family:var(--font-d); font-weight:600; font-size:13.5px;
}
.user-chip img{ width:30px; height:30px; border-radius:50%; }
.user-chip a{
  color:var(--muted); font-size:12px; padding:2px 6px; border-radius:6px;
  transition:color .25s, background .25s;
}
.user-chip a:hover{ color:#fff; background:var(--ember-hot); }
.member.is-me{ border-color:rgba(255,84,0,.55); box-shadow:var(--shadow), var(--glow); }
.member-ava-img{
  width:88px; height:88px; margin:0 auto 16px; clip-path:var(--cut); object-fit:cover;
}

/* ============ AUTH — MODALLAR, ALANLAR, NAV OTURUM ============ */
.modal-backdrop[hidden]{ display:none; }
.modal-backdrop{
  position:fixed; inset:0; z-index:80;
  background:rgba(8,5,3,.6);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center; padding:20px;
  animation:fadeIn .25s var(--ease);
}
html[data-theme="light"] .modal-backdrop{ background:rgba(60,35,15,.35); }
@keyframes fadeIn{ from{ opacity:0; } }
.modal{
  position:relative; width:min(420px,100%);
  border-radius:var(--rad); padding:34px 30px 28px;
  background:var(--surface-2);
  animation:popIn .3s var(--ease);
  max-height:92svh; overflow:auto;
}
@keyframes popIn{ from{ transform:translateY(18px) scale(.97); opacity:0; } }
.modal-narrow{ width:min(360px,100%); text-align:center; }
.modal-x{
  position:absolute; top:12px; right:12px; width:34px; height:34px;
  border-radius:9px; border:1px solid var(--glass-brd); color:var(--muted);
  transition:.25s;
}
.modal-x:hover{ color:#fff; background:var(--ember-hot); border-color:var(--ember-hot); }
.modal-title{
  font-family:var(--font-d); text-transform:uppercase; font-size:24px;
  text-align:center; margin-bottom:22px; letter-spacing:.04em;
}
.field{ position:relative; margin-top:12px; }
.field input{
  width:100%; padding:14px 44px 14px 16px;
  background:var(--surface); border:1px solid var(--glass-brd);
  border-radius:10px; color:var(--text); font:inherit; font-size:14.5px;
  transition:border-color .25s, box-shadow .25s;
}
.field input:focus{ outline:none; border-color:var(--ember); box-shadow:0 0 0 3px rgba(255,84,0,.18); }
.field input.ok{ border-color:#3BB65E; }
.field input.bad{ border-color:#E23B3B; }
.field .mark{
  position:absolute; right:14px; top:50%; transform:translateY(-50%);
  font-size:15px; font-weight:700; pointer-events:none;
}
.field .mark.ok::before{ content:"✓"; color:#3BE86B; }
.field .mark.bad::before{ content:"✕"; color:#FF5A5A; }
.field-why{
  min-height:16px; margin:5px 2px 0; font-family:var(--font-m);
  font-size:11.5px; color:#FF7A7A; line-height:1.45;
}
.field-why.good{ color:#5ADB86; }
.form-error{
  min-height:16px; margin-top:8px; text-align:center;
  font-family:var(--font-m); font-size:12px; color:#FF7A7A;
}
.modal-btn{ width:100%; justify-content:center; margin-top:12px; }
.social-sep{
  margin:20px 0 12px; text-align:center; color:var(--muted);
  font-family:var(--font-m); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  display:flex; align-items:center; gap:12px;
}
.social-sep::before, .social-sep::after{ content:""; flex:1; height:1px; background:var(--line); }
.social-row{ display:flex; justify-content:center; gap:14px; }
.social-sq{
  width:58px; height:58px; border-radius:12px; display:grid; place-items:center;
  border:1px solid var(--glass-brd); background:var(--surface);
  transition:transform .25s var(--ease), border-color .25s, box-shadow .25s;
}
.social-sq:hover{ transform:translateY(-4px); border-color:var(--ember); box-shadow:var(--glow); }
.social-sq svg{ width:28px; height:28px; fill:var(--text); }
.auth-swap{ margin-top:20px; text-align:center; font-size:13.5px; color:var(--muted); }
.auth-swap a{ color:var(--ember); font-weight:700; }
.auth-swap a:hover{ text-decoration:underline; }

/* nav oturum alani */
.nav-auth{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.sq-btn{
  width:38px; height:38px; border-radius:10px; display:grid; place-items:center;
  border:1px solid var(--glass-brd); transition:.25s var(--ease);
}
.sq-btn svg{ width:18px; height:18px; fill:none; stroke:var(--ember); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
@media (hover:hover) and (pointer:fine){
  .sq-btn:hover{ border-color:var(--ember); box-shadow:var(--glow); transform:translateY(-2px); }
}
.sq-btn:active{ transform:scale(.9); }
.nav-ava{
  width:38px; height:38px; border-radius:10px; object-fit:cover; cursor:pointer;
  border:2px solid var(--ember); transition:.25s var(--ease);
}
.nav-ava:hover{ box-shadow:var(--glow); transform:translateY(-2px); }

/* profil foto modali */
.photo-big{
  width:200px; height:200px; border-radius:18px; object-fit:cover;
  margin:0 auto 6px; border:3px solid var(--ember);
  box-shadow:var(--glow);
}
.acc-row{
  display:flex; justify-content:space-between; gap:12px; text-align:left;
  padding:11px 2px; border-bottom:1px solid var(--line);
  font-size:14px; color:var(--muted);
}
.acc-row b{ color:var(--text); font-weight:600; word-break:break-all; }

/* ============ AUTH v2 — göz, bağlantılar, onay, kart düzenleme ============ */
.field.has-eye input{ padding-right:76px; }
.field .eye{
  position:absolute; right:40px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; display:grid; place-items:center; color:var(--muted);
  border-radius:7px; transition:.2s;
}
.field .eye svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }
.field .eye:hover{ color:var(--ember); }
.field .eye.on{ color:var(--ember); }

.acc-sub{
  margin:18px 0 8px; font-family:var(--font-m); font-size:11px;
  letter-spacing:.22em; text-transform:uppercase; color:var(--ember);
  text-align:left; display:flex; align-items:center; gap:10px; justify-content:space-between;
}
.acc-click{ cursor:pointer; transition:background .2s; border-radius:8px; }
.acc-click:hover{ background:var(--surface); }
.acc-click b::after{ content:" ✎"; color:var(--ember); font-size:12px; }
.link-row{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:9px 2px; border-bottom:1px solid var(--line); font-size:14px; text-align:left;
}
.link-btn{
  font-family:var(--font-d); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  padding:6px 14px; border-radius:99px; border:1px solid var(--ember); color:var(--ember);
  transition:.2s;
}
.link-btn:hover{ background:var(--ember); color:#fff; }
.link-btn.linked{ border-color:#3BB65E; color:#5ADB86; pointer-events:none; }

.confirm-row{ display:flex; justify-content:center; gap:20px; margin-top:16px; }
.round-btn{
  width:54px; height:54px; border-radius:50%; font-size:22px; font-weight:700;
  border:2px solid var(--glass-brd); transition:.22s var(--ease);
}
.round-btn.ok{ color:#5ADB86; border-color:#3BB65E; }
.round-btn.ok:hover{ background:#3BB65E; color:#fff; transform:translateY(-3px); box-shadow:0 0 26px -4px #3BB65E; }
.round-btn.no{ color:#FF7A7A; border-color:#C24242; }
.round-btn.no:hover{ background:#C24242; color:#fff; transform:translateY(-3px); box-shadow:0 0 26px -4px #C24242; }

/* rozet secimi */
.badge-pick{ display:flex; flex-wrap:wrap; gap:8px; }
.badge-pick .badge{ cursor:pointer; user-select:none; }
.badge-pick .badge.sel{
  border-color:var(--ember); color:var(--ember);
  box-shadow:0 0 14px -4px var(--ember);
}

/* renk daireleri */
.color-row{ display:flex; gap:14px; flex-wrap:wrap; }
.color-dot{
  width:42px; height:42px; border-radius:50%;
  border:2px solid var(--glass-brd);
  transition:transform .2s var(--ease), border-color .2s, box-shadow .2s;
}
.color-dot:hover{ transform:scale(1.12); }
.color-dot.sel{ border-color:#fff; box-shadow:0 0 0 3px var(--ember), 0 0 18px -2px var(--ember); }
.d-default{ background:linear-gradient(135deg, var(--surface-2), var(--surface)); position:relative; }
.d-default::after{ content:"↺"; position:absolute; inset:0; display:grid; place-items:center; color:var(--muted); font-size:17px; }
.d-grease{  background:#232323; }
.d-berry{   background:#8E2335; }
.d-plum{    background:#C9A6E9; }
.d-saffron{ background:#F4A62A; }
.d-green{   background:#86B049; }

/* kart arka plan temalari (uye kartlarina uygulanir) */
.member[data-bg="grease"]{  background:linear-gradient(165deg, #232323F0, #161616D8); }
.member[data-bg="berry"]{   background:linear-gradient(165deg, #8E2335CC, #58121FB8); }
.member[data-bg="plum"]{    background:linear-gradient(165deg, #C9A6E9B8, #8E68B4A6); }
.member[data-bg="saffron"]{ background:linear-gradient(165deg, #F4A62AB8, #B26E12A6); }
.member[data-bg="green"]{   background:linear-gradient(165deg, #86B049B8, #55702DA6); }

/* kart duzenle butonu (uye cipinin solunda) */
.edit-card-btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-d); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  padding:9px 16px; border-radius:99px; border:1px solid var(--ember); color:var(--ember);
  transition:.22s; margin-right:10px;
}
.edit-card-btn:hover{ background:var(--ember); color:#fff; box-shadow:var(--glow); }

/* ============ İÇERİK SİSTEMİ — okuyucu, yönetim, favoriler ============ */
.modal-wide{ width:min(620px,100%); }
.f-label{
  display:block; margin:12px 2px 4px; text-align:left;
  font-family:var(--font-m); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--muted);
}
.f-area{
  width:100%; min-height:74px; resize:vertical; padding:12px 14px;
  background:var(--surface); border:1px solid var(--glass-brd);
  border-radius:10px; color:var(--text); font:inherit; font-size:14px;
}
.f-area:focus{ outline:none; border-color:var(--ember); box-shadow:0 0 0 3px rgba(255,84,0,.18); }
.f-area-lg{ min-height:160px; }
.f-select{
  width:100%; padding:13px 14px; background:var(--surface);
  border:1px solid var(--glass-brd); border-radius:10px; color:var(--text); font:inherit;
}
.f-select option{ background:var(--coal-2); color:var(--paper); }

.reader-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; padding-right:44px; }
#readerModal .star-btn{ position:relative; z-index:1; }
.reader-body{
  margin-top:16px; text-align:left; color:var(--text);
  font-size:15px; line-height:1.75; white-space:normal;
  border-top:1px solid var(--line); padding-top:16px;
  max-height:48svh; overflow:auto;
}
.star-btn svg{ fill:none; stroke:var(--muted); stroke-width:2; }
.star-btn.on svg{ fill:var(--amber); stroke:var(--amber); filter:drop-shadow(0 0 8px rgba(255,179,92,.7)); }

/* kart/etkinlik uzerindeki mini yildiz */
.fav-mini{
  display:inline-grid; place-items:center; width:30px; height:30px;
  border-radius:8px; border:1px solid var(--line); transition:.2s;
}
.fav-mini svg{ width:15px; height:15px; fill:none; stroke:var(--muted); stroke-width:2; }
.fav-mini.on svg{ fill:var(--amber); stroke:var(--amber); }
.fav-mini:hover{ border-color:var(--amber); }

/* yonetici kalem butonlari */
.adm-btn{
  display:inline-grid; place-items:center; width:32px; height:32px;
  border-radius:9px; border:1px solid var(--ember); color:var(--ember);
  transition:.2s; flex:0 0 auto;
}
.adm-btn svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.adm-btn:hover{ background:var(--ember); color:#fff; box-shadow:var(--glow); }
.sec-head .adm-btn{ width:38px; height:38px; }
.event-side{ display:flex; align-items:center; gap:10px; }
.post-tools{ display:flex; gap:8px; align-items:center; }

/* yonetim listesi */
.manage-list{ display:flex; flex-direction:column; gap:10px; max-height:46svh; overflow:auto; text-align:left; }
.mng-row{
  display:flex; align-items:center; gap:12px; padding:12px 14px;
  border:1px solid var(--line); border-radius:10px; background:var(--surface);
}
.mng-row .mng-info{ flex:1; min-width:0; }
.mng-row .mng-info b{ display:block; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mng-row .mng-info span{ font-family:var(--font-m); font-size:10.5px; color:var(--muted); }
.mng-row .home-tg{
  font-family:var(--font-m); font-size:10px; letter-spacing:.1em; white-space:nowrap;
  padding:5px 10px; border-radius:99px; border:1px solid var(--line); color:var(--muted); transition:.2s;
}
.mng-row .home-tg.on{ border-color:var(--ember); color:var(--ember); }
.mng-row .del-btn{ border-color:#C24242; color:#FF7A7A; }
.mng-row .del-btn:hover{ background:#C24242; color:#fff; }

.post-banner .post-adm{ position:absolute; top:12px; right:12px; background:rgba(0,0,0,.25); }

/* ============ v9 — katman düzeni, kapaklar, yönetici paneli ============ */
#evEditModal, #postEditModal, #userEditModal { z-index:90; }
#followModal { z-index:92; }
#confirmModal { z-index:96; }

.donut-wrap{ max-width:280px; margin:0 auto; }
.stat-list{ list-style:none; margin-top:16px; display:flex; flex-direction:column; gap:9px; }
.stat-list li{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  padding:9px 13px; border:1px solid var(--line); border-radius:9px;
  font-size:13.5px; background:var(--surface);
}
.stat-list li .rank{ color:var(--ember); font-family:var(--font-m); font-weight:700; margin-right:8px; }
.stat-list li .nm{ flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stat-list li .val{
  font-family:var(--font-m); font-size:10.5px; letter-spacing:.06em; white-space:nowrap;
  padding:5px 11px; border-radius:99px; border:1px solid var(--line); color:var(--muted);
}

/* kapaklar */
.cover-ctl{ display:flex; align-items:center; gap:10px; }
.cover-prev{
  width:96px; height:44px; border-radius:8px; border:1px solid var(--line);
  background:var(--surface) center/cover no-repeat; flex:0 0 auto;
}
.post-banner{ background-size:cover; background-position:center; }
.post-banner.has-img::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,6,3,.05), rgba(10,6,3,.55));
}
.post-banner span{ z-index:1; }
.event{ position:relative; overflow:hidden; }
.event-img{
  position:absolute; top:0; bottom:0; left:auto; right:250px;
  width:min(300px, 26%); pointer-events:none;
  background:center/cover no-repeat;
  clip-path:polygon(18% 0, 100% 0, 82% 100%, 0 100%);
  opacity:.9;
}
@media (max-width:1240px){ .event-img{ right:220px; width:22%; } }
.event-img::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(10,6,3,.45), transparent 30%, transparent 70%, rgba(10,6,3,.45));
}
@media (max-width:900px){ .event-img{ display:none; } }

/* yonetici paneli */
.sq-btn.lg{ width:48px; height:48px; }
.sq-btn.danger svg{ stroke:#FF7A7A; }
.sq-btn.danger:hover{ border-color:#C24242; box-shadow:0 0 22px -4px #C24242; }
.sq-btn.locked{ border-color:#C24242; }
.sq-btn.locked svg{ stroke:#FF7A7A; }
.users-tools{ display:flex; gap:10px; align-items:center; margin-bottom:12px; }
.pager{ display:flex; justify-content:center; align-items:center; gap:16px; margin-top:14px; }
.ue-head{ display:flex; gap:16px; align-items:flex-start; text-align:left; }
.ue-head img{ width:72px; height:72px; border-radius:14px; object-fit:cover; border:2px solid var(--ember); }
.ue-head > div{ flex:1; }
.ue-head .acc-row{ gap:8px; }
.ue-actions{ display:flex; justify-content:center; gap:18px; margin-top:18px; }
.us-row img{ width:40px; height:40px; border-radius:9px; object-fit:cover; }
.note-form{ text-align:left; }
.note-item{ border:1px solid var(--line); border-radius:10px; padding:12px 14px; background:var(--surface); text-align:left; }
.note-item .nt-head{ display:flex; align-items:center; gap:8px; }
.note-item .nt-head b{ flex:1; font-size:14.5px; }
.note-item .nt-body{ margin-top:6px; font-size:13.5px; color:var(--muted); white-space:pre-wrap; }
.note-item .nt-meta{ margin-top:6px; font-family:var(--font-m); font-size:10px; color:var(--muted); }
.note-sub{ margin:10px 0 0 22px; display:flex; flex-direction:column; gap:8px; }

/* ============ v11 — rehber/duyuru kaydırma ============ */
.carousel{ position:relative; padding:0 62px; }
.car-track{ position:relative; will-change:transform; }
.car-track.sliding-left{ animation:slideL .34s var(--ease); }
.car-track.sliding-right{ animation:slideR .34s var(--ease); }
@keyframes slideL{ from{ transform:translate3d(44px,0,0); opacity:.4; } to{ transform:translate3d(0,0,0); opacity:1; } }
@keyframes slideR{ from{ transform:translate3d(-44px,0,0); opacity:.4; } to{ transform:translate3d(0,0,0); opacity:1; } }
.car-nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:5;
  width:46px; height:46px; border-radius:11px;
  display:grid; place-items:center; font-size:24px; line-height:1;
  color:var(--ember); border:1px solid var(--ember);
  background:var(--surface);
  transition:.22s var(--ease);
}
.car-nav:hover{ background:var(--ember); color:#fff; box-shadow:var(--glow); transform:translateY(-50%) scale(1.06); }
.car-nav.prev{ left:0; }
.car-nav.next{ right:0; }
.car-nav[hidden]{ display:none; }
@media (max-width:760px){
  .carousel{ padding:0 52px; }
  .car-nav{ width:40px; height:40px; }
}

/* sürükle-sırala */
.mng-row{ cursor:default; }
.mng-row.draggable{ cursor:grab; }
.mng-row.draggable .drag-handle{ cursor:grab; color:var(--muted); padding-right:4px; font-size:18px; user-select:none; }
.mng-row.dragging{ opacity:.5; box-shadow:var(--glow); }
.mng-row.drag-over{ border-color:var(--ember); border-style:dashed; }


/* ============ RESPONSIVE TUTARLILIK — taşma & kırılma önleme ============ */
*, *::before, *::after{ min-width:0; }
img, svg, canvas, video{ max-width:100%; }
h1, h2, h3, .hero-title, .sec-head h2{ overflow-wrap:break-word; word-break:break-word; hyphens:auto; }
.sec-head h2{ font-size:clamp(28px, 5vw, 52px); line-height:1.05; }
.card-title{ overflow-wrap:break-word; }
.post h3, .event-info h3{ overflow-wrap:break-word; }
/* modallar dar ekranda taşmasın */
.modal{ max-width:calc(100vw - 28px); }
.manage-list, .reader-body{ overflow-wrap:break-word; }
.acc-row b, .link-row b{ overflow-wrap:anywhere; }
/* yatay taşmayı kesin engelle */
html, body{ overflow-x:hidden; max-width:100%; }
.section, .nav{ max-width:100vw; }
/* çok küçük ekranlarda istatistik/canlı tek sütun */
@media (max-width:620px){
  .live-strip{ grid-template-columns:1fr 1fr; }
  .stat-list li{ font-size:12.5px; }
  .stat-list li .val{ font-size:9.5px; padding:4px 8px; }
  .donut-wrap{ max-width:230px; }
}
@media (max-width:400px){
  .live-strip{ grid-template-columns:1fr; }
  .live-cell::before{ display:none; }
}

/* ============ v16 — hesap paneli, tema, puanlama, üyeler, footer ============ */

/* --- avatarın altına açılan hesap paneli --- */
.pop-backdrop{
  position:fixed; inset:0; z-index:80;
  background:transparent;
}
.pop-backdrop[hidden]{ display:none; }
.pop-panel{
  position:fixed; top:68px; right:22px;
  width:min(330px, calc(100vw - 28px));
  border-radius:var(--rad); padding:26px 22px 22px;
  background:var(--surface-2); text-align:center;
  max-height:min(78svh, 640px); overflow:auto;
  transform-origin:top right;
  animation:popDrop .28s var(--ease);
  box-shadow:0 30px 70px -22px rgba(0,0,0,.8), var(--glow);
  border:1px solid var(--glass-brd);
}
@keyframes popDrop{
  from{ opacity:0; transform:translateY(-14px) scale(.94); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}
.pop-panel::before{  /* avatara bakan küçük ok */
  content:""; position:absolute; top:-7px; right:26px;
  width:14px; height:14px; background:var(--surface-2);
  border-left:1px solid var(--glass-brd); border-top:1px solid var(--glass-brd);
  transform:rotate(45deg);
}
.pop-panel .modal-title{ font-size:20px; margin-bottom:16px; }
.nav-ava.active{ box-shadow:var(--glow); transform:translateY(-2px); }
@media (max-width:520px){
  .pop-panel{ right:14px; left:14px; width:auto; }
  .pop-panel::before{ right:18px; }
}

/* --- switch (aç/kapa) --- */
.switch{
  width:48px; height:26px; border-radius:99px; position:relative;
  border:1px solid var(--glass-brd); background:var(--surface);
  transition:.25s var(--ease); flex:0 0 auto;
}
.switch span{
  position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%;
  background:var(--muted); transition:.25s var(--ease);
}
.switch[aria-checked="true"]{ border-color:var(--ember); background:rgba(255,84,0,.18); }
.switch[aria-checked="true"] span{ left:25px; background:var(--ember); }

/* --- tema paneli --- */
.th-tabs{ display:flex; gap:8px; justify-content:center; }
.th-tab{
  font-family:var(--font-d); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  padding:9px 18px; border-radius:99px; border:1px solid var(--glass-brd); color:var(--muted);
  transition:.2s;
}
.th-tab.active{ border-color:var(--ember); color:var(--ember); box-shadow:var(--glow); }
.th-colors{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.th-color{
  display:flex; align-items:center; gap:10px; padding:8px 10px;
  border:1px solid var(--line); border-radius:10px; background:var(--surface);
}
.th-color label{ flex:1; font-family:var(--font-m); font-size:10.5px; color:var(--muted); text-align:left; }
.th-color input[type="color"]{
  width:34px; height:30px; border:none; background:none; padding:0; cursor:pointer; flex:0 0 auto;
}
.th-color input[type="text"]{
  width:104px; padding:6px 8px; font-family:var(--font-m); font-size:11px;
  background:var(--coal-2); border:1px solid var(--glass-brd); border-radius:7px; color:var(--text);
}
html[data-theme="light"] .th-color input[type="text"]{ background:#fff; }
@media (max-width:620px){ .th-colors{ grid-template-columns:1fr; } }

.th-preview{
  border:1px solid var(--line); border-radius:12px; padding:18px; text-align:left;
  background:var(--thp-bg, var(--surface)); color:var(--thp-text, var(--text));
}
.thp-bar{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.thp-bar b{ font-family:var(--thp-fd, var(--font-d)); font-size:20px; color:var(--thp-ember, var(--ember)); letter-spacing:.04em; }
.thp-bar span{ font-family:var(--thp-fm, var(--font-m)); font-size:10px; letter-spacing:.22em; color:var(--thp-muted, var(--muted)); }
.th-preview h4{ font-family:var(--thp-fd, var(--font-d)); font-size:22px; text-transform:uppercase; margin-bottom:6px; }
.th-preview p{ font-family:var(--thp-fb, var(--font-b)); font-size:13.5px; color:var(--thp-muted, var(--muted)); }
.thp-row{ display:flex; gap:10px; align-items:center; margin-top:12px; }
.thp-btn{
  font-family:var(--thp-fd, var(--font-d)); font-size:11px; letter-spacing:.1em;
  padding:8px 16px; border-radius:8px; background:var(--thp-ember, var(--ember)); color:#fff;
}
.thp-tag{
  font-family:var(--thp-fm, var(--font-m)); font-size:10px; letter-spacing:.14em;
  padding:6px 12px; border-radius:99px; border:1px solid var(--thp-ember, var(--ember));
  color:var(--thp-ember, var(--ember));
}

/* --- puanlama --- */
.rate-box{ margin-top:18px; border-top:1px solid var(--line); padding-top:14px; }
.rate-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.rate-slider{ display:flex; align-items:center; gap:12px; }
.rate-slider input[type="range"]{
  flex:1; -webkit-appearance:none; appearance:none; height:6px; border-radius:99px;
  background:linear-gradient(90deg, var(--ember) var(--fill,50%), var(--line) var(--fill,50%));
  outline:none; cursor:pointer;
}
.rate-slider input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none; width:20px; height:20px; border-radius:50%;
  background:var(--ember); border:2px solid var(--bg); box-shadow:var(--glow); cursor:grab;
}
.rate-slider input[type="range"]::-moz-range-thumb{
  width:18px; height:18px; border-radius:50%; background:var(--ember);
  border:2px solid var(--bg); box-shadow:var(--glow); cursor:grab;
}
.rate-val{
  min-width:34px; text-align:center; font-size:15px; font-weight:700; color:var(--ember);
}
.rate-ticks{
  display:flex; justify-content:space-between; margin:4px 2px 12px;
  font-family:var(--font-m); font-size:10px; color:var(--muted);
}
.rate-box.locked .rate-slider input, .rate-box.locked #rdRateSubmit{ opacity:.5; pointer-events:none; }
/* yönetim listelerinde ortalama puan rozeti */
.avg-badge{
  font-family:var(--font-m); font-size:10px; letter-spacing:.06em; white-space:nowrap;
  padding:5px 10px; border-radius:99px; border:1px solid var(--amber); color:var(--amber);
}

/* --- üye kartları: satırda 5 --- */
.grid-5{ grid-template-columns:repeat(5,1fr); gap:16px; }
.grid-5 .member{ padding:18px 14px; }
.grid-5 .member-ava{ width:64px; height:64px; margin-bottom:12px; font-size:22px; }
.grid-5 .member-ava-img{ width:64px; height:64px; }
.grid-5 .member h3{ font-size:14.5px; word-break:break-word; }
.grid-5 .member .role{ font-size:9px; letter-spacing:.16em; margin:3px 0 10px; }
.grid-5 .member .badge{ font-size:9.5px; padding:4px 8px; }
@media (max-width:1180px){ .grid-5{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:940px){  .grid-5{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:680px){  .grid-5{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:400px){  .grid-5{ grid-template-columns:1fr; } }

/* --- footer sosyal --- */
.social-links{ display:flex; justify-content:center; gap:12px; margin:16px 0 14px; }
.social-sq.sm{ width:44px; height:44px; border-radius:11px; }
.social-sq.sm svg{ width:20px; height:20px; fill:currentColor; color:var(--muted); transition:color .25s; }
.social-sq.sm:hover svg{ color:var(--ember); }

/* ============ v17 — arama, takip, panel konumu ============ */

/* --- arama --- */
.search-wrap{ position:relative; display:flex; align-items:center; }
.search-btn{ position:relative; z-index:2; }
.search-btn svg{ fill:none; stroke:var(--ember); stroke-width:2; stroke-linecap:round; }
.search-input{
  width:0; opacity:0; pointer-events:none;
  padding:0; margin-left:0;
  height:38px; border-radius:10px;
  border:1px solid var(--glass-brd); background:var(--surface);
  color:var(--text); font:inherit; font-size:13.5px;
  transition:width .38s var(--ease), opacity .28s var(--ease), padding .38s var(--ease), margin .38s var(--ease);
}
.search-wrap.open .search-input{
  width:min(260px, 42vw); opacity:1; pointer-events:auto;
  padding:0 14px; margin-left:8px;
}
.search-wrap.open .search-input:focus{ outline:none; border-color:var(--ember); box-shadow:0 0 0 3px rgba(255,84,0,.16); }
.search-results{
  position:absolute; top:calc(100% + 10px); right:0;
  width:min(360px, 78vw); max-height:min(60svh, 420px); overflow:auto;
  background:var(--surface-2); border:1px solid var(--glass-brd);
  border-radius:var(--rad); padding:8px; z-index:70;
  box-shadow:0 26px 60px -22px rgba(0,0,0,.8), var(--glow);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  animation:popDrop .24s var(--ease);
}
.search-results[hidden]{ display:none; }
.sr-item{
  display:flex; align-items:center; gap:10px; width:100%;
  padding:10px 12px; border-radius:10px; text-align:left;
  transition:background .2s;
}
.sr-item:hover{ background:var(--surface); }
.sr-item .sr-kind{
  font-family:var(--font-m); font-size:9px; letter-spacing:.14em; text-transform:uppercase;
  padding:4px 8px; border-radius:99px; border:1px solid var(--ember); color:var(--ember); flex:0 0 auto;
}
.sr-item .sr-txt{ flex:1; min-width:0; }
.sr-item .sr-txt b{ display:block; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sr-item .sr-txt span{ font-size:11.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
.sr-empty{ padding:16px; text-align:center; color:var(--muted); font-size:13px; }
@media (max-width:1024px){
  .search-wrap.open .search-input{ width:min(200px, 40vw); }
}


/* --- hesap paneli: JS ile konumlanır --- */
.pop-panel::before{ left:var(--arrow-x, auto); right:auto; }

/* --- takip --- */
.follow-stats{ display:flex; gap:12px; justify-content:center; margin-top:16px; }
.fstat{
  flex:1; padding:12px 8px; border-radius:12px;
  border:1px solid var(--glass-brd); background:var(--surface);
  transition:.22s var(--ease);
}
.fstat:hover{ border-color:var(--ember); box-shadow:var(--glow); transform:translateY(-2px); }
.fstat b{ display:block; font-family:var(--font-d); font-size:22px; color:var(--ember); }
.fstat span{ font-family:var(--font-m); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.follow-btn{
  display:block; width:100%; margin-top:12px;
  font-family:var(--font-d); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  padding:8px 12px; border-radius:99px;
  border:1px solid var(--ember); color:var(--ember); background:transparent;
  transition:.22s var(--ease);
}
.follow-btn:hover{ background:var(--ember); color:#fff; box-shadow:var(--glow); }
.follow-btn.on{ border-color:var(--muted); color:var(--muted); }
.follow-btn.on:hover{ border-color:#C24242; background:#C24242; color:#fff; box-shadow:0 0 22px -6px #C24242; }
.follow-btn:disabled{ opacity:.5; pointer-events:none; }
.fl-row{ display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.fl-row img{ width:38px; height:38px; border-radius:9px; object-fit:cover; }
.fl-row b{ flex:1; font-size:14px; text-align:left; word-break:break-word; }


/* ============ v18 — arama açılınca menü kısalması + mobil arama çubuğu ============ */
.nav-links a{ display:inline-flex; align-items:center; white-space:nowrap; }
.nav-links a .lk-full{
  display:inline-block; max-width:220px; overflow:hidden; white-space:nowrap;
  transition:max-width .34s var(--ease), opacity .22s var(--ease);
}
.nav-links a .lk-abbr{
  display:inline-block; max-width:0; overflow:hidden; opacity:0;
  transition:max-width .34s var(--ease), opacity .22s var(--ease) .1s;
}
.nav.searching .nav-links{ gap:14px; transition:gap .34s var(--ease); }
.nav.searching .nav-links a .lk-full{ max-width:0; opacity:0; }
.nav.searching .nav-links a .lk-abbr{ max-width:2ch; opacity:1; }
.nav-links{ transition:gap .34s var(--ease); }

/* mobil / dar ekran: arama nav'ın altında tam genişlik açılır (butonlar kaymaz).
   Sayaç afişiyle üst üste binebildiği için burada arka plan TAM OPAK olur —
   çakışsa bile yazılar net okunur. */
.search-wrap.bar-mode.open .search-input{
  position:fixed; left:14px; right:14px; width:auto; margin:0;
  top:var(--nav-bottom, 70px); z-index:82;
  /* renk katmanı + opak zemin: tema rengini korur, arkasını göstermez */
  background:linear-gradient(var(--surface-2), var(--surface-2)), var(--bg);
  border-color:var(--ember);
  backdrop-filter:none; -webkit-backdrop-filter:none;
  box-shadow:0 20px 46px -14px rgba(0,0,0,.92), var(--glow);
}
.search-wrap.bar-mode .search-results{
  position:fixed; left:14px; right:14px; width:auto;
  top:calc(var(--nav-bottom, 70px) + 48px); z-index:82;
  background:linear-gradient(var(--surface-2), var(--surface-2)), var(--bg);
  backdrop-filter:none; -webkit-backdrop-filter:none;
  box-shadow:0 26px 60px -16px rgba(0,0,0,.92), var(--glow);
}
/* arama açıkken sayaç afişi geri planda kalsın (okunabilirlik) */
.cd-banner{ transition:filter .3s var(--ease); }
html.search-bar-open .cd-banner{ filter:saturate(.7) brightness(.5); }

/* ============ v19 — etkinlik sayacı ============ */
.cd-banner{
  /* Sayfa akışından çıkarıldı: hero'yu aşağı itmez, menünün altına oturur */
  position:fixed; top:var(--nav-bottom, 92px); left:50%; transform:translateX(-50%);
  z-index:39; margin:0; width:min(1180px, calc(100% - 28px));
  border-radius:var(--rad); overflow:hidden;
  border:1px solid var(--glass-brd);
  background:
    radial-gradient(120% 160% at 12% 0%, rgba(255,84,0,.24), transparent 60%),
    linear-gradient(135deg, var(--surface-2), var(--surface));
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:var(--shadow), var(--glow);
  animation:cdIn .7s var(--ease) both;
}
.cd-banner[hidden]{ display:none; }
@keyframes cdIn{
  from{ opacity:0; transform:translateX(-50%) translateY(-22px) scale(.985); }
  to{ opacity:1; transform:translateX(-50%); }
}
.cd-banner.closing{ animation:cdOut .35s var(--ease) forwards; }
@keyframes cdOut{ to{ opacity:0; transform:translateX(-50%) translateY(-16px) scale(.98); } }
/* üstte akan ışık şeridi */
.cd-banner::before{
  content:""; position:absolute; inset:0 0 auto 0; height:2px;
  background:linear-gradient(90deg, transparent, var(--ember), var(--amber), var(--ember), transparent);
  background-size:200% 100%;
  animation:cdSweep 3.2s linear infinite;
}
@keyframes cdSweep{ from{ background-position:200% 0; } to{ background-position:-200% 0; } }

.cd-inner{
  display:flex; align-items:center; gap:26px; flex-wrap:wrap;
  padding:20px 56px 20px 24px;
}
.cd-head{ flex:1 1 260px; min-width:0; }
.cd-tag{
  display:inline-block; font-size:9.5px; letter-spacing:.24em; color:var(--ember);
  border:1px solid var(--ember); border-radius:99px; padding:4px 10px; margin-bottom:8px;
}
.cd-head h3{
  font-family:var(--font-d); text-transform:uppercase; font-size:clamp(17px,2.2vw,24px);
  line-height:1.1; overflow-wrap:break-word;
}
.cd-head p{ margin-top:5px; font-size:13px; color:var(--muted); overflow-wrap:break-word; }

.cd-clock{ display:flex; align-items:flex-start; gap:6px; flex:0 0 auto; }
.cd-unit{ text-align:center; min-width:56px; }
.cd-unit b{
  display:block; font-family:var(--font-m); font-weight:700;
  font-size:clamp(24px,3vw,34px); line-height:1; color:var(--ember);
  text-shadow:0 0 22px rgba(255,84,0,.5);
  font-variant-numeric:tabular-nums;
}
.cd-unit span{
  display:block; margin-top:5px; font-family:var(--font-m);
  font-size:8.5px; letter-spacing:.18em; color:var(--muted);
}
.cd-sep{
  font-family:var(--font-m); font-size:clamp(20px,2.6vw,28px); color:var(--ember);
  opacity:.55; line-height:1; animation:cdBlink 1s steps(2, start) infinite;
}
@keyframes cdBlink{ 50%{ opacity:.15; } }

.cd-prizes{ display:flex; gap:8px; flex-wrap:wrap; flex:1 1 100%; margin-top:4px; }
.cd-prize{
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--font-m); font-size:10.5px;
  padding:6px 12px; border-radius:99px;
  border:1px solid var(--amber); color:var(--amber);
  background:rgba(255,179,92,.07);
}
.cd-prize b{ font-weight:700; color:var(--text); }
.cd-close{
  position:absolute; top:12px; right:12px; width:32px; height:32px;
  border-radius:9px; border:1px solid var(--glass-brd); color:var(--muted);
  transition:.25s; z-index:2;
}
.cd-close:hover{ background:var(--ember-hot); color:#fff; border-color:var(--ember-hot); }
.cd-banner.ended .cd-clock{ display:none; }
.cd-live{
  font-family:var(--font-d); font-size:15px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ember); padding:10px 18px; border:1px solid var(--ember); border-radius:99px;
  animation:cdPulse 1.6s var(--ease) infinite;
}
@keyframes cdPulse{ 50%{ box-shadow:0 0 26px -4px var(--ember); } }

@media (max-width:760px){
  .cd-banner{ max-height:64svh; overflow:auto; }
  .cd-inner{ padding:18px 46px 18px 18px; gap:16px; }
  .cd-unit{ min-width:46px; }
  .cd-clock{ width:100%; justify-content:space-between; }
  .cd-sep{ display:none; }
}

/* yönetim: tarih-saat satırı ve ödül alanları */
.cd-datetime{ display:flex; gap:12px; flex-wrap:wrap; }
.cd-prize-row{ display:flex; gap:8px; align-items:center; margin-top:8px; }
.cd-prize-row input{
  flex:1; padding:10px 12px; background:var(--surface);
  border:1px solid var(--glass-brd); border-radius:9px; color:var(--text); font:inherit; font-size:13.5px;
}
.cd-prize-row input:focus{ outline:none; border-color:var(--ember); }
.cd-prize-row .place{ flex:0 0 110px; }

/* ============ v21 — turnuva sistemi ============ */
.tour-backdrop{ padding:0; }
.tour-panel{
  position:relative; width:min(1180px, calc(100% - 28px)); max-height:92svh; overflow:auto;
  border-radius:var(--rad); padding:30px 30px 24px;
  background:
    radial-gradient(120% 150% at 8% 0%, rgba(255,84,0,.18), transparent 58%),
    linear-gradient(150deg, var(--surface-2), var(--surface));
  border:1px solid var(--glass-brd);
  animation:tourIn .45s var(--ease);
  box-shadow:var(--shadow);
}
@keyframes tourIn{
  from{ opacity:0; transform:translateY(26px) scale(.97); }
  to{ opacity:1; transform:none; }
}
/* nefes alan ışıklı kenar */
.tour-panel::after{
  content:""; position:absolute; inset:-1px; border-radius:var(--rad); pointer-events:none;
  border:1px solid transparent;
  background:linear-gradient(120deg, var(--ember), var(--amber), var(--ember)) border-box;
  -webkit-mask:linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:tourBreath 3.4s var(--ease) infinite;
}
@keyframes tourBreath{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }

.tour-grid{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,.72fr);
  gap:26px; align-items:start;
}
.tour-cover{
  aspect-ratio:16/10; border-radius:14px; overflow:hidden;
  border:1px solid var(--line); background:var(--surface) center/cover no-repeat;
  display:grid; place-items:center;
}
.tour-cover span{
  font-family:var(--font-m); font-size:10px; letter-spacing:.22em; color:var(--muted);
}
.tour-cover.has-img span{ display:none; }
.tour-desc h3{
  font-family:var(--font-d); text-transform:uppercase; font-size:clamp(20px,2.4vw,30px);
  line-height:1.08; margin:8px 0 6px; overflow-wrap:break-word;
}
.tour-desc .mono{ font-size:11px; color:var(--muted); }
.tour-desc p:last-child{ margin-top:10px; font-size:14px; color:var(--muted); line-height:1.7; }

.tour-side{ display:flex; flex-direction:column; }
.role-row{ display:flex; gap:10px; margin-bottom:10px; }
.role-btn{
  flex:1; aspect-ratio:1; border-radius:12px; display:grid; place-items:center; gap:4px;
  border:1px solid var(--glass-brd); color:var(--muted); transition:.22s var(--ease);
}
.role-btn svg{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.role-btn span{ font-family:var(--font-m); font-size:8px; letter-spacing:.1em; }
.role-btn:hover{ border-color:var(--ember); color:var(--ember); transform:translateY(-2px); }
.role-btn.sel{ border-color:var(--ember); color:var(--ember); box-shadow:var(--glow); background:rgba(255,84,0,.1); }
.role-btn.locked{ opacity:.42; }
.role-btn.locked:hover{ border-color:#C24242; color:#FF7A7A; transform:none; }

.tour-tabs{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:26px; }
.tour-tab{
  padding:13px 10px; border-radius:11px; border:1px solid var(--glass-brd);
  font-family:var(--font-d); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text); transition:.22s var(--ease);
}
.tour-tab:hover{ border-color:var(--ember); color:var(--ember); box-shadow:var(--glow); transform:translateY(-2px); }

@media (max-width:1000px){
  .tour-grid{ grid-template-columns:1fr 1fr; }
  .tour-side{ grid-column:1 / -1; }
}
@media (max-width:680px){
  .tour-panel{ padding:24px 18px 20px; }
  .tour-grid{ grid-template-columns:1fr; gap:18px; }
  .tour-tabs{ grid-template-columns:1fr 1fr; gap:10px; }
}

/* ---- takım kartları ---- */
.tour-wide{ width:min(1180px, calc(100% - 28px)); }
.teams-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(310px, 1fr));
  gap:18px; max-height:66svh; overflow:auto; padding:2px;
}
.team-card{
  border:1px solid var(--line); border-radius:14px; padding:16px;
  background:var(--surface); transition:.25s var(--ease);
}
.team-card.mine{ border-color:var(--ember); box-shadow:var(--glow); }
.team-head{
  display:flex; align-items:center; gap:10px; padding:9px 12px; margin-bottom:14px;
  border:1px solid var(--line); border-radius:9px; background:var(--surface-2);
}
.team-head b{ flex:1; font-family:var(--font-d); font-size:15px; text-transform:uppercase; overflow-wrap:anywhere; }
.team-head .t-tag{
  font-family:var(--font-m); font-size:10px; letter-spacing:.1em;
  padding:4px 9px; border-radius:99px; border:1px solid var(--ember); color:var(--ember);
}
.slot-row{ display:flex; justify-content:center; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.slot{
  position:relative; width:52px; text-align:center;
}
.slot .ring{
  width:44px; height:44px; margin:0 auto; border-radius:50%;
  border:2px dashed var(--line); display:grid; place-items:center;
  color:var(--muted); font-size:19px; transition:.22s var(--ease);
  overflow:hidden; background:var(--surface-2);
}
.slot.filled .ring{ border-style:solid; border-color:var(--glass-brd); }
.slot .ring img{ width:100%; height:100%; object-fit:cover; }
.slot.captain .ring{ width:56px; height:56px; border-color:var(--ember); border-style:solid; }
.slot.captain{ width:64px; }
.slot .lbl{
  display:block; margin-top:5px; font-family:var(--font-m); font-size:8px;
  letter-spacing:.08em; color:var(--muted);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.slot.empty .ring{ cursor:pointer; }
.slot.empty .ring:hover{ border-color:var(--ember); color:var(--ember); box-shadow:var(--glow); transform:scale(1.06); }
.slot.applied .ring{ border-color:var(--amber); color:var(--amber); border-style:solid; }
.team-actions{ display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }

/* ---- ekibim: başvurular ---- */
.app-row{
  display:flex; align-items:center; gap:12px; padding:11px 13px; margin-top:9px;
  border:1px solid var(--line); border-radius:10px; background:var(--surface);
  cursor:pointer; transition:.2s;
}
.app-row:hover{ border-color:var(--ember); }
.app-row img{ width:38px; height:38px; border-radius:9px; object-fit:cover; }
.app-row .ai{ flex:1; min-width:0; text-align:left; }
.app-row .ai b{ display:block; font-size:14px; }
.app-row .ai span{ font-family:var(--font-m); font-size:10px; color:var(--muted); }
.app-detail{ text-align:left; }
.app-detail .acc-row{ gap:10px; }
.app-detail a{ color:var(--ember); word-break:break-all; }
.sq-btn.on-role{ border-color:var(--ember); box-shadow:var(--glow); }
.sq-btn.on-role svg{ stroke:var(--ember); }

/* ============ v22 — davet, sayaç, kaydırma düzeltmeleri ============ */
/* turnuva panelinde gereksiz kaydırma çubukları oluşmasın */
.tour-panel{ overflow-x:hidden; overscroll-behavior:contain; scrollbar-gutter:stable; }
.tour-panel::-webkit-scrollbar{ width:8px; }
.tour-panel::-webkit-scrollbar-track{ background:transparent; }
.tour-panel::-webkit-scrollbar-thumb{ background:var(--glass-brd); border-radius:99px; }
.tour-panel::-webkit-scrollbar-thumb:hover{ background:var(--ember); }
.tour-grid, .tour-tabs{ max-width:100%; }
.tour-desc, .tour-side{ min-width:0; }

/* davet penceresi */
.inv-head{
  padding:14px; border:1px solid var(--line); border-radius:12px;
  background:var(--surface); text-align:left;
}
.inv-row{ display:flex; align-items:center; gap:14px; }
.inv-head img{
  width:56px; height:56px; border-radius:12px; object-fit:cover;
  border:2px solid var(--ember); flex:0 0 auto;
}
.inv-head .ih{ flex:1 1 auto; min-width:0; }
.inv-head .ih > b{
  display:block; font-family:var(--font-d); font-size:16px; text-transform:uppercase;
  overflow-wrap:break-word; margin-bottom:3px;
}
.inv-head .ih span{
  display:block; font-size:12.5px; color:var(--muted); line-height:1.55;
  overflow-wrap:break-word;
}
.inv-head .ih span b{ color:var(--text); font-weight:600; }
.inv-cover{
  display:block; width:100%; aspect-ratio:16/6; border-radius:12px; margin-bottom:14px;
  background:var(--surface) center/cover no-repeat; border:1px solid var(--line);
}
#inviteModal .modal{ max-height:92svh; overflow:auto; }
#invTeamCard .team-card{ max-width:420px; margin:0 auto; }
.slot.picked .ring{ border-color:var(--ember); border-style:solid; color:var(--ember); box-shadow:var(--glow); }

/* davet bağlantısı kutusu */
.inv-link{
  display:flex; gap:8px; align-items:center; margin-top:14px;
  padding:10px 12px; border:1px solid var(--ember); border-radius:11px; background:var(--surface);
}
.inv-link input{
  flex:1; min-width:0; background:transparent; border:none; color:var(--text);
  font-family:var(--font-m); font-size:11.5px; outline:none;
}
.inv-link .btn{ flex:0 0 auto; }


/* ============ v23 — kritik düzeltmeler ============ */
/* .btn gibi display tanımlayan sınıflar tarayıcının [hidden] kuralını eziyordu;
   bu yüzden gizli olması gereken butonlar görünüyordu. */
[hidden]{ display:none !important; }

/* site metni düzenleme (v24'te yenilendi) */
.st-group{ border:1px solid var(--line); border-radius:11px; padding:14px; margin-top:12px; text-align:left; }
.st-group > b{ display:block; font-family:var(--font-d); font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ember); margin-bottom:8px; }
.st-icons{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
.st-ic{
  width:44px; height:44px; border-radius:10px; display:grid; place-items:center;
  border:1px solid var(--glass-brd); transition:.2s;
}
.st-ic svg{ width:20px; height:20px; fill:none; stroke:var(--muted); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.st-ic.sel{ border-color:var(--ember); box-shadow:var(--glow); }
.st-ic.sel svg{ stroke:var(--ember); }
.st-ic:hover svg{ stroke:var(--ember); }

/* tema: logo seçimi */
.th-logos{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.th-logo{ border:1px solid var(--line); border-radius:11px; padding:12px; text-align:left; }
.logo-prev{
  height:56px; border-radius:8px; border:1px solid var(--line);
  background:var(--surface) center/contain no-repeat;
}
@media (max-width:620px){ .th-logos{ grid-template-columns:1fr; } }


/* ============ v24 — metin düzenleme, logo, görsel düzeltmeleri ============ */
/* metin düzenleme kalemi: diğer kalemlerden ayrılsın */
.st-btn svg{ stroke-width:2.1; }
.sec-head .st-btn{ margin-left:auto; }

/* giriş bölümü: kalem, üst küçük yazı hizasında ve içerik sağ kenarında */
.hero{ position:relative; }
.hero > .st-btn{
  position:absolute; z-index:6; width:38px; height:38px;
  top:var(--hero-pen-top, 42%);
  right:max(24px, calc((100% - 1180px) / 2));
}
@media (max-width:900px){ .hero > .st-btn{ right:16px; } }

/* kapanış bölümü: kutunun DIŞINDA, çerçeveye girmesin */
.final-cta{ position:relative; }
.final-cta .st-btn{
  position:absolute; top:0; right:0; z-index:5;
  width:38px; height:38px;
}
.cta-buttons{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:22px; }

/* düzenleyici satırları */
.st-group{ border:1px solid var(--line); border-radius:11px; padding:14px; margin-top:12px; text-align:left; }
.st-grow{ display:flex; align-items:center; gap:12px; }
.st-grow > b{
  flex:1; font-family:var(--font-d); font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ember);
}
.st-row{ display:flex; gap:8px; align-items:center; margin-top:8px; }
.st-row-col{ flex-direction:column; align-items:stretch; padding:10px; border:1px solid var(--line); border-radius:9px; }
.st-row input{
  flex:1; min-width:0; padding:10px 12px; background:var(--surface);
  border:1px solid var(--glass-brd); border-radius:9px; color:var(--text); font:inherit; font-size:13.5px;
}
.st-row input:focus{ outline:none; border-color:var(--ember); }
.st-row .link-btn{ pointer-events:auto; white-space:nowrap; }
.st-card{ border:1px solid var(--line); border-radius:10px; padding:12px; margin-top:10px; }
.st-card .f-area{ margin-top:8px; min-height:60px; }
.st-icons{ display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
.st-ic{ width:40px; height:40px; border-radius:9px; display:grid; place-items:center;
  border:1px solid var(--glass-brd); transition:.2s; }
.st-ic svg{ width:19px; height:19px; fill:none; stroke:var(--muted); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.st-ic.sel{ border-color:var(--ember); box-shadow:var(--glow); }
.st-ic.sel svg, .st-ic:hover svg{ stroke:var(--ember); }

/* turnuva/davet görseli: KIRPILMASIN — tamamı görünsün */
.tour-cover{ background-size:contain !important; background-color:var(--surface); }
.inv-cover{ background-size:contain !important; background-color:var(--surface); aspect-ratio:16/7; }

/* logo önizlemesi: şeffaflık görünsün (satranç zemin) */
.logo-prev{
  background-color:transparent;
  background-image:
    linear-gradient(45deg, rgba(255,255,255,.07) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(255,255,255,.07) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, rgba(255,255,255,.07) 75%),
    linear-gradient(-45deg, transparent 75%, rgba(255,255,255,.07) 75%);
  background-size:14px 14px;
  background-position:0 0, 0 7px, 7px -7px, -7px 0;
}
.logo-prev .lp-img{
  width:100%; height:100%; object-fit:contain; display:block;
}
.th-size{ display:flex; align-items:center; gap:8px; margin-top:8px; }
.th-size input[type="range"]{ flex:1; accent-color:var(--ember); }
.th-size .val{ font-family:var(--font-m); font-size:11px; color:var(--ember); min-width:44px; text-align:right; }


/* ============ v25 — başlık sıralama & satır kontrolü ============ */
.st-row.st-title-row{ cursor:default; }
.st-row .st-drag{
  flex:0 0 auto; cursor:grab; color:var(--muted); font-size:17px;
  padding:0 4px; user-select:none;
}
.st-row.dragging{ opacity:.45; }
.st-row.drag-over{ outline:1px dashed var(--ember); outline-offset:2px; }
.st-row .link-btn.nl{ border-color:var(--amber); color:var(--amber); }
.st-hint{
  font-family:var(--font-m); font-size:10.5px; color:var(--muted);
  margin-top:6px; line-height:1.5;
}
.st-line{
  flex:0 0 auto; padding:8px 10px; border-radius:9px;
  background:var(--surface); border:1px solid var(--glass-brd);
  color:var(--text); font-family:var(--font-m); font-size:11px; cursor:pointer;
}
.st-line:focus{ outline:none; border-color:var(--ember); }
.st-line option{ background:var(--coal-2); color:var(--paper); }


/* menü logosu: önbellekten gelen boyut ilk karede uygulanır */
.nav-logo img{ height:var(--logo-nav-h, 34px); }

/* ============ v27 — yönetici takım inceleme ============ */
.eye-btn{ border-color:var(--amber); color:var(--amber); }
.eye-btn:hover{ background:var(--amber); color:#1a1208; box-shadow:0 0 22px -6px var(--amber); }
.team-card .card-tools{ display:flex; gap:8px; justify-content:center; margin-top:12px; }
.ai-member{
  border:1px solid var(--line); border-radius:12px; padding:14px; margin-top:12px;
  background:var(--surface); text-align:left;
}
.ai-mhead{
  display:flex; align-items:center; gap:11px; cursor:pointer;
  padding:6px; border-radius:9px; transition:background .2s;
}
.ai-mhead:hover{ background:var(--surface-2); }
.ai-mhead img{ width:42px; height:42px; border-radius:10px; object-fit:cover; border:1px solid var(--glass-brd); }
.ai-mhead .mi{ flex:1; min-width:0; }
.ai-mhead .mi b{ display:block; font-size:14.5px; }
.ai-mhead .mi span{ font-family:var(--font-m); font-size:10px; letter-spacing:.1em; color:var(--ember); }
.ai-mhead .hint{ font-family:var(--font-m); font-size:9.5px; color:var(--muted); white-space:nowrap; }
.ai-field{
  display:flex; align-items:center; gap:10px; padding:8px 10px; margin-top:6px;
  border:1px solid var(--line); border-radius:8px; cursor:pointer; transition:.18s;
}
.ai-field:hover{ border-color:var(--ember); background:var(--surface-2); }
.ai-field .k{
  font-family:var(--font-m); font-size:10px; letter-spacing:.1em; color:var(--muted);
  flex:0 0 130px; text-transform:uppercase;
}
.ai-field .v{ flex:1; min-width:0; font-size:13.5px; overflow-wrap:anywhere; }
.ai-field .cp{ font-family:var(--font-m); font-size:9.5px; color:var(--ember); opacity:0; transition:.18s; }
.ai-field:hover .cp{ opacity:1; }
.ai-field.missing .v{ color:#FF7A7A; }

/* ============ v28 — menü daraltma & responsive tutarlılık ============ */
/* Menü içeriğe sığmıyorsa JS .is-collapsed ekler; hamburger stilleri
   hem dar ekranda hem de bu durumda geçerli olur. */
.nav.is-collapsed .nav-links{
  position:fixed; inset:72px 14px auto 14px; z-index:60;
  flex-direction:column; gap:6px; padding:18px; align-items:stretch;
  background:var(--bg);
  background-image:linear-gradient(180deg, var(--surface-2), var(--surface));
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  border:1px solid var(--glass-brd); border-radius:var(--rad);
  box-shadow:0 30px 70px -20px rgba(0,0,0,.85), var(--glow);
  transform:translateY(-16px); opacity:0; pointer-events:none;
  transition:.35s var(--ease); max-height:80svh; overflow:auto;
}
.nav.is-collapsed .nav-links.open{ transform:none; opacity:1; pointer-events:auto; }
.nav.is-collapsed .nav-links a{ padding:12px 8px; font-size:14px; }
.nav.is-collapsed .nav-burger{ display:flex; }
.nav.is-collapsed .nav-links a .lk-full{ max-width:none; opacity:1; }
.nav.is-collapsed .nav-links a .lk-abbr{ display:none; }

/* menü panelindeki ek butonlar (tema, çıkış, ayarlar, yönetici) */
.nav-extra{
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
  padding-bottom:12px; margin-bottom:6px; border-bottom:1px solid var(--line);
}
.nav-extra[hidden]{ display:none !important; }
.nav-extra .sq-btn, .nav-extra .theme-toggle{ width:42px; height:42px; }

/* özel imleç: dokunmatik ve dar ekranlarda kapalı */
@media (hover:none), (pointer:coarse), (max-width:900px){
  .cursor-dot, .cursor-ring{ display:none !important; }
}

/* kenar ağaçları görünümü bozmasın, ekrandan taşmasın */
.sakura-side{ max-width:22vw; overflow:hidden; pointer-events:none; }
.sakura-side img{ max-width:100%; height:auto; display:block; }

/* --- ölçek tutarlılığı --- */
@media (min-width:1900px){
  .section{ padding:110px 0; }
  .sec-head h2{ font-size:clamp(34px, 3.1vw, 60px); }
}
@media (max-width:1024px){
  .tour-wide, .modal-wide{ width:min(720px, calc(100% - 24px)); }
}
@media (max-width:760px){
  .section{ padding:66px 0; }
  .modal, .modal-narrow, .modal-wide, .tour-wide{
    width:calc(100% - 22px); padding:24px 16px 20px;
  }
  .modal-title{ font-size:20px; }
  .th-colors{ grid-template-columns:1fr; }
  .teams-grid{ grid-template-columns:1fr; }
  .cd-prizes{ gap:6px; }
  .cd-prize{ font-size:9.5px; padding:5px 9px; }
  .stat-list li{ padding:8px 10px; }
  .tour-tabs{ gap:8px; }
  .tour-tab{ padding:11px 6px; font-size:11px; }
  .role-btn span{ font-size:7.5px; }
}
@media (max-width:420px){
  .nav{ padding:7px 10px; gap:8px; }
  .nav-logo img{ height:min(var(--logo-nav-h, 30px), 30px); }
  .grid-5{ grid-template-columns:1fr; }
  .sec-head h2{ font-size:clamp(24px, 8vw, 34px); }
  .cd-unit{ min-width:40px; }
  .cd-unit b{ font-size:20px; }
  .modal-title{ font-size:18px; }
  .btn{ padding:12px 18px; font-size:12px; }
  .st-row{ flex-wrap:wrap; }
  .st-row input{ min-width:120px; }
}

/* imleç ilk fare hareketine kadar gizli (sol üstte takılı görünmesin) */
.cursor-dot, .cursor-ring{ opacity:0; transition:opacity .2s; }
html.has-cursor .cursor-dot, html.has-cursor .cursor-ring{ opacity:1; }

/* dokunma hedefleri: mobilde en az 32px */
@media (max-width:820px){
  .fav-mini{ min-width:32px; min-height:32px; }
  .adm-btn{ min-width:32px; min-height:32px; }
  .post-tools{ gap:10px; align-items:center; }
}

/* ============ v29 — sayaç görseli, düz kapak, bilgi tamamlama ============ */
.cd-cover{
  flex:0 0 auto; width:min(190px, 30%); aspect-ratio:16/10;
  border-radius:12px; border:1px solid var(--line);
  background:var(--surface) center/cover no-repeat;
}
.cd-cover[hidden]{ display:none; }
@media (max-width:760px){
  .cd-cover{ width:100%; aspect-ratio:16/6; }
}
/* düz (kesimsiz) etkinlik görseli */
.event-img.flat{ clip-path:none; border-radius:10px; }
.event-img.flat::after{
  background:linear-gradient(90deg, rgba(10,6,3,.55), transparent 34%, transparent 66%, rgba(10,6,3,.55));
}
/* tamamlama ve etkinlik yönetimi pencereleri turnuva ekranının ÜSTÜNDE açılır */
#completeModal{ z-index:94; }
#eventCfgModal{ z-index:93; }

/* ============ v31 — sayaç etkinlik butonu ============ */
/* alt şerit: solda ödüller, SAĞDA etkinliğe git butonu (saatin altında) */
.cd-bottom{
  flex:1 1 100%; display:flex; align-items:center; gap:14px;
  justify-content:space-between; margin-top:4px;
}
.cd-bottom .cd-prizes{ flex:1 1 auto; margin:0; }
.cd-actions{ flex:0 0 auto; display:flex; justify-content:flex-end; margin-left:auto; }
.cd-actions[hidden]{ display:none; }
.cd-actions .btn{ padding:11px 26px; font-size:12.5px; white-space:nowrap; }
@media (max-width:760px){
  .cd-bottom{ flex-direction:column; align-items:stretch; gap:10px; }
  .cd-actions .btn{ width:100%; justify-content:center; }
}

/* ============ v33 — yönetici takım yönetimi ============ */
.at-head{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:6px; padding-right:44px; }
.at-head .modal-title{ flex:1; min-width:0; }
.at-lock{
  display:flex; align-items:center; gap:9px; flex:0 0 auto;
  padding:7px 12px; border:1px solid var(--line); border-radius:99px; background:var(--surface);
}
.at-lock span{ font-family:var(--font-m); font-size:10.5px; letter-spacing:.12em; color:var(--muted); }
.at-lock .switch[aria-checked="true"] ~ span, .at-lock.on span{ color:var(--ember); }
.team-card.locked{ border-color:var(--amber); }
.team-card .card-tools .adm-btn.edit-t{ border-color:var(--ember); }
.slot .ring.adm-add{ cursor:pointer; border-color:var(--glass-brd); }
.slot .ring.adm-add:hover{ border-color:var(--ember); color:var(--ember); box-shadow:var(--glow); }
.slot .adm-x{
  position:absolute; top:-4px; right:2px; width:20px; height:20px; border-radius:6px;
  border:1px solid var(--line); background:var(--bg); color:var(--muted);
  font-size:11px; line-height:1; display:grid; place-items:center; opacity:0; transition:.18s;
}
.slot:hover .adm-x{ opacity:1; }
.slot .adm-x:hover{ background:#C24242; color:#fff; border-color:#C24242; }
.at-locked-note{
  display:flex; align-items:center; gap:8px; padding:10px 14px; margin-bottom:12px;
  border:1px solid var(--amber); border-radius:10px; background:rgba(255,179,92,.08);
  font-size:13px; color:var(--amber);
}

/* ============ v34 — bölüm ölçekleri ============ */
/* Her bölüm kendi ölçek değişkenlerini taşır; JS bunları ayarlar. */
.hero{ --s-title:1; --s-text:1; --s-btn:1; }
.section{ --s-title:1; --s-text:1; --s-card:1; --s-panel:1; }
.final-cta{ --s-title:1; --s-text:1; --s-btn:1; --s-box:1; }

.hero-title{ font-size:calc(clamp(38px, 7vw, 92px) * var(--s-title, 1)); }
.hero-desc{ font-size:calc(16px * var(--s-text, 1)); }
.hero .btn{ font-size:calc(14px * var(--s-btn, 1)); padding:calc(15px * var(--s-btn, 1)) calc(30px * var(--s-btn, 1)); }

.sec-head h2{ font-size:calc(clamp(28px, 3.4vw, 52px) * var(--s-title, 1)); }
.sec-head .eyebrow{ font-size:calc(10.5px * var(--s-text, 1)); }

.final-cta h2{ font-size:calc(clamp(26px, 3vw, 44px) * var(--s-title, 1)); }
.final-cta p{ font-size:calc(15px * var(--s-text, 1)); }
.final-cta .btn{ font-size:calc(14px * var(--s-btn, 1)); padding:calc(15px * var(--s-btn, 1)) calc(30px * var(--s-btn, 1)); }

/* kart ölçekleri: ızgara sütun genişliği ve iç yazılar */
#hakkinda .grid-3{ grid-template-columns:repeat(auto-fit, minmax(calc(260px * var(--s-card, 1)), 1fr)); }
#hakkinda .card{ padding:calc(26px * var(--s-card, 1)); }
#hakkinda .card h3{ font-size:calc(17px * var(--s-card, 1)); }
#hakkinda .card p{ font-size:calc(14px * var(--s-card, 1)); }
#hakkinda .card-ic{ width:calc(46px * var(--s-card, 1)); height:calc(46px * var(--s-card, 1)); }

/* duyuru & rehber kartları: sabit boyut (ayarlanabilir değil) */

/* etkinlik satırları */
#etkinlik .event{ padding:calc(20px * var(--s-card, 1)) calc(24px * var(--s-card, 1)); }
#etkinlik .event-info h3{ font-size:calc(17px * var(--s-card, 1)); }
#etkinlik .event-info p{ font-size:calc(13.5px * var(--s-card, 1)); }
#etkinlik .event-date .d{ font-size:calc(30px * var(--s-card, 1)); }
#etkinlik .event-img{ width:calc(260px * var(--s-card, 1)); }

/* üye kartları */
#uyeler .grid-5{ grid-template-columns:repeat(auto-fit, minmax(calc(200px * var(--s-card, 1)), 1fr)); }
#uyeler .member{ padding:calc(22px * var(--s-card, 1)); }
#uyeler .member h3{ font-size:calc(16px * var(--s-card, 1)); }
#uyeler .member-ava-img{ width:calc(84px * var(--s-card, 1)); height:calc(84px * var(--s-card, 1)); }

/* canlı panelleri — her pencere ayrı ölçeklenir (pencere + içerik) */
#canli .live-strip{
  padding:calc(22px * var(--p-strip, 1)) calc(18px * var(--p-strip, 1));
}
#canli .live-cell .big{ font-size:calc(clamp(26px, 3.4vw, 40px) * var(--c-strip, 1)); }
#canli .live-cell .lbl{ font-size:calc(10.5px * var(--c-strip, 1)); }

#canli [data-panel="rooms"]{ padding:calc(26px * var(--p-rooms, 1)); }
#canli [data-panel="rooms"] .card-title{ font-size:calc(15px * var(--c-rooms, 1)); }
#canli [data-panel="rooms"] .room-list{ font-size:calc(1rem * var(--c-rooms, 1)); gap:calc(12px * var(--c-rooms, 1)); }

#canli [data-panel="voice"]{ padding:calc(26px * var(--p-voice, 1)); }
#canli [data-panel="voice"] .card-title{ font-size:calc(15px * var(--c-voice, 1)); }
#canli [data-panel="voice"] .avatar-wall{ gap:calc(10px * var(--c-voice, 1)); }
#canli [data-panel="voice"] .avatar-wall img{
  width:calc(38px * var(--c-voice, 1)); height:calc(38px * var(--c-voice, 1));
}
#canli [data-panel="voice"] .hint{ font-size:calc(11.5px * var(--c-voice, 1)); }

/* istatistik panelleri: sabit boyut (ayarlanabilir değil) */

/* kapanış kutusu */
.final-cta .cta-box{ padding:calc(70px * var(--s-box, 1)) calc(30px * var(--s-box, 1)); }

[data-panel][hidden]{ display:none !important; }

/* düzenleyicide kaydıraçlar */
.st-scale{ display:flex; align-items:center; gap:10px; margin-top:9px; }
.st-scale label{ flex:0 0 130px; font-family:var(--font-m); font-size:10.5px;
  letter-spacing:.08em; color:var(--muted); text-transform:uppercase; }
.st-scale input[type="range"]{ flex:1; accent-color:var(--ember); }
.st-scale .val{ flex:0 0 46px; text-align:right; font-family:var(--font-m); font-size:11px; color:var(--ember); }
.st-toggle{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:9px 11px; margin-top:8px; border:1px solid var(--line); border-radius:9px; }
.st-toggle span{ font-size:13px; }
.mng-row.sec-off{ opacity:.55; }
.mng-row.sec-off .mng-info b{ text-decoration:line-through; }

/* dar ekranlarda kart ölçeği taşmaya yol açmasın */
@media (max-width:420px){
  #duyurular .car-track, #rehberler .car-track{ grid-template-columns:1fr; }
  #etkinlik .event-img{ width:min(calc(260px * var(--s-card, 1)), 45%); }
}
.post, .event, .member, .card{ max-width:100%; min-width:0; }
.car-track{ max-width:100%; }

/* sayaç: sayfanın en üstünde sabit (menüyle kaymaz) */
.cd-banner.cd-static{
  position:absolute; top:var(--nav-bottom, 92px);
}


/* ============ v38 — mobil sayaç + arama animasyonu ============ */
/* Sayaç açıkken giriş bölümü onun ALTINDAN başlasın.
   Dar ekranlarda ortalama yerine üstten hizalarız; yoksa sayaç başlığı örtüyor. */
@media (max-width:900px){
  html.has-countdown .hero{
    justify-content:flex-start;
    padding-top:calc(var(--nav-bottom, 92px) + var(--cd-space, 0px) + 22px);
    min-height:auto;
    padding-bottom:56px;
  }
}
@media (min-width:901px){
  html.has-countdown .hero{ padding-top:calc(var(--cd-space, 0px) * .5 + 24px); }
}

/* Arama açılıp kapanırken sağdaki butonlar zıplamasın:
   genişlik geçişi yerine sabit alan kullan. */
.nav-actions{ transition:none; }
.search-wrap{ display:flex; align-items:center; }
.search-wrap .search-input{
  transition:width .34s var(--ease), opacity .22s var(--ease), padding .34s var(--ease);
  will-change:width;
}
.nav-links a .lk-full{
  transition:max-width .34s var(--ease), opacity .2s var(--ease);
  will-change:max-width;
}
/* çubuk modunda kutu zaten sabit konumlu; hiçbir genişlik animasyonu yapma */
.search-wrap.bar-mode .search-input{ transition:opacity .2s var(--ease); }

/* ============ v39 — rozet yönetimi ============ */
.bdg-row{ display:flex; align-items:center; gap:10px; padding:10px 12px; margin-top:8px;
  border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.bdg-row .bdg-chip{ flex:1; min-width:0; }
.bdg-chip{
  display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:99px;
  border:1px solid var(--glass-brd); font-family:var(--font-m); font-size:11px;
  color:var(--text); background:var(--surface-2); max-width:100%;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.bdg-chip.gold{ border-color:var(--amber); color:var(--amber); background:rgba(255,179,92,.1); }
.bdg-pick{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.bdg-pick button{ cursor:pointer; transition:.2s; }
.bdg-pick button:hover{ border-color:var(--ember); color:var(--ember); transform:translateY(-2px); }
#ubOwned:empty::after, #ubTypes:empty::after{
  content:"— boş —"; font-family:var(--font-m); font-size:11px; color:var(--muted);
}

/* ============ v39 — liste sayfası ============ */
.lst-main{ padding-top:96px; }
.lst-tools{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:18px; }
.lst-search{
  flex:1 1 260px; display:flex; align-items:center; gap:9px; min-width:0;
  padding:11px 14px; border:1px solid var(--glass-brd); border-radius:11px; background:var(--surface);
}
.lst-search .ic{ width:17px; height:17px; fill:none; stroke:var(--muted); stroke-width:2; flex:0 0 auto; }
.lst-search input{
  flex:1; min-width:0; background:transparent; border:none; outline:none;
  color:var(--text); font:inherit; font-size:14px;
}
.lst-sort{ flex:0 0 auto; width:auto; min-width:150px; margin:0; }
.lst-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
  gap:20px; margin-top:6px;
}
.lst-card{
  display:flex; flex-direction:column; overflow:hidden; cursor:pointer;
  border-radius:var(--rad); border:1px solid var(--glass-brd);
  transition:.25s var(--ease);
}
.lst-card:hover{ transform:translateY(-4px); border-color:var(--ember); box-shadow:var(--glow); }
.lst-cover{
  height:150px; background:var(--surface-2) center/cover no-repeat; flex:0 0 auto;
  border-bottom:1px solid var(--line);
}
.lst-body{ padding:18px 20px 16px; display:flex; flex-direction:column; gap:8px; flex:1; }
.lst-body h3{
  font-family:var(--font-d); font-size:18px; text-transform:uppercase; line-height:1.2;
  overflow-wrap:anywhere;
}
.lst-body p{ font-size:13.5px; color:var(--muted); line-height:1.65; flex:1; overflow-wrap:anywhere; }
.lst-foot{
  display:flex; align-items:center; gap:10px; margin-top:auto; padding-top:10px;
  border-top:1px solid var(--line);
}
.lst-foot .mono{ flex:1; font-size:11px; color:var(--muted); }
.lst-admin{ display:flex; gap:7px; }
.foot-inner{ display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; }

/* bölüm başlıkları tıklanabilir */
.sec-head h2.linkable{ cursor:pointer; transition:color .2s; display:inline-block; }
.sec-head h2.linkable:hover{ color:var(--ember); }
.sec-head h2.linkable::after{
  content:"›"; margin-left:10px; opacity:0; transform:translateX(-6px);
  display:inline-block; transition:.24s var(--ease); color:var(--ember);
}
.sec-head h2.linkable:hover::after{ opacity:1; transform:none; }

@media (max-width:600px){
  .lst-main{ padding-top:84px; }
  .lst-grid{ grid-template-columns:1fr; }
  .lst-sort{ flex:1 1 100%; }
}

/* ============ v40 — liste sayfası tasarımı ============ */
.lst-main{ padding-top:0; padding-bottom:20px; }
.lst-main > .section{ padding-top:112px; padding-bottom:60px; }
.lst-hero{
  position:relative; overflow:hidden; border-radius:var(--rad);
  border:1px solid var(--glass-brd); padding:38px 34px 32px; margin-bottom:26px;
  background:
    radial-gradient(120% 160% at 8% 0%, rgba(255,84,0,.20), transparent 62%),
    linear-gradient(150deg, var(--surface-2), var(--surface));
  box-shadow:var(--shadow);
}
.lst-hero::before{
  content:""; position:absolute; inset:0 0 auto 0; height:2px;
  background:linear-gradient(90deg, transparent, var(--ember), var(--amber), var(--ember), transparent);
  background-size:200% 100%; animation:cdSweep 3.4s linear infinite;
}
.lst-hero .eyebrow{ margin-bottom:8px; }
#lstInfo{ margin:0 0 14px; font-family:var(--font-m); font-size:11px; }
.lst-hero h2{
  font-family:var(--font-d); text-transform:uppercase; line-height:1.06;
  font-size:clamp(28px, 4.2vw, 52px);
}
.lst-hero p{ margin-top:10px; color:var(--muted); font-size:14px; max-width:60ch; }

.lst-tools{
  display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:20px;
}
.lst-search{
  flex:1 1 260px; display:flex; align-items:center; gap:9px; min-width:0;
  padding:12px 15px; border:1px solid var(--glass-brd); border-radius:12px;
  background:var(--surface); transition:.22s var(--ease);
}
.lst-search:focus-within{ border-color:var(--ember); box-shadow:var(--glow); }
.lst-search .ic{ width:17px; height:17px; fill:none; stroke:var(--muted); stroke-width:2; flex:0 0 auto; }
.lst-search input{
  flex:1; min-width:0; background:transparent; border:none; outline:none;
  color:var(--text); font:inherit; font-size:14px;
}
.lst-sort{ flex:0 0 auto; width:auto; min-width:158px; margin:0; }

.lst-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(310px, 1fr)); gap:22px; }
.lst-card{
  position:relative; display:flex; flex-direction:column; overflow:hidden; cursor:pointer;
  border-radius:var(--rad); border:1px solid var(--glass-brd); transition:.28s var(--ease);
}
.lst-card:hover{ transform:translateY(-5px); border-color:var(--ember); box-shadow:var(--glow), var(--shadow); }
.lst-cover{
  height:158px; background:var(--surface-2) center/cover no-repeat; flex:0 0 auto;
  border-bottom:1px solid var(--line); position:relative;
}
.lst-cover::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 42%, rgba(10,6,3,.55));
}
.lst-cover-bos{ display:grid; place-items:center; }
.lst-cover-bos span{ font-size:10px; letter-spacing:.24em; color:var(--muted); position:relative; z-index:1; }
.lst-date{
  position:absolute; top:14px; left:14px; z-index:2; text-align:center;
  padding:8px 12px; border-radius:11px; background:rgba(10,6,3,.78);
  border:1px solid var(--ember); backdrop-filter:blur(8px);
}
.lst-date b{ display:block; font-family:var(--font-m); font-size:19px; color:var(--ember); line-height:1; }
.lst-date span{ display:block; font-family:var(--font-m); font-size:8.5px; letter-spacing:.14em; color:var(--muted); margin-top:3px; }
.lst-body{ padding:18px 20px 16px; display:flex; flex-direction:column; gap:9px; flex:1; }
.lst-body h3{
  font-family:var(--font-d); font-size:18px; text-transform:uppercase; line-height:1.2;
  overflow-wrap:anywhere;
}
.lst-body p{ font-size:13.5px; color:var(--muted); line-height:1.65; flex:1; overflow-wrap:anywhere; }
.lst-foot{
  display:flex; align-items:center; gap:8px; margin-top:auto; padding-top:12px;
  border-top:1px solid var(--line);
}
.lst-day{ flex:1; font-size:11px; color:var(--muted); }
.lst-rate{ display:flex; align-items:center; gap:3px; padding-top:8px; }
.rt-star{
  font-size:15px; line-height:1; color:var(--line); transition:.15s; padding:0 1px;
}
.rt-star:not([disabled]):hover{ color:var(--amber); transform:scale(1.18); }
.rt-star.on{ color:var(--amber); }
.rt-star.mine.on{ color:var(--ember); }
.rt-avg{ margin-left:8px; font-size:10.5px; color:var(--muted); }

.nav-links a.active{ color:var(--ember); }
.nav-links a.active::after{ width:100%; }

/* liste sayfası alt bilgi */
.lst-foot-bar{
  margin-top:44px; padding:26px 0 0; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap;
}
.lst-foot-bar .mono{ font-size:11px; color:var(--muted); }
.lst-foot-bar a{ color:var(--ember); font-family:var(--font-m); font-size:11px; }

@media (max-width:600px){
  .lst-main > .section{ padding-top:92px; padding-bottom:44px; }
  .lst-hero{ padding:26px 18px 22px; }
  .lst-grid{ grid-template-columns:1fr; }
  .lst-sort{ flex:1 1 100%; }
}

/* rozet pencereleri en üstte açılsın */
#badgeTypesModal{ z-index:95; }
#userBadgeModal{ z-index:96; }
#miscModal{ z-index:93; }
.bdg-row .bdg-info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; align-items:flex-start; }
.bdg-note{ font-family:var(--font-m); font-size:9px; letter-spacing:.1em; color:var(--muted); }
.bdg-row.auto{ border-color:var(--amber); background:rgba(255,179,92,.05); }

/* ============ v41 — menü ile içerik iç içe girmesin ============ */
/* Menü yüzen bir çubuk: üstündeki boşluktan içerik geçmesin diye
   sayfanın tepesine ince bir maske koyuyoruz. */
body::before{
  content:""; position:fixed; top:0; left:0; right:0; height:0;
  z-index:38; pointer-events:none;          /* menü (50) altında, içerik (1) üstünde */
  background:var(--bg);
  -webkit-mask-image:linear-gradient(180deg, #000 88%, transparent);
  mask-image:linear-gradient(180deg, #000 88%, transparent);
  transition:height .2s var(--ease);
}
/* menünün alt kenarına kadar kapat: altından geçen içerik görünmesin */
html.nav-scrolled body::before{ height:calc(var(--nav-bottom, 92px) + 14px); }

/* Sayfa kaydırılınca menü opaklaşır; altından geçen içerik görünmez. */
.nav.scrolled{
  background:var(--bg);
  background-image:linear-gradient(180deg, var(--surface-2), var(--surface));
  box-shadow:0 18px 44px -22px rgba(0,0,0,.9), var(--glow);
}
.nav.scrolled .nav-links a{ color:var(--text); }
.lst-main > .section{ position:relative; z-index:1; }

.lst-hidden{
  display:inline-block; margin-left:8px; padding:3px 9px; border-radius:99px;
  font-size:8.5px; letter-spacing:.12em; color:#FF9B6E;
  border:1px solid #C24242; background:rgba(194,66,66,.12);
}
.rt-mine{ margin-left:8px; font-size:10px; color:var(--ember); }
.rt-star[disabled]{ cursor:default; }

/* ============ v43 — mobil düzen sağlamlaştırma ============ */
/* Liste sayfası menüsü: dar ekranda "Ana Sayfa" butonu menüye taşınır */
.nav.is-collapsed .nav-home-btn{ display:none; }
.nav.is-collapsed .nav-links .nav-home-btn{
  display:inline-flex; width:100%; justify-content:center; margin-top:6px;
}
.nav-extra .nav-home-btn{ width:100%; justify-content:center; }

/* Dokunma hedefleri: mobilde en az 30px */
@media (max-width:820px){
  .rt-star{ min-width:30px; min-height:30px; display:inline-grid; place-items:center; font-size:17px; }
  .lst-rate{ gap:2px; flex-wrap:wrap; }
  .fav-mini, .adm-btn{ min-width:32px; min-height:32px; }
}

/* Menü öğeleri hiçbir koşulda dışarı taşmasın */
.nav-actions{ min-width:0; flex-wrap:nowrap; }
.nav-actions > *{ flex:0 0 auto; }
.nav-auth{ display:flex; align-items:center; gap:8px; min-width:0; }

/* Liste kartları: çok dar ekranda da düzgün */
@media (max-width:430px){
  .lst-grid{ grid-template-columns:1fr; gap:16px; }
  .lst-body{ padding:15px 15px 13px; }
  .lst-body h3{ font-size:16px; }
  .lst-hero h2{ font-size:clamp(22px, 7vw, 32px); }
  .lst-hero{ padding:22px 15px 18px; }
  .lst-foot{ flex-wrap:wrap; gap:6px; }
  .lst-day{ flex:1 1 100%; }
}

/* Çok dar ekranda menüdeki yardımcı butonlar gizlenir;
   hepsine avatar panelinden erişilebiliyor (çıkış, ayarlar, yönetici). */
@media (max-width:430px){
  .nav-auth > .sq-btn{ display:none; }
  .nav-auth #navAva{ display:inline-flex; }
  .nav{ padding:7px 9px; gap:7px; }
  .nav-actions{ gap:7px; }
}
@media (max-width:360px){
  .nav-logo img{ height:min(var(--logo-nav-h, 26px), 26px); }
  .search-wrap .sq-btn, .theme-toggle, .nav-burger{ width:32px; height:32px; }
  .nav-ava{ width:32px; height:32px; }
}

/* ============================================================
   v44 — MOBİLDE KAYDIRMALI (SWIPE) BÖLÜMLER
   Dokunmatikte tek kart görünür, yana kaydırarak gezilir.
   Fare tekerleği ve klavye de çalışır; masaüstü etkilenmez.
   ============================================================ */
@media (max-width:760px){
  .swipe-row{
    display:flex !important;
    grid-template-columns:none !important;
    gap:14px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    padding:2px 2px 14px;
    margin-inline:-4px;
    scrollbar-width:none;
  }
  .swipe-row::-webkit-scrollbar{ display:none; }
  /* Karusel sarmalayıcısı mobilde okları gizler, boşluğunu da bırakmaz */
  .carousel{ padding:0 !important; }
  .car-nav, .car-btn{ display:none !important; }

  /* Kart genişliği KAPSAYICIYA göre: tek kart tam sığar, yarım kalmaz */
  .swipe-row > *:not(.swipe-dots){
    flex:0 0 100% !important;
    width:100% !important;
    max-width:100% !important;
    scroll-snap-align:center;
    min-width:0;
  }
  /* öne çıkan üyeler: ekranda 2 kart yan yana */
  #uyeler .swipe-row > *:not(.swipe-dots){
    flex:0 0 calc(50% - 7px) !important;
    width:calc(50% - 7px) !important;
    max-width:calc(50% - 7px) !important;
  }
  /* kenar boşluğu kaydırmayı bozmasın */
  .swipe-row{ margin-inline:0 !important; padding-inline:0 !important; }

  /* kaydırma ipucu noktaları */
  .swipe-dots{
    display:flex; justify-content:center; gap:6px; margin-top:2px;
  }
  .swipe-dots i{
    width:6px; height:6px; border-radius:50%; background:var(--line);
    transition:.25s var(--ease);
  }
  .swipe-dots i.on{ background:var(--ember); width:18px; border-radius:99px; }
  .swipe-hint{
    display:block; text-align:center; margin-top:6px;
    font-family:var(--font-m); font-size:9.5px; letter-spacing:.14em; color:var(--muted);
  }
  /* mobilde okla gezinme butonları gizli (parmakla kaydırılıyor) */
  .car-btn{ display:none !important; }
}
@media (min-width:761px){
  .swipe-dots, .swipe-hint{ display:none; }
}

/* mobilde canlı ve istatistik panelleri de kaydırmalı */
@media (max-width:760px){
  #canli .live-grid.swipe-row > *, #istatistik .stat-grid.swipe-row > *{
    flex:0 0 90%; max-width:90%;
  }
  #canli .live-strip{ margin-bottom:14px; }
}

/* Aşağı kaydır göstergesi, üstündeki "çevrimiçi" rozetiyle çakışmasın */
@media (max-width:760px){
  .hero{ padding-bottom:108px; }
  .scroll-hint{ bottom:22px; }
  .hero-live{ margin-bottom:26px; }
}
@media (max-width:420px){
  .hero{ padding-bottom:100px; }
  .scroll-hint{ bottom:18px; }
}

/* mobilde pencere kapatma butonu içerikle çakışmasın */
@media (max-width:760px){
  .modal-x{
    top:8px; right:8px; width:34px; height:34px; z-index:6;
    background:rgba(10,6,3,.82); border:1px solid var(--glass-brd);
    backdrop-filter:blur(8px); border-radius:10px;
  }
  .modal, .tour-panel{ padding-top:52px !important; }
  .tour-panel .tour-cover{ margin-top:2px; }
  .modal-title{ padding-right:6px; }
}

/* ============ v45 — profil çerçeveleri ============ */
.frame-ring{
  position:relative; display:inline-grid; place-items:center;
  border-radius:50%; padding:var(--fr-w, 3px);
  background:var(--fr-bg, var(--ember));
}
.frame-ring img{
  display:block; width:100%; height:100%; border-radius:50%;
  object-fit:cover; background:var(--bg);
}
/* desenler */
.frame-ring[data-pattern="gradient"]{ background:linear-gradient(135deg, var(--fr-c1), var(--fr-c2)); }
.frame-ring[data-pattern="solid"]{ background:var(--fr-c1); }
.frame-ring[data-pattern="dashed"],
.frame-ring[data-pattern="dotted"],
.frame-ring[data-pattern="double"],
.frame-ring[data-pattern="ridge"]{
  background:transparent; padding:0;
  border:var(--fr-w, 3px) var(--fr-style, solid) var(--fr-c1);
}
.frame-ring[data-pattern="dashed"]{ --fr-style:dashed; }
.frame-ring[data-pattern="dotted"]{ --fr-style:dotted; }
.frame-ring[data-pattern="double"]{ --fr-style:double; border-width:calc(var(--fr-w,3px) + 2px); }
.frame-ring[data-pattern="ridge"]{ --fr-style:ridge; }

/* dokular */
.frame-ring[data-texture="metal"]{
  background-image:linear-gradient(135deg, var(--fr-c1), #fff6, var(--fr-c2), #0004, var(--fr-c1));
}
.frame-ring[data-texture="glass"]{
  background-image:linear-gradient(135deg, color-mix(in srgb, var(--fr-c1) 70%, transparent), color-mix(in srgb, var(--fr-c2) 40%, transparent));
  backdrop-filter:blur(4px);
}
.frame-ring[data-texture="neon"]{
  box-shadow:0 0 10px var(--fr-c1), 0 0 22px var(--fr-c1), inset 0 0 8px var(--fr-c2);
}
.frame-ring[data-texture="grain"]{
  background-image:
    repeating-conic-gradient(var(--fr-c1) 0% 25%, var(--fr-c2) 0% 50%);
  background-size:6px 6px;
}
.frame-ring[data-texture="holo"]{
  background-image:conic-gradient(from 0deg, #ff5ea8, #ffd36e, #6effc7, #6ec3ff, #c56eff, #ff5ea8);
}

/* efektler */
.frame-ring[data-effect="glow"]{ box-shadow:0 0 16px -2px var(--fr-c1); }
.frame-ring[data-effect="pulse"]{ animation:frPulse 1.9s var(--ease) infinite; }
@keyframes frPulse{ 50%{ box-shadow:0 0 22px -2px var(--fr-c1); transform:scale(1.03); } }
.frame-ring[data-effect="rotate"]{
  background-image:conic-gradient(from 0deg, var(--fr-c1), var(--fr-c2), var(--fr-c1));
  animation:frSpin 3.2s linear infinite;
}
@keyframes frSpin{ to{ transform:rotate(360deg); } }
.frame-ring[data-effect="rotate"] img{ animation:frSpinBack 3.2s linear infinite; }
@keyframes frSpinBack{ to{ transform:rotate(-360deg); } }
.frame-ring[data-effect="shimmer"]{
  background-image:linear-gradient(110deg, var(--fr-c1) 30%, #fff8 48%, var(--fr-c2) 62%);
  background-size:220% 100%;
  animation:frShim 2.6s linear infinite;
}
@keyframes frShim{ to{ background-position:-220% 0; } }

/* üye kartındaki avatar çerçevesi */
.member .frame-ring{ width:84px; height:84px; margin:0 auto 14px; }
.member .frame-ring img{ width:100%; height:100%; }

/* yönetici çerçeve formu */
.ft-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px,1fr)); gap:12px; margin-top:10px; }
.ft-color{
  width:100%; height:42px; padding:3px; border-radius:9px; cursor:pointer;
  background:var(--surface); border:1px solid var(--glass-brd);
}
.ft-preview{ display:grid; place-items:center; padding:16px 0 6px; }
.ft-preview .frame-ring{ width:96px; height:96px; }
.ft-row{ display:flex; align-items:center; gap:12px; padding:10px 12px; margin-top:8px;
  border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.ft-row .frame-ring{ width:44px; height:44px; flex:0 0 auto; }
.ft-row .fi{ flex:1; min-width:0; }
.ft-row .fi b{ display:block; font-size:14px; }
.ft-row .fi span{ font-family:var(--font-m); font-size:9.5px; color:var(--muted); letter-spacing:.08em; }
.ft-pick{ display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; }
.ft-pick button{ display:grid; place-items:center; gap:5px; padding:8px; border-radius:11px;
  border:1px solid var(--glass-brd); transition:.2s; background:transparent; }
.ft-pick button:hover{ border-color:var(--ember); transform:translateY(-2px); }
.ft-pick button.sel{ border-color:var(--ember); box-shadow:var(--glow); }
.ft-pick .frame-ring{ width:52px; height:52px; }
.ft-pick small{ font-family:var(--font-m); font-size:8.5px; color:var(--muted); max-width:70px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ============ v46 — içerik sayfası ============ */
.art-main > .section{ padding-top:112px; padding-bottom:60px; }
.wrap-read{ max-width:860px; }
.art-status{ font-family:var(--font-m); font-size:12px; color:var(--muted); text-align:center; padding:60px 0; }
.art-back{
  display:inline-block; font-family:var(--font-m); font-size:11px; letter-spacing:.12em;
  color:var(--muted); margin-bottom:20px; transition:.2s;
}
.art-back:hover{ color:var(--ember); }
.art-head{ border-bottom:1px solid var(--line); padding-bottom:20px; margin-bottom:26px; }
.art-head h1{
  font-family:var(--font-d); text-transform:uppercase; line-height:1.08;
  font-size:clamp(26px, 4.6vw, 46px); margin:12px 0 0; overflow-wrap:anywhere;
}
.art-lead{ margin-top:12px; font-size:16px; color:var(--muted); line-height:1.7; }
.art-meta{ display:flex; align-items:center; gap:12px; margin-top:18px; flex-wrap:wrap; }
.art-meta .mono{ font-size:11px; color:var(--muted); }
.art-meta-sep{ flex:1; height:1px; background:var(--line); min-width:20px; }
.art-admin{ display:flex; gap:7px; }

.art-cover{
  height:min(46vh, 380px); border-radius:var(--rad); margin-bottom:26px;
  background:var(--surface-2) center/cover no-repeat; border:1px solid var(--glass-brd);
}
.art-content{ font-size:16px; line-height:1.85; }
.art-content p{ margin:0 0 20px; overflow-wrap:anywhere; }
.art-content p:last-child{ margin-bottom:0; }

/* içerik görselleri */
.art-fig{ margin:26px 0; }
.art-fig img{
  display:block; width:100%; height:auto; border-radius:var(--rad);
  border:1px solid var(--glass-brd); background:var(--surface);
}
.art-fig figcaption{
  margin-top:9px; font-family:var(--font-m); font-size:10.5px; letter-spacing:.06em;
  color:var(--muted); text-align:center;
}
.art-fig-small{ max-width:280px; margin-inline:auto; }
.art-fig-medium{ max-width:480px; margin-inline:auto; }
.art-fig-large{ max-width:100%; }
.art-fig-full{
  max-width:none; width:calc(100% + 80px); margin-inline:-40px;
}
.art-fig-full img{ border-radius:0; border-inline:none; }
.art-fig-left{ float:left; max-width:min(46%, 340px); margin:6px 26px 18px 0; }
.art-fig-right{ float:right; max-width:min(46%, 340px); margin:6px 0 18px 26px; }
.art-content::after{ content:""; display:block; clear:both; }

.art-rate{
  margin-top:38px; padding:24px 26px; border-radius:var(--rad);
  border:1px solid var(--glass-brd); text-align:center;
}
.art-rate h3{ font-family:var(--font-d); font-size:15px; text-transform:uppercase; margin-bottom:14px; }
.art-stars{ display:flex; justify-content:center; gap:6px; }
.art-stars .rt-star{ font-size:28px; line-height:1; min-width:38px; min-height:38px; }
.art-rate .mono{ margin-top:10px; font-size:11px; color:var(--muted); }

.art-nav{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:34px; }
.art-nav-b{
  display:block; padding:16px 18px; border-radius:var(--rad);
  border:1px solid var(--glass-brd); background:var(--surface); transition:.24s var(--ease);
}
.art-nav-b:hover{ border-color:var(--ember); transform:translateY(-3px); box-shadow:var(--glow); }
.art-nav-b span{ display:block; font-size:9.5px; letter-spacing:.16em; color:var(--muted); }
.art-nav-b b{
  display:block; margin-top:6px; font-size:14px; line-height:1.35;
  overflow:hidden; text-overflow:ellipsis; display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.art-nav-next{ text-align:right; }

@media (max-width:760px){
  .art-main > .section{ padding-top:92px; padding-bottom:44px; }
  .art-fig-full{ width:calc(100% + 30px); margin-inline:-15px; }
  .art-fig-left, .art-fig-right{ float:none; max-width:100%; margin:22px 0; }
  .art-nav{ grid-template-columns:1fr; }
  .art-nav-next{ text-align:left; }
  .art-cover{ height:min(34vh, 240px); }
}

/* içerik görseli yönetimi */
.po-img{
  display:flex; gap:12px; align-items:flex-start; padding:11px 12px; margin-top:9px;
  border:1px solid var(--line); border-radius:11px; background:var(--surface);
}
.po-img .thumb{
  flex:0 0 76px; height:58px; border-radius:8px; background:var(--surface-2) center/cover no-repeat;
  border:1px solid var(--glass-brd);
}
.po-img .fields{ flex:1; min-width:0; display:grid; gap:8px; }
.po-img .fields .row{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.po-img select, .po-img input[type="text"]{
  width:100%; padding:8px 10px; border-radius:8px; font:inherit; font-size:12.5px;
  background:var(--bg); border:1px solid var(--glass-brd); color:var(--text); outline:none;
}
.po-img select:focus, .po-img input:focus{ border-color:var(--ember); }
.po-img .tools{ display:flex; flex-direction:column; gap:6px; }
@media (max-width:560px){
  .po-img{ flex-wrap:wrap; }
  .po-img .fields .row{ grid-template-columns:1fr; }
}