.top {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 92px;
  margin-bottom: 26px;
  padding: 20px 24px;
  border: 1px solid #2d3948;
  border-radius: 14px;
  background: linear-gradient(110deg, #19232e, #111922 65%);
  box-shadow: 0 10px 32px #00000024;
}
.top::before {
  content: '';
  position: absolute;
  top: -1px;
  left: 24px;
  width: 92px;
  height: 2px;
  border-radius: 2px;
  background: #f3b54c;
}
.brand-group {min-width: 0;flex-shrink: 0}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  color: #f1f4f7;
  text-decoration: none;
  white-space: nowrap;
}
.brand-mark {width: 43px;height: 43px;flex-shrink: 0}
.brand-wordmark {display: inline-flex;gap: 8px;font-size: 29px;font-weight: 900;letter-spacing: -.8px;line-height: 1}
.brand-game {color: #f3b54c}
.brand-stats {color: #f1f4f7}
.brand:hover .brand-stats {color: #fff}
.brand:focus-visible {outline: 2px solid #f3b54c;outline-offset: 7px;border-radius: 4px}
.header-actions {display: flex;align-items: center;justify-content: flex-end;gap: 10px;flex-wrap: wrap;min-width: 0}
.header-buttons {display: flex;align-items: center;justify-content: flex-end;gap: 8px;flex-wrap: wrap}
.top .language-control {display: inline-flex;align-items: center;gap: 0}
.top .language-control select {
  width: 139px;
  max-width: 100%;
  min-height: 40px;
  padding: 9px 10px;
  font-size: 12px;
  border-color: #384656;
  border-radius: 8px;
  background-color: #0e151d;
}
.top .back-home,.top .small,.header-start {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 9px 12px;
  margin: 0;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
  text-decoration: none;
}
.top .back-home {color: #d8e0e8;border-color: #384656}
.top .small {background: #18222d;border-color: #384656}
.top #accountShortcut {max-width: 170px;display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;background: #f3b54c;border-color: #f3b54c;color: #141b24}
.top #overlayToggle[aria-pressed=true] {border-color: #f3b54c;color: #f3b54c}
.header-start {background: #f3b54c;color: #141b24;border: 1px solid #f3b54c;padding-inline: 18px;font-weight: 750}
.header-start:hover,.top #accountShortcut:hover {background: #ffca70;border-color: #ffca70}
.compact .top {min-height: 72px;padding: 12px 16px;margin-bottom: 16px}
.compact .top::before {left: 16px}
.compact .brand-mark {width: 34px;height: 34px}
.compact .brand-wordmark {font-size: 25px}
.legal-page .top {margin-bottom: 26px}
.legal-page .top .back-home {font-size: 12px}
@media(max-width: 850px) {
  .top {padding: 18px 20px;gap: 16px}
  .brand-wordmark {font-size: 26px}
  .brand-mark {width: 38px;height: 38px}
  .brand {gap: 10px}
  .header-actions {gap: 8px}
  .header-buttons {gap: 6px}
}
@media(max-width: 600px) {
  .top {display: grid;grid-template-columns: minmax(0,1fr) auto;gap: 14px 8px;padding: 16px 14px;min-height: 72px;border-radius: 11px;margin-bottom: 20px}
  .top::before {left: 14px;width: 62px}
  .brand-group,.top>.brand {grid-column: 1;grid-row: 1}
  .brand {gap: 8px}
  .brand-mark {width: 31px;height: 31px}
  .brand-wordmark {gap: 5px;font-size: 21px;letter-spacing: -.6px}
  .compact .brand-mark {width: 29px;height: 29px}
  .compact .brand-wordmark {font-size: 20px}
  .header-actions {display: contents}
  .top .language-control,.legal-page .top .header-actions>form {grid-column: 2;grid-row: 1}
  .top .language-control select {width: 105px;min-height: 36px;font-size: 11px;padding: 8px 5px}
  .header-start {display: none}
  .header-buttons {grid-column: 1/-1;display: grid;grid-template-columns: repeat(3,minmax(0,1fr));gap: 6px;padding-top: 13px;border-top: 1px solid #2d3948}
  .top .back-home,.top .small {width: 100%;min-width: 0;min-height: 36px;padding: 7px 6px;font-size: 11px}
  .top #accountShortcut {max-width: none}
  .legal-page .top .header-actions>.back-home {grid-column: 1/-1;grid-row: 2}
}
@media(max-width: 370px) {
  .top {padding-inline: 11px}
  .brand-mark {width: 27px;height: 27px}
  .brand-wordmark {font-size: 19px}
  .top .language-control select {width: 99px}
}
