.general-modern-page {
  --gr-canvas: #e9edf2;
  --gr-card: #f8f9fb;
  --gr-border: #d9dee7;
  --gr-text: #172033;
  --gr-muted: #6e798d;
  --gr-accent: #ee5519;
  color: var(--gr-text);
  background: var(--gr-canvas);
  font-family: "Outfit", Arial, sans-serif;
}
.general-modern-page .general-modern-breadcrumb {
  padding: 58px 0 48px;
  background: radial-gradient(circle at 18% 20%,rgba(238,85,25,.13),transparent 28%),linear-gradient(135deg,#eef1f5,#e6eaf0 58%,#f3e8e1) !important;
  border-bottom: 1px solid #d7dce4;
}
.general-modern-page .general-modern-breadcrumb::before { display: none; }
.general-modern-page .general-modern-breadcrumb h2 { color: #182033; font: 800 clamp(28px,4vw,40px)/1.1 "Outfit",Arial,sans-serif; letter-spacing: -.8px; text-shadow: none; }
.general-modern-page .general-modern-breadcrumb h2 span { color: var(--gr-accent); }
.general-modern-page .general-modern-breadcrumb .breadcrumb { justify-content: center; margin: 0; }
.general-modern-page .general-modern-breadcrumb .breadcrumb-item a { color: #667085; }
.general-modern-surface { min-height: 700px; padding: 38px 0 76px; background: var(--gr-canvas); }
.gr-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; padding:22px 24px; color:#fff; background:linear-gradient(120deg,#202938,#2d3748); border:1px solid #303b4d; border-radius:18px; box-shadow:0 12px 28px rgba(33,43,59,.14); }
.gr-intro h1 { margin:0 0 5px; color:#fff; font-size:clamp(21px,3vw,29px); font-weight:800; letter-spacing:-.4px; }
.gr-intro p { margin:0; color:#bdc6d4; font-size:13px; }
.gr-intro__badge { display:inline-flex; align-items:center; gap:8px; padding:9px 12px; color:#ffd4c1; background:rgba(238,85,25,.14); border:1px solid rgba(255,150,105,.28); border-radius:999px; font-size:11px; font-weight:800; white-space:nowrap; }
.gr-podium { margin-bottom: 20px; padding: 22px; overflow: hidden; background: linear-gradient(145deg,#202938,#171e29); border: 1px solid #303a49; border-radius: 18px; box-shadow: 0 12px 28px rgba(33,43,59,.14); }
.gr-podium__heading { margin-bottom: 18px; text-align: center; }
.gr-podium__heading span { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 4px; color: #ffb28e; font-size: 9px; font-weight: 800; letter-spacing: 1.6px; }
.gr-podium__heading h2 { margin: 0; color: #fff; font-size: clamp(17px,2.5vw,23px); font-weight: 800; }
.gr-podium__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; align-items: end; }
.gr-podium-card { position: relative; min-width: 0; padding: 8px 12px 16px; overflow: hidden; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.09); border-radius: 16px; text-align: center; }
.gr-podium-card--1 { order: 2; padding-top: 0; background: linear-gradient(180deg,rgba(218,157,28,.15),rgba(255,255,255,.055)); border-color: rgba(235,185,69,.29); }
.gr-podium-card--2 { order: 1; }
.gr-podium-card--3 { order: 3; }
.gr-podium-medal { width: 190px; height: 170px; max-width: 100%; margin: 0 auto -4px; background-image: url('https://i.hizliresim.com/emfzk7q.png'); background-repeat: no-repeat; background-size: 600px 400px; -webkit-mask-image: radial-gradient(ellipse 78% 76% at center,#000 64%,transparent 100%); mask-image: radial-gradient(ellipse 78% 76% at center,#000 64%,transparent 100%); }
.gr-podium-medal--1 { width: 205px; height: 220px; background-position: -198px -2px; }
.gr-podium-medal--2 { background-position: -68px -217px; }
.gr-podium-medal--3 { background-position: -363px -217px; }
.gr-podium-card__body { position: relative; z-index: 1; }
.gr-podium-card__rank { display: block; margin-bottom: 5px; color: #d6dce6; font-size: 9px; font-weight: 800; letter-spacing: 1.2px; }
.gr-podium-card--1 .gr-podium-card__rank { color: #f2ca63; }
.gr-podium-card__body > a { display: block; overflow: hidden; color: #fff; font-size: 17px; font-weight: 800; line-height: 1.25; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.gr-podium-card__body > a:hover { color: #ff9a6c; }
.gr-podium-card__meta { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 24px; margin: 6px 0; }
.gr-podium-card__meta span { padding: 3px 7px; border-radius: 999px; font-size: 9px; font-weight: 800; }
.gr-podium-card__meta .is-karus { color: #ffc0a0; background: rgba(238,85,25,.14); border: 1px solid rgba(238,85,25,.25); }
.gr-podium-card__meta .is-elmorad { color: #afd0ff; background: rgba(59,130,246,.14); border: 1px solid rgba(59,130,246,.25); }
.gr-podium-card__meta img { width: 23px; height: 23px; object-fit: cover; border: 1px solid rgba(255,255,255,.16); border-radius: 6px; }
.gr-podium-card__body strong { display: block; color: #f5c453; font-size: 15px; font-weight: 800; }
.gr-podium-card__body strong small { color: #aeb8c7; font-size: 9px; }
.gr-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:20px; align-items:start; }
.gr-card { overflow:hidden; background:var(--gr-card); border:1px solid var(--gr-border); border-radius:16px; box-shadow:0 10px 26px rgba(38,48,68,.07); }
.gr-card__head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:17px 19px; background:linear-gradient(90deg,#eee7e3,#f5f6f8 78%); border-bottom:1px solid var(--gr-border); }
.gr-card__head h2 { margin:0; color:#202939; font-size:14px; font-weight:800; letter-spacing:.7px; }
.gr-card__head span { color:#7a8596; font-size:11px; }
.gr-table-wrap { overflow:auto; }
.gr-table { width:100%; min-width:720px; margin:0; border-collapse:collapse; }
.gr-table th { padding:12px 14px; color:#778195; background:#eef1f4; border-bottom:1px solid #dce1e8; font-size:10px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; text-align:left; }
.gr-table td { padding:11px 14px; color:#465166; border-bottom:1px solid #e5e8ed; font-size:12px; vertical-align:middle; }
.gr-table tbody tr:last-child td { border-bottom:0; }
.gr-table tbody tr:hover td { background:#fff5ef; }
.gr-rank { display:inline-grid; place-items:center; width:30px; height:30px; color:#596579; background:#e9edf2; border:1px solid #d7dce4; border-radius:9px; font-weight:800; }
.gr-rank--1 { color:#8a6400; background:#fff4c7; border-color:#efd470; }
.gr-rank--2 { color:#596579; background:#edf0f4; border-color:#cbd1da; }
.gr-rank--3 { color:#9a5424; background:#fff0e5; border-color:#edc09f; }
.gr-player { display:flex; align-items:center; gap:9px; color:#1f2937 !important; font-weight:800; text-decoration:none !important; }
.gr-player:hover { color:var(--gr-accent) !important; }
.gr-player__icons { display:flex; gap:3px; }
.gr-player__icons img { width:24px; height:24px; object-fit:cover; border:1px solid #d7dce4; border-radius:6px; }
.gr-clan a { color:#3d66a3; font-weight:700; }
.gr-np { color:#263044; font-weight:800; white-space:nowrap; }
.gr-np--monthly { color:#c64a18; }
.gr-side { position:sticky; top:20px; display:flex; flex-direction:column; gap:14px; }
.gr-search { position:relative; padding:14px; }
.gr-search i { position:absolute; left:28px; top:50%; color:#98a1af; transform:translateY(-50%); }
.gr-search input { width:100%; height:44px; padding:0 14px 0 40px; color:#263044; background:#eef1f4; border:1px solid #d9dee6; border-radius:11px; outline:none; }
.gr-search input:focus { background:#fff; border-color:#ee8c61; box-shadow:0 0 0 3px rgba(238,85,25,.1); }
.gr-filter { padding:10px; }
.gr-filter a { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:39px; padding:8px 10px; color:#596579; border-radius:9px; font-size:11px; font-weight:700; text-decoration:none; }
.gr-filter a::after { color:#a5adba; content:"\203A"; font-size:18px; }
.gr-filter a:hover,.gr-filter a.is-active { color:#c94714; background:#fff0e9; }
.gr-empty { display:none; padding:40px 20px; color:#778195; text-align:center; }
@media(max-width:991px){.gr-layout{grid-template-columns:1fr}.gr-side{position:static;display:grid;grid-template-columns:1fr 1fr}.gr-intro{align-items:flex-start;flex-direction:column}.gr-podium-medal{transform:scale(.9);transform-origin:center bottom}}
@media(max-width:700px){.gr-podium__grid{grid-template-columns:1fr}.gr-podium-card--1,.gr-podium-card--2,.gr-podium-card--3{order:initial}.gr-podium-card{display:grid;grid-template-columns:145px minmax(0,1fr);align-items:center;padding:10px;text-align:left}.gr-podium-medal,.gr-podium-medal--1{width:145px;height:135px;margin:0;transform:scale(.82);transform-origin:center}.gr-podium-card__meta{justify-content:flex-start}.gr-podium-card__body> a{font-size:16px}}
@media(max-width:620px){.general-modern-surface{padding-top:26px}.gr-side{display:flex}.gr-intro{padding:18px}.gr-podium{padding:16px 10px}.gr-card__head{align-items:flex-start;flex-direction:column}.general-modern-page .general-modern-breadcrumb{padding:46px 12px 38px}}
@media(max-width:420px){.gr-podium-card{grid-template-columns:112px minmax(0,1fr)}.gr-podium-medal,.gr-podium-medal--1{width:120px;transform:scale(.68);transform-origin:left center}.gr-podium-card__body>a{font-size:14px}}

/* 2026 dark ranking skin: Knight Online siniflari bolumuyle ayni renk dili */
.general-modern-page {
  --gr-canvas: #0d1116;
  --gr-card: #171d24;
  --gr-border: #303946;
  --gr-text: #e6ebf1;
  --gr-muted: #929dab;
  color: var(--gr-text);
  background: #0d1116;
}
.general-modern-page .general-modern-breadcrumb {
  background: radial-gradient(circle at 18% 12%,rgba(138,35,25,.42),transparent 34%),radial-gradient(circle at 82% 0,rgba(191,118,39,.16),transparent 30%),linear-gradient(135deg,#151a20,#0d1116 66%,#171117) !important;
  border-bottom-color: #303946 !important;
}
.general-modern-page .general-modern-breadcrumb h2 { color: #f3f5f7 !important; }
.general-modern-page .general-modern-breadcrumb .breadcrumb-item,
.general-modern-page .general-modern-breadcrumb .breadcrumb-item a { color: #9ea8b5 !important; }
.general-modern-surface {
  background: radial-gradient(circle at 50% 0,rgba(79,92,108,.2),transparent 38%),linear-gradient(180deg,#14191f 0,#0d1116 58%,#10141a 100%) !important;
}
.gr-card { background: #171d24 !important; border-color: #303946 !important; box-shadow: 0 16px 38px rgba(0,0,0,.28) !important; }
.gr-card__head { background: linear-gradient(110deg,#282127,#1c222a 48%,#171d24) !important; border-bottom-color: #303946 !important; }
.gr-card__head h2 { color: #eef2f6 !important; }
.gr-card__head span { color: #929dab !important; }
.gr-table th { color: #aab3bf !important; background: #202730 !important; border-bottom-color: #36404d !important; }
.gr-table td { color: #bdc6d1 !important; background: #171d24 !important; border-bottom-color: #29323d !important; }
.gr-table tbody tr:hover td { color: #eef2f6 !important; background: #232127 !important; }
.gr-player { color: #e5eaf0 !important; }
.gr-player__icons img { border-color: #3a4552 !important; }
.gr-clan a { color: #91b7e9 !important; }
.gr-np { color: #e0e6ed !important; }
.gr-np--monthly { color: #f29a61 !important; }
.gr-rank { color: #c2cad4 !important; background: #252d37 !important; border-color: #3a4552 !important; }
.gr-rank--1 { color: #f2ce67 !important; background: #3b321b !important; border-color: #75602b !important; }
.gr-rank--2 { color: #d7dde5 !important; background: #2b323b !important; border-color: #4a5562 !important; }
.gr-rank--3 { color: #e8ae83 !important; background: #3a281f !important; border-color: #704b36 !important; }
.gr-search input { color: #e7ebf0 !important; background: #10151b !important; border-color: #343e4a !important; }
.gr-search input::placeholder { color: #778391 !important; }
.gr-search input:focus { background: #131a21 !important; border-color: #be7043 !important; box-shadow: 0 0 0 3px rgba(205,91,39,.16) !important; }
.gr-filter a { color: #abb5c1 !important; }
.gr-filter a::after { color: #697584 !important; }
.gr-filter a:hover,.gr-filter a.is-active { color: #f1a168 !important; background: #292127 !important; }
.gr-empty { color: #929dab !important; }
