:root {
  /* Бренд Федерации диск-гольфа России: флаговая гамма — синий, красный, белый */
  --bg:         #eef3fb;
  --bg-2:       #f7faff;
  --card:       #ffffff;
  --ink:        #101a33;
  --ink-soft:   #5b6783;
  --ink-faint:  #98a2b8;
  --line:       #e4e9f2;

  --grass:      #1b4dc1;   /* основной — синий (как на гербе) */
  --grass-600:  #163f9e;
  --grass-700:  #102a6b;
  --grass-soft: #dde8fb;
  --coral:      #e3352c;   /* акцент — красный */
  --coral-600:  #c5201b;
  --coral-soft: #fde2e0;
  --sky:        #5aa6e6;
  --sun:        #f2c14e;   /* золото — корона */
  --grass-glow: rgba(27,77,193,.32);
  --coral-glow: rgba(227,53,44,.34);

  --sc-eagle:   #7c5cff;  --sc-eagle-bg:  #ece7ff;
  --sc-birdie:  #1b8f4d;  --sc-birdie-bg: #d8f1e1;
  --sc-par:     #5b6783;  --sc-par-bg:    #eef1f7;
  --sc-bogey:   #f59e0b;  --sc-bogey-bg:  #fcefd5;
  --sc-dbl:     #e3352c;  --sc-dbl-bg:    #fde2e0;

  --r-lg: 22px; --r-md: 16px; --r-sm: 12px;
  --sh-sm: 0 1px 2px rgba(16,26,51,.06), 0 6px 18px rgba(16,26,51,.06);
  --sh-md: 0 10px 34px rgba(16,26,51,.10);
  --sh-lg: 0 24px 60px rgba(16,26,51,.20);
  --ring: 0 0 0 4px rgba(27,77,193,.22);
  --f-hero: 'Oswald', system-ui, sans-serif;
  --f-display: 'Manrope', system-ui, sans-serif;
  --f-body: 'Manrope', system-ui, sans-serif;
}

* { box-sizing: border-box; margin: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--f-body);
  background:
    radial-gradient(1100px 480px at 50% -180px, var(--grass-soft) 0%, transparent 60%),
    var(--bg);
  background-attachment: fixed;
  color: var(--ink);
  line-height: 1.55;
  font-weight: 500;
  min-height: 100vh;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
h1, h2, h3 { font-family: var(--f-display); font-weight: 600; line-height: 1.12; letter-spacing: -.01em; }

/* ---------- Top bar ---------- */
.topbar {
  position: sticky; top: 0; z-index: 40;
  background: rgba(247, 250, 248, .82);
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid var(--line);
  padding-top: env(safe-area-inset-top);
}
.topbar-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; position: relative;
  padding: 12px clamp(16px, 4vw, 28px);
}
.brand { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; font-family: var(--f-display); font-weight: 700; font-size: 1.32rem; letter-spacing: -.02em; }
.brand-mark { display: inline-flex; filter: drop-shadow(0 3px 5px rgba(255,122,92,.3)); }
.topnav { display: flex; flex: 1 1 auto; min-width: 0; gap: 2px; margin-left: 12px; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 24px), transparent); }
.topnav::-webkit-scrollbar { display: none; }
.topnav .navlink {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; flex: 0 0 auto;
  padding: 8px 12px; border-radius: 999px; font-size: .92rem; font-weight: 700;
  color: var(--ink-soft); transition: background .16s, color .16s, transform .1s;
}
.topnav .navlink .nav-emoji { font-size: 1.02rem; }
.topnav .navlink:hover { color: var(--grass-600); background: var(--grass-soft); }
.topnav .navlink.active { color: #fff; background: var(--grass); box-shadow: 0 4px 12px rgba(31,184,102,.35); }
.auth-slot { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; }
.auth-slot .who {
  display: inline-flex; align-items: center; gap: 7px; font-size: .92rem; font-weight: 700; color: var(--ink);
  background: var(--card); padding: 6px 8px 6px 14px; border-radius: 999px; box-shadow: var(--sh-sm);
}
.auth-slot .who .avatar { width: 28px; height: 28px; border-radius: 999px; background: var(--coral); color: #fff; display: grid; place-items: center; font-family: var(--f-display); font-weight: 600; font-size: .9rem; }

/* ---------- Баннер-напоминание «вы сейчас играете» (под шапкой, если открыт раунд) ---------- */
.active-round-banner {
  display: block; text-decoration: none;
  background: linear-gradient(120deg, var(--coral-soft) 0%, var(--bg-2) 75%);
  border-bottom: 1px solid var(--coral-soft);
}
.active-round-banner .arb-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 11px clamp(16px, 4vw, 28px);
  font-size: .92rem;
}
.active-round-banner .arb-text { color: var(--ink); font-weight: 700; }
.active-round-banner .arb-cta { color: var(--coral-600); font-weight: 800; white-space: nowrap; margin-left: auto; }
.active-round-banner:hover .arb-cta { text-decoration: underline; }

/* ---------- Баннер «Начать игру» под шапкой ---------- */
.start-banner {
  position: relative; overflow: hidden;
  background: linear-gradient(120deg, var(--grass-soft) 0%, var(--bg) 55%, var(--bg) 100%);
  border-bottom: 1px solid var(--line);
}
.start-banner-inner {
  position: relative; max-width: 1200px; margin: 0 auto;
  padding: 18px clamp(16px, 4vw, 28px);
  display: flex; align-items: center; justify-content: center;
  min-height: 88px;
}
.start-banner-inner .auth-slot {
  position: absolute; top: 50%; right: clamp(16px, 4vw, 28px); transform: translateY(-50%);
  margin-left: 0; z-index: 2;
}
.start-banner-art {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none;
}
/* Плавные траектории улетающих дисков — едва заметные, не яркие */
.start-banner-art .flight { fill: none; stroke-linecap: round; }
.start-banner-art .flight-1 { stroke: var(--grass); stroke-width: 2; opacity: .14; stroke-dasharray: 1 9; }
.start-banner-art .flight-2 { stroke: var(--sky);   stroke-width: 2; opacity: .14; stroke-dasharray: 1 9; }
.start-banner-art .flight-3 { stroke: var(--sun);   stroke-width: 2; opacity: .16; stroke-dasharray: 1 9; }
.start-banner-art .disc { fill: var(--grass-700); }
.start-banner-art .disc-1a, .start-banner-art .disc-1b, .start-banner-art .disc-1c { fill: var(--grass-600); opacity: .22; }
.start-banner-art .disc-2a, .start-banner-art .disc-2b, .start-banner-art .disc-2c { fill: var(--sky); opacity: .22; }
.start-banner-art .disc-3a, .start-banner-art .disc-3b, .start-banner-art .disc-3c { fill: var(--sun); opacity: .26; }
/* Корзина диск-гольфа, в которую «летят» линии */
.start-banner-art .basket-pole { stroke: var(--ink-soft); stroke-width: 3; opacity: .22; }
.start-banner-art .basket-ring { fill: none; stroke: var(--ink-soft); stroke-width: 3; opacity: .25; }
.start-banner-art .basket-chain { fill: none; stroke: var(--ink-soft); stroke-width: 1.4; opacity: .18; }
.start-banner-art .basket-bowl { fill: var(--grass-soft); stroke: var(--grass-600); stroke-width: 1.5; opacity: .35; }

/* Длинная, спокойная кнопка — без яркого акцента */
.start-banner-btn {
  position: relative; z-index: 1;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  width: min(460px, 100%); text-align: center;
  padding: 15px 28px; border-radius: 999px;
  background: var(--card); color: var(--grass-700);
  border: 1.5px solid var(--grass-soft);
  font-family: var(--f-display); font-weight: 700; font-size: 1.05rem;
  letter-spacing: .04em; text-transform: uppercase;
  box-shadow: var(--sh-sm);
  transition: box-shadow .18s, border-color .18s, transform .12s, color .18s;
}
.start-banner-btn .sbb-ico { font-size: 1.25rem; }
.start-banner-btn:hover { border-color: var(--grass); color: var(--grass-600); box-shadow: var(--sh-md); transform: translateY(-1px); }
.start-banner-btn:active { transform: translateY(1px) scale(.99); }
.start-banner-btns { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; width: min(620px, 100%); }
.start-banner-btns .start-banner-btn { width: auto; flex: 1 1 220px; cursor: pointer; }
.start-banner-btn-ghost { background: transparent; color: var(--coral-600); border-color: var(--coral-soft); }
.start-banner-btn-ghost:hover { border-color: var(--coral); color: var(--coral-600); }
@media (max-width: 860px) {
  .start-banner-inner { flex-direction: column; gap: 10px; min-height: 0; padding: 14px clamp(16px, 4vw, 28px) 16px; }
  .start-banner-inner .auth-slot { position: static; transform: none; }
}
@media (max-width: 640px) {
  /* На мобиле кнопки — компактные, не на всю ширину экрана */
  .start-banner-btn { font-size: .88rem; padding: 11px 20px; letter-spacing: .02em; width: auto; }
  .start-banner-btns { flex-direction: row; flex-wrap: wrap; gap: 8px; justify-content: center; width: 100%; }
  .start-banner-btns .start-banner-btn { flex: 0 1 auto; min-width: 0; }
}

.container { max-width: 1200px; margin: 0 auto; padding: clamp(20px, 4vw, 38px) clamp(16px, 4vw, 28px) 120px; animation: rise .4s ease both; }

.bottomnav { display: none; }
/* Меню «Ещё» скрыто на всех ширинах по умолчанию — внутри @media (max-width: 720px) ниже
   оно превращается в fixed-оверлей (слайд-шит). Без этой базовой строки на десктопе у
   .more-sheet не было вообще никаких стилей, и его содержимое (ссылки) отображалось
   как обычный текст в потоке страницы. */
.more-sheet { display: none; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 22px; border-radius: 999px; font-family: var(--f-body);
  font-weight: 800; font-size: .96rem; letter-spacing: .005em;
  transition: transform .1s, box-shadow .16s, background .16s, filter .16s;
}
.btn:active { transform: translateY(1px) scale(.985); }
.btn-primary { background: var(--grass); color: #fff; box-shadow: 0 6px 16px rgba(31,184,102,.32); }
.btn-primary:hover { background: var(--grass-600); box-shadow: 0 8px 22px rgba(31,184,102,.4); }
.btn-accent { background: var(--coral); color: #fff; box-shadow: 0 6px 16px rgba(255,122,92,.34); }
.btn-accent:hover { background: var(--coral-600); box-shadow: 0 8px 22px rgba(255,122,92,.42); }
.btn-ghost { background: var(--card); color: var(--ink); box-shadow: var(--sh-sm); }
.btn-ghost:hover { color: var(--grass-600); box-shadow: var(--sh-md); }
.btn-sm { padding: 8px 15px; font-size: .88rem; }
.btn-danger { background: var(--sc-dbl-bg); color: var(--sc-dbl); }
.btn-danger:hover { filter: brightness(.97); }
.btn:disabled { opacity: .45; pointer-events: none; box-shadow: none; }

/* ---------- Page header ---------- */
.page-head { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px; margin-bottom: 24px; }
.page-head .titles { margin-right: auto; }
.page-head .eyebrow { font-family: var(--f-body); font-size: .8rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--coral-600); }
.page-head h1 { font-size: clamp(1.9rem, 6vw, 2.8rem); margin-top: 5px; font-weight: 600; }
.page-head p { color: var(--ink-soft); margin-top: 7px; font-weight: 600; }

/* ---------- Cards ---------- */
.grid { display: grid; gap: 16px; }
.grid-cards { grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); }
.card {
  background: var(--card); border-radius: var(--r-lg); padding: 22px;
  box-shadow: var(--sh-sm); transition: transform .16s, box-shadow .16s;
  animation: rise .45s ease both;
}
a.card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.card h3 { font-size: 1.28rem; }
.card .meta { color: var(--ink-soft); font-size: .9rem; margin-top: 7px; display: flex; flex-wrap: wrap; gap: 4px 14px; font-weight: 600; }
.tag {
  display: inline-flex; align-items: center; gap: 5px; padding: 5px 13px; border-radius: 999px;
  font-size: .8rem; font-weight: 800; background: var(--grass-soft); color: var(--grass-600);
}
.tag.live { background: var(--coral-soft); color: var(--coral-600); }
.tag.live::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: var(--coral); animation: pulse 1.6s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(255,122,92,.5);} 70%{box-shadow:0 0 0 7px rgba(255,122,92,0);} 100%{box-shadow:0 0 0 0 rgba(255,122,92,0);} }
@keyframes rise { from { opacity: 0; transform: translateY(10px); } }
@keyframes pop { 0% { transform: scale(.5); } 60% { transform: scale(1.12); } 100% { transform: scale(1); } }

