:root {
  color-scheme: light;
  --bg: #eef1f6;
  --surface: #ffffff;
  --surface-2: #f4f6fa;
  --text: #0f1729;
  --text-2: #556074;
  --muted: #93a0b5;
  --border: #e7ebf2;
  --border-strong: #d7dded;
  --accent: #4f46e5;
  --accent-2: #6366f1;
  --accent-soft: #eef0fe;
  --green: #16a34a; --green-soft: #e7f7ee;
  --blue: #2563eb; --blue-soft: #e8f0ff;
  --amber: #d97706; --amber-soft: #fef3e2;
  --red: #dc2626; --red-soft: #fdecec;
  --code: #2563eb; --code-bg: #e8f0ff;
  --side: #131a2b; --side-2: #1c2540; --side-text: #aeb9d0; --side-active: #2b3557;
  --radius: 12px;
  --shadow-xs: 0 1px 2px rgba(15,23,42,.06);
  --shadow: 0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.06);
  --shadow-lg: 0 12px 40px rgba(15,23,42,.14);
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* ===== Giriş sonrası SMSWIN açılış sahnesi =====
   Sidebar'ın katmanından (50/60) aşağıda, uygulama içeriğinin üstünde çalışır.
   Yeni görsel dosyası kullanmaz; mevcut marka logosu + hafif Canvas ağı ile çizilir. */
/* CSP uyumlu ilk-yükleme perdesi: uygulama hazır olana kadar içerik görünmez. */
body.booting { background: #0f1729; }
body.booting #login,
body.booting #app { display: none !important; }

:root {
  --intro-bg-a: #f8faff;
  --intro-bg-b: #edf3ff;
  --intro-panel: rgba(249, 251, 255, .97);
  --intro-border: rgba(72, 105, 175, .24);
  --intro-grid: rgba(37, 99, 235, .075);
  --intro-copy: #14213a;
  --intro-muted: #71809a;
  --intro-blue: #2563eb;
  --intro-cyan: #0ea5e9;
  --intro-ring: rgba(37, 99, 235, .32);
  --intro-ring-soft: rgba(37, 99, 235, .13);
  --intro-shadow: 0 28px 80px rgba(37, 73, 146, .16), inset 0 1px 0 rgba(255, 255, 255, .9);
}
:root[data-theme="dark"] {
  --intro-bg-a: #020817;
  --intro-bg-b: #061126;
  --intro-panel: rgba(3, 10, 27, .985);
  --intro-border: rgba(65, 113, 206, .30);
  --intro-grid: rgba(70, 123, 233, .07);
  --intro-copy: #f4f7ff;
  --intro-muted: #7987a5;
  --intro-blue: #2f6bff;
  --intro-cyan: #22b7ff;
  --intro-ring: rgba(55, 111, 255, .44);
  --intro-ring-soft: rgba(48, 104, 255, .16);
  --intro-shadow: 0 30px 90px rgba(0, 0, 0, .50), inset 0 1px 0 rgba(111, 148, 232, .08);
}
body.app-intro-running { overflow: hidden; }
body.app-intro-running .main { pointer-events: none; user-select: none; }
body.app-intro-running #maintPage,
body.app-intro-running #maintBanner,
body.app-intro-running #modal { visibility: hidden; }
.app-intro {
  position: fixed;
  z-index: 49;
  inset: 0 0 0 258px;
  padding: 14px 16px 16px;
  background: var(--bg);
  opacity: 1;
  visibility: visible;
  transition: opacity .42s ease, visibility .42s ease;
  isolation: isolate;
  overflow: hidden;
  touch-action: manipulation;
}
.app-intro.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.app-intro-surface {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 430px;
  overflow: hidden;
  border: 1px solid var(--intro-border);
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 38%, rgba(40, 101, 255, .12) 0, rgba(40, 101, 255, .035) 24%, transparent 48%),
    linear-gradient(var(--intro-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--intro-grid) 1px, transparent 1px),
    linear-gradient(165deg, var(--intro-bg-a), var(--intro-bg-b));
  background-size: auto, 42px 42px, 42px 42px, auto;
  box-shadow: var(--intro-shadow);
  contain: layout paint;
}
.app-intro-surface::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 14% 12%, rgba(32, 118, 255, .12), transparent 24%),
    radial-gradient(circle at 88% 20%, rgba(0, 185, 255, .09), transparent 22%),
    linear-gradient(180deg, transparent 52%, rgba(12, 72, 210, .07));
}
.app-intro-surface::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  bottom: -34%;
  width: min(1040px, 94vw);
  aspect-ratio: 1;
  transform: translateX(-50%);
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(16, 92, 255, .16), rgba(20, 87, 255, .04) 38%, transparent 68%);
  animation: appIntroBreathe 3.2s ease-in-out infinite;
}
.app-intro-canvas {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.app-intro-aurora {
  position: absolute;
  z-index: 1;
  left: 8%;
  right: 8%;
  bottom: -18%;
  height: 52%;
  border-radius: 50%;
  opacity: .72;
  background:
    radial-gradient(ellipse at 24% 45%, rgba(0, 113, 255, .23), transparent 42%),
    radial-gradient(ellipse at 72% 58%, rgba(0, 183, 255, .19), transparent 44%);
  animation: appIntroAurora 4s ease-in-out infinite alternate;
  pointer-events: none;
}
.app-intro-center {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: 45%;
  width: min(520px, calc(100% - 38px));
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.app-intro-radar {
  position: relative;
  width: clamp(230px, 29vw, 326px);
  max-width: 43vh;
  aspect-ratio: 1;
  flex: 0 0 auto;
}
.app-intro-ring,
.app-intro-scan,
.app-intro-orbit,
.app-intro-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
}
.app-intro-ring { transform: translate(-50%, -50%); pointer-events: none; }
.app-intro-ring.ring-a {
  width: 79%;
  height: 79%;
  border: 2px solid var(--intro-blue);
  box-shadow: 0 0 34px rgba(36, 101, 255, .18), inset 0 0 30px rgba(36, 101, 255, .08);
  opacity: .92;
}
.app-intro-ring.ring-b {
  width: 94%;
  height: 94%;
  border: 1px dashed var(--intro-ring);
  animation: appIntroSpin 16s linear infinite;
}
.app-intro-ring.ring-c {
  width: 112%;
  height: 112%;
  border: 1px solid var(--intro-ring-soft);
  box-shadow: 0 0 0 16px rgba(40, 99, 235, .018), 0 0 0 34px rgba(40, 99, 235, .012);
  animation: appIntroSpinBack 24s linear infinite;
}
.app-intro-scan {
  z-index: 2;
  width: 80%;
  height: 80%;
  transform: translate(-50%, -50%);
  background: conic-gradient(from 0deg, transparent 0 76%, rgba(29, 115, 255, .05) 83%, var(--intro-cyan) 94%, transparent 100%);
  -webkit-mask: radial-gradient(circle, transparent 66%, #000 67% 72%, transparent 73%);
  mask: radial-gradient(circle, transparent 66%, #000 67% 72%, transparent 73%);
  animation: appIntroSpin 3.2s linear infinite;
  filter: drop-shadow(0 0 5px rgba(34, 183, 255, .82));
}
.app-intro-orbit {
  z-index: 3;
  transform: translate(-50%, -50%);
  border: 1px solid transparent;
  pointer-events: none;
}
.app-intro-orbit::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -5px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #f8fdff;
  box-shadow: 0 0 8px #fff, 0 0 18px var(--intro-cyan), 0 0 32px var(--intro-blue);
}
.app-intro-orbit.orbit-a {
  width: 78%;
  height: 78%;
  animation: appIntroSpin 3.6s linear infinite;
}
.app-intro-orbit.orbit-b {
  width: 58%;
  height: 58%;
  animation: appIntroSpinBack 5s linear infinite;
  opacity: .78;
}
.app-intro-orbit.orbit-b::before { width: 6px; height: 6px; top: -3px; }
.app-intro-logo {
  z-index: 4;
  width: 43%;
  height: 43%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: radial-gradient(circle at 50% 38%, #132a57, #071327 67%, #030915 100%);
  border: 1px solid rgba(112, 157, 255, .27);
  box-shadow: 0 18px 44px rgba(0, 26, 82, .48), 0 0 42px rgba(32, 103, 255, .18), inset 0 1px 0 rgba(255, 255, 255, .10);
  animation: appIntroLogoPulse 2.8s ease-in-out infinite;
}
.app-intro-logo::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(125deg, rgba(255, 255, 255, .11), transparent 34% 72%, rgba(36, 121, 255, .10));
  pointer-events: none;
}
.app-intro-logo img {
  position: relative;
  z-index: 1;
  display: block;
  width: 78%;
  height: 68%;
  object-fit: contain;
  filter: drop-shadow(0 8px 13px rgba(0, 0, 0, .35));
}
.app-intro-progress {
  position: relative;
  display: grid;
  grid-template-columns: 9px 18px 54px 18px 9px;
  gap: 9px;
  align-items: center;
  margin-top: clamp(14px, 2vh, 24px);
  height: 10px;
}
.app-intro-progress span {
  display: block;
  height: 6px;
  border-radius: 999px;
  background: rgba(69, 107, 184, .25);
  box-shadow: inset 0 0 0 1px rgba(82, 120, 198, .08);
  transition: background .24s ease, box-shadow .24s ease, transform .24s ease, opacity .24s ease;
}
.app-intro-progress span:first-child,
.app-intro-progress span:last-child { width: 7px; height: 7px; border-radius: 50%; }
.app-intro-progress span.is-done { background: rgba(42, 105, 245, .62); }
.app-intro-progress span.is-active {
  background: linear-gradient(90deg, var(--intro-blue), var(--intro-cyan));
  box-shadow: 0 0 10px rgba(24, 132, 255, .62), 0 0 24px rgba(29, 108, 255, .30);
  transform: scaleY(1.16);
}
.app-intro-copy { margin-top: 22px; min-height: 58px; }
.app-intro-copy strong {
  display: block;
  color: var(--intro-copy);
  font-size: clamp(18px, 1.55vw, 23px);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -.02em;
}
.app-intro-copy small {
  display: block;
  margin-top: 9px;
  color: var(--intro-muted);
  font-size: clamp(12.5px, 1.1vw, 15px);
  line-height: 1.45;
  transition: opacity .18s ease;
}
.app-intro-shine {
  position: absolute;
  z-index: 4;
  left: 16%;
  right: 16%;
  bottom: 1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(22, 122, 255, .76), rgba(29, 198, 255, .88), rgba(22, 122, 255, .76), transparent);
  box-shadow: 0 0 18px rgba(22, 122, 255, .62);
  opacity: .66;
}
.app-intro-menu {
  display: none;
  position: absolute;
  z-index: 9;
  left: max(16px, env(safe-area-inset-left));
  top: max(14px, env(safe-area-inset-top));
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--intro-border);
  border-radius: 13px;
  background: var(--intro-panel);
  background: color-mix(in srgb, var(--intro-panel) 90%, transparent);
  color: var(--intro-copy);
  box-shadow: 0 8px 24px rgba(17, 50, 112, .16);
  font: inherit;
  font-size: 21px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.app-intro-menu:active { transform: scale(.96); }

@keyframes appIntroSpin { to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes appIntroSpinBack { to { transform: translate(-50%, -50%) rotate(-360deg); } }
@keyframes appIntroBreathe { 0%, 100% { opacity: .56; transform: translateX(-50%) scale(.96); } 50% { opacity: .92; transform: translateX(-50%) scale(1.04); } }
@keyframes appIntroAurora { from { transform: translate3d(-2%, 0, 0) scale(.98); opacity: .56; } to { transform: translate3d(2%, -2%, 0) scale(1.04); opacity: .88; } }
@keyframes appIntroLogoPulse { 0%, 100% { transform: translate(-50%, -50%) scale(.985); } 50% { transform: translate(-50%, -50%) scale(1.025); } }

@media (max-width: 860px) {
  .app-intro {
    inset: 0;
    padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  }
  .app-intro-surface { min-height: 360px; border-radius: 18px; }
  .app-intro-menu { display: flex; }
  .app-intro-center { top: 46%; width: calc(100% - 30px); }
  .app-intro-radar { width: clamp(196px, 58vw, 280px); max-width: 39vh; }
  .app-intro-copy { margin-top: 17px; }
}
@media (max-width: 420px) {
  .app-intro-surface { background-size: auto, 32px 32px, 32px 32px, auto; }
  .app-intro-center { top: 45%; }
  .app-intro-radar { width: clamp(184px, 61vw, 244px); max-width: 38vh; }
  .app-intro-progress { grid-template-columns: 8px 15px 44px 15px 8px; gap: 7px; margin-top: 12px; }
  .app-intro-copy { margin-top: 15px; min-height: 53px; }
  .app-intro-copy small { margin-top: 7px; }
}
@media (max-height: 600px) and (orientation: landscape) {
  .app-intro-center { top: 49%; flex-direction: row; justify-content: center; gap: clamp(28px, 7vw, 72px); width: min(780px, calc(100% - 92px)); }
  .app-intro-radar { width: min(47vh, 230px); max-width: none; }
  .app-intro-progress { position: absolute; left: calc(50% + clamp(28px, 7vw, 72px)); bottom: 22%; transform: translateX(10%); margin: 0; }
  .app-intro-copy { width: min(310px, 42vw); margin: 0; text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  .app-intro-ring.ring-b,
  .app-intro-ring.ring-c,
  .app-intro-scan,
  .app-intro-orbit,
  .app-intro-logo,
  .app-intro-aurora,
  .app-intro-surface::after { animation: none !important; }
  .app-intro-progress span { transition-duration: .01ms; }
}
/* 🌙 Koyu tema — data-theme="dark" ile değişkenler yeniden tanımlanır (topbar düğmesi + localStorage). */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d1220;
  --surface: #161d2e;
  --surface-2: #1d2537;
  --text: #e9edf6;
  --text-2: #a3afc6;
  --muted: #6f7c93;
  --border: #262f43;
  --border-strong: #34405a;
  --accent: #6d67f0;
  --accent-2: #8286ff;
  --accent-soft: #232449;
  --green: #34d17f; --green-soft: #14301f;
  --blue: #5b9bff; --blue-soft: #142138;
  --amber: #f0a53a; --amber-soft: #322412;
  --red: #f47070; --red-soft: #331717;
  --code: #6cb0ff; --code-bg: #142138;
  --side: #0a0f1c; --side-2: #141c30; --side-text: #9aa6c0; --side-active: #202a45;
  --shadow-xs: 0 1px 2px rgba(0,0,0,.4);
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.4);
  --shadow-lg: 0 12px 40px rgba(0,0,0,.55);
}
/* Koyu temada sabit (beyaz/açık) kalan yüzeyleri değişkenlere bağla — premium his için. */
:root[data-theme="dark"] .fselect option,
:root[data-theme="dark"] .cmp-result.no i,
:root[data-theme="dark"] .story-steps div { background: var(--surface-2); }
:root[data-theme="dark"] .cdrop-btn { background: linear-gradient(135deg, var(--surface), var(--surface-2)); }
:root[data-theme="dark"] .rule-card { background: var(--surface); }
:root[data-theme="dark"] .mobile-check { background: var(--surface-2); border-color: var(--border-strong); }
:root[data-theme="dark"] .topup-coin.tron { background: var(--red-soft); border-color: var(--red-soft); }
:root[data-theme="dark"] .topup-coin.btc { background: var(--amber-soft); border-color: var(--amber-soft); }
:root[data-theme="dark"] .pay-owed { background: linear-gradient(135deg, var(--amber-soft), var(--surface)); border-color: var(--amber-soft); }
:root[data-theme="dark"] .protect-do { background: linear-gradient(135deg, var(--green-soft), var(--surface)); }
:root[data-theme="dark"] .protect-dont { background: linear-gradient(135deg, var(--amber-soft), var(--surface)); }
:root[data-theme="dark"] .protect-hour { background: linear-gradient(140deg, var(--amber-soft), var(--surface)); }
:root[data-theme="dark"] .protect-story { background: linear-gradient(135deg, var(--surface), var(--surface-2)); }
:root[data-theme="dark"] .support-modal-cta { background: linear-gradient(135deg, var(--surface-2), var(--surface)); }
:root[data-theme="dark"] .support-modal-warning { background: linear-gradient(180deg, var(--red-soft), var(--surface)); }
:root[data-theme="dark"] .support-modal-fineprint { background: var(--red-soft); color: var(--red); }
:root[data-theme="dark"] .led-row.led-type-hold { background: linear-gradient(90deg, var(--amber-soft), var(--surface)); }
:root[data-theme="dark"] .order-summary { background: linear-gradient(180deg, var(--surface), var(--surface-2)); }
:root[data-theme="dark"] body.bb-desktop .order-summary,
:root[data-theme="dark"] body.bb-mobile .order-summary { background: rgba(22,29,46,.94); border-color: var(--border-strong); box-shadow: 0 18px 46px rgba(0,0,0,.55); }
:root[data-theme="dark"] .pg-pop.on { background: var(--accent-soft); }
:root[data-theme="dark"] .pg-limited.on { color: var(--amber); background: var(--amber-soft); }
/* Koyu temada filtre/sıralama dropdown'ları (ekran görüntüsündeki beyaz menü bug'ı) */
:root[data-theme="dark"] .cdrop-btn { background: linear-gradient(135deg, var(--surface), var(--surface-2)); }
:root[data-theme="dark"] .cdrop-btn:hover, :root[data-theme="dark"] .cdrop.open .cdrop-btn { background: linear-gradient(135deg, var(--surface-2), var(--surface)); border-color: var(--accent); }
:root[data-theme="dark"] .cdrop-menu { background: rgba(22, 29, 46, .98); border-color: var(--border-strong); box-shadow: 0 20px 48px rgba(0, 0, 0, .6); }
:root[data-theme="dark"] .cdrop-menu::before { box-shadow: none; }
:root[data-theme="dark"] .cdrop-opt:hover { background: var(--surface-2); }
:root[data-theme="dark"] .cdrop-ic.ap { background: #3a3a3f; }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body, .layout, .login, .modal, .sidebar, .main { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
input, textarea, select, .copy-buffer { -webkit-user-select: text; user-select: text; -webkit-touch-callout: default; }
/* Tüm scrollbar'lar gizli (kaydırma çalışır, çubuk görünmez) */
* { scrollbar-width: none; -ms-overflow-style: none; }
*::-webkit-scrollbar { width: 0; height: 0; display: none; }
/* Mobilde tıklayınca çıkan kare gölge/outline yok — köşeler yuvarlak kalsın */
button, a, .nav-item, [role="button"], input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus, a:focus, .nav-item:focus, [role="button"]:focus { outline: none; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
button { -webkit-appearance: none; appearance: none; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { margin: 0; max-width: 100%; min-height: 100%; overflow-x: hidden; overflow-y: auto; touch-action: pan-x pan-y; overscroll-behavior-x: none; overscroll-behavior-y: auto; }
body { background: var(--bg); color: var(--text); font-family: var(--font); font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
html.no-scroll, body.no-scroll { overflow: hidden !important; overscroll-behavior: none; }
body:not(.no-scroll) { overflow-y: auto !important; }
h1, h2 { margin: 0; font-weight: 650; letter-spacing: -.01em; }
.lbl { font-size: 12px; font-weight: 500; color: var(--text-2); margin: 0 0 8px; display: block; }
.mt { margin-top: 16px; }

.login { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; padding: clamp(10px, 1.8vh, 18px) 18px; background: #f8faff; overflow-y: auto; }
.login-bg { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, #ffffff 0%, #f7f9ff 54%, #eef3ff 100%); }
.login-bg::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(79,70,229,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(79,70,229,.055) 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(180deg, rgba(0,0,0,.5), transparent 72%); }
.lblob { display: none; }
.login-shell { position: relative; z-index: 1; width: min(1160px, calc(100% - 12px)); height: min(660px, calc(100dvh - 28px)); min-height: 590px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, .7fr); align-items: center; gap: 22px; }
.login-brand { color: #121836; padding: 4px 2px; display: grid; grid-template-rows: auto auto auto auto auto auto; align-content: center; gap: 14px; min-width: 0; min-height: 0; }
.login-brandtop { display: flex; align-items: center; gap: 13px; }
.login-brandname { display: flex; flex-direction: column; font-size: 21px; font-weight: 800; line-height: 1.1; }
.login-brandname small { margin-top: 5px; color: #3f4b70; font-size: 12.5px; font-weight: 500; }
.login-access { justify-self: start; display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 16px; border-radius: 999px; background: #f0f1ff; color: var(--accent); font-size: 12.5px; font-weight: 800; text-transform: uppercase; }
.login-copy { max-width: 535px; }
.login-copy p { margin: 10px 0 0; max-width: 540px; color: #303a61; font-size: 15px; line-height: 1.6; }
.login-tagline { max-width: 520px; font-size: clamp(31px, 3.65vw, 43px); line-height: 1.08; font-weight: 820; letter-spacing: 0; }
.login-tagline span { color: #3f36f2; }
.login-visual { position: absolute; left: clamp(540px, 48%, 610px); top: 17%; width: 154px; height: 154px; pointer-events: none; opacity: .86; }
.lv-grid { position: absolute; inset: 34px; background-image: linear-gradient(rgba(79,70,229,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(79,70,229,.16) 1px, transparent 1px); background-size: 24px 24px; transform: perspective(360px) rotateX(58deg) rotateZ(-8deg); opacity: .7; }
.lv-base { position: absolute; left: 50%; bottom: 24px; width: 126px; height: 58px; border-radius: 24px; transform: translateX(-50%) skewX(-12deg); background: linear-gradient(160deg, #eef1ff, #5149f3); box-shadow: 0 26px 46px rgba(79,70,229,.22); }
.lv-shield { position: absolute; left: 50%; top: 18px; width: 106px; height: 128px; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 40px; background: linear-gradient(155deg, #ffffff 0%, #eef0ff 35%, #5149f3 100%); clip-path: polygon(50% 0, 92% 16%, 84% 70%, 50% 100%, 16% 70%, 8% 16%); box-shadow: 0 18px 38px rgba(79,70,229,.28); }
.lv-shield::before { content: ""; position: absolute; inset: 13px; background: linear-gradient(160deg, #ffffff, #625aff); clip-path: inherit; opacity: .8; }
.lv-shield i { position: relative; z-index: 1; filter: drop-shadow(0 8px 12px rgba(31,41,92,.24)); }
.lv-dot { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #6d63ff; opacity: .55; }
.lv-dot.d1 { left: 32px; top: 78px; } .lv-dot.d2 { right: 32px; top: 54px; } .lv-dot.d3 { right: 58px; bottom: 58px; }
.login-feats { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 0; margin: 8px 0 0; align-self: start; }
.login-feats li { min-width: 0; background: rgba(255,255,255,.92); border: 1px solid #e1e6f4; border-radius: 14px; padding: 15px 13px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; box-shadow: 0 14px 34px rgba(15,23,42,.07); }
.lf-ic { width: 42px; height: 42px; flex: 0 0 auto; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; background: #f0f1ff; color: var(--accent); font-size: 25px; }
.lf-tx { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.lf-tx b { font-size: 13.5px; color: #11172f; }
.lf-tx span { font-size: 12px; line-height: 1.45; color: #465174; }
.login-info { display: flex; align-items: center; gap: 15px; padding: 16px 18px; border: 1px solid #dfe5f4; border-radius: 17px; background: rgba(255,255,255,.86); box-shadow: 0 14px 36px rgba(15,23,42,.06); }
.login-info-ic { width: 58px; height: 58px; flex: 0 0 auto; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: radial-gradient(circle at 50% 50%, #3f36f2 0 46%, #eef0ff 47% 100%); color: #fff; font-size: 27px; box-shadow: 0 16px 32px rgba(79,70,229,.2); }
.login-info b { display: block; color: #2830e5; text-transform: uppercase; font-size: 13px; margin-bottom: 5px; }
.login-info small { display: block; color: #303a61; font-size: 13px; line-height: 1.55; }
.login-brandfoot { display: flex; flex-wrap: wrap; gap: 8px; }
.lbf-chip { display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border-radius: 999px; background: rgba(255,255,255,.86); border: 1px solid #dfe5f4; color: #303a61; font-size: 12px; font-weight: 700; }
.lbf-chip i { color: var(--accent); }
.login-card { position: relative; z-index: 2; width: 100%; max-width: 438px; min-height: 548px; justify-self: center; align-self: center; background: rgba(255,255,255,.97); padding: 44px 38px 34px; text-align: left; display: flex; flex-direction: column; justify-content: center; border: 1px solid #dfe5f4; border-radius: 22px; box-shadow: 0 30px 80px rgba(15,23,42,.12); }
.login-card-head { position: relative; z-index: 1; display: flex; align-items: center; gap: 17px; margin-bottom: 24px; padding-right: 0; }
/* Logo kutuları KALDIRILDI: geniş SW logosu doğal oranında, kutusuz gösterilir (küçük kutuda eziliyordu). */
.login-logo { width: auto; height: 58px; border-radius: 0; margin: 0; background: none; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 0; box-shadow: none; flex: 0 0 auto; }
.login-logo.lg { margin: 0; width: auto; height: 46px; border-radius: 0; font-size: 0; box-shadow: none; }
.mob-only { display: none; }
.mobile-login-brand, .mobile-card-intro, .mobile-login-tools, .mobile-divider, .mobile-login-trust, .mobile-login-copy { display: none; }
.login-card h1 { font-size: 30px; line-height: 1.12; letter-spacing: 0; }
.login-sub { color: #303a61; font-size: 14px; margin: 8px 0 0; }
.login-card-head .login-sub { margin-bottom: 0; }
.login-card .lbl { position: relative; z-index: 1; text-align: left; font-weight: 800; color: var(--text); margin-bottom: 11px; }
.input-wrap { position: relative; margin-bottom: 14px; }
.input-wrap > i { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); color: #858dad; font-size: 23px; }
.input-wrap input { width: 100%; height: 56px; padding: 0 18px 0 56px; border: 1.5px solid #dbe2f2; border-radius: 15px; background: var(--surface); color: var(--text); font-size: 15px; font-family: var(--font); box-shadow: inset 0 1px 0 rgba(255,255,255,.9); }
.input-wrap input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.login-err { color: var(--red); font-size: 13px; margin: 12px 0 0; }
.login-secure { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 20px 0 24px; padding: 18px 0; border-top: 1px solid #e4e8f4; border-bottom: 1px solid #e4e8f4; }
.login-secure span { display: flex; align-items: center; gap: 9px; color: #303a61; font-size: 13.5px; font-weight: 650; line-height: 1.35; }
.login-secure i { color: var(--accent); font-size: 25px; flex: 0 0 auto; }
.login-request { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.login-request-ic { width: 56px; height: 56px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #f0f1ff; color: var(--accent); font-size: 27px; flex: 0 0 auto; }
.login-request b { display: block; color: var(--text); font-size: 18px; }
.login-request small { display: block; color: #4b5575; font-size: 14px; margin-top: 3px; }
.login-noacc { width: 100%; margin-top: 0; min-height: 50px; border: 1.5px solid #b9b7ff; background: #fff; color: var(--accent); border-radius: 14px; font-family: var(--font); font-size: 15px; font-weight: 800; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; box-shadow: 0 12px 28px rgba(79,70,229,.1); transition: border-color .14s, background .14s, transform .14s; }
.login-noacc:hover { border-color: var(--accent); background: var(--accent-soft); }
.login-noacc:active { transform: translateY(1px); }
.login-hint { color: var(--muted); font-size: 12.5px; margin: 15px 0 0; display: flex; align-items: flex-start; gap: 7px; line-height: 1.35; }
.btn-block { width: 100%; height: 54px; font-size: 16px; border-radius: 14px; }

/* Düzen */
.layout { display: block; min-height: 100vh; background: var(--bg); }
.scrim { display: none; }

/* Sidebar */
.sidebar { background: var(--side); color: var(--side-text); display: flex; flex-direction: column; padding: 20px 16px; position: fixed; z-index: 50; left: 0; top: 0; bottom: 0; width: 258px; height: 100vh; height: 100dvh; overflow-y: auto; overscroll-behavior: auto; scrollbar-width: none; -ms-overflow-style: none; }
.sidebar::-webkit-scrollbar { width: 0; height: 0; display: none; }
.modal-card { scrollbar-width: none; -ms-overflow-style: none; }
.modal-card::-webkit-scrollbar { width: 0; display: none; }
.side-brand { display: flex; align-items: center; gap: 11px; padding: 4px 8px 22px; color: #fff; font-weight: 650; font-size: 17px; }
.side-logo { width: auto; height: 32px; border-radius: 0; background: none; display: flex; align-items: center; justify-content: center; font-size: 0; }
/* Marka görseli: doğal oranında, kutu yok (tek kaynaktan /brand/logo). */
.brand-img { width: auto; height: 100%; object-fit: contain; padding: 0; display: block; }
.brand-row { display: flex; gap: 18px; flex-wrap: wrap; }
.brand-box { flex: 1 1 260px; min-width: 240px; }
.brand-prev { background: linear-gradient(150deg, var(--side-2, #1e1b4b), var(--accent)); border: 1px solid var(--line); border-radius: 14px; height: 110px; display: flex; align-items: center; justify-content: center; margin: 8px 0 10px; overflow: hidden; }
.brand-prev img { max-width: 82%; max-height: 82%; object-fit: contain; }
.brand-prev-sm { height: 84px; }
.brand-prev-sm img { max-width: 56px; max-height: 56px; }
.brand-btns { display: flex; gap: 8px; flex-wrap: wrap; }
/* Özel tarih aralığı — site içi takvim (tarayıcı date input'u kullanılmaz) */
.ptab-range { display: inline-flex; align-items: center; gap: 6px; }
.range-info { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--bg-2, rgba(255,255,255,.03)); border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; margin: 10px 0 14px; font-size: 14px; }
.rng-edit { margin-left: auto; }
.rp-presets { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.rp-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.rp-title { font-weight: 700; font-size: 15px; }
.rp-nav { background: transparent; border: 1px solid var(--line); color: inherit; border-radius: 9px; width: 34px; height: 34px; cursor: pointer; font-size: 16px; display: flex; align-items: center; justify-content: center; }
.rp-nav:hover:not(:disabled) { background: var(--bg-2, rgba(255,255,255,.05)); }
.rp-nav:disabled { opacity: .35; cursor: default; }
.rp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.rp-dow { margin-bottom: 6px; font-size: 12px; color: var(--muted); text-align: center; font-weight: 600; }
.rp-cell { aspect-ratio: 1; border: 1px solid transparent; background: transparent; color: inherit; border-radius: 9px; cursor: pointer; font-size: 13.5px; font-family: var(--font); display: flex; align-items: center; justify-content: center; transition: background .12s; }
.rp-cell:hover:not(.rp-dis):not(.rp-empty) { background: var(--bg-2, rgba(255,255,255,.07)); }
.rp-empty { cursor: default; }
.rp-dis { opacity: .28; cursor: not-allowed; }
.rp-today { border-color: var(--accent); font-weight: 700; }
.rp-between { background: color-mix(in srgb, var(--accent) 18%, transparent); border-radius: 0; }
.rp-sel { background: var(--accent); color: #fff; font-weight: 700; }
.rp-start { border-radius: 9px 0 0 9px; }
.rp-end { border-radius: 0 9px 9px 0; }
.rp-sel.rp-start.rp-end { border-radius: 9px; }
.rp-sel-lbl { text-align: center; margin: 14px 0 4px; font-size: 14px; color: var(--muted); }
.rp-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }
/* Kod mesajı görünümü önizlemesi (Telegram sayfası) */
.smsv-preview { margin-top: 14px; }
.smsv-title { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.smsv-msg { background: var(--bg-2, rgba(255,255,255,.03)); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; font-size: 14px; line-height: 1.6; }
.smsv-spoil { background: var(--muted); color: transparent; border-radius: 4px; padding: 0 6px; user-select: none; }
.tg-daily-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.tg-daily-hint { font-size: 12.5px; color: var(--muted); }
/* Hesabım → Telegram bağları */
.acc-tg-list { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.acc-tg-row { display: flex; align-items: center; gap: 10px; background: var(--bg-2, rgba(255,255,255,.03)); border: 1px solid var(--line); border-radius: 11px; padding: 10px 12px; flex-wrap: wrap; }
.acc-tg-ic { width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(150deg, var(--accent-2), var(--accent)); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 16px; flex: 0 0 auto; }
.acc-tg-name { font-weight: 600; flex: 1 1 auto; min-width: 120px; display: flex; flex-direction: column; gap: 2px; }
.acc-tg-sub { font-size: 12px; font-weight: 500; color: var(--muted); }
.acc-tg-lock { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 5px; }
.acc-tg-empty { font-size: 13px; color: var(--muted); padding: 8px 2px; }
.acc-tg-unlink { flex: 0 0 auto; }
.side-nav { display: flex; flex-direction: column; gap: 3px; flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: auto; scrollbar-width: none; -ms-overflow-style: none; }
.side-nav::-webkit-scrollbar { width: 0; display: none; }
.nav-item { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 10px; color: var(--side-text); font-size: 14px; font-weight: 500; cursor: pointer; text-decoration: none; transition: background .14s, color .14s; }
.nav-item i { font-size: 19px; }
.nav-item:hover { background: var(--side-2); color: #fff; }
.nav-item.active { background: var(--side-active); color: #fff; }
.side-foot { border-top: 1px solid rgba(255,255,255,.08); padding-top: 14px; margin-top: 8px; display: flex; flex-direction: column; gap: 12px; flex-shrink: 0; }
.side-support { width: calc(100% - 2px); margin: 6px 1px 10px; text-align: left; font-family: var(--font); cursor: pointer; text-decoration: none; color: #fff; display: grid; grid-template-columns: 36px minmax(0, 1fr) 18px; align-items: center; gap: 10px; padding: 12px; border-radius: 13px; background: linear-gradient(135deg, rgba(37,99,235,.22), rgba(22,163,74,.16)); border: 1px solid rgba(255,255,255,.12); }
.side-support:hover { background: linear-gradient(135deg, rgba(37,99,235,.32), rgba(22,163,74,.22)); }
.side-support-ic { width: 36px; height: 36px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.12); color: #a7f3d0; font-size: 20px; }
.side-support-txt { min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
.side-support-txt b { font-size: 13px; font-weight: 750; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.side-support-txt small { margin-top: 4px; color: rgba(255,255,255,.62); font-size: 11.5px; }
.side-support-go { color: rgba(255,255,255,.72); font-size: 17px; justify-self: end; }
.side-balance { background: var(--side-2); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; }
.bal-label { font-size: 12px; color: var(--side-text); display: flex; align-items: center; gap: 6px; }
.bal-src { color: var(--muted); }
.bal-val { font-size: 20px; font-weight: 700; color: #fff; font-family: var(--mono); }
.bal-val.neg { color: #ff8a8a; }
.bal-limit { font-size: 11px; color: var(--muted); font-family: var(--mono); }
.bal-limit:empty { display: none; }
.side-logout { display: flex; align-items: center; justify-content: center; gap: 8px; background: transparent; color: var(--side-text); border: 1px solid rgba(255,255,255,.14); border-radius: 10px; padding: 10px; font-size: 13px; font-weight: 500; font-family: var(--font); cursor: pointer; transition: all .14s; }
.side-logout:hover { background: var(--side-2); color: #fff; }
.bal-topup { display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin-top: 8px; width: 100%; background: linear-gradient(150deg, var(--accent-2), var(--accent)); color: #fff; border: none; border-radius: 10px; padding: 9px; font-size: 13px; font-weight: 650; font-family: var(--font); cursor: pointer; box-shadow: 0 4px 12px rgba(79,70,229,.32); transition: transform .12s, filter .15s; }
.bal-topup:hover { filter: brightness(1.08); transform: translateY(-1px); }
.bal-topup i { font-size: 16px; }
.bal-val i { font-size: 17px; vertical-align: -2px; margin-right: 3px; color: var(--accent-2); }

/* Main */
.main { margin-left: 258px; padding: 26px 30px 48px; max-width: 1200px; min-height: 100vh; min-height: 100dvh; }
.topbar { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.topbar-title h1 { font-size: 24px; }
.topsub { margin: 3px 0 0; font-size: 14px; color: var(--text-2); }
.hamb { display: none; background: var(--surface); border: 1px solid var(--border-strong); border-radius: 10px; width: 40px; height: 40px; font-size: 20px; color: var(--text); cursor: pointer; }
.mode { margin-left: auto; background: var(--surface); border: 1px solid var(--border); color: var(--text-2); padding: 6px 13px; border-radius: 999px; font-size: 13px; font-weight: 600; box-shadow: var(--shadow-xs); }
.mode.live { background: var(--green-soft); color: var(--green); border-color: transparent; }

/* Stat cards */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 22px; }
.stat { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 18px 20px; display: flex; align-items: center; gap: 15px; box-shadow: var(--shadow-xs); }
.stat-ic { width: 48px; height: 48px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-size: 23px; flex: 0 0 auto; }
.stat-ic.blue { background: var(--blue-soft); color: var(--blue); }
.stat-ic.green { background: var(--green-soft); color: var(--green); }
.stat-ic.amber { background: var(--amber-soft); color: var(--amber); }
.stat-ic.red { background: var(--red-soft); color: var(--red); }
.stat-num { font-size: 26px; font-weight: 700; line-height: 1.1; }
.stat-lbl { font-size: 13px; color: var(--text-2); margin-top: 2px; }

/* Kartlar + kontroller */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: 22px 24px; box-shadow: var(--shadow); margin-bottom: 24px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 18px; }
.card-head h2 { font-size: 17px; }
.order-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.chips { display: flex; flex-wrap: wrap; gap: 9px; }
.chip { display: inline-flex; align-items: center; gap: 7px; padding: 10px 15px; background: var(--surface); border: 1.5px solid var(--border-strong); border-radius: 11px; cursor: pointer; font-size: 14px; font-weight: 500; font-family: var(--font); color: var(--text-2); transition: all .14s; }
.chip:hover { border-color: var(--accent); color: var(--text); }
.chip[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.chip i { font-size: 17px; }
.country-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); gap: 12px; }
.country { position: relative; display: flex; align-items: center; gap: 13px; min-width: 0; min-height: 68px; padding: 12px 15px; text-align: left; background: var(--surface); border: 1.5px solid var(--border-strong); border-radius: 13px; cursor: pointer; font-family: var(--font); color: var(--text); transition: all .14s; overflow: hidden; }
.country:hover { border-color: var(--accent); box-shadow: var(--shadow-xs); }
.country[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px var(--accent-soft); }
.country-flag { width: 38px; height: 28px; border-radius: 4px; object-fit: cover; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(15,23,42,.09); background: var(--surface-2); }
/* Yüklenemeyen bayrak: kırık ikon yerine düz gri kutu (globe ikonu) */
.flag-broken { position: relative; }
.flag-broken::after { content: "\ea25"; font-family: "tabler-icons"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 13px; color: var(--muted); background: var(--surface-2); border-radius: inherit; }
.country-flag,
.osum-flag,
.numrow-flag,
.cty-mini-flag,
.cadd-flag,
.nd-flag,
.uchip-flag,
.pg-flag {
  display: block;
  object-fit: cover;
  object-position: center;
  background: #f8fafc;
  clip-path: inset(.35px round 3px);
  image-rendering: auto;
  backface-visibility: hidden;
}
.country-info { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; flex: 1 1 auto; }
.country-name { font-size: 14.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* İsim + rozet artık AYRI satırlarda: isim üstte tam, dial+rozet altta → isim asla daralmaz. */
.country-sub { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 3px; }
.country-dial { font-size: 12px; color: var(--muted); font-family: var(--mono); flex: 0 0 auto; }
.country-check { color: var(--accent); font-size: 19px; }
/* Sağ sütun: sadece fiyat (rozet artık isim altında) — dikey ortalı, sabit. */
.country-right { margin-left: auto; padding-left: 10px; display: flex; align-items: center; flex: 0 0 auto; }
.country-price { font-family: var(--mono); font-weight: 700; font-size: 14px; color: var(--text); white-space: nowrap; }
.country-tag { display: inline-flex; align-items: center; gap: 3px; height: 17px; padding: 0 7px; border-radius: 999px; font-size: 9.3px; font-weight: 800; letter-spacing: .01em; line-height: 1; white-space: nowrap; }
.country-tag i { font-size: 11px; flex: 0 0 auto; }
.country-tag.popular { color: #fff; background: linear-gradient(135deg, #fb923c, #f97316); box-shadow: 0 2px 7px rgba(249,115,22,.32); }
.country-tag.limited { color: #b45309; background: #fef3c7; }
.country-tag.out { color: #fff; background: linear-gradient(135deg, #94a3b8, #64748b); }
.country-tag.maint { color: #b45309; background: #fde68a; }

/* Ülke başlık satırı: etiket + sıralama çipleri */
.ulke-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.ulke-head .lbl { margin: 0; }
.country-sort { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.country-sort .fchip { padding: 7px 12px; font-size: 12.5px; }
.country-sort .fchip i { font-size: 15px; }
.country-more { width: 100%; margin-top: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1.5px dashed var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 13.5px; font-weight: 600; font-family: var(--font); padding: 11px; border-radius: 12px; cursor: pointer; transition: all .14s; }
.country-more:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.country.unavail .country-price { color: var(--muted); }

/* ===== Premium sipariş akışı ===== */
/* Adım göstergesi */
.stepper-card { padding: 18px 24px; }
.stepper { display: flex; align-items: center; gap: 10px; }
.step { display: flex; align-items: center; gap: 11px; flex: 0 1 auto; min-width: 0; }
.step-num { width: 34px; height: 34px; border-radius: 50%; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; background: var(--surface-2); color: var(--muted); border: 1.5px solid var(--border-strong); transition: all .18s; }
.step.done .step-num { background: linear-gradient(150deg, var(--accent-2), var(--accent)); color: #fff; border-color: transparent; box-shadow: 0 4px 12px rgba(79,70,229,.3); }
.step-txt { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.step-txt b { font-size: 14px; font-weight: 650; color: var(--text); white-space: nowrap; }
.step.done .step-txt b { color: var(--accent); }
.step-txt small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.step-line { flex: 1 1 auto; height: 2px; min-width: 16px; background: var(--border-strong); border-radius: 2px; transition: background .2s; }
.step-line.on { background: linear-gradient(90deg, var(--accent-2), var(--accent)); }
.pick-col[hidden], .osum-item[hidden], .osum-sep[hidden] { display: none; }

/* Kaynak / Servis kart seçiciler */
.pick-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pick-row.single { grid-template-columns: 1fr; }
.pick-col { display: flex; flex-direction: column; min-width: 0; }
.pick-cards { display: flex; flex-direction: column; gap: 10px; }
/* Servis kartları yan yana (WhatsApp / Telegram / Gmail / Apple) */
#serviceRow { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
#serviceRow .pick-card { padding: 12px 13px; gap: 10px; }
.pick-card { display: flex; align-items: center; gap: 13px; width: 100%; text-align: left; padding: 13px 15px; background: var(--surface); border: 1.5px solid var(--border-strong); border-radius: 13px; cursor: pointer; font-family: var(--font); color: var(--text); transition: all .14s; }
.pick-card:hover { border-color: var(--accent); box-shadow: var(--shadow-xs); }
.pick-card.sel { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px var(--accent-soft); }
.pick-card.unavail { opacity: .55; }
.pick-ic { width: 40px; height: 40px; border-radius: 11px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; }
.pick-ic.src { background: linear-gradient(150deg, var(--accent-2), var(--accent)); }
.pick-ic.wa { background: #25d366; }
.pick-ic.tg { background: #29a9eb; }
.pick-ic.gm { background: #ea4335; }
.pick-ic.ap { background: #1d1d1f; }
.pick-ic.gen { background: var(--muted); }
.pick-body { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.pick-name { display: flex; align-items: center; gap: 7px; font-size: 14.5px; font-weight: 650; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pick-badge { flex: 0 0 auto; font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--green-soft); color: var(--green); letter-spacing: .01em; }
.pick-desc { font-size: 12px; color: var(--muted); line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pick-check { width: 22px; height: 22px; border-radius: 50%; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--border-strong); background: transparent; color: #fff; transition: all .14s; }
.pick-check i { font-size: 13px; opacity: 0; transition: opacity .12s; }
.pick-card.sel .pick-check { border-color: transparent; background: var(--accent); }
.pick-card.sel .pick-check.wa { background: #25d366; }
.pick-card.sel .pick-check.tg { background: #29a9eb; }
.pick-card.sel .pick-check.gm { background: #ea4335; }
.pick-card.sel .pick-check.ap { background: #1d1d1f; }
.pick-card.sel .pick-check.gen { background: var(--muted); }
.pick-card.sel .pick-check i { opacity: 1; }

/* Ülke seçim barı: arama + sıralama + görünüm */
.ulke-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.country-search { flex: 1 1 240px; }
.ulke-sort { flex: 0 0 auto; }
.view-toggle { display: inline-flex; flex: 0 0 auto; border: 1px solid var(--border-strong); border-radius: 11px; overflow: hidden; background: var(--surface); }
.vt-btn { width: 42px; height: 42px; border: none; background: transparent; color: var(--muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; font-size: 0; transition: all .14s; }
.vt-btn i { font-size: 19px; }
.vt-btn + .vt-btn { border-left: 1px solid var(--border-strong); }
.vt-btn:hover { color: var(--text); }
.vt-btn.active { background: var(--accent-soft); color: var(--accent); }
.country-grid.list-mode { grid-template-columns: 1fr; }

/* Seçim özeti çubuğu */
.order-summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; background: linear-gradient(180deg, #fff, #f8faff); border: 1px solid var(--border); border-radius: 18px; padding: 18px 22px; box-shadow: var(--shadow); margin-bottom: 24px; }
.osum-items { display: flex; align-items: center; gap: 0; flex-wrap: wrap; flex: 1 1 auto; row-gap: 12px; }
.osum-item { display: flex; flex-direction: column; gap: 4px; padding: 0 18px; min-width: 0; }
.osum-item:first-child { padding-left: 0; }
.osum-lbl { font-size: 11px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.osum-val { display: flex; align-items: center; gap: 6px; font-size: 14.5px; font-weight: 650; color: var(--text); line-height: 1.25; }
.osum-val .svc-mini-ic { width: 22px; height: 22px; font-size: 13px; flex: 0 0 auto; border-radius: 50%; }
.osum-txt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.osum-flag { width: 22px; height: 16px; border-radius: 3px; object-fit: cover; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(15,23,42,.09); }
.osum-price { font-family: var(--mono); font-size: 19px; font-weight: 800; color: var(--accent); }
.osum-sep { width: 1px; height: 36px; background: var(--border-strong); flex: 0 0 auto; }
.osum-btn { flex: 0 0 auto; padding: 13px 22px; font-size: 15px; }
@media (min-width: 861px) {
  body.bb-desktop .main { padding-bottom: 140px; }
  body.bb-desktop .order-summary { position: fixed; left: 288px; bottom: 18px; z-index: 44; width: min(1140px, calc(100vw - 318px)); background: rgba(255,255,255,.94); border-color: rgba(215,221,237,.9); padding: 14px 18px; box-shadow: 0 18px 46px rgba(15,23,42,.16); margin: 0; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
}

/* Güven özellikleri */
.order-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 24px; }
.ofeat { display: flex; align-items: center; gap: 13px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 15px 17px; box-shadow: var(--shadow-xs); }
.ofeat-ic { width: 42px; height: 42px; border-radius: 12px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; background: var(--accent-soft); color: var(--accent); font-size: 21px; }
.ofeat-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ofeat-txt b { font-size: 14px; font-weight: 650; color: var(--text); }
.ofeat-txt small { font-size: 12px; color: var(--muted); line-height: 1.35; }

.actions { display: flex; align-items: center; gap: 14px; margin-top: 20px; flex-wrap: wrap; }
.hint { font-size: 12px; color: var(--muted); }
.btn-accent { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: linear-gradient(150deg, var(--accent-2), var(--accent)); color: #fff; border: none; border-radius: 12px; padding: 12px 22px; font-size: 14px; font-weight: 600; font-family: var(--font); cursor: pointer; box-shadow: 0 6px 16px rgba(79,70,229,.28); transition: transform .12s, box-shadow .15s, filter .15s; }
.btn-accent:hover { filter: brightness(1.06); transform: translateY(-1px); }
.btn-accent:active { transform: scale(.98); }
.btn-accent:disabled { opacity: .7; cursor: default; box-shadow: none; }
.ibtn { display: inline-flex; align-items: center; gap: 6px; background: var(--surface); color: var(--text-2); border: 1px solid var(--border-strong); border-radius: 10px; padding: 8px 13px; font-size: 13px; font-weight: 500; font-family: var(--font); cursor: pointer; transition: all .14s; }
.ibtn:hover { border-color: var(--accent); color: var(--text); background: var(--surface-2); }
.ibtn:disabled { opacity: .55; cursor: default; }
.ibtn.danger { color: var(--red); }
.ibtn.danger:hover { border-color: var(--red); background: var(--red-soft); }
.ibtn.ghost { border: none; background: transparent; padding: 6px; color: var(--muted); }
.ibtn.ghost:hover { color: var(--text); background: var(--surface-2); }

/* Bölüm başlığı + numaralar */
.sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 4px 2px 14px; }
.sec-title { font-size: 18px; }
.sec-meta { font-size: 13px; color: var(--muted); }
#numbers { display: flex; flex-direction: column; gap: 11px; }
.numrow { display: flex; align-items: center; gap: 14px; padding: 15px 18px; background: var(--surface); border: 1px solid var(--border); border-radius: 15px; box-shadow: var(--shadow-xs); transition: box-shadow .15s; }
.numrow:hover { box-shadow: var(--shadow); }
.numrow-ic { width: 44px; height: 44px; border-radius: 12px; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 21px; flex: 0 0 auto; }
.numrow-ic.wa { background: linear-gradient(150deg, #22c55e, #15803d); }
.numrow-ic.tg { background: linear-gradient(150deg, #38bdf8, #0284c7); }
.numrow-ic.gm { background: linear-gradient(150deg, #f87171, #dc2626); }
.numrow-ic.ap { background: linear-gradient(150deg, #3f3f46, #18181b); }
.numrow-main { flex: 1 1 170px; min-width: 0; }
.numrow-top { display: flex; align-items: center; gap: 6px; }
.numrow-phone { font-family: var(--mono); font-size: 17px; font-weight: 700; letter-spacing: .3px; white-space: nowrap; }
.numrow-phone.pending { color: var(--text-2); font-family: var(--font); font-size: 14px; font-weight: 650; letter-spacing: 0; white-space: normal; }
.numrow-sub { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--muted); margin-top: 4px; flex-wrap: wrap; }
.numrow-flag { width: 18px; height: 13px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,23,42,.08); }
.src-badge { background: var(--surface-2); color: var(--text-2); border: 1px solid var(--border); padding: 1px 7px; border-radius: 6px; font-weight: 500; }
.numrow-right { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; }
.numrow-right > .badge:only-child { margin-left: auto; }
.active-row { --wait-tone: #0284c7; }
:root[data-theme="dark"] .active-row { --wait-tone: #38bdf8; }
.numrow-status { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0; }
.numrow-status .wait { display: inline-flex; align-items: center; gap: 7px; color: var(--wait-tone, #0284c7); font-size: 13px; font-weight: 700; white-space: nowrap; }
.numrow-status .wait > i { width: 17px; height: 17px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; font-size: 15px; }
.numrow-time { font-size: 12px; color: var(--muted); font-family: var(--mono); font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; gap: 5px; }
.numrow-time-code { margin-right: 8px; padding: 3px 9px; border-radius: 999px; background: var(--green-soft); color: var(--green); font-weight: 700; }
.active-row.has-code { position: relative; }
.active-row.has-code .numrow-time-code {
  position: absolute;
  z-index: 2;
  top: -1px;
  right: -1px;
  min-width: 94px;
  min-height: 38px;
  margin: 0;
  padding: 8px 14px 10px 13px;
  justify-content: center;
  border: 1px solid color-mix(in srgb, var(--green) 22%, var(--border));
  border-top: 0;
  border-right: 0;
  border-radius: 0 15px 0 16px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--green-soft) 88%, var(--surface)), color-mix(in srgb, var(--green-soft) 62%, var(--surface)));
  color: var(--green);
  box-shadow: -7px 8px 18px color-mix(in srgb, var(--green) 10%, transparent);
  font-size: 12px;
  font-weight: 800;
}
.numrow-codebox { display: inline-flex; align-items: stretch; overflow: hidden; border: 1px solid color-mix(in srgb, var(--code) 18%, var(--border)); border-radius: 12px; background: var(--code-bg); box-shadow: 0 5px 14px color-mix(in srgb, var(--code) 8%, transparent); transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.numrow-codebox .code { display: inline-flex; align-items: center; min-height: 42px; border-radius: 0; padding: 7px 14px 7px 16px; background: transparent; font-variant-numeric: tabular-nums; white-space: nowrap; word-break: normal; overflow-wrap: normal; }
.numrow-codebox .copy-code { width: 42px; height: auto; min-height: 42px; border-width: 0 0 0 1px; border-radius: 0; border-color: color-mix(in srgb, var(--code) 16%, var(--border)); background: color-mix(in srgb, var(--surface) 42%, transparent); color: var(--code); }
.numrow-codebox .copy-code:hover { background: color-mix(in srgb, var(--code) 10%, var(--surface)); }
.numrow-codebox .copy-code.copy-ok, .numrow-codebox .copy-code.copy-fail { animation: none !important; transform: none !important; }
.numrow-codebox:has(.copy-code.copy-ok) { border-color: color-mix(in srgb, var(--green) 48%, var(--border)); background: color-mix(in srgb, var(--green-soft) 62%, var(--surface)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 11%, transparent), 0 7px 18px color-mix(in srgb, var(--green) 12%, transparent); }
.cancel-btn { --cancel-angle: 360deg; min-width: 132px; min-height: 44px; justify-content: center; gap: 8px; padding-left: 12px; padding-right: 12px; white-space: nowrap; }
.cancel-btn:disabled { opacity: 1; color: var(--accent); border-color: color-mix(in srgb, var(--accent) 28%, var(--border)); background: color-mix(in srgb, var(--accent-soft) 58%, var(--surface)); }
.cancel-btn.cancel-warning:disabled { color: var(--amber); border-color: color-mix(in srgb, var(--amber) 38%, var(--border)); background: var(--amber-soft); }
.cancel-btn.cancel-critical:disabled { color: var(--red); border-color: color-mix(in srgb, var(--red) 38%, var(--border)); background: var(--red-soft); }
.active-row .numrow-right.pending-actions { display: grid; grid-template-columns: max-content auto; align-items: center; justify-content: end; column-gap: 18px; }
.active-row .numrow-right.pending-actions .numrow-status { transform: translate(-8px, 4px); }
.active-row .cancel-btn:not(:disabled) { color: var(--red); border-color: color-mix(in srgb, var(--red) 34%, var(--border)); background: color-mix(in srgb, var(--red-soft) 72%, var(--surface)); box-shadow: 0 5px 14px color-mix(in srgb, var(--red) 9%, transparent); }
.active-row .cancel-btn:hover:not(:disabled) { color: color-mix(in srgb, var(--red) 86%, #7f1d1d); border-color: color-mix(in srgb, var(--red) 52%, var(--border)); background: color-mix(in srgb, var(--red-soft) 90%, var(--surface)); box-shadow: 0 7px 17px color-mix(in srgb, var(--red) 12%, transparent); }
.active-row .cancel-btn:disabled { cursor: not-allowed; color: color-mix(in srgb, var(--red) 68%, var(--muted)); border-color: color-mix(in srgb, var(--red) 23%, var(--border)); background: color-mix(in srgb, var(--red-soft) 55%, var(--surface)); box-shadow: none; }
.active-row .cancel-btn.cancel-warning:disabled { color: var(--amber); border-color: color-mix(in srgb, var(--amber) 36%, var(--border)); background: color-mix(in srgb, var(--amber-soft) 72%, var(--surface)); }
.active-row .cancel-btn.cancel-critical:disabled { color: var(--red); border-color: color-mix(in srgb, var(--red) 46%, var(--border)); background: color-mix(in srgb, var(--red-soft) 88%, var(--surface)); }
.cancel-ring { position: relative; width: 20px; height: 20px; border-radius: 50%; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: inherit; background: conic-gradient(from -90deg, currentColor 0 var(--cancel-angle), color-mix(in srgb, currentColor 13%, transparent) var(--cancel-angle) 360deg); }
.cancel-ring::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--surface); box-shadow: 0 0 0 1px color-mix(in srgb, currentColor 9%, transparent); }
.cancel-ring i { position: relative; z-index: 1; font-size: 9px; color: inherit; }
.cancel-label { font-weight: 650; }
.cancel-count { min-width: 42px; margin-left: 1px; padding-left: 9px; border-left: 1px solid color-mix(in srgb, currentColor 24%, transparent); font-family: var(--mono); font-variant-numeric: tabular-nums; text-align: center; }
.cancel-plain-icon { font-size: 16px; }
.numrow-mini-flow { width: min(350px, 100%); display: grid; grid-template-columns: auto minmax(18px, 1fr) auto minmax(18px, 1fr) auto; align-items: center; gap: 5px; margin-top: 10px; }
.mini-flow-step { display: inline-flex; align-items: center; gap: 4px; min-width: 0; color: var(--muted); }
.mini-flow-step i { width: 17px; height: 17px; border-radius: 50%; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border-strong); background: var(--surface-2); font-size: 10px; }
.mini-flow-step small { font-size: 9.5px; font-weight: 700; line-height: 1; white-space: nowrap; }
.mini-flow-step.done { color: var(--green); }
.mini-flow-step.done i { color: #fff; border-color: var(--green); background: var(--green); }
.mini-flow-step.current { color: var(--wait-tone, #0284c7); }
.mini-flow-step.current i { color: var(--wait-tone, #0284c7); border-color: color-mix(in srgb, var(--wait-tone, #0284c7) 40%, var(--border)); background: color-mix(in srgb, var(--wait-tone, #0284c7) 9%, var(--surface)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wait-tone, #0284c7) 8%, transparent); }
.mini-flow-line { height: 2px; min-width: 12px; border-radius: 999px; background: var(--border-strong); }
.mini-flow-line.done { background: var(--green); }
.code { font-family: var(--mono); font-weight: 700; font-size: 20px; letter-spacing: 3px; background: var(--code-bg); color: var(--code); padding: 7px 15px; border-radius: 11px; }
.badge { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.badge.off { background: var(--surface-2); color: var(--muted); }
.badge.no { background: var(--red-soft); color: var(--red); }
.badge.warn { background: var(--amber-soft); color: var(--amber); }
.empty { color: var(--text-2); font-size: 14px; background: var(--surface); border: 1.5px dashed var(--border-strong); border-radius: 16px; padding: 34px 24px; text-align: center; }
.empty i { font-size: 28px; display: block; margin: 0 auto 10px; color: var(--muted); }
.link-btn { color: var(--accent); font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; }
.link-btn:hover { text-decoration: underline; }

/* Servis kartları (düzgün ikonlar) */
.service-grid { display: flex; flex-wrap: wrap; gap: 12px; }
.service { display: flex; align-items: center; gap: 12px; min-width: 160px; padding: 12px 20px 12px 12px; background: var(--surface); border: 1.5px solid var(--border-strong); border-radius: 14px; cursor: pointer; font-family: var(--font); color: var(--text); font-size: 15px; font-weight: 600; transition: all .14s; }
.service:hover { border-color: var(--accent); box-shadow: var(--shadow-xs); }
.service[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px var(--accent-soft); }
.svc-ic { width: 38px; height: 38px; border-radius: 11px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 21px; flex: 0 0 auto; }
.svc-ic.wa { background: #25d366; }
.svc-ic.tg { background: #29a9eb; }
.svc-ic.gm { background: #ea4335; }
.svc-ic.ap { background: #1d1d1f; }
.svc-ic.gen { background: var(--muted); }

/* Geçmişte gelen mesaj */
.numrow-msg { margin-top: 8px; font-size: 13px; color: var(--text-2); background: var(--surface-2); border-radius: 9px; padding: 8px 11px; display: flex; align-items: flex-start; gap: 7px; word-break: break-word; }
.numrow-msg-txt { flex: 1 1 auto; min-width: 0; }
.msg-copy { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex: 0 0 auto; margin-left: auto; border-radius: 8px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); cursor: pointer; transition: all .13s; }
.msg-copy:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.msg-copy:active { transform: scale(.92); }
.msg-copy i { font-size: 15px; }
.numrow-msg i { color: var(--muted); flex: 0 0 auto; }

/* Sidebar nav rozeti */
.nav-badge { margin-left: auto; background: var(--accent); color: #fff; font-size: 11px; font-weight: 700; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; }
.nav-badge:empty { display: none; }

/* İstatistik sayfası */
.period-tabs { display: inline-flex; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 4px; gap: 4px; margin-bottom: 20px; box-shadow: var(--shadow-xs); }
.ptab { border: none; background: transparent; color: var(--text-2); font-size: 14px; font-weight: 600; font-family: var(--font); padding: 8px 18px; border-radius: 9px; cursor: pointer; transition: all .14s; }
.ptab:hover { color: var(--text); }
.ptab.active { background: var(--accent); color: #fff; }
.mini-title { font-size: 15px; margin: 0 0 6px; }
.svc-stat { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.svc-stat:last-child { border-bottom: none; }
.svc-stat-name { font-weight: 600; }
.svc-stat-num { margin-left: auto; color: var(--text-2); font-size: 14px; font-family: var(--mono); }

/* Filtre çubuğu */
.filterbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 18px; }
.search { position: relative; flex: 1 1 220px; min-width: 180px; }
.search i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 18px; }
.search input { width: 100%; height: 42px; padding: 0 14px 0 40px; border: 1px solid var(--border-strong); border-radius: 11px; background: var(--surface); font-size: 14px; font-family: var(--font); color: var(--text); }
.search input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.fchips { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.fchip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 13px; font-weight: 500; font-family: var(--font); padding: 8px 14px; border-radius: 999px; cursor: pointer; transition: all .14s; }
.fchip:hover { border-color: var(--accent); color: var(--text); }
/* Filtre çip ikonları — renkli (aktifken beyaz kalır) */
.fchip i { font-size: 15px; }
.fchip .fc-all { color: var(--accent); }
.fchip .fc-ok { color: var(--green); }
.fchip .fc-no { color: var(--red); }
.fchip .fc-exp { color: var(--amber); }
.fchip.active .fc-all, .fchip.active .fc-ok, .fchip.active .fc-no, .fchip.active .fc-exp { color: #fff; }
.fchip.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.fselect { height: 44px; min-width: 132px; border: 1px solid var(--border-strong); border-radius: 13px; background-color: var(--surface); background-image: linear-gradient(45deg, transparent 50%, #8a96ad 50%), linear-gradient(135deg, #8a96ad 50%, transparent 50%), linear-gradient(135deg, #eef2ff, #fff); background-position: calc(100% - 18px) 19px, calc(100% - 12px) 19px, 0 0; background-size: 6px 6px, 6px 6px, 100% 100%; background-repeat: no-repeat; color: var(--text); font-size: 14px; font-weight: 600; font-family: var(--font); padding: 0 40px 0 14px; cursor: pointer; appearance: none; -webkit-appearance: none; box-shadow: var(--shadow-xs); transition: border-color .14s, box-shadow .14s, background-color .14s; }
.fselect:hover { border-color: #b8c4dd; box-shadow: 0 8px 22px rgba(15,23,42,.08); }
.fselect:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft), var(--shadow-xs); }
.fselect option { color: var(--text); background: #fff; font-weight: 500; }
.native-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
/* Modern özel dropdown (native select yerine) */
.cdrop { position: relative; display: inline-block; }
.cdrop-btn { display: inline-flex; align-items: center; gap: 10px; height: 44px; min-width: 178px; max-width: 100%; padding: 0 12px; border: 1px solid var(--border-strong); border-radius: 14px; background: linear-gradient(135deg, #fff, #f8faff); color: var(--text); font-size: 14px; font-weight: 700; font-family: var(--font); cursor: pointer; box-shadow: var(--shadow-xs); transition: border-color .14s, box-shadow .14s, transform .14s, background .14s; }
.cdrop-btn:hover, .cdrop.open .cdrop-btn { border-color: var(--accent); background: linear-gradient(135deg, #fff, #f4f5ff); }
.cdrop.open .cdrop-btn { box-shadow: 0 0 0 4px var(--accent-soft), 0 12px 28px rgba(79,70,229,.14); }
.cdrop-btn:active { transform: translateY(1px); }
.cdrop-val { flex: 1; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cdrop-arw { font-size: 17px; color: #8a96ad; transition: transform .16s, color .14s; }
.cdrop.open .cdrop-arw { color: var(--accent); }
.cdrop.open .cdrop-arw { transform: rotate(180deg); }
.cdrop-ic { width: 26px; height: 26px; border-radius: 9px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 15px; box-shadow: inset 0 -1px 0 rgba(0,0,0,.08); }
.cdrop-ic.wa { background: #25d366; } .cdrop-ic.tg { background: #29a9eb; } .cdrop-ic.gm { background: #ea4335; } .cdrop-ic.ap { background: #1d1d1f; } .cdrop-ic.gen, .cdrop-ic.sort { background: var(--accent-soft); color: var(--accent); box-shadow: none; }
/* Sıralama menüsü renkli ikonları: Popüler turuncu alev, Ucuz→Pahalı yeşil, Pahalı→Ucuz mavi */
.cdrop-ic.c-pop { background: linear-gradient(135deg, #fb923c, #f97316); }
.cdrop-ic.c-asc { background: linear-gradient(135deg, #34d399, #16a34a); }
.cdrop-ic.c-desc { background: linear-gradient(135deg, #60a5fa, #2563eb); }
.cdrop-menu { position: absolute; top: calc(100% + 8px); left: 0; min-width: 236px; max-height: 320px; overflow-y: auto; background: rgba(255,255,255,.98); border: 1px solid #dfe6f5; border-radius: 16px; box-shadow: 0 20px 48px rgba(15,23,42,.18); padding: 8px; z-index: 70; animation: rise .16s ease both; }
.cdrop-menu::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.75); }
.cdrop-opt { display: flex; align-items: center; gap: 11px; width: 100%; min-height: 42px; padding: 9px 10px; border: none; background: transparent; border-radius: 11px; cursor: pointer; font-size: 14px; font-weight: 600; font-family: var(--font); color: var(--text); text-align: left; transition: background .12s, color .12s, transform .12s; }
.cdrop-opt:hover { background: #f3f5ff; color: var(--accent); }
.cdrop-opt.sel { background: var(--accent-soft); color: var(--accent); font-weight: 750; }
.cdrop-optlbl { flex: 1; }
.cdrop-chk { font-size: 16px; color: var(--accent); }
.cdrop-sort .cdrop-btn { min-width: 164px; }
.cdrop-sort .cdrop-menu { min-width: 190px; }
/* Fiyatlandırma durum seçicisi — kompakt, hücreye sığan premium dropdown (native <select> yerine) */
.cdrop-status { display: block; width: 100%; }
.cdrop-status .cdrop-btn { width: 100%; min-width: 0; height: 40px; font-size: 13px; gap: 8px; padding: 0 10px; border-radius: 11px; }
.cdrop-status .cdrop-menu { min-width: 170px; }
.cdrop-status .cdrop-ic { width: 22px; height: 22px; font-size: 13px; border-radius: 7px; }
.cdrop-ic.cst-open { background: var(--green-soft); color: var(--green); box-shadow: none; }
.cdrop-ic.cst-maint { background: var(--amber-soft); color: var(--amber); box-shadow: none; }
.cdrop-ic.cst-out { background: var(--red-soft); color: var(--red); box-shadow: none; }
.country-sort-custom { flex: 0 0 auto; }

/* Ferah listeler (dip dibe olmasın) */
#ov-active, #active-list, #history-list, #admin-list { display: flex; flex-direction: column; gap: 13px; }
.numrow { padding: 18px 22px; }

/* Admin tablosu */
.admtable { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-xs); }
.admrow { display: grid; grid-template-columns: 1.5fr 1.3fr .9fr .9fr 1fr .9fr .9fr; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--border); font-size: 13px; }
.admrow:last-child { border-bottom: none; }
.admhead .admuser { white-space: nowrap; }
.admhead { background: var(--surface-2); color: var(--text-2); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.admuser { font-weight: 600; display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; overflow: visible; min-width: 0; }
.admuser i { color: var(--muted); flex: 0 0 auto; }
.admuser .ud-bot { flex: 0 1 auto; min-width: 0; }
.admmono { font-family: var(--mono); }
.admcode { font-weight: 700; color: var(--code); }
.admtime { color: var(--muted); font-family: var(--mono); font-size: 12px; }
.tag { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.tag.ok { background: var(--green-soft); color: var(--green); }
.tag.wait { background: var(--blue-soft); color: var(--blue); }
.tag.off { background: var(--surface-2); color: var(--muted); }
.tag.no { background: var(--red-soft); color: var(--red); }
.tag i { font-size: 13px; margin-right: 3px; }
.tag.wa { background: #e7faf0; color: #128a3e; }
.tag.tg { background: #e6f5fd; color: #0d6ea3; }
.tag.gm { background: #fdecec; color: #c0362c; }
.tag.ap { background: #eeeef0; color: #27272a; }
.tag.gen { background: var(--surface-2); color: var(--text-2); }
@media (max-width: 860px) { .admtable { overflow-x: auto; } .admrow { min-width: 700px; } }

/* Yönetim (admin) menüleri — farklı renk */
.nav-label { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #6a7691; padding: 16px 12px 6px; font-weight: 700; }
.nav-item.admin-only { color: #f2b23a; }
.nav-item.admin-only i { color: #f2b23a; }
.nav-item.admin-only:hover { background: rgba(242, 178, 58, .12); color: #ffca57; }
.nav-item.admin-only.active { background: rgba(242, 178, 58, .16); color: #ffd06b; }
.nav-item.admin-only.active i { color: #ffd06b; }

/* Servis kartı fiyatı */
.svc-body { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.25; }
.svc-price { font-size: 12px; color: var(--text-2); font-family: var(--mono); font-weight: 600; margin-top: 1px; }

/* İstatistik: ciro + servis başarı çubuğu */
.stat-ic.indigo { background: var(--accent-soft); color: var(--accent); }
.svc-stat-bar { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-2); font-family: var(--mono); }
.svc-bar { width: 74px; height: 6px; background: var(--surface-2); border-radius: 999px; overflow: hidden; display: inline-block; }
.svc-bar > span { display: block; height: 100%; background: var(--green); border-radius: 999px; }

/* Toast */
.toast { position: fixed; left: 50%; bottom: calc(28px + env(safe-area-inset-bottom)); transform: translateX(-50%) translateY(20px); background: #0f1729; color: #fff; padding: 12px 22px; border-radius: 999px; font-size: 14px; font-weight: 500; box-shadow: var(--shadow-lg); z-index: 320; display: flex; align-items: center; gap: 8px; opacity: 0; transition: opacity .22s, transform .22s; pointer-events: none; }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast .ti { color: #4ade80; }
.spin { display: inline-block; animation: spin .9s linear infinite; }
[hidden] { display: none !important; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes rise { from { transform: translateY(10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.numrow { animation: rise .3s ease both; }
.numrow, .urow, .cmp-card, .ann-item, .led-row {
  contain: layout style;
}

/* Topbar aksiyonları + bildirim çanı */
.topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.topbar-actions .mode { margin-left: 0; }
.notif { position: relative; }
.theme-btn { width: 40px; height: 40px; border-radius: 11px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-xs); transition: border-color .14s, color .14s, transform .08s; }
.theme-btn:hover { border-color: var(--accent); color: var(--accent); }
.theme-btn:active { transform: scale(.92); }
:root[data-theme="dark"] .theme-btn { color: #f5c451; }
.notif-btn { position: relative; width: 40px; height: 40px; border-radius: 11px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-xs); transition: border-color .14s, color .14s; }
.notif-btn:hover { border-color: var(--accent); color: var(--accent); }
.notif-dot { position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--red); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; border: 2px solid var(--bg); }
.notif-panel { position: absolute; right: 0; top: 50px; width: 328px; max-width: 86vw; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); z-index: 70; overflow: hidden; animation: rise .18s ease both; }
.notif-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid var(--border); font-weight: 650; font-size: 14px; }
.notif-head span { display: inline-flex; align-items: center; gap: 7px; }
.notif-read { border: none; background: transparent; color: var(--accent); font-size: 12px; font-weight: 600; cursor: pointer; font-family: var(--font); }
.notif-read:hover { text-decoration: underline; }
.notif-list { max-height: 366px; overflow-y: auto; }
.notif-item { padding: 12px 14px; border-bottom: 1px solid var(--border); }
.notif-item:last-child { border-bottom: none; }
.notif-title { font-weight: 600; font-size: 14px; }
.notif-body { color: var(--text-2); font-size: 13px; margin-top: 3px; word-break: break-word; white-space: pre-wrap; }
.notif-time { color: var(--muted); font-size: 11px; margin-top: 5px; font-family: var(--mono); display: flex; align-items: center; gap: 5px; }
.notif-empty { color: var(--muted); font-size: 13px; text-align: center; padding: 28px 14px; margin: 0; }
.notif-empty i { display: block; font-size: 24px; margin: 0 auto 8px; }

/* Servis kartı durum rozetleri (bakımda / stok yok / yetkiniz yok) */
.service { position: relative; }
.svc-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 999px; letter-spacing: .01em; margin-top: 4px; white-space: nowrap; align-self: flex-start; }
.svc-badge i { font-size: 12px; }
.svc-badge.no { background: var(--red-soft); color: var(--red); }
.svc-badge.maint { background: var(--amber-soft); color: var(--amber); }
.svc-badge.out { background: var(--surface-2); color: var(--text-2); }
.service.unavail .svc-ic { filter: grayscale(1); opacity: .65; }
.service.unavail .svc-name { color: var(--muted); }
.service.unavail { background: var(--surface-2); }

/* Kart yardımcı metni + formlar */
.card-hint { color: var(--text-2); font-size: 13px; margin: 0 0 14px; }
.uc-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.uc-input { flex: 1 1 220px; min-width: 180px; height: 44px; border: 1px solid var(--border-strong); border-radius: 11px; background: var(--surface); color: var(--text); font-size: 14px; font-family: var(--font); padding: 0 14px; }
.uc-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.uc-create-form { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(360px, 1.2fr); gap: 17px 18px; padding-top: 3px; }
.uc-create-field { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.uc-create-label { display: inline-flex; align-items: center; gap: 7px; color: var(--text-2); font-size: 12.5px; font-weight: 750; }
.uc-create-label i { color: var(--accent); font-size: 16px; }
.uc-create-control { position: relative; display: block; }
.uc-create-control > i { position: absolute; z-index: 1; top: 50%; left: 13px; color: var(--muted); font-size: 18px; transform: translateY(-50%); pointer-events: none; }
.uc-create-control .uc-input { width: 100%; min-width: 0; padding-left: 42px; }
.uc-create-token-field { grid-column: 2; grid-row: 1; }
.uc-token-builder { min-height: 48px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; overflow: hidden; border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--border-strong)); border-radius: 13px; background: linear-gradient(105deg, color-mix(in srgb, var(--accent-soft) 50%, var(--surface)), var(--surface) 45%); box-shadow: 0 7px 20px color-mix(in srgb, var(--accent) 6%, transparent); transition: border-color .15s ease, box-shadow .15s ease; }
.uc-token-builder:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 10%, transparent), 0 9px 24px color-mix(in srgb, var(--accent) 8%, transparent); }
.uc-token-builder.token-refreshed { animation: ucTokenPulse .42s ease; }
.uc-token-shield { justify-self: center; color: var(--accent); font-size: 20px; }
.uc-token-input { width: 100%; min-width: 0; height: 46px; border: 0; outline: 0; color: var(--text); background: transparent; font: 750 13px/1 var(--mono); letter-spacing: .35px; user-select: all; }
.uc-token-refresh { align-self: stretch; min-width: 95px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 14px; border: 0; border-left: 1px solid var(--border); color: var(--accent); background: color-mix(in srgb, var(--accent-soft) 36%, var(--surface)); font: 750 12.5px var(--font); cursor: pointer; transition: background .15s ease, color .15s ease; }
.uc-token-refresh:hover { color: #fff; background: var(--accent); }
.uc-token-refresh:active i { transform: rotate(90deg); }
.uc-token-refresh i { font-size: 17px; transition: transform .16s ease; }
.uc-create-help { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 11.5px; line-height: 1.35; }
.uc-create-help i { color: var(--green); font-size: 14px; }
.uc-role-field { grid-column: 1 / -1; }
.uc-role-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.uc-role-choice { --role-tone: var(--blue); --role-soft: var(--blue-soft); min-width: 0; min-height: 68px; display: grid; grid-template-columns: 42px minmax(0, 1fr) 20px; align-items: center; gap: 11px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 14px; color: var(--text); background: var(--surface); font: inherit; text-align: left; cursor: pointer; transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .1s ease; }
.uc-role-choice.admin { --role-tone: var(--amber); --role-soft: var(--amber-soft); }
.uc-role-choice:hover { border-color: color-mix(in srgb, var(--role-tone) 34%, var(--border)); background: color-mix(in srgb, var(--role-soft) 36%, var(--surface)); }
.uc-role-choice:active { transform: scale(.992); }
.uc-role-choice:focus-visible { outline: none; border-color: var(--role-tone); box-shadow: 0 0 0 3px color-mix(in srgb, var(--role-tone) 14%, transparent); }
.uc-role-choice.active { border-color: color-mix(in srgb, var(--role-tone) 48%, var(--border)); background: linear-gradient(110deg, color-mix(in srgb, var(--role-soft) 78%, var(--surface)), var(--surface)); box-shadow: 0 8px 20px color-mix(in srgb, var(--role-tone) 8%, transparent); }
.uc-role-icon { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; color: var(--role-tone); background: var(--role-soft); font-size: 21px; }
.uc-role-choice > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.uc-role-choice b { color: var(--text); font-size: 13.5px; font-weight: 800; }
.uc-role-choice small { overflow: hidden; color: var(--muted); font-size: 11.5px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.uc-role-check { color: var(--role-tone); font-size: 19px; opacity: 0; transform: scale(.72); transition: opacity .14s ease, transform .14s ease; }
.uc-role-choice.active .uc-role-check { opacity: 1; transform: scale(1); }
.uc-create-actions { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 2px; }
.uc-create-actions > span { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 11.5px; line-height: 1.4; }
.uc-create-actions > span i { color: var(--blue); font-size: 15px; }
@keyframes ucTokenPulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 22%, transparent); } 100% { box-shadow: 0 0 0 8px transparent; } }
.ann-form { display: flex; flex-direction: column; gap: 10px; align-items: stretch; }
.ann-form .uc-input, .bal-form .uc-input { flex: 0 0 auto; width: 100%; min-width: 0; }
.ann-form .btn-accent { align-self: flex-start; }
.ann-target-picker { position: relative; width: 100%; z-index: 8; }
.ann-audience-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.ann-audience-choice { --aud-tone: var(--accent); --aud-soft: var(--accent-soft); min-width: 0; min-height: 70px; display: grid; grid-template-columns: 42px minmax(0, 1fr) 20px; align-items: center; gap: 11px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 15px; color: var(--text); background: var(--surface); font: inherit; text-align: left; cursor: pointer; transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .1s ease; }
.ann-audience-choice.one { --aud-tone: var(--blue); --aud-soft: var(--blue-soft); }
.ann-audience-choice:hover { border-color: color-mix(in srgb, var(--aud-tone) 35%, var(--border)); background: color-mix(in srgb, var(--aud-soft) 35%, var(--surface)); }
.ann-audience-choice:active { transform: scale(.993); }
.ann-audience-choice:focus-visible { outline: none; border-color: var(--aud-tone); box-shadow: 0 0 0 3px color-mix(in srgb, var(--aud-tone) 14%, transparent); }
.ann-audience-choice.active { border-color: color-mix(in srgb, var(--aud-tone) 46%, var(--border)); background: linear-gradient(112deg, color-mix(in srgb, var(--aud-soft) 82%, var(--surface)), var(--surface)); box-shadow: 0 8px 20px color-mix(in srgb, var(--aud-tone) 8%, transparent); }
.ann-audience-icon { width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; color: var(--aud-tone); background: var(--aud-soft); font-size: 21px; }
.ann-audience-choice > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ann-audience-choice b { color: var(--text); font-size: 13.5px; font-weight: 800; }
.ann-audience-choice small { overflow: hidden; color: var(--muted); font-size: 11.5px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.ann-audience-check { color: var(--aud-tone); font-size: 19px; opacity: 0; transform: scale(.72); transition: opacity .14s ease, transform .14s ease; }
.ann-audience-choice.active .ann-audience-check { opacity: 1; transform: scale(1); }
.ann-person-picker { position: relative; margin-top: 10px; padding: 10px; border: 1px solid color-mix(in srgb, var(--blue) 17%, var(--border)); border-radius: 15px; background: color-mix(in srgb, var(--blue-soft) 24%, var(--surface)); }
.ann-person-caption { display: inline-flex; align-items: center; gap: 6px; margin: 0 2px 8px; color: var(--text-2); font-size: 11.5px; font-weight: 750; }
.ann-person-caption i { color: var(--blue); font-size: 15px; }
.ann-target-trigger { width: 100%; min-height: 58px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 20px; align-items: center; gap: 11px; padding: 8px 13px; border: 1px solid var(--border-strong); border-radius: 13px; color: var(--text); background: var(--surface); font: inherit; text-align: left; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.ann-target-trigger:hover, .ann-target-picker.open .ann-target-trigger { border-color: var(--accent); background: color-mix(in srgb, var(--accent-soft) 35%, var(--surface)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 9%, transparent); }
.ann-target-trigger:focus-visible, .ann-target-option:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent); }
.ann-target-avatar { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--blue); background: var(--blue-soft); font-size: 19px; }
.ann-target-avatar.all { color: var(--accent); background: var(--accent-soft); }
.ann-target-avatar.admin { color: var(--amber); background: var(--amber-soft); }
.ann-target-avatar.placeholder { color: var(--muted); background: var(--surface-2); }
.ann-target-current, .ann-target-option > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ann-target-current b, .ann-target-option b { min-width: 0; overflow: hidden; color: var(--text); font-size: 13.5px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.ann-target-current small, .ann-target-option small { min-width: 0; overflow: hidden; color: var(--muted); font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.ann-target-arrow { justify-self: end; color: var(--muted); transition: transform .16s ease; }
.ann-target-picker.open .ann-target-arrow { transform: rotate(180deg); }
.ann-target-panel { position: absolute; z-index: 3; top: calc(100% + 7px); left: 10px; right: 10px; padding: 10px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: 0 22px 52px rgba(15,23,42,.18); }
.ann-target-search { height: 42px; display: flex; align-items: center; gap: 9px; padding: 0 11px; border: 1px solid var(--border); border-radius: 11px; color: var(--muted); background: var(--surface-2); }
.ann-target-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ann-target-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--text); background: transparent; font: 500 13px var(--font); }
.ann-target-list { max-height: 292px; overflow: auto; display: grid; gap: 5px; margin-top: 8px; padding-right: 2px; overscroll-behavior: contain; }
.ann-target-option { width: 100%; min-height: 54px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 20px; align-items: center; gap: 10px; padding: 7px 9px; border: 1px solid transparent; border-radius: 11px; color: var(--text); background: transparent; font: inherit; text-align: left; cursor: pointer; }
.ann-target-option:hover { border-color: var(--border); background: var(--surface-2); }
.ann-target-option.selected { border-color: color-mix(in srgb, var(--accent) 25%, var(--border)); background: var(--accent-soft); }
.ann-target-check { justify-self: end; color: var(--accent); font-size: 18px; }
.ann-target-empty { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 82px; margin: 0; color: var(--muted); font-size: 12.5px; }
.uc-textarea { min-height: 92px; border: 1px solid var(--border-strong); border-radius: 11px; background: var(--surface); color: var(--text); font-size: 14px; font-family: var(--font); padding: 12px 14px; resize: vertical; }
.uc-textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }

/* Kullanıcı kartları */
#users-list { display: flex; flex-direction: column; gap: 13px; }
.usercard { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 16px 18px; box-shadow: var(--shadow-xs); }
.usercard.frozen { border-left: 4px solid var(--red); background: linear-gradient(90deg, var(--red-soft), var(--surface) 30%); }
.uc-top { display: flex; align-items: center; gap: 12px; }
.uc-avatar { width: 42px; height: 42px; border-radius: 12px; background: var(--accent-soft); color: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 22px; flex: 0 0 auto; }
.uc-idbox { flex: 1; min-width: 0; }
.uc-name { font-weight: 650; font-family: var(--mono); font-size: 14px; word-break: break-all; }
.uc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.urole { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: var(--surface-2); color: var(--text-2); }
.urole i { font-size: 12px; }
.urole.admin { background: #fef3e2; color: #b26a00; }
.urole.froz { background: var(--red-soft); color: var(--red); }
.urole.unlim { background: var(--accent-soft); color: var(--accent); }
.ubtn.pf-unlim.on { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.uc-meta { color: var(--muted); font-size: 12px; margin-top: 5px; font-family: var(--mono); }
.uc-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 13px; }
.ubtn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 13px; font-weight: 600; font-family: var(--font); padding: 8px 13px; border-radius: 9px; cursor: pointer; transition: all .14s; }
.ubtn:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
/* Pasif buton: soluk, tıklanamaz, hover YOK — aktifle karışmasın. */
.ubtn:disabled { opacity: .38; cursor: not-allowed; border-color: var(--line); color: var(--muted); background: transparent; box-shadow: none; }
.ubtn i { font-size: 16px; }
.ubtn.udel:hover { border-color: var(--red); color: var(--red); }

/* Renkli, kaliteli profil butonları — her işlem kendi renginde */
.ubtn.ub-blue   { background: var(--blue-soft);   color: var(--blue);   border-color: transparent; }
.ubtn.ub-blue:hover   { background: #dbe7ff; color: var(--blue);   border-color: transparent; box-shadow: 0 7px 16px rgba(37,99,235,.20);  transform: translateY(-1px); }
.ubtn.ub-slate  { background: var(--surface-2);   color: var(--text-2); border-color: var(--border); }
.ubtn.ub-slate:hover  { background: #e9edf4; color: var(--text-2); border-color: var(--border-strong); box-shadow: 0 7px 16px rgba(85,96,116,.16); transform: translateY(-1px); }
.ubtn.ub-amber  { background: var(--amber-soft);  color: var(--amber);  border-color: transparent; }
.ubtn.ub-amber:hover  { background: #fde5c8; color: var(--amber);  border-color: transparent; box-shadow: 0 7px 16px rgba(217,119,6,.22);  transform: translateY(-1px); }
.ubtn.ub-green  { background: var(--green-soft);  color: var(--green);  border-color: transparent; }
.ubtn.ub-green:hover  { background: #d3f1de; color: var(--green);  border-color: transparent; box-shadow: 0 7px 16px rgba(22,163,74,.22);  transform: translateY(-1px); }
.ubtn.ub-violet { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.ubtn.ub-violet:hover { background: #e1e3fd; color: var(--accent); border-color: transparent; box-shadow: 0 7px 16px rgba(79,70,229,.24);  transform: translateY(-1px); }
.ubtn.ub-red    { background: var(--red-soft);    color: var(--red);    border-color: transparent; }
.ubtn.ub-red:hover    { background: #fbd7d7; color: var(--red);    border-color: transparent; box-shadow: 0 7px 16px rgba(220,38,38,.22);  transform: translateY(-1px); }
.ubtn.ub-toggle { background: var(--surface-2); color: var(--text-2); border-color: var(--border); }
.ubtn.ub-toggle:hover { background: #e9edf4; color: var(--text-2); border-color: var(--border-strong); transform: translateY(-1px); }
.ubtn.ub-toggle.on { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.ubtn.ub-toggle.on:hover { background: #e1e3fd; color: var(--accent); border-color: transparent; box-shadow: 0 7px 16px rgba(79,70,229,.24); transform: translateY(-1px); }
.copy-ok { border-color: rgba(22,163,74,.25) !important; background: var(--green-soft) !important; color: var(--green) !important; animation: copyPop .42s ease both; }
.copy-ok i { color: var(--green) !important; }
.ibtn.copy-ok { box-shadow: inset 0 0 0 1px rgba(22,163,74,.18); }
.numrow-act.copy-ok { box-shadow: inset 0 0 0 1px rgba(22,163,74,.18); animation: none; transform: none; }
.numrow-act.copy-fail { box-shadow: inset 0 0 0 1px rgba(220,38,38,.18); animation: none; transform: none; }
.copy-fail { border-color: rgba(220,38,38,.25) !important; background: var(--red-soft) !important; color: var(--red) !important; animation: copyPop .42s ease both; }
.copy-fail i { color: var(--red) !important; }
@keyframes copyPop { 0% { transform: scale(.96); } 55% { transform: scale(1.04); } 100% { transform: scale(1); } }
.uc-block { margin-top: 13px; border-top: 1px dashed var(--border-strong); padding-top: 12px; }
.uc-block-lbl { font-size: 12px; color: var(--text-2); font-weight: 600; display: block; margin-bottom: 8px; }
.ublocks { display: flex; gap: 7px; flex-wrap: wrap; }
.ublock { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 12.5px; font-weight: 600; font-family: var(--font); padding: 6px 11px; border-radius: 999px; cursor: pointer; transition: all .13s; }
.ublock i { font-size: 14px; }
.ublock:hover { border-color: var(--accent); color: var(--accent); }
.ublock.on { background: var(--red-soft); color: var(--red); border-color: transparent; }
.ublock.on:hover { filter: brightness(.97); color: var(--red); }

/* Ayarlar: servis durumu satırları */
.svcstat-row { display: flex; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.svcstat-row:last-child { border-bottom: none; }
.svcstat-name { font-weight: 600; }
.svcstat-opts { display: inline-flex; gap: 6px; margin-left: auto; flex-wrap: wrap; }
.ssopt { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 13px; font-weight: 600; font-family: var(--font); padding: 7px 13px; border-radius: 999px; cursor: pointer; transition: all .13s; }
.ssopt i { font-size: 15px; }
.ssopt:hover { border-color: var(--accent); color: var(--text); }
.ssopt.ss-open.active { background: var(--green-soft); color: var(--green); border-color: transparent; }
.ssopt.ss-maintenance.active { background: var(--amber-soft); color: var(--amber); border-color: transparent; }
.ssopt.ss-out.active { background: var(--red-soft); color: var(--red); border-color: transparent; }
.cty-mini-flag { width: 26px; height: 20px; border-radius: 4px; object-fit: cover; flex: 0 0 auto; box-shadow: var(--shadow-xs); }

/* Ülke durum rozeti + sipariş ızgarasında boş durum */
.country { position: relative; }
.cty-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 999px; margin-top: 4px; white-space: nowrap; align-self: flex-start; }
.cty-badge i { font-size: 12px; }
.cty-badge.maint { background: var(--amber-soft); color: var(--amber); }
.cty-badge.out { background: var(--surface-2); color: var(--text-2); }
.country.unavail { background: var(--surface-2); }
.country.unavail .country-flag { filter: grayscale(1); opacity: .6; }
.country.unavail .country-name { color: var(--muted); }
.empty-inline { color: var(--text-2); font-size: 14px; background: var(--surface-2); border: 1.5px dashed var(--border-strong); border-radius: 12px; padding: 18px; text-align: center; margin: 0; }
.empty-inline i { color: var(--muted); margin-right: 6px; }

/* Fiyatlandırma satırları */
.price-row { display: flex; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.price-row:last-child { border-bottom: none; }
.price-name { font-weight: 600; }
.price-edit { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; }
.price-cur { color: var(--text-2); font-weight: 600; font-family: var(--mono); }
.price-input { width: 92px; height: 40px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--surface); color: var(--text); font-size: 14px; font-family: var(--mono); font-weight: 600; padding: 0 12px; text-align: right; }
.price-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.price-save { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 13px; font-weight: 600; font-family: var(--font); padding: 8px 14px; border-radius: 10px; cursor: pointer; transition: all .13s; }
.price-save:hover { border-color: var(--accent); color: var(--accent); }

/* Modal — kullanıcı detay */
.modal { position: fixed; inset: 0; z-index: 90; display: flex; align-items: center; justify-content: center; padding: 20px; }
.modal-scrim { position: absolute; inset: 0; background: rgba(15,23,42,.5); }
.modal-card { position: relative; background: var(--surface); border-radius: 18px; box-shadow: var(--shadow-lg); width: 100%; max-width: 760px; max-height: 86vh; overflow-y: auto; padding: 22px 24px; animation: rise .2s ease both; }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.modal-title { font-size: 19px; display: inline-flex; align-items: center; gap: 9px; word-break: break-all; }
.modal-title i { color: var(--accent); }
.modal-htext .uc-tags { margin-top: 8px; }
.modal-x { border: 1px solid var(--border); background: var(--surface); color: var(--text-2); width: 38px; height: 38px; border-radius: 10px; cursor: pointer; font-size: 20px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.modal-x:hover { border-color: var(--red); color: var(--red); }
/* --- Premium "stok yok" popup'ı (stock2) --- */
.modal-card:has(.stock2) { max-width: 460px; }
.stock2 { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 2px 2px 4px; }
.stock2-art { width: 210px; max-width: 76%; margin: 2px auto 4px; }
.stock2-svg { width: 100%; height: auto; display: block; animation: stock2Float 3.4s ease-in-out infinite; }
@keyframes stock2Float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.stock2-title { font-size: 20px; font-weight: 850; letter-spacing: -.01em; color: var(--text); margin: 6px 0 0; }
.stock2-sub { font-size: 13.5px; line-height: 1.55; color: var(--text-2); margin: 8px 0 0; max-width: 340px; }
.stock2-chip { display: inline-flex; align-items: center; gap: 9px; margin: 16px 0 4px; padding: 8px 15px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); }
.stock2-chip .svc-mini-ic { width: 24px; height: 24px; flex: 0 0 auto; }
.stock2-chip-txt { font-size: 13px; font-weight: 750; color: var(--text); white-space: nowrap; }
.stock2-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--muted); flex: 0 0 auto; }
.stock2-flag { width: 24px; height: 18px; border-radius: 4px; object-fit: cover; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(15,23,42,.1); }
.stock2-actions { display: flex; flex-direction: column; gap: 10px; width: 100%; margin-top: 18px; }
.stock2-btn { display: flex; align-items: center; gap: 13px; width: 100%; text-align: left; padding: 13px 16px; border-radius: 15px; border: 1px solid transparent; cursor: pointer; font-family: var(--font); transition: transform .14s, box-shadow .14s, background .14s; }
.stock2-btn-ic { width: 40px; height: 40px; flex: 0 0 auto; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 21px; }
.stock2-btn-txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.stock2-btn-txt b { font-size: 15px; font-weight: 800; }
.stock2-btn-txt small { font-size: 12px; opacity: .8; }
.stock2-arw { font-size: 18px; flex: 0 0 auto; opacity: .55; }
.stock2-btn.primary { background: linear-gradient(135deg, #6366f1, #4f46e5); color: #fff; box-shadow: 0 12px 26px rgba(79,70,229,.32); }
.stock2-btn.primary .stock2-btn-ic { background: rgba(255,255,255,.18); color: #fff; }
.stock2-btn.primary:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(79,70,229,.4); background: linear-gradient(135deg, #6d6ff6, #4338ca); }
.stock2-btn.ghost { background: var(--surface-2); border-color: var(--border-strong); color: var(--text); }
.stock2-btn.ghost .stock2-btn-ic { background: var(--accent-soft); color: var(--accent); }
.stock2-btn.ghost:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(15,23,42,.1); border-color: var(--accent); }
.stock2-btn:active { transform: translateY(0) scale(.99); }
.ud-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.ud-list { border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.ud-row { display: grid; grid-template-columns: 1.4fr .9fr .9fr 1fr .9fr .9fr; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--border); font-size: 13px; }
.ud-row:last-child { border-bottom: none; }
.ud-head { background: var(--surface-2); color: var(--text-2); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
@media (max-width: 860px) { .ud-stats { grid-template-columns: repeat(2, 1fr); } .ud-list { overflow-x: auto; } .ud-row { min-width: 560px; } }

/* Siparişler başlık sağ (CSV indir) */
.sec-right { display: inline-flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.pdf-btn i { color: var(--red); }

/* Onay / limit modalı + tehlike butonu */
.btn-danger { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--red); color: #fff; border: none; border-radius: 12px; padding: 12px 22px; font-size: 14px; font-weight: 600; font-family: var(--font); cursor: pointer; box-shadow: 0 6px 16px rgba(220,38,38,.28); transition: filter .15s, transform .12s; }
.btn-danger:hover { filter: brightness(1.06); transform: translateY(-1px); }
.btn-danger:active { transform: scale(.98); }
.confirm-msg { color: var(--text-2); font-size: 14.5px; line-height: 1.55; margin: 4px 0 22px; white-space: pre-wrap; }
.confirm-actions { display: flex; gap: 10px; justify-content: flex-end; }
.confirm-actions .ubtn, .confirm-actions .btn-accent, .confirm-actions .btn-danger { min-width: 108px; justify-content: center; }

/* Bakiye yükleme (top-up) modalı */
.modal-card:has(.topup) { max-width: 500px; }
.topup { display: flex; flex-direction: column; gap: 16px; }
.topup-hero { display: flex; align-items: center; gap: 14px; background: linear-gradient(135deg, #27155d 0%, #4b1f86 100%); border-radius: 14px; padding: 18px 20px; color: #fff; }
.topup-hero.pay-hero { background: linear-gradient(135deg, #064e3b 0%, #0f766e 100%); }
.pay-owed { display: flex; align-items: center; gap: 15px; margin-top: 14px; padding: 14px 18px; border-radius: 14px; background: linear-gradient(135deg, #fff7ed, #ffedd5); border: 1px solid #fed7aa; }
.pay-owed-n { flex: 0 0 auto; min-width: 52px; height: 52px; padding: 0 10px; border-radius: 14px; background: linear-gradient(135deg, #fb923c, #ea580c); color: #fff; font-size: 26px; font-weight: 800; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 14px rgba(234,88,12,.3); }
.pay-owed-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pay-owed-t b { font-size: 14.5px; color: #9a3412; }
.pay-owed-t small { font-size: 12.5px; color: #c2410c; line-height: 1.45; }
.topup-hero-ic { width: 46px; height: 46px; border-radius: 12px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.16); font-size: 26px; color: #fff; }
.topup-hero-ic.crypto svg { width: 34px; height: 34px; display: block; }
.topup-hero-ic.tether { color: #5eead4; box-shadow: inset 0 0 0 1px rgba(94,234,212,.24); }
.topup-hero-ic.tether i { display: none; }
.topup-hero-ic.tether::before { content: "₮"; font-family: var(--mono); font-size: 26px; font-weight: 900; line-height: 1; }
.topup-hero-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.topup-hero-txt b { font-size: 16px; font-weight: 700; }
.topup-hero-txt small { font-size: 12.5px; opacity: .88; }
.topup-contact { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 16px 18px; }
.topup-contact-l { display: flex; flex-direction: column; gap: 3px; }
.topup-contact-lbl { font-size: 11px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }
.topup-handle { font-size: 22px; font-weight: 800; color: var(--accent); font-family: var(--mono); }
.topup-contact-actions { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.topup-tg { padding: 10px 16px; text-decoration: none; }
.topup-steps { display: flex; flex-direction: column; gap: 11px; }
.topup-step { display: flex; align-items: flex-start; gap: 12px; }
.topup-step-n { width: 26px; height: 26px; border-radius: 50%; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; background: var(--accent-soft); color: var(--accent); }
.topup-step-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.topup-step-t b { font-size: 14px; font-weight: 650; color: var(--text); }
.topup-step-t small { font-size: 12.5px; color: var(--text-2); line-height: 1.35; }
.topup-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 2px; }
.topup-coins { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.topup-coin { width: 42px; height: 42px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; background: #fff; padding: 5px; box-shadow: var(--shadow-xs); overflow: hidden; }
.topup-coin.usdt { border-color: #99f6e4; background: #ecfdf5; }
.topup-coin.tron { border-color: #fecaca; background: #fff1f2; }
.topup-coin.btc { border-color: #fed7aa; background: #fff7ed; }
.topup-coin svg { width: 100%; height: 100%; display: block; }
.topup-coin i, .topup-coin::before { display: none; content: none; }
.topup-rate { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 36px; padding: 8px 14px; border-radius: 999px; color: #16a34a; background: #dcfce7; font-size: 12.5px; font-weight: 800; white-space: nowrap; }
.topup-rate i { font-size: 17px; color: #16a34a; }

/* Numara alınıyor animasyonu v2 — telefon + radar + SIM + adımlar (mobil + PC) */
.order-overlay { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; background: radial-gradient(80% 80% at 50% 30%, rgba(49,46,129,.92), rgba(15,23,42,.96)); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); animation: oo-fade .22s ease; padding: 24px; }
.order-overlay > [data-order-scene] { display: none; }
.order-overlay[data-mode="classic"] > .oo2, .order-overlay[data-mode="modern"] > .oo3 { display: block; }
@keyframes oo-bounce { 0%,100% { transform: translateY(0); opacity: .4; } 50% { transform: translateY(-8px); opacity: 1; } }
@keyframes oo-fade { from { opacity: 0; } to { opacity: 1; } }
.oo2 { text-align: center; color: #fff; max-width: 380px; width: 100%; }
.oo2-stage { position: relative; width: 210px; height: 190px; margin: 0 auto 10px; }
.oo2-ring { position: absolute; left: 50%; top: 52%; width: 150px; height: 150px; margin: -75px 0 0 -75px; border-radius: 50%; border: 1.5px solid rgba(165,180,252,.5); animation: oo2-ring 2.6s ease-out infinite; }
.oo2-ring.r2 { animation-delay: .85s; }
.oo2-ring.r3 { animation-delay: 1.7s; }
@keyframes oo2-ring { 0% { transform: scale(.5); opacity: .9; } 80% { opacity: .12; } 100% { transform: scale(1.5); opacity: 0; } }
.oo2-orbit { position: absolute; left: 50%; top: 52%; width: 178px; height: 178px; margin: -89px 0 0 -89px; border-radius: 50%; animation: oo2-spin 5.5s linear infinite; }
@keyframes oo2-spin { to { transform: rotate(360deg); } }
.oo2-sat { position: absolute; top: -11px; left: 50%; margin-left: -11px; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(150deg, #22d3ee, #0ea5e9); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; box-shadow: 0 0 16px rgba(34,211,238,.7); }
.oo2-phone { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 88px; height: 158px; border-radius: 22px; background: linear-gradient(160deg, #1f2544, #131a30); border: 2.5px solid rgba(165,180,252,.65); box-shadow: 0 18px 50px rgba(0,0,0,.5), 0 0 34px rgba(99,102,241,.35), inset 0 0 14px rgba(99,102,241,.22); animation: oo2-float 3.2s ease-in-out infinite; z-index: 3; }
@keyframes oo2-float { 0%,100% { transform: translate(-50%, -50%); } 50% { transform: translate(-50%, calc(-50% - 7px)); } }
.oo2-notch { position: absolute; top: 7px; left: 50%; transform: translateX(-50%); width: 30px; height: 5px; border-radius: 4px; background: rgba(165,180,252,.5); }
.oo2-homebar { position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%); width: 26px; height: 3.5px; border-radius: 3px; background: rgba(165,180,252,.4); }
.oo2-screen { position: absolute; inset: 17px 8px 14px; border-radius: 12px; background: linear-gradient(170deg, rgba(99,102,241,.25), rgba(30,27,75,.5)); overflow: hidden; }
.oo2-line { position: absolute; left: 10px; right: 10px; height: 6px; border-radius: 4px; background: rgba(255,255,255,.22); }
.oo2-line.l1 { top: 14px; width: 55%; animation: oo2-blink 2.4s ease-in-out infinite; }
.oo2-line.l2 { top: 30px; animation: oo2-blink 2.4s ease-in-out .3s infinite; }
.oo2-line.l3 { top: 46px; width: 70%; animation: oo2-blink 2.4s ease-in-out .6s infinite; }
@keyframes oo2-blink { 0%,100% { opacity: .18; } 50% { opacity: .5; } }
.oo2-scan { position: absolute; left: 0; right: 0; top: -40%; height: 42%; background: linear-gradient(180deg, transparent, rgba(129,140,248,.45), transparent); animation: oo2-scan 2.1s ease-in-out infinite; }
@keyframes oo2-scan { 0% { top: -45%; } 55% { top: 105%; } 100% { top: 105%; } }
.oo2-sim { position: absolute; left: 50%; top: 50%; z-index: 4; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(150deg, #fbbf24, #f59e0b); color: #78350f; display: inline-flex; align-items: center; justify-content: center; font-size: 19px; box-shadow: 0 8px 22px rgba(245,158,11,.5); animation: oo2-sim 2.8s ease-in-out infinite; }
@keyframes oo2-sim {
  0%   { transform: translate(-140px, -86px) rotate(-14deg) scale(.9); opacity: 0; }
  22%  { transform: translate(-70px, -50px) rotate(-7deg) scale(1); opacity: 1; }
  48%  { transform: translate(-17px, -17px) rotate(0) scale(.72); opacity: 1; }
  60%  { transform: translate(-17px, -17px) scale(.5); opacity: 0; }
  100% { transform: translate(-17px, -17px) scale(.5); opacity: 0; }
}
.oo2-chip { position: absolute; width: 30px; height: 30px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; color: #fff; z-index: 2; }
.oo2-chip.c1 { right: 8px; top: 26px; background: linear-gradient(150deg, #34d399, #059669); box-shadow: 0 6px 18px rgba(16,185,129,.45); animation: oo2-bob 3.4s ease-in-out infinite; }
.oo2-chip.c2 { left: 4px; bottom: 22px; background: linear-gradient(150deg, #818cf8, #4f46e5); box-shadow: 0 6px 18px rgba(79,70,229,.45); animation: oo2-bob 3.4s ease-in-out 1.2s infinite; }
@keyframes oo2-bob { 0%,100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-9px) rotate(5deg); } }
.oo2-spark { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #fff; opacity: 0; animation: oo2-spark 2.2s ease-in-out infinite; }
.oo2-spark.s1 { left: 14%; top: 22%; } .oo2-spark.s2 { left: 84%; top: 14%; animation-delay: .4s; } .oo2-spark.s3 { left: 90%; top: 62%; animation-delay: .9s; }
.oo2-spark.s4 { left: 8%; top: 68%; animation-delay: 1.3s; } .oo2-spark.s5 { left: 26%; top: 6%; animation-delay: 1.7s; } .oo2-spark.s6 { left: 68%; top: 88%; animation-delay: .6s; }
@keyframes oo2-spark { 0%,100% { opacity: 0; transform: scale(.4); } 50% { opacity: .95; transform: scale(1.25); } }
.oo2-title { font-size: 21px; font-weight: 750; letter-spacing: -.01em; margin-top: 6px; }
.oo2-sub { font-size: 13.5px; opacity: .8; margin-top: 5px; }
.oo2-steps { display: flex; align-items: center; justify-content: center; gap: 7px; flex-wrap: wrap; margin-top: 16px; }
.oo2-step { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 650; padding: 7px 12px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.55); }
.oo2-step i { font-size: 14px; }
.oo2-step.st1 { animation: oo2-step 4.5s ease-in-out infinite; }
.oo2-step.st2 { animation: oo2-step 4.5s ease-in-out 1.5s infinite; }
.oo2-step.st3 { animation: oo2-step 4.5s ease-in-out 3s infinite; }
@keyframes oo2-step { 0%,100% { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); color: rgba(255,255,255,.55); } 18%,42% { background: rgba(99,102,241,.45); border-color: rgba(165,180,252,.75); color: #fff; } }
.oo2-bar { width: min(300px, 82%); height: 6px; border-radius: 6px; margin: 18px auto 0; background: rgba(255,255,255,.14); overflow: hidden; }
.oo2-fill { display: block; height: 100%; width: 46%; border-radius: 6px; background: linear-gradient(90deg, #818cf8, #a78bfa, #22d3ee, #818cf8); background-size: 220% 100%; animation: oo2-fill 2.3s ease-in-out infinite; }
@keyframes oo2-fill { 0% { margin-left: -48%; background-position: 0 0; } 100% { margin-left: 102%; background-position: 220% 0; } }
@media (max-width: 600px) {
  .oo2-stage { width: 190px; height: 176px; }
  .oo2-title { font-size: 18.5px; }
  .oo2-step { font-size: 11px; padding: 6px 10px; }
}

/* Numara alınıyor animasyonu v3 — Modern sinyal laboratuvarı.
   Telefon/radar sahnesinden tamamen ayrı: servis düğümleri, güvenli SIM çekirdeği ve ülke eşleşmesi. */
.order-overlay[data-mode="modern"] {
  --oo3-text: #102a56;
  --oo3-muted: #5d7395;
  --oo3-line: rgba(37,99,235,.2);
  --oo3-glass: rgba(255,255,255,.72);
  --oo3-core: #2563eb;
  --oo3-core-2: #06b6d4;
  background:
    radial-gradient(circle at 50% 34%, rgba(56,189,248,.26), transparent 28%),
    radial-gradient(circle at 12% 16%, rgba(99,102,241,.14), transparent 26%),
    radial-gradient(circle at 88% 82%, rgba(16,185,129,.14), transparent 28%),
    linear-gradient(145deg, rgba(247,251,255,.98), rgba(229,241,255,.98));
}
:root[data-theme="dark"] .order-overlay[data-mode="modern"] {
  --oo3-text: #eef7ff;
  --oo3-muted: #93a9c8;
  --oo3-line: rgba(56,189,248,.22);
  --oo3-glass: rgba(8,22,48,.72);
  --oo3-core: #3b82f6;
  --oo3-core-2: #22d3ee;
  background:
    radial-gradient(circle at 50% 34%, rgba(14,165,233,.2), transparent 28%),
    radial-gradient(circle at 12% 16%, rgba(79,70,229,.22), transparent 26%),
    radial-gradient(circle at 88% 82%, rgba(16,185,129,.13), transparent 28%),
    linear-gradient(145deg, rgba(3,10,27,.98), rgba(7,22,48,.98));
}
.oo3 { width: min(510px, 100%); color: var(--oo3-text); text-align: center; }
.oo3-stage { position: relative; width: min(440px, 100%); height: 292px; margin: 0 auto 10px; isolation: isolate; }
.oo3-grid { position: absolute; inset: 18px 8px 0; border-radius: 34px; overflow: hidden; opacity: .58; transform: perspective(420px) rotateX(58deg) translateY(70px) scale(1.08); transform-origin: center bottom; background-image: linear-gradient(var(--oo3-line) 1px, transparent 1px), linear-gradient(90deg, var(--oo3-line) 1px, transparent 1px); background-size: 28px 28px; mask-image: radial-gradient(ellipse at center, #000 15%, transparent 72%); animation: oo3-grid 4s linear infinite; }
@keyframes oo3-grid { to { background-position: 0 28px, 28px 0; } }
.oo3-wave { position: absolute; left: 6%; right: 6%; top: 42%; height: 86px; border-top: 2px solid color-mix(in srgb, var(--oo3-core-2) 60%, transparent); border-radius: 50%; opacity: .45; filter: drop-shadow(0 0 7px color-mix(in srgb, var(--oo3-core-2) 45%, transparent)); animation: oo3-wave 3.2s ease-in-out infinite; }
.oo3-wave.wave-b { top: 47%; transform: scaleX(.84) rotate(180deg); opacity: .25; animation-delay: -1.6s; }
@keyframes oo3-wave { 0%,100% { clip-path: inset(0 100% 0 0); transform: translateY(8px) scaleY(.75); } 45%,70% { clip-path: inset(0 0 0 0); transform: translateY(-3px) scaleY(1.12); } }
.oo3-beam { position: absolute; z-index: 0; left: 50%; top: 42%; width: 180px; height: 1px; transform-origin: left center; background: linear-gradient(90deg, color-mix(in srgb, var(--oo3-core-2) 80%, transparent), transparent); animation: oo3-beam 2.8s ease-in-out infinite; }
.oo3-beam.beam-a { transform: rotate(25deg); }
.oo3-beam.beam-b { transform: rotate(155deg); animation-delay: -1.4s; }
@keyframes oo3-beam { 0%,100% { opacity: .08; width: 60px; } 50% { opacity: .65; width: 190px; } }
.oo3-core { position: absolute; z-index: 4; left: 50%; top: 42%; width: 112px; height: 112px; transform: translate(-50%,-50%); border-radius: 30px; background: linear-gradient(145deg, color-mix(in srgb, var(--oo3-core) 88%, #fff), var(--oo3-core-2)); box-shadow: 0 26px 70px color-mix(in srgb, var(--oo3-core) 32%, transparent), inset 0 1px 0 rgba(255,255,255,.55); animation: oo3-core 2.8s ease-in-out infinite; }
.oo3-core::before, .oo3-core::after { content: ""; position: absolute; inset: -14px; border: 1px solid color-mix(in srgb, var(--oo3-core) 38%, transparent); border-radius: 39px; animation: oo3-frame 3s ease-in-out infinite; }
.oo3-core::after { inset: -29px; border-style: dashed; opacity: .48; animation-delay: -1.5s; }
@keyframes oo3-core { 0%,100% { transform: translate(-50%,-50%) rotate(-2deg); } 50% { transform: translate(-50%,calc(-50% - 8px)) rotate(2deg); } }
@keyframes oo3-frame { 0%,100% { transform: scale(.94); opacity: .25; } 50% { transform: scale(1.06); opacity: .85; } }
.oo3-core-face.front { position: absolute; inset: 12px; border-radius: 21px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; color: #fff; background: linear-gradient(155deg, rgba(255,255,255,.23), rgba(2,6,23,.08)); border: 1px solid rgba(255,255,255,.3); overflow: hidden; }
.oo3-core-face.front i { font-size: 35px; filter: drop-shadow(0 7px 12px rgba(3,7,18,.2)); }
.oo3-core-face.front small { font-size: 7px; font-weight: 900; letter-spacing: .16em; opacity: .8; }
.oo3-core-face.back { position: absolute; inset: 20px -8px -8px 20px; z-index: -1; border-radius: 25px; background: color-mix(in srgb, var(--oo3-core) 28%, transparent); filter: blur(7px); }
.oo3-core-scan { position: absolute; z-index: 2; left: 14px; right: 14px; top: 17px; height: 2px; border-radius: 3px; background: #fff; box-shadow: 0 0 14px #fff; animation: oo3-scan 1.9s ease-in-out infinite; }
@keyframes oo3-scan { 0%,100% { top: 17px; opacity: .2; } 50% { top: 92px; opacity: .9; } }
.oo3-app { position: absolute; z-index: 3; width: 43px; height: 43px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 23px; border: 1px solid rgba(255,255,255,.5); box-shadow: 0 13px 32px rgba(15,23,42,.2); opacity: 0; }
.oo3-app.app-wa { left: 22px; top: 48px; background: linear-gradient(145deg,#34d399,#16a34a); animation: oo3-app-wa 5.2s ease-in-out infinite; }
.oo3-app.app-tg { right: 21px; top: 61px; background: linear-gradient(145deg,#38bdf8,#0284c7); animation: oo3-app-tg 5.2s ease-in-out .55s infinite; }
.oo3-app.app-gm { left: 58px; bottom: 39px; background: linear-gradient(145deg,#fb7185,#dc2626); animation: oo3-app-gm 5.2s ease-in-out 1.1s infinite; }
.oo3-app.app-ap { right: 58px; bottom: 32px; background: linear-gradient(145deg,#52525b,#18181b); animation: oo3-app-ap 5.2s ease-in-out 1.65s infinite; }
@keyframes oo3-app-wa { 0%,12% { transform: translate(155px,75px) scale(.2) rotate(24deg); opacity: 0; } 30%,76% { transform: translate(0,0) scale(1) rotate(-4deg); opacity: 1; } 92%,100% { transform: translate(-24px,-10px) scale(.78); opacity: 0; } }
@keyframes oo3-app-tg { 0%,12% { transform: translate(-155px,64px) scale(.2) rotate(-24deg); opacity: 0; } 30%,76% { transform: translate(0,0) scale(1) rotate(4deg); opacity: 1; } 92%,100% { transform: translate(24px,-10px) scale(.78); opacity: 0; } }
@keyframes oo3-app-gm { 0%,12% { transform: translate(120px,-62px) scale(.2) rotate(20deg); opacity: 0; } 30%,76% { transform: translate(0,0) scale(1) rotate(-5deg); opacity: 1; } 92%,100% { transform: translate(-18px,15px) scale(.78); opacity: 0; } }
@keyframes oo3-app-ap { 0%,12% { transform: translate(-120px,-62px) scale(.2) rotate(-20deg); opacity: 0; } 30%,76% { transform: translate(0,0) scale(1) rotate(5deg); opacity: 1; } 92%,100% { transform: translate(18px,15px) scale(.78); opacity: 0; } }
.oo3-data { position: absolute; z-index: 2; left: 50%; top: 42%; width: 6px; height: 6px; margin: -3px; border-radius: 50%; background: var(--oo3-core-2); box-shadow: 0 0 12px var(--oo3-core-2); animation: oo3-data 2.4s ease-out infinite; }
.oo3-data.d2 { animation-delay: .6s; --dx: 150px; --dy: -80px; }
.oo3-data.d3 { animation-delay: 1.2s; --dx: -130px; --dy: 85px; }
.oo3-data.d4 { animation-delay: 1.8s; --dx: 125px; --dy: 92px; }
.oo3-data.d1 { --dx: -150px; --dy: -72px; }
@keyframes oo3-data { 0% { transform: translate(0,0) scale(.3); opacity: 0; } 18% { opacity: 1; } 82% { opacity: .8; } 100% { transform: translate(var(--dx),var(--dy)) scale(1.15); opacity: 0; } }
.oo3-identity { position: absolute; z-index: 5; left: 50%; bottom: 1px; transform: translateX(-50%); min-width: 240px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 9px 12px; border: 1px solid color-mix(in srgb, var(--oo3-core) 22%, transparent); border-radius: 17px; color: var(--oo3-text); background: var(--oo3-glass); box-shadow: 0 18px 46px rgba(15,23,42,.12); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); animation: oo3-identity 2.5s ease-in-out infinite; }
@keyframes oo3-identity { 0%,100% { transform: translateX(-50%) translateY(2px); } 50% { transform: translateX(-50%) translateY(-3px); } }
.oo3-service, .oo3-country { display: inline-flex; align-items: center; justify-content: center; }
.oo3-service { width: 35px; height: 35px; border-radius: 11px; color: #fff; font-size: 20px; background: var(--oo3-core); box-shadow: 0 9px 20px color-mix(in srgb, var(--oo3-core) 25%, transparent); }
.oo3-service.wa { background: #25d366; } .oo3-service.tg { background: #229ed9; } .oo3-service.gm { background: #ea4335; } .oo3-service.ap { background: #18181b; }
.oo3-link { color: var(--oo3-muted); font-size: 17px; animation: oo3-link 1.5s ease-in-out infinite; }
@keyframes oo3-link { 0%,100% { opacity: .35; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.12); } }
.oo3-country { gap: 7px; padding: 5px 9px 5px 6px; border-radius: 11px; background: color-mix(in srgb, var(--oo3-core) 7%, transparent); }
.oo3-country img { width: 30px; height: 21px; border-radius: 5px; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,23,42,.12); }
.oo3-country small { max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--oo3-text); font-size: 11px; font-weight: 800; }
.oo3-kicker { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border: 1px solid color-mix(in srgb, var(--oo3-core) 22%, transparent); border-radius: 999px; color: var(--oo3-core); background: color-mix(in srgb, var(--oo3-core) 8%, transparent); font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.oo3-title { margin-top: 10px; color: var(--oo3-text); font-size: 22px; font-weight: 850; letter-spacing: -.025em; }
.oo3-sub { margin-top: 5px; color: var(--oo3-muted); font-size: 13px; }
.oo3-pipeline { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin: 16px auto 0; width: min(430px,100%); }
.oo3-pipeline span { min-width: 0; display: inline-flex; align-items: center; justify-content: center; gap: 5px; padding: 8px 7px; border: 1px solid color-mix(in srgb, var(--oo3-core) 16%, transparent); border-radius: 11px; color: var(--oo3-muted); background: var(--oo3-glass); font-size: 10.5px; font-weight: 750; animation: oo3-step 4.5s ease-in-out infinite; }
.oo3-pipeline span:nth-child(2) { animation-delay: 1.5s; }
.oo3-pipeline span:nth-child(3) { animation-delay: 3s; }
@keyframes oo3-step { 0%,100% { color: var(--oo3-muted); border-color: color-mix(in srgb, var(--oo3-core) 16%, transparent); } 18%,42% { color: var(--oo3-core); border-color: color-mix(in srgb, var(--oo3-core) 48%, transparent); box-shadow: 0 8px 24px color-mix(in srgb, var(--oo3-core) 10%, transparent); } }
.oo3-progress { position: relative; width: min(330px,78%); height: 4px; margin: 16px auto 0; border-radius: 999px; background: color-mix(in srgb, var(--oo3-core) 12%, transparent); overflow: visible; }
.oo3-progress span { position: absolute; inset: 0 auto 0 0; width: 38%; border-radius: inherit; background: linear-gradient(90deg,var(--oo3-core),var(--oo3-core-2)); box-shadow: 0 0 14px color-mix(in srgb, var(--oo3-core-2) 52%, transparent); animation: oo3-progress 2.2s ease-in-out infinite; }
.oo3-progress i { position: absolute; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: var(--oo3-core); opacity: .25; }
.oo3-progress i:nth-of-type(1) { left: 0; } .oo3-progress i:nth-of-type(2) { left: 50%; } .oo3-progress i:nth-of-type(3) { right: 0; }
@keyframes oo3-progress { 0% { left: 0; width: 12%; opacity: .3; } 50% { width: 42%; opacity: 1; } 100% { left: 88%; width: 12%; opacity: .3; } }
@media (max-width: 600px) {
  .order-overlay { padding: calc(15px + env(safe-area-inset-top)) 15px calc(15px + env(safe-area-inset-bottom)); }
  .oo3-stage { height: 264px; }
  .oo3-core { width: 96px; height: 96px; border-radius: 26px; }
  .oo3-core-face.front i { font-size: 30px; }
  .oo3-core-scan { animation-name: oo3-scan-mobile; }
  @keyframes oo3-scan-mobile { 0%,100% { top: 16px; opacity: .2; } 50% { top: 78px; opacity: .9; } }
  .oo3-app { width: 38px; height: 38px; border-radius: 12px; font-size: 20px; }
  .oo3-app.app-wa { left: 4px; } .oo3-app.app-tg { right: 4px; }
  .oo3-app.app-gm { left: 28px; } .oo3-app.app-ap { right: 28px; }
  .oo3-identity { min-width: 220px; bottom: 0; }
  .oo3-title { font-size: 19px; }
  .oo3-pipeline span { font-size: 9.5px; padding: 7px 4px; }
}
@media (max-height: 620px) and (orientation: landscape) {
  .oo3-stage { height: 205px; transform: scale(.78); transform-origin: center center; margin: -20px auto -18px; }
  .oo3-pipeline { margin-top: 9px; }
  .oo3-progress { margin-top: 10px; }
}

.lim-input-row { display: flex; align-items: center; gap: 8px; }
.lim-input-row .uc-input { flex: 1; }

/* Ülke ekle formu + eklenen ülke çipleri */
.cadd-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.cadd-iso { flex: 0 0 92px; text-transform: uppercase; }
.cadd-dial { flex: 0 0 92px; }
.cadd-code { flex: 0 0 140px; }
.cadd-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.cadd-chip { display: inline-flex; align-items: center; gap: 7px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: 5px 6px 5px 11px; font-size: 13px; font-weight: 600; }
.cadd-chip small { color: var(--muted); font-weight: 500; font-family: var(--mono); }
.cadd-chip em { padding: 2px 6px; border-radius: 999px; color: var(--accent); background: var(--accent-soft); font-size: 9px; font-style: normal; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.cadd-flag { width: 22px; height: 16px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,23,42,.08); }
.cadd-x { border: none; background: transparent; color: var(--muted); cursor: pointer; width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.cadd-x:hover { background: var(--red-soft); color: var(--red); }
.csv-btn { flex: 0 0 auto; white-space: nowrap; }

/* Duyuru yönetimi — gönderilenler listesi */
.mini-sub { font-size: 13px; font-weight: 650; color: var(--text-2); display: flex; align-items: center; gap: 7px; margin: 0 0 12px; }
.ann-sent { margin-top: 22px; border-top: 1px solid var(--border); padding-top: 18px; }
#ann-list { display: flex; flex-direction: column; gap: 10px; }
.ann-empty { color: var(--muted); font-size: 13px; margin: 0; }
.ann-empty i { margin-right: 6px; }
.ann-item { display: flex; align-items: flex-start; gap: 12px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; }
.ann-item-main { flex: 1; min-width: 0; }
.ann-item-top { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; flex-wrap: wrap; }
.ann-to { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.ann-to i { font-size: 12px; }
.ann-to.all { background: var(--accent-soft); color: var(--accent); }
.ann-to.one { background: #fef3e2; color: #b26a00; }
.ann-item-time { font-size: 11px; color: var(--muted); font-family: var(--mono); }
.ann-item-title { font-weight: 600; font-size: 14px; }
.ann-item-body { color: var(--text-2); font-size: 13px; margin-top: 2px; word-break: break-word; white-space: pre-wrap; }
.ann-del { flex: 0 0 auto; }

/* Kullanıcı kartı bakiye satırı + sağlayıcı bakiyeleri */
.uc-bal { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 13px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; }
.uc-bal-info { font-size: 13px; color: var(--text-2); display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.uc-bal-info i { color: var(--accent); font-size: 16px; }
.uc-bal-info b { color: var(--text); font-family: var(--mono); }
.uc-bal-info b.neg { color: var(--red); }
.uc-bal-sep { color: var(--border-strong); }
.uc-bal-btns { display: inline-flex; gap: 8px; }
.urole.bal { background: var(--accent-soft); color: var(--accent); }
.urole.bal.neg { background: var(--red-soft); color: var(--red); }
.provider-bal { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 12px 16px; margin-bottom: 18px; box-shadow: var(--shadow-xs); }
.pb-lbl { font-size: 13px; font-weight: 600; color: var(--text-2); display: inline-flex; align-items: center; gap: 7px; }
.pb-lbl i { color: var(--accent); font-size: 17px; }
.pb-chip { font-size: 13px; background: var(--surface-2); border-radius: 999px; padding: 5px 12px; color: var(--text-2); }
.pb-chip b { color: var(--text); font-family: var(--mono); }

/* Sağlayıcılar sayfası */
.prov-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.prov-card { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 18px 20px; box-shadow: var(--shadow); }
.prov-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.prov-ic { width: 42px; height: 42px; border-radius: 12px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 21px; }
.prov-ic.live { background: linear-gradient(150deg, var(--accent-2), var(--accent)); }
.prov-ic.demo { background: var(--muted); }
.prov-name { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.prov-name b { font-size: 16px; font-weight: 650; color: var(--text); }
.prov-name small { font-size: 12px; color: var(--muted); }
.prov-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; padding: 4px 10px; border-radius: 999px; white-space: nowrap; }
.prov-chip i { font-size: 14px; }
.prov-chip.ok { background: var(--green-soft); color: var(--green); }
.prov-chip.off { background: var(--red-soft); color: var(--red); }
.prov-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0; border-top: 1px solid var(--border); }
.prov-k { font-size: 13px; color: var(--text-2); font-weight: 500; }
.prov-v { font-size: 14px; font-weight: 600; color: var(--text); }
.prov-bal { font-family: var(--mono); font-weight: 700; }

/* Hesabım sayfası */
.account-hero { display: grid; grid-template-columns: 1.4fr 1fr; gap: 18px; margin-bottom: 22px; }
.acc-bal-card { background: linear-gradient(140deg, var(--accent-2), var(--accent)); color: #fff; border-radius: 18px; padding: 26px 28px; box-shadow: 0 12px 30px rgba(79,70,229,.28); position: relative; overflow: hidden; }
.acc-bal-card::after { content: ""; position: absolute; width: 220px; height: 220px; border-radius: 50%; background: rgba(255,255,255,.1); top: -90px; right: -60px; }
.acc-topup { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; margin-top: 18px; background: rgba(255,255,255,.18); color: #fff; border: 1px solid rgba(255,255,255,.35); border-radius: 12px; padding: 11px 20px; font-size: 14px; font-weight: 650; font-family: var(--font); cursor: pointer; transition: background .14s, transform .12s; }
.acc-topup:hover { background: rgba(255,255,255,.28); transform: translateY(-1px); }
.acc-topup i { font-size: 17px; }
.protect-hero { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 18px; align-items: center; margin-bottom: 22px; padding: 26px; border-radius: 18px; color: #fff; background: linear-gradient(135deg, #102033 0%, #18233a 52%, #18322b 100%); box-shadow: var(--shadow); overflow: hidden; position: relative; }
.protect-hero::after { content: ""; position: absolute; right: -90px; top: -100px; width: 280px; height: 280px; border-radius: 50%; background: rgba(167,243,208,.1); }
.protect-hero-main { position: relative; z-index: 1; display: flex; align-items: center; gap: 16px; min-width: 0; }
.protect-hero-ic { width: 58px; height: 58px; border-radius: 16px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.12); color: #a7f3d0; font-size: 30px; }
.protect-hero h2 { font-size: 28px; letter-spacing: 0; }
.protect-hero p { max-width: 720px; margin: 7px 0 0; color: rgba(255,255,255,.76); line-height: 1.55; }
.protect-score { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.score-ring { --score: 72; width: 104px; height: 104px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: conic-gradient(#a7f3d0 calc(var(--score) * 1%), rgba(255,255,255,.14) 0); color: #fff; font-size: 28px; font-family: var(--mono); font-weight: 800; position: relative; }
.score-ring::after { content: ""; position: absolute; inset: 10px; border-radius: 50%; background: #152338; }
.score-ring { isolation: isolate; }
.score-ring::before { content: attr(id); display: none; }
/* Koruma & destek sayfası */
.protect-hero { background: linear-gradient(135deg, #102033 0%, #22324a 52%, #18322b 100%); }
.protect-score small { color: rgba(255,255,255,.72); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.score-ring { position: static; box-shadow: inset 0 0 0 10px rgba(21,35,56,.96); }
.score-ring::before, .score-ring::after { display: none; }
.protect-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr); gap: 18px; margin-bottom: 18px; }
.protect-tool, .protect-check { margin-bottom: 0; }
.risk-pill { display: inline-flex; align-items: center; justify-content: center; min-height: 30px; padding: 6px 11px; border-radius: 999px; font-size: 12px; font-weight: 750; white-space: nowrap; }
.risk-pill.good { color: var(--green); background: var(--green-soft); }
.risk-pill.mid { color: var(--amber); background: var(--amber-soft); }
.risk-pill.bad { color: var(--red); background: var(--red-soft); }
.seg-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 16px 0 18px; }
.seg { min-height: 44px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); color: var(--text-2); font-family: var(--font); font-size: 13px; font-weight: 750; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 7px; transition: all .14s; }
.seg i { font-size: 17px; }
.seg.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); box-shadow: 0 0 0 3px rgba(79,70,229,.08); }
.range-row { display: grid; gap: 10px; }
.range-row label { color: var(--text); font-size: 13px; font-weight: 750; }
.range-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 58px; align-items: center; gap: 12px; }
.range-wrap input { width: 100%; accent-color: var(--accent); }
.range-wrap b { font-family: var(--mono); color: var(--text); font-size: 14px; text-align: right; }
.protect-meter { width: 100%; height: 10px; margin: 16px 0; border-radius: 999px; background: var(--surface-2); overflow: hidden; border: 1px solid var(--border); }
.protect-meter span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #f59e0b, #22c55e); transition: width .18s ease; }
.protect-advice { min-height: 74px; display: flex; gap: 11px; align-items: flex-start; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-2); padding: 13px; color: var(--text-2); }
.protect-advice i { flex: 0 0 auto; margin-top: 1px; color: var(--accent); font-size: 22px; }
.protect-advice b { display: block; color: var(--text); margin-bottom: 2px; }
.check-row { display: flex; align-items: flex-start; gap: 12px; padding: 14px 0; border-top: 1px solid var(--border); cursor: pointer; }
.check-row:first-of-type { border-top: 0; padding-top: 4px; }
.check-row input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--accent); flex: 0 0 auto; }
.check-row span { min-width: 0; }
.check-row b { display: block; color: var(--text); font-size: 13.5px; }
.check-row small { display: block; margin-top: 3px; color: var(--text-2); font-size: 12.5px; line-height: 1.45; }
.protect-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 24px; }
.protect-tip { min-width: 0; min-height: 180px; display: flex; flex-direction: column; gap: 8px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 17px; box-shadow: var(--shadow-xs); }
.protect-tip > i { width: 40px; height: 40px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: var(--accent-soft); color: var(--accent); font-size: 21px; }
.protect-tip b { color: var(--text); font-size: 14px; }
.protect-tip span { color: var(--text-2); font-size: 12.5px; line-height: 1.45; }
.protect-tip.contact { background: linear-gradient(135deg, #102033 0%, #22324a 55%, #18322b 100%); border-color: rgba(255,255,255,.08); color: #fff; }
.protect-tip.contact > i { background: rgba(255,255,255,.12); color: #a7f3d0; }
.protect-tip.contact b { color: #fff; }
.protect-tip.contact span { color: rgba(255,255,255,.72); }
.protect-contact { margin-top: auto; width: 100%; justify-content: center; min-height: 42px; }
.protect-contact-panel { margin-top: 4px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.09); border-radius: 12px; padding: 12px; }
.protect-contact-panel small { display: block; color: rgba(255,255,255,.68); font-size: 11.5px; }
.protect-contact-panel b { display: block; margin-top: 2px; font-family: var(--mono); color: #fff; font-size: 14px; }
.protect-contact-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.protect-contact-actions .ubtn { width: 100%; min-height: 38px; justify-content: center; color: #fff; background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.16); }
.protect-contact-actions .ubtn:hover { background: rgba(255,255,255,.16); }
.support-modal { display: flex; flex-direction: column; gap: 16px; }
.modal-card:has(.support-modal.account-request) { max-width: 950px; padding: 28px 30px; }
.support-modal.account-request { gap: 20px; }
.support-modal-hero { display: flex; gap: 14px; align-items: center; background: linear-gradient(135deg, #102033 0%, #18322b 60%, #14413a 100%); color: #fff; border-radius: 14px; padding: 18px; position: relative; overflow: hidden; }
.support-modal-hero::after { content: ""; position: absolute; right: -60px; top: -70px; width: 190px; height: 190px; border-radius: 50%; background: rgba(52,211,153,.14); }
.support-modal-ic { width: 50px; height: 50px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; background: rgba(52,211,153,.16); color: #6ee7b7; font-size: 26px; position: relative; z-index: 1; box-shadow: 0 0 0 0 rgba(52,211,153,.4); animation: supPulse 2.6s ease-in-out infinite; }
@keyframes supPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(52,211,153,.34); } 50% { box-shadow: 0 0 0 9px rgba(52,211,153,0); } }
.support-modal-hero b, .support-modal-hero small { position: relative; z-index: 1; }
.support-modal-hero b { display: block; font-size: 16px; font-weight: 760; }
.support-modal-hero small { display: block; margin-top: 4px; color: rgba(255,255,255,.76); font-size: 12.5px; line-height: 1.4; }
.support-modal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.support-modal.account-request .support-modal-grid { gap: 14px; }
.support-modal-grid div { border: 1px solid var(--border); background: var(--surface-2); border-radius: 13px; padding: 14px; min-width: 0; transition: all .15s; }
.support-modal-grid div:hover { border-color: var(--accent); background: var(--accent-soft); transform: translateY(-2px); box-shadow: 0 8px 18px rgba(79,70,229,.12); }
.support-modal.account-request .support-modal-grid div { min-height: 118px; padding: 18px; }
.support-modal-grid i { color: var(--accent); font-size: 22px; }
.support-modal-grid b { display: block; margin-top: 7px; font-size: 13px; }
.support-modal.account-request .support-modal-grid b { font-size: 14px; }
.support-modal-grid span { display: block; margin-top: 4px; color: var(--text-2); font-size: 12px; line-height: 1.35; }
.support-modal.account-request .support-modal-grid span { font-size: 12.5px; line-height: 1.48; }
.support-modal-lines { display: grid; gap: 9px; }
.support-modal-lines div { display: flex; align-items: center; gap: 11px; min-width: 0; border: 1px solid var(--border); background: var(--surface-2); border-radius: 13px; padding: 12px 13px; }
.support-modal-lines i { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--accent); background: var(--accent-soft); font-size: 19px; }
.support-modal-lines b { display: block; color: var(--text); font-size: 13px; }
.support-modal-lines small { display: block; margin-top: 2px; color: var(--text-2); font-size: 12px; line-height: 1.35; }
.support-modal-warning { display: flex; align-items: flex-start; gap: 11px; padding: 14px; border-radius: 13px; border: 1px solid rgba(220,38,38,.22); background: linear-gradient(180deg, #fff5f5, #fffafa); color: var(--red); }
.support-modal-warning i { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; background: var(--red-soft); color: var(--red); font-size: 20px; }
.support-modal-warning b { display: block; color: var(--red); font-size: 13.5px; font-weight: 850; line-height: 1.35; }
.support-modal-warning small { display: block; margin-top: 4px; color: #991b1b; font-size: 12px; line-height: 1.42; }
.support-modal-cta { display: grid; gap: 10px; border: 1px solid var(--border); background: linear-gradient(135deg, #ffffff, #f6f7ff); border-radius: 14px; padding: 13px; }
.support-modal-cta span { display: inline-flex; align-items: center; justify-content: center; gap: 6px; color: var(--text-2); font-size: 13px; }
.support-modal-cta span i, .support-modal-cta span b { color: var(--accent); }
.support-modal-cta .btn-accent { width: 100%; min-height: 46px; justify-content: center; text-decoration: none; }
.account-contact { padding: 18px 22px; background: linear-gradient(180deg, #f8faff, #f3f6fb); }
.account-contact .topup-contact-actions { align-items: center; }
.support-modal-fineprint { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 8px 12px; border-radius: 12px; color: #b91c1c; background: #fff7f7; border: 1px solid rgba(220,38,38,.18); font-size: 12.5px; font-weight: 750; line-height: 1.35; }
.support-modal-fineprint i { color: var(--red); font-size: 17px; flex: 0 0 auto; }
.support-modal-fineprint span { min-width: 0; }
.protect-hero-static { grid-template-columns: minmax(0, 1fr) minmax(180px, 260px); background: linear-gradient(135deg, #102033 0%, #1d3550 46%, #173d34 100%); }
.protect-badge-stack { position: relative; z-index: 1; display: grid; gap: 9px; }
.protect-badge-stack span { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; border-radius: 11px; padding: 8px 11px; color: rgba(255,255,255,.88); background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.13); font-size: 12.5px; font-weight: 760; }
.protect-badge-stack i { color: #a7f3d0; font-size: 17px; }
/* İlk 1 saat — altın kural kartı */
.protect-hour { margin-bottom: 18px; border-radius: 18px; padding: 24px; background: linear-gradient(140deg, #fffbeb 0%, #fef3e2 55%, #fdecd3 100%); border: 1px solid #f3dcae; box-shadow: var(--shadow); position: relative; overflow: hidden; }
.protect-hour::after { content: ""; position: absolute; right: -70px; top: -80px; width: 230px; height: 230px; border-radius: 50%; background: rgba(217,119,6,.08); }
.hour-head { display: flex; gap: 16px; align-items: flex-start; position: relative; z-index: 1; }
.hour-ic { width: 54px; height: 54px; border-radius: 16px; background: linear-gradient(150deg, #f59e0b, #d97706); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 28px; flex: 0 0 auto; box-shadow: 0 12px 24px rgba(217,119,6,.32); animation: hourSway 3.4s ease-in-out infinite; }
@keyframes hourSway { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-4px) rotate(4deg); } }
.hour-kicker { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: #b45309; background: rgba(217,119,6,.13); padding: 4px 11px; border-radius: 999px; margin-bottom: 7px; }
.hour-kicker i { font-size: 12px; }
.hour-htext h3 { font-size: 19px; margin: 0 0 6px; color: #7c2d12; letter-spacing: -0.01em; }
.hour-htext p { font-size: 13.5px; color: #92610b; line-height: 1.6; margin: 0; }
.hour-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 16px; position: relative; z-index: 1; }
.hour-step { display: flex; gap: 11px; align-items: flex-start; background: rgba(255,255,255,.8); border: 1px solid #f2ddb6; border-radius: 13px; padding: 13px 14px; transition: all .15s; }
.hour-step:hover { transform: translateY(-2px); box-shadow: 0 10px 20px rgba(217,119,6,.14); border-color: #ecc57f; }
.hour-step b { width: 27px; height: 27px; flex: 0 0 auto; border-radius: 50%; background: linear-gradient(150deg, #f59e0b, #d97706); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; box-shadow: 0 5px 10px rgba(217,119,6,.3); }
.hour-step span { display: block; font-size: 13.5px; font-weight: 700; color: #7c2d12; }
.hour-step small { display: block; font-size: 12px; color: #a16207; line-height: 1.5; margin-top: 3px; }
.hour-step small b { display: inline; width: auto; height: auto; border-radius: 0; background: none; color: #b45309; box-shadow: none; font-size: 12px; }
.hour-note { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; font-size: 12.5px; color: #92610b; background: rgba(255,255,255,.65); border: 1px dashed #e6c483; border-radius: 12px; padding: 11px 14px; line-height: 1.55; position: relative; z-index: 1; }
.hour-note i { font-size: 17px; flex: 0 0 auto; margin-top: 1px; color: #d97706; }

.protect-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr); gap: 18px; margin-bottom: 18px; border-radius: 18px; padding: 24px; background: linear-gradient(135deg, #fff 0%, #f5f7ff 52%, #eefbf5 100%); border: 1px solid var(--border); box-shadow: var(--shadow); }
.story-kicker { display: inline-flex; align-items: center; width: fit-content; padding: 6px 10px; border-radius: 999px; background: var(--green-soft); color: var(--green); font-size: 12px; font-weight: 800; }
.story-main h3 { margin: 12px 0 8px; font-size: 26px; line-height: 1.12; letter-spacing: 0; max-width: 760px; }
.story-main p { margin: 0; color: var(--text-2); line-height: 1.65; max-width: 840px; }
.story-steps { display: grid; gap: 10px; align-content: center; }
.story-steps div { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 10px; padding: 12px; border-radius: 13px; background: #fff; border: 1px solid var(--border); box-shadow: var(--shadow-xs); }
.story-steps b { color: var(--accent); font-family: var(--mono); font-size: 16px; }
.story-steps span { color: var(--text); font-size: 13px; font-weight: 650; }
.protect-split { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 18px; }
.protect-do, .protect-dont { border-radius: 18px; padding: 20px; box-shadow: var(--shadow-xs); border: 1px solid var(--border); }
.protect-do { background: linear-gradient(135deg, #f0fdf4, #ffffff); }
.protect-dont { background: linear-gradient(135deg, #fff7ed, #ffffff); }
.split-head { display: flex; align-items: center; gap: 9px; margin-bottom: 13px; }
.split-head i { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: 20px; }
.protect-do .split-head i { background: var(--green-soft); color: var(--green); }
.protect-dont .split-head i { background: var(--amber-soft); color: var(--amber); }
.split-head b { font-size: 17px; }
.protect-split ul { list-style: none; display: grid; gap: 10px; padding: 0; margin: 0; }
.protect-split li { display: flex; align-items: center; gap: 10px; min-height: 42px; color: var(--text-2); font-size: 13px; }
.protect-split li span { flex: 0 0 auto; min-width: 78px; text-align: center; border-radius: 999px; padding: 6px 9px; font-size: 12px; font-weight: 800; font-family: var(--mono); }
.protect-do li span { background: var(--green-soft); color: var(--green); }
.protect-dont li span { background: var(--amber-soft); color: var(--amber); }
.protect-rules { display: grid; grid-template-columns: 1.25fr repeat(3, 1fr); gap: 14px; margin-bottom: 18px; }
.rule-wide { display: flex; gap: 14px; align-items: flex-start; min-width: 0; border-radius: 16px; padding: 18px; background: #111827; color: #fff; box-shadow: var(--shadow); }
.rule-wide > i { width: 42px; height: 42px; border-radius: 12px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: #fde68a; background: rgba(255,255,255,.12); font-size: 23px; }
.rule-wide b { display: block; font-size: 15px; margin-bottom: 5px; }
.rule-wide span { display: block; color: rgba(255,255,255,.72); font-size: 12.5px; line-height: 1.5; }
.rule-card { min-width: 0; border-radius: 16px; padding: 18px; border: 1px solid var(--border); box-shadow: var(--shadow-xs); background: #fff; display: flex; flex-direction: column; gap: 7px; }
.rule-card i { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; font-size: 21px; }
.rule-card.blue i { background: var(--blue-soft); color: var(--blue); }
.rule-card.amber i { background: var(--amber-soft); color: var(--amber); }
.rule-card.green i { background: var(--green-soft); color: var(--green); }
.rule-card b { color: var(--text); }
.rule-card span { color: var(--text-2); font-size: 12.5px; line-height: 1.45; }
.protect-tip em { margin-top: auto; color: var(--accent); font-style: normal; font-size: 12px; font-weight: 800; }
.support-command { margin-bottom: 18px; padding: 22px; border: 1px solid var(--border); border-radius: 18px; background: linear-gradient(135deg, var(--surface), color-mix(in srgb, var(--accent-soft) 32%, var(--surface))); box-shadow: var(--shadow-xs); }
.support-command-head { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 16px; }
.support-command-icon { width: 46px; height: 46px; border-radius: 13px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: var(--accent-soft); font-size: 23px; }
.support-kicker { color: var(--accent); font-size: 10px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.support-command h3 { margin: 3px 0 4px; color: var(--text); font-size: 18px; }
.support-command-head p { margin: 0; color: var(--muted); font-size: 12.5px; line-height: 1.45; }
.support-issue-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.support-issue { min-width: 0; min-height: 68px; display: grid; grid-template-columns: 34px minmax(0, 1fr) 16px; align-items: center; gap: 8px; padding: 9px; border: 1px solid var(--border); border-radius: 13px; color: var(--text); background: var(--surface); font: inherit; text-align: left; cursor: pointer; transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease; }
.support-issue:hover { border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); transform: translateY(-1px); box-shadow: var(--shadow-xs); }
.support-issue.active { border-color: color-mix(in srgb, var(--accent) 38%, var(--border)); background: var(--accent-soft); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 7%, transparent); }
.support-issue > i:first-child { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: color-mix(in srgb, var(--accent-soft) 70%, var(--surface)); font-size: 18px; }
.support-issue > i:last-child { justify-self: end; color: var(--muted); }
.support-issue span { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.support-issue b { overflow: hidden; color: var(--text); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.support-issue small { overflow: hidden; color: var(--muted); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.support-answer { min-height: 78px; display: flex; align-items: flex-start; gap: 12px; margin-top: 12px; padding: 14px; border: 1px solid color-mix(in srgb, var(--blue) 20%, var(--border)); border-radius: 13px; background: color-mix(in srgb, var(--blue-soft) 55%, var(--surface)); }
.support-answer > span { width: 38px; height: 38px; border-radius: 11px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--blue); background: var(--surface); font-size: 20px; box-shadow: var(--shadow-xs); }
.support-answer b { display: block; color: var(--text); font-size: 13.5px; }
.support-answer p { margin: 4px 0 0; color: var(--text-2); font-size: 12px; line-height: 1.5; }
.support-ready { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; padding: 16px 18px; border: 1px solid color-mix(in srgb, var(--green) 24%, var(--border)); border-radius: 16px; background: linear-gradient(135deg, var(--green-soft), var(--surface)); }
.support-ready-copy { min-width: 0; display: flex; align-items: center; gap: 12px; }
.support-ready-copy > span { width: 40px; height: 40px; border-radius: 11px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--green); background: var(--surface); font-size: 20px; }
.support-ready-copy b { display: block; color: var(--text); font-size: 13.5px; }
.support-ready-copy p { margin: 3px 0 0; color: var(--text-2); font-size: 11.5px; line-height: 1.4; }
.support-diagnostic-btn { flex: 0 0 auto; min-height: 42px; color: var(--green); border-color: color-mix(in srgb, var(--green) 30%, var(--border)); background: var(--surface); }
.protect-contact-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 0; border-radius: 18px; padding: 18px; background: linear-gradient(135deg, #102033, #1d3550); color: #fff; box-shadow: var(--shadow); }
.protect-contact-main { display: flex; align-items: center; gap: 13px; min-width: 0; }
.protect-contact-ic { width: 46px; height: 46px; border-radius: 13px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.12); color: #a7f3d0; font-size: 24px; }
.protect-contact-main b { display: block; font-size: 15px; }
.protect-contact-main > div > span { display: block; margin-top: 3px; color: rgba(255,255,255,.72); font-size: 12.5px; line-height: 1.45; }
.protect-contact-main .protect-contact-ic { display: inline-flex; align-items: center; justify-content: center; margin-top: 0; color: #a7f3d0; font-size: 24px; line-height: 1; }
.protect-contact-card .protect-contact-actions { display: flex; justify-content: flex-end; min-width: 210px; margin-top: 0; }
.protect-contact-card .protect-contact-actions .ubtn { min-height: 48px; min-width: 230px; padding: 11px 24px; justify-content: center; color: #fff; background: linear-gradient(150deg, #6366f1, #4f46e5); border-color: transparent; border-radius: 13px; box-shadow: 0 14px 30px rgba(79,70,229,.34); font-weight: 800; }
.protect-contact-card .protect-contact-actions .ubtn:hover { background: linear-gradient(150deg, #6d6ff6, #4338ca); border-color: transparent; transform: translateY(-1px); box-shadow: 0 18px 36px rgba(79,70,229,.4); }
.protect-contact-card .protect-contact-actions .ubtn i { font-size: 18px; }
.text-link { appearance: none; border: none; background: transparent; padding: 0; margin: 0; color: var(--accent); font: inherit; font-weight: 650; cursor: pointer; }
.text-link:hover { text-decoration: underline; }
.acc-bal-label { font-size: 14px; opacity: .92; display: flex; align-items: center; gap: 7px; position: relative; }
.acc-bal-value { font-size: 40px; font-weight: 750; font-family: var(--mono); margin-top: 8px; letter-spacing: -.02em; position: relative; }
.acc-bal-value.neg { color: #ffd6d6; }
.acc-bal-sub { font-size: 13px; opacity: .92; margin-top: 4px; position: relative; }
.acc-meta { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: 20px 24px; display: flex; flex-direction: column; justify-content: center; gap: 16px; box-shadow: var(--shadow-xs); }
.acc-meta-row { display: flex; align-items: center; justify-content: space-between; font-size: 14px; color: var(--text-2); }
.acc-meta-row span { display: inline-flex; align-items: center; gap: 7px; }
.acc-meta-row i { color: var(--accent); }
.acc-meta-row b { color: var(--text); font-family: var(--mono); font-size: 15px; }
.account-hero.mode-view { grid-template-columns: minmax(0, 1.3fr) minmax(360px, .9fr); align-items: stretch; }
.account-hero.mode-view .acc-bal-card { min-height: 240px; display: flex; flex-direction: column; justify-content: center; }
.acc-bal-card.privacy { background: linear-gradient(145deg, #3157d7 0%, #4f46e5 55%, #6d4ee8 100%); }
.acc-mode-meta { position: relative; isolation: isolate; justify-content: flex-start; gap: 14px; overflow: hidden; padding: 20px; background: linear-gradient(145deg, var(--surface) 0%, color-mix(in srgb, var(--accent-soft) 42%, var(--surface)) 100%); }
.acc-mode-meta::after { content: ""; position: absolute; z-index: -1; width: 170px; height: 170px; right: -94px; top: -96px; border-radius: 50%; background: color-mix(in srgb, var(--accent) 8%, transparent); }
.acc-mode-meta.counter-mode { border-color: color-mix(in srgb, #d97706 22%, var(--border)); background: linear-gradient(145deg, var(--surface) 0%, color-mix(in srgb, #f59e0b 7%, var(--surface)) 100%); }
.acc-mode-meta.counter-mode::after { background: color-mix(in srgb, #d97706 9%, transparent); }
.acc-mode-head { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 11px; }
.acc-mode-icon { width: 42px; height: 42px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: var(--accent-soft); font-size: 21px; }
.counter-mode .acc-mode-icon { color: #b45309; background: color-mix(in srgb, #f59e0b 14%, var(--surface)); }
.acc-mode-title { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.acc-mode-title small { color: var(--muted); font-size: 10px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.acc-mode-title b { overflow: hidden; color: var(--text); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.acc-mode-live { display: inline-flex; align-items: center; gap: 5px; padding: 6px 9px; border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: 10.5px; font-weight: 800; white-space: nowrap; }
.acc-mode-state { display: flex; align-items: center; gap: 10px; min-height: 58px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 13px; background: color-mix(in srgb, var(--surface) 86%, transparent); }
.acc-mode-state > i { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: 17px; }
.acc-mode-state > span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.acc-mode-state small { color: var(--muted); font-size: 10.5px; }
.acc-mode-state b { overflow: hidden; color: var(--text); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.acc-mode-state.ready > i { color: var(--green); background: var(--green-soft); }
.acc-mode-state.waiting > i { color: #b45309; background: color-mix(in srgb, #f59e0b 14%, var(--surface)); }
.acc-mode-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.acc-mode-facts > span { min-width: 0; padding: 9px 11px; border: 1px solid var(--border); border-radius: 11px; background: color-mix(in srgb, var(--surface) 78%, transparent); }
.acc-mode-facts small, .acc-mode-facts b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acc-mode-facts small { color: var(--muted); font-size: 10px; }
.acc-mode-facts b { margin-top: 3px; color: var(--text); font-size: 12px; }
.acc-mode-note { display: flex; align-items: flex-start; gap: 6px; margin: 0; color: var(--text-2); font-size: 10.5px; line-height: 1.45; }
.acc-mode-note i { flex: 0 0 auto; margin-top: 1px; color: var(--accent); font-size: 13px; }
.counter-mode .acc-mode-note i { color: #d97706; }
@media (max-width: 720px) { .account-hero { grid-template-columns: 1fr; } }
@media (max-width: 980px) {
  .account-hero.mode-view { grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr); }
}
@media (max-width: 760px) {
  .account-hero.mode-view { grid-template-columns: 1fr; }
  .account-hero.mode-view .acc-bal-card { min-height: 0; }
}
@media (max-width: 420px) {
  .acc-mode-meta { padding: 16px; }
  .acc-mode-head { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 9px; }
  .acc-mode-icon { width: 38px; height: 38px; border-radius: 11px; font-size: 19px; }
  .acc-mode-live { padding: 5px 7px; font-size: 9.5px; }
  .acc-mode-state b { white-space: normal; }
}
@media (max-width: 940px) {
  .protect-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .protect-rules { grid-template-columns: 1fr 1fr; }
  .rule-wide { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .protect-hero { grid-template-columns: 1fr; padding: 20px; }
  .protect-hero-main { align-items: flex-start; }
  .protect-layout, .protect-grid { grid-template-columns: 1fr; }
  .protect-story, .protect-split, .protect-rules { grid-template-columns: 1fr; }
  .support-issue-grid { grid-template-columns: 1fr 1fr; }
  .hour-steps { grid-template-columns: 1fr; }
  .hour-head { flex-direction: column; }
  .protect-contact-card { flex-direction: column; align-items: stretch; }
  .protect-contact-card .protect-contact-actions { min-width: 0; width: 100%; justify-content: stretch; }
  .protect-contact-card .protect-contact-actions .ubtn { width: 100%; }
  .protect-contact-actions { grid-template-columns: 1fr; }
  .support-ready { align-items: stretch; flex-direction: column; }
  .support-diagnostic-btn { width: 100%; justify-content: center; }
  .support-modal-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .protect-hero-main { flex-direction: column; }
  .protect-hero h2 { font-size: 22px; }
  .story-main h3 { font-size: 21px; }
  .story-steps div { grid-template-columns: 36px minmax(0, 1fr); }
  .protect-split li { align-items: flex-start; flex-direction: column; gap: 6px; }
  .support-command { padding: 16px; }
  .support-command-head { flex-direction: column; }
  .support-issue-grid { grid-template-columns: 1fr; }
  .protect-split li span { min-width: 0; text-align: left; }
  .protect-contact-actions { grid-template-columns: 1fr; }
}

/* Kullanıcılar: arama + ferah liste */
.users-toolbar { display: flex; align-items: center; gap: 12px; margin: 0 2px 14px; }
.users-search { flex: 1 1 auto; max-width: 440px; }
#users-list { display: flex; flex-direction: column; gap: 10px; }
/* --- Telegram Botu kartı (Ayarlar) --- */
.tg-status { display: inline-flex; align-items: center; gap: 9px; padding: 9px 14px; border-radius: 11px; background: var(--surface-2); border: 1px solid var(--border); font-size: 13.5px; font-weight: 600; color: var(--text-2); margin-bottom: 14px; }
.tg-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--muted); flex: 0 0 auto; }
.tg-status.on { background: var(--green-soft); border-color: transparent; color: var(--green); }
.tg-status.on .tg-dot { background: var(--green); box-shadow: 0 0 0 4px rgba(22,163,74,.18); animation: tgPulse 1.6s ease infinite; }
.tg-status.off { background: var(--red-soft); border-color: transparent; color: var(--red); }
.tg-status.off .tg-dot { background: var(--red); }
@keyframes tgPulse { 0%,100% { box-shadow: 0 0 0 3px rgba(22,163,74,.16); } 50% { box-shadow: 0 0 0 6px rgba(22,163,74,.07); } }
.tg-bind { margin-bottom: 14px; }
.tg-code-box { margin-top: 12px; padding: 14px 16px; border-radius: 13px; background: linear-gradient(140deg, var(--accent-soft), #eaf2ff); border: 1px dashed var(--accent); }
.tg-code { font-family: var(--mono); font-size: 30px; font-weight: 800; letter-spacing: .3em; color: var(--accent); text-align: center; }
.tg-code-hint { font-size: 12.5px; color: var(--text-2); margin-top: 8px; text-align: center; }
.tg-code-hint code { background: var(--surface); padding: 2px 7px; border-radius: 6px; font-family: var(--mono); }
.tg-group-row { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); margin-bottom: 8px; }
.tg-g-ic { width: 38px; height: 38px; border-radius: 11px; background: var(--blue-soft); color: var(--blue); display: flex; align-items: center; justify-content: center; font-size: 19px; flex: 0 0 auto; }
.tg-g-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tg-g-main b { font-size: 14px; }
.tg-g-sub { font-size: 12px; color: var(--muted); font-family: var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tg-setup { margin-top: 6px; }
.tg-bind-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
#tg-acc-sel { flex: 1 1 240px; max-width: 380px; }
.tg-g-warn { color: var(--amber); font-weight: 700; font-family: var(--font); }
.tg-g-lim { color: var(--amber); font-weight: 700; font-family: var(--font); }
.tg-group-row .ubtn { flex: 0 0 auto; padding: 7px 11px; font-size: 12.5px; }
@media (max-width: 640px) { .tg-group-row { flex-wrap: wrap; } .tg-group-row .tg-g-main { flex-basis: 100%; } }

/* Grup aktivite modalı (kim ne denedi / ne aldı) */
.modal-card.wide { max-width: 940px; width: calc(100% - 32px); }
.tgd-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.tgd-chip { font-size: 12.5px; padding: 7px 12px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); }
.tgd-chip i { color: var(--accent); }
.tgd-list { max-height: 55vh; overflow-y: auto; border: 1px solid var(--border); border-radius: 12px; }
.tgd-row { display: grid; grid-template-columns: 1.1fr 1.2fr 1fr 1.2fr .9fr .8fr .9fr; gap: 8px; align-items: center; padding: 10px 13px; border-bottom: 1px solid var(--border); font-size: 13px; }
.tgd-row:last-child { border-bottom: 0; }
.tgd-head { position: sticky; top: 0; background: var(--surface-2); font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); z-index: 1; }
.tgd-who { font-weight: 600; display: inline-flex; align-items: center; gap: 5px; }
.tgd-who i { color: var(--accent); }
@media (max-width: 700px) { .tgd-row { grid-template-columns: 1fr 1fr; } .tgd-head { display: none; } }

/* "Yeni grup bağlat" bilgilendirme popup'ı (yöneticiye özel işlem) */
.tgreq-hero { display: flex; gap: 14px; align-items: flex-start; background: linear-gradient(140deg, #eef0fe, #e8f0ff); border: 1px solid #dfe3fc; border-radius: 14px; padding: 16px; margin-bottom: 14px; }
.tgreq-ic { width: 46px; height: 46px; flex: 0 0 auto; border-radius: 13px; background: linear-gradient(150deg, #6366f1, #4f46e5); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 24px; box-shadow: 0 10px 22px rgba(79,70,229,.3); }
.tgreq-hero b { display: block; font-size: 15px; margin-bottom: 4px; }
.tgreq-hero span { font-size: 13px; color: var(--text-2); line-height: 1.55; }
.tgreq-steps { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.tgreq-step { display: flex; gap: 10px; align-items: center; background: var(--surface-2); border: 1px solid var(--border); border-radius: 11px; padding: 10px 13px; font-size: 13px; }
.tgreq-step b { width: 24px; height: 24px; flex: 0 0 auto; border-radius: 50%; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 12px; }
.tgreq-cta { width: 100%; justify-content: center; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }

/* Hesabım — sayaç kart + Telegram grupları */
.acc-cnt-unit { font-size: 17px; font-weight: 700; opacity: .85; }
/* Sayaç hesap: ödenmiş/bekleyen ilerleme çubuğu (hero içinde, beyaz üstü) */
.acc-cnt-prog { height: 8px; border-radius: 999px; background: rgba(255,255,255,.25); overflow: hidden; margin: 12px 0 9px; box-shadow: inset 0 1px 2px rgba(0,0,0,.15); }
.acc-cnt-fill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #ffffff, rgba(255,255,255,.85)); box-shadow: 0 0 10px rgba(255,255,255,.5); transition: width .5s cubic-bezier(.4,0,.2,1); }
.acc-cnt-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 13px; }
.acc-cnt-lg { display: inline-flex; align-items: center; gap: 6px; opacity: .96; }
.acc-cnt-lg i { font-size: 16px; }
.acc-cnt-lg b { font-size: 15px; font-weight: 800; }
.acc-cnt-lg.paid i { color: #bbf7d0; }
.acc-cnt-lg.owed i { color: #ffe0a3; }
/* Hesabım — Ödeme & İletişim kartı (sayaç/limitsiz hesaplarda) */
.acc-pay-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 18px; border-radius: 18px; padding: 20px 22px; color: #fff; background: linear-gradient(135deg, #111827 0%, #1f2937 55%, #14322b 100%); box-shadow: var(--shadow); position: relative; overflow: hidden; }
.acc-pay-card::after { content: ""; position: absolute; right: -70px; top: -80px; width: 220px; height: 220px; border-radius: 50%; background: rgba(52,211,153,.12); }
.acc-pay-main { display: flex; align-items: center; gap: 15px; min-width: 0; position: relative; z-index: 1; }
.acc-pay-ic { width: 50px; height: 50px; flex: 0 0 auto; border-radius: 14px; background: rgba(255,255,255,.12); color: #6ee7b7; display: flex; align-items: center; justify-content: center; font-size: 26px; }
.acc-pay-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.acc-pay-txt b { font-size: 16px; }
.acc-pay-txt span { font-size: 13px; color: rgba(255,255,255,.72); line-height: 1.5; }
.acc-pay-actions { display: flex; gap: 9px; flex-wrap: wrap; position: relative; z-index: 1; }
.acc-pay-cta { text-decoration: none; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.acc-pay-copy { color: #fff; background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.18); }
.acc-pay-copy:hover { background: rgba(255,255,255,.18); color: #fff; border-color: rgba(255,255,255,.32); }
@media (max-width: 600px) { .acc-pay-card { flex-direction: column; align-items: stretch; } .acc-pay-actions { flex-direction: column; } .acc-pay-cta, .acc-pay-copy { width: 100%; justify-content: center; } }
.acc-bal-card.counter { background: linear-gradient(150deg, #d97706, #b45309); }
.acc-tg-empty { padding: 8px 0 !important; }
.acc-tg-live { flex: 0 0 auto; }
#acc-tg-card .tg-group-row { margin-bottom: 8px; }
#acc-tg-add { margin-top: 4px; }
.pf-tg-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 12px; }
.pf-tg-hint { flex: 1 1 260px; font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.pf-tg-hint code { background: var(--surface-2); padding: 1px 6px; border-radius: 5px; font-family: var(--mono); }
.pf-tg-empty { padding: 10px 0 !important; }
#pf-telegram .mini-lbl { margin-top: 14px; }
#pf-telegram .tg-code-box { margin-bottom: 4px; }
.pf-tg-load-error { display: flex; align-items: center; gap: 12px; padding: 13px; border: 1px solid color-mix(in srgb, var(--amber) 24%, var(--border)); border-radius: 13px; background: color-mix(in srgb, var(--amber-soft) 55%, var(--surface)); }
.pf-tg-load-error > span { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 11px; background: var(--amber-soft); color: var(--amber); font-size: 19px; }
.pf-tg-load-error > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pf-tg-load-error b { color: var(--text); font-size: 12.5px; }
.pf-tg-load-error small { color: var(--text-2); font-size: 11px; line-height: 1.35; }
.pf-tg-load-error .ubtn { flex: 0 0 auto; }
@media (max-width: 600px) {
  .pf-tg-load-error { align-items: flex-start; flex-wrap: wrap; }
  .pf-tg-load-error .ubtn { width: 100%; justify-content: center; }
}

/* --- Sayaç hesap (numara başı ödeme) --- */
.urole.counter { background: var(--amber-soft); color: var(--amber); }
.urow-bal-v.warn { color: var(--amber); }
.acc-bal-card.counter { background: linear-gradient(150deg, #d97706, #b45309); }
.pf-cnt-unit { font-size: 15px; font-weight: 700; opacity: .85; }
.paid-summary { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.paid-chip { font-size: 12.5px; font-weight: 600; padding: 7px 12px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); }
.paid-chip.ok { background: var(--green-soft); color: var(--green); border-color: transparent; }
.paid-chip.warn { background: var(--amber-soft); color: var(--amber); border-color: transparent; }
.paid-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.paid-actions .btn-accent { flex: 1; justify-content: center; }
.paid-log { border: 1px solid var(--border); border-radius: 11px; overflow: hidden; margin-top: 6px; }
.paid-log-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 13px; font-size: 12.5px; border-bottom: 1px solid var(--border); color: var(--text-2); }
.paid-log-row:last-child { border-bottom: 0; }
.paid-log-row b { color: var(--green); }
.paid-log-tot { color: var(--muted); font-family: var(--mono); font-size: 11.5px; }

/* Sayaç yönetimi — gerçek sipariş, elle verilen numara ve ödeme geçmişi */
.modal-card:has(.counter-modal) { max-width: 680px; padding: 0; overflow: hidden auto; border: 1px solid var(--border); border-radius: 24px; }
.counter-modal { color: var(--text); }
.counter-modal-head { align-items: center; margin: 0; padding: 22px 24px 18px; border-bottom: 1px solid var(--border); }
.counter-modal-head > div { min-width: 0; }
.counter-modal-head .modal-title { margin-top: 4px; word-break: normal; }
.counter-modal-head p { margin: 5px 0 0; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.counter-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface-2) 66%, var(--surface)); }
.counter-summary-item { min-width: 0; padding: 17px 20px; border-right: 1px solid var(--border); }
.counter-summary-item:last-child { border-right: 0; }
.counter-summary-item span, .counter-summary-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.counter-summary-item span { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .02em; }
.counter-summary-item strong { display: block; margin: 4px 0 2px; color: var(--text); font: 800 25px/1.05 var(--mono); }
.counter-summary-item small { color: var(--muted); font-size: 10.5px; }
.counter-summary-item.unpaid strong { color: var(--amber); }
.counter-summary-item.paid strong { color: var(--green); }
.counter-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; margin: 18px 24px 0; padding: 4px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); }
.counter-tab { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 10px; background: transparent; color: var(--text-2); font: 750 12.5px/1.2 var(--font); cursor: pointer; transition: color .15s, background .15s, box-shadow .15s; }
.counter-tab i { color: var(--muted); font-size: 17px; }
.counter-tab.active { background: var(--surface); color: var(--accent); box-shadow: var(--shadow-xs); }
.counter-tab.active i { color: var(--accent); }
.counter-tab:focus-visible, .counter-primary:focus-visible, .counter-history-delete:focus-visible, .counter-pdf:focus-visible, .counter-manual-control button:focus-visible { outline: 3px solid var(--accent-soft); outline-offset: 2px; }
.counter-panel { margin: 12px 24px 20px; padding: 18px; border: 1px solid var(--border); border-radius: 17px; background: var(--surface); }
.counter-panel[hidden] { display: none; }
.counter-panel-copy b { display: block; color: var(--text); font-size: 14px; }
.counter-panel-copy p { margin: 4px 0 16px; color: var(--muted); font-size: 11.5px; line-height: 1.5; }
.counter-manual-control { height: 52px; display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px; overflow: hidden; border: 1px solid var(--border-strong); border-radius: 14px; background: var(--surface-2); }
.counter-manual-control button { border: 0; background: transparent; color: var(--accent); font-size: 19px; cursor: pointer; }
.counter-manual-control button:hover { background: var(--accent-soft); }
.counter-manual-control input { width: 100%; border: 0; border-right: 1px solid var(--border); border-left: 1px solid var(--border); outline: 0; background: var(--surface); color: var(--text); font: 800 18px/1 var(--mono); text-align: center; }
.counter-manual-control input { -moz-appearance: textfield; appearance: textfield; }
.counter-manual-control input::-webkit-inner-spin-button, .counter-manual-control input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; }
.counter-preview { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; padding: 8px 11px; border-radius: 11px; background: var(--amber-soft); color: var(--amber); }
.counter-preview > span { font-size: 11px; font-weight: 750; }
.counter-preview b { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); }
.counter-preview em { color: var(--text-2); font-style: normal; font-weight: 650; }
.counter-preview i { font-size: 14px; }
.counter-preview strong { font-size: 15px; }
.counter-primary { width: 100%; min-height: 46px; justify-content: center; margin-top: 12px; border-radius: 13px; }
.counter-total-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.counter-total-fields label { min-width: 0; }
.counter-total-fields label > span { display: block; margin: 0 0 6px 2px; color: var(--text-2); font-size: 11.5px; font-weight: 700; }
.counter-total-fields input { width: 100%; height: 50px; border: 1px solid var(--border-strong); border-radius: 13px; outline: 0; background: var(--surface-2); color: var(--text); font: 800 17px/1 var(--mono); text-align: center; transition: border-color .15s, box-shadow .15s; }
.counter-total-fields input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.counter-total-preview { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; padding: 8px 3px 0; color: var(--muted); font-size: 11.5px; }
.counter-total-preview strong { color: var(--text); font: 800 15px/1 var(--mono); }
.counter-history { padding: 19px 24px 24px; border-top: 1px solid var(--border); }
.counter-history-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 11px; }
.counter-history-head > div { min-width: 0; }
.counter-history-head h3 { margin: 3px 0 0; color: var(--text); font-size: 15px; }
.counter-history-head p { margin: 3px 0 0; color: var(--muted); font-size: 10.5px; line-height: 1.4; }
.counter-pdf { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--text-2); font: 700 11.5px/1 var(--font); cursor: pointer; }
.counter-pdf:hover { color: var(--accent); border-color: var(--accent); }
.counter-history-list { max-height: 235px; overflow: hidden auto; border-top: 1px solid var(--border); scrollbar-width: thin; }
.counter-history-row { min-height: 58px; display: grid; grid-template-columns: 35px minmax(0, 1fr) 36px; align-items: center; gap: 10px; border-bottom: 1px solid var(--border); }
.counter-history-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: var(--surface-2); color: var(--text-2); font-size: 16px; }
.counter-history-icon.manual { color: var(--accent); background: var(--accent-soft); }
.counter-history-icon.paid { color: var(--green); background: var(--green-soft); }
.counter-history-icon.totals { color: var(--amber); background: var(--amber-soft); }
.counter-history-copy { min-width: 0; }
.counter-history-copy b, .counter-history-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.counter-history-copy b { color: var(--text); font-size: 11.5px; }
.counter-history-copy small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.counter-history-delete { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--muted); font-size: 15px; cursor: pointer; }
.counter-history-delete:hover { border-color: color-mix(in srgb, var(--red) 22%, var(--border)); background: var(--red-soft); color: var(--red); }
.counter-history-empty { min-height: 74px; display: flex; align-items: center; justify-content: center; gap: 8px; border-top: 1px solid var(--border); color: var(--muted); font-size: 12px; }

@media (max-width: 600px) {
  .modal:has(.counter-modal) { align-items: flex-end; padding: calc(8px + env(safe-area-inset-top)) 0 0; }
  .modal-card:has(.counter-modal) { width: 100%; max-width: none; max-height: min(92vh, 92dvh); border-width: 1px 0 0; border-radius: 24px 24px 0 0; padding-bottom: env(safe-area-inset-bottom); animation-name: rise; }
  .counter-modal-head { padding: 18px 17px 15px; }
  .counter-summary-item { padding: 14px 10px; }
  .counter-summary-item strong { font-size: 21px; }
  .counter-summary-item small { font-size: 9px; }
  .counter-tabs { margin: 14px 14px 0; }
  .counter-tab { padding: 0 7px; font-size: 11.5px; }
  .counter-panel { margin: 10px 14px 16px; padding: 15px; }
  .counter-history { padding: 16px 14px 20px; }
  .counter-history-head p { max-width: 265px; }
  .counter-pdf span { display: none; }
  .counter-pdf { width: 40px; padding: 0; }
}

.bk-ic { background: var(--green-soft) !important; color: var(--green) !important; }
.bk-dl { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; padding: 7px 12px; font-size: 12.5px; font-weight: 700; border-radius: 9px; border: 1px solid var(--border); background: var(--surface); color: var(--text); text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, transform .08s; }
.bk-dl:hover { background: var(--green-soft); border-color: var(--green); color: var(--green); }
.bk-dl:active { transform: scale(.96); }
.bk-dl i { font-size: 15px; }
#backup-list .tg-group-row { margin-bottom: 8px; }
/* ===== BAKIM sayfası: form + canlı önizleme ===== */
.maint-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); gap: 18px; align-items: start; }
.maint-prev-card { position: sticky; top: 14px; }
.mprev-shell { border: 1px solid var(--border-strong); border-radius: 15px; overflow: hidden; box-shadow: var(--shadow); background: var(--surface-2); }
.mprev-bar { display: flex; align-items: center; gap: 6px; padding: 9px 12px; background: var(--surface-2); border-bottom: 1px solid var(--border); }
.mprev-dot { width: 10px; height: 10px; border-radius: 50%; }
.mprev-dot.r { background: #f87171; } .mprev-dot.y { background: #fbbf24; } .mprev-dot.g { background: #34d399; }
.mprev-url { margin-left: 10px; display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--text-2); background: var(--surface); border: 1px solid var(--border); border-radius: 999px; padding: 3px 12px; }
.mprev-frame { position: relative; width: 100%; aspect-ratio: 16 / 10; overflow: hidden; background: var(--bg); }
.mprev-scale { position: absolute; top: 0; left: 0; width: 1280px; height: 800px; transform-origin: 0 0; pointer-events: none; }
.mprev-page { position: absolute !important; inset: 0 !important; }
.mprev-note { margin: 12px 2px 0; font-size: 12.5px; color: var(--text-2); line-height: 1.55; }
.mprev-note code { background: var(--surface-2); border: 1px solid var(--border); border-radius: 6px; padding: 1px 7px; font-family: var(--mono); font-size: 11.5px; }
/* Popup önizlemesi: arkada şematik panel + karartma + gerçek popup kartı */
.mprev-app { position: absolute; inset: 0; background: var(--bg); }
.mprev-sk { position: absolute; border-radius: 14px; background: var(--surface); border: 1px solid var(--border); }
.mprev-sk.side { left: 0; top: 0; bottom: 0; width: 250px; border-radius: 0; background: var(--side); border: none; }
.mprev-sk.top { left: 280px; right: 30px; top: 26px; height: 74px; }
.mprev-sk.c1 { left: 280px; right: 30px; top: 126px; height: 210px; }
.mprev-sk.c2 { left: 280px; top: 362px; height: 330px; width: 46%; }
.mprev-sk.c3 { right: 30px; top: 362px; height: 330px; width: calc(54% - 306px); }
.mprev-dim { position: absolute; inset: 0; background: rgba(10, 14, 26, .55); backdrop-filter: blur(2px); }
.mprev-center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.mprev-modal { position: relative; width: 480px; max-width: none; }
/* Kapalı durumu */
.mprev-off { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; text-align: center; }
.mprev-off-ic { width: 110px; height: 110px; border-radius: 32px; display: flex; align-items: center; justify-content: center; font-size: 58px; color: var(--green); background: var(--green-soft); }
.mprev-off b { font-size: 30px; color: var(--text); }
.mprev-off span { font-size: 19px; color: var(--text-2); max-width: 640px; }
@media (max-width: 1080px) { .maint-layout { grid-template-columns: minmax(0, 1fr); } .maint-prev-card { position: static; } }

/* ===== Bildirim sesleri seçim ızgarası ===== */
.snd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-bottom: 14px; }
.snd-item { position: relative; display: flex; align-items: center; gap: 9px; padding: 11px 12px; border: 1.5px solid var(--border); border-radius: 13px; background: var(--surface); cursor: pointer; transition: border-color .14s, background .14s, transform .1s; user-select: none; }
.snd-item:hover { border-color: var(--accent); transform: translateY(-1px); }
.snd-item.on { border-color: var(--accent); background: var(--accent-soft); }
.snd-emoji { font-size: 21px; flex: 0 0 auto; }
.snd-name { flex: 1; min-width: 0; font-size: 13px; font-weight: 700; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.snd-play { flex: 0 0 auto; width: 29px; height: 29px; border-radius: 9px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--accent); font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .13s, color .13s, border-color .13s; }
.snd-play:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.snd-chk { display: none; position: absolute; top: -7px; right: -7px; width: 21px; height: 21px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 12px; align-items: center; justify-content: center; box-shadow: 0 3px 8px rgba(79, 70, 229, .4); }
.snd-item.on .snd-chk { display: inline-flex; }
.snd-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.snd-count { font-size: 13px; color: var(--text-2); display: inline-flex; align-items: center; gap: 6px; }
.snd-count i { color: var(--accent); }

/* ===== Sağlayıcılar: tam genişlik premium paneller ===== */
.prov-stack { display: flex; flex-direction: column; gap: 16px; }
.provx { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; box-shadow: var(--shadow); overflow: hidden; }
.provx.off { border-color: var(--amber-soft); }
.provx-hero { display: flex; align-items: center; gap: 16px; padding: 20px 22px; background: linear-gradient(135deg, var(--accent-soft), var(--surface) 60%); flex-wrap: wrap; }
.provx.off .provx-hero { background: linear-gradient(135deg, var(--amber-soft), var(--surface) 60%); }
.provx-ic { width: 54px; height: 54px; border-radius: 16px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; font-size: 26px; color: #fff; background: linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow: 0 10px 24px rgba(79, 70, 229, .3); }
.provx-ic.demo { background: linear-gradient(135deg, #94a3b8, #64748b); box-shadow: none; }
.provx-t { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.provx-t > b { font-size: 18px; color: var(--text); }
.provx-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.prov-chip.warn { background: var(--amber-soft); color: var(--amber); }
.provx-bal { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; margin-left: auto; }
.provx-bal small { font-size: 11.5px; font-weight: 600; color: var(--text-2); }
.provx-bal b { font-size: 25px; font-weight: 800; font-family: var(--mono); color: var(--accent); letter-spacing: -.02em; }
.provx-hero .prov-toggle { flex: 0 0 auto; }
.provx-body { padding: 18px 22px 16px; border-top: 1px solid var(--border); }
.sva-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.sva-title { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 800; color: var(--text); margin: 0; flex-wrap: wrap; }
.sva-title i { color: var(--accent); }
.sva-meta { font-size: 12.5px; font-weight: 600; color: var(--text-2); background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: 4px 11px; }
.sva-hint { margin-bottom: 12px; }
@media (max-width: 640px) { .provx-hero { padding: 16px; } .provx-body { padding: 14px 16px 12px; } .provx-bal { align-items: flex-start; margin-left: 0; } }

/* Telegram bot token satırı (Ayarlar) */
.tg-token-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 11px 13px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); margin-bottom: 12px; }
.tg-token-k { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--text); }
.tg-token-k i { color: var(--accent); }
.tg-token-v { flex: 1 1 auto; min-width: 0; font-size: 12.5px; color: var(--text-2); display: inline-flex; align-items: center; gap: 7px; }
.tg-token-src { font-size: 11.5px; color: var(--muted); }
.tg-token-row .ubtn { flex: 0 0 auto; }

/* ===== SMS Virtual Hesapları ===== */
.sva-row { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); margin-bottom: 9px; flex-wrap: wrap; transition: border-color .14s; }
.sva-row:hover { border-color: var(--border-strong); }
.sva-row.off { opacity: .62; }
.sva-ord { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 800; background: var(--accent-soft); color: var(--accent); }
.sva-main { flex: 1 1 180px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sva-name { font-size: 14px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sva-sub { font-size: 11.5px; color: var(--muted); }
.sva-tok { font-size: 11px; }
.sva-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 700; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); }
.sva-bal { color: var(--green); background: var(--green-soft); border-color: transparent; }
.sva-open { color: var(--accent); background: var(--accent-soft); border-color: transparent; }
.sva-open.full { color: var(--amber); background: var(--amber-soft); }
.sva-offchip { color: var(--amber); background: var(--amber-soft); border-color: transparent; }
.sva-acts { flex: 0 0 auto; display: inline-flex; gap: 5px; margin-left: auto; }
.sva-ib { width: 30px; height: 30px; border-radius: 9px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: all .13s; }
.sva-ib:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.sva-ib:disabled { opacity: .35; cursor: default; }
.sva-ib.sva-del:hover { border-color: var(--red); color: var(--red); background: var(--red-soft); }
.modal-card:has(.sva-form) { max-width: 520px; }
.sva-form .uc-textarea.sva-token-inp { font-family: var(--mono); font-size: 12px; word-break: break-all; }
.sva-guide { margin-top: 10px; }
.sva-guide-btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface-2); color: var(--text-2); font-size: 12.5px; font-weight: 700; font-family: var(--font); padding: 7px 12px; border-radius: 10px; cursor: pointer; }
.sva-guide-btn:hover { color: var(--accent); border-color: var(--accent); }
.sva-guide-body { margin: 10px 0 0; padding: 12px 14px 12px 30px; border: 1px dashed var(--border-strong); border-radius: 12px; background: var(--surface-2); font-size: 13px; color: var(--text-2); line-height: 1.7; }
.sva-guide-body code { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 1px 6px; font-family: var(--mono); font-size: 11.5px; }
.sva-err { margin: 12px 0 0; padding: 10px 12px; border-radius: 11px; background: var(--red-soft); color: var(--red); font-size: 13px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sva-force { border: 1px solid var(--red); background: transparent; color: var(--red); font-size: 12px; font-weight: 700; font-family: var(--font); padding: 5px 10px; border-radius: 8px; cursor: pointer; }
.sva-save { margin-top: 14px; width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }

/* Oturum sonlandırıldı popup'ı (hesap donduruldu/silindi → sistemden atılır) */
.modal-card:has(.sd-pop) { max-width: 430px; padding: 0; overflow: hidden; }
.sd-pop { text-align: center; padding: 34px 30px 28px; }
.sd-ic { width: 74px; height: 74px; margin: 0 auto 18px; border-radius: 22px; display: flex; align-items: center; justify-content: center; font-size: 38px; color: #fff; background: linear-gradient(135deg, #fb923c, #dc2626); box-shadow: 0 12px 30px rgba(220, 38, 38, .38); animation: sd-pulse 1.8s ease-in-out infinite; }
@keyframes sd-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
.sd-title { font-size: 21px; font-weight: 800; color: var(--text); margin-bottom: 10px; }
.sd-msg { font-size: 14.5px; line-height: 1.6; color: var(--text-2); margin-bottom: 22px; }
.sd-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }

/* 📄 Bot PDF indirme sayfası (login yok) */
#pdfmode { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; padding: 20px; background: var(--bg); }
.pdfmode-card { width: min(420px, 100%); background: var(--surface); border: 1px solid var(--border); border-radius: 20px; box-shadow: var(--shadow-lg); padding: 34px 26px; text-align: center; }
.pdfmode-ic { width: 64px; height: 64px; margin: 0 auto 16px; border-radius: 18px; display: flex; align-items: center; justify-content: center; font-size: 32px; color: #fff; background: linear-gradient(135deg, #ef4444, #b91c1c); box-shadow: 0 10px 26px rgba(239,68,68,.35); }
.pdfmode-title { font-size: 20px; font-weight: 800; color: var(--text); margin-bottom: 12px; }
.pdfmode-status { font-size: 14px; color: var(--text-2); display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 24px; flex-wrap: wrap; }
.pdfmode-status i { font-size: 18px; }
.pdfmode-status .ti-circle-check { color: var(--green); }
.pdfmode-status .ti-alert-triangle, .pdfmode-status .ti-wifi-off, .pdfmode-status .ti-inbox { color: var(--amber); }
.pdfmode-spin { width: 16px; height: 16px; border-radius: 50%; border: 2.5px solid var(--border-strong); border-top-color: var(--accent); animation: pdfmode-rot .7s linear infinite; }
@keyframes pdfmode-rot { to { transform: rotate(360deg); } }
.pdfmode-actions { margin-top: 20px; }
.pdfmode-btn { display: inline-flex; align-items: center; gap: 7px; }
.pdfmode-hint { margin-top: 18px; font-size: 11.5px; color: var(--muted); }
#backup-now { margin-top: 4px; }

/* Fiyat-gizli kullanıcı: hiçbir fiyat/bakiye görünmez ("dırekt alsın") */
body.hide-prices .country-price,
body.hide-prices #side-balance,
body.hide-prices #osum-price-item { display: none !important; }
/* Fiyat gizli hesapta "Ucuz→Pahalı / Pahalı→Ucuz" anlamsız; geriye tek "Popüler" kalacağı için
   sıralama kutusu tamamen kaldırılır. Arama kutusu boşluğu doldurup görünüm düğmesinin soluna yaslanır. */
body.hide-prices .ulke-sort,
body.hide-prices .country-sort-custom { display: none !important; }

.urow { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 14px 18px; cursor: pointer; font-family: var(--font); color: var(--text); transition: all .13s; box-shadow: var(--shadow-xs); }
.urow:hover { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); transform: translateY(-1px); }
.urow.frozen { border-left: 4px solid var(--red); }
.urow-av { width: 42px; height: 42px; border-radius: 12px; background: var(--accent-soft); color: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 22px; flex: 0 0 auto; }
.urow-main { flex: 1 1 auto; min-width: 0; max-width: 100%; overflow: hidden; }
.urow-name { font-weight: 650; font-size: 14.5px; display: flex; align-items: center; gap: 8px; min-width: 0; }
.urow-nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.urow-name .urole { flex-shrink: 0; }
.urow-sub { display: block; max-width: 100%; font-size: 12.5px; color: var(--muted); font-family: var(--mono); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.urow-keyic { font-size: 12px; opacity: .7; }
.pf-token { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 9px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; padding: 6px 10px; max-width: 100%; }
.pf-token-lbl { font-size: 12px; font-weight: 600; color: var(--text-2); display: inline-flex; align-items: center; gap: 5px; }
.pf-token-lbl i { font-size: 14px; color: var(--muted); }
.pf-token-val { font-family: var(--mono); font-size: 13px; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 7px; padding: 3px 9px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.urow-bal { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; }
.urow-bal-v { font-weight: 700; font-family: var(--mono); font-size: 16px; }
.urow-bal-v.neg { color: var(--red); }
.urow-bal-l { font-size: 11px; color: var(--muted); font-family: var(--mono); }
.urow-chev { color: var(--muted); font-size: 20px; flex: 0 0 auto; }

/* Kullanıcı profili (yönetim ekranı) */
.profile-back { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; margin: 0 0 20px; padding: 3px 10px 3px 4px; border: 1px solid transparent; border-radius: 11px; background: transparent; color: var(--text-2); font-family: var(--font); font-size: 12.5px; font-weight: 750; text-align: left; cursor: pointer; transition: color .16s, border-color .16s, background .16s; }
.profile-back:hover { border-color: var(--border); background: var(--surface); color: var(--accent); }
.profile-back:focus-visible { outline: 3px solid var(--accent-soft); border-color: var(--accent); }
.profile-back-ic { width: 30px; height: 30px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--accent); background: var(--accent-soft); font-size: 17px; transition: transform .16s; }
.profile-back:hover .profile-back-ic { transform: translateX(-2px); }
.profile-back-label { line-height: 1; white-space: nowrap; }
.pf-loading { min-height: 360px; padding: 8px 2px 24px; color: var(--muted); }
.pf-loading p { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 18px; font-size: 13px; font-weight: 600; }
.pf-loading p i { color: var(--accent); font-size: 18px; animation: pfLoadSpin .85s linear infinite; }
.pf-load-head { display: flex; align-items: center; gap: 15px; margin-bottom: 20px; }
.pf-load-head > div { display: flex; flex-direction: column; gap: 9px; flex: 1; }
.pf-load-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 18px; margin-bottom: 20px; }
.pf-load-block { position: relative; display: block; overflow: hidden; background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; }
.pf-load-block::after { content: ""; position: absolute; inset: 0; transform: translateX(-110%); background: linear-gradient(100deg, transparent 20%, color-mix(in srgb, var(--surface) 75%, transparent) 48%, transparent 76%); animation: pfLoadShimmer 1.25s ease-in-out infinite; }
.pf-load-avatar { width: 56px; height: 56px; border-radius: 15px; flex: 0 0 auto; }
.pf-load-name { width: min(280px, 58%); height: 22px; }
.pf-load-line { width: min(390px, 82%); height: 13px; }
.pf-load-line.short { width: min(230px, 58%); }
.pf-load-panel { min-height: 138px; border-radius: 18px; }
.pf-load-wide { min-height: 118px; border-radius: 18px; }
.pf-load-error { display: flex; align-items: center; gap: 14px; min-height: 96px; }
.pf-load-error-ic { width: 42px; height: 42px; flex: 0 0 auto; border-radius: 12px; display: grid; place-items: center; color: var(--red); background: var(--red-soft); font-size: 22px; }
.pf-load-error > div { flex: 1; min-width: 0; }
.pf-load-error h3 { font-size: 15px; margin-bottom: 4px; }
.pf-load-error p { color: var(--muted); font-size: 13px; }
@keyframes pfLoadShimmer { to { transform: translateX(110%); } }
@keyframes pfLoadSpin { to { transform: rotate(360deg); } }
.pf-eyebrow { display: block; margin-bottom: 4px; color: var(--accent); font-size: 10.5px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.pf-identity { display: grid; grid-template-columns: minmax(0, 1fr) minmax(310px, 380px); align-items: center; gap: 24px; margin-bottom: 22px; padding: 3px 2px 22px; border-bottom: 1px solid var(--border); }
.pf-head { display: flex; align-items: center; gap: 17px; min-width: 0; margin: 0; }
.pf-av { position: relative; width: 64px; height: 64px; border-radius: 20px; background: linear-gradient(145deg, var(--accent-soft), color-mix(in srgb, var(--blue-soft) 72%, var(--surface))); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 16%, var(--border)); display: flex; align-items: center; justify-content: center; font-size: 30px; flex: 0 0 auto; box-shadow: inset 0 1px 0 color-mix(in srgb, var(--surface) 65%, transparent), 0 10px 24px color-mix(in srgb, var(--accent) 10%, transparent); }
.pf-htext { min-width: 0; }
.pf-name { min-width: 0; margin: 0; color: var(--text); font-family: var(--font); font-size: clamp(20px, 1.8vw, 25px); font-weight: 820; line-height: 1.15; overflow-wrap: anywhere; word-break: break-word; }
.pf-htext .uc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.pf-meta { display: flex; align-items: center; gap: 7px 16px; flex-wrap: wrap; margin-top: 9px; color: var(--muted); font-family: var(--font); font-size: 11.5px; }
.pf-meta span { display: inline-flex; align-items: center; gap: 5px; }
.pf-meta i { color: var(--text-2); font-size: 13px; }
.pf-token { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 10px; width: 100%; max-width: none; margin: 0; padding: 12px 13px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-xs); }
.pf-token-lbl { grid-column: 1 / -1; display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.pf-token-lbl i { color: var(--accent); font-size: 14px; }
.pf-token-val { display: block; width: 100%; max-width: none; min-width: 0; overflow: hidden; padding: 7px 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-2); color: var(--text); font-family: var(--mono); font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.pf-token-actions { display: flex; align-items: center; gap: 6px; }
.pf-token-actions .ibtn { min-width: 40px; min-height: 40px; }
.pf-token-actions .ibtn:focus-visible, .pf-overview-action:focus-visible { outline: 3px solid var(--accent-soft); outline-offset: 2px; border-color: var(--accent); }

.pf-overview { position: relative; isolation: isolate; overflow: hidden; margin-bottom: 22px; padding: 23px 24px 20px; border: 1px solid var(--border); border-radius: 22px; background: var(--surface); box-shadow: var(--shadow-xs); }
.pf-overview::after { content: ""; position: absolute; z-index: -1; top: -110px; right: -90px; width: 250px; height: 250px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 10%, transparent), transparent 67%); pointer-events: none; }
.pf-overview-counter::after { background: radial-gradient(circle, color-mix(in srgb, var(--amber) 14%, transparent), transparent 67%); }
.pf-overview-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.pf-overview-title { display: flex; align-items: center; gap: 13px; min-width: 0; }
.pf-overview-title > div { min-width: 0; }
.pf-overview-icon { width: 45px; height: 45px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 14px; background: var(--accent-soft); color: var(--accent); font-size: 23px; }
.pf-overview-counter .pf-overview-icon { color: var(--amber); background: var(--amber-soft); }
.pf-overview-title h3, .pf-section-head h3 { margin: 0; color: var(--text); font-size: 18px; font-weight: 800; }
.pf-overview-title p, .pf-section-head p { margin: 3px 0 0; color: var(--muted); font-size: 12.5px; line-height: 1.45; }
.pf-overview-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.pf-overview-action { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 15px; border: 1px solid color-mix(in srgb, var(--green) 25%, var(--border)); border-radius: 12px; background: var(--green-soft); color: var(--green); font-family: var(--font); font-size: 12.5px; font-weight: 800; white-space: nowrap; cursor: pointer; transition: transform .12s, box-shadow .15s, border-color .15s; }
.pf-overview-action:hover { transform: translateY(-1px); border-color: var(--green); box-shadow: 0 7px 18px color-mix(in srgb, var(--green) 12%, transparent); }
.pf-overview-action.secondary { color: var(--accent); background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 24%, var(--border)); }
.pf-metric-grid { display: grid; grid-template-columns: 1.18fr 1fr 1fr; gap: 10px; }
.pf-metric { min-width: 0; padding: 16px 17px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface-2); }
.pf-metric.owed { border-color: color-mix(in srgb, var(--amber) 25%, var(--border)); background: color-mix(in srgb, var(--amber-soft) 68%, var(--surface)); }
.pf-metric.paid { border-color: color-mix(in srgb, var(--green) 19%, var(--border)); background: color-mix(in srgb, var(--green-soft) 62%, var(--surface)); }
.pf-metric > span { display: block; color: var(--text-2); font-size: 11px; font-weight: 750; }
.pf-metric strong { display: block; margin-top: 3px; color: var(--text); font-family: var(--mono); font-size: 30px; line-height: 1.05; }
.pf-metric.owed strong { color: var(--amber); }
.pf-metric.paid strong { color: var(--green); }
.pf-metric small { display: block; margin-top: 6px; color: var(--muted); font-size: 10.5px; }
.pf-payline { margin-top: 17px; }
.pf-payline-copy { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 7px; color: var(--muted); font-size: 11px; }
.pf-payline-copy b { color: var(--text-2); font-family: var(--mono); font-size: 11.5px; }
.pf-paytrack { height: 7px; overflow: hidden; border-radius: 999px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--border); }
.pf-paytrack span { display: block; height: 100%; min-width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--amber), var(--green)); transition: width .35s ease; }
.pf-balance-main { display: grid; grid-template-columns: minmax(180px, .8fr) minmax(220px, 1.2fr); border-top: 1px solid var(--border); }
.pf-balance-main > div { min-width: 0; padding: 18px 18px 4px 0; }
.pf-balance-main > div + div { padding-left: 24px; border-left: 1px solid var(--border); }
.pf-balance-main span, .pf-balance-main small { display: block; color: var(--muted); font-size: 11px; }
.pf-balance-main strong { display: block; margin-top: 4px; color: var(--text); font-family: var(--mono); font-size: 31px; line-height: 1.1; }
.pf-balance-main strong.neg { color: var(--red); }
.pf-balance-main strong.compact { font-family: var(--font); font-size: 18px; }
.pf-balance-main small { margin-top: 5px; }

.pf-control-panel { margin-bottom: 22px; overflow: hidden; border: 1px solid var(--border); border-radius: 22px; background: var(--surface); box-shadow: var(--shadow-xs); }
.pf-section-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px 17px; border-bottom: 1px solid var(--border); }
.pf-control-note { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; background: var(--green-soft); color: var(--green); font-size: 10.5px; font-weight: 750; }
.pf-command-sections { display: grid; grid-template-columns: 1.16fr 1fr .9fr; }
.pf-command-section { min-width: 0; padding: 18px 18px 14px; }
.pf-command-section + .pf-command-section { border-left: 1px solid var(--border); }
.pf-command-label { display: flex; align-items: center; gap: 8px; margin: 0 0 11px; padding: 0 2px; cursor: default; user-select: none; }
.pf-command-label::after { content: ""; min-width: 24px; height: 1px; flex: 1 1 auto; margin-left: 3px; background: linear-gradient(90deg, var(--border-strong), transparent); }
.pf-command-label > i { width: auto; height: auto; display: block; color: var(--accent); font-size: 17px; }
.pf-command-section:nth-child(2) .pf-command-label > i { color: var(--blue); }
.pf-command-section:nth-child(3) .pf-command-label > i { color: var(--amber); }
.pf-command-label > span { display: flex; flex-direction: column; gap: 1px; }
.pf-command-label b { color: var(--text); font-size: 13px; font-weight: 800; }
.pf-command-label small { color: var(--muted); font-size: 10px; }
.pf-command-list { overflow: hidden; border: 1px solid var(--border); border-radius: 14px; background: color-mix(in srgb, var(--surface-2) 42%, var(--surface)); box-shadow: 0 6px 18px rgba(15,23,42,.025); }
.pf-command { width: 100%; min-height: 58px; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 11px; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--text); font-family: var(--font); text-align: left; cursor: pointer; transition: background .14s, box-shadow .14s; }
.pf-command:last-child { border-bottom: 0; }
.pf-command:hover { background: var(--surface); box-shadow: inset 3px 0 0 color-mix(in srgb, var(--accent) 72%, transparent); }
.pf-command:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--accent); outline-offset: -2px; }
.pf-command-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: var(--surface-2); color: var(--text-2); font-size: 17px; }
.pf-command-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pf-command-copy b { overflow: hidden; color: var(--text); font-size: 11.5px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.pf-command-copy small { overflow: hidden; color: var(--muted); font-size: 9.5px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.pf-command-end { color: var(--muted); font-size: 14px; }
.pf-command-end em { display: inline-flex; align-items: center; min-width: 43px; justify-content: center; padding: 4px 7px; border-radius: 999px; background: var(--surface-2); color: var(--muted); font-style: normal; font-size: 9.5px; font-weight: 800; }
.pf-command-end em.mode { min-width: 50px; background: var(--accent-soft); color: var(--accent); }
.pf-command.is-on .pf-command-end em { background: var(--green-soft); color: var(--green); }
.pf-command.is-on .pf-command-icon { background: var(--accent-soft); color: var(--accent); }
.pf-command.warning .pf-command-icon { background: var(--amber-soft); color: var(--amber); }
.pf-command.success .pf-command-icon { background: var(--green-soft); color: var(--green); }
.pf-command.accent .pf-command-icon { background: var(--accent-soft); color: var(--accent); }
.pf-command.danger .pf-command-icon { background: var(--red-soft); color: var(--red); }
.pf-command.danger .pf-command-copy b, .pf-command.danger .pf-command-end { color: var(--red); }
.pf-card, .pf-stats { margin-bottom: 20px; }
@media (max-width: 1050px) {
  .pf-identity { grid-template-columns: minmax(0, 1fr); }
  .pf-command-sections { grid-template-columns: 1fr; }
  .pf-command-section { padding: 16px 18px; }
  .pf-command-section + .pf-command-section { border-left: 0; border-top: 1px solid var(--border); }
  .pf-command-copy small { white-space: normal; }
  .pf-command-copy small { color: var(--text-2); font-size: 10.5px; }
}
@media (max-width: 720px) {
  .profile-back { margin-bottom: 18px; }
  .pf-load-grid { grid-template-columns: 1fr; }
  .pf-load-panel { min-height: 112px; }
  .pf-load-error { align-items: flex-start; flex-wrap: wrap; }
  .pf-load-error .btn { width: 100%; justify-content: center; }
  .pf-identity { gap: 17px; padding-bottom: 18px; }
  .pf-head { align-items: flex-start; gap: 12px; }
  .pf-av { width: 50px; height: 50px; border-radius: 15px; font-size: 24px; }
  .pf-name { font-size: 20px; }
  .pf-token { grid-template-columns: minmax(0, 1fr) auto; padding: 11px; }
  .pf-token-actions .ibtn { min-width: 44px; min-height: 44px; }
  .pf-token-actions .pf-token-show { width: 44px; padding: 0; font-size: 0; }
  .pf-token-actions .pf-token-show i { font-size: 15px; }
  .pf-overview { padding: 18px 15px 16px; border-radius: 18px; }
  .pf-overview-head { align-items: flex-start; margin-bottom: 15px; }
  .pf-overview-title { align-items: flex-start; gap: 10px; }
  .pf-overview-icon { width: 39px; height: 39px; border-radius: 12px; font-size: 20px; }
  .pf-overview-title h3, .pf-section-head h3 { font-size: 16px; }
  .pf-overview-title p, .pf-section-head p { font-size: 11.5px; }
  .pf-overview-action { min-width: 44px; min-height: 44px; padding: 9px 11px; }
  .pf-overview-action span { display: none; }
  .pf-overview-actions { gap: 5px; }
  .pf-metric-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .pf-metric { padding: 13px; }
  .pf-metric.owed { grid-column: 1 / -1; }
  .pf-metric strong { font-size: 25px; }
  .pf-balance-main { grid-template-columns: 1fr; }
  .pf-balance-main > div { padding: 15px 0 2px; }
  .pf-balance-main > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--border); }
  .pf-balance-main strong { font-size: 27px; }
  .pf-control-panel { border-radius: 18px; }
  .pf-section-head { align-items: flex-start; padding: 17px 16px 14px; }
  .pf-control-note { display: none; }
  .pf-command-section { padding: 15px 14px 12px; }
  .pf-command { min-height: 55px; }
}
@media (prefers-reduced-motion: reduce) {
  .pf-load-block::after, .pf-loading p i { animation: none !important; }
  .profile-back, .profile-back-ic, .pf-overview-action, .pf-paytrack span, .pf-command { transition: none !important; }
}

/* Bakiye hareket defteri */
.led-list { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.led-row { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-bottom: 1px solid var(--border); }
.led-row:last-child { border-bottom: none; }
.led-row.led-type-hold { background: linear-gradient(90deg, #fff8e7, #ffffff); animation: holdPulse 1.35s ease-in-out infinite; }
.led-ic { width: 34px; height: 34px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 17px; flex: 0 0 auto; }
.led-ic.led-load { background: var(--green-soft); color: var(--green); }
.led-ic.led-deduct { background: var(--surface-2); color: var(--text-2); }
.led-ic.led-hold { background: var(--amber-soft); color: var(--amber); }
.led-ic.led-refund { background: var(--blue-soft); color: var(--blue); }
.led-ic.led-adjust { background: var(--amber-soft); color: var(--amber); }
.led-main { flex: 1; min-width: 0; }
.led-note { font-size: 13.5px; font-weight: 500; word-break: break-word; }
.led-time { font-size: 11.5px; color: var(--muted); font-family: var(--mono); margin-top: 2px; }
.led-amt { font-family: var(--mono); font-weight: 700; font-size: 15px; flex: 0 0 auto; }
.led-amt.pos { color: var(--green); }
.led-amt.neg { color: var(--red); }
.led-row.led-type-hold .led-note, .led-row.led-type-hold .led-amt { color: var(--amber); }
.led-after { font-family: var(--mono); font-size: 11.5px; color: var(--muted); flex: 0 0 auto; min-width: 84px; text-align: right; }
.led-undo { flex: 0 0 auto; }
.led-pager { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
/* Sayfalama butonu: AKTİF olan belirgin (aksan renkli), pasif olan soluk (.ubtn:disabled devralır). */
.led-pager .ubtn:not(:disabled) { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.led-pager .ubtn:not(:disabled):hover { background: var(--accent); color: #fff; border-color: var(--accent); }
/* Orta etiket: buton DEĞİL — nötr zeminli bilgi şeridi. */
.led-page { font-size: 13px; color: var(--muted); background: var(--bg-2, rgba(120,130,160,.08)); border: 1px solid var(--line); border-radius: 9px; padding: 7px 14px; white-space: nowrap; }
.led-page b { color: var(--text); font-weight: 700; }
.led-page .lp-sep { opacity: .45; margin: 0 7px; }
@media (max-width: 520px) { .led-page { font-size: 12px; padding: 6px 10px; } .led-pager { gap: 7px; } }

/* Bakiye işlemi modalı */
.bal-form { display: flex; flex-direction: column; gap: 8px; }
.bal-tabs { display: flex; gap: 8px; margin-bottom: 6px; }
.bal-tab { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1.5px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 14px; font-weight: 600; font-family: var(--font); padding: 10px; border-radius: 11px; cursor: pointer; transition: all .13s; }
.bal-tab.active { border-color: transparent; background: var(--accent-soft); color: var(--accent); }
.bal-form .btn-accent { margin-top: 8px; }
@media (max-width: 620px) { .led-after { display: none; } }
@keyframes holdPulse { 0%, 100% { box-shadow: inset 4px 0 0 rgba(217,119,6,.28); } 50% { box-shadow: inset 4px 0 0 rgba(217,119,6,.85), 0 0 0 3px rgba(217,119,6,.08); } }

/* Numara notu (satır içi) + detay modalı */
.numrow-note { display: flex; align-items: center; gap: 6px; margin-top: 7px; }
.numrow-note > i { color: var(--muted); font-size: 15px; flex: 0 0 auto; }
.numrow-note-input { flex: 1; min-width: 0; max-width: 340px; border: 1px solid transparent; background: var(--surface-2); border-radius: 8px; padding: 5px 10px; font-size: 12.5px; font-family: var(--font); color: var(--text); transition: all .13s; }
.numrow-note-input::placeholder { color: var(--muted); }
.numrow-note-input:hover { background: var(--surface); border-color: var(--border-strong); }
.numrow-note-input:focus { outline: none; background: var(--surface); border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.numrow-phone.clickable { cursor: pointer; }
.numrow-phone.clickable:hover { text-decoration: underline; text-decoration-color: var(--border-strong); }
.nd-list { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; margin-bottom: 14px; }
.nd-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 15px; border-bottom: 1px solid var(--border); font-size: 14px; }
.nd-row:last-child { border-bottom: none; }
.nd-k { color: var(--text-2); font-weight: 500; flex: 0 0 auto; }
.nd-v { text-align: right; display: inline-flex; align-items: center; gap: 7px; }
.nd-muted { color: var(--muted); font-size: 11px; }
.pos { color: var(--green); }
.nd-flag { width: 24px; height: 17px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,23,42,.08); }
.nd-msg { background: var(--surface-2); border-radius: 12px; padding: 12px 15px; margin-bottom: 14px; }
.nd-msg .nd-k { display: block; margin-bottom: 5px; }
.nd-msg-body { font-size: 14px; word-break: break-word; white-space: pre-wrap; }
.nd-note-row { display: flex; gap: 8px; }
.nd-note-row .uc-input { flex: 1; }
.nd-note-row .btn-accent { flex: 0 0 auto; }
.nd-note-slot { width: min(360px, 100%); display: inline-flex; justify-content: flex-end; }
.nd-note-display { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; max-width: 100%; }
.nd-note-name, .nd-note-empty { min-width: 0; display: inline-flex; align-items: center; gap: 5px; border-radius: 10px; padding: 6px 10px; font-size: 12.5px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nd-note-name { color: var(--text); background: var(--surface-2); }
.nd-note-empty { color: var(--muted); background: transparent; border: 1px dashed var(--border-strong); }
.nd-note-name i, .nd-note-empty i { color: var(--muted); font-size: 14px; flex: 0 0 auto; }
.nd-note-edit, .nd-note-save, .nd-note-cancel { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); cursor: pointer; transition: all .13s; flex: 0 0 auto; }
.nd-note-edit:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.nd-note-editor { display: inline-flex; align-items: center; justify-content: flex-end; gap: 7px; width: min(360px, 100%); }
.nd-note-editor .uc-input { height: 36px; min-width: 0; flex: 1 1 180px; padding: 8px 10px; font-size: 13px; }
.nd-note-save { border-color: rgba(22,163,74,.28); background: var(--green-soft); color: var(--green); }
.nd-note-cancel { border-color: rgba(220,38,38,.18); background: var(--red-soft); color: var(--red); }
.nd-note-save:hover, .nd-note-cancel:hover { transform: translateY(-1px); }
.nd-report { margin-top: 14px; width: 100%; justify-content: center; }

/* Sorun bildir (satır + modal) + şikayet kartları */
.numrow-report { display: inline-flex; align-items: center; gap: 5px; border: none; background: transparent; color: var(--red); font-size: 12px; font-weight: 600; font-family: var(--font); cursor: pointer; padding: 4px 8px; border-radius: 8px; flex: 0 0 auto; }
.numrow-report:hover { background: var(--red-soft); }
.numrow-report.pending { cursor: default; color: var(--amber); background: var(--amber-soft); }
.numrow-report.pending:hover { background: var(--amber-soft); }
.numrow-report.refunded { cursor: default; color: var(--green); background: var(--green-soft); }
.numrow-report.refunded:hover { background: var(--green-soft); }
.numrow-report.rejected { cursor: default; color: var(--text-2); background: var(--surface-2); }
.numrow-report.rejected:hover { background: var(--surface-2); }
.report-pending { margin-top: 14px; display: flex; align-items: flex-start; gap: 10px; border: 1px solid #f5d69a; background: var(--amber-soft); color: #7c4a03; border-radius: 12px; padding: 12px; }
.report-pending i { flex: 0 0 auto; margin-top: 1px; font-size: 20px; }
.report-pending b { display: block; color: #7c4a03; }
.report-pending span { font-size: 12.5px; line-height: 1.45; }
.report-resolved { margin-top: 14px; display: flex; align-items: flex-start; gap: 10px; border-radius: 12px; padding: 12px; }
.report-resolved i { flex: 0 0 auto; margin-top: 1px; font-size: 20px; }
.report-resolved b { display: block; }
.report-resolved span { font-size: 12.5px; line-height: 1.45; }
.report-resolved.ok { border: 1px solid rgba(22,163,74,.24); background: var(--green-soft); color: #126a34; }
.report-resolved.ok i, .report-resolved.ok b { color: var(--green); }
.report-resolved.no { border: 1px solid var(--border); background: var(--surface-2); color: var(--text-2); }
.report-resolved.no i, .report-resolved.no b { color: var(--text); }
/* Belirgin kopyala/detay butonları */
/* Telegram botundan alınan numara: rozet + "alan kişi" etiketi + detay kutusu */
.numrow-bot { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 7px; background: #e8f4fd; color: #229ed9; flex: 0 0 auto; margin-left: 2px; }
.numrow-bot i { font-size: 15px; }
.numrow-taken { display: inline-flex; align-items: center; gap: 3px; color: #229ed9; font-weight: 700; }
.numrow-taken i { font-size: 12px; }
/* margin-bottom ŞART: yoksa altındaki "Mesaj içeriği" kutusu bu kutuya yapışıyor (Telegram'lı siparişte). */
.nd-bot { margin-top: 14px; margin-bottom: 14px; border: 1px solid #cfe9fb; border-radius: 14px; overflow: hidden; background: #f5fbff; }
.nd-bot-head { display: flex; align-items: center; gap: 8px; padding: 11px 15px; background: linear-gradient(135deg, #229ed9, #1c8ec4); color: #fff; font-weight: 800; font-size: 13.5px; }
.nd-bot-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 15px; border-top: 1px solid #e2f1fb; font-size: 13px; }
.nd-bot-k { color: var(--text-2); font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.nd-bot-k i { color: #229ed9; font-size: 15px; }
.nd-bot-v { font-weight: 750; color: var(--text); text-align: right; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.nd-bot-id { color: var(--muted); font-family: var(--mono); font-weight: 500; font-size: 11.5px; }
/* Koyu tema: Telegram kutusu sabit açık renklerde kalmasın (beyaz blok gibi patlıyordu). */
:root[data-theme="dark"] .nd-bot { background: rgba(34,158,217,.08); border-color: rgba(34,158,217,.28); }
:root[data-theme="dark"] .nd-bot-row { border-top-color: rgba(34,158,217,.18); }
.ud-bot { display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 8px 0 6px; border-radius: 7px; background: #e8f4fd; color: #229ed9; margin-left: 6px; vertical-align: middle; font-size: 12px; font-weight: 700; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ud-bot i { font-size: 12px; flex: 0 0 auto; }
:root[data-theme="dark"] .ud-bot { background: #142138; color: #5cb8ee; }

.numrow-act { display: inline-flex; align-items: center; justify-content: center; width: 33px; height: 33px; border-radius: 9px; background: var(--surface-2); border: 1px solid var(--border-strong); color: var(--text-2); cursor: pointer; transition: all .13s; flex: 0 0 auto; }
.numrow-act:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.numrow-act:active { transform: scale(.94); }
.numrow-act i { font-size: 17px; }
/* Çalışan adı — salt-okunur gösterim + ekle */
.numrow-note-txt { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--text-2); background: var(--surface-2); border-radius: 8px; padding: 5px 11px; }
.numrow-note-txt i { color: var(--muted); font-size: 14px; }
.numrow-note-txt.clickable { cursor: pointer; }
.numrow-note-txt.clickable:hover { color: var(--accent); }
.numrow-note-add { display: inline-flex; align-items: center; gap: 5px; border: 1px dashed var(--border-strong); background: transparent; color: var(--text-2); font-size: 12.5px; font-weight: 600; font-family: var(--font); cursor: pointer; padding: 5px 11px; border-radius: 8px; transition: all .13s; }
.numrow-note-add:hover { border-color: var(--accent); color: var(--accent); }
.rep-form { display: flex; flex-direction: column; gap: 10px; }
.rep-choices { display: grid; gap: 9px; }
.rep-choice { width: 100%; min-height: 66px; display: flex; align-items: center; gap: 12px; text-align: left; border: 1.5px solid var(--border-strong); background: var(--surface); color: var(--text); border-radius: 14px; padding: 12px 14px; font-family: var(--font); cursor: pointer; transition: border-color .14s, background .14s, transform .12s, box-shadow .14s; }
.rep-choice:hover { transform: translateY(-1px); box-shadow: var(--shadow-xs); }
.rep-choice > i { width: 40px; height: 40px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; font-size: 21px; }
.rep-choice span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rep-choice b { font-size: 14px; }
.rep-choice small { color: var(--text-2); font-size: 12px; line-height: 1.35; }
.rep-choice.blue > i { background: var(--blue-soft); color: var(--blue); }
.rep-choice.red > i { background: var(--red-soft); color: var(--red); }
.rep-choice.amber > i { background: var(--amber-soft); color: var(--amber); }
.rep-choice.active { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px rgba(79,70,229,.1); }
.rep-form .btn-accent { margin-top: 8px; }
.nav-badge-warn { margin-left: auto; background: #f2b23a; color: #3a2c05; font-size: 11px; font-weight: 700; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; }
.nav-badge-warn:empty { display: none; }
#complaints-list { display: flex; flex-direction: column; gap: 12px; }
#complaints-filter { margin-bottom: 16px; }
.cmp-card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 16px 18px; box-shadow: var(--shadow-xs); }
.cmp-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.cmp-reason { font-weight: 650; font-size: 15px; display: inline-flex; align-items: center; gap: 8px; }
.cmp-reason i { color: var(--amber); }
.cmp-meta { font-size: 13px; color: var(--text-2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cmp-user { font-weight: 600; display: inline-flex; align-items: center; gap: 5px; }
.cmp-user i { color: var(--muted); }
.cmp-note { margin-top: 10px; font-size: 13px; color: var(--text-2); background: var(--surface-2); border-radius: 9px; padding: 9px 12px; display: flex; align-items: flex-start; gap: 7px; word-break: break-word; }
.cmp-note i { color: var(--muted); flex: 0 0 auto; }
.cmp-result { margin-top: 12px; display: flex; align-items: flex-start; gap: 10px; border-radius: 12px; padding: 12px; font-size: 13px; }
.cmp-result i { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; font-size: 19px; }
.cmp-result span { min-width: 0; color: var(--text-2); line-height: 1.45; }
.cmp-result b { display: block; color: var(--text); }
.cmp-result.ok { background: var(--green-soft); border: 1px solid rgba(22,163,74,.22); }
.cmp-result.ok i { color: var(--green); background: rgba(22,163,74,.12); }
.cmp-result.no { background: var(--surface-2); border: 1px solid var(--border); }
.cmp-result.no i { color: var(--text-2); background: #fff; }
.cmp-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.cmp-resolved { margin-top: 12px; font-size: 12.5px; color: var(--muted); font-family: var(--mono); }
.cmp-detail-actions { display: flex; gap: 10px; margin-top: 14px; }
.cmp-detail-actions .btn-accent, .cmp-detail-actions .ubtn { flex: 1; justify-content: center; }

/* Duyurular: kime seçici + sayfa ipucu */
.mini-lbl { font-size: 12px; font-weight: 600; color: var(--text-2); display: block; margin-bottom: -2px; }
.ann-select { width: 100%; height: 44px; }
.page-hint { display: flex; align-items: center; gap: 8px; color: var(--text-2); font-size: 13.5px; background: var(--accent-soft); border: 1px solid #dfe1fb; border-radius: 12px; padding: 12px 16px; margin: 0 2px 18px; }
.page-hint i { color: var(--accent); font-size: 18px; flex: 0 0 auto; }

/* Kullanıcı profili — servis erişimi */
.pf-services-panel { margin-bottom: 22px; padding: 20px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow-xs); }
.pf-services-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 15px; }
.pf-services-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pf-services-title > span { width: 38px; height: 38px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; color: var(--accent); background: var(--accent-soft); font-size: 19px; }
.pf-services-title h3 { margin: 0; color: var(--text); font-size: 16px; font-weight: 800; }
.pf-services-summary { flex: 0 0 auto; padding: 6px 10px; border: 1px solid color-mix(in srgb, var(--green) 18%, var(--border)); border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.pf-services-summary b { font-size: 12px; }
.pf-services-panel .ublocks { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; }
.uchip { width: 100%; min-width: 0; min-height: 64px; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 11px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); color: var(--text); font-family: var(--font); text-align: left; cursor: pointer; transition: border-color .14s, background .14s, box-shadow .14s, transform .14s; }
.uchip-ic { width: 40px; height: 40px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; flex: 0 0 auto; background: var(--muted); box-shadow: 0 8px 18px rgba(15,23,42,.12); }
/* Servis logoları (renkler olmayınca beyaz ikon görünmüyordu) */
.uchip-ic.wa { background: #25d366; } .uchip-ic.tg { background: #29a9eb; } .uchip-ic.gm { background: #ea4335; } .uchip-ic.ap { background: #1d1d1f; }
:root[data-theme="dark"] .uchip-ic.ap { background: #3a3a3f; }
.uchip-flag { width: 22px; height: 16px; border-radius: 3px; object-fit: cover; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(15,23,42,.09); }
.uchip-copy { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.uchip-name { overflow: hidden; color: var(--text); font-size: 12.5px; font-weight: 800; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.uchip-copy small { color: var(--muted); font-size: 9.5px; font-weight: 550; }
.uchip-state { display: inline-flex; align-items: center; gap: 4px; padding: 5px 7px; border-radius: 999px; font-size: 9.5px; font-weight: 800; white-space: nowrap; }
.uchip-state i { font-size: 12px; }
.uchip.allowed { border-color: color-mix(in srgb, var(--green) 18%, var(--border)); background: linear-gradient(145deg, var(--surface-2), color-mix(in srgb, var(--green-soft) 34%, var(--surface))); }
.uchip.allowed .uchip-state { color: var(--green); background: var(--green-soft); }
.uchip.allowed:hover { border-color: color-mix(in srgb, var(--green) 58%, var(--border)); background: color-mix(in srgb, var(--green-soft) 38%, var(--surface)); box-shadow: 0 9px 22px color-mix(in srgb, var(--green) 10%, transparent); transform: translateY(-1px); }
.uchip.blocked { border-color: color-mix(in srgb, var(--red) 18%, var(--border)); background: linear-gradient(145deg, var(--surface-2), color-mix(in srgb, var(--red-soft) 25%, var(--surface))); color: var(--text); }
.uchip.blocked .uchip-flag, .uchip.blocked .uchip-ic { filter: grayscale(1); opacity: .5; }
.uchip.blocked .uchip-state { color: var(--red); background: var(--red-soft); }
.uchip.blocked:hover { border-color: color-mix(in srgb, var(--red) 52%, var(--border)); background: color-mix(in srgb, var(--red-soft) 30%, var(--surface)); box-shadow: 0 9px 22px color-mix(in srgb, var(--red) 9%, transparent); transform: translateY(-1px); }
.uchip:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.uchip-eye { display: none; }
.uc-block-ic { color: var(--muted); margin-right: 3px; }
@media (max-width: 560px) {
  .pf-services-panel { padding: 16px; border-radius: 17px; }
  .pf-services-panel .ublocks { grid-template-columns: 1fr; }
  .uchip { min-height: 61px; }
}

/* Servis mini ikon+ad (admin tablo/rozetlerinde yazı yerine ikon) */
.svc-mini { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; font-size: 13px; }
.svc-mini-ic { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 13px; flex: 0 0 auto; }
.svc-mini-ic.wa { background: #25d366; }
.svc-mini-ic.tg { background: #29a9eb; }
.svc-mini-ic.gm { background: #ea4335; }
.svc-mini-ic.ap { background: #1d1d1f; }
.svc-mini-ic.gen { background: var(--muted); }

/* Fiyatlandırma matrisi (servis × ülke) */
.pricing-sources { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 2px 18px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 12px 16px; box-shadow: var(--shadow-xs); }
.psrc-lbl { font-size: 13px; font-weight: 600; color: var(--text-2); display: inline-flex; align-items: center; gap: 6px; margin-right: 4px; }
.psrc-lbl i { color: var(--accent); font-size: 16px; }
.psrc-tab { border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: 13px; font-weight: 600; font-family: var(--font); padding: 7px 15px; border-radius: 9px; cursor: pointer; transition: all .14s; }
.psrc-tab:hover { border-color: var(--accent); color: var(--accent); }
.psrc-tab.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.panel-settings-card { padding-bottom: 18px; }
.bb-mode-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.bb-mode-btn { min-height: 48px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text); border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-family: var(--font); font-size: 13px; font-weight: 750; cursor: pointer; transition: transform .12s, border-color .14s, background .14s, color .14s, box-shadow .14s; }
.bb-mode-btn i { font-size: 18px; color: var(--accent); }
.bb-mode-btn:hover { border-color: var(--accent); background: var(--accent-soft); transform: translateY(-1px); }
.bb-mode-btn.active { background: linear-gradient(150deg, var(--accent-2), var(--accent)); border-color: transparent; color: #fff; box-shadow: 0 10px 24px rgba(79,70,229,.22); }
.bb-mode-btn.active i { color: #fff; }
.price-card { padding: 20px 22px; }
.price-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.price-card-name { font-size: 17px; font-weight: 650; }
.price-master { margin-left: auto; }
.pgrid { border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.pgrid:has(.cdrop.open) { overflow: visible; }
.pgrid-row { display: grid; grid-template-columns: 1.55fr 1fr .9fr 1fr 1.35fr; align-items: center; gap: 12px; min-height: 62px; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.pgrid-row:last-child { border-bottom: none; }
.pgrid-head { background: var(--surface-2); color: var(--text-2); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.pg-cty { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; font-size: 14px; }
.pg-flag { width: 26px; height: 19px; border-radius: 4px; object-fit: cover; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(15,23,42,.09); }
.pg-cty small { color: var(--muted); font-family: var(--mono); font-weight: 500; }
.pg-cty-edit { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 7px; border: 1px solid var(--border); background: var(--surface-2); color: var(--muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: all .13s; }
.pg-cty-edit:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.pg-cty-edit i { font-size: 14px; }
.pg-toggle { display: inline-flex; align-items: center; gap: 6px; border: 1.5px solid var(--border-strong); background: var(--surface); font-size: 12.5px; font-weight: 600; font-family: var(--font); padding: 7px 12px; border-radius: 999px; cursor: pointer; transition: all .13s; justify-self: start; }
.pg-toggle i { font-size: 15px; }
.pg-toggle.on { border-color: transparent; background: var(--green-soft); color: var(--green); }
.pg-toggle.off { border-color: transparent; background: var(--surface-2); color: var(--muted); }
.pg-toggle:hover { filter: brightness(.98); }
.pg-price { display: inline-flex; align-items: center; gap: 5px; }
.pg-price-input { width: 74px; height: 38px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--surface); color: var(--text); font-size: 14px; font-family: var(--mono); font-weight: 600; padding: 0 10px; text-align: right; }
.pg-price-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.pg-status { height: 38px; padding: 0 10px; }
.pg-badges { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-self: start; }
.pg-badge-toggle { min-height: 32px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); border-radius: 999px; padding: 6px 10px; font-family: var(--font); font-size: 11.5px; font-weight: 800; cursor: pointer; transition: all .13s; white-space: nowrap; }
.pg-badge-toggle i { font-size: 14px; }
.pg-badge-toggle:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.pg-badge-toggle.on { border-color: transparent; }
.pg-pop.on { color: var(--accent); background: #eef0ff; }
.pg-limited.on { color: #b45309; background: #ffedd5; }
@media (max-width: 720px) {
  .bb-mode-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bb-mode-btn { min-height: 44px; font-size: 12.5px; }
  .pgrid { border: none; }
  .pgrid-head { display: none; }
  .pgrid-row { grid-template-columns: 1fr 1fr; row-gap: 8px; border: 1px solid var(--border); border-radius: 12px; margin-bottom: 10px; padding: 12px 14px; }
  .pg-cty { grid-column: 1 / -1; }
  .pg-badges { grid-column: 1 / -1; width: 100%; }
}

/* Responsive */
@media (max-width: 860px) {
  .login { align-items: flex-start; padding: 14px; }
  .login-shell { height: auto; min-height: auto; grid-template-columns: 1fr; width: min(620px, 100%); gap: 16px; }
  .login-brand { padding: 4px 2px; gap: 16px; grid-template-rows: auto auto auto auto auto; }
  .login-copy p { font-size: 14px; line-height: 1.65; }
  .login-tagline { font-size: 31px; line-height: 1.12; }
  .login-visual { display: none; }
  .login-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .login-feats li { padding: 14px 12px; }
  .login-info { padding: 15px; gap: 12px; }
  .login-info-ic { width: 54px; height: 54px; font-size: 25px; }
  .login-brandfoot { display: none; }
  .login-card { padding: 26px 22px 24px; box-shadow: 0 18px 46px rgba(15,23,42,.1); border-radius: 18px; }
  .login-card::before, .login-card::after { display: none; }
  .login-card-head { padding-right: 0; margin-bottom: 22px; }
  .login-card h1 { font-size: 25px; }
  .login-secure { grid-template-columns: 1fr; gap: 10px; margin: 18px 0 22px; padding: 16px 0; }
  .login-secure span { font-size: 13px; }
  .login-request-ic { width: 52px; height: 52px; font-size: 25px; }
  .layout { background: var(--bg); }
  .main { min-width: 0; margin-left: 0; }
  .sidebar { position: fixed; z-index: 60; width: 258px; left: 0; top: 0; height: 100vh; height: 100dvh; overflow: hidden; transform: translateX(-100%); transition: transform .22s ease; }
  .sidebar.open { transform: translateX(0); box-shadow: var(--shadow-lg); }
  .scrim.show { display: block; position: fixed; inset: 0; background: rgba(15,23,42,.4); z-index: 55; }
  .hamb { display: inline-flex; align-items: center; justify-content: center; width: 42px; min-width: 42px; height: 42px; padding: 0; border: 0; border-radius: 14px; color: #fff; background: linear-gradient(150deg, var(--accent-2), var(--accent)); box-shadow: 0 12px 26px rgba(79,70,229,.24); }
  .hamb::after { content: none; }
  .sidebar .side-brand { font-size: 18px; padding-bottom: 24px; }
  .sidebar .nav-item { min-height: 46px; padding: 12px 13px; font-size: 15px; }
  .sidebar .nav-item i { font-size: 20px; }
  .main { padding: 18px 16px 40px; }
  body.bb-mobile .main { padding-bottom: 132px; }
  body.bb-mobile .order-summary { position: fixed; left: 16px; right: 16px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 44; width: auto; border-radius: 16px; padding: 12px; margin: 0; background: rgba(255,255,255,.94); box-shadow: 0 18px 46px rgba(15,23,42,.16); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
  .order-grid { grid-template-columns: 1fr; gap: 16px; }
  .numrow-right { width: 100%; padding-left: 0; margin-top: 12px; padding-top: 13px; border-top: 1px solid var(--border); justify-content: space-between; align-items: center; gap: 10px; }
  .numrow-codebox { margin-left: auto; }
  .numrow-status { flex-direction: row; align-items: center; gap: 9px; }
  .cancel-btn { flex: 0 0 auto; }
  .uc-actions { width: 100%; }
  .svcstat-opts { margin-left: 0; width: 100%; }
}

/* Telefon (≤ 600px) — %100 mobil uyum */
@media (max-width: 600px) {
  .login { position: fixed; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; min-height: 100dvh; padding: calc(14px + env(safe-area-inset-top)) 0 calc(14px + env(safe-area-inset-bottom)); background: #eef3ff; overflow-y: auto; }
  .login-bg { background: radial-gradient(circle at 50% 0%, rgba(99,102,241,.16), transparent 34%), linear-gradient(160deg, #eaf0ff 0%, #fbfcff 44%, #effbf7 100%); }
  .login-bg::before { opacity: .82; background-size: 25px 25px; mask-image: linear-gradient(180deg, rgba(0,0,0,.66), rgba(0,0,0,.2) 80%, transparent 100%); }
  .mobile-login-brand { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 11px; width: 100%; padding: 0 18px 12px; color: #11172f; font-size: 24px; font-weight: 850; letter-spacing: 0; }
  .mobile-login-logo { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(150deg, var(--accent-2), var(--accent)); color: #fff; font-size: 24px; box-shadow: 0 14px 26px rgba(79,70,229,.24); }
  .login-shell { z-index: 2; display: flex; flex-direction: column; width: min(420px, 100%); min-height: auto; height: auto; gap: 12px; padding: 0 18px; border-radius: 0; }
  .login-brand { display: none; }
  .login-card { width: 100%; max-width: none; min-height: 0; padding: 22px 20px 20px; border-radius: 22px; border: 1px solid rgba(199,210,254,.9); background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,255,.97)); box-shadow: 0 24px 70px rgba(31,41,92,.14); }
  .login-card::before, .login-card::after, .login-card-head, .login-request, .login-hint { display: none; }
  .mobile-card-intro { display: flex; flex-direction: column; align-items: center; text-align: center; margin: 0 0 18px; }
  .mobile-user-ic { width: 60px; height: 60px; border-radius: 18px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(150deg, var(--accent-2), var(--accent)); color: #fff; font-size: 33px; box-shadow: 0 18px 36px rgba(79,70,229,.24); }
  .mobile-card-intro h1 { margin-top: 15px; font-size: 27px; font-weight: 850; letter-spacing: 0; color: #11172f; }
  .mobile-card-intro p { margin: 6px 0 0; color: #65708d; font-size: 14.5px; line-height: 1.45; }
  .login-card .lbl { font-size: 14px; margin-bottom: 10px; }
  .input-wrap { margin-bottom: 14px; }
  .input-wrap > i { left: 19px; font-size: 23px; color: #8a94ad; }
  .input-wrap input { height: 58px; padding-left: 56px; border-radius: 14px; font-size: 16px; border-color: #d7def0; }
  .input-wrap input::placeholder { color: #a8b0c4; }
  .btn-block { height: 54px; min-height: 54px; border-radius: 13px; font-size: 16px; font-weight: 820; box-shadow: 0 16px 34px rgba(79,70,229,.24); }
  .mobile-login-tools { display: none; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 20px; color: #202842; font-size: 15px; }
  .mobile-login-tools label { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
  .mobile-check { width: 22px; height: 22px; border-radius: 6px; border: 2px solid #d2daec; background: #fff; flex: 0 0 auto; }
  .mobile-login-tools button { border: 0; background: transparent; color: var(--accent); padding: 0; font: inherit; font-weight: 650; cursor: pointer; white-space: nowrap; }
  .mobile-divider { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; color: #7a849e; margin: 14px 0; font-size: 15px; font-weight: 500; }
  .mobile-divider span { height: 1px; background: #e3e8f4; }
  .login-secure { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 14px; padding: 0; border: 0; }
  .login-secure span { min-width: 0; flex-direction: column; justify-content: center; gap: 4px; min-height: 66px; border-radius: 14px; background: linear-gradient(180deg, #f7f8ff, #eef3ff); border: 1px solid #dfe6ff; color: #252d4d; text-align: center; font-size: 11.5px; line-height: 1.2; }
  .login-secure i { font-size: 22px; color: var(--accent); }
  .login-noacc { height: 54px; min-height: 54px; border-radius: 15px; font-size: 16px; color: var(--accent); border-color: #b8b4ff; background: #fff; box-shadow: 0 14px 34px rgba(79,70,229,.1); }
  .mobile-login-trust { display: flex; align-items: flex-start; gap: 11px; padding: 13px 14px; border-radius: 18px; background: linear-gradient(180deg, #fff5f5, #fffafa); border: 1px solid rgba(220,38,38,.24); box-shadow: 0 18px 48px rgba(127,29,29,.08); text-align: left; }
  .mobile-login-trust::before { content: none; }
  .mobile-login-trust > i { width: 34px; height: 34px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--red); background: var(--red-soft); font-size: 20px; margin: 1px 0 0; }
  .mobile-login-trust b { display: block; color: var(--red); font-size: 12.8px; font-weight: 900; line-height: 1.32; }
  .mobile-login-trust small { display: block; margin-top: 4px; color: #991b1b; font-size: 11.7px; line-height: 1.35; }
  .mobile-login-copy { display: block; text-align: center; color: #7f8aa6; font-size: 12px; padding: 2px 0 0; }
  .main { padding: 15px 13px 40px; }
  body.bb-mobile .main { padding-bottom: 132px; }
  .topbar { gap: 10px; margin-bottom: 16px; }
  #view-title, .topbar-title h1 { font-size: 18px; line-height: 1.2; }
  .topsub { font-size: 11px; }
  .topbar-actions { gap: 8px; }
  .notif-btn { width: 38px; height: 38px; }
  .hamb { width: 40px; min-width: 40px; height: 40px; padding: 0; }
  .hamb i { font-size: 19px; }
  .filterbar .search, .filterbar .filter-svc-slot { flex: 1 1 100%; width: 100%; }
  .filterbar .filter-svc-slot .cdrop, .filterbar .filter-svc-slot .cdrop-btn { width: 100%; }
  .toast { top: calc(14px + env(safe-area-inset-top)); bottom: auto; width: min(360px, calc(100vw - 28px)); justify-content: center; border-radius: 16px; padding: 11px 14px; font-size: 13.5px; line-height: 1.35; transform: translateX(-50%) translateY(-16px); }
  .toast.show { transform: translateX(-50%) translateY(0); }
  .mode { padding: 5px 10px; font-size: 12px; }
  .sec-head { flex-wrap: wrap; row-gap: 4px; }
  .sec-title { font-size: 16px; }
  .card { padding: 16px 14px; border-radius: 15px; margin-bottom: 16px; }
  .mini-title { font-size: 14px; }
  .lbl.mt, .mt { margin-top: 14px; }
  .stats { grid-template-columns: 1fr 1fr; gap: 9px; }
  .stat { padding: 12px; gap: 10px; }
  .stat-num { font-size: 19px; }
  .stat-ic { width: 34px; height: 34px; font-size: 18px; }
  .stat-lbl { font-size: 11.5px; }
  /* Numara Al */
  .service { min-width: 0; flex: 1 1 128px; padding: 10px 14px 10px 10px; }
  .service-grid, .chips { gap: 8px; }
  .country-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .country { min-height: 64px; padding: 10px 9px; gap: 8px; }
  .country-flag { width: 28px; height: 21px; }
  .country-name { font-size: 13px; }
  .country-dial { font-size: 11.5px; }
  .country-price { font-size: 12.5px; }
  .country-right { padding-left: 5px; gap: 5px; }
  .country-tag { height: 16px; padding: 0 6px; font-size: 8.6px; }
  .country-tag i { font-size: 9.5px; }
  /* Liste modunda tam genişlik tek sütun — isimler tam görünür */
  .country-grid.list-mode { grid-template-columns: 1fr; }
  .country-grid.list-mode .country { padding: 13px 15px; gap: 12px; }
  .country-grid.list-mode .country-flag { width: 32px; height: 24px; }
  .ulke-head { flex-direction: column; align-items: stretch; gap: 8px; }
  .country-sort { justify-content: space-between; }
  .country-sort .fchip { flex: 1; justify-content: center; padding: 8px 6px; }
  /* Adım göstergesi — kompakt */
  .stepper-card { padding: 14px; }
  .stepper { gap: 6px; }
  .step { gap: 8px; }
  .step-num { width: 28px; height: 28px; font-size: 13px; }
  .step-txt b { font-size: 12px; }
  .step-txt small { display: none; }
  .step-line { min-width: 8px; }
  /* Kaynak / Servis kartları tek sütun */
  .pick-row { grid-template-columns: 1fr; gap: 14px; }
  /* Ülke seçim barı */
  .ulke-bar { gap: 8px; }
  .country-search { flex: 1 1 100%; }
  .ulke-sort, .country-sort-custom { flex: 1 1 auto; }
  .country-sort-custom .cdrop, .country-sort-custom .cdrop-btn { width: 100%; }
  /* Seçim özeti çubuğu */
  body.bb-mobile .order-summary { flex-direction: row; align-items: center; gap: 9px; flex-wrap: nowrap; padding: 10px; }
  body.bb-mobile .osum-items { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3px 8px; min-width: 0; }
  body.bb-mobile .osum-item { padding: 0; min-width: 0; }
  body.bb-mobile .osum-item:nth-of-type(1), body.bb-mobile .osum-item:nth-of-type(2) { display: none; }
  body.bb-mobile .osum-val { font-size: 12.5px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.bb-mobile .osum-lbl { font-size: 9px; }
  body.bb-mobile .osum-price { font-size: 16px; }
  body.bb-mobile .osum-sep { display: none; }
  body.bb-mobile .osum-btn { width: auto; min-width: 132px; flex: 0 0 auto; padding: 12px 14px; font-size: 13.5px; white-space: nowrap; }
  /* Güven özellikleri tek sütun */
  .order-features { grid-template-columns: 1fr; gap: 10px; }
  .actions { flex-direction: column; align-items: stretch; gap: 10px; }
  .actions .btn-accent { width: 100%; }
  .actions .hint { text-align: center; font-size: 12px; }
  /* Numaralar */
  .numrow { padding: 16px; gap: 13px; flex-wrap: wrap; }
  .numrow-ic { width: 46px; height: 46px; font-size: 23px; border-radius: 13px; }
  .numrow-phone { font-size: 17px; }
  .numrow-report { padding: 5px 9px; }
  .code { font-size: 18px; }
  /* Hesabım */
  .acc-bal-card { padding: 22px 20px; }
  .acc-bal-value { font-size: 30px; }
  /* Profil */
  .pf-head { gap: 12px; }
  .pf-av { width: 46px; height: 46px; font-size: 23px; }
  .pf-name { font-size: 18px; }
  .pf-a-row { flex-direction: column; }
  .pf-a-row .ubtn { width: 100%; }
  /* Kullanıcılar */
  .users-search { max-width: none; }
  .urow { padding: 12px 13px; gap: 10px; }
  .urow-av { width: 38px; height: 38px; font-size: 19px; }
  .urow-bal-v { font-size: 14px; }
  .urow-sub { font-size: 11.5px; }
  /* Modal */
  .modal { padding: calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom)); align-items: center; justify-content: center; }
  .modal-card { padding: 20px 16px; border-radius: 16px; max-height: min(90vh, 90dvh); }
  .modal-card:has(.stock-modal) { max-width: min(382px, calc(100vw - 24px)); }
  .stock-hero { padding: 14px; border-radius: 14px; align-items: flex-start; }
  .stock-ic { width: 42px; height: 42px; border-radius: 12px; font-size: 22px; }
  .stock-hero b { font-size: 15px; }
  .stock-hero small { font-size: 12px; }
  .stock-meta { grid-template-columns: 1fr; gap: 8px; }
  .stock-actions { grid-template-columns: 1fr; }
  .modal-card:has(.topup) { max-width: min(382px, calc(100vw - 24px)); padding: 16px 14px; }
  .topup { gap: 12px; }
  .topup-hero { padding: 14px; border-radius: 13px; }
  .topup-hero-ic { width: 42px; height: 42px; border-radius: 12px; font-size: 24px; }
  .topup-hero-txt b { font-size: 14px; }
  .topup-hero-txt small { font-size: 11.5px; line-height: 1.35; }
  .topup-contact { padding: 13px; border-radius: 13px; gap: 11px; }
  .topup-handle { font-size: 19px; }
  .topup-contact-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 8px; }
  .topup-contact-actions .btn-accent, .topup-contact-actions .ubtn { width: 100%; min-height: 43px; justify-content: center; padding: 9px 10px; font-size: 12.5px; }
  .topup-step { gap: 10px; }
  .topup-step-n { width: 25px; height: 25px; font-size: 12.5px; }
  .topup-step-t b { font-size: 13.5px; }
  .topup-step-t small { font-size: 11.5px; }
  .topup-coin { width: 36px; height: 36px; border-radius: 12px; font-size: 21px; }
  .modal-card:has(.support-modal.account-request) { max-width: min(424px, calc(100vw - 24px)); padding: 16px 14px; }
  .modal-title { font-size: 17px; }
  .support-modal.account-request { gap: 12px; }
  .support-modal.account-request .support-modal-hero { align-items: flex-start; padding: 14px; border-radius: 13px; }
  .support-modal.account-request .support-modal-ic { width: 42px; height: 42px; border-radius: 12px; font-size: 22px; }
  .support-modal.account-request .support-modal-hero b { font-size: 14px; }
  .support-modal.account-request .support-modal-hero small { font-size: 12px; }
  .support-modal.account-request .support-modal-grid { grid-template-columns: 1fr; gap: 8px; }
  .support-modal.account-request .support-modal-grid div { min-height: 0; padding: 11px 12px; border-radius: 12px; }
  .support-modal.account-request .support-modal-grid i { font-size: 19px; }
  .support-modal.account-request .support-modal-grid b { margin-top: 5px; font-size: 12.8px; }
  .support-modal.account-request .support-modal-grid span { margin-top: 3px; font-size: 11.8px; line-height: 1.35; }
  .support-modal.account-request .support-modal-warning { padding: 11px; border-radius: 12px; gap: 9px; }
  .support-modal.account-request .support-modal-warning i { width: 31px; height: 31px; border-radius: 9px; font-size: 18px; }
  .support-modal.account-request .support-modal-warning b { font-size: 12.5px; line-height: 1.32; }
  .support-modal.account-request .support-modal-warning small { font-size: 11.5px; line-height: 1.32; }
  .support-modal.account-request .support-modal-lines { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .support-modal.account-request .support-modal-lines div { padding: 9px 10px; border-radius: 12px; }
  .support-modal.account-request .support-modal-lines i { width: 31px; height: 31px; border-radius: 9px; font-size: 17px; }
  .support-modal.account-request .support-modal-lines b { font-size: 12.5px; }
  .support-modal.account-request .support-modal-lines small { font-size: 11.5px; line-height: 1.3; }
  .support-modal.account-request .support-modal-cta { gap: 9px; padding: 11px; border-radius: 14px; }
  .support-modal.account-request .support-modal-cta span { font-size: 12px; }
  .support-modal.account-request .support-modal-cta .btn-accent { min-height: 46px; font-size: 14px; }
  .support-modal.account-request .topup-contact { padding: 12px; gap: 11px; }
  .support-modal.account-request .topup-contact-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .support-modal.account-request .topup-handle { font-size: 18px; }
  .support-modal.account-request .support-modal-fineprint { align-items: flex-start; padding: 9px 10px; font-size: 11.4px; line-height: 1.35; }
  .support-modal.account-request .support-modal-fineprint i { margin-top: 1px; font-size: 15px; }
  .support-modal-lines div { padding: 10px 11px; }
  .nd-row { padding: 10px 13px; font-size: 13.5px; }
  .nd-note-slot { width: 100%; }
  .nd-note-display { max-width: 190px; }
  .nd-note-name, .nd-note-empty { max-width: 148px; padding: 6px 8px; font-size: 12px; }
  .nd-note-editor { width: min(210px, 52vw); gap: 5px; }
  .nd-note-editor .uc-input { flex-basis: 96px; height: 34px; font-size: 12.5px; }
  .nd-note-edit, .nd-note-save, .nd-note-cancel { width: 32px; height: 32px; border-radius: 9px; }
  /* İstatistik + filtre + şikayet */
  .period-tabs { width: 100%; }
  .ptab { flex: 1; padding: 8px 4px; font-size: 13px; }
  .provider-bal { padding: 11px 13px; }
  .prov-grid { grid-template-columns: 1fr; gap: 12px; }
  .cmp-top { flex-wrap: wrap; gap: 6px; }
  .cmp-actions { flex-direction: column; }
  .cmp-actions .btn-accent, .cmp-actions .ubtn { width: 100%; justify-content: center; }
  /* Fiyatlandırma başlık */
  .price-card-head { gap: 10px; }
  .price-master { margin-left: 0; width: 100%; }
  .price-master .ssopt { flex: 1; justify-content: center; }
  /* Duyuru + form butonları tam genişlik */
  .ann-form .btn-accent, .uc-form .btn-accent, .uc-create-actions .btn-accent, .bal-form .btn-accent { width: 100%; justify-content: center; }
  .uc-form { flex-direction: column; align-items: stretch; }
  .uc-form .uc-input { flex: 0 0 auto; width: 100%; min-width: 0; }
  .uc-form .fselect { width: 100%; }
  .uc-create-form { grid-template-columns: 1fr; gap: 15px; }
  .uc-create-token-field, .uc-role-field, .uc-create-actions { grid-column: auto; grid-row: auto; }
  .uc-role-picker { grid-template-columns: 1fr; }
  .uc-create-actions { align-items: stretch; flex-direction: column; gap: 10px; }
  .ann-select, .rep-form .fselect { width: 100%; }
}
@media (max-width: 380px) {
  .stat-num { font-size: 17px; }
  .acc-bal-value { font-size: 27px; }
}


/* ===== Bakım modu ===== */
/* Tam bakım sayfası — premium tam ekran */
.maint-page { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center; padding: 24px; background: linear-gradient(135deg, #1e1b4b 0%, #312e81 45%, #4c1d95 100%); overflow: hidden; }
.maint-bg { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.maint-box { position: relative; z-index: 2; text-align: center; color: #fff; max-width: 560px; animation: rise .35s ease both; }
.maint-anim { position: relative; width: 130px; height: 130px; margin: 0 auto 26px; }
.maint-gear { position: absolute; color: rgba(255,255,255,.9); }
.maint-gear i { display: block; }
.maint-gear.g1 { top: 0; left: 8px; font-size: 74px; animation: mspin 9s linear infinite; }
.maint-gear.g2 { bottom: 2px; right: 4px; font-size: 46px; color: #a5b4fc; animation: mspin-r 7s linear infinite; }
.maint-wrench { position: absolute; bottom: 6px; left: 2px; width: 44px; height: 44px; border-radius: 13px; background: linear-gradient(150deg, #fbbf24, #f59e0b); color: #78350f; display: inline-flex; align-items: center; justify-content: center; font-size: 24px; box-shadow: 0 8px 22px rgba(245,158,11,.4); animation: mwig 2.6s ease-in-out infinite; }
@keyframes mspin { to { transform: rotate(360deg); } }
@keyframes mspin-r { to { transform: rotate(-360deg); } }
@keyframes mwig { 0%,100% { transform: rotate(-8deg); } 50% { transform: rotate(10deg); } }
.maint-box h1 { font-size: 32px; font-weight: 750; letter-spacing: -.02em; }
.maint-sub { font-size: 15.5px; opacity: .88; margin: 10px auto 0; max-width: 460px; line-height: 1.6; }
.maint-chips { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.mp-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 650; padding: 7px 14px; border-radius: 999px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); color: #fff; }
.mp-chip i { font-size: 14px; }
.mp-chip.svc { background: rgba(99,102,241,.32); border-color: rgba(165,180,252,.45); }
.mp-chip.cty { background: rgba(34,211,238,.2); border-color: rgba(103,232,249,.4); }
.maint-eta { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; font-size: 14px; background: rgba(251,191,36,.16); border: 1px solid rgba(251,191,36,.4); color: #fde68a; border-radius: 12px; padding: 10px 18px; }
.maint-eta i { font-size: 18px; }
.maint-dots { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 26px; }
.maint-dots span { width: 8px; height: 8px; border-radius: 50%; background: #fff; opacity: .4; animation: oo-bounce 1.3s ease-in-out infinite; }
.maint-dots span:nth-child(2) { animation-delay: .2s; }
.maint-dots span:nth-child(3) { animation-delay: .4s; }
.maint-adminlink { position: fixed; right: 16px; bottom: 14px; display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.4); font-size: 11.5px; font-family: var(--font); padding: 7px 12px; border-radius: 9px; cursor: pointer; transition: all .15s; }
.maint-adminlink:hover { color: #fff; border-color: rgba(255,255,255,.45); }
.maint-autocheck { display: flex; align-items: center; gap: 10px; margin: 24px auto 0; max-width: 430px; font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.66); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 12px; padding: 12px 16px; text-align: left; }
.maint-autocheck i { font-size: 17px; flex: 0 0 auto; color: rgba(255,255,255,.85); animation: mspin 2.4s linear infinite; }
.maint-autocheck span { flex: 1 1 auto; }
.maint-autocheck b { color: #fff; font-weight: 700; }
@keyframes mspin { to { transform: rotate(360deg); } }

/* Admin üst şerit (tam bakım açıkken) */
.maint-banner { position: fixed; top: 0; left: 0; right: 0; z-index: 90; display: flex; align-items: center; justify-content: center; gap: 8px; background: linear-gradient(90deg, #b45309, #d97706); color: #fff; font-size: 13px; padding: 9px 14px; box-shadow: 0 4px 14px rgba(180,83,9,.35); }
.maint-banner i { font-size: 17px; }
.maint-banner button { margin-left: 10px; border: 1px solid rgba(255,255,255,.5); background: rgba(255,255,255,.14); color: #fff; font-size: 12px; font-weight: 650; font-family: var(--font); padding: 5px 13px; border-radius: 8px; cursor: pointer; transition: background .14s; }
.maint-banner button:hover { background: rgba(255,255,255,.26); }

/* Admin bakım kartı (Duyurular sayfası) */
.maint-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.maint-mode { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 13px 15px; text-align: left; background: var(--surface); border: 1.5px solid var(--border-strong); border-radius: 13px; cursor: pointer; font-family: var(--font); color: var(--text); transition: all .14s; }
.maint-mode i { font-size: 21px; color: var(--muted); margin-bottom: 3px; }
.maint-mode b { font-size: 14px; font-weight: 650; }
.maint-mode small { font-size: 11.5px; color: var(--muted); line-height: 1.3; }
.maint-mode:hover { border-color: var(--accent); }
.maint-mode.active { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px var(--accent-soft); }
.maint-mode.active i, .maint-mode.active b { color: var(--accent); }
.maint-mode[data-mode="full"].active { border-color: var(--amber); background: var(--amber-soft); box-shadow: 0 0 0 3px var(--amber-soft); }
.maint-mode[data-mode="full"].active i, .maint-mode[data-mode="full"].active b { color: var(--amber); }
.maint-form { display: flex; flex-direction: column; gap: 10px; }
.maint-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.maint-field { display: flex; flex-direction: column; min-width: 0; }
.maint-form .btn-accent { align-self: flex-start; margin-top: 4px; }

/* Bakım popup içeriği */
.modal-card:has(.mpop) { max-width: 460px; }
.mpop { display: flex; flex-direction: column; gap: 14px; }
.mpop-hero { display: flex; align-items: center; gap: 13px; background: linear-gradient(135deg, #1e1b4b, #4c1d95); border-radius: 14px; padding: 16px 18px; color: #fff; }
.mpop-ic { width: 44px; height: 44px; border-radius: 12px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(150deg, #fbbf24, #f59e0b); color: #78350f; font-size: 23px; animation: mwig 2.6s ease-in-out infinite; }
.mpop-ht { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mpop-ht b { font-size: 16px; font-weight: 700; }
.mpop-ht small { font-size: 12px; opacity: .8; }
.mpop-msg { margin: 0; font-size: 14px; color: var(--text-2); line-height: 1.55; }
.mpop-chips { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.mpop-chips .mp-chip { background: var(--accent-soft); border: 1px solid #dfe1fb; color: var(--accent); }
.mpop-chips .mp-chip.cty { background: var(--blue-soft); border-color: #cfe0fc; color: var(--blue); }
.mpop-eta { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; background: var(--amber-soft); color: var(--amber); border-radius: 10px; padding: 9px 14px; }
.mpop-btn { width: 100%; justify-content: center; }

@media (max-width: 600px) {
  .maint-box h1 { font-size: 25px; }
  .maint-sub { font-size: 14px; }
  .maint-anim { width: 108px; height: 108px; }
  .maint-gear.g1 { font-size: 60px; }
  .maint-gear.g2 { font-size: 38px; }
  .maint-modes { grid-template-columns: 1fr; }
  .maint-row { grid-template-columns: 1fr; }
  .maint-form .btn-accent { align-self: stretch; justify-content: center; }
  .maint-banner { font-size: 11.5px; flex-wrap: wrap; text-align: center; }
}

/* Bakım tipi seçici (planlı / anlık sorun) */
.maint-kinds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.maint-kind { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 13px 15px; text-align: left; background: var(--surface); border: 1.5px solid var(--border-strong); border-radius: 13px; cursor: pointer; font-family: var(--font); color: var(--text); transition: all .14s; }
.maint-kind i { font-size: 21px; color: var(--muted); margin-bottom: 3px; }
.maint-kind b { font-size: 14px; font-weight: 650; }
.maint-kind small { font-size: 11.5px; color: var(--muted); line-height: 1.3; }
.maint-kind:hover { border-color: var(--accent); }
.maint-kind.active { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px var(--accent-soft); }
.maint-kind.active i, .maint-kind.active b { color: var(--accent); }
.maint-kind[data-kind="issue"].active { border-color: var(--amber); background: var(--amber-soft); box-shadow: 0 0 0 3px var(--amber-soft); }
.maint-kind[data-kind="issue"].active i, .maint-kind[data-kind="issue"].active b { color: var(--amber); }

/* Servis/ülke tıkla-seç çipleri (bakım ayarı) */
.maint-picks { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.mpick { display: inline-flex; align-items: center; gap: 7px; padding: 8px 13px; border: 1.5px solid var(--border-strong); background: var(--surface); border-radius: 999px; cursor: pointer; font-size: 13px; font-weight: 600; font-family: var(--font); color: var(--text-2); transition: all .13s; }
.mpick:hover { border-color: var(--accent); color: var(--text); }
.mpick.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.mpick .svc-mini-ic { width: 20px; height: 20px; font-size: 12px; }
.mpick-flag { width: 20px; height: 14px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,23,42,.1); }
.mpick-chk { font-size: 15px; }

/* Bakım sayfası/popup — anlık sorun (issue) varyantı */
.maint-page.issue { background: linear-gradient(135deg, #451a03 0%, #7c2d12 45%, #92400e 100%); }
.maint-page.issue .maint-wrench { background: linear-gradient(150deg, #f87171, #dc2626); color: #fff; box-shadow: 0 8px 22px rgba(220,38,38,.45); }
.mpop.issue .mpop-hero { background: linear-gradient(135deg, #7c2d12, #b45309); }
.mpop.issue .mpop-ic { background: linear-gradient(150deg, #f87171, #dc2626); color: #fff; box-shadow: 0 6px 16px rgba(220,38,38,.4); }

/* Bakım çiplerinde bayrak */
.mp-flag { width: 18px; height: 13px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(255,255,255,.25); }
.mp-chip .svc-mini-ic { width: 18px; height: 18px; font-size: 11px; }

/* Matematik onaylı kritik işlem */
.mathq { background: var(--surface-2); border: 1px solid var(--border); border-radius: 13px; padding: 14px 16px; margin: 4px 0 16px; }
.mathq-lbl { display: block; font-size: 12px; font-weight: 600; color: var(--text-2); margin-bottom: 9px; }
.mathq-row { display: flex; align-items: center; gap: 12px; }
.mathq-q { font-family: var(--mono); font-size: 22px; font-weight: 800; color: var(--accent); white-space: nowrap; }
.mathq-inp { flex: 1; min-width: 0; max-width: 140px; }
.mathq-err { margin: 9px 0 0; font-size: 12.5px; color: var(--red); display: flex; align-items: center; gap: 5px; }
.modal-card.shake { animation: mshake .4s ease; }
@keyframes mshake { 0%,100% { transform: translateX(0); } 20% { transform: translateX(-9px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(4px); } }

@media (max-width: 600px) {
  .maint-kinds { grid-template-columns: 1fr; }
  .mathq-row { flex-wrap: wrap; }
}

/* ===== Deneyim ve güvenlik merkezi ===== */
.settings-hero { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; padding: 20px 22px; border: 1px solid color-mix(in srgb, var(--accent) 20%, var(--border)); border-radius: 18px; background: linear-gradient(135deg, color-mix(in srgb, var(--accent-soft) 70%, var(--surface)), var(--surface)); box-shadow: var(--shadow-xs); }
.settings-hero-copy { min-width: 0; display: flex; align-items: center; gap: 13px; }
.settings-hero-copy > span { width: 48px; height: 48px; border-radius: 14px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(145deg, var(--accent-2), var(--accent)); box-shadow: 0 12px 24px color-mix(in srgb, var(--accent) 24%, transparent); font-size: 24px; }
.settings-kicker { color: var(--accent); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.settings-hero h2 { margin: 2px 0 3px; color: var(--text); font-size: 20px; }
.settings-hero p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.settings-nav { flex: 0 0 auto; display: grid; grid-template-columns: repeat(4, minmax(82px, 1fr)); gap: 7px; }
.settings-nav button { min-height: 52px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 7px 10px; border: 1px solid var(--border); border-radius: 12px; color: var(--text-2); background: var(--surface); font: 700 11px var(--font); cursor: pointer; transition: border-color .15s ease, color .15s ease, background .15s ease, transform .15s ease; }
.settings-nav button i { color: var(--accent); font-size: 18px; }
.settings-nav button:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); transform: translateY(-1px); }
.settings-section-head { scroll-margin-top: 20px; display: flex; align-items: center; gap: 10px; margin: 22px 4px 10px; }
.settings-section-head:first-of-type { margin-top: 0; }
.settings-section-head > span { width: 34px; height: 34px; border-radius: 10px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: var(--accent-soft); font-size: 18px; }
.settings-section-head b { display: block; color: var(--text); font-size: 14px; }
.settings-section-head small { display: block; margin-top: 2px; color: var(--muted); font-size: 11.5px; }
.settings-feature-card { margin-bottom: 0; }
.settings-system-grid { display: grid; grid-template-columns: minmax(300px, .85fr) minmax(420px, 1.15fr); gap: 16px; }
.settings-system-grid > .card { height: 100%; }
.experience-card, .security-settings-card { overflow: hidden; }
.experience-head, .security-head { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 18px; }
.experience-head .mini-title, .security-head .mini-title { margin: 1px 0 3px; }
.experience-head .card-hint, .security-head .card-hint { margin: 0; }
.experience-head-icon, .security-head-icon { width: 42px; height: 42px; border-radius: 13px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent); font-size: 21px; }
.security-head-icon { color: var(--green); background: var(--green-soft); border-color: color-mix(in srgb, var(--green) 24%, transparent); }
.experience-grid { display: grid; gap: 12px; }
.experience-group { min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); }
.experience-group-head { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 10px 14px; border-bottom: 1px solid var(--border); background: var(--surface-2); }
.experience-group-head > i { width: 34px; height: 34px; border-radius: 10px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: var(--accent-soft); font-size: 18px; }
.experience-group-head span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.experience-group-head b { color: var(--text); font-size: 13px; }
.experience-group-head small { color: var(--muted); font-size: 11px; line-height: 1.35; }
.experience-item { min-width: 0; display: grid; grid-template-columns: minmax(240px, .85fr) minmax(380px, 1.15fr); align-items: center; gap: 18px; padding: 14px; border-bottom: 1px solid var(--border); }
.experience-group .experience-item:last-child { border-bottom: 0; }
.experience-copy { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 13px; }
.experience-copy h3 { margin: 1px 0 4px; font-size: 14px; color: var(--text); }
.experience-copy p { margin: 0; font-size: 12px; line-height: 1.45; color: var(--muted); }
.experience-icon { width: 34px; height: 34px; border-radius: 10px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; font-size: 18px; }
.experience-icon.blue { color: var(--blue); background: var(--blue-soft); }
.experience-icon.violet { color: var(--accent); background: var(--accent-soft); }
.experience-icon.cyan { color: #0284c7; background: #e0f2fe; }
.experience-icon.amber { color: var(--amber); background: var(--amber-soft); }
.experience-icon.green { color: var(--green); background: var(--green-soft); }
.experience-icon.rose { color: #e11d48; background: #fff1f2; }
.experience-item .experience-copy { margin-bottom: 0; }
.experience-item .bb-mode-row { margin-top: 0; }
.experience-item .bb-mode-btn { min-width: 0; }
.bool-mode-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
:root[data-theme="dark"] .experience-icon.cyan { background: rgba(14,165,233,.14); color: #38bdf8; }
:root[data-theme="dark"] .experience-icon.rose { background: rgba(244,63,94,.14); color: #fb7185; }
.live-signal-experience-item, .order-experience-item { border-right: 0 !important; }
.order-experience-item { display: block; border-bottom: 0 !important; }
.order-experience-item .experience-copy { margin-bottom: 13px; }
.order-experience-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.order-setting-line { min-width: 0; display: flex; flex-direction: column; gap: 11px; padding: 13px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-2); }
.order-setting-line.animation-setting { grid-column: 1 / -1; }
.order-setting-line > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.order-setting-line b { color: var(--text); font-size: 12.5px; }
.order-setting-line small { color: var(--muted); font-size: 11px; line-height: 1.4; }
.order-setting-line .bb-mode-row { margin-top: auto; }
.order-animation-mode-row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

.security-2fa { display: grid; gap: 10px; margin-top: 4px; }
.security-state { display: flex; align-items: center; gap: 13px; padding: 15px 16px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface-2); }
.security-state.enabled { border-color: color-mix(in srgb, var(--green) 34%, var(--border)); background: linear-gradient(135deg, var(--green-soft), var(--surface)); }
.security-state.critical-state.enabled { border-color: color-mix(in srgb, var(--accent) 28%, var(--border)); background: linear-gradient(135deg, var(--accent-soft), var(--surface)); }
.security-state.critical-state.enabled .security-state-icon { color: var(--accent); }
.security-state.session-revoke-state { border-color: color-mix(in srgb, var(--red) 18%, var(--border)); }
.security-state.session-revoke-state .security-state-icon { color: var(--red); background: var(--red-soft); }
.security-state.error { border-color: color-mix(in srgb, var(--red) 30%, var(--border)); }
.security-state-icon, .security-state > span:first-child { width: 42px; height: 42px; border-radius: 12px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; background: var(--surface); color: var(--muted); font-size: 22px; box-shadow: var(--shadow-xs); }
.security-state.enabled .security-state-icon { color: var(--green); }
.security-state-copy, .security-state > div { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 3px; }
.security-state-copy b, .security-state > div b { font-size: 14px; color: var(--text); }
.security-state-copy small, .security-state > div small { color: var(--muted); font-size: 12px; line-height: 1.4; }
.audit-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--border); }
.audit-head h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 3px; font-size: 15px; color: var(--text); }
.audit-head h3 i { color: var(--accent); }
.audit-head p { margin: 0; color: var(--muted); font-size: 12px; }
.audit-refresh.is-loading i { animation: spin .75s linear infinite; }
.audit-list { display: grid; gap: 8px; margin-top: 12px; }
.audit-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) minmax(180px, auto); align-items: center; gap: 11px; padding: 11px 13px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.audit-icon { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: var(--green); background: var(--green-soft); font-size: 18px; }
.audit-row.fail .audit-icon { color: var(--red); background: var(--red-soft); }
.audit-main { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.audit-main b { color: var(--text); font-size: 13px; text-transform: none; }
.audit-main span { color: var(--muted); font-family: var(--mono); font-size: 11px; overflow-wrap: anywhere; }
.audit-side { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; color: var(--muted); font-size: 11px; text-align: right; }
.audit-side span { max-width: 100%; overflow-wrap: anywhere; }
.audit-side time { color: var(--text-2); font-weight: 600; }
.audit-pager { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 13px; }
.audit-pager span { min-width: 90px; text-align: center; color: var(--muted); font-size: 12px; }

/* 2FA ve giriş doğrulama */
.modal-card:has(.login-otp), .modal-card:has(.totp-setup), .modal-card:has(.totp-disable), .modal-card:has(.recovery-view) { max-width: 520px; }
.login-otp, .totp-disable { display: flex; flex-direction: column; align-items: stretch; }
.login-otp { text-align: center; }
.login-otp-icon { width: 68px; height: 68px; border-radius: 21px; display: inline-flex; align-items: center; justify-content: center; align-self: center; color: var(--accent); background: var(--accent-soft); font-size: 34px; box-shadow: 0 0 0 8px color-mix(in srgb, var(--accent) 7%, transparent); }
.login-otp h3 { margin: 17px 0 5px; font-size: 19px; color: var(--text); }
.login-otp > p, .totp-disable > p { margin: 0 0 18px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.login-otp .mini-lbl { text-align: left; }
.otp-input { height: 50px; text-align: center; font-family: var(--mono); font-size: 22px; font-weight: 800; letter-spacing: .22em; }
.login-otp .btn-accent, .totp-disable .btn-danger, .totp-setup > .btn-accent { width: 100%; justify-content: center; margin-top: 12px; }
.totp-setup { display: flex; flex-direction: column; }
.modal-card:has(.session-revoke-confirm) { max-width: 520px; }
.session-revoke-confirm { display: flex; flex-direction: column; align-items: center; text-align: center; }
.session-revoke-icon { width: 68px; height: 68px; display: inline-flex; align-items: center; justify-content: center; border-radius: 21px; color: var(--red); background: var(--red-soft); box-shadow: 0 0 0 8px color-mix(in srgb, var(--red) 7%, transparent); font-size: 32px; }
.session-revoke-confirm h3 { margin: 18px 0 7px; color: var(--text); font-size: 19px; }
.session-revoke-confirm > p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.session-revoke-confirm > p b { color: var(--text); }
.session-revoke-note { width: 100%; display: flex; align-items: flex-start; gap: 9px; margin-top: 17px; padding: 11px 12px; border: 1px solid color-mix(in srgb, var(--green) 22%, var(--border)); border-radius: 11px; color: var(--text-2); background: color-mix(in srgb, var(--green-soft) 60%, var(--surface)); font-size: 12px; line-height: 1.45; text-align: left; }
.session-revoke-note i { margin-top: 1px; color: var(--green); font-size: 17px; }
.session-revoke-actions { width: 100%; display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: 9px; margin-top: 17px; }
.session-revoke-actions > button { width: 100%; justify-content: center; }
.totp-step { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 14px; }
.totp-step > span { width: 28px; height: 28px; border-radius: 9px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: var(--accent); font-size: 12px; font-weight: 800; }
.totp-step b { display: block; color: var(--text); font-size: 14px; }
.totp-step p { margin: 3px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.totp-step.verify { margin-top: 18px; }
.secret-copy { display: grid; grid-template-columns: minmax(0, 1fr) 40px; align-items: center; gap: 8px; margin-bottom: 11px; }
.secret-copy code { display: block; min-width: 0; padding: 11px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); color: var(--text); font-family: var(--mono); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.secret-copy.uri code { font-size: 10px; }
.recovery-view { text-align: center; }
.recovery-icon { width: 66px; height: 66px; border-radius: 20px; display: inline-flex; align-items: center; justify-content: center; color: var(--amber); background: var(--amber-soft); font-size: 32px; }
.recovery-view h2 { margin: 15px 0 5px; color: var(--text); font-size: 20px; }
.recovery-view > p { margin: 0 auto 16px; max-width: 420px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.recovery-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 12px; border: 1px dashed var(--border-strong); border-radius: 13px; background: var(--surface-2); }
.recovery-codes code { padding: 8px; border-radius: 8px; background: var(--surface); color: var(--text); font-family: var(--mono); font-size: 12px; letter-spacing: .04em; }
.recovery-actions { display: flex; justify-content: center; gap: 9px; margin-top: 15px; }

/* Sunucu tabanlı kritik işlem kapısı */
.critical-gate { position: fixed; inset: 0; z-index: 520; display: flex; align-items: center; justify-content: center; padding: 18px; }
.critical-scrim { position: absolute; inset: 0; background: rgba(2,6,23,.72); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.critical-card { position: relative; width: min(440px, 100%); padding: 25px; border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--border)); border-radius: 20px; background: var(--surface); box-shadow: 0 30px 90px rgba(2,6,23,.42); animation: rise .18s ease both; }
.critical-close { position: absolute; right: 13px; top: 13px; width: 36px; height: 36px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--muted); cursor: pointer; }
.critical-icon { width: 54px; height: 54px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: var(--accent-soft); font-size: 27px; }
.critical-eyebrow { margin-top: 14px; color: var(--accent); font-size: 10px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.critical-card h2 { margin: 4px 42px 6px 0; color: var(--text); font-size: 20px; line-height: 1.25; }
.critical-card > p { margin: 0 0 17px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.critical-proof { font-family: var(--mono); }
.critical-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 14px; }

/* Kullanıcıya özel dört adımlı tur */
.user-tour { position: fixed; inset: 0; z-index: 360; pointer-events: auto; }
.tour-spotlight { position: fixed; border: 2px solid #60a5fa; border-radius: 14px; box-shadow: 0 0 0 9999px rgba(2,6,23,.72), 0 0 0 5px rgba(96,165,250,.18), 0 0 34px rgba(59,130,246,.42); transition: left .25s ease, top .25s ease, width .25s ease, height .25s ease; pointer-events: none; }
.tour-card { position: fixed; padding: 18px; border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--border)); border-radius: 17px; background: var(--surface); box-shadow: 0 24px 70px rgba(2,6,23,.38); transition: left .25s ease, top .25s ease; }
.tour-progress { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin-bottom: 14px; }
.tour-progress span { height: 3px; border-radius: 999px; background: var(--border-strong); }
.tour-progress span.on { background: linear-gradient(90deg, var(--accent), #38bdf8); }
.tour-icon { width: 42px; height: 42px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: var(--accent-soft); font-size: 21px; }
.tour-step-label { display: inline-block; margin-left: 9px; color: var(--muted); font-size: 11px; font-weight: 750; vertical-align: middle; }
.tour-card h2 { margin: 12px 0 5px; color: var(--text); font-size: 18px; }
.tour-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.tour-actions { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 16px; }
.tour-skip { border: 0; background: transparent; color: var(--muted); font: 650 13px var(--font); cursor: pointer; padding: 9px; }
.tour-next { justify-content: center; min-width: 104px; }

/* Kod geldiğinde kısa, erişilebilir canlı sinyal */
.live-code-signal { position: fixed; right: 22px; top: 22px; z-index: 410; display: flex; align-items: center; gap: 12px; min-width: 290px; max-width: calc(100vw - 28px); padding: 13px 15px; border: 1px solid rgba(52,211,153,.38); border-radius: 16px; color: #ecfdf5; background: linear-gradient(135deg, rgba(6,78,59,.97), rgba(5,46,78,.97)); box-shadow: 0 20px 55px rgba(2,6,23,.35), 0 0 0 1px rgba(255,255,255,.05) inset; opacity: 0; transform: translateY(-18px) scale(.96); transition: opacity .22s ease, transform .25s cubic-bezier(.2,.8,.2,1); pointer-events: none; }
.live-code-signal.show { opacity: 1; transform: translateY(0) scale(1); }
.live-signal-pulse { position: relative; width: 44px; height: 44px; border-radius: 14px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(145deg, #34d399, #0ea5e9); font-size: 22px; }
.live-signal-pulse::before, .live-signal-pulse::after { content: ""; position: absolute; inset: -5px; border: 1px solid rgba(52,211,153,.55); border-radius: 17px; animation: liveSignalPulse 1.35s ease-out infinite; }
.live-signal-pulse::after { animation-delay: .45s; }
.live-signal-copy { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.live-signal-copy small { color: #a7f3d0; font-size: 11px; }
.live-signal-copy b { margin-top: 1px; color: #fff; font-family: var(--mono); font-size: 20px; letter-spacing: .05em; }
@keyframes liveSignalPulse { from { opacity: .8; transform: scale(.86); } to { opacity: 0; transform: scale(1.32); } }

/* Sipariş detayındaki gerçek olay zaman çizelgesi */
.order-timeline { margin: 14px 0; padding: 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); }
.order-timeline-head { display: flex; align-items: center; gap: 7px; margin-bottom: 12px; color: var(--text); font-size: 13px; font-weight: 800; }
.order-timeline-head i { color: var(--accent); }
.order-timeline-list { display: grid; }
.order-time-event { position: relative; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; min-height: 49px; }
.order-time-event:not(:last-child)::before { content: ""; position: absolute; left: 16px; top: 31px; bottom: -3px; width: 2px; background: var(--border-strong); }
.order-time-dot { position: relative; z-index: 1; width: 34px; height: 34px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; color: var(--green); background: var(--green-soft); border: 1px solid color-mix(in srgb, var(--green) 25%, var(--border)); }
.order-time-event.current .order-time-dot { color: var(--accent); background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 25%, var(--border)); }
.order-time-event.danger .order-time-dot { color: var(--red); background: var(--red-soft); border-color: color-mix(in srgb, var(--red) 25%, var(--border)); }
.order-time-event > span:last-child { display: flex; flex-direction: column; padding-top: 1px; }
.order-time-event b { color: var(--text); font-size: 12.5px; }
.order-time-event small { margin-top: 2px; color: var(--muted); font-size: 11px; }
.pf-tg-health { display: flex; align-items: center; gap: 10px; margin-bottom: 13px; padding: 11px 13px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); }
.pf-tg-health > i { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: var(--green); background: var(--green-soft); font-size: 18px; }
.pf-tg-health.offline > i { color: var(--amber); background: var(--amber-soft); }
.pf-tg-health span { display: flex; flex-direction: column; gap: 2px; }
.pf-tg-health b { color: var(--text); font-size: 13px; }
.pf-tg-health small { color: var(--muted); font-size: 11.5px; line-height: 1.35; }

@media (max-width: 1100px) {
  .settings-hero { align-items: stretch; flex-direction: column; }
  .settings-nav { width: 100%; }
  .settings-system-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .settings-hero { padding: 16px; }
  .settings-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-nav button { min-height: 48px; flex-direction: row; }
  .experience-item { grid-template-columns: 1fr; gap: 12px; border-right: 0; border-bottom: 1px solid var(--border); }
  .experience-group .experience-item:last-child { border-bottom: 0; }
  .order-experience-controls { grid-template-columns: 1fr; }
  .order-setting-line.animation-setting { grid-column: auto; }
  .security-state { align-items: flex-start; flex-wrap: wrap; }
  .security-state-copy, .security-state > div { width: calc(100% - 58px); flex: 1 1 calc(100% - 58px); }
  .security-state > button { width: 100%; justify-content: center; }
  .audit-row { grid-template-columns: 34px minmax(0, 1fr); }
  .audit-side { grid-column: 2; align-items: flex-start; text-align: left; }
  .live-code-signal { left: 14px; right: 14px; top: calc(14px + env(safe-area-inset-top)); min-width: 0; }
}
@media (max-width: 420px) {
  .ann-audience-modes { grid-template-columns: 1fr; gap: 8px; }
  .ann-audience-choice { min-height: 62px; grid-template-columns: 38px minmax(0, 1fr) 18px; padding: 8px 10px; }
  .ann-audience-icon { width: 38px; height: 38px; border-radius: 11px; font-size: 19px; }
  .ann-person-picker { padding: 8px; }
  .ann-target-trigger { min-height: 54px; padding: 7px 9px; }
  .ann-target-panel { left: 0; right: 0; padding: 8px; }
  .ann-target-list { max-height: min(270px, 48vh); }
  .uc-token-builder { grid-template-columns: 38px minmax(0, 1fr) 50px; }
  .uc-token-input { font-size: 11px; letter-spacing: 0; }
  .uc-token-refresh { min-width: 50px; padding: 0 10px; }
  .uc-token-refresh span { display: none; }
  .session-revoke-actions { grid-template-columns: 1fr; }
  .numrow-time-code { margin-right: 0; }
  .numrow-codebox { max-width: 100%; }
  .numrow-codebox .code { min-width: 0; padding-left: 12px; padding-right: 10px; font-size: 18px; letter-spacing: 2px; }
  .settings-hero-copy { align-items: flex-start; }
  .settings-hero-copy > span { width: 42px; height: 42px; font-size: 21px; }
  .settings-nav button { padding: 7px 6px; font-size: 10.5px; }
  .settings-section-head { align-items: flex-start; }
  .experience-card, .security-settings-card { padding-left: 14px; padding-right: 14px; }
  .experience-head, .security-head { gap: 10px; }
  .experience-head-icon, .security-head-icon { width: 38px; height: 38px; }
  .experience-item { padding: 14px 12px; }
  .experience-item .bb-mode-row { gap: 6px; }
  .experience-item .bb-mode-btn { padding: 9px 6px; font-size: 11px; }
  .experience-item .bb-mode-btn i { font-size: 17px; }
  .order-setting-line { padding: 11px; }
  .order-animation-mode-row .bb-mode-btn { padding-left: 4px; padding-right: 4px; font-size: 10.5px; }
  .audit-head { align-items: flex-start; }
  .audit-refresh { font-size: 0; width: 39px; height: 39px; padding: 0; justify-content: center; }
  .audit-refresh i { font-size: 17px; }
  .audit-pager { gap: 6px; }
  .audit-pager .ubtn { padding: 9px 10px; font-size: 11px; }
  .recovery-codes { grid-template-columns: 1fr; }
  .recovery-actions, .critical-actions { flex-direction: column-reverse; }
  .recovery-actions > *, .critical-actions > * { width: 100%; justify-content: center; }
  .critical-card { padding: 21px 17px 17px; border-radius: 17px; }
  .critical-card h2 { font-size: 18px; }
  .tour-card { padding: 15px; }
  .tour-card h2 { font-size: 16px; }
  .tour-card p { font-size: 12px; }
  .live-code-signal { padding: 11px 12px; border-radius: 14px; }
  .live-signal-pulse { width: 39px; height: 39px; }
  .live-signal-copy b { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .critical-card, .tour-spotlight, .tour-card, .live-code-signal, .live-signal-pulse::before, .live-signal-pulse::after { animation: none !important; transition-duration: .01ms !important; }
  .tour-spotlight, .tour-card { transition: none !important; }
}

/* ===== Hesaba bağlı sipariş görünümleri ===== */
.order-view-toggle { display: inline-flex; align-items: center; flex: 0 0 auto; padding: 3px; border: 1px solid var(--border-strong); border-radius: 12px; background: var(--surface-2); box-shadow: var(--shadow-xs); }
.order-view-toggle button { min-width: 76px; height: 36px; padding: 0 11px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-family: var(--font); font-size: 12px; font-weight: 750; cursor: pointer; transition: color .14s, background .14s, box-shadow .14s; }
.order-view-toggle button:hover { color: var(--text); }
.order-view-toggle button.active { color: var(--accent); background: var(--surface); box-shadow: 0 3px 10px rgba(15,23,42,.08); }
.order-view-toggle button i { font-size: 16px; }

.user-order-table-scroll { width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-xs); scrollbar-width: thin; }
.user-order-table { min-width: 1080px; }
.user-order-row { display: grid; grid-template-columns: 1.25fr 1.15fr .9fr .82fr .9fr .95fr 1.28fr; align-items: center; gap: 12px; min-height: 68px; padding: 11px 16px; border-bottom: 1px solid var(--border); color: var(--text); font-size: 12.5px; cursor: pointer; transition: background .13s; }
.user-order-row:last-child { border-bottom: 0; }
.user-order-row:not(.user-order-head):hover { background: color-mix(in srgb, var(--accent-soft) 48%, var(--surface)); }
.user-order-head { min-height: 48px; background: var(--surface-2); color: var(--text-2); font-size: 10.5px; font-weight: 750; text-transform: uppercase; letter-spacing: .045em; cursor: default; }
.uot-phone { min-width: 0; display: flex; align-items: center; gap: 7px; }
.uot-phone b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uot-phone .numrow-act { width: 29px; height: 29px; border-radius: 8px; }
.uot-source { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-2); }
.uot-code { min-width: 0; }
.uot-empty { color: var(--muted); }
.uot-action { display: flex; align-items: center; justify-content: flex-start; gap: 8px; min-width: 0; }
.uot-action .cancel-btn { min-width: 108px; padding-left: 9px; padding-right: 9px; }
.numrow-codebox.compact { width: 146px; max-width: 100%; }
.numrow-codebox.compact .code { flex: 1 1 auto; min-width: 0; justify-content: center; padding-left: 9px; padding-right: 8px; font-size: 15px; letter-spacing: 1.7px; }
.numrow-codebox.compact .copy-code { width: 36px; min-height: 38px; }
.order-country-cell { min-width: 0; display: flex; align-items: center; gap: 8px; }
.order-country-cell > img { width: 25px; height: 18px; border-radius: 4px; object-fit: cover; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(15,23,42,.09); }
.order-country-cell > span { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.order-country-cell b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; }
.order-country-cell small { color: var(--muted); font-family: var(--mono); font-size: 10.5px; }

/* Yönetici tablosuna ülke alanı ve isteğe bağlı kart görünümü. */
#admin-list { overflow: visible; }
.admin-table-scroll { width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border-radius: 16px; scrollbar-width: thin; }
.admtable { min-width: 1160px; }
.admrow { grid-template-columns: 1.4fr 1.15fr 1.05fr .86fr .78fr .92fr .72fr .9fr; }
.admin-order-grid { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(270px, 1fr)); gap: 13px; padding: 4px; }
.admin-order-card { min-width: 0; border: 1px solid var(--border); outline: none; border-radius: 16px; padding: 16px; background: var(--surface); color: var(--text); text-align: left; font-family: var(--font); cursor: pointer; box-shadow: var(--shadow-xs); transition: border-color .14s, box-shadow .14s; }
.admin-order-card:hover { border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); box-shadow: var(--shadow); }
.admin-order-card:focus-visible { border-color: var(--accent); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent), var(--shadow); }
.aoc-top, .aoc-bottom { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.aoc-top .admuser { flex: 1; min-width: 0; }
.aoc-phone { display: block; margin: 15px 0 10px; font-size: 17px; font-weight: 800; letter-spacing: .02em; }
.aoc-country { display: block; padding: 10px 11px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-2); }
.aoc-meta { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 8px; margin: 11px 0 13px; color: var(--text-2); font-size: 12px; }
.aoc-meta > span { min-width: 0; display: flex; align-items: center; gap: 6px; }
.aoc-bottom { padding-top: 12px; border-top: 1px solid var(--border); }
.aoc-bottom .admcode { color: var(--code); }

/* Kod kopyalamada yalnız kısa renk/parlama — ölçü ve konum değişmez. */
.numrow-codebox.copy-flash-ok { animation: codeGlowOk .72s ease both; }
.numrow-codebox.copy-flash-fail { animation: codeGlowFail .72s ease both; }
@keyframes codeGlowOk {
  0%, 100% { border-color: color-mix(in srgb, var(--code) 18%, var(--border)); box-shadow: 0 5px 14px color-mix(in srgb, var(--code) 8%, transparent); }
  38% { border-color: color-mix(in srgb, var(--green) 64%, var(--border)); background: color-mix(in srgb, var(--green-soft) 74%, var(--surface)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--green) 13%, transparent), 0 8px 22px color-mix(in srgb, var(--green) 18%, transparent); }
}
@keyframes codeGlowFail {
  0%, 100% { border-color: color-mix(in srgb, var(--code) 18%, var(--border)); }
  38% { border-color: color-mix(in srgb, var(--red) 62%, var(--border)); background: color-mix(in srgb, var(--red-soft) 72%, var(--surface)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--red) 12%, transparent); }
}

/* Masaüstü sipariş kartları: geçmiş kompakt ve okunaklı, aktif işlem ferah. */
@media (min-width: 861px) {
  .numrow { display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(230px, 255px); align-items: center; }
  .numrow-right { width: 100%; min-width: 0; }
  .numrow-msg { min-height: 50px; align-items: flex-start; }
  .numrow-msg-txt { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.35; }
  .numrow-right .numrow-codebox { width: 196px; }
  .numrow-right .numrow-codebox .code { flex: 1 1 auto; min-width: 0; justify-content: center; }

  .history-row {
    --row-accent: var(--accent);
    position: relative;
    grid-template-columns: 48px minmax(0, 1fr) 204px;
    align-items: start;
    column-gap: 16px;
    padding: 16px 18px 16px 20px;
    overflow: hidden;
    border-color: color-mix(in srgb, var(--row-accent) 12%, var(--border));
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(15,23,42,.045);
    transition: border-color .15s ease, box-shadow .15s ease;
  }
  .history-row:hover {
    border-color: color-mix(in srgb, var(--row-accent) 26%, var(--border));
    box-shadow: 0 7px 20px rgba(15,23,42,.07);
  }
  .history-row::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 18px;
    bottom: 18px;
    width: 4px;
    border-radius: 999px;
    background: var(--row-accent);
    box-shadow: 0 3px 9px color-mix(in srgb, var(--row-accent) 22%, transparent);
  }
  .history-row.svc-wa { --row-accent: #20b85a; }
  .history-row.svc-tg { --row-accent: #249bd4; }
  .history-row.svc-gm { --row-accent: #e45145; }
  .history-row.svc-ap { --row-accent: #667085; }
  .history-row.svc-gen { --row-accent: var(--accent); }
  .history-row .numrow-ic {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    font-size: 23px;
    box-shadow: none;
  }
  .history-row .numrow-main { align-self: stretch; }
  .history-row .numrow-top { min-height: 33px; }
  .history-row .numrow-phone { font-size: 16.5px; letter-spacing: .25px; }
  .history-row .numrow-sub { margin-top: 1px; }
  .history-row .numrow-msg {
    min-height: 42px;
    margin-top: 10px;
    padding: 6px 7px 6px 11px;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--surface-2) 78%, var(--surface));
  }
  .history-row .numrow-msg-txt {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 1.35;
  }
  .history-row .msg-copy {
    width: 30px;
    height: 30px;
    border-color: transparent;
    background: var(--surface);
  }
  .history-row .numrow-note { margin-top: 8px; }
  .history-row .numrow-right {
    align-self: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
  }
  .history-row .numrow-right .numrow-codebox {
    width: 198px;
    min-width: 198px;
    border-color: color-mix(in srgb, var(--code) 21%, var(--border));
    border-radius: 11px;
    box-shadow: none;
  }
  .history-row .numrow-codebox .code {
    padding: 7px 11px 7px 13px;
    font-size: 18px;
    letter-spacing: 2.2px;
  }
  .history-row .numrow-codebox .copy-code { width: 44px; }
  .history-row .numrow-right > .badge:only-child { margin-left: auto; }
}
.numrow-mini-flow { position: relative; width: min(470px, 100%); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 0; margin-top: 12px; padding: 0 2px 2px; }
.mini-flow-track { position: absolute; z-index: 0; top: 10px; left: calc(100% / 6); right: calc(100% / 6); height: 2px; border-radius: 999px; overflow: hidden; background: var(--border-strong); }
.mini-flow-track > span { display: block; width: 50%; height: 100%; border-radius: inherit; background: var(--green); transition: width .24s ease; }
.numrow-mini-flow.completed .mini-flow-track > span { width: 100%; }
.numrow-mini-flow .mini-flow-step { position: relative; z-index: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 6px; color: var(--muted); text-align: center; }
.numrow-mini-flow .mini-flow-step i { box-sizing: border-box; width: 22px; height: 22px; min-width: 22px; display: inline-flex; align-items: center; justify-content: center; margin: 0; border-radius: 50%; font-size: 12px; line-height: 1; }
.numrow-mini-flow .mini-flow-step i::before { display: block; width: 1em; height: 1em; margin: 0; line-height: 1; text-align: center; }
.numrow-mini-flow .mini-flow-step small { width: 100%; max-width: 145px; min-height: 22px; display: flex; align-items: flex-start; justify-content: center; padding: 0 4px; white-space: normal; color: inherit; font-size: 10px; font-weight: 750; line-height: 1.15; }
.numrow-mini-flow .mini-flow-step.done i { color: #fff; border: 1px solid var(--green); background: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 9%, transparent); }
.numrow-mini-flow .mini-flow-step.current i { color: var(--wait-tone, #0284c7); border: 1px solid color-mix(in srgb, var(--wait-tone, #0284c7) 46%, var(--border)); background: color-mix(in srgb, var(--wait-tone, #0284c7) 8%, var(--surface)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--wait-tone, #0284c7) 8%, transparent); }
.numrow-mini-flow .mini-flow-step.future i { color: var(--muted); border: 1px solid var(--border-strong); background: var(--surface); box-shadow: none; }

@media (max-width: 860px) {
  .active-row .numrow-status { flex-direction: column; align-items: flex-start; gap: 5px; }
  .active-row .numrow-right.pending-actions { grid-template-columns: max-content auto; justify-content: end; column-gap: 14px; }
  .active-row .numrow-right.pending-actions .numrow-status { transform: translate(-3px, 2px); }
}
@media (max-width: 600px) {
  .active-row.has-code { padding-top: 47px; }
  .active-row.has-code .numrow-time-code { right: -1px; min-width: 86px; min-height: 34px; padding: 7px 12px 9px 11px; border-radius: 0 15px 0 14px; font-size: 11.5px; }
}

/* Hesabım — daha dolu, renkli ve iki temaya uyumlu Telegram bağlantı kartı. */
#acc-tg-card { position: relative; overflow: hidden; padding: 0; border-color: color-mix(in srgb, #229ed9 20%, var(--border)); background: linear-gradient(145deg, color-mix(in srgb, #229ed9 5%, var(--surface)) 0%, var(--surface) 55%); }
#acc-tg-card::after { content: ""; position: absolute; width: 260px; height: 260px; right: -130px; top: -150px; border-radius: 50%; background: color-mix(in srgb, #229ed9 9%, transparent); pointer-events: none; }
.acc-tg-head { position: relative; z-index: 1; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 20px 22px; border-bottom: 1px solid var(--border); }
.acc-tg-head .mini-title { margin: 0 0 4px; }
.acc-tg-head .card-hint { margin: 0; line-height: 1.45; }
.acc-tg-brand { width: 52px; height: 52px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(145deg, #38bdf8, #168bd2); box-shadow: 0 12px 26px rgba(34,158,217,.25); font-size: 27px; }
.acc-tg-secure { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: 11.5px; font-weight: 750; white-space: nowrap; }
.acc-tg-columns { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 18px 22px; }
.acc-tg-section { min-width: 0; padding: 14px; border: 1px solid var(--border); border-radius: 15px; background: color-mix(in srgb, var(--surface-2) 75%, transparent); }
.acc-tg-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 11px; color: var(--text); }
.acc-tg-section-head > span { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 800; }
.acc-tg-section-head > span i { color: #229ed9; font-size: 17px; }
.acc-tg-section-head small { padding: 4px 8px; border-radius: 999px; background: var(--surface); color: var(--muted); border: 1px solid var(--border); font-size: 10px; white-space: nowrap; }
.acc-tg-row { min-height: 64px; flex-wrap: nowrap; padding: 11px; border-color: var(--border); background: var(--surface); box-shadow: 0 4px 13px rgba(15,23,42,.035); }
.acc-tg-row.group .acc-tg-ic { background: linear-gradient(150deg, #6366f1, #4f46e5); }
.acc-tg-row.dm .acc-tg-ic { background: linear-gradient(150deg, #38bdf8, #168bd2); }
.acc-tg-row .acc-tg-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.acc-tg-state { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px; padding: 5px 8px; border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: 10.5px; font-weight: 800; }
.acc-tg-empty { min-height: 72px; display: flex; align-items: center; gap: 11px; padding: 12px !important; border: 1px dashed var(--border-strong); border-radius: 12px; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.acc-tg-empty > i { width: 36px; height: 36px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: #229ed9; background: color-mix(in srgb, #229ed9 11%, var(--surface)); font-size: 18px; }
.acc-tg-empty > span { display: flex; flex-direction: column; gap: 3px; }
.acc-tg-empty b { color: var(--text); font-size: 12.5px; }
.acc-tg-empty small { color: var(--muted); font-size: 11.5px; line-height: 1.4; }
.acc-tg-empty code { padding: 1px 5px; border-radius: 5px; color: var(--accent); background: var(--accent-soft); font-family: var(--mono); }
.acc-tg-empty.error > i { color: var(--red); background: var(--red-soft); }
.acc-tg-foot { position: relative; z-index: 1; margin: 0; padding: 12px 22px 16px; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11.5px; }
.acc-tg-foot i { color: var(--accent); }

@media (max-width: 1100px) {
  .admin-order-grid { grid-template-columns: repeat(2, minmax(260px, 1fr)); }
  .sec-head { align-items: flex-start; }
  .sec-right { flex-wrap: wrap; justify-content: flex-end; }
}
@media (max-width: 720px) {
  .order-view-toggle button { min-width: 42px; width: 42px; padding: 0; }
  .order-view-toggle button span { display: none; }
  .user-order-table { min-width: 920px; }
  .user-order-row { grid-template-columns: 1.2fr 1.08fr .9fr .72fr .85fr .88fr 1.2fr; padding-left: 13px; padding-right: 13px; }
  .admin-order-grid { grid-template-columns: 1fr; }
  .acc-tg-head { grid-template-columns: 46px minmax(0, 1fr); padding: 17px 16px; }
  .acc-tg-brand { width: 46px; height: 46px; border-radius: 14px; font-size: 24px; }
  .acc-tg-secure { grid-column: 1 / -1; justify-self: start; }
  .acc-tg-columns { grid-template-columns: 1fr; padding: 14px 16px; }
  .acc-tg-foot { padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 480px) {
  .sec-head .sec-right { width: 100%; justify-content: flex-start; }
  .sec-head .sec-right .sec-meta { width: 100%; }
  .acc-tg-row { align-items: flex-start; }
  .acc-tg-state { font-size: 0; width: 25px; height: 25px; padding: 0; justify-content: center; }
  .acc-tg-state i { font-size: 13px; }
  .acc-tg-section { padding: 11px; }
}

/* ===== Auth Gate V3 — kısa, özel ağ hissi veren PC + mobil giriş ===== */
.login.login-gate {
  --gate-blue: #2f7dff;
  --gate-cyan: #24c8ff;
  --gate-line: rgba(132,177,255,.18);
  --gate-muted: #8c9ab8;
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
  overflow-x: hidden;
  overflow-y: auto;
  isolation: isolate;
  color: #f7f9ff;
  background: #050914;
}
.gate-backdrop { position: fixed; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; background: radial-gradient(circle at 24% 38%, rgba(28,91,213,.2), transparent 31%), radial-gradient(circle at 88% 12%, rgba(36,200,255,.08), transparent 25%), linear-gradient(145deg, #050914 0%, #080e1e 52%, #050812 100%); }
.gate-grid { position: absolute; inset: 0; opacity: .42; background-image: linear-gradient(rgba(91,139,226,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(91,139,226,.07) 1px, transparent 1px); background-size: 54px 54px; -webkit-mask-image: radial-gradient(ellipse at 38% 50%, #000 0%, transparent 70%); mask-image: radial-gradient(ellipse at 38% 50%, #000 0%, transparent 70%); }
.gate-beam { position: absolute; width: 1px; height: 150%; top: -25%; background: linear-gradient(180deg, transparent, rgba(47,125,255,.5), transparent); opacity: .32; transform: rotate(34deg); }
.gate-beam.beam-a { left: 22%; }
.gate-beam.beam-b { left: 76%; opacity: .16; transform: rotate(-28deg); }
.gate-shell {
  position: relative;
  z-index: 1;
  width: min(1180px, 100%);
  min-height: min(690px, calc(100vh - 36px));
  min-height: min(690px, calc(100dvh - 36px));
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  overflow: hidden;
  border: 1px solid rgba(123,163,235,.2);
  border-radius: 32px;
  background: #080d1a;
  box-shadow: 0 34px 90px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.025) inset;
}
.gate-stage {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: 30px 34px 27px;
  overflow: hidden;
  border-right: 1px solid rgba(123,163,235,.15);
  background: radial-gradient(circle at 48% 42%, rgba(29,93,216,.17), transparent 37%), linear-gradient(145deg, #081021 0%, #070c18 72%);
}
.gate-stage::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent 49.8%, rgba(83,138,239,.09) 50%, transparent 50.2%), linear-gradient(transparent 49.8%, rgba(83,138,239,.07) 50%, transparent 50.2%); }
.gate-brand { position: relative; z-index: 2; display: flex; align-items: center; gap: 12px; }
.gate-brand-logo { width: 64px; height: 36px; display: inline-flex; align-items: center; }
.gate-brand-copy { display: flex; flex-direction: column; gap: 1px; line-height: 1; }
.gate-brand-copy b { font-size: 16px; font-weight: 850; letter-spacing: .045em; }
.gate-brand-copy small { margin-top: 5px; color: #7082a7; font-family: var(--mono); font-size: 8.5px; font-weight: 750; letter-spacing: .18em; }
.gate-stage-center { position: relative; z-index: 1; min-height: 0; display: grid; grid-template-columns: minmax(250px, .9fr) minmax(220px, .8fr); align-items: center; gap: 8px; }
.gate-orbit { position: relative; width: min(360px, 100%); aspect-ratio: 1; justify-self: center; }
.gate-ring { position: absolute; border-radius: 50%; border: 1px solid rgba(83,139,255,.2); }
.gate-ring::before, .gate-ring::after { content: ""; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #63d8ff; box-shadow: 0 0 14px rgba(55,187,255,.9); }
.gate-ring.ring-one { inset: 7%; border-color: rgba(54,119,255,.52); border-right-color: rgba(71,210,255,.9); animation: gateRotate 11s linear infinite; }
.gate-ring.ring-one::before { left: 13%; top: 14%; }
.gate-ring.ring-one::after { right: 7%; bottom: 27%; width: 5px; height: 5px; }
.gate-ring.ring-two { inset: 18%; border-style: dashed; border-color: rgba(81,141,255,.28); animation: gateRotateReverse 17s linear infinite; }
.gate-ring.ring-two::before { right: 22%; top: -4px; width: 5px; height: 5px; }
.gate-ring.ring-two::after { display: none; }
.gate-ring.ring-three { inset: 30%; border-color: rgba(91,151,255,.2); box-shadow: 0 0 32px rgba(23,93,224,.08) inset; }
.gate-ring.ring-three::before, .gate-ring.ring-three::after { display: none; }
.gate-orbit::before, .gate-orbit::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.gate-orbit::before { inset: 1%; border: 1px solid rgba(70,126,232,.08); }
.gate-orbit::after { inset: 37%; background: rgba(35,99,225,.08); box-shadow: 0 0 68px rgba(32,112,255,.22); animation: gatePulse 3.4s ease-in-out infinite; }
.gate-orbit-scan { position: absolute; inset: 11%; border-radius: 50%; background: conic-gradient(from 0deg, transparent 0 76%, rgba(54,142,255,.42) 88%, transparent 94%); -webkit-mask-image: radial-gradient(circle, transparent 0 70%, #000 71% 73%, transparent 74%); mask-image: radial-gradient(circle, transparent 0 70%, #000 71% 73%, transparent 74%); animation: gateRotate 7s linear infinite; }
.gate-satellite { position: absolute; z-index: 3; width: 10px; height: 10px; border: 2px solid #9ce9ff; border-radius: 50%; background: #2787ff; box-shadow: 0 0 0 5px rgba(39,135,255,.1), 0 0 20px rgba(54,171,255,.82); }
.gate-satellite.sat-one { left: 13%; top: 29%; }
.gate-satellite.sat-two { right: 15%; bottom: 24%; width: 7px; height: 7px; border-width: 1px; }
.gate-orbit-core { position: absolute; z-index: 4; inset: 35%; display: flex; align-items: center; justify-content: center; padding: 11%; border: 1px solid rgba(105,163,255,.36); border-radius: 50%; background: radial-gradient(circle at 38% 32%, #132c59, #091224 68%); box-shadow: 0 18px 38px rgba(0,0,0,.35), 0 0 0 9px rgba(38,105,232,.045); }
.gate-stage-copy { align-self: center; max-width: 300px; padding-right: 10px; }
.gate-kicker { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 14px; color: #77d9ff; font-family: var(--mono); font-size: 10px; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; }
.gate-kicker i { font-size: 14px; }
.gate-stage-copy h1 { margin: 0; color: #f8fbff; font-size: clamp(34px, 3.35vw, 49px); font-weight: 760; line-height: 1.05; letter-spacing: -.035em; }
.gate-stage-copy h1 em { color: #6fcfff; font-style: normal; font-weight: inherit; }
.gate-stage-copy p { margin: 15px 0 0; color: #8392b0; font-size: 13px; letter-spacing: .015em; }
.gate-stage-foot { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #6f7f9e; font-family: var(--mono); font-size: 9px; letter-spacing: .1em; }
.gate-stage-foot span { display: inline-flex; align-items: center; gap: 8px; color: #91a1bf; font-family: var(--font); font-size: 11px; font-weight: 650; letter-spacing: 0; }
.gate-stage-foot span i { width: 7px; height: 7px; border-radius: 50%; background: #31d57c; box-shadow: 0 0 10px rgba(49,213,124,.7); }
.gate-panel { position: relative; min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 48px clamp(34px, 4.2vw, 58px) 34px; background: linear-gradient(180deg, #0c1222 0%, #090e1b 100%); }
.gate-panel::before { content: ""; position: absolute; top: 0; right: 0; width: 112px; height: 112px; border-top: 1px solid rgba(97,153,255,.18); border-right: 1px solid rgba(97,153,255,.18); background: linear-gradient(135deg, transparent 49%, rgba(50,118,244,.045) 50%); clip-path: polygon(100% 0, 100% 100%, 0 0); }
.gate-panel-cap { position: absolute; left: clamp(34px, 4.2vw, 58px); right: clamp(34px, 4.2vw, 58px); top: 29px; display: flex; align-items: center; justify-content: space-between; color: #6f82a6; font-family: var(--mono); font-size: 9px; letter-spacing: .12em; }
.gate-panel-cap span { display: inline-flex; align-items: center; gap: 7px; }
.gate-panel-cap i { color: #3faaff; font-size: 14px; }
.gate-panel-mark { display: none; width: 74px; height: 42px; margin-bottom: 22px; }
.gate-panel-kicker { color: #4f9fff; font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.gate-panel h2 { margin: 8px 0 0; color: #f8faff; font-size: 37px; font-weight: 760; letter-spacing: -.035em; }
.gate-panel-sub { margin: 5px 0 29px; color: var(--gate-muted); font-size: 13px; }
.gate-label { display: block; margin: 0 0 9px; color: #b4bfd4; font-size: 11px; font-weight: 750; letter-spacing: .04em; }
.gate-input { position: relative; height: 57px; display: flex; align-items: center; border: 1px solid rgba(112,146,207,.25); border-radius: 14px; background: #070c17; transition: border-color .16s ease, box-shadow .16s ease; }
.gate-input:focus-within { border-color: rgba(62,143,255,.82); box-shadow: 0 0 0 3px rgba(47,125,255,.11); }
.gate-input > i { position: absolute; left: 17px; color: #597095; font-size: 20px; }
.gate-input input { width: 100%; height: 100%; padding: 0 45px 0 49px; border: 0; outline: 0; color: #f2f6ff; background: transparent; font-family: var(--mono); font-size: 14px; letter-spacing: .035em; caret-color: #55b9ff; }
.gate-input input::placeholder { color: #465674; font-family: var(--font); letter-spacing: 0; }
.gate-input > span { position: absolute; right: 17px; width: 7px; height: 7px; border-radius: 50%; background: #2bd57b; box-shadow: 0 0 10px rgba(43,213,123,.55); }
.gate-submit { width: 100%; min-height: 55px; margin-top: 14px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid rgba(103,183,255,.24); border-radius: 14px; color: #fff; background: linear-gradient(110deg, #2369ec 0%, #318aff 68%, #35b6ef 100%); box-shadow: 0 15px 30px rgba(27,102,231,.22); font-family: var(--font); font-size: 14px; font-weight: 800; cursor: pointer; transition: transform .14s ease, filter .14s ease, box-shadow .14s ease; }
.gate-submit:hover:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); box-shadow: 0 18px 34px rgba(27,102,231,.29); }
.gate-submit:active:not(:disabled) { transform: translateY(1px); }
.gate-submit:disabled { cursor: wait; opacity: .76; }
.gate-submit i { font-size: 18px; }
.gate-error { margin: 11px 0 0; padding: 9px 11px; border: 1px solid rgba(255,91,113,.24); border-radius: 10px; color: #ff8d9e; background: rgba(198,36,61,.08); font-size: 12px; }
.gate-divider { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 11px; margin: 24px 0 13px; }
.gate-divider span { height: 1px; background: rgba(111,141,197,.16); }
.gate-divider small { color: #596986; font-family: var(--mono); font-size: 8px; font-weight: 750; letter-spacing: .14em; }
.gate-enroll { width: 100%; min-height: 51px; padding: 0 15px; display: grid; grid-template-columns: 22px 1fr 18px; align-items: center; gap: 10px; border: 1px solid rgba(95,132,195,.24); border-radius: 13px; color: #b8c5dc; background: rgba(20,29,49,.52); font-family: var(--font); font-size: 13px; font-weight: 720; cursor: pointer; transition: color .14s ease, border-color .14s ease, background .14s ease; }
.gate-enroll:hover { color: #e8f4ff; border-color: rgba(50,153,255,.5); background: rgba(32,78,148,.18); }
.gate-enroll > i:first-child { color: #43b4e8; font-size: 19px; }
.gate-enroll > i:last-child { justify-self: end; color: #607291; }
.gate-panel-foot { margin-top: auto; padding-top: 31px; display: flex; flex-direction: column; gap: 8px; color: #596985; }
.gate-panel-foot span { display: inline-flex; align-items: center; gap: 7px; font-size: 10.5px; }
.gate-panel-foot span i { color: #2fbf79; font-size: 14px; }
.gate-panel-foot small { font-family: var(--mono); font-size: 8.5px; letter-spacing: .1em; }
.login-gate.authenticating .gate-ring.ring-one { animation-duration: 2.2s; border-color: rgba(84,179,255,.88); }
.login-gate.authenticating .gate-ring.ring-two, .login-gate.authenticating .gate-orbit-scan { animation-duration: 1.4s; }
.login-gate.authenticating .gate-orbit-core { box-shadow: 0 0 0 9px rgba(38,105,232,.09), 0 0 54px rgba(42,142,255,.32); }
@keyframes gateRotate { to { transform: rotate(360deg); } }
@keyframes gateRotateReverse { to { transform: rotate(-360deg); } }
@keyframes gatePulse { 0%, 100% { opacity: .42; transform: scale(.92); } 50% { opacity: 1; transform: scale(1.06); } }

/* Detay ekranındaki kalıcı işlem numarası. */
.nd-operation-row { background: transparent; }
.nd-operation-ref { max-width: 100%; display: inline-flex; align-items: center; gap: 6px; overflow: hidden; }
.nd-operation-code { min-width: 0; display: inline-flex; align-items: center; padding: 0; color: var(--text); font-family: var(--mono); font-size: 11px; font-weight: 650; letter-spacing: .025em; white-space: nowrap; }
.nd-operation-copy { width: 27px; min-width: 27px; height: 27px; min-height: 27px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; padding: 0; border: 1px solid var(--border); border-radius: 8px; color: var(--muted); background: var(--surface-2); font-size: 13px; cursor: pointer; transition: color .14s ease, border-color .14s ease, background .14s ease; }
.nd-operation-copy:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); background: var(--accent-soft); }
.nd-operation-copy.copy-ok { color: var(--green) !important; background: var(--green-soft) !important; }

/* Yeni erişim: sahte kayıt formu yerine gerçek Telegram yetkilendirme kapısı. */
.modal-card:has(.access-enroll) { max-width: 820px; padding: 0; overflow: hidden; border: 1px solid rgba(102,151,235,.23); color: #f7f9ff; background: #080d1a; box-shadow: 0 34px 95px rgba(0,0,0,.48); }
.access-modal-head { margin: 0; padding: 18px 21px; border-bottom: 1px solid rgba(112,151,218,.16); background: #0b1120; }
.access-modal-head .modal-title { color: #f3f7ff; }
.access-modal-head .modal-title i { color: #42b3ff; }
.access-modal-head .modal-x { color: #91a0bc; background: rgba(255,255,255,.035); border-color: rgba(125,157,211,.18); }
.access-enroll { display: grid; grid-template-columns: minmax(0, .92fr) minmax(310px, 1.08fr); min-height: 390px; }
.access-enroll-stage { position: relative; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px; overflow: hidden; text-align: center; border-right: 1px solid rgba(105,148,219,.16); background: radial-gradient(circle at 50% 42%, rgba(40,117,255,.2), transparent 40%), #070c17; }
.access-enroll-stage::before { content: ""; position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(82,132,222,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(82,132,222,.09) 1px, transparent 1px); background-size: 30px 30px; -webkit-mask-image: radial-gradient(circle, #000, transparent 76%); mask-image: radial-gradient(circle, #000, transparent 76%); }
.access-enroll-kicker { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 7px; color: #6dafff; font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.access-enroll-kicker i { width: 6px; height: 6px; border-radius: 50%; background: #33d57b; box-shadow: 0 0 9px rgba(51,213,123,.7); }
.access-enroll-orbit { position: relative; z-index: 1; width: 150px; height: 150px; margin: 20px 0 18px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(62,131,255,.32); border-radius: 50%; }
.access-enroll-orbit::before { content: ""; position: absolute; inset: 17px; border: 1px dashed rgba(92,159,255,.36); border-radius: 50%; animation: gateRotateReverse 13s linear infinite; }
.access-enroll-orbit span:first-child { position: absolute; inset: -1px; border-top: 2px solid #42bfff; border-right: 2px solid transparent; border-radius: 50%; animation: gateRotate 6s linear infinite; }
.access-enroll-orbit span:nth-child(2) { position: absolute; width: 7px; height: 7px; right: 18px; top: 25px; border-radius: 50%; background: #7edfff; box-shadow: 0 0 14px #42bfff; }
.access-enroll-orbit > i { width: 70px; height: 70px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(85,153,255,.3); border-radius: 22px; color: #7ddfff; background: #0d1c36; font-size: 31px; box-shadow: 0 15px 30px rgba(0,0,0,.26); }
.access-enroll-stage h3 { position: relative; z-index: 1; margin: 0; color: #f5f8ff; font-size: 24px; font-weight: 760; letter-spacing: -.02em; }
.access-enroll-stage p { position: relative; z-index: 1; margin: 7px 0 0; color: #8493b0; font-size: 12px; }
.access-enroll-panel { display: flex; flex-direction: column; justify-content: center; padding: 34px; background: linear-gradient(180deg, #0c1222, #090e1a); }
.access-enroll-label { color: #5c9fff; font-family: var(--mono); font-size: 9px; font-weight: 800; letter-spacing: .17em; }
.access-contact { display: flex; align-items: center; gap: 13px; margin: 15px 0 19px; padding: 14px; border: 1px solid rgba(90,136,213,.2); border-radius: 14px; background: #080d18; }
.access-contact > i { width: 43px; height: 43px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 13px; color: #fff; background: #229ed9; font-size: 23px; }
.access-contact > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.access-contact b { color: #f6f9ff; font-family: var(--mono); font-size: 17px; }
.access-contact small { color: #71819f; font-size: 11px; }
.access-enroll-primary, .access-enroll-copy { width: 100%; min-height: 50px; padding: 0 15px; display: inline-flex; align-items: center; justify-content: space-between; gap: 10px; border-radius: 13px; font-family: var(--font); font-size: 13px; font-weight: 800; text-decoration: none; cursor: pointer; }
.access-enroll-primary { border: 1px solid rgba(98,189,255,.25); color: #fff; background: linear-gradient(110deg, #197bc5, #22a7e8); box-shadow: 0 14px 28px rgba(25,126,202,.2); }
.access-enroll-primary:hover { filter: brightness(1.07); }
.access-enroll-copy { margin-top: 10px; border: 1px solid rgba(100,139,205,.22); color: #aebbd2; background: rgba(20,29,48,.65); }
.access-enroll-copy:hover { color: #eef6ff; border-color: rgba(72,158,255,.46); background: rgba(33,77,143,.17); }
.access-enroll-note { display: flex; align-items: flex-start; gap: 7px; margin: 17px 0 0; color: #697a98; font-size: 10.5px; line-height: 1.45; }
.access-enroll-note i { margin-top: 1px; color: #35c77c; font-size: 14px; }

@media (max-width: 860px) {
  .login.login-gate { align-items: flex-start; padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  .gate-shell { width: min(520px, 100%); min-height: 0; margin: auto; grid-template-columns: 1fr; border-radius: 26px; }
  .gate-stage { min-height: 286px; grid-template-rows: auto 1fr; padding: 22px 24px; border-right: 0; border-bottom: 1px solid rgba(123,163,235,.15); }
  .gate-stage-center { grid-template-columns: 170px minmax(0, 1fr); gap: 14px; }
  .gate-orbit { width: 170px; }
  .gate-stage-copy { padding-right: 0; }
  .gate-stage-copy h1 { font-size: 29px; }
  .gate-stage-copy p { margin-top: 9px; font-size: 11.5px; }
  .gate-kicker { margin-bottom: 10px; font-size: 8.5px; }
  .gate-stage-foot { display: none; }
  .gate-panel { padding: 57px 34px 28px; }
  .gate-panel-cap { left: 34px; right: 34px; top: 23px; }
  .gate-panel-foot { padding-top: 25px; }
}
@media (max-width: 600px) {
  .gate-shell { border-radius: 23px; box-shadow: 0 24px 64px rgba(0,0,0,.38); }
  .gate-stage { min-height: 244px; padding: 18px 19px 16px; }
  .gate-brand-logo { width: 54px; height: 31px; }
  .gate-brand-copy b { font-size: 14px; }
  .gate-brand-copy small { font-size: 7.5px; }
  .gate-stage-center { grid-template-columns: 132px minmax(0, 1fr); gap: 10px; }
  .gate-orbit { width: 132px; }
  .gate-satellite { width: 7px; height: 7px; border-width: 1px; }
  .gate-orbit-core { padding: 9%; }
  .gate-stage-copy h1 { font-size: clamp(22px, 7.2vw, 28px); line-height: 1.08; }
  .gate-stage-copy p { display: none; }
  .gate-kicker { margin-bottom: 8px; font-size: 7.5px; letter-spacing: .12em; }
  .gate-panel { padding: 53px 20px 22px; }
  .gate-panel-cap { left: 20px; right: 20px; top: 20px; }
  .gate-panel h2 { font-size: 31px; }
  .gate-panel-sub { margin-bottom: 23px; }
  .gate-input { height: 54px; }
  .gate-submit { min-height: 53px; }
  .gate-divider { margin-top: 20px; }
  .gate-panel-foot { padding-top: 22px; }
  .nd-operation-row { align-items: stretch; flex-direction: column; gap: 8px; }
  .nd-operation-row .nd-v { width: 100%; text-align: left; }
  .nd-operation-ref { width: 100%; }
  .nd-operation-code { flex: 1 1 auto; overflow-x: auto; padding: 0; font-size: 11px; letter-spacing: .015em; scrollbar-width: none; }
  .nd-operation-code::-webkit-scrollbar { display: none; }
  .access-enroll { grid-template-columns: 1fr; min-height: 0; }
  .access-enroll-stage { min-height: 230px; padding: 22px 18px; border-right: 0; border-bottom: 1px solid rgba(105,148,219,.16); }
  .access-enroll-orbit { width: 112px; height: 112px; margin: 15px 0 12px; }
  .access-enroll-orbit > i { width: 54px; height: 54px; border-radius: 17px; font-size: 25px; }
  .access-enroll-stage h3 { font-size: 20px; }
  .access-enroll-panel { padding: 23px 18px 20px; }
  .access-modal-head { padding: 15px 17px; }
}
@media (max-width: 370px) {
  .gate-stage { min-height: 220px; padding: 16px; }
  .gate-stage-center { grid-template-columns: 106px minmax(0, 1fr); gap: 9px; }
  .gate-orbit { width: 106px; }
  .gate-stage-copy h1 { font-size: 21px; }
  .gate-panel { padding-left: 16px; padding-right: 16px; }
  .gate-panel-cap { left: 16px; right: 16px; }
}
@media (min-width: 861px) and (max-height: 700px) {
  .gate-shell { min-height: 590px; }
  .gate-stage { padding-top: 23px; padding-bottom: 22px; }
  .gate-orbit { width: min(305px, 31vw); }
  .gate-stage-copy h1 { font-size: 39px; }
  .gate-panel { padding-top: 42px; padding-bottom: 27px; }
  .gate-panel-sub { margin-bottom: 22px; }
  .gate-panel-foot { padding-top: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .gate-ring, .gate-orbit-scan, .gate-orbit::after, .access-enroll-orbit::before, .access-enroll-orbit span:first-child { animation: none !important; }
  .gate-submit, .gate-enroll, .access-enroll-primary, .access-enroll-copy { transition: none !important; }
}

/* ===== Auth Premium V4 — temiz, çağdaş ve ürün odaklı giriş ===== */
.login.login-premium {
  --auth-accent: #5548e7;
  --auth-accent-2: #7769f4;
  --auth-ink: #182033;
  --auth-muted: #73809a;
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  isolation: isolate;
  color: var(--auth-ink);
  background: #edf1f7;
}
.auth-ambient { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.auth-ambient span { position: absolute; border-radius: 50%; filter: blur(2px); opacity: .55; }
.auth-ambient-one { width: 430px; height: 430px; left: -150px; top: -170px; background: radial-gradient(circle, rgba(105,91,241,.2), transparent 70%); }
.auth-ambient-two { width: 520px; height: 520px; right: -180px; bottom: -240px; background: radial-gradient(circle, rgba(48,181,235,.16), transparent 69%); }
.auth-shell {
  position: relative;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(370px, .88fr);
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
.auth-visual {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: max(30px, env(safe-area-inset-top)) max(34px, env(safe-area-inset-right)) 27px max(34px, env(safe-area-inset-left));
  overflow: hidden;
  border-right: 1px solid rgba(87,104,145,.1);
  background:
    radial-gradient(circle at 32% 43%, rgba(107,94,238,.15), transparent 34%),
    radial-gradient(circle at 83% 14%, rgba(55,190,230,.14), transparent 29%),
    linear-gradient(145deg, #f8f9ff 0%, #eff4ff 58%, #eef9fc 100%);
}
.auth-visual::before, .auth-visual::after { content: ""; position: absolute; pointer-events: none; border-radius: 50%; }
.auth-visual::before { width: 260px; height: 260px; right: -115px; top: -118px; border: 52px solid rgba(255,255,255,.48); }
.auth-visual::after { width: 180px; height: 180px; left: -105px; bottom: -92px; border: 35px solid rgba(111,96,235,.055); }
.auth-brand { position: relative; z-index: 3; display: flex; align-items: center; gap: 12px; }
.auth-brand-logo { width: 65px; height: 37px; display: inline-flex; align-items: center; }
.auth-brand b { color: #1d2537; font-size: 17px; font-weight: 850; letter-spacing: .035em; }
.auth-hero { position: relative; z-index: 2; width: 100%; max-width: 850px; flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(260px, 1fr) minmax(220px, .82fr); align-items: center; gap: 18px; margin: auto; }
.auth-showcase { position: relative; width: min(335px, 100%); aspect-ratio: 1; justify-self: center; }
.auth-halo { position: absolute; border-radius: 50%; }
.auth-halo-one { inset: 4%; border: 1px solid rgba(91,76,229,.22); background: conic-gradient(from 40deg, transparent 0 38%, rgba(102,87,237,.16) 48%, transparent 59% 100%); box-shadow: 0 0 0 16px rgba(255,255,255,.3) inset; animation: authRotate 18s linear infinite; }
.auth-halo-two { inset: 18%; border: 1px solid rgba(75,181,225,.2); background: rgba(255,255,255,.28); box-shadow: 0 22px 55px rgba(87,80,192,.09); animation: authBreathe 4.8s ease-in-out infinite; }
.auth-logo-stage { position: absolute; z-index: 4; inset: 31%; display: flex; align-items: center; justify-content: center; padding: 10%; border: 1px solid rgba(91,76,229,.13); border-radius: 50%; background: linear-gradient(145deg, #fff, #f5f7ff); box-shadow: 0 17px 38px rgba(69,63,151,.15), 0 0 0 9px rgba(255,255,255,.5); animation: authFloat 5s ease-in-out infinite; }
.auth-service-bubble { position: absolute; z-index: 5; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 16px; color: #fff; box-shadow: 0 13px 28px rgba(38,52,91,.16); }
.auth-service-bubble i { font-size: 24px; }
.auth-wa { width: 51px; height: 51px; left: 3%; top: 24%; background: #25d366; animation: authFloat 4.6s ease-in-out .2s infinite; }
.auth-tg { width: 46px; height: 46px; right: 5%; top: 17%; background: #229ed9; animation: authFloat 5.3s ease-in-out .8s infinite; }
.auth-gm { width: 43px; height: 43px; left: 14%; bottom: 9%; background: #ea4335; animation: authFloat 4.9s ease-in-out 1.1s infinite; }
.auth-code-card { position: absolute; z-index: 6; right: -2%; bottom: 8%; min-width: 140px; display: flex; flex-direction: column; padding: 13px 15px; border: 1px solid rgba(92,106,146,.12); border-radius: 16px; background: rgba(255,255,255,.96); box-shadow: 0 17px 36px rgba(39,51,87,.13); font-style: normal; animation: authFloat 5.5s ease-in-out .5s infinite; }
.auth-code-card small { display: flex; align-items: center; gap: 6px; color: #66738b; font-size: 9px; font-weight: 750; }
.auth-code-card small i { width: 6px; height: 6px; border-radius: 50%; background: #19ba68; box-shadow: 0 0 0 4px rgba(25,186,104,.1); }
.auth-code-card b { margin-top: 5px; color: #4b40dd; font-family: var(--mono); font-size: 21px; font-weight: 850; letter-spacing: .12em; }
.auth-code-card em { margin-top: 2px; color: #9aa4b7; font-size: 8px; font-style: normal; }
.auth-hero-copy { align-self: center; max-width: 285px; }
.auth-hero-copy > span { color: #6658e5; font-size: 9px; font-weight: 850; letter-spacing: .16em; }
.auth-hero-copy h1 { margin: 12px 0 0; color: #1c2437; font-size: clamp(34px, 3.2vw, 47px); font-weight: 770; line-height: 1.07; letter-spacing: -.04em; }
.auth-hero-copy p { max-width: 255px; margin: 16px 0 0; color: #748099; font-size: 13px; line-height: 1.65; }
.auth-visual-foot { position: relative; z-index: 3; width: 100%; max-width: 850px; display: flex; align-items: center; gap: 22px; margin: 0 auto; }
.auth-visual-foot span { display: inline-flex; align-items: center; gap: 7px; padding: 0; border: 0; color: #69758d; background: transparent; font-size: 9.5px; font-weight: 680; }
.auth-visual-foot i { font-size: 15px; }
.auth-visual-foot span:nth-child(1) i { color: #20bb62; }
.auth-visual-foot span:nth-child(2) i { color: #229ed9; }
.auth-visual-foot span:nth-child(3) i { color: #ea4335; }
.auth-panel { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 48px max(clamp(34px, 4.5vw, 62px), env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(clamp(34px, 4.5vw, 62px), env(safe-area-inset-left)); background: #fff; }
.auth-panel-inner { width: 100%; max-width: 380px; margin: auto; }
.auth-mobile-brand { display: none; align-items: center; gap: 10px; margin-bottom: 30px; }
.auth-mobile-brand img { width: 58px; height: 34px; }
.auth-mobile-brand b { color: #20283a; font-size: 17px; font-weight: 850; }
.auth-eyebrow { color: var(--auth-accent); font-size: 9.5px; font-weight: 850; letter-spacing: .16em; }
.auth-panel h2 { margin: 9px 0 0; color: #182033; font-size: 36px; font-weight: 770; letter-spacing: -.035em; }
.auth-panel-sub { margin: 7px 0 29px; color: var(--auth-muted); font-size: 13px; }
.auth-label { display: block; margin: 0 0 9px; color: #3f4a61; font-size: 11px; font-weight: 750; }
.auth-input { position: relative; height: 57px; display: flex; align-items: center; border: 1px solid #dce2ed; border-radius: 14px; background: #f8f9fc; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
.auth-input:focus-within { border-color: rgba(85,72,231,.62); background: #fff; box-shadow: 0 0 0 4px rgba(85,72,231,.085); }
.auth-input > i { position: absolute; left: 17px; color: #8a95aa; font-size: 19px; }
.auth-input input { width: 100%; height: 100%; padding: 0 17px 0 49px; border: 0; outline: 0; color: #20283b; background: transparent; font-family: var(--mono); font-size: 14px; letter-spacing: .025em; caret-color: var(--auth-accent); }
.auth-input input::placeholder { color: #9ca6b8; font-family: var(--font); letter-spacing: 0; }
.auth-submit { width: 100%; min-height: 55px; margin-top: 14px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: space-between; gap: 12px; border: 0; border-radius: 14px; color: #fff; background: linear-gradient(115deg, #4d40dc, #7061ee); box-shadow: 0 14px 27px rgba(82,67,220,.23); font-family: var(--font); font-size: 14px; font-weight: 800; cursor: pointer; transition: transform .14s ease, filter .14s ease, box-shadow .14s ease; }
.auth-submit:hover:not(:disabled) { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 17px 31px rgba(82,67,220,.29); }
.auth-submit:active:not(:disabled) { transform: translateY(1px); }
.auth-submit:disabled { cursor: wait; opacity: .72; }
.auth-submit i { font-size: 18px; }
.auth-error { margin: 11px 0 0; padding: 9px 11px; border: 1px solid rgba(225,66,89,.18); border-radius: 10px; color: #d92f4f; background: #fff5f6; font-size: 12px; }
.auth-divider { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 11px; margin: 25px 0 13px; }
.auth-divider span { height: 1px; background: #e7eaf1; }
.auth-divider small { color: #9aa3b4; font-size: 10px; }
.auth-request { width: 100%; min-height: 51px; padding: 0 15px; display: grid; grid-template-columns: 22px 1fr 18px; align-items: center; gap: 10px; border: 1px solid #dfe4ee; border-radius: 13px; color: #4c5870; background: #fff; font-family: var(--font); font-size: 13px; font-weight: 750; cursor: pointer; transition: color .14s ease, border-color .14s ease, background .14s ease; }
.auth-request:hover { color: var(--auth-accent); border-color: rgba(85,72,231,.34); background: #f8f7ff; }
.auth-request > i:first-child { color: #6254e4; font-size: 18px; }
.auth-request > i:last-child { justify-self: end; color: #a0a9ba; }
.auth-panel-foot { width: 100%; max-width: 380px; margin: 30px auto 0; color: #a5adbc; font-size: 9px; }
.login-premium.authenticating .auth-halo-one { animation-duration: 3s; }
.login-premium.authenticating .auth-logo-stage { transform: scale(1.04); box-shadow: 0 20px 46px rgba(82,67,220,.23), 0 0 0 10px rgba(255,255,255,.62); }
.auth-success-layer { position: fixed; inset: 0; z-index: 30; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; visibility: hidden; opacity: 0; pointer-events: none; background: radial-gradient(circle at 50% 45%, #fff 0%, #f2f4ff 48%, #e9f3fb 100%); }
.auth-success-logo { position: relative; z-index: 3; width: 142px; height: 142px; display: flex; align-items: center; justify-content: center; padding: 34px; border-radius: 50%; background: #fff; box-shadow: 0 24px 60px rgba(74,65,181,.2), 0 0 0 12px rgba(255,255,255,.55); opacity: 0; transform: scale(.66); }
.auth-success-ring { position: absolute; z-index: 1; width: 160px; height: 160px; border: 1px solid rgba(100,84,229,.3); border-radius: 50%; opacity: 0; }
.auth-success-ring-two { border-color: rgba(45,174,222,.24); }
.auth-success-copy { position: relative; z-index: 3; display: inline-flex; align-items: center; gap: 7px; margin-top: 26px; color: #313a50; font-size: 13px; font-weight: 800; opacity: 0; transform: translateY(9px); }
.auth-success-copy i { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; background: #22bb6a; font-size: 14px; }
.login-premium.auth-success .auth-shell { animation: authShellLeave 1.05s cubic-bezier(.22,.72,.2,1) both; pointer-events: none; }
.login-premium.auth-success .auth-success-layer { visibility: visible; animation: authSuccessLayer 1.05s ease both; }
.login-premium.auth-success .auth-success-logo { animation: authSuccessLogo .88s cubic-bezier(.2,.82,.22,1) .07s both; }
.login-premium.auth-success .auth-success-ring-one { animation: authSuccessRing .82s ease-out .08s both; }
.login-premium.auth-success .auth-success-ring-two { animation: authSuccessRing .82s ease-out .2s both; }
.login-premium.auth-success .auth-success-copy { animation: authSuccessCopy .55s ease-out .3s both; }
@keyframes authRotate { to { transform: rotate(360deg); } }
@keyframes authBreathe { 0%, 100% { transform: scale(.96); opacity: .66; } 50% { transform: scale(1.04); opacity: 1; } }
@keyframes authFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes authShellLeave { 0% { opacity: 1; transform: scale(1); filter: blur(0); } 38% { opacity: .46; transform: scale(.985); filter: blur(2px); } 100% { opacity: 0; transform: scale(.965); filter: blur(7px); } }
@keyframes authSuccessLayer { 0% { opacity: 0; } 16%, 100% { opacity: 1; } }
@keyframes authSuccessLogo { 0% { opacity: 0; transform: scale(.66) rotate(-7deg); } 62% { opacity: 1; transform: scale(1.06) rotate(1deg); } 100% { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes authSuccessRing { 0% { opacity: .7; transform: scale(.72); } 100% { opacity: 0; transform: scale(3.5); } }
@keyframes authSuccessCopy { to { opacity: 1; transform: translateY(0); } }

/* Yeni hesap talebi — giriş ekranıyla aynı temiz görsel dil. */
.modal-card:has(.access-request) { max-width: 760px; padding: 0; overflow: hidden; border: 1px solid rgba(87,103,143,.14); border-radius: 24px; background: #fff; box-shadow: 0 28px 80px rgba(32,43,73,.22); }
.access-request-head { margin: 0; padding: 18px 21px; border-bottom: 1px solid #e9ecf2; background: #fff; }
.access-request-head .modal-title { color: #1c2437; font-size: 17px; }
.access-request { display: grid; grid-template-columns: minmax(0, .94fr) minmax(300px, 1.06fr); min-height: 355px; }
.access-request-intro { position: relative; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 37px; overflow: hidden; border-right: 1px solid rgba(89,104,145,.1); background: radial-gradient(circle at 20% 15%, rgba(111,96,235,.17), transparent 34%), linear-gradient(145deg, #f8f8ff, #eef4ff 65%, #eff9fb); }
.access-request-intro::after { content: ""; position: absolute; width: 190px; height: 190px; right: -95px; bottom: -105px; border: 38px solid rgba(255,255,255,.55); border-radius: 50%; }
.access-request-icon { position: relative; z-index: 1; width: 64px; height: 64px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 26px; border-radius: 19px; color: #fff; background: linear-gradient(145deg, #229ed9, #3bb7eb); box-shadow: 0 16px 30px rgba(34,158,217,.25); font-size: 32px; }
.access-request-kicker { position: relative; z-index: 1; color: #6456e3; font-size: 9px; font-weight: 850; letter-spacing: .16em; }
.access-request-intro h3 { position: relative; z-index: 1; margin: 10px 0 0; color: #1d2538; font-size: 25px; font-weight: 770; line-height: 1.15; letter-spacing: -.025em; }
.access-request-intro p { position: relative; z-index: 1; margin: 11px 0 0; color: #718098; font-size: 12px; line-height: 1.65; }
.access-request-actions { display: flex; flex-direction: column; justify-content: center; padding: 35px; background: #fff; }
.access-request-contact { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; gap: 11px; margin-bottom: 20px; padding: 12px; border: 1px solid #e2e6ef; border-radius: 15px; background: #f8f9fc; }
.access-request-inline-copy { width: 28px; height: 28px; flex: 0 0 28px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #dce2ec; border-radius: 8px; color: #59667d; background: #fff; font-size: 14px; cursor: pointer; transition: color .14s ease, border-color .14s ease, background .14s ease, transform .14s ease, box-shadow .14s ease; }
.access-request-inline-copy:hover { color: #5144dc; border-color: rgba(85,72,231,.35); background: #f8f7ff; }
.access-request-inline-copy:active { transform: scale(.94); }
.access-request-inline-copy.copy-ok { color: #16a34a !important; border-color: rgba(22,163,74,.42) !important; background: #fff !important; box-shadow: 0 0 0 3px rgba(22,163,74,.09); animation: none !important; transform: none !important; }
.access-request-avatar { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 14px; color: #229ed9; background: #e9f7fd; font-size: 23px; }
.access-request-user { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.access-request-handle-row { display: flex; align-items: center; gap: 7px; min-width: 0; }
.access-request-contact small { color: #8b96aa; font-size: 10px; }
.access-request-contact b { color: #263047; font-family: var(--mono); font-size: 16px; }
.access-request-primary, .access-request-copy { width: 100%; min-height: 50px; padding: 0 15px; display: inline-flex; align-items: center; justify-content: space-between; gap: 10px; border-radius: 13px; font-family: var(--font); font-size: 13px; font-weight: 800; text-decoration: none; cursor: pointer; }
.access-request-primary { border: 0; color: #fff; background: linear-gradient(115deg, #168fc8, #29afe7); box-shadow: 0 13px 25px rgba(34,158,217,.2); }
.access-request-primary:hover { filter: brightness(1.05); }
.access-request-copy { margin-top: 10px; border: 1px solid #dfe4ed; color: #59657b; background: #fff; }
.access-request-copy:hover { color: #4f43dd; border-color: rgba(85,72,231,.32); background: #faf9ff; }

:root[data-theme="dark"] .login.login-premium { --auth-ink: #f4f6fc; --auth-muted: #97a3b9; background: #0d1320; }
:root[data-theme="dark"] .auth-shell { border-color: rgba(159,174,210,.13); background: #151c2c; box-shadow: 0 34px 90px rgba(0,0,0,.42); }
:root[data-theme="dark"] .auth-visual { border-right-color: rgba(158,175,215,.1); background: radial-gradient(circle at 32% 43%, rgba(109,91,238,.19), transparent 35%), radial-gradient(circle at 83% 14%, rgba(43,177,219,.13), transparent 30%), linear-gradient(145deg, #171e31, #141b2b 62%, #132129); }
:root[data-theme="dark"] .auth-brand b, :root[data-theme="dark"] .auth-hero-copy h1, :root[data-theme="dark"] .auth-panel h2, :root[data-theme="dark"] .auth-mobile-brand b { color: #f5f7fc; }
:root[data-theme="dark"] .auth-halo-one { border-color: rgba(133,118,255,.27); box-shadow: 0 0 0 16px rgba(255,255,255,.015) inset; }
:root[data-theme="dark"] .auth-halo-two { border-color: rgba(69,181,222,.22); background: rgba(255,255,255,.018); }
:root[data-theme="dark"] .auth-logo-stage, :root[data-theme="dark"] .auth-code-card { border-color: rgba(157,173,210,.12); background: #1c2437; box-shadow: 0 17px 38px rgba(0,0,0,.23); }
:root[data-theme="dark"] .auth-code-card b { color: #9a8fff; }
:root[data-theme="dark"] .auth-visual-foot span { border-color: transparent; color: #9ca8bd; background: transparent; }
:root[data-theme="dark"] .auth-panel { background: #151c2c; }
:root[data-theme="dark"] .auth-label { color: #c2cad8; }
:root[data-theme="dark"] .auth-input { border-color: #30394d; background: #101725; }
:root[data-theme="dark"] .auth-input:focus-within { border-color: rgba(133,118,255,.7); background: #121a2a; }
:root[data-theme="dark"] .auth-input input { color: #f1f4fa; }
:root[data-theme="dark"] .auth-divider span { background: #2c3446; }
:root[data-theme="dark"] .auth-request { border-color: #30394d; color: #bac3d2; background: #171f30; }
:root[data-theme="dark"] .auth-request:hover { border-color: rgba(133,118,255,.45); color: #bdb5ff; background: #1b2236; }
:root[data-theme="dark"] .auth-error { border-color: rgba(255,104,126,.2); color: #ff9aaa; background: rgba(198,36,61,.09); }
:root[data-theme="dark"] .auth-success-layer { background: radial-gradient(circle at 50% 45%, #222a40 0%, #151c2c 48%, #101925 100%); }
:root[data-theme="dark"] .auth-success-logo { background: #1d2538; box-shadow: 0 24px 60px rgba(0,0,0,.35), 0 0 0 12px rgba(255,255,255,.025); }
:root[data-theme="dark"] .auth-success-copy { color: #e9edf6; }
:root[data-theme="dark"] .modal-card:has(.access-request), :root[data-theme="dark"] .access-request-head, :root[data-theme="dark"] .access-request-actions { border-color: #30394d; background: #171e2e; }
:root[data-theme="dark"] .access-request-head .modal-title, :root[data-theme="dark"] .access-request-intro h3, :root[data-theme="dark"] .access-request-contact b { color: #f4f6fc; }
:root[data-theme="dark"] .access-request-intro { border-color: rgba(155,172,209,.1); background: radial-gradient(circle at 20% 15%, rgba(110,92,235,.2), transparent 35%), linear-gradient(145deg, #192033, #151d2e 65%, #14232b); }
:root[data-theme="dark"] .access-request-contact { border-color: #30394d; background: #111827; }
:root[data-theme="dark"] .access-request-inline-copy { border-color: #354057; color: #b7c1d2; background: #192236; }
:root[data-theme="dark"] .access-request-inline-copy.copy-ok { color: #4ade80 !important; border-color: rgba(74,222,128,.42) !important; background: #192236 !important; box-shadow: 0 0 0 3px rgba(74,222,128,.08); }
:root[data-theme="dark"] .access-request-copy { border-color: #30394d; color: #b6c0d1; background: #171f30; }

@media (min-width: 861px) and (max-width: 1020px) {
  .auth-visual { padding-left: 24px; padding-right: 24px; }
  .auth-hero { grid-template-columns: 165px minmax(0, 1fr); gap: 14px; }
  .auth-showcase { width: 165px; }
  .auth-code-card { right: 4%; bottom: -4%; min-width: 98px; padding: 8px 9px; border-radius: 12px; }
  .auth-code-card small { font-size: 7px; }
  .auth-code-card b { margin-top: 3px; font-size: 14px; }
  .auth-code-card em { display: none; }
  .auth-hero-copy h1 { font-size: 30px; }
  .auth-hero-copy p { margin-top: 10px; font-size: 11px; }
  .auth-visual-foot { gap: 6px; }
  .auth-visual-foot span { padding: 6px 8px; font-size: 8.5px; }
  .auth-panel { padding-left: 34px; padding-right: 34px; }
}
@media (max-width: 860px) {
  .login.login-premium { align-items: flex-start; padding: 0; }
  .auth-shell { width: 100%; min-height: 100vh; min-height: 100dvh; margin: 0; grid-template-columns: 1fr; border-radius: 0; }
  .auth-visual { min-height: 292px; padding: max(21px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) 18px max(24px, env(safe-area-inset-left)); border-right: 0; border-bottom: 1px solid rgba(87,104,145,.1); }
  .auth-hero { grid-template-columns: 180px minmax(0, 1fr); gap: 18px; }
  .auth-showcase { width: 180px; }
  .auth-code-card { right: -10%; min-width: 108px; padding: 9px 10px; }
  .auth-code-card b { font-size: 16px; }
  .auth-hero-copy h1 { font-size: 30px; }
  .auth-hero-copy p { margin-top: 9px; font-size: 11.5px; }
  .auth-visual-foot { display: none; }
  .auth-panel { padding: 36px max(34px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(34px, env(safe-area-inset-left)); }
  .auth-panel-foot { margin-top: 25px; }
}
@media (max-width: 600px) {
  .login.login-premium { justify-content: center; background: #edf1f7; }
  .auth-shell { border-radius: 0; box-shadow: none; }
  .auth-visual { min-height: 225px; padding: max(17px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) 15px max(18px, env(safe-area-inset-left)); }
  .auth-brand-logo { width: 54px; height: 31px; }
  .auth-brand b { font-size: 14px; }
  .auth-hero { grid-template-columns: 118px minmax(0, 1fr); gap: 11px; }
  .auth-showcase { width: 116px; }
  .auth-service-bubble { border-radius: 11px; }
  .auth-service-bubble i { font-size: 17px; }
  .auth-wa { width: 34px; height: 34px; }
  .auth-tg { width: 31px; height: 31px; }
  .auth-gm { width: 29px; height: 29px; }
  .auth-code-card { display: none; }
  .auth-hero-copy > span { font-size: 7px; letter-spacing: .11em; }
  .auth-hero-copy h1 { margin-top: 7px; font-size: clamp(23px, 7vw, 28px); }
  .auth-hero-copy p { display: none; }
  .auth-panel { padding: 29px max(20px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)); }
  .auth-panel h2 { font-size: 31px; }
  .auth-panel-sub { margin-bottom: 23px; }
  .auth-input { height: 54px; }
  .auth-submit { min-height: 53px; }
  .auth-divider { margin-top: 21px; }
  .auth-panel-foot { margin-top: 20px; }
  .access-request { grid-template-columns: 1fr; min-height: 0; }
  .access-request-intro { min-height: 230px; padding: 25px 22px; border-right: 0; border-bottom: 1px solid rgba(89,104,145,.1); }
  .access-request-icon { width: 54px; height: 54px; margin-bottom: 18px; border-radius: 17px; font-size: 27px; }
  .access-request-intro h3 { font-size: 21px; }
  .access-request-actions { padding: 23px 19px 21px; }
  .access-request-head { padding: 15px 17px; }
}
@media (max-width: 370px) {
  .auth-visual { min-height: 205px; padding: max(15px, env(safe-area-inset-top)) max(15px, env(safe-area-inset-right)) 15px max(15px, env(safe-area-inset-left)); }
  .auth-hero { grid-template-columns: 100px minmax(0, 1fr); gap: 8px; }
  .auth-showcase { width: 98px; }
  .auth-hero-copy > span { display: none; }
  .auth-hero-copy h1 { font-size: 22px; }
  .auth-panel { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
}
@media (min-width: 640px) and (max-width: 860px) and (max-height: 500px) and (orientation: landscape) {
  .auth-shell { grid-template-columns: minmax(280px, .92fr) minmax(330px, 1.08fr); }
  .auth-visual { min-height: 100vh; min-height: 100dvh; padding: max(15px, env(safe-area-inset-top)) 18px max(14px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left)); border-right: 1px solid rgba(87,104,145,.1); border-bottom: 0; }
  .auth-brand-logo { width: 52px; height: 30px; }
  .auth-brand b { font-size: 14px; }
  .auth-hero { grid-template-columns: 118px minmax(0, 1fr); gap: 10px; }
  .auth-showcase { width: 116px; }
  .auth-service-bubble { border-radius: 11px; }
  .auth-service-bubble i { font-size: 16px; }
  .auth-wa { width: 32px; height: 32px; }
  .auth-tg { width: 29px; height: 29px; }
  .auth-gm { width: 28px; height: 28px; }
  .auth-code-card, .auth-hero-copy p { display: none; }
  .auth-hero-copy > span { font-size: 6.5px; }
  .auth-hero-copy h1 { margin-top: 6px; font-size: 25px; }
  .auth-panel { min-height: 100vh; min-height: 100dvh; padding: max(18px, env(safe-area-inset-top)) max(22px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) 22px; }
  .auth-panel h2 { font-size: 28px; }
  .auth-panel-sub { margin-bottom: 17px; }
  .auth-input { height: 49px; }
  .auth-submit { min-height: 48px; }
  .auth-divider { margin: 15px 0 10px; }
  .auth-request { min-height: 45px; }
  .auth-panel-foot { margin-top: 14px; }
}
@media (max-width: 639px) and (max-height: 500px) and (orientation: landscape) {
  .auth-visual { display: none; }
  .auth-panel { min-height: 100vh; min-height: 100dvh; padding-top: max(18px, env(safe-area-inset-top)); }
  .auth-mobile-brand { display: flex; margin-bottom: 14px; }
  .auth-panel-inner { max-width: 440px; }
  .auth-panel h2 { font-size: 28px; }
  .auth-panel-sub { margin-bottom: 15px; }
  .auth-input { height: 48px; }
  .auth-submit { min-height: 47px; }
  .auth-divider { margin: 14px 0 9px; }
  .auth-request { min-height: 44px; }
  .auth-panel-foot { margin-top: 12px; }
}
@media (min-width: 861px) and (max-height: 710px) {
  .auth-shell { min-height: 590px; }
  .auth-showcase { width: min(290px, 100%); }
  .auth-hero-copy h1 { font-size: 39px; }
  .auth-panel { padding-top: 38px; padding-bottom: 24px; }
  .auth-panel-sub { margin-bottom: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  .auth-halo, .auth-logo-stage, .auth-service-bubble, .auth-code-card { animation: none !important; }
  .login-premium.auth-success .auth-shell, .login-premium.auth-success .auth-success-layer, .login-premium.auth-success .auth-success-logo, .login-premium.auth-success .auth-success-ring, .login-premium.auth-success .auth-success-copy { animation: none !important; }
  .auth-submit, .auth-request, .access-request-primary, .access-request-copy, .access-request-inline-copy { transition: none !important; }
}