/* ============================================================
   portal-theme.css — Faz A görsel kimlik katmanı
   style.css + portal-extra.css'ten SONRA yüklenir; prototip
   düzenine dokunmadan fontu, ikonları, renk sistemini ve temel
   bileşen stillerini tek tipleştirir.
   ============================================================ */

/* ---- Marka fontu: Inter (değişken ağırlık, latin + latin-ext) ---- */
@font-face {
  font-family: 'InterVariable';
  src: url('fonts/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ---- Tasarım token'ları ---- */
:root {
  /* marka */
  --brand-900: #0b1f38;
  --brand-800: #102b49;   /* kenar çubuğu */
  --brand-700: #16395f;
  --accent: #1e6fb8;      /* mevcut --blue ile aynı aile */
  --accent-strong: #175a97;
  --accent-soft: #e8f1f9;
  --accent-ring: rgba(30, 111, 184, .18);

  /* nötrler */
  --n-0: #ffffff;
  --n-50: #f7f9fb;
  --n-100: #eef2f6;
  --n-200: #e2e8ef;
  --n-400: #9aa7b6;
  --n-500: #6f7d90;
  --n-700: #3c4b5e;
  --n-900: #16202e;

  /* durum renkleri */
  --ok-text: #166b45;   --ok-bg: #e7f6ef;
  --warn-text: #8f6410; --warn-bg: #fcf3df;
  --err-text: #ad3d36;  --err-bg: #fdeeec;

  /* biçim */
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-sm: 0 1px 2px rgba(16, 32, 54, .05), 0 1px 4px rgba(16, 32, 54, .04);
  --shadow-md: 0 6px 20px -4px rgba(16, 32, 54, .12);
  --font-sans: 'InterVariable', 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* eski değişkenleri yeni sisteme bağla */
  --border: var(--n-200);
  --muted: var(--n-500);
  --text: var(--n-900);
  --bg: var(--n-50);
  --inbox-mask: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%3Cpolyline%20points%3D%2222%2012%2016%2012%2014%2015%2010%2015%208%2012%202%2012%22%20%2F%3E%3Cpath%20d%3D%22M5.45%205.11%202%2012v6a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-6l-3.45-6.89A2%202%200%200%200%2016.76%204H7.24a2%202%200%200%200-1.79%201.11z%22%20%2F%3E%3C%2Fsvg%3E");
}

/* ---- Taban tipografi ---- */
body {
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-size: 15px;
  line-height: 1.55;
  color: var(--text);
}

button, input, select, textarea { font-family: var(--font-sans); }

h1, h2, h3, h4 { letter-spacing: -0.015em; }
.main h1, .main h2, .main h3, .main h4, .modal-panel h2, .card h2 { color: var(--n-900); }

/* Koyu zeminli alanlarda başlıklar beyaz kalır */
.sidebar h2, .auth-visual h1, .auth-visual h2, .feed-welcome-card h2, .linkedin-cover h2 { color: #fff; }

/* Dev sayfa başlıklarını ürün ölçeğine indir */
.topbar h1 { font-size: 24px; font-weight: 700; }
.topbar p { font-size: 14px; margin-top: 3px; }
.section-title h2 { font-size: 18px; font-weight: 650; }
.linkedin-card-title h3 { letter-spacing: -0.01em; }

/* ---- Kenar çubuğu ---- */
.sidebar { background: linear-gradient(180deg, var(--brand-800), var(--brand-900)); }
.sidebar h2 {
  font-size: 19px;
  font-weight: 750;
  letter-spacing: -0.02em;
  margin-bottom: 26px;
}
.menu button {
  font-size: 14px;
  font-weight: 500;
  color: #b7c5d6;
  padding: 10px 12px;
  margin-bottom: 2px;
  border-radius: var(--radius-md);
  transition: background .15s ease, color .15s ease;
}
.menu button:hover { transform: none; background: rgba(255, 255, 255, .08); }
.menu button.active { background: rgba(255, 255, 255, .13); color: #fff; font-weight: 600; }

/* Menü ikonları: kutu arka planı kalksın, SVG tek tip dursun */
.menu-icon {
  width: 20px;
  height: 20px;
  background: transparent;
  border-radius: 0;
  color: currentColor;
}
.menu button.active .menu-icon { background: transparent; }
.menu-icon svg { width: 18px; height: 18px; stroke-width: 1.8; display: block; }

/* ---- Bildirim zili ---- */
.notify-bell {
  border-color: var(--n-200);
  color: var(--n-700);
  display: inline-grid;
  place-items: center;
  transition: background .15s ease;
}
.notify-bell:hover { background: var(--n-50); }
.notify-bell-icon { display: block; line-height: 0; }
.notify-bell-icon svg { width: 19px; height: 19px; stroke-width: 1.8; }

/* ---- Butonlar ---- */
.primary {
  font-weight: 600;
  font-size: 14.5px;
  border-radius: var(--radius-md);
  background: var(--accent);
  transition: background .15s ease, box-shadow .15s ease;
}
.primary:hover { background: var(--accent-strong); }
.primary:active { background: var(--brand-700); }

.linkedin-edit-button {
  border: 1px solid var(--n-200);
  color: var(--n-700);
  font-weight: 550;
  font-size: 13.5px;
  border-radius: var(--radius-md);
  transition: background .15s ease, border-color .15s ease;
}
.linkedin-edit-button:hover { background: var(--n-50); border-color: var(--n-400); }

button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--accent-ring);
}

/* ---- Form elemanları ---- */
.group input, .group select, .group textarea,
.form-two-column select, .form-two-column textarea,
.alumni-search, .alumni-period-filter {
  border: 1px solid var(--n-200);
  border-radius: var(--radius-md);
  font-size: 14.5px;
  color: var(--text);
  background: var(--n-0);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.group input:focus, .group select:focus, .group textarea:focus,
.form-two-column select:focus, .form-two-column textarea:focus,
.alumni-search:focus, .alumni-period-filter:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-ring);
}
.group label { font-size: 13.5px; font-weight: 550; color: var(--n-700); }
::placeholder { color: var(--n-400); }

/* ---- Kartlar: tek köşe yarıçapı, tek gölge dili ---- */
.linkedin-card, .feed-post, .card, .admin-users-card, .admin-section,
.cv-card, .alumni-simple-card, .meeting-request-card, .anonymous-card,
.feed-profile-card, .feed-info-card, .post-composer, .graduation-term-card {
  border-radius: var(--radius-lg);
  border: 1px solid var(--n-200);
  box-shadow: var(--shadow-sm);
}
.linkedin-card:hover, .cv-card:hover { box-shadow: var(--shadow-md); }
.modal-panel { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }

/* Giriş kartı biraz daha zarif */
.card { border-radius: 18px; box-shadow: var(--shadow-md); border: none; }

/* ---- Rozet / durum çipleri ---- */
.menu-badge { font-weight: 700; }
.tag, .alumni-period-badge, .count-badge, .cv-type-badge,
.education-level-badge, .career-status-badge, .announcement-badge {
  font-weight: 600;
  letter-spacing: 0.01em;
}

/* ---- Tepki butonları (SVG ikonlarla hizalama) ----
   SVG'lere boyut verilmezse kabın tamamına yayılırlar; tepki
   alanındaki HER ikon taşıyıcı burada tek tek boyutlanır. */
.reaction-main svg, .reaction-btn svg, .post-actions svg, .reaction-summary svg {
  width: 16px;
  height: 16px;
  stroke-width: 1.9;
  vertical-align: -3px;
  display: inline-block;
  flex-shrink: 0;
}
.reaction-main {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}
.reaction-main svg { vertical-align: middle; }
.reaction-palette button {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
}
.reaction-palette button svg { width: 19px; height: 19px; stroke-width: 1.9; display: block; }
.reaction-palette button:hover { transform: scale(1.2); background: var(--n-50); }
.reaction-summary {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

/* ---- Boş durumlar ---- */
.empty-list, .pending-empty {
  padding: 28px 16px;
  text-align: center;
  color: var(--n-500);
  font-size: 14px;
}

/* ---- Geri bildirim düğmesi ---- */
.feedback-fab {
  font-family: var(--font-sans);
  font-weight: 600;
  box-shadow: var(--shadow-md);
}

/* ============================================================
   FAZ B — topbar, akış rayı, mezun kartları, boş durumlar
   ============================================================ */

/* ---- Topbar: arama + zil + hesap ---- */
.topbar-actions { display: flex; align-items: center; gap: 12px; position: relative; }
.topbar-search { position: relative; width: 280px; }
.topbar-search-icon {
  position: absolute; left: 13px; top: 50%; transform: translateY(-50%);
  color: var(--n-400); line-height: 0; pointer-events: none;
}
.topbar-search-icon svg { width: 16px; height: 16px; stroke-width: 2; }
.topbar-search input {
  width: 100%; padding: 9px 16px 9px 38px;
  border: 1px solid var(--n-200); border-radius: 999px;
  background: var(--n-0); font-size: 13.5px; color: var(--text);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.topbar-search input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
.topbar-avatar {
  width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--n-200);
  background: var(--brand-800); color: #fff; font-weight: 600; font-size: 13px;
  cursor: pointer; overflow: hidden; display: inline-grid; place-items: center; padding: 0; flex-shrink: 0;
}
.topbar-avatar img { width: 100%; height: 100%; object-fit: cover; }
.topbar-menu {
  position: absolute; top: calc(100% + 8px); right: 0; min-width: 200px; z-index: 80;
  background: var(--n-0); border: 1px solid var(--n-200);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: 6px;
}
.topbar-menu-item {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 9px 10px; border: 0; background: transparent; text-align: left;
  border-radius: var(--radius-sm); font-size: 13.5px; color: var(--n-700); cursor: pointer;
}
.topbar-menu-item:hover { background: var(--n-50); }
.topbar-menu-item svg { width: 16px; height: 16px; stroke-width: 1.8; color: var(--n-500); }
@media (max-width: 980px) { .topbar-search { display: none; } }

/* ---- Akış: dar okuma kolonu + sağ ray ---- */
.feed-layout { grid-template-columns: 240px minmax(0, 560px) 300px; justify-content: center; }
.feed-right { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 24px; }
@media (max-width: 1250px) {
  .feed-right { display: none; }
  .feed-layout { grid-template-columns: 240px minmax(0, 640px); }
}
@media (max-width: 760px) {
  .feed-layout { grid-template-columns: 1fr; }
}

.rail-card { padding: 18px; }
.rail-card h3 { font-size: 14.5px; font-weight: 650; margin-bottom: 12px; }
.rail-cta svg { width: 20px; height: 20px; color: var(--accent); margin-bottom: 8px; }
.rail-cta p { font-size: 13px; color: var(--n-500); margin-bottom: 12px; line-height: 1.5; }
.rail-list { display: flex; flex-direction: column; }
.rail-item {
  display: flex; align-items: center; gap: 10px; padding: 8px; margin: 0 -8px;
  border: 0; background: transparent; border-radius: var(--radius-md);
  cursor: pointer; text-align: left; width: calc(100% + 16px);
}
.rail-item:hover { background: var(--n-50); }
.rail-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.rail-initials {
  display: inline-grid; place-items: center;
  background: var(--accent-soft); color: var(--accent-strong);
  font-size: 12.5px; font-weight: 650;
}
.rail-item-text { display: flex; flex-direction: column; min-width: 0; }
.rail-item-text strong {
  font-size: 13.5px; font-weight: 600; color: var(--n-900);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rail-item-text small {
  font-size: 12px; color: var(--n-500);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rail-stats { display: flex; gap: 28px; }
.rail-stats strong { font-size: 20px; font-weight: 700; display: block; letter-spacing: -0.02em; }
.rail-stats span { font-size: 12.5px; color: var(--n-500); }

/* ---- Mezun dizin kartları: şerit kalktı, unvan satırı geldi ---- */
.alumni-simple-card::before { display: none; }
.alumni-simple-card { min-height: 0; padding: 24px 16px 20px; gap: 10px; transition: box-shadow .15s ease, transform .15s ease; }
.alumni-simple-photo, .alumni-simple-initials { width: 64px; height: 64px; }
.alumni-simple-initials { font-size: 20px; background: var(--accent-soft); color: var(--accent-strong); }
.alumni-simple-card .alumni-simple-initials, .alumni-simple-card .alumni-simple-photo { border: 1px solid var(--n-200); box-shadow: none; }
.alumni-simple-card h3 { font-size: 15px; font-weight: 650; }
.alumni-headline {
  font-size: 12.5px; color: var(--n-500); line-height: 1.45; margin: -4px 0 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.alumni-simple-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }

/* ---- Boş durumlar: ikonlu ---- */
.empty-list::before, .pending-empty::before, .empty-state::before {
  content: ""; display: block; width: 34px; height: 34px; margin: 0 auto 10px;
  background: var(--n-400);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%3Cpolyline%20points%3D%2222%2012%2016%2012%2014%2015%2010%2015%208%2012%202%2012%22%20%2F%3E%3Cpath%20d%3D%22M5.45%205.11%202%2012v6a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-6l-3.45-6.89A2%202%200%200%200%2016.76%204H7.24a2%202%200%200%200-1.79%201.11z%22%20%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%3Cpolyline%20points%3D%2222%2012%2016%2012%2014%2015%2010%2015%208%2012%202%2012%22%20%2F%3E%3Cpath%20d%3D%22M5.45%205.11%202%2012v6a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-6l-3.45-6.89A2%202%200%200%200%2016.76%204H7.24a2%202%200%200%200-1.79%201.11z%22%20%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.empty-state { text-align: center; border: 1px dashed var(--n-200); }

/* ============================================================
   FAZ C — animasyonlar, iskelet, davet tablosu, mobil sekmeler
   ============================================================ */

/* ---- Kalıp (modal) animasyonu ---- */
@keyframes sahaFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes sahaPopIn {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: none; }
}
.modal.open { animation: sahaFadeIn .15s ease; }
.modal.open .modal-panel { animation: sahaPopIn .18s ease; }
.mobile-sheet.open { animation: sahaFadeIn .15s ease; }
.mobile-sheet.open .mobile-sheet-panel { animation: sahaPopIn .2s ease; }

/* ---- Akış iskeleti ---- */
.skeleton-post {
  background: var(--n-0); border: 1px solid var(--n-200); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm); padding: 20px; margin-bottom: 16px;
}
.sk-row { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.sk-col { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.sk-avatar {
  width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0;
  background: var(--n-100);
}
.sk-line {
  display: block; height: 12px; border-radius: 6px; margin-bottom: 10px;
  background: linear-gradient(90deg, var(--n-100) 25%, var(--n-50) 50%, var(--n-100) 75%);
  background-size: 200% 100%;
  animation: sahaShimmer 1.3s linear infinite;
}
.sk-row .sk-line { margin-bottom: 0; }
@keyframes sahaShimmer { to { background-position: -200% 0; } }

/* ---- Davet tablosu düzeni ---- */
.invite-table { font-size: 13px; }
.invite-table th { font-size: 11px; letter-spacing: .6px; color: var(--n-500); }
.invite-table-shell { border: 1px solid var(--n-200); box-shadow: var(--shadow-sm); border-radius: var(--radius-lg); }
.invite-contact { min-width: 235px; }
.invite-row-actions button.invite-send-one { border-radius: var(--radius-sm); background: var(--accent); }
.invite-row-actions button.invite-send-one:hover { background: var(--accent-strong); }
.invite-upload-summary div {
  background: var(--n-0); border: 1px solid var(--n-200);
  border-radius: var(--radius-md); box-shadow: var(--shadow-sm);
}
.invite-upload-summary strong { letter-spacing: -0.02em; }

/* ---- Mobil: alt sekme çubuğu + menü sayfası ---- */
@media (min-width: 701px) {
  .mobile-tabbar, .mobile-sheet { display: none !important; }
}
@media (max-width: 700px) {
  .sidebar { display: none; }
  .main { margin-left: 0; padding: 18px 14px 88px; }
  /* FAB mobilde gizli; girişi alt "Menü" sayfasından (fazc.js) */
  .feedback-fab { display: none !important; }

  .mobile-tabbar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    display: flex; background: var(--n-0);
    border-top: 1px solid var(--n-200);
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    box-shadow: 0 -4px 16px rgba(16, 32, 54, .06);
  }
  .mobile-tab {
    flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px;
    border: 0; background: none; cursor: pointer; position: relative;
    padding: 4px 2px; border-radius: var(--radius-sm);
    font-size: 10.5px; font-weight: 550; color: var(--n-500);
  }
  .mobile-tab svg { width: 21px; height: 21px; stroke-width: 1.8; }
  .mobile-tab.active { color: var(--accent); }
  .mobile-tab-badge {
    position: absolute; top: 0; left: calc(50% + 4px);
    min-width: 16px; height: 16px; padding: 0 4px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 999px; background: #d33f49; color: #fff;
    font-size: 10px; font-weight: 700; font-style: normal; line-height: 1;
  }

  .mobile-sheet {
    position: fixed; inset: 0; z-index: 95;
    background: rgba(7, 22, 40, .5); display: none;
  }
  .mobile-sheet.open { display: block; }
  .mobile-sheet-panel {
    position: absolute; left: 0; right: 0; bottom: 0;
    background: var(--n-0); border-radius: 16px 16px 0 0;
    padding: 14px 14px calc(18px + env(safe-area-inset-bottom));
    max-height: 70vh; overflow-y: auto;
  }
  .mobile-sheet-panel .topbar-menu-item { padding: 12px 10px; font-size: 14.5px; }
  .mobile-sheet-panel .topbar-menu-item svg { width: 18px; height: 18px; }
}

/* ---- Paylaşım kutusu (composer) cilası ---- */
.post-composer { padding: 18px 20px; }
.composer-avatar { background: var(--accent-soft); color: var(--accent-strong); font-size: 15px; }
.composer-trigger {
  border-color: var(--n-200);
  color: var(--n-500);
  font-size: 14px;
  transition: background .15s ease, border-color .15s ease;
}
.composer-trigger:hover { background: var(--n-50); border-color: var(--n-400); }
.composer-actions { border-top: 1px solid var(--n-100); margin-top: 14px; padding-top: 8px; gap: 4px; }
.composer-actions button {
  justify-content: center;
  gap: 8px;
  font-weight: 550;
  font-size: 13.5px;
  color: var(--n-700);
  border-radius: var(--radius-md);
  transition: background .15s ease;
}
.composer-action-icon { display: inline-grid; place-items: center; line-height: 0; }
.composer-action-icon svg { width: 18px; height: 18px; stroke-width: 1.8; }
/* LinkedIn usulü: her eylemin kendi renk vurgusu */
#openTextPost .composer-action-icon { color: var(--accent); }
#openMediaPost .composer-action-icon { color: #1f8a5b; }
#openAnnouncementPost .composer-action-icon { color: #b7791f; }

/* ---- Karşılama bannerı: geçici selam ---- */
.feed-welcome-card { position: relative; transition: opacity .45s ease, transform .45s ease; }
.welcome-close {
  position: absolute; top: 12px; right: 12px;
  width: 30px; height: 30px; border: 0; border-radius: 50%;
  display: inline-grid; place-items: center; cursor: pointer;
  background: rgba(255, 255, 255, .16); color: #fff;
  transition: background .15s ease;
}
.welcome-close:hover { background: rgba(255, 255, 255, .28); }
.welcome-close svg { width: 15px; height: 15px; stroke-width: 2.2; }
.welcome-collapsing { opacity: 0; transform: translateY(-10px); }
.welcome-collapsed { display: none; }

/* ---- Composer v2: eylemler her ekranda yan yana, canlı hover ---- */
.composer-actions { grid-template-columns: repeat(3, 1fr); }
.composer-avatar img, .feed-user-avatar img {
  width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block;
}
.composer-actions button { border: 1px solid transparent; }
#openTextPost:hover { background: var(--accent-soft); border-color: rgba(30, 111, 184, .25); }
#openMediaPost:hover { background: #e9f6ef; border-color: rgba(31, 138, 91, .25); }
#openAnnouncementPost:hover { background: #fcf3df; border-color: rgba(183, 121, 31, .3); }
@media (max-width: 760px) {
  .composer-actions { gap: 4px; }
  .composer-actions button { font-size: 12.5px; padding: 10px 4px; gap: 6px; }
  .composer-actions button svg { width: 17px; height: 17px; }
  .composer-avatar { width: 42px; height: 42px; font-size: 13.5px; }
  .composer-trigger { padding: 11px 14px; font-size: 13.5px; }
}
@media (max-width: 760px) {
  .composer-label-extra { display: none; }
}

/* ============================================================
   UX PAKETİ — toast, onboarding görev kartı, bildirim paneli
   ============================================================ */

/* ---- Toast bildirimleri ---- */
.toast-host {
  position: fixed; left: 20px; bottom: 20px; z-index: 200;
  display: flex; flex-direction: column; gap: 10px;
  max-width: min(420px, calc(100vw - 40px)); pointer-events: none;
}
.toast {
  display: flex; align-items: flex-start; gap: 10px;
  background: var(--n-900); color: #fff;
  padding: 12px 16px; border-radius: 12px; box-shadow: var(--shadow-md);
  font-size: 13.5px; line-height: 1.45;
  opacity: 0; transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
}
.toast.show { opacity: 1; transform: none; }
.toast svg { width: 17px; height: 17px; flex-shrink: 0; margin-top: 1px; }
.toast-success svg { color: #5fd39a; }
.toast-warn svg { color: #ffce6b; }
@media (max-width: 700px) {
  .toast-host { left: 12px; right: 12px; bottom: calc(76px + env(safe-area-inset-bottom)); max-width: none; }
}

/* ---- Onboarding: profil tamamlama kartı ---- */
.onboard-progress-label { font-size: 12.5px; color: var(--n-500); margin: -6px 0 6px; }
.onboard-progress {
  height: 6px; border-radius: 999px; background: var(--n-100);
  overflow: hidden; margin-bottom: 12px;
}
.onboard-progress span { display: block; height: 100%; border-radius: 999px; background: var(--accent); transition: width .3s ease; }
.onboard-list { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.onboard-list li { display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--n-700); }
.onboard-list li svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--n-400); }
.onboard-list li.done { color: var(--n-500); text-decoration: line-through; text-decoration-color: var(--n-400); }
.onboard-list li.done svg { color: #1f8a5b; }
.onboard-mobile { display: none; }
@media (max-width: 1250px) {
  .onboard-mobile { display: block; margin-bottom: 16px; }
  .onboard-mobile .rail-card { padding: 18px; }
}

/* ---- Bildirim paneli ---- */
.notify-panel-head {
  font-size: 13px; font-weight: 650; color: var(--n-900);
  padding: 4px 6px 10px; border-bottom: 1px solid var(--n-100); margin-bottom: 6px;
}
.thread-empty {
  text-align: center; color: var(--n-500); font-size: 13.5px; padding: 22px 12px;
}
.thread-empty::before {
  content: ""; display: block; width: 28px; height: 28px; margin: 0 auto 8px;
  background: var(--n-400);
  -webkit-mask: var(--inbox-mask) center / contain no-repeat;
  mask: var(--inbox-mask) center / contain no-repeat;
}

/* ============================================================
   FAZ D — LinkedIn tarzı üst gezinme
   Masaüstünde sol menü gizlenir; gezinme header'a taşınır
   (topnav.js kurar). Mobil (≤700px) alt sekme çubuğu aynen kalır.
   ============================================================ */

/* ---- Marka bloğu (her genişlikte) ---- */
.topbar-brand {
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
  border: 0; background: none; padding: 0; cursor: pointer;
}
.brand-mark {
  width: 34px; height: 34px; border-radius: 9px;
  background: linear-gradient(135deg, var(--brand-700), var(--brand-900));
  color: #fff; font-weight: 800; font-size: 17px;
  display: grid; place-items: center; letter-spacing: -0.02em;
}
.brand-text {
  font-weight: 750; font-size: 16.5px; color: var(--brand-900);
  letter-spacing: -0.02em; white-space: nowrap;
}

/* ---- Sayfa başlığı artık içerik alanında ---- */
.page-heading h1 { font-size: 22px; font-weight: 700; color: var(--n-900); }
.page-heading p { font-size: 13.5px; color: var(--n-500); margin-top: 2px; }
body.nav-home .page-heading { display: none; }

@media (min-width: 701px) {
  .portal .sidebar { display: none; }
  .portal .main { margin-left: 0; padding: 0 0 48px; }

  .topbar {
    position: sticky; top: 0; z-index: 85;
    display: flex; align-items: center; justify-content: flex-start; gap: 18px;
    height: 60px; margin: 0; padding: 0 22px;
    background: var(--n-0); border-bottom: 1px solid var(--n-200);
    box-shadow: 0 1px 2px rgba(16, 32, 54, .04);
  }
  .topbar-search { width: min(280px, 24vw); }

  /* İçerik: ortalanmış okuma alanı */
  .main > .page, .page-heading {
    max-width: 1200px; width: 100%;
    margin-left: auto; margin-right: auto;
    padding-left: 24px; padding-right: 24px;
  }
  .page-heading { margin-top: 26px; }
  .main > .page { margin-top: 22px; }
  body:not(.nav-home) .main > .page { margin-top: 16px; }

  /* Yapışkan header'ın altında kalmasın */
  .feed-right { top: 84px; }

  /* ---- Gezinme öğeleri ---- */
  .topnav { display: flex; align-items: stretch; align-self: stretch; margin-left: auto; }
  .topnav-item {
    position: relative; min-width: 74px; padding: 0 10px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    border: 0; background: none; cursor: pointer;
    color: var(--n-500); font-size: 11.5px; font-weight: 550; font-family: var(--font-sans);
    border-top: 2px solid transparent; border-bottom: 2px solid transparent;
    transition: color .15s ease;
  }
  .topnav-item:hover { color: var(--n-700); }
  .topnav-item.active { color: var(--brand-900); border-bottom-color: var(--brand-900); }
  .topnav-icon { line-height: 0; }
  .topnav-icon svg { width: 22px; height: 22px; stroke-width: 1.7; }
  .topnav-label { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; }
  .topnav-caret { width: 12px; height: 12px; stroke-width: 2.2; }
  .topnav-badge {
    position: absolute; top: 6px; left: calc(50% + 5px);
    min-width: 16px; height: 16px; padding: 0 4px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 999px; background: #d33f49; color: #fff;
    font-size: 10px; font-weight: 700; font-style: normal; line-height: 1;
  }

  /* ---- Yönetim açılır menüsü ---- */
  .topnav-more { position: relative; display: flex; align-items: stretch; }
  .topnav-dropdown {
    position: absolute; top: calc(100% + 6px); right: 0; min-width: 216px; z-index: 85;
    background: var(--n-0); border: 1px solid var(--n-200);
    border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: 6px;
  }

  /* Dar masaüstünde etiketler gizlenir, ikonlar kalır */
  @media (max-width: 940px) {
    .topnav-item { min-width: 52px; }
    .topnav-label { display: none; }
    .topnav-badge { top: 10px; }
  }
}

@media (max-width: 700px) {
  .topnav { display: none; }
  .topbar { align-items: center; }
  .page-heading { margin-bottom: 14px; }
}

/* ============================================================
   FAZ E — Profesyonel cila
   Yüzey sistemi, mikro-etkileşimler, tipografi ritmi ve boş
   durumların tek tip "ürün" hissine kavuşturulması. Yalnız CSS.
   ============================================================ */

/* ---- Yüzey zemini ---- */
body { background: #f2f5f9; }
::selection { background: var(--accent-soft); color: var(--brand-900); }

/* İnce, nötr kaydırma çubukları */
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: #c9d4e0; border-radius: 8px; border: 3px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background-color: #aebccb; }
*::-webkit-scrollbar-track { background: transparent; }

/* Sayfa geçişinde yumuşak giriş */
@media (prefers-reduced-motion: no-preference) {
  @keyframes sahaPageIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
  .page.active { animation: sahaPageIn .22s ease both; }
  @keyframes sahaMenuPop { from { opacity: 0; transform: translateY(-4px) scale(.98); } to { opacity: 1; transform: none; } }
  .topbar-menu:not(.hidden), .topnav-dropdown:not(.hidden), .notify-panel:not(.hidden) { animation: sahaMenuPop .16s ease both; }
}

/* ---- Header: buzlu cam + canlı ayrıntılar ---- */
@media (min-width: 701px) {
  .topbar {
    background: rgba(255, 255, 255, .85);
    -webkit-backdrop-filter: blur(14px) saturate(1.5);
    backdrop-filter: blur(14px) saturate(1.5);
  }
  /* Aktif çizgi border yerine animasyonlu şerit */
  .topnav-item { border-bottom-color: transparent !important; }
  .topnav-item::after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 2px;
    border-radius: 2px; background: var(--brand-900);
    transform: scaleX(0); transition: transform .2s ease;
  }
  .topnav-item.active::after { transform: scaleX(1); }
}
.topbar-search input { background: var(--n-100); border-color: transparent; }
.topbar-search input:focus { background: var(--n-0); }
.topbar-avatar { transition: box-shadow .15s ease; }
.topbar-avatar:hover { box-shadow: 0 0 0 3px var(--accent-ring); }

/* ---- Butonlar: kalkış/basış hissi ---- */
.primary, .linkedin-edit-button, .approve-post-button, .feedback-fab {
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.primary { background: linear-gradient(180deg, #1e6fb8, #175a97); }
.primary:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -8px rgba(23, 90, 151, .55); }
.primary:active { transform: none; box-shadow: none; }
.linkedin-edit-button:hover { transform: translateY(-1px); }
.feedback-fab { box-shadow: 0 10px 24px -8px rgba(11, 31, 56, .45); }
.feedback-fab:hover { transform: translateY(-2px); box-shadow: 0 14px 28px -8px rgba(11, 31, 56, .5); }

/* ---- Giriş ekranı: ilk izlenim ---- */
.auth-visual {
  background:
    radial-gradient(120% 150% at 88% -12%, rgba(30, 111, 184, .38), transparent 52%),
    radial-gradient(80% 110% at -8% 108%, rgba(9, 40, 78, .85), transparent 62%),
    linear-gradient(160deg, #071c36, #0d2f57 58%, #123c6b);
}
.portal-title { letter-spacing: -0.015em; }
.logo-wrap img { filter: drop-shadow(0 18px 34px rgba(0, 0, 0, .4)); }

/* ---- Zaman Tüneli ---- */
.feed-welcome-card {
  padding: 24px 26px;
  border: 0;
  background:
    radial-gradient(120% 170% at 100% 0%, rgba(56, 132, 199, .5), transparent 46%),
    radial-gradient(90% 130% at 0% 110%, rgba(7, 22, 40, .75), transparent 58%),
    linear-gradient(120deg, #0d2440, #154a7e 55%, #1c67ad);
  box-shadow: 0 12px 30px -14px rgba(13, 36, 64, .5);
}
.feed-welcome-card h2 { font-size: 21px; letter-spacing: -0.02em; }
.feed-welcome-card p { font-size: 13.5px; }
.feed-welcome-kicker { letter-spacing: .09em; font-size: 11px; opacity: .92; }

.feed-profile-cover {
  height: 64px;
  background:
    radial-gradient(100% 160% at 100% 0%, rgba(56, 132, 199, .55), transparent 55%),
    linear-gradient(120deg, var(--brand-800), var(--brand-700));
}
.feed-user-avatar { box-shadow: var(--shadow-sm); }
.feed-profile-body h3 { font-size: 16px; font-weight: 650; }
.feed-profile-link {
  display: inline-block; margin-top: 14px; padding: 7px 16px;
  border: 1px solid var(--accent); border-radius: 999px;
  color: var(--accent-strong); font-weight: 600; font-size: 13px;
  transition: background .15s ease, color .15s ease;
}
.feed-profile-link:hover { background: var(--accent-soft); }

/* Gönderi üstbilgisi: net hiyerarşi */
.post-author-info strong { font-size: 14.5px; font-weight: 650; letter-spacing: -0.01em; }
.post-author-info span { font-size: 12.5px; }
.post-author-info span:last-of-type { color: var(--n-400); font-size: 12px; }

/* "Gönderiyi Sil": bağırmayan, üzerine gelince niyetini söyleyen */
.post-delete-button {
  color: var(--n-400); font-weight: 550; padding: 6px 10px; border-radius: 8px;
  transition: background .15s ease, color .15s ease;
}
.post-delete-button:hover { background: var(--err-bg); color: var(--err-text); }

.announcement-badge {
  background: var(--accent-soft); color: var(--accent-strong);
  font-size: 10.5px; font-weight: 700; letter-spacing: .07em;
  border-radius: 999px; padding: 4px 10px;
}
.feed-post-content { font-size: 14.5px; }

/* Sağ ray sayaçları hizalı rakamlarla */
.rail-stats strong { font-variant-numeric: tabular-nums; }

/* ---- Mezunlar: eşit yükseklik, alta sabit dönem rozeti ---- */
.alumni-simple-card {
  display: flex; flex-direction: column; align-items: center;
  padding: 26px 18px 20px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.alumni-simple-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: #d6e2ee; }
.alumni-simple-card .alumni-simple-photo, .alumni-simple-card .alumni-simple-initials {
  width: 76px; height: 76px; border: 0;
  box-shadow: 0 0 0 4px var(--n-0), 0 0 0 5px var(--n-200);
}
.alumni-simple-card h3 { margin-top: 16px; font-size: 15.5px; font-weight: 650; letter-spacing: -0.01em; }
.alumni-headline {
  margin: 5px 0 14px; font-size: 12.8px; color: var(--n-500); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.alumni-period-badge { margin-top: auto; }

/* ---- Mesajlar: boş durum ortalanır, satırlar nefes alır ---- */
.messages-thread-pane { display: flex; flex-direction: column; }
.messages-thread-pane > .thread-empty { margin: auto; }
.thread-item { transition: background .12s ease; }

/* ---- Mezun Daveti tablosu: satır vurgusu ---- */
.invite-table tbody tr { transition: background .12s ease; }
.invite-table tbody tr:hover td { background: var(--n-50); }

/* ============================================================
   FAZ F — Marka logosu + ikonlu istatistikler
   Header'da gerçek SAHA mührü; sağ ray "Topluluk" ve Mezun
   Daveti sayaçları ikon çipli satır/kutucuklara dönüştü.
   ============================================================ */

/* ---- Header marka mührü ---- */
.topbar-brand .brand-logo { width: 40px; height: 40px; object-fit: contain; display: block; }

/* ---- Sağ ray kart başlıkları: küçük ikonlu ---- */
.rail-card h3 { display: flex; align-items: center; gap: 8px; }
.rail-card h3 svg { width: 15px; height: 15px; stroke-width: 2; color: var(--accent); flex-shrink: 0; }

/* ---- Topluluk sayaçları: ikon çipli satırlar ---- */
.rail-stats { flex-direction: column; gap: 12px; }
.rail-stat { display: flex; align-items: center; gap: 12px; }
.rail-stat-icon {
  width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0;
  background: var(--accent-soft); color: var(--accent-strong);
  display: grid; place-items: center;
}
.rail-stat-icon svg { width: 18px; height: 18px; stroke-width: 1.9; }
.rail-stat-text strong { display: block; font-size: 17px; line-height: 1.15; letter-spacing: -0.01em; }
.rail-stat-text small { font-size: 12px; color: var(--n-500); }

/* ---- Mezun Daveti kutucukları: renk tonunu ikon çipi taşır ---- */
.invite-tile { flex-direction: row; align-items: center; gap: 12px; border-left: 0; }
.invite-tile-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.invite-tile-icon {
  width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0;
  background: var(--accent-soft); color: var(--accent-strong);
  display: grid; place-items: center;
}
.invite-tile-icon svg { width: 18px; height: 18px; stroke-width: 1.9; }
.invite-tile.good .invite-tile-icon { background: var(--ok-bg); color: var(--ok-text); }
.invite-tile.warn .invite-tile-icon { background: var(--warn-bg); color: var(--warn-text); }
.invite-tile-value { font-size: 20px; font-variant-numeric: tabular-nums; }

/* ============================================================
   FAZ G — Geri Bildirim header'da, sağ altta mesajlaşma yuvası
   ============================================================ */

/* Balon kalktı; girişi header ikonu (masaüstü) ve Menü sayfası (mobil) verir */
.feedback-fab { display: none !important; }

.msg-dock { position: fixed; right: 24px; bottom: 0; z-index: 90; width: 304px; }
.msg-dock.dock-hidden { display: none; }
@media (max-width: 700px) { .msg-dock { display: none; } }

.msg-dock-head {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 10px 14px; cursor: pointer;
  background: var(--n-0); border: 1px solid var(--n-200); border-bottom: 0;
  border-radius: 14px 14px 0 0;
  box-shadow: 0 -6px 22px rgba(16, 32, 54, .12);
  transition: background .15s ease;
}
.msg-dock-head:hover { background: var(--n-50); }
.msg-dock-avatar {
  width: 30px; height: 30px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
  background: var(--accent-soft); color: var(--accent-strong);
  font-size: 12px; font-weight: 700; display: grid; place-items: center;
}
.msg-dock-avatar img { width: 100%; height: 100%; object-fit: cover; }
.msg-dock-title { font-size: 14px; font-weight: 650; color: var(--n-900); }
.msg-dock-head .menu-badge { margin: 0; }
.msg-dock-caret { margin-left: auto; color: var(--n-500); line-height: 0; transition: transform .2s ease; }
.msg-dock-caret svg { width: 16px; height: 16px; stroke-width: 2; }
.msg-dock.open .msg-dock-caret { transform: rotate(180deg); }

.msg-dock-body { background: var(--n-0); border: 1px solid var(--n-200); border-top: 1px solid var(--n-100); }
.msg-dock-list { max-height: 380px; overflow-y: auto; padding: 8px; }
.msg-dock-list .thread-item { width: 100%; }
.msg-dock-list .thread-empty { padding: 30px 12px; }
.msg-dock-all {
  display: block; width: 100%; padding: 11px; cursor: pointer;
  border: 0; border-top: 1px solid var(--n-100); background: var(--n-0);
  color: var(--accent-strong); font-weight: 600; font-size: 13px;
  transition: background .15s ease;
}
.msg-dock-all:hover { background: var(--n-50); }

/* ---- Faz G ek: Geri Bildirim düğmesi belirgin + hafif animasyonlu ---- */
.topbar-feedback {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 15px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--accent-soft); color: var(--accent-strong);
  font-size: 13px; font-weight: 600; font-family: var(--font-sans);
  white-space: nowrap; flex-shrink: 0;
  transition: background .15s ease, color .15s ease, transform .15s ease;
}
.topbar-feedback:hover { background: var(--accent); color: #fff; transform: translateY(-1px); }
.topbar-feedback-icon { line-height: 0; }
.topbar-feedback-icon svg { width: 16px; height: 16px; stroke-width: 2; }

/* Birkaç saniyede bir yumuşak ışıltı + ampulün göz kırpması.
   Kullanıcı düğmeyi bir kez kullandıysa (.quiet) durur. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes sahaFeedbackGlow {
    0%, 86%, 100% { box-shadow: 0 0 0 0 rgba(30, 111, 184, 0); }
    90% { box-shadow: 0 0 0 7px rgba(30, 111, 184, .16); }
    97% { box-shadow: 0 0 0 13px rgba(30, 111, 184, 0); }
  }
  @keyframes sahaBulbWink {
    0%, 86%, 100% { transform: none; }
    90% { transform: rotate(-10deg) scale(1.15); }
    95% { transform: rotate(7deg) scale(1.05); }
  }
  .topbar-feedback { animation: sahaFeedbackGlow 7s ease-in-out infinite; }
  .topbar-feedback-icon { animation: sahaBulbWink 7s ease-in-out infinite; }
  .topbar-feedback:hover, .topbar-feedback.quiet,
  .topbar-feedback:hover .topbar-feedback-icon, .topbar-feedback.quiet .topbar-feedback-icon {
    animation: none;
  }
}

/* Dar ekranda etiket gizlenir, yuvarlak ikon düğmesi kalır */
@media (max-width: 1150px) {
  .topbar-feedback { padding: 10px; }
  .topbar-feedback-label { display: none; }
}


/* ============================================================
   FAZ H — Profil sayfası cilası (kendi profil + mezun profili)
   Bölüm başlıklarına ikon, gerçek zaman çizelgesi, ikonlu
   iletişim çipleri, rafine boş durumlar ve dönem kartı. Yalnız CSS.
   ============================================================ */
:root {
  --m-user: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Ccircle%20cx%3D'12'%20cy%3D'8'%20r%3D'5'%2F%3E%3Cpath%20d%3D'M20%2021a8%208%200%200%200-16%200'%2F%3E%3C%2Fsvg%3E");
  --m-brief: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M16%2020V4a2%202%200%200%200-2-2h-4a2%202%200%200%200-2%202v16'%2F%3E%3Crect%20width%3D'20'%20height%3D'14'%20x%3D'2'%20y%3D'6'%20rx%3D'2'%2F%3E%3C%2Fsvg%3E");
  --m-cap: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M21.42%2010.922a1%201%200%200%200-.019-1.838L12.83%205.18a2%202%200%200%200-1.66%200L2.6%209.08a1%201%200%200%200%200%201.832l8.57%203.908a2%202%200%200%200%201.66%200z'%2F%3E%3Cpath%20d%3D'M22%2010v6'%2F%3E%3Cpath%20d%3D'M6%2012.5V16a6%203%200%200%200%2012%200v-3.5'%2F%3E%3C%2Fsvg%3E");
  --m-award: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'm15.477%2012.89%201.515%208.526a.5.5%200%200%201-.81.47l-3.58-2.687a1%201%200%200%200-1.197%200l-3.586%202.686a.5.5%200%200%201-.81-.469l1.514-8.526'%2F%3E%3Ccircle%20cx%3D'12'%20cy%3D'8'%20r%3D'6'%2F%3E%3C%2Fsvg%3E");
  --m-mail: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Crect%20width%3D'20'%20height%3D'16'%20x%3D'2'%20y%3D'4'%20rx%3D'2'%2F%3E%3Cpath%20d%3D'm22%207-8.97%205.7a1.94%201.94%200%200%201-2.06%200L2%207'%2F%3E%3C%2Fsvg%3E");
  --m-phone: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M22%2016.92v3a2%202%200%200%201-2.18%202%2019.79%2019.79%200%200%201-8.63-3.07%2019.5%2019.5%200%200%201-6-6%2019.79%2019.79%200%200%201-3.07-8.67A2%202%200%200%201%204.11%202h3a2%202%200%200%201%202%201.72%2012.84%2012.84%200%200%200%20.7%202.81%202%202%200%200%201-.45%202.11L8.09%209.91a16%2016%200%200%200%206%206l1.27-1.27a2%202%200%200%201%202.11-.45%2012.84%2012.84%200%200%200%202.81.7A2%202%200%200%201%2022%2016.92z'%2F%3E%3C%2Fsvg%3E");
  --m-cake: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M20%2021v-8a2%202%200%200%200-2-2H6a2%202%200%200%200-2%202v8'%2F%3E%3Cpath%20d%3D'M4%2016s.5-1%202-1%202.5%202%204%202%202.5-2%204-2%202.5%202%204%202%202-1%202-1'%2F%3E%3Cpath%20d%3D'M2%2021h20'%2F%3E%3Cpath%20d%3D'M7%208v3'%2F%3E%3Cpath%20d%3D'M12%208v3'%2F%3E%3Cpath%20d%3D'M17%208v3'%2F%3E%3C%2Fsvg%3E");
  --m-pin: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpath%20d%3D'M20%2010c0%204.993-5.539%2010.193-7.399%2011.799a1%201%200%200%201-1.202%200C9.539%2020.193%204%2014.993%204%2010a8%208%200%200%201%2016%200'%2F%3E%3Ccircle%20cx%3D'12'%20cy%3D'10'%20r%3D'3'%2F%3E%3C%2Fsvg%3E");
  --m-lock: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Crect%20width%3D'18'%20height%3D'11'%20x%3D'3'%20y%3D'11'%20rx%3D'2'%20ry%3D'2'%2F%3E%3Cpath%20d%3D'M7%2011V7a5%205%200%200%201%2010%200v4'%2F%3E%3C%2Fsvg%3E");
  --m-inbox: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'2'%20stroke-linecap%3D'round'%20stroke-linejoin%3D'round'%3E%3Cpolyline%20points%3D'22%2012%2016%2012%2014%2015%2010%2015%208%2012%202%2012'%2F%3E%3Cpath%20d%3D'M5.45%205.11%202%2012v6a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-6l-3.45-6.89A2%202%200%200%200%2016.76%204H7.24a2%202%200%200%200-1.79%201.11z'%2F%3E%3C%2Fsvg%3E");
}

/* ---- Bölüm başlıkları: küçük vurgu ikonu ---- */
.linkedin-profile .linkedin-card-title h3 { display: flex; align-items: center; gap: 9px; }
.linkedin-profile .linkedin-card-title h3::before {
  content: ""; width: 17px; height: 17px; flex-shrink: 0; background: var(--accent);
  -webkit-mask: var(--sec-icon, none) center / contain no-repeat;
  mask: var(--sec-icon, none) center / contain no-repeat;
}
.linkedin-card:has(#profileAbout) .linkedin-card-title h3,
.linkedin-card:has(#publicPageAbout) .linkedin-card-title h3 { --sec-icon: var(--m-user); }
.linkedin-card:has(#experienceList) .linkedin-card-title h3,
.linkedin-card:has(#publicPageExperienceList) .linkedin-card-title h3 { --sec-icon: var(--m-brief); }
.linkedin-card:has(#educationList) .linkedin-card-title h3,
.linkedin-card:has(#publicPageEducationList) .linkedin-card-title h3 { --sec-icon: var(--m-cap); }
.linkedin-card:has(#certificateList) .linkedin-card-title h3,
.linkedin-card:has(#publicPageCertificateList) .linkedin-card-title h3 { --sec-icon: var(--m-award); }
.linkedin-card:has(.graduation-term-card) .linkedin-card-title h3 { --sec-icon: var(--m-cap); }
/* İkonu tanımlı olmayan başlıkta yer tutucu görünmesin */
.linkedin-profile .linkedin-card-title h3::before { display: none; }
.linkedin-card:has(#profileAbout) .linkedin-card-title h3::before,
.linkedin-card:has(#publicPageAbout) .linkedin-card-title h3::before,
.linkedin-card:has(#experienceList) .linkedin-card-title h3::before,
.linkedin-card:has(#publicPageExperienceList) .linkedin-card-title h3::before,
.linkedin-card:has(#educationList) .linkedin-card-title h3::before,
.linkedin-card:has(#publicPageEducationList) .linkedin-card-title h3::before,
.linkedin-card:has(#certificateList) .linkedin-card-title h3::before,
.linkedin-card:has(#publicPageCertificateList) .linkedin-card-title h3::before,
.linkedin-card:has(.graduation-term-card) .linkedin-card-title h3::before { display: block; }

/* ---- Kimlik bloğu ---- */
.linkedin-identity h2 { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.linkedin-identity p { font-size: 15px; color: var(--n-700); }
.linkedin-identity > span {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--n-500); margin-top: 2px;
}
.linkedin-identity > span::before {
  content: ""; width: 13px; height: 13px; background: var(--n-400);
  -webkit-mask: var(--m-pin) center / contain no-repeat;
  mask: var(--m-pin) center / contain no-repeat;
}

/* ---- İletişim: ikonlu çipler ---- */
.linkedin-contact { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.linkedin-contact span {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 12px; border-radius: 999px;
  background: var(--n-50); border: 1px solid var(--n-200);
  font-size: 12.5px; font-weight: 550; color: var(--n-700);
}
.linkedin-contact span::before {
  content: ""; width: 13px; height: 13px; flex-shrink: 0; background: var(--accent);
  -webkit-mask: var(--chip-icon, var(--m-mail)) center / contain no-repeat;
  mask: var(--chip-icon, var(--m-mail)) center / contain no-repeat;
}
#profileEmail, #publicPageEmail { --chip-icon: var(--m-mail); }
#profilePhone, #publicPagePhone { --chip-icon: var(--m-phone); }
#profileBirthDayMonth, #publicPageBirthDayMonth { --chip-icon: var(--m-cake); }

/* Gizlilik notu: kilit ikonlu sakin şerit */
.private-profile-note {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 12px; padding: 8px 13px;
  background: var(--n-50); border: 1px dashed var(--n-200); border-radius: 10px;
  font-size: 12.5px; color: var(--n-500);
}
.private-profile-note::before {
  content: ""; width: 13px; height: 13px; flex-shrink: 0; background: var(--n-400);
  -webkit-mask: var(--m-lock) center / contain no-repeat;
  mask: var(--m-lock) center / contain no-repeat;
}
.private-profile-note strong { color: var(--n-700); font-weight: 600; }

/* ---- Zaman çizelgesi ---- */
.timeline-list { display: flex; flex-direction: column; }
.timeline-item { display: flex; gap: 14px; padding: 15px 0; align-items: flex-start; }
.timeline-item + .timeline-item { border-top: 1px solid var(--n-100); }
.timeline-logo {
  width: 46px; height: 46px; border-radius: 12px; flex-shrink: 0;
  background: var(--accent-soft); color: var(--accent-strong);
  font-size: 14px; font-weight: 700; display: grid; place-items: center;
}
.timeline-content h4 { font-size: 14.5px; font-weight: 650; letter-spacing: -0.01em; }
.timeline-company { font-size: 13px; color: var(--n-700); margin-top: 1px; }
.timeline-date { font-size: 12px; color: var(--n-400); margin-top: 3px; }
.timeline-description { font-size: 13.5px; color: var(--n-700); margin-top: 8px; line-height: 1.55; }
.timeline-actions button {
  border: 1px solid var(--n-200); background: var(--n-0); color: var(--n-500);
  font-size: 12px; font-weight: 550; padding: 5px 12px; border-radius: 999px; cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.timeline-actions button:hover { background: var(--accent-soft); color: var(--accent-strong); border-color: transparent; }

/* ---- Boş durumlar: ölü boşluk yok, hayalet ikon var ---- */
.empty-list {
  padding: 26px 12px !important; text-align: center;
  color: var(--n-500); font-size: 13.5px;
}
.empty-list::before {
  content: ""; display: block; width: 26px; height: 26px; margin: 0 auto 8px;
  background: var(--n-400);
  -webkit-mask: var(--m-inbox) center / contain no-repeat;
  mask: var(--m-inbox) center / contain no-repeat;
}

/* ---- Sağ kolon: dönem kartı ---- */
.graduation-term-card {
  border: 0 !important; text-align: center;
  padding: 18px 16px; border-radius: 12px;
  background:
    radial-gradient(120% 160% at 100% 0%, rgba(56, 132, 199, .45), transparent 50%),
    linear-gradient(120deg, var(--brand-800), var(--brand-700));
  color: #fff !important; font-size: 17px; font-weight: 700; letter-spacing: -0.01em;
}
.graduation-city-row {
  display: flex; flex-direction: column; gap: 2px;
  margin-top: 12px; padding: 12px 14px;
  background: var(--n-50); border: 1px solid var(--n-100); border-radius: 12px;
}
.graduation-city-row span {
  font-size: 11px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--n-500);
}
.graduation-city-row strong { font-size: 15px; font-weight: 650; color: var(--n-900); }

/* ---- Düzenle / + Ekle düğmeleri ---- */
.linkedin-card-title .icon-button {
  border: 1px solid var(--n-200); background: var(--n-0); color: var(--n-700);
  font-size: 12.5px; font-weight: 550; padding: 6px 13px; border-radius: 999px; cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.linkedin-card-title .icon-button:hover { background: var(--accent-soft); color: var(--accent-strong); border-color: transparent; }

/* ---- Kapak ve fotoğraf ---- */
.linkedin-cover { position: relative; }
.linkedin-cover::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11, 31, 56, .08), transparent 35%, rgba(11, 31, 56, .12));
  pointer-events: none;
}
.linkedin-photo, .linkedin-initials { box-shadow: 0 4px 14px rgba(16, 32, 54, .16); }
.cover-edit-button {
  background: rgba(255, 255, 255, .88); color: var(--n-900);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border: 0; border-radius: 999px; font-weight: 600; font-size: 12.5px;
  z-index: 1;
}

/* ============================================================
   FAZ I — kalan küçük işler
   Gönderi üç-nokta menüsü, Mesajlar sayfası içi, giriş ekranı
   değer bloğu, CV Havuzu + Yönetim Paneli rötuşları.
   ============================================================ */

/* ---- Gönderi üç-nokta menüsü ---- */
.post-menu { position: relative; flex-shrink: 0; }
.post-menu-btn {
  width: 32px; height: 32px; border: 0; border-radius: 50%;
  background: transparent; color: var(--n-400); cursor: pointer;
  display: grid; place-items: center;
  transition: background .15s ease, color .15s ease;
}
.post-menu-btn:hover { background: var(--n-100); color: var(--n-700); }
.post-menu-btn svg { width: 18px; height: 18px; }
.post-menu-drop {
  position: absolute; top: calc(100% + 4px); right: 0; min-width: 170px; z-index: 30;
  background: var(--n-0); border: 1px solid var(--n-200);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: 6px;
}
.post-menu-delete:hover { background: var(--err-bg) !important; color: var(--err-text) !important; }
@media (prefers-reduced-motion: no-preference) {
  .post-menu-drop:not(.hidden) { animation: sahaMenuPop .16s ease both; }
}

/* ---- Mesajlar sayfası içi ---- */
.thread-header strong { font-size: 14.5px; font-weight: 650; }
.thread-message { background: var(--n-100); }
.thread-message.mine {
  background: linear-gradient(135deg, #1e6fb8, #175a97);
  color: #fff;
}
.thread-message.mine .thread-message-content { color: #fff; }
.thread-message.mine small { color: rgba(255, 255, 255, .72); }
.thread-messages { background: var(--n-50); border-radius: 12px; margin: 10px 12px 0; }
.thread-item.active { background: var(--accent-soft); }
.thread-item.active strong { color: var(--accent-strong); }

/* ---- Giriş ekranı: değer bloğu ---- */
.auth-points { margin-top: 6px; }
.auth-tagline { font-size: 15.5px; color: #e6eef7; line-height: 1.5; font-weight: 550; }
.auth-points ul { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.auth-points li {
  display: flex; align-items: center; gap: 10px;
  font-size: 13.5px; color: #c3d4e6;
}
.auth-points li::before {
  content: ""; width: 18px; height: 18px; flex-shrink: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .14);
  -webkit-mask: none; mask: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fb4e0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size: 11px; background-position: center; background-repeat: no-repeat;
}
@media (max-width: 700px) { .auth-points { display: none; } }

/* ---- CV Havuzu rötuşları ---- */
.cv-hero {
  border-radius: 16px;
  background:
    radial-gradient(120% 170% at 100% 0%, rgba(56, 132, 199, .5), transparent 46%),
    linear-gradient(120deg, #0d2440, #154a7e 55%, #1c67ad);
  box-shadow: 0 12px 30px -14px rgba(13, 36, 64, .5);
}
.cv-hero h2 { font-size: 22px; letter-spacing: -0.02em; }
.cv-primary-action {
  border-radius: 999px; font-weight: 650;
  transition: transform .15s ease, box-shadow .15s ease;
}
.cv-primary-action:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .4); }
.cv-category-tab { transition: background .15s ease, color .15s ease; }

/* ---- Yönetim Paneli rötuşları ---- */
.admin-user-item {
  border: 1px solid var(--n-200); border-radius: 12px;
  transition: background .12s ease, border-color .12s ease;
}
.admin-user-item:hover { background: var(--n-50); }
.admin-user-item.active { background: var(--accent-soft); border-color: var(--accent); }
/* Gönder butonu satırı kaplamasın (genel .primary width kuralını ezer) */
.thread-form .primary { width: auto; flex-shrink: 0; padding: 10px 26px; border-radius: 999px; }

/* ============================================================
   2026-08-19 müşteri revizeleri
   ============================================================ */

/* Zaman Tüneli kartlarında hover gölge büyümesi kaldırıldı (müşteri isteği) */
.feed-post:hover, .post-composer:hover { box-shadow: var(--shadow-sm); }

/* Hesap menüsü üst gezinmeye taşındı; sağ üst avatar yuvarlağı gizli */
#topbarAvatar, #topbarMenu { display: none !important; }
.topnav-account .topnav-dropdown { left: auto; right: 0; }

/* Mesajlar: sohbet arama kutusu + satırdan sohbet silme */
.thread-search { margin: 0 0 10px; }
.thread-item { position: relative; }
.thread-del {
  position: absolute; right: 10px; bottom: 8px;
  width: 26px; height: 26px;
  display: none; align-items: center; justify-content: center;
  border-radius: 8px; color: var(--n-400); cursor: pointer;
}
.thread-item:hover .thread-del, .thread-item.active .thread-del { display: inline-flex; }
.thread-del:hover { background: var(--err-bg); color: var(--err-text); }
.thread-del svg { width: 15px; height: 15px; }
@media (max-width: 700px) {
  .thread-del { display: inline-flex; }
}

/* CV Havuzu: dönem + şehir filtreleri */
.cv-pool-filters { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.cv-pool-filters .alumni-search { flex: 1 1 220px; }
.cv-filter-select { flex: 0 1 auto; min-width: 150px; }

/* Paylaşım galerisi: +N kutusu ve lightbox */
.post-gallery a { position: relative; }
.post-gallery a.gallery-hidden { display: none !important; }
.gallery-more {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(11, 31, 56, .55); color: #fff;
  font-size: 26px; font-weight: 700; letter-spacing: .5px;
  pointer-events: none;
}
.saha-lightbox {
  position: fixed; inset: 0; z-index: 130;
  background: rgba(8, 16, 28, .9);
  display: flex; align-items: center; justify-content: center;
}
.saha-lightbox.hidden { display: none; }
.saha-lightbox img {
  max-width: 92vw; max-height: 86vh;
  border-radius: 10px; box-shadow: 0 24px 60px rgba(0, 0, 0, .5);
}
.saha-lightbox button {
  position: absolute; z-index: 1;
  width: 44px; height: 44px; border-radius: 50%;
  border: 0; background: rgba(255, 255, 255, .12); color: #fff;
  font-size: 26px; line-height: 1; cursor: pointer;
}
.saha-lightbox button:hover { background: rgba(255, 255, 255, .26); }
.saha-lightbox .lb-close { top: 18px; right: 18px; }
.saha-lightbox .lb-prev { left: 14px; top: 50%; transform: translateY(-50%); }
.saha-lightbox .lb-next { right: 14px; top: 50%; transform: translateY(-50%); }
.saha-lightbox .lb-count {
  position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
  color: rgba(255, 255, 255, .85); font-size: 13px; letter-spacing: .4px;
}

/* Header öğeleri gövdeyle aynı hizada: içerik 1200px (24px iç boşluklu)
   ortalandığından header yanları da aynı şeride çekilir (LinkedIn düzeni). */
@media (min-width: 701px) {
  .topbar { padding: 0 max(24px, calc((100% - 1152px) / 2)); }
}


/* ---------------------------------------------------------------------------
   REVIZE 2026-08-31 (müşteri turu)
   - dizin kartında unvanın altında kurum satırı
   - yorum silme düğmesi
   - gönderi düzenleme menü öğesi / kalıbı
   --------------------------------------------------------------------------- */
.alumni-simple-card .alumni-headline:has(+ .alumni-company) { margin-bottom: 3px; }
.alumni-simple-card .alumni-company {
  margin: 0 0 14px;
  font-size: 12.4px;
  font-weight: 600;
  color: var(--n-700);
  line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}

.comment-delete {
  margin-left: auto;
  flex: none;
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0;
  border: 0; border-radius: 50%;
  background: transparent;
  color: var(--n-400);
  font-size: 16px; line-height: 1;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.comment-delete:hover { background: var(--err-bg); color: var(--err-text); }

.post-menu-drop .post-menu-edit { color: var(--n-700); }
#postEditModal .post-type-note { margin: 12px 0 16px; }

/* ---------------------------------------------------------------------------
   2026-09-04 müşteri revizeleri
   - akışta yazar adı/fotoğrafı tıklanabilir
   - "Yeni Katılan Mezunlar" tam liste kalıbı
   --------------------------------------------------------------------------- */
[data-open-profile] { cursor: pointer; }
.post-author-info strong[data-open-profile]:hover,
.comment-author-line strong[data-open-profile]:hover { color: var(--accent); text-decoration: underline; }
.post-author-avatar[data-open-profile],
.comment-avatar[data-open-profile] { transition: box-shadow .15s ease; }
.post-author-avatar[data-open-profile]:hover,
.comment-avatar[data-open-profile]:hover { box-shadow: 0 0 0 2px var(--accent); }

.rail-card h3 .rail-more {
  margin-left: auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
}
.rail-card h3 .rail-more:hover { text-decoration: underline; }

.newmembers-panel { width: min(560px, 100%); }
.newmembers-panel h2 { margin-bottom: 6px; }
.newmembers-panel .modal-description { margin-bottom: 14px; }
.newmembers-search { width: 100%; margin-bottom: 12px; }
.newmembers-list { display: flex; flex-direction: column; max-height: 52vh; overflow-y: auto; }
.newmembers-item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 10px 8px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.newmembers-item + .newmembers-item { border-top: 1px solid var(--n-100, #eef1f5); border-radius: 0; }
.newmembers-item:hover { background: var(--n-50); }
.newmembers-avatar {
  flex: none;
  width: 42px; height: 42px;
  border-radius: 50%;
  object-fit: cover;
}
.newmembers-initials {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--accent); color: #fff;
  font-size: 14px; font-weight: 650;
}
.newmembers-text { display: flex; flex-direction: column; min-width: 0; }
.newmembers-text strong { font-size: 14px; font-weight: 650; }
.newmembers-text small {
  font-size: 12.4px; color: var(--n-500);
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.newmembers-term {
  margin-left: auto;
  flex: none;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--n-50);
  color: var(--n-500);
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}

.newmembers-mobile { display: none; }
@media (max-width: 1250px) {
  .newmembers-mobile { display: block; margin-bottom: 16px; }
  .newmembers-mobile .rail-card { padding: 18px; }
}
/* Dar ekranda dönem rozeti alt satıra insin; ad/unvan kısalmasın. */
@media (max-width: 560px) {
  .newmembers-item { flex-wrap: wrap; }
  .newmembers-term { margin-left: 54px; margin-top: 2px; }
  .newmembers-panel { padding: 24px 18px; }
  .newmembers-list { max-height: 60vh; }
}