/* ---------- Leaderboard / scorecard ---------- */
.board { background: var(--card); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-sm); }
.board.scroll-x { max-width: 100%; min-width: 0; }
.scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.scorecard { border-collapse: separate; border-spacing: 0; width: 100%; table-layout: fixed; font-variant-numeric: tabular-nums; }
table.scorecard th, table.scorecard td { padding: 7px 5px; text-align: center; font-size: .82rem; white-space: nowrap; }
  @media (max-width: 760px) { table.scorecard th, table.scorecard td { padding: 7px 4px; font-size: .78rem; } }
  @media (min-width: 761px) { table.scorecard th, table.scorecard td { padding: 8px 6px; font-size: .85rem; } }
table.scorecard thead th { background: var(--grass-soft); color: var(--grass-600); font-family: var(--f-display); font-weight: 500; font-size: .75rem; position: sticky; top: 0; overflow: hidden; text-overflow: ellipsis; }
table.scorecard thead .px { max-width: none; overflow: visible; }
table.scorecard tbody td { border-top: 1px solid var(--line); }
table.scorecard .px { text-align: left; position: sticky; left: 0; background: var(--card); z-index: 2; width: 140px; min-width: 120px; max-width: 180px; }
  @media (max-width: 760px) { table.scorecard .px { width: 100px; min-width: 90px; max-width: 130px; font-size: .78rem; } }
  table.scorecard thead .px { background: var(--grass-soft); z-index: 3; }
  table.scorecard tbody .px { background: var(--card); }
table.scorecard thead .px { background: var(--grass-soft); z-index: 3; }
.par-row td { background: var(--bg-2); color: var(--ink-soft); font-size: .78rem; font-weight: 800; border-top: none !important; }
  @media (max-width: 760px) { .par-row td { font-size: .68rem; padding: 4px 3px; } }
.par-row .px { background: var(--bg-2) !important; }
table.scorecard .par-col { color: var(--grass-600); font-weight: 800; background: var(--grass-soft); }
table.scorecard thead .par-col { background: var(--grass-soft); color: var(--grass-700); }
.place { font-family: var(--f-display); font-weight: 600; color: #fff; background: var(--grass); width: 24px; height: 24px; border-radius: 999px; display: inline-grid; place-items: center; font-size: .82rem; margin-right: 9px; vertical-align: middle; }
.place.p1 { background: var(--sun); color: #6a4a00; }
.place.p2 { background: #cdd6d0; color: #3c4942; }
.place.p3 { background: var(--coral); }
.player-name { font-weight: 800; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .88rem; }
.player-sub { font-size: .78rem; color: var(--ink-soft); font-weight: 600; }
.col-total { font-weight: 800; font-family: var(--f-display); }
.diff { font-weight: 800; }
.diff.under { color: var(--sc-birdie); } .diff.over { color: var(--sc-bogey); } .diff.even { color: var(--ink-faint); }

.sc { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; padding: 0 5px; border-radius: 8px; font-weight: 800; font-size: .82rem; font-family: var(--f-display); vertical-align: middle; }
  @media (max-width: 760px) { .sc { min-width: 24px; height: 24px; font-size: .72rem; padding: 0 3px; border-radius: 6px; } }
.sc.eagle  { background: var(--sc-eagle-bg);  color: var(--sc-eagle); }
.sc.birdie { background: var(--sc-birdie-bg); color: var(--sc-birdie); }
.sc.par    { background: var(--sc-par-bg);    color: var(--sc-par); }
.sc.bogey  { background: var(--sc-bogey-bg);  color: var(--sc-bogey); }
.sc.dbl    { background: var(--sc-dbl-bg);    color: var(--sc-dbl); }
.sc.empty  { background: transparent; color: var(--ink-faint); }
.sc-btn { padding: 0; border-radius: 11px; transition: transform .1s; }
.sc-btn:hover { transform: scale(1.08); }
.sc-btn:hover .sc { box-shadow: 0 0 0 2.5px var(--grass); }
.sc-set { animation: pop .26s ease; }
.legend { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--ink-soft); font-size: .84rem; font-weight: 600; margin-top: 12px; }
.legend .sc { min-width: 0; height: auto; padding: 2px 9px; border-radius: 8px; font-size: .8rem; }

/* ---------- Forms ---------- */
.field { margin-bottom: 16px; }
.field label { display: block; font-size: .88rem; font-weight: 800; margin-bottom: 7px; }
.input, select.input, textarea.input {
  width: 100%; padding: 12px 15px; border: 2px solid var(--line); border-radius: var(--r-sm);
  font: inherit; font-weight: 600; background: var(--bg-2); color: var(--ink); transition: border-color .16s, box-shadow .16s, background .16s;
}
.input::placeholder { color: var(--ink-faint); font-weight: 600; }
.input:focus { outline: none; border-color: var(--grass); background: #fff; box-shadow: 0 0 0 4px rgba(31,184,102,.14); }
.row { display: flex; gap: 12px; flex-wrap: wrap; }
.hole-row { display: grid; grid-template-columns: 50px 1fr 1fr auto; gap: 9px; align-items: center; margin-bottom: 9px; }
.hole-row .hnum { font-family: var(--f-display); font-weight: 600; color: #fff; background: var(--grass); border-radius: 999px; height: 34px; display: grid; place-items: center; font-size: .9rem; }
.form-card { background: var(--card); border-radius: var(--r-lg); padding: clamp(20px,4vw,30px); box-shadow: var(--sh-sm); max-width: 580px; }

/* ---------- Modal ---------- */
.modal-bg { position: fixed; inset: 0; background: rgba(24,39,31,.4); backdrop-filter: blur(3px); display: flex; align-items: center; justify-content: center; padding: 16px; z-index: 60; animation: fade .18s; }
@keyframes fade { from { opacity: 0; } }
.modal { background: var(--card); border-radius: var(--r-lg); padding: 28px; width: 100%; max-width: 440px; box-shadow: var(--sh-lg); max-height: 90vh; overflow-y: auto; animation: rise .25s ease both; }
.modal-wide { max-width: 720px; }
.modal-wide .row { flex-wrap: wrap; }
.modal-wide .row > .field { min-width: 220px; }
.modal h2 { font-size: 1.55rem; margin-bottom: 4px; }
.modal .sub { color: var(--ink-soft); font-size: .94rem; margin-bottom: 20px; font-weight: 600; }
.modal-x { float: right; font-size: 1.5rem; color: var(--ink-faint); line-height: 1; width: 34px; height: 34px; border-radius: 999px; }
.modal-x:hover { background: var(--bg); color: var(--ink); }

/* ---------- Number pad ---------- */
.pad { position: fixed; z-index: 70; background: var(--card); border-radius: var(--r-md); box-shadow: var(--sh-lg); padding: 12px; animation: pop .2s ease; }
.pad-grid { display: grid; grid-template-columns: repeat(4, 52px); gap: 7px; }
.pad-grid button { height: 52px; border-radius: 14px; background: var(--bg-2); color: var(--ink); font-family: var(--f-display); font-weight: 600; font-size: 1.15rem; transition: transform .08s, background .14s; }
.pad-grid button:hover { background: var(--grass-soft); color: var(--grass-600); }
.pad-grid button:active { transform: scale(.92); }
.pad-grid button.clear { background: var(--sc-dbl-bg); color: var(--sc-dbl); }

/* ---------- Misc ---------- */
.empty-state { text-align: center; padding: 70px 20px; color: var(--ink-soft); font-weight: 600; }
.empty-state .ico { font-size: 3rem; margin-bottom: 14px; animation: float 3s ease-in-out infinite; }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.empty-state h3 { font-size: 1.3rem; color: var(--ink); margin-bottom: 6px; }
.toast { position: fixed; bottom: calc(22px + env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); background: var(--ink); color: #fff; padding: 13px 22px; border-radius: 999px; font-size: .92rem; font-weight: 700; box-shadow: var(--sh-lg); z-index: 80; animation: toastIn .3s ease; }
.toast.error { background: var(--sc-dbl); }
@keyframes toastIn { from { opacity: 0; transform: translate(-50%, 12px); } }
.spinner { width: 30px; height: 30px; border: 3.5px solid var(--grass-soft); border-top-color: var(--grass); border-radius: 999px; animation: spin .7s linear infinite; margin: 60px auto; }
@keyframes spin { to { transform: rotate(360deg); } }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); gap: 14px; margin-bottom: 24px; }
.stat { background: var(--card); border-radius: var(--r-md); padding: 20px; box-shadow: var(--sh-sm); }
.stat .num { font-family: var(--f-display); font-size: 2rem; font-weight: 600; color: var(--grass-600); }
.stat .lbl { font-size: .84rem; color: var(--ink-soft); margin-top: 2px; font-weight: 700; }
.back-link { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-soft); font-size: .92rem; font-weight: 700; margin-bottom: 16px; }
.back-link:hover { color: var(--grass-600); }
.section-title { font-family: var(--f-display); font-size: 1.3rem; font-weight: 600; margin: 30px 0 14px; }

/* ---------- Responsive: native-app bottom nav ---------- */
@media (max-width: 720px) {
  .topnav { display: none; }
  .brand-text { display: none; }
  .container { padding-bottom: calc(94px + env(safe-area-inset-bottom)); }
  .bottomnav {
    display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 50;
    background: rgba(247,250,248,.9); backdrop-filter: saturate(1.4) blur(16px);
    -webkit-backdrop-filter: saturate(1.4) blur(16px);
    border-top: 1px solid var(--line);
    padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  }
  .bottomnav .navlink {
    flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px;
    padding: 6px 4px; border-radius: var(--r-sm); color: var(--ink-faint);
    font-size: .72rem; font-weight: 800; transition: color .15s, background .15s;
  }
  .bottomnav .navlink.active { color: var(--grass-600); background: var(--grass-soft); }
  .bottomnav .navlink:active { transform: scale(.94); }
  .bottomnav button.navlink { background: none; border: 0; font-family: var(--f-body); cursor: pointer; }

  /* Меню «Ещё» — слайд-шит снизу со ссылками на остальные разделы */
  .more-sheet { display: block; position: fixed; inset: 0; z-index: 60; pointer-events: none; }
  .more-sheet-backdrop { position: absolute; inset: 0; background: rgba(16,26,51,.38); opacity: 0; transition: opacity .18s; }
  .more-sheet-panel {
    position: absolute; left: 0; right: 0; bottom: 0;
    background: var(--card); border-radius: 20px 20px 0 0; box-shadow: var(--sh-md);
    padding: 8px 16px calc(18px + env(safe-area-inset-bottom));
    transform: translateY(100%); transition: transform .22s ease;
  }
  .more-sheet.open { pointer-events: auto; }
  .more-sheet.open .more-sheet-backdrop { opacity: 1; }
  .more-sheet.open .more-sheet-panel { transform: translateY(0); }
  .more-sheet-handle { width: 36px; height: 4px; border-radius: 999px; background: var(--line); margin: 8px auto 12px; }
  .more-sheet-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .more-link {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    padding: 12px 4px; border-radius: var(--r-sm); color: var(--ink);
    font-size: .76rem; font-weight: 800; text-align: center;
  }
  .more-link:active { background: var(--grass-soft); }
  .more-link .mi { font-size: 1.5rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ============ Портал: дополнительные стили ============ */
/* Hero */
.hero { background: linear-gradient(135deg, var(--grass-soft), var(--coral-soft)); border-radius: var(--r-lg); padding: clamp(28px,6vw,56px); margin-bottom: 28px; position: relative; overflow: hidden; }
.hero h1 { font-size: clamp(2rem,6vw,3.4rem); max-width: 16ch; }
.hero p { color: var(--ink-soft); font-weight: 600; font-size: 1.1rem; margin-top: 10px; max-width: 46ch; }
.hero .row { margin-top: 22px; }
.hero-disc { position: absolute; right: -30px; top: -20px; font-size: 9rem; opacity: .18; transform: rotate(-15deg); }
.stat-row { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 24px; }
.stat-row .s { font-family: var(--f-display); }
.stat-row .s b { font-size: 1.7rem; color: var(--grass-600); display: block; }
.stat-row .s span { font-size: .82rem; color: var(--ink-soft); font-weight: 700; }

/* Sections grid on home */
.nav-cards { display: grid; grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); gap: 16px; }
.nav-card { background: var(--card); border-radius: var(--r-lg); padding: 22px; box-shadow: var(--sh-sm); transition: transform .16s, box-shadow .16s; display: block; }
.nav-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.nav-card .ic { font-size: 2rem; }
.nav-card h3 { margin: 10px 0 4px; }
.nav-card p { color: var(--ink-soft); font-size: .9rem; font-weight: 600; }

/* Maps */
/* height + overflow:hidden обрезают карту по контейнеру. На мобильных WebView/iOS Safari
   плитки Leaflet (position via translate3d) при overflow:hidden + border-radius иногда
   «протекают» поверх контента под картой — это известная проблема компоновки слоёв.
   Фикс: переводим .map на собственный композитный слой (translateZ/will-change) и
   изолируем стек контекста, чтобы плитки и контролы Leaflet (z-index до 1000)
   гарантированно обрезались и не перекрывали список трасс под картой. */
.map {
  height: 460px; border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-sm);
  position: relative; z-index: 0; isolation: isolate;
  -webkit-transform: translateZ(0); transform: translateZ(0); will-change: transform;
}

/* Страница «Парки»: высокая карта + прокручиваемый список той же высоты */
.parks-split { align-items: start; }
.parks-split .map { height: 640px; position: sticky; top: 84px; }
.parks-split .parks-list { max-height: 640px; overflow-y: auto; padding-right: 4px; }
@media (max-width: 840px) {
  .parks-split .map { height: 380px; position: static; }
  .parks-split .parks-list { max-height: none; overflow: visible; }
}
.map-sm { height: 300px; border-radius: var(--r-md); overflow: hidden; box-shadow: var(--sh-sm); }
.leaflet-container { font-family: var(--f-body); }
/* Переключатель подложки карты схемы отрезка (спутник/гибрид/схема) — единый для
   Leaflet и Яндекс.Карт, см. MapAPI.baseLayerControl в mapapi.js */
.map-layer-switch {
  position: absolute; top: 10px; right: 10px; z-index: 500;
  background: var(--card); border-radius: var(--r-sm); box-shadow: var(--sh-md);
  display: flex; flex-direction: column; padding: 4px; gap: 2px;
}
.map-layer-switch button {
  display: block; width: 100%; text-align: left; padding: 7px 10px; border-radius: 6px;
  font-size: .82rem; font-weight: 700; color: var(--ink-soft); white-space: nowrap;
}
.map-layer-switch button:hover { background: var(--bg); }
.map-layer-switch button.on { background: var(--grass-soft); color: var(--grass-700); }
.split { display: grid; grid-template-columns: 1.3fr 1fr; gap: 18px; align-items: start; }
@media (max-width: 840px) { .split { grid-template-columns: 1fr; } }

/* Сетка плиток рюкзака — компактные карточки дисков вместо длинного вертикального списка */
.bag-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-top: 8px; }
.bag-card { position: relative; background: var(--card); border-radius: var(--r-md); box-shadow: var(--sh-sm); padding: 12px 12px 14px; text-align: center; transition: transform .14s, box-shadow .14s; }
.bag-card:hover { transform: translateY(-2px); box-shadow: var(--sh-md); }
.bag-card-del { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; border: none; border-radius: 50%; background: var(--bg-2); color: var(--ink-soft); font-size: .8rem; cursor: pointer; line-height: 1; opacity: .55; transition: opacity .14s, background .14s, color .14s; }
.bag-card-del:hover { opacity: 1; background: var(--coral-soft); color: var(--coral-600); }
.bag-card-chart { display: flex; justify-content: center; min-height: 110px; }
.bag-card-chart svg { max-height: 110px; }
.bag-card-name { font-family: var(--f-display); font-weight: 700; font-size: .96rem; margin-top: 6px; line-height: 1.2; }
.bag-card-flight { display: flex; flex-direction: column; gap: 1px; margin-top: 3px; }
.bag-card-numbers { font-weight: 800; font-size: .8rem; letter-spacing: .02em; }
.bag-card-dist { color: var(--ink-soft); font-weight: 700; font-size: .76rem; }
.bag-card-stat { color: var(--grass-600); font-weight: 700; font-size: .72rem; margin-top: 6px; line-height: 1.25; }
.bag-card-stat.muted { color: var(--ink-faint); font-weight: 600; }

/* Filter chips */
.chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.chip { padding: 8px 15px; border-radius: 999px; background: var(--card); box-shadow: var(--sh-sm); font-weight: 700; font-size: .88rem; color: var(--ink-soft); cursor: pointer; transition: all .14s; }
.chip:hover { color: var(--grass-600); }
.chip.on { background: var(--grass); color: #fff; box-shadow: 0 4px 12px rgba(31,184,102,.32); }

/* Event row */
.ev { display: flex; gap: 16px; align-items: center; background: var(--card); border-radius: var(--r-md); padding: 16px 18px; box-shadow: var(--sh-sm); margin-bottom: 12px; transition: transform .14s, box-shadow .14s; }
.ev:hover { transform: translateY(-2px); box-shadow: var(--sh-md); }
.ev .date { text-align: center; font-family: var(--f-display); min-width: 56px; }
.ev .date .d { font-size: 1.5rem; font-weight: 600; color: var(--grass-600); line-height: 1; }
.ev .date .m { font-size: .76rem; color: var(--ink-soft); text-transform: uppercase; font-weight: 700; }
.ev .info { flex: 1; min-width: 0; }
.ev .info h3 { font-size: 1.1rem; }
.ev .info .meta { color: var(--ink-soft); font-size: .86rem; font-weight: 600; margin-top: 2px; }
.badge { padding: 3px 10px; border-radius: 999px; font-size: .74rem; font-weight: 800; }
.badge.open { background: var(--grass-soft); color: var(--grass-600); }
.badge.full { background: var(--sc-dbl-bg); color: var(--sc-dbl); }
.badge.soon { background: var(--sc-bogey-bg); color: var(--sc-bogey); }
.badge.fin { background: var(--bg); color: var(--ink-faint); }
.badge.tier { background: var(--sc-eagle-bg); color: var(--sc-eagle); }
.badge.live { background: var(--coral-soft); color: var(--coral-600); }

/* Disc flight bars */
.disc { background: var(--card); border-radius: var(--r-md); padding: 18px; box-shadow: var(--sh-sm); }
.disc h3 { font-size: 1.1rem; }
.disc .brand { color: var(--ink-soft); font-size: .82rem; font-weight: 700; }
.disc-thumb { width: 56px; height: 56px; border-radius: var(--r-sm); object-fit: cover; flex-shrink: 0; background: var(--bg); }
.disc-thumb-ph { display: flex; align-items: center; justify-content: center; color: var(--ink-faint); }
.flight { display: flex; gap: 8px; margin: 12px 0; }
.flight .fn { flex: 1; text-align: center; background: var(--bg-2); border-radius: 10px; padding: 7px 2px; }
.flight .fn b { font-family: var(--f-display); font-size: 1.15rem; display: block; color: var(--grass-600); }
.flight .fn span { font-size: .66rem; color: var(--ink-soft); font-weight: 700; text-transform: uppercase; }
.disc-type { display: inline-block; padding: 3px 11px; border-radius: 999px; font-size: .74rem; font-weight: 800; background: var(--sky); color: #fff; }

/* Player ranking */
.prow { display: flex; align-items: center; gap: 14px; background: var(--card); border-radius: var(--r-md); padding: 12px 16px; box-shadow: var(--sh-sm); margin-bottom: 10px; transition: transform .14s; }
.prow:hover { transform: translateX(3px); }
.prow .rk { font-family: var(--f-display); font-weight: 600; font-size: 1.2rem; color: var(--ink-faint); min-width: 34px; }
.prow .rk.top { color: var(--sun); }
.prow .pa { width: 42px; height: 42px; border-radius: 999px; display: grid; place-items: center; color: #fff; font-family: var(--f-display); font-weight: 600; font-size: 1.1rem; }
.prow .nm { font-weight: 800; flex: 1; }
.prow .rt { font-family: var(--f-display); font-weight: 600; font-size: 1.3rem; color: var(--grass-600); }
.prow .rt span { font-size: .7rem; color: var(--ink-soft); font-weight: 700; display: block; text-align: right; }

/* Scheme editor toolbar */
.toolbar { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0; }
.hole-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.hole-tab { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 11px; background: var(--card); box-shadow: var(--sh-sm); font-family: var(--f-display); font-weight: 700; font-size: .98rem; line-height: 1; cursor: pointer; border: 1px solid var(--line); transition: background .12s, color .12s, transform .1s; }
.hole-tab:hover { transform: translateY(-1px); }
.hole-tab.on { background: var(--grass); color: #fff; border-color: var(--grass); }
.amenity { display: inline-flex; align-items: center; gap: 5px; font-size: .82rem; font-weight: 600; color: var(--ink-soft); }

/* ============ Справочник городов ============ */
.cities-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(240px,1fr)); gap: 12px; }
.city-card { display: flex; gap: 12px; align-items: center; background: var(--card); border-radius: var(--r-md); padding: 12px 14px; box-shadow: var(--sh-sm); transition: transform .14s, box-shadow .14s; }
.city-card:hover { transform: translateY(-3px); box-shadow: var(--sh-md); }
.city-card .ci-info { min-width: 0; }
.city-card h3 { font-size: 1.02rem; line-height: 1.2; }
.city-card .meta { color: var(--ink-soft); font-size: .8rem; font-weight: 600; }
.coa { position: relative; display: inline-block; vertical-align: middle; flex-shrink: 0; }
.coa .emblem { display: block; width: 100%; height: 100%; filter: drop-shadow(0 2px 4px rgba(0,0,0,.18)); }
.coa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 2px 4px rgba(0,0,0,.18)); background: transparent; }

/* ============ Магазин / оформление / обмен ============ */
.deliv-opt { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: var(--card); border: 2px solid var(--line); border-radius: var(--r-md); padding: 12px 16px; margin-bottom: 10px; cursor: pointer; transition: border-color .14s, background .14s; }
.deliv-opt:hover { border-color: var(--grass); }
.deliv-opt.on { border-color: var(--grass); background: var(--grass-soft); }
.deliv-opt .meta { color: var(--ink-soft); font-size: .82rem; font-weight: 600; }
.radio { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--ink-faint); flex-shrink: 0; position: relative; }
.radio.on { border-color: var(--grass); }
.radio.on::after { content: ''; position: absolute; inset: 3px; border-radius: 50%; background: var(--grass); }
.check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 4px; }
.check { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: .9rem; color: var(--ink); cursor: pointer; background: var(--bg-2); border-radius: 10px; padding: 8px 10px; }
.check input { width: 16px; height: 16px; accent-color: var(--grass); }
@media (max-width: 480px) { .check-grid { grid-template-columns: 1fr; } }

