/* BestManagerArena – oyun alanı (girişten sonra). site.css değişkenlerini kullanır; mobil öncelikli. */
body.game { background-attachment: fixed; }
.game .loading { padding: 80px 0; }
.game-main { padding-top: 18px; padding-bottom: 36px; outline: none; }
.game-main[aria-busy="true"] { opacity: 0.6; transition: opacity 0.15s; }
:root {
  --g-panel: rgba(9, 36, 15, 0.82);
  --g-panel-2: rgba(20, 64, 30, 0.85);
  --g-line: rgba(255, 255, 255, 0.10);
  --g-head: linear-gradient(90deg, var(--teal-600), #1f6f6b);
  --t-a: #7fe3d3; --t-b: #8fdc6a; --t-c: #e3c46b; --t-d: #f3a35c; --t-e: #ff8f80;
}

/* ---------------------------------------------------------------- üst bar */
.game-header { position: sticky; top: 0; z-index: 60; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3); }
.gh { background: linear-gradient(180deg, #0f3416, #133f1b); border-bottom: 1px solid rgba(227, 196, 107, 0.55); }
.gh-in { max-width: 1280px; margin: 0 auto; height: 64px; padding: 0 12px; display: flex; align-items: center; gap: 10px; }
.gh-team, .gh-manager { display: flex; align-items: center; gap: 10px; text-decoration: none; min-width: 0; color: var(--white); }
.gh-team { flex: 1; }
.gh-team strong, .gh-manager strong { display: block; font-family: var(--font-display); font-size: 1.1rem; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gh-team small, .gh-manager small { display: block; font-size: 0.78rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gh-team > span:last-child, .gh-manager > span { min-width: 0; }
.gh-manager { text-align: right; }
.gh-manager img { width: 46px; height: 46px; border-radius: 50%; border: 3px solid var(--teal-300); background: var(--green-600); flex: none; }
.gh-manager > span { display: none; }
.gh-brand { display: none; align-items: center; gap: 8px; text-decoration: none; font-family: var(--font-display); font-style: italic; font-size: 1.35rem; white-space: nowrap; text-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); }
.gh-brand img { width: 34px; height: auto; }
.crest-box { display: inline-flex; flex: none; filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.35)); }
.crest-box:empty { width: 40px; height: 40px; }
.gn-toggle { display: inline-grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.08); color: var(--white); cursor: pointer; }
.ic { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.ic.big { width: 36px; height: 36px; stroke-width: 1.6; color: var(--teal-300); }
.ic.huge { width: 64px; height: 64px; stroke-width: 1.4; color: var(--teal-300); }

@media (min-width: 640px) { .gh-manager > span { display: block; } }
@media (min-width: 980px) {
  .gh-in { height: 72px; padding: 0 20px; }
  .gh-team { flex: 1 1 0; }
  .gh-manager { flex: 1 1 0; justify-content: flex-end; }
  .gh-brand { display: flex; }
  .gn-toggle { display: none; }
  .gh-team::before, .gh-manager::after { content: none; }
}

/* ---------------------------------------------------------------- ana menü */
.gn { background: #0b2c12; border-bottom: 1px solid rgba(227, 196, 107, 0.45); }
.gn-list { list-style: none; margin: 0; padding: 0; }
.gn-link {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 48px; padding: 8px 16px;
  border: 0; background: none; color: rgba(255, 255, 255, 0.92); cursor: pointer; text-decoration: none;
  font-family: var(--font-display); font-weight: 700; font-size: 1.02rem; text-transform: uppercase; letter-spacing: 0.02em;
}
.gn-link .ic { color: var(--teal-300); }
.gn-link .caret { width: 16px; height: 16px; margin-left: auto; color: var(--muted); transition: transform 0.15s; }
.gn-item.open > .gn-link .caret { transform: rotate(180deg); }
.gn-link:hover, .gn-item.open > .gn-link { background: rgba(255, 255, 255, 0.07); }
.gn-item.active > .gn-link { color: var(--teal-200); box-shadow: inset 3px 0 0 var(--teal-300); }
.gn-link.soon { opacity: 0.65; }
.gn-sub { list-style: none; margin: 0; padding: 4px 0; display: none; background: rgba(255, 255, 255, 0.96); }
.gn-item.open > .gn-sub { display: block; }
.gn-sublink {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 46px; padding: 8px 24px;
  border: 0; background: none; cursor: pointer; text-decoration: none; text-align: left;
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; font-size: 0.98rem; color: #22382a;
}
.gn-sub li + li { border-top: 1px solid #e6ece7; }
.gn-sublink:hover { background: #eef6f1; color: var(--green-800); }
.gn-sublink.soon { color: #7d8a80; }
.gn-sublink em { font-style: normal; font-family: var(--font-body); font-weight: 500; text-transform: none; font-size: 0.72rem; padding: 2px 8px; border-radius: 999px; background: #f7eccb; color: #8a6a12; }
.gn-chips { display: flex; gap: 8px; padding: 10px 16px 14px; }
.chip-stat {
  display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 4px 12px; border-radius: 10px;
  font-family: var(--font-display); font-size: 1rem; color: var(--white);
  background: linear-gradient(180deg, #e9b949, #c98f1b); border: 1px solid #f5d27a; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}
.chip-stat.alt { background: linear-gradient(180deg, var(--teal-500), var(--teal-600)); border-color: var(--teal-300); }
.chip-stat small { font-size: 0.72rem; opacity: 0.85; }
.chip-stat .coin i { background: #fff3c4; }

/* mobil: menü açılır panel */
@media (max-width: 979px) {
  .gn { display: none; max-height: calc(100vh - 64px); overflow-y: auto; }
  .gn.open { display: block; }
  .gn-sub { margin: 0 12px 8px; border-radius: 10px; }
}
/* masaüstü: yatay menü + açılır alt menüler */
@media (min-width: 980px) {
  .gn { display: flex; align-items: center; justify-content: space-between; max-width: none; padding: 0 max(12px, calc((100% - 1280px) / 2 + 12px)); }
  .gn-list { display: flex; flex-wrap: wrap; }
  .gn-item { position: relative; }
  .gn-link { width: auto; min-height: 50px; padding: 8px 14px; font-size: 1rem; }
  .gn-link .caret { display: none; }
  .gn-item.active > .gn-link { box-shadow: inset 0 -3px 0 var(--teal-300); }
  .gn-item.open > .gn-link, .gn-link:hover { background: var(--teal-600); color: var(--white); }
  .gn-sub { position: absolute; top: 100%; left: 0; z-index: 70; min-width: 240px; border-radius: 0 0 10px 10px; box-shadow: 0 14px 28px rgba(0, 0, 0, 0.35); }
  .gn-chips { padding: 0; }
}

/* ---------------------------------------------------------------- ortak bileşenler */
.g-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 4px 0 16px; }
.g-head h1 { margin: 0; font-size: clamp(1.6rem, 5vw, 2.2rem); text-transform: uppercase; text-shadow: 0 2px 8px rgba(0, 0, 0, 0.35); }
.g-sub { margin: 2px 0 0; color: var(--muted); }
.g-label { margin: 0 0 8px; font-size: 1rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--white); text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5); }
.g-panel { background: var(--g-panel); border: 1px solid var(--g-line); border-radius: 14px; padding: 16px; box-shadow: var(--shadow); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.g-panel.flush { padding: 0; overflow: hidden; }
.g-panel + .g-panel, .g-panel + .quick-grid, .quick-grid + .g-panel { margin-top: 14px; }
.g-panel-title { margin: -16px -16px 14px; padding: 10px 16px; font-size: 1rem; text-transform: uppercase; letter-spacing: 0.04em; background: var(--g-head); border-radius: 14px 14px 0 0; }
.g-empty, .muted { color: var(--muted); }
.g-wait { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding: 26px 12px; }
.g-wait strong { font-family: var(--font-display); font-size: 1.5rem; text-transform: uppercase; }
.g-wait p { max-width: 560px; color: var(--muted); }
.scroll-x { overflow-x: auto; }
.btn.sm { min-height: 40px; padding: 6px 14px; font-size: 0.95rem; }
.pager { display: flex; gap: 8px; }

.rating { display: inline-grid; place-items: center; min-width: 38px; height: 30px; padding: 0 6px; border-radius: 8px; font-family: var(--font-display); font-size: 1.12rem; color: #0b2410; }
.rating.sm { min-width: 32px; height: 26px; font-size: 1rem; }
.t-a { --c: var(--t-a); } .t-b { --c: var(--t-b); } .t-c { --c: var(--t-c); } .t-d { --c: var(--t-d); } .t-e { --c: var(--t-e); }
.rating { background: var(--c, #ccc); }
.coin { display: inline-flex; align-items: center; gap: 5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.coin i { width: 14px; height: 14px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff6cf, #e3c46b 60%, #b48a22); box-shadow: inset 0 0 0 1.5px rgba(0, 0, 0, 0.2); flex: none; }
.flag { width: 26px; height: 17px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25); vertical-align: middle; flex: none; }
.flag.lg { width: 36px; height: 24px; }
.inline { display: inline-flex; align-items: center; gap: 8px; }
.tag { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.02em; vertical-align: middle; }
.tag.t-acad { background: rgba(127, 227, 211, 0.18); color: var(--teal-200); border: 1px solid rgba(127, 227, 211, 0.5); }
.tag.u21 { background: rgba(143, 220, 106, 0.16); color: #c4f0ac; border: 1px solid rgba(143, 220, 106, 0.45); }
.tag.skill { background: rgba(227, 196, 107, 0.18); color: var(--gold); border: 1px solid rgba(227, 196, 107, 0.5); }
.kv { margin: 0; display: grid; }
.kv > div { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--g-line); }
.kv > div:last-child { border-bottom: 0; }
.kv dt { color: var(--muted); font-size: 0.92rem; }
.kv dd { margin: 0; font-weight: 500; text-align: right; }
.kv a { color: var(--teal-200); }
.legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 10px 2px 0; font-size: 0.85rem; color: var(--muted); }
.lg { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-left: 6px; }
.lg.promote { background: var(--teal-300); } .lg.relegate { background: var(--t-e); } .lg.me { background: var(--gold); }
.progress-in { display: flex; align-items: center; gap: 10px; width: 100%; max-width: 360px; }
.bar { flex: 1; height: 12px; border-radius: 6px; background: rgba(255, 255, 255, 0.14); overflow: hidden; }
.bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--teal-500), var(--teal-300)); }

/* ---------------------------------------------------------------- ev sahibi */
.home { display: grid; gap: 18px; }
@media (min-width: 980px) { .home { grid-template-columns: 1fr 1.15fr; align-items: start; } }
.home-col { min-width: 0; }
.mgr-card { border-radius: 16px; overflow: hidden; box-shadow: var(--shadow); background: linear-gradient(135deg, var(--teal-500), #1d6e6a 55%, #155550); border: 1px solid rgba(127, 227, 211, 0.4); }
.mgr-top { display: flex; align-items: center; gap: 16px; padding: 20px; }
.mgr-avatar { width: 92px; height: 92px; border-radius: 50%; border: 4px solid var(--white); background: var(--green-600); box-shadow: 0 0 24px rgba(255, 255, 255, 0.35); flex: none; }
.mgr-name { display: block; font-family: var(--font-display); font-size: 1.8rem; line-height: 1.1; word-break: break-word; }
.mgr-since { color: rgba(255, 255, 255, 0.85); font-size: 0.9rem; }
.mgr-team { display: flex; align-items: center; gap: 12px; padding: 12px 20px; text-decoration: none; background: rgba(0, 0, 0, 0.22); }
.mgr-team > span:nth-child(2) { flex: 1; min-width: 0; }
.mgr-team strong { display: block; font-family: var(--font-display); font-size: 1.2rem; }
.mgr-team small { color: rgba(255, 255, 255, 0.8); }
.tile-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 14px; }
@media (min-width: 560px) { .tile-grid { grid-template-columns: repeat(4, 1fr); } }
.tile-stat { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 14px 8px; border-radius: 14px; text-align: center; background: var(--g-panel); border: 1px solid var(--g-line); }
.ts-l { font-family: var(--font-display); text-transform: uppercase; font-size: 0.85rem; color: var(--muted); }
.ts-v { font-family: var(--font-display); font-size: 1.55rem; line-height: 1.2; }
.ts-s { font-size: 0.78rem; color: var(--muted); }
.quick-grid { display: grid; gap: 10px; margin-top: 14px; grid-template-columns: 1fr; }
@media (min-width: 560px) { .quick-grid { grid-template-columns: repeat(2, 1fr); } }
.quick { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 14px; text-decoration: none; background: var(--g-panel); border: 1px solid var(--g-line); transition: transform 0.12s, border-color 0.12s; }
.quick:hover { transform: translateY(-2px); border-color: rgba(127, 227, 211, 0.55); }
.quick strong { display: block; font-family: var(--font-display); text-transform: uppercase; color: var(--gold); font-size: 1.1rem; }
.quick span span { color: var(--muted); font-size: 0.9rem; }
.quick.soon { opacity: 0.7; }
.quick.soon strong { color: var(--muted); }

.match-card { position: relative; border-radius: 16px; overflow: hidden; padding: 44px 14px 18px; box-shadow: var(--shadow);
  background: radial-gradient(ellipse at 50% 120%, rgba(63, 154, 74, 0.55), transparent 60%), linear-gradient(180deg, rgba(12, 46, 18, 0.9), rgba(16, 60, 26, 0.92));
  border: 1px solid var(--g-line); }
.mc-round { position: absolute; top: 0; left: 50%; transform: translateX(-50%); padding: 6px 16px; border-radius: 0 0 10px 10px; background: #0b2c12; border: 1px solid rgba(227, 196, 107, 0.5); border-top: 0; font-family: var(--font-display); text-transform: uppercase; color: var(--gold); white-space: nowrap; }
.mc-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 6px; }
.mc-side { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; min-width: 0; }
.mc-side .crest-box svg { width: clamp(64px, 18vw, 96px); height: auto; }
.mc-team { font-family: var(--font-display); font-size: clamp(1rem, 3.6vw, 1.35rem); text-transform: uppercase; line-height: 1.1; word-break: break-word; }
.mc-side small { color: var(--muted); }
.mc-mid { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; }
.mc-mid small { color: var(--muted); font-size: 0.8rem; }
.mc-count { font-family: var(--font-display); font-size: clamp(1rem, 3.4vw, 1.3rem); }
.mc-vs { font-family: var(--font-display); font-style: italic; font-size: clamp(2.2rem, 9vw, 3.6rem); line-height: 1; color: var(--gold); text-shadow: 0 3px 0 #8a6a12, 0 6px 14px rgba(0, 0, 0, 0.4); }
.mc-wait { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.mc-wait p { max-width: 460px; color: var(--muted); margin: 0; }
.groups { margin-top: 14px; }
.kv-x { display: inline-flex; }
.mini-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.mini-head strong { font-family: var(--font-display); text-transform: uppercase; }
.mini-head a { color: var(--teal-200); font-size: 0.9rem; }
.mini-table { width: 100%; border-collapse: collapse; }
.mini-table td { padding: 7px 6px; border-top: 1px solid var(--g-line); }
.mini-table .pos { width: 30px; font-family: var(--font-display); color: var(--muted); }
.mini-table .tm { display: flex; align-items: center; gap: 8px; font-family: var(--font-display); text-transform: uppercase; }
.mini-table .num { text-align: right; font-family: var(--font-display); }
.mini-table tr.me td { background: rgba(227, 196, 107, 0.14); }
.slot { display: inline-block; width: 22px; height: 26px; border-radius: 6px; border: 1px dashed rgba(255, 255, 255, 0.4); flex: none; }

/* ---------------------------------------------------------------- kadro */
.sq-layout { display: grid; gap: 16px; }
@media (min-width: 1100px) { .sq-layout { grid-template-columns: 1fr 320px; align-items: start; } }
.sq-table, .lg-table { width: 100%; border-collapse: collapse; min-width: 560px; }
.sq-table th, .lg-table th { padding: 10px 8px; font-family: var(--font-display); font-weight: 700; font-size: 0.85rem; text-transform: uppercase; color: var(--muted); text-align: left; white-space: nowrap; }
.sq-table td, .lg-table td { padding: 7px 8px; border-top: 1px solid var(--g-line); white-space: nowrap; }
.c { text-align: center !important; } .r { text-align: right !important; }
.sq-table tr.grp th { background: var(--g-head); color: var(--white); font-size: 0.95rem; letter-spacing: 0.03em; }
.sq-table tr.grp th span { margin-left: 10px; font-family: var(--font-body); font-weight: 400; text-transform: none; font-size: 0.82rem; opacity: 0.85; }
.sq-table tr.row { cursor: pointer; transition: background 0.1s; }
.sq-table tr.row:hover, .sq-table tr.row:focus-visible { background: rgba(127, 227, 211, 0.10); outline: none; }
.sq-table .name strong { font-weight: 500; }
.c-no { width: 44px; }
.kitno { position: relative; display: inline-grid; place-items: center; }
.kitno b { position: absolute; top: 46%; transform: translateY(-50%); font-family: var(--font-display); font-size: 0.78rem; color: var(--white); text-shadow: 0 0 3px #000, 0 0 2px #000; }
.pos { font-family: var(--font-display); }
.alt { display: block; font-size: 0.7rem; color: var(--muted); line-height: 1; }
.sq-team { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.sq-team strong { display: block; font-family: var(--font-display); font-size: 1.3rem; }
.sq-team small { color: var(--muted); }
@media (max-width: 639px) { .hide-s { display: none; } .sq-table, .lg-table { min-width: 0; } }

/* ---------------------------------------------------------------- oyuncu kartı */
.pl-layout { display: grid; gap: 18px; }
@media (min-width: 980px) { .pl-layout { grid-template-columns: 340px 1fr; align-items: start; } }
.pcard {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 18px 18px 16px; overflow: hidden;
  border-radius: 26px 26px 34px 34px; text-align: center; max-width: 360px; width: 100%; margin: 0 auto;
  background: radial-gradient(ellipse at 50% 35%, rgba(127, 227, 211, 0.35), transparent 55%), linear-gradient(180deg, #13502a, #0b2c12 70%);
  border: 4px solid var(--c, var(--teal-300)); box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.85), 0 18px 40px rgba(0, 0, 0, 0.45);
}
.pc-top { display: flex; align-items: center; gap: 8px; width: 100%; }
.pc-pos { margin-left: auto; font-family: var(--font-display); font-size: 1.3rem; }
.pc-name { display: flex; align-items: baseline; gap: 8px; justify-content: center; margin-top: 6px; }
.pc-no { font-family: var(--font-display); font-size: 1.5rem; color: var(--gold); }
.pc-name strong { font-family: var(--font-display); font-size: 1.45rem; line-height: 1.1; }
.pc-age { font-size: 0.85rem; color: var(--muted); }
.pc-mid { display: grid; grid-template-columns: 1fr 1.4fr 1fr; align-items: center; width: 100%; margin-top: 4px; }
.pc-stats { display: grid; gap: 6px; text-align: left; }
.pc-stats.right { text-align: right; }
.pc-stats small { display: block; font-family: var(--font-display); font-size: 0.72rem; color: var(--muted); text-transform: uppercase; line-height: 1; }
.pc-stats b { font-family: var(--font-display); font-size: 1.35rem; line-height: 1.1; }
.pc-sil { width: 100%; max-width: 120px; margin: 0 auto; fill: rgba(5, 20, 9, 0.75); }
.pc-ovr { display: flex; align-items: center; gap: 10px; margin-top: 4px; padding: 6px 18px; border-radius: 12px; background: rgba(0, 0, 0, 0.3); }
.pc-ovr small { font-family: var(--font-display); text-transform: uppercase; color: var(--muted); }
.pc-ovr strong { font-family: var(--font-display); font-size: 2.6rem; line-height: 1; color: var(--c); }
.pc-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; margin-top: 10px; }
.pc-bottom > span { display: flex; flex-direction: column; align-items: center; padding: 8px; border-radius: 10px; background: rgba(255, 255, 255, 0.07); font-family: var(--font-display); font-size: 1.15rem; }
.pc-bottom small { font-size: 0.72rem; color: var(--muted); text-transform: uppercase; }
.pc-skills { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 8px; }
.pc-skills .tag { margin: 0; }
.pl-detail { min-width: 0; }
.pl-two { display: grid; gap: 14px; margin-top: 14px; }
@media (min-width: 760px) { .pl-two { grid-template-columns: 1fr 1fr; } }
.pl-two .g-panel + .g-panel { margin-top: 0; }
.attr-groups { display: grid; gap: 14px 24px; }
@media (min-width: 640px) { .attr-groups { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1240px) { .attr-groups { grid-template-columns: repeat(3, 1fr); } }
.attr-group h3 { margin: 0 0 6px; font-size: 0.95rem; text-transform: uppercase; color: var(--teal-200); }
.attr { display: grid; grid-template-columns: 1fr 70px 28px; align-items: center; gap: 8px; padding: 3px 0; font-size: 0.92rem; }
.al { color: rgba(255, 255, 255, 0.85); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ab { height: 8px; border-radius: 4px; background: rgba(255, 255, 255, 0.12); overflow: hidden; }
.ab i { display: block; height: 100%; background: var(--c); border-radius: 4px; }
.attr b { text-align: right; font-family: var(--font-display); color: var(--c); }
.pitch-map { position: relative; aspect-ratio: 3 / 4; max-width: 300px; margin: 0 auto; border-radius: 12px; overflow: hidden;
  background: linear-gradient(rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0.35)) 50% 50% / 100% 2px no-repeat,
    radial-gradient(circle at 50% 50%, transparent 17%, rgba(255, 255, 255, 0.35) 17.5%, transparent 18.5%),
    repeating-linear-gradient(0deg, #2f7f39 0 26px, #2a7434 26px 52px);
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.4); }
.pm { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%; background: rgba(6, 24, 10, 0.78); border: 2px solid var(--c); line-height: 1; }
.pm b { font-family: var(--font-display); font-size: 1rem; color: var(--c); }
.pm small { font-size: 0.6rem; color: var(--muted); font-family: var(--font-display); }
/* Mevki uyumu: yeşil (en uygun) · açık yeşil (uyumlu) · gri-kırmızı → çok koyu kırmızı (skorsuz) */
.pm.fit-best { background: #1fa54a; border-color: #b8f5c8; } .pm.fit-best b { color: #fff; } .pm.fit-best small { color: #eafff0; }
.pm.fit-good { background: #8fdc8a; border-color: #e3ffe0; } .pm.fit-good b { color: #0b2410; } .pm.fit-good small { color: #17361a; }
.pm.fit-weak { background: #7d6466; border-color: #a88a8c; }
.pm.fit-poor { background: #8e2a2e; border-color: #b4484c; }
.pm.fit-bad { background: #3d0a0d; border-color: #6b1a1f; }
.pm.fit-weak small, .pm.fit-poor small, .pm.fit-bad small { font-size: 0.72rem; color: rgba(255, 255, 255, 0.9); }
.legend .lg.fit-best { background: #1fa54a; } .legend .lg.fit-good { background: #8fdc8a; }
.legend .lg.fit-scale { width: 34px; background: linear-gradient(90deg, #7d6466, #8e2a2e, #3d0a0d); }
.stars { display: inline-flex; gap: 2px; }
.ic.st { width: 16px; height: 16px; stroke-width: 1.5; color: rgba(255, 255, 255, 0.3); }
.ic.st.on { color: var(--gold); fill: var(--gold); }

/* ---------------------------------------------------------------- lig tablosu ve fikstür */
.head-kv { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.head-kv div { padding: 6px 12px; border-radius: 10px; background: var(--g-panel); border: 1px solid var(--g-line); }
.head-kv dt { font-size: 0.72rem; color: var(--muted); text-transform: uppercase; }
.head-kv dd { margin: 0; font-family: var(--font-display); }
.lg-table thead th { background: var(--g-head); color: var(--white); }
.lg-table td.pos span { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; font-family: var(--font-display); background: rgba(255, 255, 255, 0.08); }
.lg-table tr.promote td.pos span { background: var(--teal-300); color: #0b2410; }
.lg-table tr.relegate td.pos span { background: var(--t-e); color: #2a0b07; }
.lg-table .tm { display: flex; align-items: center; gap: 10px; min-width: 200px; }
.tm-name { min-width: 0; }
.tm-name strong { display: block; font-family: var(--font-display); text-transform: uppercase; }
.tm-name small { color: var(--muted); font-size: 0.8rem; }
.lg-table td.pts { font-family: var(--font-display); font-size: 1.15rem; }
.lg-table tr.me td { background: rgba(227, 196, 107, 0.14); }
.lg-table tr.me td:first-child { box-shadow: inset 4px 0 0 var(--gold); }
.lg-table tr.slot-row td { color: rgba(255, 255, 255, 0.45); }
.lg-table tr.slot-row .slot { width: 28px; height: 32px; }
.switch-l { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 10px; background: var(--g-panel); border: 1px solid var(--g-line); cursor: pointer; }
.switch-l input { width: 18px; height: 18px; accent-color: var(--teal-500); }
.rounds { display: grid; gap: 12px; }
@media (min-width: 760px) { .rounds { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1180px) { .rounds { grid-template-columns: repeat(3, 1fr); } }
.round { background: var(--g-panel); border: 1px solid var(--g-line); border-radius: 14px; overflow: hidden; }
.round.past { opacity: 0.7; }
.round header { display: flex; justify-content: space-between; gap: 10px; padding: 8px 14px; background: var(--g-head); font-family: var(--font-display); }
.round header span { font-family: var(--font-body); font-size: 0.85rem; opacity: 0.9; }
.round ul { list-style: none; margin: 0; padding: 4px 0; }
.round li { display: grid; grid-template-columns: 1fr 34px 1fr; align-items: center; gap: 8px; padding: 6px 12px; font-size: 0.9rem; }
.round li.me { background: rgba(227, 196, 107, 0.14); }
.round li:empty { display: none; }
.fx-home, .fx-away { display: flex; align-items: center; gap: 6px; min-width: 0; }
.fx-home { justify-content: flex-end; text-align: right; }
.fx-home span, .fx-away span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fx-score { text-align: center; font-family: var(--font-display); color: var(--muted); }

/* ---------------------------------------------------------------- kulüp ve altyapı */
.club-layout { display: grid; gap: 16px; }
@media (min-width: 900px) { .club-layout { grid-template-columns: 340px 1fr; align-items: start; } }
.club-hero { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.club-name { font-family: var(--font-display); font-size: 1.7rem; text-transform: uppercase; }
.kits { display: flex; gap: 18px; margin-top: 10px; }
.kits figure { margin: 0; text-align: center; }
.kits figcaption { font-size: 0.8rem; color: var(--muted); }
.swatches-row { display: inline-flex; gap: 6px; }
.swatches-row .sw { width: 22px; height: 22px; border-radius: 6px; box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.5); }
.quick-grid.two { margin-top: 14px; }
.academy-box { display: grid; gap: 10px; justify-items: center; }
.academy-box .kv { width: 100%; }
.levels { display: inline-flex; gap: 4px; }
.levels span { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 6px; font-family: var(--font-display); background: rgba(255, 255, 255, 0.08); color: var(--muted); }
.levels span.on { background: var(--teal-500); color: var(--white); }
.plist { list-style: none; margin: 0; padding: 0; }
.plist li + li { border-top: 1px solid var(--g-line); }
.plist a { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 10px; padding: 9px 2px; text-decoration: none; }

/* ---------------------------------------------------------------- düzeltmeler: dar masaüstü, ilerleme çubuğu */
@media (min-width: 980px) {
  .gn-list { flex-wrap: nowrap; }
  .gn-link { white-space: nowrap; }
}
@media (min-width: 980px) and (max-width: 1199px) {
  .gn-link { padding: 8px 9px; font-size: 0.94rem; gap: 6px; }
  .gn-link .ic { width: 18px; height: 18px; }
  .gn-chips { display: none; }
}
.mc-wait .progress, .progress { display: flex; justify-content: center; width: 100%; }
.chip-stat.alt small { margin-right: 2px; }
@media (min-width: 980px) { .gn-sub { min-width: 270px; } .gn-sublink { white-space: nowrap; } }
.lg-table tr.slot-row td.pos span { background: rgba(255, 255, 255, 0.06) !important; color: rgba(255, 255, 255, 0.45) !important; }
@media (max-width: 639px) {
  .sq-table td.name { white-space: normal; }
  .sq-table td, .sq-table th { padding-left: 6px; padding-right: 6px; }
}
@media (max-width: 479px) { .hide-xs { display: none; } }

/* kart içi satırlar (renkler eski koyu cam görünümünde) */
.q-line { display: block; font-size: 0.9rem; line-height: 1.35; color: var(--muted); }
.quick .ic.big { width: 40px; height: 40px; padding: 6px; border-radius: 12px; background: rgba(127, 227, 211, 0.12); box-sizing: content-box; }
:root { --v-gold: linear-gradient(150deg, #f7d877, #c98f1b); --v-teal: linear-gradient(150deg, #3cc2b6, #1b6a66);
  --v-green: linear-gradient(150deg, #5cc469, #236a2d); --v-mint: linear-gradient(150deg, #b6f5ea, #45b8a8); }

/* bekleme kartı: ligin başlamasına kalan süre */
.match-card.waiting { background: radial-gradient(ellipse at 50% 0%, rgba(127, 227, 211, 0.35), transparent 60%),
  radial-gradient(ellipse at 50% 120%, rgba(92, 196, 105, 0.55), transparent 60%), linear-gradient(180deg, #0f3d1a, #145224); }
.mc-label { margin-top: 6px; font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.08em; color: var(--teal-200); }
.mc-start { font-family: var(--font-display); font-size: clamp(2rem, 7vw, 2.8rem); line-height: 1.05; color: var(--gold);
  text-shadow: 0 3px 0 #8a6a12, 0 8px 18px rgba(0, 0, 0, 0.4); }
.progress-in small { font-family: var(--font-display); text-transform: uppercase; font-size: 0.78rem; color: var(--muted); }
.mc-wait .progress { margin-top: 6px; }

/* takım istatistikleri kartı */
.stats-card { margin-top: 14px; }
.stat-list { list-style: none; margin: 0; padding: 0; }
.stat-list li { display: grid; grid-template-columns: 34px 1fr auto auto; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--g-line); }
.stat-list li:last-child { border-bottom: 0; }
.st-ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; }
.st-ic .ic { width: 17px; height: 17px; }
.st-ic.star { background: var(--v-gold); color: #3a2600; } .st-ic.academy { background: var(--v-mint); color: #0b2c22; }
.st-ic.clock { background: var(--v-green); color: #fff; } .st-ic.coin { background: var(--v-gold); color: #3a2600; }
.st-ic.staff { background: var(--v-teal); color: #fff; }
.st-ic.trophy, .st-ic.people, .st-ic.cone { background: rgba(255, 255, 255, 0.1); color: var(--muted); }
.st-l { color: var(--muted); font-size: 0.92rem; }
.stat-list a { color: var(--white); font-weight: 500; text-decoration: none; text-align: right; }
.stat-list a:hover { color: var(--teal-200); text-decoration: underline; }
.st-v { min-width: 64px; text-align: right; font-family: var(--font-display); }
.stat-list li > .muted { text-align: right; font-size: 0.82rem; }
@media (max-width: 479px) { .stat-list li { grid-template-columns: 30px 1fr auto; } .stat-list li > a, .stat-list li > .muted { grid-column: 2; grid-row: 2; text-align: left; } .st-v { grid-row: 1 / span 2; grid-column: 3; } }

/* ligde dolmamış yer: "Bekleniyor…" */
.waiting-slot { display: inline-flex; align-items: center; gap: 10px; color: rgba(255, 255, 255, 0.5); }
.ws-crest { width: 22px; height: 26px; flex: none; border: 1.5px dashed rgba(127, 227, 211, 0.55);
  border-radius: 6px 6px 11px 11px; background: rgba(127, 227, 211, 0.06); }
.lg-table .ws-crest { width: 26px; height: 30px; }
.ws-text { font-style: italic; letter-spacing: 0.02em; }
.ws-text i { font-style: normal; }
.ws-text b { font-weight: 700; animation: ws-dot 1.4s infinite; opacity: 0.2; }
.ws-text b:nth-child(2) { animation-delay: 0.2s; } .ws-text b:nth-child(3) { animation-delay: 0.4s; }
@keyframes ws-dot { 0%, 80%, 100% { opacity: 0.2; } 40% { opacity: 1; } }
.lg-table tr.slot-row td { border-top-style: dashed; }
.lg-table tr.slot-row td.tm { padding-top: 10px; padding-bottom: 10px; }
.mini-table tr.waiting td { color: rgba(255, 255, 255, 0.5); }
.waiting-slot { font-family: var(--font-body); text-transform: none; font-weight: 400; }
.lg-table td.slot-cell { padding-top: 10px; padding-bottom: 10px; }

/* ---------------------------------------------------------------- üst bar: kadro değeri · bütçe (C) · enerji (şimşek) */
.gh-wallet { display: flex; align-items: center; gap: 6px; flex: none; }
.gh-wallet .chip-stat { min-height: 32px; padding: 3px 10px; font-size: 0.98rem; gap: 6px; }
.chip-stat.budget { background: linear-gradient(180deg, #2a5a2f, #1b4220); border-color: rgba(227, 196, 107, 0.7); }
.chip-stat.energy { background: linear-gradient(180deg, #24605c, #174442); border-color: rgba(127, 227, 211, 0.7); }
.chip-stat.loyalty { background: linear-gradient(180deg, #4a3a78, #2f2552); border-color: rgba(200, 180, 255, 0.7); }
.chip-stat.loyalty .ic.award { width: 18px; height: 18px; color: #d9c8ff; stroke-width: 1.8; }
.c-coin { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; flex: none;
  font-family: var(--font-display); font-style: normal; font-size: 0.78rem; line-height: 1; color: #6b4a00;
  background: radial-gradient(circle at 35% 30%, #fff3c4, #f0c64c 55%, #c98f1b); box-shadow: inset 0 0 0 1.5px #a8780f, 0 1px 3px rgba(0, 0, 0, 0.4); }
.ic.bolt { width: 18px; height: 18px; color: #ffe066; fill: #ffd43b; stroke: #c99a00; stroke-width: 1.2; filter: drop-shadow(0 0 4px rgba(255, 212, 59, 0.6)); }
@media (max-width: 420px) { .gh-wallet .chip-stat { padding: 3px 7px; font-size: 0.9rem; gap: 4px; } .gh-team small { display: none; } }

/* Sakat işareti */
.inj { display: inline-grid; place-items: center; width: 18px; height: 18px; margin-right: 6px; border-radius: 4px; flex: none;
  vertical-align: -3px; background: #e5383b; color: #fff; font: 700 15px/1 var(--font-body); box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.85); }
.pc-name .inj { margin-right: 2px; }
.pc-injury { margin-top: 2px; padding: 2px 10px; border-radius: 999px; font-size: 0.8rem; font-weight: 500;
  background: rgba(229, 56, 59, 0.18); color: #ffb3b4; border: 1px solid rgba(229, 56, 59, 0.55); }

/* Kadro listesi: sakat işareti formanın sağ üst köşesinde */
.kitno .inj { position: absolute; top: -5px; right: -7px; width: 15px; height: 15px; margin: 0; font-size: 12px; border-radius: 50%; }
/* Listelerde sakat oyuncunun adı kırmızı */
.injured, .sq-table .name strong.injured, .plist strong.injured { color: #ff6b6e; }

/* Rakip takım kadrosu (#takim/<id>) ve tablolardaki takım bağlantıları */
.tm-link { display: flex; align-items: center; gap: inherit; min-width: 0; color: inherit; text-decoration: none; }
.tm-link:hover strong, .tm-link:hover > span:last-child, .tm-link:focus-visible strong { color: var(--teal-300); text-decoration: underline; }
a.fx-home, a.fx-away { color: inherit; text-decoration: none; }
a.fx-home:hover span, a.fx-away:hover span { color: var(--teal-300); text-decoration: underline; }
.ot-head { display: flex; align-items: center; gap: 14px; }
.ot-head > .g-head { flex: 1; min-width: 0; }
.ot-table { min-width: 0; }

/* Topluluk: Profilim (#profil) */
.pf-head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.pf-avatar { width: 84px; height: 84px; border-radius: 50%; border: 3px solid var(--teal-300); background: rgba(0, 0, 0, 0.25); }
.pf-name { display: block; font-family: var(--font-display); font-size: 1.5rem; line-height: 1.1; word-break: break-word; }
.pf-role { display: inline-block; margin-top: 4px; padding: 2px 10px; border-radius: 999px; font-size: 0.8rem; background: rgba(127, 227, 211, 0.15); color: var(--teal-300); }
.pf-team { display: flex; align-items: center; gap: 12px; padding: 10px 12px; margin-bottom: 8px; border-radius: 12px; text-decoration: none; color: inherit; background: rgba(0, 0, 0, 0.22); }
.pf-team span { display: flex; flex-direction: column; min-width: 0; }
.pf-team strong { font-family: var(--font-display); text-transform: uppercase; }
.pf-team small { color: var(--muted); font-size: 0.8rem; }
.pf-actions { display: flex; justify-content: flex-end; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--g-line); }

/* ---------------------------------------------------------------- teknik ekip kartları (#ekip/...) */
.staff-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; justify-items: center; }
.scard-wrap { width: 100%; max-width: 270px; filter: drop-shadow(0 14px 22px rgba(0, 0, 0, 0.45)); }
.scard { padding: 7px; aspect-ratio: 5 / 7;
  clip-path: polygon(0 5%, 5% 0, 95% 0, 100% 5%, 100% 84%, 50% 100%, 0 84%);
  background: linear-gradient(135deg, #f7fbff 0%, #c4dbf2 22%, #ffffff 38%, #9cc0e6 55%, #eef6ff 72%, #b3d0ee 100%); }
.sc-in { height: 100%; display: flex; flex-direction: column; align-items: center; padding: 12px 14px 0; color: #fff; text-align: center;
  clip-path: polygon(0 5%, 5% 0, 95% 0, 100% 5%, 100% 84%, 50% 100%, 0 84%);
  background: radial-gradient(ellipse at 50% 42%, #2f9be0 0%, #0e4f8f 38%, #08284f 70%, #061a33 100%); }
.sc-top { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; position: relative; margin-top: 6px; }
.sc-top .flag { width: 26px; height: 17px; }
.sc-code { position: absolute; right: 2px; top: 0; font-family: var(--font-display); font-size: 1rem; }
.sc-name { margin-top: 8px; font-family: var(--font-display); font-size: 1.1rem; line-height: 1.1; word-break: break-word; }
.sc-age { font-family: var(--font-display); font-size: 0.75rem; opacity: 0.85; }
.sc-mid { display: grid; grid-template-columns: 1fr 1.2fr 1fr; align-items: center; width: 100%; margin-top: 4px; flex: 1; min-height: 0; }
.sc-stats { display: grid; gap: 4px; text-align: left; }
.sc-stats.right { text-align: right; }
.sc-stats small { display: block; font-family: var(--font-display); font-size: 0.74rem; color: #bfe3ff; line-height: 1.1; white-space: nowrap; }
.sc-stats b { font-family: var(--font-display); font-size: 1.15rem; line-height: 1.1; color: #fff; }
.sc-big small { font-size: 0.72rem; }
.sc-big b { font-size: 2.3rem; line-height: 1; }
.sc-sil { width: 100%; max-width: 90px; margin: 0 auto; fill: rgba(3, 14, 30, 0.85); }
.sc-stars { display: flex; justify-content: center; width: 100%; margin-top: 8px; padding: 6px 0; border-radius: 8px; background: rgba(0, 0, 0, 0.28); }
.sc-stars .stars { gap: 4px; }
.sc-stars .ic.st { width: 26px; height: 26px; stroke-width: 1.4; color: rgba(255, 255, 255, 0.35); filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5)); }
.sc-stars .ic.st.on { color: var(--gold); fill: var(--gold); }
.sc-foot { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-top: 8px; padding-bottom: 18%; }
.sc-role { font-family: var(--font-display); font-size: 0.75rem; text-transform: uppercase; color: #bfe3ff; }
.scard-wrap.locked .scard { background: linear-gradient(135deg, #cfd8e3, #8fa3b8 50%, #c3ced9); }
.scard-wrap.locked .sc-in { justify-content: center; background: radial-gradient(ellipse at 50% 42%, #1f4a6e 0%, #0b2440 60%, #071629 100%); }
.sc-lock { display: flex; flex-direction: column; align-items: center; gap: 6px; padding-bottom: 14%; opacity: 0.85; }
.sc-lock .ic.lock-big { width: 96px; height: 96px; stroke-width: 1.3; color: #bfe3ff; }

/* ---------------------------------------------------------------- scout: Oyuncu Bul (§6.9) */
.find-btn { display: flex; align-items: center; gap: 8px; width: 100%; margin-top: 10px; padding: 10px 12px; border-radius: 12px; cursor: pointer;
  font-family: var(--font-display); font-size: 1rem; text-transform: uppercase; color: #0b2410;
  background: linear-gradient(180deg, #8ff0dc, var(--teal-300)); border: 2px solid rgba(255, 255, 255, 0.7); box-shadow: 0 6px 14px rgba(0, 0, 0, 0.35); }
.find-btn .ic { width: 20px; height: 20px; }
.find-btn .fb-label { flex: 1; text-align: left; }
.find-btn:disabled { cursor: default; color: var(--white); background: linear-gradient(180deg, #2a4a63, #1b3247); border-color: rgba(191, 227, 255, 0.4); }
.fb-energy { display: inline-flex; align-items: center; gap: 2px; padding: 2px 8px; border-radius: 999px; background: rgba(0, 0, 0, 0.35); color: #ffe066; }
.fb-energy .ic.bolt { width: 16px; height: 16px; }
.find-modal { width: min(920px, calc(100vw - 24px)); max-height: calc(100vh - 32px); padding: 0; border: 1px solid var(--g-line); border-radius: 16px;
  color: var(--white); background: linear-gradient(180deg, #123d22, #0a2414); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6); }
.find-modal::backdrop { background: rgba(2, 10, 5, 0.7); }
.fm-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; background: var(--g-head);
  font-family: var(--font-display); text-transform: uppercase; }
.fm-close { width: 34px; height: 34px; border: 0; border-radius: 50%; cursor: pointer; font-size: 1.4rem; line-height: 1; color: var(--white); background: rgba(0, 0, 0, 0.3); }
.fm-body { padding: 16px; overflow: auto; max-height: calc(100vh - 110px); }
.fm-search { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 24px 0; }
.fm-search p { margin: 0; font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.05em; color: var(--teal-300); }
.fm-window { width: min(520px, 100%); overflow: hidden; border-radius: 14px; background: rgba(0, 0, 0, 0.3);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); }
.fm-strip { display: flex; gap: 14px; width: max-content; padding: 14px 0; animation: fm-slide 0.9s linear infinite; }
.fm-face { display: grid; place-items: end center; width: 84px; height: 96px; border-radius: 12px; overflow: hidden; background: radial-gradient(ellipse at 50% 30%, #2f9be0, #0b3d74); }
.fm-face.f1 { background: radial-gradient(ellipse at 50% 30%, #3fbf7f, #0d4a2a); }
.fm-face.f2 { background: radial-gradient(ellipse at 50% 30%, #d7a83a, #5a3c0b); }
.fm-face.f3 { background: radial-gradient(ellipse at 50% 30%, #b55ad6, #3d1252); }
.fm-sil { width: 76px; fill: rgba(3, 14, 30, 0.85); }
@keyframes fm-slide { from { transform: translateX(0); } to { transform: translateX(-392px); } }
@media (prefers-reduced-motion: reduce) { .fm-strip { animation-duration: 4s; } }
.fm-empty { padding: 30px 0; text-align: center; }
.fm-empty p { color: var(--muted); }
.fm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.fm-item { display: flex; flex-direction: column; gap: 8px; }
.fm-item .fm-card { flex: 1; }
.fm-card { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px; border-radius: 14px; cursor: pointer; color: var(--white); text-align: center;
  background: radial-gradient(ellipse at 50% 30%, #2f9be0 0%, #0e4f8f 45%, #08284f 100%); border: 3px solid #c4dbf2; font: inherit; }
.fm-card:hover, .fm-card:focus-visible { border-color: var(--teal-300); outline: none; transform: translateY(-2px); }
.fm-top { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.fm-csil { width: 64px; fill: rgba(3, 14, 30, 0.85); }
.fm-card strong { font-family: var(--font-display); text-transform: uppercase; line-height: 1.1; }
.fm-card small { color: #bfe3ff; font-size: 0.78rem; }
.fm-wage { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); }
.fm-wage small { color: #bfe3ff; font-size: 0.72rem; text-transform: uppercase; }
.fm-inj { padding: 1px 8px; border-radius: 999px; font-size: 0.72rem; background: rgba(229, 56, 59, 0.25); color: #ffb3b4; border: 1px solid rgba(229, 56, 59, 0.6); }
.fm-est { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; width: 100%; margin-top: auto; padding-top: 4px; }
.fm-est > span { display: flex; flex-direction: column; padding: 4px; border-radius: 8px; background: rgba(0, 0, 0, 0.3); }
.fm-est b { font-family: var(--font-display); font-size: 1.05rem; }
.fm-offer { width: 100%; }
.fm-profile { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.fm-ph { display: flex; align-items: center; gap: 12px; }
.fm-psil { width: 72px; height: 80px; padding: 6px; border-radius: 12px; fill: rgba(3, 14, 30, 0.85); background: radial-gradient(ellipse at 50% 30%, #2f9be0, #0b3d74); }
.fm-ph strong { display: block; font-family: var(--font-display); font-size: 1.4rem; text-transform: uppercase; }
.fm-ph small { color: var(--muted); }
.fm-cols { display: grid; gap: 16px; width: 100%; }
@media (min-width: 700px) { .fm-cols { grid-template-columns: 1fr 1fr; } }
.fm-cols h3 { margin: 0 0 6px; font-size: 1rem; text-transform: uppercase; color: var(--teal-300); }
.fm-comments { margin: 10px 0 0; padding-left: 18px; }
.fm-comments li { margin: 4px 0; }