/* Формы авторизации тренажёра — вид как в кабинете-партнёрке 1win */
@font-face{font-family:"Proxima Nova";font-weight:400;font-style:normal;font-display:swap;
  src:url("/assets/1w.run/panel/assets/fonts/ProximaNova-Regular-DtAL0MTj.woff2") format("woff2")}
@font-face{font-family:"Proxima Nova";font-weight:600;font-style:normal;font-display:swap;
  src:url("/assets/1w.run/panel/assets/fonts/ProximaNova-Semibold-cPYo5DXZ.woff2") format("woff2")}
@font-face{font-family:"Proxima Nova";font-weight:700;font-style:normal;font-display:swap;
  src:url("/assets/1w.run/panel/assets/fonts/ProximaNova-Bold-D2yrO9R2.woff2") format("woff2")}
@font-face{font-family:"Proxima Nova";font-weight:800;font-style:normal;font-display:swap;
  src:url("/assets/1w.run/panel/assets/fonts/ProximaNova-Extrabold-DbfJYMpE.woff2") format("woff2")}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: #05050a;
  /* затемнённый геро-фон как за модалкой */
  background-image: radial-gradient(1200px 600px at 78% 32%, #16122e 0%, #08080f 55%, #050509 100%);
  color: #14121f;
  display: flex; align-items: center; justify-content: center;
  min-height: 100%; padding: 24px;
}
.card {
  position: relative;
  width: 340px; max-width: 100%;
  background: #fff; border-radius: 20px;
  padding: 26px 26px 28px;
  box-shadow: 0 24px 70px rgba(0,0,0,.45);
}
.card.wide { width: 380px; }
.card h1 { margin: 0 0 12px; font-size: 24px; font-weight: 800; letter-spacing: -.3px; }
.sub { margin: 0 0 18px; font-size: 14px; color: #7b7f8c; }
.sub a, .link { color: #2f6bff; text-decoration: none; font-weight: 600; }
.sub a:hover, .link:hover { text-decoration: underline; }
.close {
  position: absolute; top: 18px; right: 18px; width: 26px; height: 26px;
  border-radius: 50%; background: #eef0f6; color: #9aa0ad; border: 0;
  font-size: 15px; cursor: pointer; line-height: 26px; text-align: center; text-decoration: none;
}

.field { position: relative; margin-bottom: 12px; }
.field .ic { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: #9aa0ad; display: flex; }
.field .eye { left: auto; right: 14px; cursor: pointer; background: none; border: 0; padding: 0; }
.field input, .field select {
  width: 100%; height: 52px; border: 1.5px solid transparent; background: #f0f2f8;
  border-radius: 12px; padding: 0 16px 0 44px; font-size: 15px; color: #14121f; outline: none;
}
.field input::placeholder { color: #9aa0ad; }
.field input:focus, .field select:focus { border-color: #2f6bff; background: #fff; }
.field.noic input { padding-left: 16px; }
.field.err input { border-color: #ff4d5e; background: #fff5f6; }
.emsg { color: #ff3b4e; font-size: 12.5px; margin: -6px 2px 10px; }

/* телефон: единая пилюля [флаг код ▾ | номер] */
.phone2 {
  position: relative; display: flex; align-items: center; gap: 0;
  height: 52px; background: #f0f2f8; border: 1.5px solid transparent; border-radius: 12px;
  margin-bottom: 12px; transition: border-color .15s, background .15s;
}
.phone2.focus { border-color: #2f6bff; background: #fff; }
.phone2 .cc {
  display: flex; align-items: center; gap: 7px; height: 100%;
  padding: 0 12px 0 14px; background: none; border: 0; cursor: pointer;
  border-right: 1.5px solid #e2e5ef; color: #14121f; font-size: 15px; font-weight: 600;
}
.phone2 .cc .flag { width: 22px; height: 22px; border-radius: 50%; overflow: hidden; flex: none; }
.phone2 .cc .chev { width: 14px; height: 14px; color: #9aa0ad; transition: transform .15s; }
.phone2.open .cc .chev { transform: rotate(180deg); }
.phone2 input[type=tel] {
  flex: 1; width: 100%; height: 100%; border: 0; background: none; outline: none;
  padding: 0 16px; font-size: 15px; color: #14121f; letter-spacing: .3px;
}
.phone2 input[type=tel]::placeholder { color: #9aa0ad; letter-spacing: normal; }
.cc-menu {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 30; width: 280px; max-width: 86vw;
  background: #fff; border-radius: 12px; box-shadow: 0 14px 40px rgba(10,12,40,.18);
  padding: 8px; margin: 0; list-style: none;
}
.cc-menu[hidden] { display: none; }
.cc-search {
  width: 100%; height: 40px; border: 1.5px solid #e2e5ef; background: #f7f8fc; border-radius: 9px;
  padding: 0 12px; font-size: 14px; outline: none; margin-bottom: 6px;
}
.cc-search:focus { border-color: #2f6bff; background: #fff; }
.cc-list { max-height: 240px; overflow-y: auto; }
.cc-item {
  display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 9px;
  cursor: pointer; font-size: 14.5px; color: #14121f;
}
.cc-item:hover { background: #f0f2f8; }
.cc-item .flag { width: 22px; height: 22px; border-radius: 50%; overflow: hidden; flex: none; color: #9aa0ad; }
.cc-item .flag svg { width: 22px; height: 22px; fill: currentColor; }
/* флаги-картинки (flag-icons SVG) — круглый чёткий кроп */
img.flag { object-fit: cover; display: block; background: #eef0f6; }
.phone2 .cc img.flag { width: 22px; height: 22px; border-radius: 50%; }
.cc-item .nm { flex: 1; }
.cc-item .cd { color: #7b7f8c; font-weight: 600; }

/* переключатель модели RevShare / CPA */
.toggle { display: flex; background: #f0f2f8; border-radius: 12px; padding: 4px; margin-bottom: 14px; }
.toggle label { flex: 1; }
.toggle input { display: none; }
.toggle span {
  display: block; text-align: center; padding: 10px 0; border-radius: 9px;
  font-size: 14px; font-weight: 600; color: #7b7f8c; cursor: pointer; transition: .15s;
}
.toggle input:checked + span { background: #fff; color: #14121f; box-shadow: 0 2px 8px rgba(0,0,0,.08); }

.forgot { display: block; margin: 2px 2px 16px; font-size: 13.5px; }
.btn {
  width: 100%; height: 52px; border: 0; border-radius: 12px;
  background: #3b5bff; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer;
}
.btn:hover { background: #2f4ff0; }

/* капча */
.captcha-row { display: flex; gap: 10px; align-items: stretch; margin-bottom: 12px; }
.captcha-row .field { flex: 1; margin: 0; }
.captcha-box { display: flex; align-items: center; gap: 6px; }
.captcha-box img { height: 52px; border-radius: 12px; display: block; }
.captcha-box .refresh {
  width: 40px; height: 52px; border: 0; background: #f0f2f8; border-radius: 12px;
  cursor: pointer; color: #6b7280; font-size: 18px;
}
.alert { background: #fff1f2; color: #d1273a; border: 1px solid #ffd5da; padding: 10px 12px; border-radius: 10px; font-size: 13.5px; margin-bottom: 14px; }
.brand { display: flex; justify-content: center; margin-bottom: 14px; }
.brand b { font-size: 20px; font-weight: 900; color: #14121f; letter-spacing: -.5px; }
.brand b i { font-style: normal; color: #3b5bff; }