/* ============ Фото товаров/обмена и флайт-блок ============ */
.card-photo { width: 100%; height: 150px; object-fit: cover; border-radius: var(--r-md); margin-bottom: 4px; background: var(--bg-2); }
.prod-photo-wrap { background: var(--bg-2); border-radius: var(--r-lg); min-height: 240px; display: grid; place-items: center; overflow: hidden; box-shadow: var(--sh-sm); }
.prod-photo { width: 100%; height: 100%; max-height: 360px; object-fit: cover; }
.prod-emoji { font-size: 6rem; }
.seg { display: inline-flex; background: var(--bg-2); border-radius: 999px; padding: 4px; gap: 2px; }
.seg-btn { border: none; background: transparent; font-family: var(--f-body); font-weight: 700; font-size: .86rem; color: var(--ink-soft); padding: 7px 14px; border-radius: 999px; cursor: pointer; transition: all .14s; }
.seg-btn.on { background: var(--grass); color: #fff; box-shadow: 0 2px 8px rgba(31,184,102,.3); }

/* ============ Фильтры дисков и сравнение ============ */
.filter-bar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; background: var(--card); border-radius: var(--r-md); padding: 12px 14px; box-shadow: var(--sh-sm); margin-bottom: 16px; }
.filter-bar .chips { gap: 6px; }
.flbl { font-weight: 800; font-size: .82rem; color: var(--ink-soft); align-self: center; }
.flsort { width: auto; padding: 8px 12px; font-size: .86rem; margin-left: auto; }
.cmp-toggle { padding: 7px 10px; }
.cmp-toggle.on { background: var(--grass); color: #fff; box-shadow: 0 3px 10px rgba(31,184,102,.32); }
.cmp-bar { position: fixed; left: 50%; transform: translateX(-50%); bottom: 84px; z-index: 40; display: flex; gap: 16px; align-items: center; background: var(--ink); color: #fff; border-radius: 999px; padding: 10px 16px; box-shadow: var(--sh-lg); }
.cmp-bar .btn-ghost { color: #fff; }
.disabled-link { opacity: .5; pointer-events: none; }
.cmp-table th, .cmp-table td { text-align: center; padding: 10px 12px; }
.cmp-table .px { text-align: left; font-weight: 700; color: var(--ink-soft); }
.cmp-table th a { color: var(--grass-600); }
@media (max-width: 760px) { .cmp-bar { bottom: 76px; } .flsort { margin-left: 0; } }

/* ============ Отзывы о трассе (парк/схема/отрезок) ============ */
.hole-tab { position: relative; }
.rev-dot { position: absolute; top: 3px; right: 4px; width: 7px; height: 7px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 2px var(--card); }
.rev-slider { margin: 10px 0; }
.rev-slider input[type=range] { width: 100%; accent-color: var(--grass); margin-top: 4px; }
.rev-val { font-weight: 800; color: var(--grass-600); min-width: 22px; text-align: right; }
.rev-crit { background: var(--bg-2); border-radius: var(--r-md); padding: 10px 14px; margin: 10px 0; }
.rev-crit .rev-slider { margin: 6px 0; }

/* ============ Профиль и ачивки ============ */
.profile-card { display: flex; gap: 18px; align-items: center; }
.cab-avatar { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-weight: 800; font-family: var(--f-display); flex-shrink: 0; object-fit: cover; box-shadow: var(--sh-sm); }
img.cab-avatar { object-fit: cover; }

/* ---------- Личный кабинет: панели управления ---------- */
.cabinet-layout { display: flex; gap: 24px; align-items: flex-start; }
.cabinet-nav { flex: 0 0 224px; display: flex; flex-direction: column; gap: 3px; position: sticky; top: 84px; }
.cab-tab {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: var(--r-md);
  font-weight: 700; font-size: .92rem; color: var(--ink-soft); transition: background .14s, color .14s;
}
.cab-tab .ico { font-size: 1.1rem; }
.cab-tab .count-badge { margin-left: auto; }
.cab-tab:hover { background: var(--grass-soft); color: var(--grass-600); }
.cab-tab.on { background: linear-gradient(180deg, var(--grass), var(--grass-600)); color: #fff; box-shadow: var(--sh-sm); }
.cab-tab.on .count-badge { background: #fff; color: var(--grass-600); }
.cabinet-content { flex: 1; min-width: 0; }
.dash-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); row-gap: 12px; column-gap: 12px; margin-bottom: 24px; }
.dash-card { display: flex; gap: 12px; align-items: center; min-width: 0; }
.dash-card > div { min-width: 0; }
.dash-card .ico { font-size: 1.7rem; line-height: 1; flex-shrink: 0; }
.dash-card .num { font-family: var(--f-display); font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.dash-card .lbl { font-size: .78rem; color: var(--ink-soft); font-weight: 700; text-transform: uppercase; letter-spacing: .02em; }
.dash-card .sub { font-size: .8rem; color: var(--ink-soft); font-weight: 600; margin-top: 1px; }
@media (max-width: 860px) {
  .cabinet-layout { flex-direction: column; }
  .cabinet-nav {
    flex: 0 0 auto; flex-direction: row; flex-wrap: nowrap; position: static; width: 100%; gap: 6px;
    overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px;
    scrollbar-width: thin; align-items: stretch;
  }
  .cab-tab { flex: 0 0 auto; white-space: nowrap; padding: 9px 12px; font-size: .86rem; }
  .cabinet-content { width: 100%; }
}

.ach-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.ach { background: var(--card); border: 2px solid #cd7f32; border-radius: var(--r-md); padding: 12px 8px; text-align: center; box-shadow: var(--sh-sm); }
.ach-emoji { font-size: 2rem; line-height: 1; }
.ach-t { font-weight: 800; font-size: .86rem; margin-top: 4px; }
.ach-cat { font-size: .72rem; color: var(--ink-soft); font-weight: 700; margin-top: 2px; }
.sw { transition: transform .1s; } .sw:hover { transform: scale(1.15); }

/* ============ Маркетплейс ============ */
.seller-badge { font-size: .78rem; font-weight: 700; color: var(--ink-soft); margin-top: 4px; }
.seller-badge span { color: var(--grass-600); }

/* ============ Глоссарий (подсказки на терминах) ============ */
abbr.gl { text-decoration: underline dotted var(--grass); text-underline-offset: 3px; cursor: help; text-decoration-thickness: 1.5px; }
abbr.gl:hover, abbr.gl:focus { color: var(--grass-600); outline: none; }

/* ============ Live-трансляция раунда ============ */
.live-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #e53935; margin-right: 4px; box-shadow: 0 0 0 0 rgba(229,57,53,.6); animation: livePulse 1.4s infinite; }
@keyframes livePulse { 0% { box-shadow: 0 0 0 0 rgba(229,57,53,.6); } 70% { box-shadow: 0 0 0 7px rgba(229,57,53,0); } 100% { box-shadow: 0 0 0 0 rgba(229,57,53,0); } }
.live-grid { overflow-x: auto; }
.live-grid table { min-width: 520px; }
.scorecard .parrow td { color: var(--ink-faint); font-weight: 700; background: var(--bg-2); }
td.lc { font-weight: 800; text-align: center; }
td.lc.eagle { background: #fde68a; }
td.lc.birdie { background: #bbf7d0; }
td.lc.parsc { background: transparent; }
td.lc.bogey { background: #fecaca; }
td.lc.dbogey { background: #fca5a5; }

/* ============================================================
   МОДЕРН-2026: типографика, глубина, табло, микровзаимодействия
   (надстройка поверх базовых стилей; все классы сохранены)
   ============================================================ */

/* Фон с двумя мягкими световыми пятнами */
body {
  background:
    radial-gradient(900px 440px at 78% -170px, var(--grass-soft) 0%, transparent 56%),
    radial-gradient(640px 360px at 2% 0%, rgba(255,106,77,.06) 0%, transparent 55%),
    var(--bg);
}
::selection { background: var(--grass); color: #fff; }

/* Выразительная типографика */
h1, h2, h3 { font-weight: 800; letter-spacing: -.02em; }
.page-head h1 { font-family: var(--f-hero); font-weight: 800; letter-spacing: -.03em; line-height: 1.04; font-size: clamp(2.1rem, 6vw, 3.1rem); }
.stat .num, .stat-row .s b, .prow .rt, .col-total, .ev .date .d { font-family: var(--f-hero); letter-spacing: -.02em; }
.brand { font-family: var(--f-hero); font-weight: 800; letter-spacing: -.03em; }

/* Топбар чуть прозрачнее и глубже */
.topbar { background: rgba(245,250,247,.78); }
.topnav .navlink.active { background: linear-gradient(180deg, var(--grass), var(--grass-600)); box-shadow: 0 6px 16px var(--grass-glow); }

/* Кнопки: градиент + мягкое свечение + лёгкий подъём */
.btn-primary { background: linear-gradient(180deg, var(--grass), var(--grass-600)); box-shadow: 0 8px 20px var(--grass-glow); }
.btn-primary:hover { filter: brightness(1.05); box-shadow: 0 12px 28px var(--grass-glow); }
.btn-accent { background: linear-gradient(180deg, var(--coral), var(--coral-600)); box-shadow: 0 8px 20px var(--coral-glow); }
.btn-accent:hover { filter: brightness(1.05); box-shadow: 0 12px 28px var(--coral-glow); }
.btn-ghost { border: 1px solid var(--line); }
.btn:not(:disabled):hover { transform: translateY(-1px); }
.chip.on, .seg-btn.on, .cmp-toggle.on { background: linear-gradient(180deg, var(--grass), var(--grass-600)); box-shadow: 0 4px 12px var(--grass-glow); }

/* Чёткие «карточные» поверхности с тонкой обводкой */
.card, .nav-card, .ev, .disc, .prow, .city-card, .stat, .board, .form-card, .filter-bar, .pad { border: 1px solid var(--line); }

/* Герой: насыщенный градиент травы, белый текст, объём */
.hero {
  background: linear-gradient(135deg, var(--grass) 0%, var(--grass-700) 58%, #064a2a 100%);
  color: #fff; box-shadow: var(--sh-md); border: none;
}
.hero::before { content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(620px 320px at 86% -45%, rgba(255,255,255,.20), transparent 70%); }
.hero h1 { font-family: var(--f-hero); font-weight: 800; letter-spacing: -.03em; line-height: 1.02; font-size: clamp(2.3rem, 7vw, 3.9rem); color: #fff; max-width: 18ch; position: relative; }
.hero p { color: rgba(255,255,255,.85); position: relative; }
.hero .row { position: relative; }
.hero .btn-ghost { background: rgba(255,255,255,.16); color: #fff; border-color: rgba(255,255,255,.28); box-shadow: none; backdrop-filter: blur(6px); }
.hero .btn-ghost:hover { background: rgba(255,255,255,.26); color: #fff; }
.hero .stat-row .s b { color: #fff; }
.hero .stat-row .s span { color: rgba(255,255,255,.72); }
.hero-disc { opacity: .16; color: #fff; filter: none; }

/* Фирменный акцент — «линия полёта» перед заголовками разделов */
.section-title { font-weight: 800; display: flex; align-items: center; gap: 11px; }
.section-title::before { content: ''; flex: 0 0 auto; width: 24px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--coral), var(--grass)); }

/* Таблицы-«табло»: тёмный высококонтрастный хедер */
table.scorecard thead th { background: var(--ink); color: #fff; font-family: var(--f-body); font-weight: 700; letter-spacing: .02em; }
table.scorecard thead .px { background: var(--ink); }
.board { border-radius: var(--r-lg); }

/* Бейджи и теги — чуть плотнее и контрастнее */
.badge, .tag, .disc-type { letter-spacing: .01em; }

/* Доступность: видимый фокус с клавиатуры */
a:focus-visible, button:focus-visible, .btn:focus-visible, .chip:focus-visible, .input:focus-visible {
  outline: none; box-shadow: var(--ring);
}

/* Аккуратный скроллбар (десктоп) */
@media (pointer: fine) {
  * { scrollbar-width: thin; scrollbar-color: var(--grass-soft) transparent; }
  ::-webkit-scrollbar { width: 10px; height: 10px; }
  ::-webkit-scrollbar-thumb { background: var(--grass-soft); border-radius: 999px; border: 2px solid var(--bg); }
  ::-webkit-scrollbar-thumb:hover { background: #cfead9; }
}

/* Чуть выразительнее «бенто»-плитки навигации на главной */
.nav-card { transition: transform .18s, box-shadow .18s, border-color .18s; }
.nav-card:hover { border-color: transparent; box-shadow: var(--sh-md); }
.nav-card .ic { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 14px;
  background: var(--grass-soft); }

/* Большая CTA-кнопка (например, «Начать игру» в герое) */
.btn-lg { padding: 15px 30px; font-size: 1.06rem; border-radius: 999px; }
.hero .btn-accent { box-shadow: 0 10px 26px rgba(0,0,0,.18); }

/* ============================================================
   БРЕНД ФЕДЕРАЦИИ ДИСК-ГОЛЬФА: флаговая гамма + спорт-типографика
   ============================================================ */
/* Геральдический герой — глубокий синий с бликом */
.hero { background: linear-gradient(140deg, var(--grass) 0%, var(--grass-600) 52%, #0a1f5c 100%); }
.hero::before { background: radial-gradient(620px 320px at 86% -45%, rgba(255,255,255,.18), transparent 70%); }
/* Спортивная узкая типографика (Oswald) для крупных акцентов */
.hero h1, .section-title, .brand { font-family: var(--f-hero); text-transform: uppercase; }
.hero h1 { letter-spacing: .005em; }
.section-title { letter-spacing: .035em; font-weight: 600; }
.brand { letter-spacing: .02em; font-weight: 600; }
.page-head h1 { font-weight: 600; }   /* Oswald уже задан токеном --f-hero */
/* Девиз Федерации */
.motto { font-family: var(--f-hero); text-transform: uppercase; letter-spacing: .22em; font-weight: 500;
  font-size: .82rem; color: rgba(255,255,255,.85); margin-bottom: 6px; }
/* Эмблема-водяной знак в герое */
.hero-emblem { position: absolute; right: -6px; bottom: -26px; width: 230px; opacity: .14; pointer-events: none; }
.hero-disc { display: none; }   /* заменено на эмблему */

/* Линия полёта у заголовков — цвета флага (красный → синий) */
.section-title::before { background: linear-gradient(90deg, var(--coral), var(--grass)); }

/* ====== ФИКС НАЛОЖЕНИЯ СЛОЁВ ======
   Leaflet создаёт высокие z-index у тайлов/контролов — ограничиваем их
   контекстом наложения карты, а модалки/панели поднимаем выше всего. */
.leaflet-container { position: relative; z-index: 0 !important; }
.modal-bg { z-index: 3000; }
.pad { z-index: 3200; }
.toast { z-index: 3400; }
.cmp-bar { z-index: 2000; }

/* Обложка страницы турнира */
.ev-cover { height: 130px; border-radius: var(--r-lg); margin-bottom: 16px; box-shadow: var(--sh-sm); background: var(--grass-soft); }
/* Админ-скрытие городов */
.city-card { position: relative; }
.city-card.city-hidden { opacity: .5; }
.city-actions { position: absolute; top: 8px; right: 8px; display: flex; gap: 4px; }
.city-actions .city-edit, .city-hide { width: 30px; height: 30px; border-radius: 9px; background: rgba(255,255,255,.92); box-shadow: var(--sh-sm); font-size: .95rem; line-height: 30px; text-align: center; padding: 0; border: 0; cursor: pointer; }
.city-hide { position: absolute; top: 8px; right: 8px; width: 30px; height: 30px; border-radius: 9px; background: rgba(255,255,255,.92); box-shadow: var(--sh-sm); font-size: .95rem; line-height: 30px; text-align: center; }
.city-actions .city-hide { position: static; }
.city-actions .city-edit:hover, .city-hide:hover { background: #fff; }

/* Бейджи счётчиков (модерация) */
.count-badge{display:inline-block;min-width:20px;padding:1px 7px;border-radius:999px;background:var(--coral);color:#fff;font-size:.8rem;font-weight:800;vertical-align:middle;text-align:center}
.nav-badge{display:inline-block;min-width:17px;padding:0 5px;margin-left:5px;border-radius:999px;background:var(--coral);color:#fff;font-size:.66rem;font-weight:800;line-height:16px;text-align:center;vertical-align:middle}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{display:inline-block;padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-size:.82rem;font-weight:700;cursor:pointer;user-select:none;transition:all .12s}
.chip.on{background:var(--grass);color:#fff;border-color:var(--grass)}

/* Бейдж входа/профиля переехал из шапки в баннер «Начать игру» — на десктопе в правый
   верхний угол баннера (рядом с кнопкой места достаточно), на мобильных — отдельной
   строкой под кнопкой (см. .start-banner-inner ниже). */
.auth-slot { flex: 0 0 auto; margin-left: 10px; min-width: 0; }
.auth-slot .who { white-space: nowrap; max-width: 160px; overflow: hidden; text-overflow: ellipsis; }

/* Автоподсказки городов (КЛАДР) */
.ac-sug { position: relative; }
.ac-item { padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: .9rem; font-weight: 600; }
.ac-item:hover { background: var(--grass-soft); color: var(--grass-700); }

/* «Показать ещё» — пагинация длинных списков (диски, игроки и т.п.) */
.pager-more { text-align: center; margin-top: 14px; }
.grid-cards .pager-more { grid-column: 1 / -1; }

/* Распределение результатов по корзинам (стиль DGM) */
.dist-bar { display: flex; height: 16px; border-radius: 6px; overflow: hidden; background: var(--bg-2); box-shadow: inset 0 0 0 1px var(--line); }
.dist-bar.empty { opacity: .4; }
.dist-seg { height: 100%; }
.dist-seg:first-child { border-radius: 6px 0 0 6px; }
.dist-seg:last-child { border-radius: 0 6px 6px 0; }
.dist-legend-row { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 6px; }
.dist-legend { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; font-weight: 700; color: var(--ink-soft); }
.dist-legend .dot { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }

/* ============ События: группировка по неделям + календарь ============ */
.cal-week-label { font-size: .8rem; font-weight: 800; color: var(--ink-faint); text-transform: uppercase; letter-spacing: .04em; margin: 14px 0 6px; }
.cal-head { display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 12px; font-size: 1.1rem; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cal-dow { text-align: center; font-size: .76rem; font-weight: 800; color: var(--ink-faint); padding: 4px 0; text-transform: uppercase; }
.cal-cell {
  min-height: 64px; border-radius: var(--r-sm); background: var(--card); border: 1px solid var(--line);
  padding: 4px 5px; display: flex; flex-direction: column; gap: 2px; cursor: default;
}
.cal-cell.empty { background: transparent; border: none; }
.cal-cell.today { border-color: var(--grass); box-shadow: 0 0 0 2px var(--grass-soft) inset; }
.cal-cell.has-events { cursor: pointer; }
.cal-cell.has-events:hover { background: var(--grass-soft); }
.cal-day-num { font-size: .8rem; font-weight: 800; color: var(--ink-soft); }
.cal-ev { font-size: .9rem; line-height: 1.1; }
.cal-more { font-size: .68rem; font-weight: 800; color: var(--ink-faint); }
@media (max-width: 640px) {
  .cal-cell { min-height: 44px; padding: 3px 4px; }
  .cal-dow { font-size: .64rem; }
}

/* ============ Клуб: баннер + логотип + новости ============ */
.club-banner {
  width: 100%; height: 180px; background-size: cover; background-position: center;
  border-radius: var(--r-lg); margin-bottom: 16px; border: 2px solid var(--line);
}
.club-logo { width: 64px; height: 64px; border-radius: var(--r-md); object-fit: cover; flex: 0 0 64px; border: 2px solid var(--line); }
.news-card h3 { font-size: 1.08rem; }
@media (max-width: 640px) { .club-banner { height: 120px; } .club-logo { width: 48px; height: 48px; flex: 0 0 48px; } }

/* ============ Трансляции: встроенный плеер VK Video ============ */
.video-embed-wrap {
  position: relative; width: 100%; padding-top: 56.25%; /* 16:9 */
  border-radius: var(--r-lg); overflow: hidden; background: #000; margin-bottom: 18px;
  box-shadow: var(--sh-sm);
}
.video-embed-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- Безотвлекающий ввод счёта (#/play/:id) — перенесено из «Счёта» ---------- */
.play-shell { max-width: 640px; margin: 0 auto; padding: 0; min-height: 100dvh; display: flex; flex-direction: column; }
.step-top { display: flex; justify-content: space-between; align-items: center; padding: 10px clamp(10px,4vw,18px) 6px; flex-shrink: 0; }
.step-prog { font-weight: 700; color: var(--ink-soft); font-size: .9rem; }
.step-holehead { display: flex; align-items: center; gap: 10px; justify-content: space-between; background: var(--card); border-bottom: 1px solid var(--line); padding: 10px clamp(10px,4vw,18px); box-shadow: var(--sh-sm); flex-shrink: 0; }
.step-hole-title { text-align: center; flex: 1; }
.step-hole-title h1 { font-size: 1.5rem; margin: 2px 0; font-family: var(--f-hero); }
.step-hole-title p { color: var(--ink-soft); font-weight: 600; font-size: .82rem; }
.step-nav { width: 44px; height: 44px; border-radius: 50%; background: var(--grass-soft); color: var(--grass-700); font-size: 1.5rem; font-weight: 800; flex: none; }
.step-nav:disabled { opacity: .35; }
.hole-desc-tip { padding: 6px clamp(10px,4vw,18px); flex-shrink: 0; background: var(--bg-2); font-size: .82rem; font-weight: 600; color: var(--ink-soft); border-bottom: 1px solid var(--line); margin: 0; }
/* Прокручивается только эта зона — заголовок и кнопки остаются видимы */
.step-players { flex: 1 1 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 10px clamp(10px,4vw,18px); overscroll-behavior: contain; }
.step-player { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md); padding: 10px 12px; margin-bottom: 8px; box-shadow: var(--sh-sm); }
.step-pl-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.step-nums { display: grid; grid-template-columns: repeat(auto-fit, minmax(48px,1fr)); gap: 6px; }
.step-extra { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.step-disc { flex: 1; min-width: 120px; padding: 5px 8px; border-radius: 8px; border: 1px solid var(--line); font-family: inherit; font-weight: 600; background: #fff; font-size: .85rem; }
.step-num { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 0; border-radius: 12px; border: 2px solid var(--line); background: #fff; font-weight: 700; min-height: 48px; }
.step-num b { font-size: 1.2rem; line-height: 1; }
.step-num span { font-size: .65rem; color: var(--ink-faint); font-weight: 700; }
.step-num.birdie b, .step-num.eagle b { color: var(--sc-birdie, var(--grass-600)); }
.step-num.bogey b { color: var(--sc-bogey, var(--coral)); }
.step-num.dbl b { color: var(--sc-dbl, var(--coral-600)); }
.step-num.on { border-color: var(--grass); box-shadow: var(--ring); background: var(--grass-soft); }
.step-other-row { display: flex; align-items: center; gap: 6px; margin-top: 6px; }
.step-other-down, .step-other-up { width: 28px; height: 28px; border-radius: 8px; border: 1px solid var(--line); background: #fff; font-weight: 800; font-size: 1rem; }
.step-other-n { min-width: 24px; text-align: center; font-weight: 800; font-family: var(--f-display); }
.step-other-n.on { color: var(--grass-600); }
.step-other-go { margin-left: auto; }
/* Sticky кнопка внизу — всегда видна, безопасная зона для «домашней» строки iPhone */
.step-foot { display: flex; gap: 8px; padding: 10px clamp(10px,4vw,18px) calc(10px + env(safe-area-inset-bottom)); background: var(--card); border-top: 1px solid var(--line); flex-shrink: 0; }
.step-foot .btn { flex: 1; font-size: .92rem; }
/* Кнопка «готово» подсвечивается когда все игроки заполнены */
@keyframes ready-pulse { 0%,100%{box-shadow:0 0 0 0 rgba(31,184,102,.4)} 50%{box-shadow:0 0 0 6px rgba(31,184,102,0)} }
.ready-pulse { animation: ready-pulse 1.4s ease infinite; background: var(--grass) !important; border-color: var(--grass) !important; }
.disc-tag { display: none; }  /* скрыты — информация о дисках в title при наведении на ячейку */
.pad-hint { font-size: .76rem; color: var(--ink-faint); font-weight: 600; padding: 2px 4px; }
.stat-tog { border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 4px 7px; font-weight: 700; font-size: .76rem; cursor: pointer; }
.stat-tog.on { background: var(--grass); color: #fff; border-color: var(--grass); }
.stat-tog.pen-on { background: var(--coral); color: #fff; border-color: var(--coral); }
.pen-icon { color: var(--coral); font-size: .72rem; margin-left: 2px; }
.pen-dot { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--coral); margin-left: 3px; vertical-align: super; }
.cell-pen .sc { border-bottom: 2px solid var(--coral); padding-bottom: 2px; }
.pad-putts { font-size: .76rem; font-weight: 700; display: inline-flex; align-items: center; gap: 4px; margin-left: auto; }
.pad-putts button { width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--line); background: #fff; font-weight: 800; cursor: pointer; }
.pad-putts b { min-width: 16px; text-align: center; }

/* Режим «Начать счёт» (#/play/:id) — без обычной навигации портала, чтобы ничего не
   отвлекало от ввода бросков. */
body.play-mode .topbar, body.play-mode .bottomnav, body.play-mode .more-sheet, body.play-mode .start-banner { display: none !important; }
body.play-mode #app.container { padding: 0; max-width: none; height: 100dvh; overflow: hidden; }

/* ---------- Выбор трассы (карта + список) — перенесено из «Счёта» для «Быстрого раунда» ---------- */
.cp-list { max-height: 240px; overflow: auto; display: flex; flex-direction: column; gap: 6px; }
.cp-row { padding: 9px 12px; border-radius: var(--r-sm); background: var(--bg-2); cursor: pointer; transition: background .15s; }
.cp-row:hover { background: var(--line); }
.cp-row .meta { margin-top: 2px; }
.cp-selected { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: var(--r-sm); border: 2px solid var(--grass); background: var(--grass-soft); margin-bottom: 8px; }
.cp-selected.cp-row { cursor: default; }

/* ---------- Чипы игроков (Быстрый раунд) — перенесено из «Счёта» ---------- */
.player-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; font-weight: 700; font-size: .85rem; background: var(--grass-soft); color: var(--grass-700); }
.player-chip.guest { background: #fff3d6; color: #9a6b00; }
.player-chip button { background: none; border: none; cursor: pointer; font-weight: 800; color: inherit; opacity: .7; padding: 0 2px; }

/* ---------- Подробный счёт по раунду (read-only на странице события) — перенесено из «Счёта» ---------- */
.place.dnf { background: var(--sc-dbl-bg); color: var(--sc-dbl); width: auto; min-width: 0; padding: 1px 7px; border-radius: 8px; font-size: .62rem; font-weight: 800; letter-spacing: .03em; }
.row-inactive { opacity: .5; }
.div-sep td { background: var(--bg); font-weight: 800; font-size: .78rem; text-transform: uppercase; letter-spacing: .02em; color: var(--ink-soft); padding: 6px 10px; }
.div-sep.dnf-sep td { color: var(--sc-dbl); text-transform: none; font-weight: 700; }
.groups-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); gap: 10px; margin: 6px 0 18px; }
.grp-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md); padding: 10px 12px; box-shadow: var(--sh-sm); }
.grp-head { font-weight: 800; font-size: .82rem; color: var(--grass-700); margin-bottom: 6px; }
.grp-pl { font-weight: 600; font-size: .92rem; padding: 2px 0; border-top: 1px solid var(--line); }
.grp-tag { font-size: .68rem; font-weight: 800; background: var(--grass-soft); color: var(--grass-700); padding: 1px 6px; border-radius: 6px; }
.snake-wrap { display: none; }
.snake-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md); padding: 10px; margin-bottom: 10px; box-shadow: var(--sh-sm); }
.snake-card.row-inactive { opacity: .55; }
.snake-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.snake-head .player-name { font-weight: 800; flex: 1; font-size: .92rem; }
.snake-totals { font-size: .82rem; font-weight: 800; color: var(--ink-soft); white-space: nowrap; }
.snake-half { margin-bottom: 6px; }
.snake-label { display: block; font-size: .68rem; font-weight: 700; color: var(--ink-faint); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 2px; }
table.snake-grid { margin-bottom: 0; width: 100%; }
table.snake-grid th, table.snake-grid td { padding: 5px 3px; font-size: .78rem; text-align: center; }
table.snake-grid .par-row td { font-size: .66rem; color: var(--ink-faint); }
@media (max-width: 720px) {
  .desktop-scorecard { display: none; }
  .snake-wrap { display: block; }
}

/* ---------- Конструктор групп (флайтов) — перенесено из «Счёта» ---------- */
.mg-zone { border: 2px solid var(--line); border-radius: var(--r-md); padding: 10px; margin-bottom: 10px; transition: border-color .15s, background .15s; min-height: 56px; }
.mg-zone.ok { border-color: var(--grass); background: var(--grass-soft); }
.mg-zone.bad { border-color: var(--coral); background: var(--coral-soft); }
.mg-zone-head { font-weight: 800; font-size: .88rem; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.mg-del { margin-left: auto; background: none; border: none; color: var(--ink-faint); font-size: 1rem; cursor: pointer; line-height: 1; padding: 2px 6px; border-radius: 6px; }
.mg-del:hover { background: var(--coral-soft); color: var(--coral-600); }
.mg-chips { display: flex; flex-wrap: wrap; gap: 6px; min-height: 30px; }
.mg-chip { padding: 7px 12px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); font-weight: 700; font-size: .86rem; cursor: pointer; user-select: none; box-shadow: var(--sh-sm); transition: transform .1s, box-shadow .1s; }
.mg-chip:hover { transform: translateY(-1px); box-shadow: var(--sh-md); }
.mg-chip.on { background: var(--grass); color: #fff; border-color: var(--grass); }
.mg-div { opacity: .7; font-size: .78rem; }

/* ---------- Трансляции — карточка турнира (отличается от карточек «Событий»: тёмная
   шапка-статус, крупные цифры, прогресс-бар, акцент на «живых» данных) ---------- */
.bc-card { display: block; background: var(--card); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-sm); transition: transform .15s, box-shadow .15s; text-decoration: none; color: inherit; border: 1px solid var(--line); }
.bc-card:hover { transform: translateY(-2px); box-shadow: var(--sh-md); }
.bc-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 16px; color: #fff; font-weight: 800; font-size: .8rem; letter-spacing: .3px; }
.bc-head.st-live { background: linear-gradient(90deg, #b91c1c, #e53935); }
.bc-head.st-planned { background: linear-gradient(90deg, #1b4dc1, #3b6fe0); }
.bc-head.st-finished { background: linear-gradient(90deg, #555, #777); }
.bc-head .live-dot { background: #fff; box-shadow: 0 0 0 0 rgba(255,255,255,.7); }
.bc-body { padding: 14px 16px; }
.bc-title { font-family: var(--f-hero); font-size: 1.3rem; line-height: 1.2; margin: 0 0 4px; }
.bc-loc { color: var(--ink-soft); font-weight: 600; font-size: .86rem; margin-bottom: 10px; }
.bc-progress-wrap { margin: 10px 0; }
.bc-progress-bar { height: 8px; border-radius: 999px; background: var(--line); overflow: hidden; }
.bc-progress-fill { height: 100%; background: linear-gradient(90deg, var(--grass), var(--grass-600)); border-radius: 999px; transition: width .3s; }
.bc-progress-label { font-size: .74rem; color: var(--ink-faint); font-weight: 700; margin-top: 3px; }
.bc-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(86px,1fr)); gap: 8px; margin: 10px 0; }
.bc-stat { text-align: center; background: var(--bg-2); border-radius: var(--r-sm); padding: 6px 4px; }
.bc-stat b { display: block; font-size: 1.02rem; font-family: var(--f-display); }
.bc-stat span { font-size: .66rem; color: var(--ink-faint); font-weight: 700; }
.bc-leaders { font-size: .84rem; font-weight: 700; margin: 8px 0 0; line-height: 1.5; }
.bc-leaders .grp { color: var(--ink-faint); font-weight: 700; font-size: .72rem; margin-right: 4px; }
.bc-strokebar { display: flex; height: 10px; border-radius: 999px; overflow: hidden; margin-top: 8px; }
.bc-strokebar span { height: 100%; }
.bc-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); font-size: .78rem; color: var(--ink-soft); font-weight: 600; }
.bc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px,1fr)); gap: 16px; }
.bc-home-block { background: linear-gradient(180deg, #fff4f3, #fff); border: 1px solid #ffd9d6; border-radius: var(--r-lg); padding: 16px; margin-bottom: 22px; }
.bc-home-title { display: flex; align-items: center; gap: 8px; font-family: var(--f-hero); font-size: 1.1rem; margin-bottom: 12px; color: #b91c1c; }

/* ---------- Сбор багов (режим «Найдена проблема») ---------- */
.bug-fab { position: fixed; right: 16px; bottom: 84px; z-index: 900; background: #b91c1c; color: #fff; border: none; border-radius: 999px; padding: 11px 18px; font-weight: 800; font-size: .9rem; cursor: pointer; box-shadow: 0 6px 18px rgba(185,28,28,.4); transition: transform .14s, box-shadow .14s; }
.bug-fab:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(185,28,28,.5); }
@media (min-width: 900px) { .bug-fab { bottom: 24px; } }
body.bug-picking, body.bug-picking * { cursor: crosshair !important; }
.bug-hover { outline: 3px solid #ff3b30 !important; outline-offset: 1px; background: rgba(255,59,48,.08) !important; }
.bug-pick-hint { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: #b91c1c; color: #fff; text-align: center; padding: 10px; font-weight: 700; font-size: .9rem; box-shadow: 0 2px 10px rgba(0,0,0,.2); }
.bug-pick-hint button { margin-left: 10px; background: #fff; color: #b91c1c; border: none; border-radius: 6px; padding: 4px 12px; font-weight: 800; cursor: pointer; }
/* Карточки багов в кабинете суперадмина */
.bug-card { background: var(--card); border-radius: var(--r-md); box-shadow: var(--sh-sm); padding: 14px 16px; margin-bottom: 12px; border-left: 4px solid var(--line); }
.bug-card.s-new { border-left-color: #ff3b30; }
.bug-card.s-in_progress { border-left-color: #f59e0b; }
.bug-card.s-resolved { border-left-color: var(--grass); }
.bug-card.s-dismissed { border-left-color: var(--ink-faint); opacity: .6; }
.bug-card .bug-meta { color: var(--ink-soft); font-size: .78rem; font-weight: 600; margin-top: 6px; word-break: break-word; }
.bug-card code { background: var(--bg-2); padding: 1px 5px; border-radius: 4px; font-size: .76rem; }
.bug-status-bar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.hole-desc-tip { background: var(--bg-2); border-radius: var(--r-md); padding: 8px 12px; margin: -4px 0 10px; font-size: .84rem; font-weight: 600; color: var(--ink-soft); text-align: center; }
/* Раскрывающиеся блоки «Участники»/«Результаты» на странице события */
details > summary.section-title { list-style: none; user-select: none; }
details > summary.section-title::marker { display: none; }
details > summary.section-title::-webkit-details-marker { display: none; }
details > summary.section-title::after { content: '▾'; margin-left: auto; font-size: .85em; color: var(--ink-faint); transition: transform .15s; }
details[open] > summary.section-title::after { transform: rotate(180deg); }
.round-tabs-wrap { margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.div-chip { display:inline-flex;align-items:center;gap:5px;background:var(--grass-soft);color:var(--grass-700);border:1px solid var(--grass);border-radius:999px;padding:4px 10px 4px 12px;font-size:.86rem;font-weight:700; }
.div-chip-rm { background:none;border:none;cursor:pointer;color:var(--grass-600);font-size:1rem;line-height:1;padding:0;margin:0;display:flex;align-items:center; }
.div-chip-rm:hover { color:var(--coral-600); }
.div-catalog-grid { display:flex;flex-direction:column;gap:6px; }
.div-catalog-item { display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:8px 12px; }
.div-name { flex:1;font-weight:700;font-size:.96rem;outline:none;border-bottom:1px dashed transparent;transition:border-color .14s; }
.div-name:focus { border-bottom-color:var(--grass); }
.pin-btn { opacity:.4;transition:opacity .14s; }
.pin-btn.pinned, .pin-btn:hover { opacity:1; }
/* Список достижений организатора в конструкторе */
.ach-design-list { display:flex;flex-direction:column;gap:10px;margin-top:10px; }
.ach-design-row { display:flex;align-items:center;gap:12px;background:var(--card);border-radius:var(--r-md);box-shadow:var(--sh-sm);padding:12px 14px; }
/* Заблокированные достижения (цели) */
.ach-grid.locked .ach { opacity:.5;filter:grayscale(.6); }
.ach-grid.locked .ach:hover { opacity:.8;filter:none; }
/* Полный бейдж с датой и счётчиком */
.ach-cond { font-size:.72rem;color:var(--ink-soft);font-weight:600;margin-top:2px; }
.ach-date { font-size:.72rem;margin-top:2px; }
.ach-cnt  { font-size:.72rem;color:var(--grass-600);font-weight:700;margin-top:2px; }
.ach-owned { box-shadow:0 0 0 2px var(--grass) !important; }
/* ---- Страница и список игроков ---- */
.player-filters { display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;margin-bottom:14px; }
.player-filter-check { display:flex;align-items:center;gap:5px;font-weight:700;font-size:.88rem;cursor:pointer;white-space:nowrap;padding:4px 0; }
.prow-dgm { opacity:.65; }
.prow-dgm .nm { color:var(--ink-soft); }
/* Профиль игрока — отдельная страница */
.player-profile-hero { display:flex;gap:20px;align-items:flex-start;margin-bottom:4px;flex-wrap:wrap; }
.player-profile-av { flex-shrink:0; }
.player-profile-info { flex:1;min-width:0; }
.player-profile-name { font-size:1.9rem;font-weight:900;margin:0 0 6px;line-height:1.1; }
.player-profile-meta { display:flex;flex-wrap:wrap;gap:10px;color:var(--ink-soft);font-weight:600;font-size:.9rem; }
.player-profile-bio { max-width:60ch;color:var(--ink-soft);font-weight:600;margin:8px 0 0; }
@media (max-width: 640px) { .player-profile-hero { flex-direction:column; gap:12px; } }
/* Строка игрока в управлении раундом — двухстрочная на мобиле */
.rm-player-row { padding: 8px 0; border-bottom: 1px solid var(--line); }
.rm-player-top { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
.rm-player-name { flex: 1; font-weight: 700; font-size: .95rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rm-player-controls { display: flex; gap: 6px; flex-wrap: wrap; }
.rm-player-controls .input { font-size: .85rem; padding: 6px 8px; }
.input-sm { font-size: .85rem !important; padding: 6px 8px !important; }
/* ── Последовательный ввод счёта ─────────────────────────────────────────── */
/* Состояния карточки игрока */
.step-player-active { border: 2px solid var(--grass) !important; background: var(--grass-soft) !important; }
.step-player-done   { opacity: .8; }
.step-player-wait   { opacity: .45; }
/* Чип «вводит» рядом с именем активного игрока */
.play-active-chip { font-size: .7rem; font-weight: 700; background: var(--grass); color: #fff; padding: 1px 7px; border-radius: 20px; margin-left: 5px; vertical-align: middle; }
/* Бейдж с результатом на лунке в карточке */
.play-hole-badge { display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:20px;font-size:.82rem;font-weight:700;border:1px solid var(--line); }
.play-hole-badge b { font-size:1rem; }
.play-hole-badge span { font-size:.75rem;color:var(--ink-soft); }
.badge-eagle  { background:var(--grass-soft);border-color:var(--grass);color:var(--grass-700); }
.badge-birdie { background:var(--grass-soft);border-color:var(--grass-soft);color:var(--grass-600); }
.badge-par    { background:var(--bg-2); }
.badge-bogey  { background:#fff3ef;border-color:var(--coral-soft);color:var(--coral-600); }
.badge-dbl    { background:#fde8e8;border-color:var(--coral);color:var(--coral-700); }
/* Панель ввода — прилипает над футером */
.play-input-panel { background:var(--card);border-top:1px solid var(--line);padding:10px clamp(10px,4vw,18px) 6px;flex-shrink:0; }
.play-input-for { font-size:.82rem;color:var(--ink-soft);font-weight:700;margin-bottom:8px; }
.play-input-for b { color:var(--ink); }
.play-stepper-row { display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap; }

/* ═══════════════════════════════════════════════════════════════
   СТРАНИЦА СОБЫТИЯ — переработанный layout (v96)
   ═══════════════════════════════════════════════════════════════ */

/* Шапка события */
.ev-header { margin-bottom: 4px; }
.ev-header-eyebrow { font-size: .78rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-soft); margin-bottom: 4px; }
.ev-header-title { font-family: var(--f-hero); font-size: clamp(1.6rem, 6vw, 2.2rem);
  font-weight: 900; line-height: 1.1; margin: 0 0 6px; }
.ev-header-meta { font-size: .88rem; font-weight: 600; color: var(--ink-soft);
  margin: 0 0 10px; line-height: 1.5; }

/* Панель действий организатора — горизонтальная лента chip-кнопок */
.ev-admin-bar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.ev-ab-share, .ev-ab-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 12px; border-radius: 999px;
  font-size: .82rem; font-weight: 700; line-height: 1;
  border: 1.5px solid var(--line); background: var(--card);
  color: var(--ink); cursor: pointer; white-space: nowrap;
  transition: background .12s, border-color .12s;
}
.ev-ab-share { border-color: var(--ink-faint); color: var(--ink-soft); }
.ev-ab-share:hover { border-color: var(--ink); color: var(--ink); }
.ev-ab-btn:hover { background: var(--bg-2); }
.ev-ab-btn--reg { border-color: var(--grass); color: var(--grass-700); }
.ev-ab-btn--reg:hover { background: var(--grass-soft); }
.ev-ab-btn--danger { border-color: var(--coral-soft); color: var(--coral-600); }
.ev-ab-btn--danger:hover { background: #fff5f3; border-color: var(--coral); }

/* Карточка «Готовы вести счёт?» */
.ev-scoring-card {
  border: 1.5px solid var(--coral-soft); border-radius: var(--r-lg);
  background: var(--card); padding: 12px 14px;
  margin-bottom: 12px;
}
.ev-scoring-body { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ev-scoring-icon { font-size: 1.5rem; flex-shrink: 0; }
.ev-scoring-body b { font-size: .95rem; font-weight: 800; }
.ev-scoring-body .meta { margin-top: 2px; font-size: .8rem; }
.ev-scoring-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
/* Вспомогательные кнопки («Группы», «Раунд») — серые чипы */
.ev-tool-btn {
  padding: 7px 12px; border-radius: 999px; font-size: .82rem; font-weight: 700;
  border: 1.5px solid var(--line); background: var(--bg-2); color: var(--ink-soft);
  cursor: pointer; white-space: nowrap;
}
.ev-tool-btn:hover { background: var(--card); color: var(--ink); }
/* Главная кнопка «Начать счёт» — акцентная, но не гигантская */
.ev-start-btn {
  padding: 9px 20px; border-radius: 999px;
  font-size: .92rem; font-weight: 800; letter-spacing: .02em;
  background: var(--coral); color: #fff; border: none; cursor: pointer;
  flex: 1; text-align: center; min-width: 140px;
  transition: background .12s;
}
.ev-start-btn:hover { background: var(--coral-600); }
.ev-start-btn:disabled { opacity: .6; }

/* Зона регистрации — кнопка CTA + счётчик */
.ev-reg-zone { display: flex; align-items: center; gap: 10px;
  flex-wrap: wrap; margin: 0 0 16px; }

/* ── Зелёная зона регистрации (вариант B) ──────────────────── */
.ev-reg-card {
  background: var(--grass-soft, #e6f5ec); border-radius: var(--r-lg);
  padding: 12px 14px; margin-bottom: 12px;
  display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap;
}
.ev-reg-card-label { flex: 1; min-width: 0; }
.ev-reg-card-label b { display: block; font-size: .9rem; font-weight: 800; color: var(--grass-700); }
.ev-reg-card-label span { font-size: .78rem; font-weight: 600; color: var(--grass-600); }
.ev-reg-card-btn {
  padding: 8px 18px; border-radius: 999px;
  font-size: .88rem; font-weight: 800;
  background: var(--grass); color: #fff; border: none; cursor: pointer;
  white-space: nowrap; flex-shrink: 0; transition: background .12s;
}
.ev-reg-card-btn:hover { background: var(--grass-600); }

/* ── Горизонтальная карточка счёта ─────────────────────────── */
.ev-score-row {
  border: 1.5px solid var(--coral-soft); border-radius: var(--r-lg);
  background: var(--card); padding: 12px 14px; margin-bottom: 12px;
}
.ev-score-row-head {
  display: flex; align-items: center; gap: 10px; margin-bottom: 8px;
}
.ev-score-row-icon { font-size: 1.3rem; flex-shrink: 0; }
.ev-score-row-info { flex: 1; min-width: 0; }
.ev-score-row-info b { font-size: .9rem; font-weight: 800; display: block; margin-bottom: 1px; }
.ev-score-row-info p { font-size: .76rem; color: var(--ink-soft); font-weight: 600; margin: 0; }
.ev-score-row-tools { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.ev-score-row-start {
  padding: 7px 16px; border-radius: 999px;
  font-size: .84rem; font-weight: 800;
  background: var(--coral); color: #fff; border: none; cursor: pointer;
  white-space: nowrap; transition: background .12s;
}
.ev-score-row-start:hover { background: var(--coral-600); }

/* Лига-бейдж внутри ev-header */
.ev-league-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 11px; border-radius: 999px;
  background: var(--grass-soft, #e6f5ec);
  color: var(--grass-700); font-size: .8rem; font-weight: 800;
  text-decoration: none; border: 1.5px solid var(--grass-soft, #e6f5ec);
  margin-bottom: 8px;
}
.ev-league-badge:hover { border-color: var(--grass); }

/* ── Секция поездок внизу страницы ─────────────────────────── */
.ev-rides-section { margin-top: 6px; }
.ev-rides-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.ev-reg-count { font-size: .82rem; font-weight: 700; color: var(--ink-soft);
  white-space: nowrap; }

/* ── Компактные карточки действий 2×1 (счёт / поездки) ──────── */
.ev-action-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px;
}
.ev-action-card {
  border: 1.5px solid var(--line); border-radius: var(--r-lg);
  background: var(--card); padding: 12px;
  display: flex; flex-direction: column;
}
.ev-action-card-icon { font-size: 1.4rem; margin-bottom: 4px; }
.ev-action-card-title { font-size: .88rem; font-weight: 800; line-height: 1.2; margin-bottom: 2px; }
.ev-action-card-meta { font-size: .76rem; color: var(--ink-soft); font-weight: 600; margin: 0 0 6px; flex: 1; }
.ev-action-card-tools { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 6px; min-height: 0; }
.ev-action-card-btn {
  padding: 7px 10px; border-radius: 999px;
  font-size: .8rem; font-weight: 800;
  border: 1.5px solid var(--line); background: var(--bg-2);
  color: var(--ink); cursor: pointer; text-align: center; transition: background .12s;
}
.ev-action-card-btn--accent { background: var(--coral); border-color: var(--coral); color: #fff; }
.ev-action-card-btn--accent:hover { background: var(--coral-600); }
.ev-action-card-btn:not(.ev-action-card-btn--accent):hover { background: var(--card); }


/* ═══════════════════════════════════════════════════════════════
   КАРТОЧКИ СПИСКОВ — итерация 3 (v98)
   ═══════════════════════════════════════════════════════════════ */

/* Улучшенная карточка — добавляем к .ev */
.ev-card { border-left-width: 3px; border-radius: var(--r-md); padding: 13px 14px 13px 13px; }
.ev-card-title { font-size: 1rem; font-weight: 800; line-height: 1.25; margin: 0 0 3px; }
.ev-card-meta { font-size: .8rem; line-height: 1.4; margin-top: 0; color: var(--ink-soft); }
.ev-card-right { display: flex; flex-direction: column; gap: 5px; align-items: flex-end;
  flex-shrink: 0; margin-left: auto; padding-left: 8px; }
/* Чип типа события — маленький цветной ярлык */
.ev-type-chip { font-size: .72rem; font-weight: 800; white-space: nowrap; }

/* Мобильная навигация — более чёткое активное состояние */
@media (max-width: 860px) {
  .bottomnav .navlink {
    font-size: .68rem;
    padding: 5px 2px;
    border-radius: 8px;
    letter-spacing: -.01em;
  }
  .bottomnav .navlink .nav-emoji {
    font-size: 1.3rem;
    line-height: 1.1;
  }
  .bottomnav .navlink.active {
    color: var(--grass-700);
    background: var(--grass-soft);
  }
  /* Активный таб — небольшая точка-индикатор снизу */
  .bottomnav .navlink.active::after {
    content: '';
    display: block;
    width: 4px; height: 4px;
    border-radius: 50%;
    background: var(--grass);
    margin: 2px auto 0;
  }
}


/* ── Виртуальные трассы (Шаг 2, v101) ─────────────────────────────────────── */
.course-virtual { opacity: .75; }
.course-virtual .ev-card-title::after { content: ' 📐'; font-size: .8em; }

/* ── Иконка дискгольф-корзины (Шаг 3, v102) ───────────────────────────────── */
/* SVG ICON_BASKET наследует color и font-size из контекста.
   В заголовках h1/h2 немного смещаем вертикальное выравнивание для оптимального вида */
h1 svg[aria-hidden], h2 svg[aria-hidden], h3 svg[aria-hidden] {
  vertical-align: -0.2em;
}
/* В блоке .date карточки увеличиваем SVG до размера родительского font-size */
.ev .date .d > svg { width: 1em; height: 1em; }

/* ---------- Mobile leaderboard ---------- */
.lb-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lb-responsive .scorecard { min-width: 540px; }
@media (max-width: 580px) {
  .lb-hide-mob { display: none; }
  .lb-responsive .scorecard { min-width: 350px; }
  .lb-responsive .scorecard .px { min-width: 110px; }
  .lb-responsive .scorecard th, .lb-responsive .scorecard td { padding: 9px 6px; font-size: .82rem; }
}
.badge-ref { display: inline-block; padding: 2px 7px; border-radius: 10px; font-size: .68rem; font-weight: 700;
  background: var(--sun-200); color: var(--sun-800); margin-left: 4px; }
.badge-ref::after { content: " справ."; font-weight: 400; opacity: 0.7; }

/* ---------- Таблица выступлений ---------- */
.played-ev-table { width: 100%; min-width: 720px; }
.played-ev-table th { background: var(--grass-soft); color: var(--grass-700); font-size: .78rem; }
.played-ev-table td { font-size: .85rem; }
.played-ev-table .played-rounds-row td { border-top: 1px dashed var(--line); }
@media (max-width: 760px) {
  .played-ev-table { min-width: 100%; font-size: .78rem; }
  .played-ev-table th, .played-ev-table td { padding: 8px 5px; }
  .played-ev-table th:nth-child(3), .played-ev-table td:nth-child(3),
  .played-ev-table th:nth-child(8), .played-ev-table td:nth-child(8) { display: none; }
}

/* ---------- Все таблицы на мобильных — не вылезают за экран ---------- */
@media (max-width: 640px) {
  /* Обёртка для всех таблиц */
  .board { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .board table { min-width: 100%; }
  
  /* Таблица выступлений — скрываем колонки 3(Дата), 4(Див), 8(Раунды) */
  .played-ev-table th:nth-child(3),
  .played-ev-table td:nth-child(3),
  .played-ev-table th:nth-child(4),
  .played-ev-table td:nth-child(4),
  .played-ev-table th:nth-child(8),
  .played-ev-table td:nth-child(8) { display: none; }
  
  /* Строки с деталями раундов — компактнее */
  .played-rounds-row td { padding: 0 4px 6px 8px !important; font-size: .68rem !important; }
  .played-rounds-row td span { margin: 1px 4px 1px 0 !important; padding: 2px 5px !important; }
}


/* ================================================================
   РАЗДЕЛ «ПОМОЩЬ» — help_section styles
   Вставить в конец portal/public/css/styles.css
   ================================================================ */

/* --- Поиск --- */
.help-search-wrap {
  position: relative; margin-bottom: 24px;
}
.help-search {
  width: 100%; padding: 13px 16px 13px 44px;
  border: 2px solid var(--line); border-radius: var(--r-md);
  background: var(--card); color: var(--ink);
  font-family: var(--f-body); font-size: 1rem; font-weight: 600;
  box-shadow: var(--sh-sm); transition: border-color .16s, box-shadow .16s;
  outline: none;
}
.help-search:focus { border-color: var(--grass); box-shadow: var(--ring); }
.help-search-ico {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  font-size: 1.1rem; pointer-events: none;
}

/* --- Карточки разделов (главная помощи) --- */
.help-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
  margin-bottom: 30px;
}
.help-card {
  display: flex; gap: 14px; align-items: flex-start;
  background: var(--card); border-radius: var(--r-md);
  padding: 16px 18px; box-shadow: var(--sh-sm);
  cursor: pointer; border: 2px solid transparent;
  transition: transform .14s, box-shadow .14s, border-color .14s;
  text-decoration: none; color: var(--ink);
}
.help-card:hover {
  transform: translateY(-3px); box-shadow: var(--sh-md);
  border-color: var(--grass-soft);
}
.help-card-ico {
  font-size: 1.8rem; flex-shrink: 0; line-height: 1;
  margin-top: 2px;
}
.help-card-body h3 {
  font-size: 1rem; font-weight: 700; margin-bottom: 4px; line-height: 1.2;
}
.help-card-body p {
  font-size: .83rem; color: var(--ink-soft); font-weight: 600; line-height: 1.4;
}

/* --- Шаги --- */
.help-steps { display: flex; flex-direction: column; gap: 0; }
.help-step {
  display: flex; gap: 16px; padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
.help-step:last-child { border-bottom: none; padding-bottom: 0; }
.help-step-num {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--grass); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .85rem; flex-shrink: 0; margin-top: 2px;
}
.help-step-body h4 { font-size: .97rem; font-weight: 700; margin-bottom: 5px; }
.help-step-body p { color: var(--ink-soft); font-size: .91rem; line-height: 1.5; }
.help-step-body code {
  background: var(--bg); padding: 1px 6px; border-radius: 4px;
  font-size: .85rem; color: var(--coral-600);
}

/* --- Тип-боксы --- */
.help-tip {
  display: flex; gap: 12px; border-radius: var(--r-sm);
  padding: 13px 16px; margin: 12px 0; border-left: 4px solid;
}
.help-tip-ico { font-size: 1.15rem; flex-shrink: 0; margin-top: 1px; }
.help-tip-body { font-size: .9rem; font-weight: 600; line-height: 1.5; }
.help-tip-body b { font-weight: 800; }

.help-tip--info   { background: #eff6ff; border-color: #93c5fd; color: #1e3a8a; }
.help-tip--warn   { background: #fff7ed; border-color: #fcd34d; color: #78350f; }
.help-tip--danger { background: #fff1f2; border-color: #fca5a5; color: #9f1239; }
.help-tip--ok     { background: #f0fdf4; border-color: #86efac; color: #14532d; }

/* --- FAQ / Аккордеон --- */
.help-faq { margin-bottom: 10px; }
.help-faq-q {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; cursor: pointer; padding: 14px 18px;
  background: var(--card); border-radius: var(--r-sm);
  font-weight: 700; font-size: .95rem;
  box-shadow: var(--sh-sm); transition: background .14s;
  border: none; width: 100%; text-align: left; color: var(--ink);
}
.help-faq-q:hover { background: var(--grass-soft); }
.help-faq-q.open { border-radius: var(--r-sm) var(--r-sm) 0 0; background: var(--grass-soft); }
.help-faq-chevron {
  flex-shrink: 0; transition: transform .2s; color: var(--grass-600);
  font-style: normal; font-size: 1rem;
}
.help-faq-q.open .help-faq-chevron { transform: rotate(180deg); }
.help-faq-a {
  display: none; padding: 12px 18px 16px;
  background: var(--card); border-top: 1px solid var(--line);
  border-radius: 0 0 var(--r-sm) var(--r-sm);
  font-size: .91rem; color: var(--ink-soft);
  box-shadow: var(--sh-sm); font-weight: 600; line-height: 1.6;
}
.help-faq-a.open { display: block; }
.help-faq-a a { color: var(--grass-600); font-weight: 700; }

/* --- Выделенный блок --- */
.help-highlight {
  background: linear-gradient(120deg, var(--grass-soft) 0%, rgba(219,234,251,.6) 100%);
  border-radius: var(--r-sm); padding: 14px 18px;
  font-size: .92rem; font-weight: 700; color: var(--grass-700);
  margin: 14px 0; border-left: 4px solid var(--grass);
}

/* --- Навигация по разделам (breadcrumb) --- */
.help-nav-chip {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--card); border-radius: 999px;
  padding: 5px 12px; font-size: .83rem; font-weight: 700;
  color: var(--grass-600); box-shadow: var(--sh-sm);
  cursor: pointer; border: none; margin-bottom: 18px;
}
.help-nav-chip:hover { box-shadow: var(--sh-md); color: var(--grass-700); }

/* --- Тег «новое» --- */
.help-badge-new {
  display: inline-block; padding: 1px 7px; border-radius: 999px;
  background: var(--coral-soft); color: var(--coral-600);
  font-size: .7rem; font-weight: 800; letter-spacing: .03em;
  margin-left: 6px; vertical-align: middle;
}

/* --- Две колонки --- */
.help-two-col {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
@media (max-width: 580px) { .help-two-col { grid-template-columns: 1fr; } }

/* --- Анимация появления раздела --- */
@keyframes helpFadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.help-section-content { animation: helpFadeIn .25s ease; }

/* --- Поиск: выделение совпадений --- */
mark.help-mark {
  background: var(--sun); border-radius: 2px;
  padding: 0 2px; color: var(--ink);
}

/* --- Скрытие при поиске --- */
.help-card.help-hidden { display: none; }

/* ================================================================
   РАЗДЕЛ «ПОМОЩЬ» — help_section styles
   Вставить в конец portal/public/css/styles.css
   ================================================================ */

/* --- Поиск --- */
.help-search-wrap {
  position: relative; margin-bottom: 24px;
}
.help-search {
  width: 100%; padding: 13px 16px 13px 44px;
  border: 2px solid var(--line); border-radius: var(--r-md);
  background: var(--card); color: var(--ink);
  font-family: var(--f-body); font-size: 1rem; font-weight: 600;
  box-shadow: var(--sh-sm); transition: border-color .16s, box-shadow .16s;
  outline: none;
}
.help-search:focus { border-color: var(--grass); box-shadow: var(--ring); }
.help-search-ico {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  font-size: 1.1rem; pointer-events: none;
}

/* --- Карточки разделов (главная помощи) --- */
.help-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
  margin-bottom: 30px;
}
.help-card {
  display: flex; gap: 14px; align-items: flex-start;
  background: var(--card); border-radius: var(--r-md);
  padding: 16px 18px; box-shadow: var(--sh-sm);
  cursor: pointer; border: 2px solid transparent;
  transition: transform .14s, box-shadow .14s, border-color .14s;
  text-decoration: none; color: var(--ink);
}
.help-card:hover {
  transform: translateY(-3px); box-shadow: var(--sh-md);
  border-color: var(--grass-soft);
}
.help-card-ico {
  font-size: 1.8rem; flex-shrink: 0; line-height: 1;
  margin-top: 2px;
}
.help-card-body h3 {
  font-size: 1rem; font-weight: 700; margin-bottom: 4px; line-height: 1.2;
}
.help-card-body p {
  font-size: .83rem; color: var(--ink-soft); font-weight: 600; line-height: 1.4;
}

/* --- Шаги --- */
.help-steps { display: flex; flex-direction: column; gap: 0; }
.help-step {
  display: flex; gap: 16px; padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
.help-step:last-child { border-bottom: none; padding-bottom: 0; }
.help-step-num {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--grass); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .85rem; flex-shrink: 0; margin-top: 2px;
}
.help-step-body h4 { font-size: .97rem; font-weight: 700; margin-bottom: 5px; }
.help-step-body p { color: var(--ink-soft); font-size: .91rem; line-height: 1.5; }
.help-step-body code {
  background: var(--bg); padding: 1px 6px; border-radius: 4px;
  font-size: .85rem; color: var(--coral-600);
}

/* --- Тип-боксы --- */
.help-tip {
  display: flex; gap: 12px; border-radius: var(--r-sm);
  padding: 13px 16px; margin: 12px 0; border-left: 4px solid;
}
.help-tip-ico { font-size: 1.15rem; flex-shrink: 0; margin-top: 1px; }
.help-tip-body { font-size: .9rem; font-weight: 600; line-height: 1.5; }
.help-tip-body b { font-weight: 800; }

.help-tip--info   { background: #eff6ff; border-color: #93c5fd; color: #1e3a8a; }
.help-tip--warn   { background: #fff7ed; border-color: #fcd34d; color: #78350f; }
.help-tip--danger { background: #fff1f2; border-color: #fca5a5; color: #9f1239; }
.help-tip--ok     { background: #f0fdf4; border-color: #86efac; color: #14532d; }

/* --- FAQ / Аккордеон --- */
.help-faq { margin-bottom: 10px; }
.help-faq-q {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; cursor: pointer; padding: 14px 18px;
  background: var(--card); border-radius: var(--r-sm);
  font-weight: 700; font-size: .95rem;
  box-shadow: var(--sh-sm); transition: background .14s;
  border: none; width: 100%; text-align: left; color: var(--ink);
}
.help-faq-q:hover { background: var(--grass-soft); }
.help-faq-q.open { border-radius: var(--r-sm) var(--r-sm) 0 0; background: var(--grass-soft); }
.help-faq-chevron {
  flex-shrink: 0; transition: transform .2s; color: var(--grass-600);
  font-style: normal; font-size: 1rem;
}
.help-faq-q.open .help-faq-chevron { transform: rotate(180deg); }
.help-faq-a {
  display: none; padding: 12px 18px 16px;
  background: var(--card); border-top: 1px solid var(--line);
  border-radius: 0 0 var(--r-sm) var(--r-sm);
  font-size: .91rem; color: var(--ink-soft);
  box-shadow: var(--sh-sm); font-weight: 600; line-height: 1.6;
}
.help-faq-a.open { display: block; }
.help-faq-a a { color: var(--grass-600); font-weight: 700; }

/* --- Выделенный блок --- */
.help-highlight {
  background: linear-gradient(120deg, var(--grass-soft) 0%, rgba(219,234,251,.6) 100%);
  border-radius: var(--r-sm); padding: 14px 18px;
  font-size: .92rem; font-weight: 700; color: var(--grass-700);
  margin: 14px 0; border-left: 4px solid var(--grass);
}

/* --- Навигация по разделам (breadcrumb) --- */
.help-nav-chip {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--card); border-radius: 999px;
  padding: 5px 12px; font-size: .83rem; font-weight: 700;
  color: var(--grass-600); box-shadow: var(--sh-sm);
  cursor: pointer; border: none; margin-bottom: 18px;
}
.help-nav-chip:hover { box-shadow: var(--sh-md); color: var(--grass-700); }

/* --- Тег «новое» --- */
.help-badge-new {
  display: inline-block; padding: 1px 7px; border-radius: 999px;
  background: var(--coral-soft); color: var(--coral-600);
  font-size: .7rem; font-weight: 800; letter-spacing: .03em;
  margin-left: 6px; vertical-align: middle;
}

/* --- Две колонки --- */
.help-two-col {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
@media (max-width: 580px) { .help-two-col { grid-template-columns: 1fr; } }

/* --- Анимация появления раздела --- */
@keyframes helpFadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
.help-section-content { animation: helpFadeIn .25s ease; }

/* --- Поиск: выделение совпадений --- */
mark.help-mark {
  background: var(--sun); border-radius: 2px;
  padding: 0 2px; color: var(--ink);
}

/* --- Скрытие при поиске --- */
.help-card.help-hidden { display: none; }

/* ================================================================
   УДОБСТВА ПАРКА — amenity chips
   ================================================================ */
.amenity-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 12px 5px 8px;
  border-radius: 999px;
  background: var(--card);
  box-shadow: var(--sh-sm);
  font-size: .82rem; font-weight: 700; color: var(--ink);
  border: 1.5px solid var(--line);
  white-space: nowrap;
  transition: box-shadow .13s, border-color .13s;
}
.amenity-chip:hover { box-shadow: var(--sh-md); border-color: var(--grass-soft); }
.amenity-chip-ico { font-size: 1rem; line-height: 1; flex-shrink: 0; }
.amenity-chip-lbl { font-size: .8rem; }

/* Строка удобств на странице парка/трассы */
.amenities-row {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-bottom: 16px;
}

/* Компактный вид (inline иконки) */
.amenity-icons { display: inline-flex; gap: 4px; align-items: center; font-size: 1rem; }

/* ================================================================
   БЛОК СЛОЖНОСТИ — redesigned crit bars
   ================================================================ */
.crit-bar-row {
  display: flex; align-items: center; gap: 10px; margin: 6px 0;
}
.crit-bar-label {
  display: flex; align-items: center; gap: 5px;
  min-width: 160px; font-size: .84rem; font-weight: 700;
  color: var(--ink);
}
.crit-bar-track {
  flex: 1; height: 8px; background: var(--bg-2);
  border-radius: 4px; overflow: hidden;
}
.crit-bar-fill {
  height: 100%; border-radius: 4px; transition: width .3s ease;
}
.crit-bar-val {
  min-width: 28px; text-align: right;
  font-family: var(--f-display); font-weight: 800;
  font-size: .95rem;
}

/* ================================================================
   СТРАНИЦА ТРАССЫ — переработки
   ================================================================ */

/* Карта отрезка — плейсхолдер когда нет координат */
#holeMap.no-coords {
  display: flex; align-items: center; justify-content-center;
  background: var(--bg-2); border-radius: 8px;
  min-height: 220px;
}

/* Кнопки хэндбука — строка рядом с картой */
.handbook-actions {
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
}
.handbook-actions .btn { font-size: .82rem; }

/* Рейтинг парка — цифра */
.park-avg-score {
  font-family: var(--f-display); font-weight: 800;
  font-size: 3rem; line-height: 1;
}

/* ── Мобильные скрытия в таблицах ── */
@media (max-width: 600px) {
  .mob-hide { display: none !important; }
  .scorecard td, .scorecard th { padding: 5px 4px; font-size: .8rem; }
  .dist-bar { height: 12px; border-radius: 4px; }
}

/* ── details/summary — полная таблица рейтинга ── */
details > summary { list-style: none; }
details > summary::before { content: '▶ '; font-size: .7rem; }
details[open] > summary::before { content: '▼ '; }

/* ── Вкладки раундов турнира ──────────────────────────────── */
.tourney-tabs {
  display: flex; gap: 4px; overflow-x: auto; padding-bottom: 4px;
  -webkit-overflow-scrolling: touch; scrollbar-width: none;
  border-bottom: 2px solid var(--line); margin-bottom: 4px;
}
.tourney-tabs::-webkit-scrollbar { display: none; }
.tourney-tab {
  flex-shrink: 0; padding: 7px 12px; border-radius: 8px 8px 0 0;
  font-size: .82rem; font-weight: 700; cursor: pointer;
  background: none; border: none; color: var(--ink-soft);
  border-bottom: 2px solid transparent; margin-bottom: -2px;
  white-space: nowrap; transition: color .12s;
}
.tourney-tab:hover { color: var(--ink); background: var(--bg-2); }
.tourney-tab.on {
  color: var(--grass-700); border-bottom-color: var(--grass);
  background: var(--grass-soft, #e6f5ec);
}
.excluded-row { opacity: .5; }