/* ===== Окно онбординга (новый путник) ===== */
.onboarding {
  position: fixed;
  inset: 0;
  z-index: var(--layer-system);
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 16px;
}
.onboarding.hidden { display: none; }
.banned-screen {
  position: fixed;
  inset: 0;
  z-index: var(--layer-system, 3000);
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(5,6,8,.94);
  color: #e8d8b0;
}
.banned-screen-card { width: min(100%, 330px); padding: 28px 22px; border: 1px solid rgba(210,84,84,.42); border-radius: 14px; text-align: center; background: rgba(30,13,13,.78); box-shadow: 0 18px 60px rgba(0,0,0,.45); }
.banned-screen-mark { margin-bottom: 12px; color: #f19a9a; font: 42px/1 var(--font-game); }
.banned-screen h1 { margin: 0 0 13px; font: 600 17px var(--font-game); text-transform: lowercase; }
.banned-screen p { margin: 0; font: 13px/1.45 var(--font-game); }
.banned-screen-note { margin-top: 14px !important; color: rgba(232,216,176,.62); font-size: 11px !important; }
.onboarding-bg {
  position: absolute;
  inset: 0;
  background-image: url('/media/newuser.jpg');
  background-size: cover;
  background-position: center;
  filter: brightness(0.55);
}
.onboarding-card {
  position: relative;
  width: 85%;
  max-width: 340px;
  max-height: 100%;
  overflow-y: auto;
  padding: 24px 22px;
  background: rgba(15, 17, 21, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 20px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(12px) saturate(1.2);
  backdrop-filter: blur(12px) saturate(1.2);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  text-align: center;
}
.onboarding-title {
  font-family: var(--font-game);
  font-size: 18px;
  color: #e8d8b0;
  text-transform: lowercase;
  letter-spacing: 0.5px;
  font-weight: 600;
  margin-bottom: 2px;
}
.onboarding-sub {
  font-family: var(--font-game);
  font-size: 12px;
  color: rgba(232, 216, 176, 0.6);
  margin-bottom: 14px;
  line-height: 1.4;
}
.nickname-input {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.4);
  color: #e8d8b0;
  font-family: var(--font-game);
  font-size: 16px;
  text-align: center;
  outline: none;
  transition: border-color 0.15s ease;
}
.nickname-input::placeholder { color: rgba(232, 216, 176, 0.35); }
.nickname-input:focus { border-color: rgba(232, 216, 176, 0.6); }
.nickname-hint {
  font-family: var(--font-game);
  font-size: 11px;
  min-height: 14px;
  margin: 4px 0 6px;
  color: rgba(232, 216, 176, 0.7);
}
.nickname-hint.ok    { color: #8bc34a; }
.nickname-hint.error { color: #ef5350; }
.onboarding-btn{
  margin-top: 4px;

  border: none;
  border-radius: 12px;
  background: rgba(232, 216, 176, 0.18);
  color: #e8d8b0;
  font-family: var(--font-game);
  font-size: 15px;
  text-transform: lowercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.1s ease;
width:fit-content;max-width:100%;min-width:44px;min-height:var(--game-action-min-height);padding:var(--game-action-padding);flex:0 1 auto;justify-self:center;align-self:center;}
.onboarding-btn:hover:not(:disabled)  { background: rgba(232, 216, 176, 0.3); }
.onboarding-btn:active:not(:disabled) { transform: scale(0.97); }
.onboarding-btn:disabled              { opacity: 0.35; cursor: not-allowed; }
.language-switch { display: flex; gap: 10px; justify-content: center; align-items: center; }
.language-btn {
  width: 36px; height: 28px; padding: 3px; border: 1px solid rgba(232,216,176,0.22);
  border-radius: 7px; background: rgba(0,0,0,0.2);
  line-height: 1; cursor: pointer; opacity: 0.38; filter: grayscale(0.75);
  transition: opacity .15s ease, filter .15s ease, transform .1s ease, border-color .15s ease;
}
.onboarding-gender {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:0 0 10px;
  padding:0;
  border:0;
}
.onboarding-gender legend {
  width:100%;
  margin:0 0 7px;
  color:rgba(232,216,176,.72);
  font:11px/1.3 var(--font-game);
  text-transform:lowercase;
}
.onboarding-gender-choice {
  min-height:112px;
  padding:4px 6px 7px;
  border:1px solid rgba(232,216,176,.22);
  border-radius:12px;
  background:rgba(0,0,0,.28);
  color:rgba(232,216,176,.66);
  font:12px/1.2 var(--font-game);
  cursor:pointer;
  overflow:hidden;
}
.onboarding-gender-choice img { display:block; width:100%; height:82px; object-fit:contain; object-position:center; }
.onboarding-gender-choice.active { border-color:rgba(232,216,176,.82); background:rgba(232,216,176,.11); color:#e8d8b0; }
.onboarding-gender-choice:active { transform:scale(.98); }
.language-btn.active { opacity: 1; filter: none; border-color: rgba(232,216,176,0.8); }
.language-btn:active { transform: scale(.94); }
.flag { display: block; width: 100%; height: 100%; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0,0,0,.25) inset; }
.flag-ru { background: linear-gradient(to bottom, #fff 0 33.33%, #0755b9 33.33% 66.66%, #d52b1e 66.66%); }
.flag-us {
  position: relative;
  overflow: hidden;
  background: repeating-linear-gradient(to bottom, #b22234 0 1.54px, #fff 1.54px 3.08px);
}
.flag-us::before { content: ''; position: absolute; inset: 0 auto auto 0; width: 48%; height: 54%; background: #3c3b6e; }
.onboarding-language { margin-top: 13px; }