/* ===== PAGE 0 ===== */
.p0-screen { flex-direction: column; align-items: center; justify-content: center; }
#stateA { display: flex; flex-direction: column; align-items: center; width: 100%; height: 100%; padding: calc(var(--u)*4) 0 calc(var(--u)*3); }
.p0-a-title { font-size: calc(var(--u)*5.5); font-weight: 900; color: var(--text); text-align: center; margin-bottom: calc(var(--u)*1); flex-shrink: 0; }
.p0-a-subtitle { font-size: calc(var(--u)*2.8); color: var(--text-muted); text-align: center; margin-bottom: calc(var(--u)*4); flex-shrink: 0; }
.p0-cards { display: flex; flex-direction: column; gap: calc(var(--u)*1.5); width: var(--col-w); flex: 1; overflow-y: auto; padding-bottom: calc(var(--u)*2); }
.p0-cards::-webkit-scrollbar { width: 0; }
.p0-card-logo { width: 55%; max-height: calc(var(--u)*10); height: auto; object-fit: contain; flex-shrink: 0; }
.p0-card-logo.first { width: 55%; }
.p0-card { background: #fff; border-radius: calc(var(--u)*2.5); box-shadow: 0 2px 8px rgba(0,0,0,0.08); display: flex; flex-direction: column; align-items: center; padding: calc(var(--u)*2.2) calc(var(--u)*3) calc(var(--u)*2); cursor: pointer; border: calc(var(--u)*0.3) solid #e5e7eb; transition: transform 0.12s ease, box-shadow 0.12s ease; -webkit-tap-highlight-color: transparent; gap: calc(var(--u)*0.8); flex-shrink: 0; }
.p0-card:active { transform: scale(0.97); box-shadow: 0 1px 4px rgba(0,0,0,0.07); }
.p0-card-desc { font-size: calc(var(--u)*2.4); color: var(--text-muted); text-align: center; line-height: 1.3; }

#stateB { display: none; flex-direction: column; align-items: center; width: 100%; height: 100%; padding-bottom: calc(var(--u)*4); }
.p0-b-desc { margin-top: calc(var(--u)*1.5); font-size: calc(var(--u)*2.8); color: var(--text-muted); text-align: center; flex-shrink: 0; }
.p0-content { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }
.p0-prices { width: var(--col-w); background: #fff; border-radius: calc(var(--u)*3); box-shadow: 0 4px 16px rgba(100,105,130,0.10); padding: calc(var(--u)*3) calc(var(--u)*4); }
.p0-prices-title { font-size: calc(var(--u)*2.4); color: var(--text-muted); margin-bottom: calc(var(--u)*2); }
.p0-price-row { display: flex; align-items: center; justify-content: space-between; padding: calc(var(--u)*1.8) 0; border-bottom: 1px solid #f0eee9; }
.p0-price-row:last-child { border-bottom: none; }
.p0-price-label { font-size: calc(var(--u)*2.8); color: var(--text); }
.p0-price-val { font-size: calc(var(--u)*3.2); font-weight: 700; color: var(--text); }
.p0-b-bottom { flex-shrink: 0; width: 100%; display: flex; flex-direction: column; align-items: center; padding-top: calc(var(--u)*4); }
.p0-status { display: none; width: var(--col-w); font-size: calc(var(--u)*2.4); text-align: center; line-height: 1.4; margin-bottom: calc(var(--u)*1.8); }
.p0-status.warning { color: #b45309; font-weight: 600; }
.p0-status.blocked { color: #c53030; font-weight: 600; }

/* ===== PAGE 1 ===== */
.phone-display { margin-top: calc(var(--u) * 4); font-size: calc(var(--u) * 5); font-weight: 700; pointer-events: none; user-select: none; letter-spacing: 0.02em; }
.phone-display .typed { color: var(--accent); }
.phone-display .ph { color: var(--text-ph); }
.key-bare { background: transparent; box-shadow: none; color: var(--text-muted); opacity: 0.3; pointer-events: none; transition: opacity 0.2s ease, transform 0.12s ease; }
.key-bare svg { width: 45%; height: 45%; }
.key-bare.enabled { opacity: 1; pointer-events: auto; }
.key-bare:active { transform: scale(0.85); }
.code-area { margin-top: calc(var(--u) * 4); display: none; flex-direction: row; align-items: center; gap: calc(var(--u) * 3); }
.code-field { width: calc(var(--u) * 11); height: calc(var(--u) * 12); border-radius: calc(var(--u) * 1.5); background: var(--key-bg); border: calc(var(--u) * 0.4) solid transparent; display: flex; align-items: center; justify-content: center; font-size: calc(var(--u) * 5); font-weight: 400; color: var(--accent); transition: border-color 0.15s ease; }
.code-field.active { border-color: var(--accent); }
.col-right { display: flex; align-items: flex-start; justify-content: center; padding-top: calc(var(--u) * 3); }

/* ===== PAGE 2 ===== */
.p2-screen { flex-direction: column; overflow: hidden; }
.p2-header { flex-shrink: 0; position: relative; display: flex; flex-direction: column; align-items: center; }
.p2-back { position: absolute; left: calc(var(--u)*3); top: calc(var(--u)*3); }
.p2-exit { position: absolute; right: calc(var(--u)*3); top: calc(var(--u)*3); }
.p2-title { font-size: calc(var(--u)*5); font-weight: 900; color: var(--text); text-align: center; margin-top: calc(var(--u)*4); width: var(--col-w); }
.p2-subtitle { font-size: calc(var(--u)*2.6); color: var(--text-muted); text-align: center; margin-top: calc(var(--u)*1); width: var(--col-w); }
.p2-list-wrap { flex: 1; overflow: hidden; position: relative; margin-top: calc(var(--u)*2); display: flex; justify-content: center; }
.p2-list { width: var(--col-w); height: 100%; overflow-y: auto; padding: 0 0 calc(var(--u)*2); -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--accent) transparent; }
.p2-list::-webkit-scrollbar { width: calc(var(--u)*0.8); }
.p2-list::-webkit-scrollbar-thumb { background: var(--accent-light); border-radius: 4px; }
.p2-footer { flex-shrink: 0; display: flex; justify-content: center; padding: calc(var(--u)*2) 0 calc(var(--u)*4); }
.p2-footer .action-btn { margin-top: 0; width: var(--col-w); }
.p2-overlay { display: none; position: absolute; inset: 0; background: var(--accent-overlay); z-index: 5; }
.p2-overlay.visible { display: block; }
.guest-card { display: flex; align-items: center; gap: calc(var(--u)*2); padding: calc(var(--u)*2.5) calc(var(--u)*2); border-radius: calc(var(--u)*2); background: #fff; margin-bottom: calc(var(--u)*1.5); box-shadow: 0 2px 6px rgba(0,0,0,0.07); transition: opacity 0.2s, background 0.15s, border-color 0.15s; cursor: pointer; -webkit-tap-highlight-color: transparent; border: calc(var(--u)*0.4) solid transparent; }
.guest-card.selected-card { background: var(--accent-5); border-color: var(--accent); }
.guest-cb { width: calc(var(--u)*5.5); height: calc(var(--u)*5.5); border-radius: calc(var(--u)*1.2); border: calc(var(--u)*0.4) solid var(--text-ph); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.15s, border-color 0.15s; }
.guest-cb.checked { background: var(--accent); border-color: var(--accent); }
.guest-cb svg { width: 60%; height: 60%; }
.guest-icon { width: calc(var(--u)*6); height: calc(var(--u)*6); flex-shrink: 0; }
.guest-info { flex: 1; min-width: 0; }
.guest-name { font-size: calc(var(--u)*3.2); font-weight: 400; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color 0.15s, font-weight 0.15s; }
.guest-name.active-name { font-weight: 700; color: var(--text); }
.guest-age { font-size: calc(var(--u)*2.4); color: var(--text-muted); margin-top: calc(var(--u)*0.3); }
.guest-age.active-age { font-weight: 700; color: var(--text); }
.edit-list-btn { display: flex; align-items: center; gap: calc(var(--u)*1.5); padding: calc(var(--u)*1.5) calc(var(--u)*2); border-radius: calc(var(--u)*2); background: transparent; margin-bottom: calc(var(--u)*1.5); cursor: pointer; border: none; width: 100%; }
.edit-list-icon svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); }
.edit-list-label { font-size: calc(var(--u)*2.6); color: var(--text-muted); font-family: Arial, sans-serif; flex: 1; text-align: left; }
.edit-list-arrow svg { width: calc(var(--u)*3); height: calc(var(--u)*3); }
.edit-modal { width: calc(var(--u)*62); padding: calc(var(--u)*5) calc(var(--u)*4) calc(var(--u)*3); gap: calc(var(--u)*3); }
.edit-mode-main { display: flex; flex-direction: column; gap: calc(var(--u)*3); width: 100%; }
.edit-mode-date { display: none; flex-direction: column; gap: calc(var(--u)*2.5); width: 100%; }
.edit-top-row { display: flex; align-items: center; gap: calc(var(--u)*3); }
.edit-gender-btns { display: flex; gap: calc(var(--u)*2); flex-shrink: 0; }
.gender-btn { width: calc(var(--u)*9); height: calc(var(--u)*9); border-radius: 50%; border: calc(var(--u)*0.4) solid var(--text-ph); background: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: calc(var(--u)*1.5); transition: border-color 0.15s, background 0.15s; }
.gender-btn.selected { border-color: var(--accent); background: var(--accent-5); }
.date-pill { flex: 1; background: var(--key-bg); border-radius: calc(var(--u)*2); padding: calc(var(--u)*1.5) calc(var(--u)*2); border: none; cursor: pointer; font-family: Arial, sans-serif; display: flex; align-items: center; gap: calc(var(--u)*1.5); }
.date-pill-icon svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); }
.date-pill-label { font-size: calc(var(--u)*2); color: var(--text-muted); display: block; }
.date-pill-value { font-size: calc(var(--u)*2.8); color: var(--text); display: block; }
.date-pill-value.ph { color: var(--text-ph); }
.date-pill-arrow svg { width: calc(var(--u)*3); height: calc(var(--u)*3); }
.edit-name-display { font-size: calc(var(--u)*4.5); font-weight: 700; color: var(--accent); min-height: calc(var(--u)*7); padding: calc(var(--u)*1) 0; border-bottom: calc(var(--u)*0.4) solid var(--accent); width: 100%; }
.edit-name-cursor { display: inline-block; width: 2px; height: calc(var(--u)*4.5); background: var(--accent); vertical-align: middle; margin-left: 1px; animation: blink 1s step-end infinite; }
@keyframes blink { 50% { opacity: 0; } }
.edit-alpha-kb { display: flex; flex-direction: column; gap: calc(var(--u)*1); }
.edit-alpha-row { display: flex; justify-content: center; gap: calc(var(--u)*0.8); }
.edit-alpha-key { width: calc(var(--u)*5.5); height: calc(var(--u)*5.8); border-radius: calc(var(--u)*1); background: var(--key-bg); display: flex; align-items: center; justify-content: center; font-size: calc(var(--u)*2.5); color: var(--text); cursor: pointer; border: none; user-select: none; transition: transform 0.1s; }
.edit-alpha-key:active { transform: scale(0.88); }
.edit-alpha-wide { width: calc(var(--u)*9); background: var(--key-aux-bg); color: #fff; }
.edit-alpha-wide.disabled { opacity: 0.3; pointer-events: none; }
.edit-alpha-wide svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); }
.edit-actions-row { display: flex; gap: calc(var(--u)*2); width: 100%; }
.edit-del-btn { flex: 1; height: calc(var(--u)*9); border-radius: var(--radius-btn); border: none; background: #fde8e8; color: #c53030; font-size: calc(var(--u)*3); font-family: Arial, sans-serif; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: calc(var(--u)*1.5); }
.edit-del-btn svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); flex-shrink: 0; }
.edit-save-btn { flex: 2; height: calc(var(--u)*9); border-radius: var(--radius-btn); border: none; background: var(--accent); color: #fff; font-size: calc(var(--u)*3); font-family: Arial, sans-serif; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: calc(var(--u)*1.5); }
.edit-save-btn svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); flex-shrink: 0; }
.edit-save-btn.disabled { opacity: 0.4; pointer-events: none; }
.date-picker-tabs { display: flex; gap: calc(var(--u)*1.5); }
.date-tab { flex: 1; height: calc(var(--u)*8); border-radius: calc(var(--u)*1.5); border: none; font-size: calc(var(--u)*2.6); font-family: Arial, sans-serif; cursor: pointer; background: var(--key-bg); color: var(--text-muted); transition: background 0.15s, color 0.15s; }
.date-tab.active { background: var(--accent); color: #fff; }
.date-tab.disabled { opacity: 0.35; pointer-events: none; }
.date-picker-grid { display: grid; gap: calc(var(--u)*1.2); }
.date-picker-grid.cols4 { grid-template-columns: repeat(4, 1fr); }
.date-picker-grid.cols5 { grid-template-columns: repeat(5, 1fr); }
.date-picker-grid.cols7 { grid-template-columns: repeat(7, 1fr); }
.date-cell { height: calc(var(--u)*7); border-radius: calc(var(--u)*1.5); border: none; font-size: calc(var(--u)*2.6); font-family: Arial, sans-serif; cursor: pointer; background: var(--key-bg); color: var(--text); transition: background 0.12s, color 0.12s; display: flex; align-items: center; justify-content: center; }
.date-cell:active { transform: scale(0.95); }
.date-cell.selected { background: var(--accent); color: #fff; }
.date-year-nav { display: flex; align-items: center; justify-content: space-between; }
.date-nav-btn { width: calc(var(--u)*8); height: calc(var(--u)*8); border-radius: 50%; border: none; background: var(--key-bg); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.date-nav-btn.disabled { opacity: 0.3; pointer-events: none; }
.date-nav-btn svg { width: 45%; height: 45%; }
.date-nav-label { font-size: calc(var(--u)*2.8); color: var(--text-muted); }
.guestlist-modal { width: calc(var(--u)*62); padding: calc(var(--u)*5) calc(var(--u)*4) calc(var(--u)*3); gap: calc(var(--u)*2); max-height: calc(var(--h)*0.8); }
.guestlist-scroll { overflow-y: auto; width: 100%; flex: 1; -webkit-overflow-scrolling: touch; }
.guestlist-item { display: flex; align-items: center; gap: calc(var(--u)*2); padding: calc(var(--u)*2) calc(var(--u)*1); border-bottom: 1px solid #f0f0f5; cursor: pointer; }
.guestlist-item:last-child { border-bottom: none; }
.guestlist-item-icon { width: calc(var(--u)*6); height: calc(var(--u)*6); flex-shrink: 0; }
.guestlist-item-name { font-size: calc(var(--u)*3.2); font-weight: 700; color: var(--text); }
.guestlist-item-age { font-size: calc(var(--u)*2.4); color: var(--text-muted); }
.guestlist-edit-btn { width: calc(var(--u)*7); height: calc(var(--u)*7); border-radius: 50%; background: var(--key-bg); border: none; display: flex; align-items: center; justify-content: center; flex-shrink: 0; cursor: pointer; }
.guestlist-edit-btn svg { width: 55%; height: 55%; }
.guestlist-add-btn { width: 100%; height: calc(var(--u)*9); border-radius: var(--radius-btn); border: none; background: var(--accent); color: #fff; font-size: calc(var(--u)*3); font-family: Arial, sans-serif; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: calc(var(--u)*1.5); flex-shrink: 0; margin-top: calc(var(--u)*1); }
.guestlist-add-btn svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); }
.p2-orders-list { display: flex; flex-direction: column; gap: calc(var(--u)*1.5); width: 100%; }
.p2-order-modal { width: calc(var(--u)*62); align-items: stretch; }
.p2-order-modal .modal-title { text-align: left; padding-right: 0; font-size: calc(var(--u)*4); }
.p2-order-section { display: flex; flex-direction: column; gap: calc(var(--u)*1); width: 100%; }
.p2-order-row { display: flex; justify-content: space-between; gap: calc(var(--u)*2); font-size: calc(var(--u)*2.8); color: var(--text); width: 100%; }
.p2-order-divider { width: 100%; height: 1px; background: #f0eee9; }
.p2-order-summary { font-weight: 700; font-size: calc(var(--u)*3.2); align-items: center; }
.p2-order-status.paid { color: #16794a; }
.p2-order-status.pending { color: #b45309; }
.p2-order-actions { display: flex; flex-direction: column; gap: calc(var(--u)*1.5); margin-top: calc(var(--u)*3); width: 100%; }
.p2-order-actions .modal-btn { margin: 0; width: 100%; }

/* ===== PAGE 3 (Consent) ===== */
.p3-screen { flex-direction: column; overflow: hidden; }
.p3-header { flex-shrink: 0; position: relative; display: flex; flex-direction: column; align-items: center; }
.p3-back { position: absolute; left: calc(var(--u)*3); top: calc(var(--u)*3); }
.p3-exit { position: absolute; right: calc(var(--u)*3); top: calc(var(--u)*3); }
.p3-title { font-size: calc(var(--u)*5); font-weight: 900; color: var(--text); text-align: center; margin-top: calc(var(--u)*4); width: var(--col-w); }
.p3-subtitle { font-size: calc(var(--u)*2.8); font-weight: 400; color: var(--text-muted); text-align: center; margin-top: calc(var(--u)*1.5); width: var(--col-w); }

/* ТЗ v63: раньше overflow:hidden — текст согласия обрезало, когда внизу
   появился блок выбора срока. Включили прокрутку с -webkit-overflow-scrolling
   touch для гладкого скролла на iOS. min-height:0 обязателен для вложенного
   flex-контейнера, иначе он не ужимается и прокрутки не возникает.
   overscroll-behavior:contain чтобы прокрутка не прорывалась на страницу. */
.p3-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  display: flex;
  justify-content: center;
  margin-top: calc(var(--u)*3);
}
/* Тонкий скроллбар, чтобы было видно что контент прокручивается */
.p3-content::-webkit-scrollbar { width: 6px; }
.p3-content::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.18); border-radius: 3px; }
.p3-content::-webkit-scrollbar-track { background: transparent; }
.p3-inner {
  width: var(--col-w);
  display: flex;
  flex-direction: column;
  gap: calc(var(--u)*2);
  padding-bottom: calc(var(--u)*2);
}

/* Пункты */
.p3-item { display: flex; align-items: flex-start; gap: calc(var(--u)*2); }
.p3-bullet { flex-shrink: 0; width: calc(var(--u)*1.5); height: calc(var(--u)*1.5); border-radius: 50%; background: var(--accent); margin-top: calc(var(--u)*1.2); }
.p3-item-text { font-size: calc(var(--u)*2.8); color: var(--text); line-height: 1.5; font-family: Arial, sans-serif; }
.p3-item-link { color: var(--accent); text-decoration: underline; cursor: pointer; }
.p3-item-link-disabled { color: var(--text-muted); cursor: not-allowed; text-decoration: underline; opacity: 0.6; }

.p3-footer { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: calc(var(--u)*2); padding: calc(var(--u)*3) 0 calc(var(--u)*4); }

/* ТЗ v62: выбор срока согласия на p3 (общий для всех выбранных гостей).
   Для свободного визита — три пилюли «1 день / 1 месяц / 3 месяца». */
.p3-period-row {
  width: var(--col-w);
  padding: calc(var(--u)*2) calc(var(--u)*2.5);
  background: var(--accent-5, #fff7e6);
  border-radius: calc(var(--u)*1.5);
  box-sizing: border-box;
}
.p3-period-title {
  font-size: calc(var(--u)*2.6);
  font-weight: 700;
  color: var(--text);
  margin-bottom: calc(var(--u)*1.5);
  text-align: center;
}
.p3-period-opts {
  display: flex;
  gap: calc(var(--u)*1);
  justify-content: stretch;
}
.p3-period-opt {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--u)*0.8);
  padding: calc(var(--u)*1.5) calc(var(--u)*1);
  background: #fff;
  border: 2px solid rgba(0,0,0,0.08);
  border-radius: calc(var(--u)*1.2);
  cursor: pointer;
  min-width: 0;
  font-size: calc(var(--u)*2.2);
  font-weight: 600;
  color: var(--text);
  user-select: none;
  transition: border-color 0.15s, background 0.15s;
}
.p3-period-opt:has(input:checked) {
  border-color: var(--accent, #ff8800);
  background: #fff;
}
.p3-period-opt input[type="radio"] {
  margin: 0;
  width: calc(var(--u)*2.2);
  height: calc(var(--u)*2.2);
  accent-color: var(--accent, #ff8800);
  flex: 0 0 auto;
}
.p3-period-label { white-space: nowrap; }
.p3-period-hint {
  margin-top: calc(var(--u)*1.3);
  font-size: calc(var(--u)*1.8);
  color: var(--text-muted, #777);
  line-height: 1.3;
  text-align: center;
}

.p3-cb-row { width: var(--col-w); display: flex; align-items: flex-start; gap: calc(var(--u)*2.5); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.p3-cb { width: calc(var(--u)*6); height: calc(var(--u)*6); border-radius: calc(var(--u)*1.2); border: calc(var(--u)*0.4) solid var(--text-ph); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: calc(var(--u)*0.2); transition: background 0.15s, border-color 0.15s; }
.p3-cb.checked { background: var(--accent); border-color: var(--accent); }
.p3-cb svg { width: 65%; height: 65%; }
.p3-cb-label { font-size: calc(var(--u)*2.6); color: var(--text); line-height: 1.5; font-family: Arial, sans-serif; }
.p3-footer .action-btn { margin-top: 0; width: var(--col-w); }

/* Модалка fulltext-modal удалена (ТЗ п.240):
   три документа теперь открываются внешними ссылками target="_blank". */

/* ===== PAGE 4 (Tickets) ===== */
.p4-screen { flex-direction: column; overflow: hidden; }

.p4-header { flex-shrink: 0; position: relative; display: flex; flex-direction: column; align-items: center; }
.p4-back { position: absolute; left: calc(var(--u)*3); top: calc(var(--u)*3); }
.p4-exit { position: absolute; right: calc(var(--u)*3); top: calc(var(--u)*3); }
.p4-title { font-size: calc(var(--u)*5); font-weight: 900; color: var(--text); text-align: center; margin-top: calc(var(--u)*4); width: var(--col-w); }
.p4-subtitle { font-size: calc(var(--u)*2.6); color: var(--text-muted); text-align: center; margin-top: calc(var(--u)*1); width: var(--col-w); }

.p4-content { flex: 1; overflow: hidden; display: flex; justify-content: center; margin-top: calc(var(--u)*3); }
.p4-inner { width: var(--col-w); display: flex; flex-direction: column; gap: calc(var(--u)*0); overflow-y: auto; scrollbar-width: none; }
.p4-inner::-webkit-scrollbar { display: none; }

.p4-footer { flex-shrink: 0; display: flex; justify-content: center; padding: calc(var(--u)*2) 0 calc(var(--u)*4); }
.p4-footer .action-btn { margin-top: 0; width: var(--col-w); }

/* ===== ТАРИФЫ ===== */
.tariff-row { display: flex; gap: calc(var(--u)*2); margin-bottom: calc(var(--u)*3); }
.tariff-btn {
  flex: 1; border-radius: calc(var(--u)*2);
  border: calc(var(--u)*0.5) solid #ccc8c0;
  box-sizing: border-box;
  background: #fff; cursor: pointer;
  padding: calc(var(--u)*2.5) calc(var(--u)*2);
  font-family: Arial, sans-serif;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
  display: flex; flex-direction: column; align-items: center;
  box-shadow: 0 3px 10px rgba(0,0,0,0.10);
  -webkit-tap-highlight-color: transparent;
}
.tariff-btn.selected {
  border-color: var(--accent);
  border-width: calc(var(--u)*0.5);
  background: var(--accent-5);
  box-shadow: 0 3px 10px rgba(0,0,0,0.08);
}
.tariff-btn:active { transform: scale(0.97); }
.tariff-name { font-size: calc(var(--u)*3.2); font-weight: 400; color: var(--text); margin-bottom: calc(var(--u)*2.2); }
.tariff-total { font-size: calc(var(--u)*4.5); font-weight: 400; color: var(--text-muted); }
.tariff-btn.selected .tariff-name { font-weight: 700; color: var(--text); }
.tariff-btn.selected .tariff-total { font-weight: 700; color: var(--text); }
.tariff-calc { width: 100%; font-size: calc(var(--u)*2.4); color: var(--text-muted); text-align: center; margin-bottom: calc(var(--u)*0.3); }

/* ===== ДОПЫ ===== */
.items-block { margin-bottom: calc(var(--u)*2); }
.item-row {
  display: flex; align-items: center;
  padding: calc(var(--u)*1.8) 0;
  border-bottom: 1px solid #f0eee9;
  gap: calc(var(--u)*2);
}
.item-row:last-child { border-bottom: none; }
.item-info { flex: 1; min-width: 0; }
.item-name { font-size: calc(var(--u)*2.8); font-weight: 400; color: var(--text); }
.item-price { font-size: calc(var(--u)*2.2); color: var(--text-muted); margin-top: calc(var(--u)*0.2); }

.counter { display: flex; align-items: center; gap: calc(var(--u)*1.5); flex-shrink: 0; }
.counter-btn {
  width: calc(var(--u)*5.5); height: calc(var(--u)*5.8); border-radius: calc(var(--u)*1);
  background: var(--key-bg); box-shadow: none;
  display: flex; align-items: center; justify-content: center;
  font-size: calc(var(--u)*3.5); font-weight: 400; color: var(--text); cursor: pointer; border: none;
  font-family: Arial, sans-serif; line-height: 1;
  transition: transform 0.1s;
  -webkit-tap-highlight-color: transparent;
}
.counter-btn:active { transform: scale(0.88); }
.counter-val { font-size: calc(var(--u)*3); font-weight: 400; color: var(--text-muted); min-width: calc(var(--u)*4); text-align: center; }
.item-total { font-size: calc(var(--u)*3); font-weight: 400; color: var(--text-muted); min-width: calc(var(--u)*10); text-align: right; flex-shrink: 0; }

/* ===== СКИДКА / ПРОМОКОД ===== */
.discount-row {
  display: flex; align-items: center;
  padding: calc(var(--u)*2) 0;
  border-bottom: 1px solid #f0eee9;
  cursor: pointer; gap: calc(var(--u)*2);
  -webkit-tap-highlight-color: transparent;
}
.discount-label { flex: 1; font-size: calc(var(--u)*2.8); font-weight: 400; color: var(--text); }
.discount-value { font-size: calc(var(--u)*3); font-weight: 400; color: var(--text-muted); }
.discount-value.applied { color: #c53030; }
.discount-arrow { color: var(--text-muted); display: flex; align-items: center; }
.discount-arrow svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); }

/* ===== МОДАЛКА СКИДКИ ===== */
.discount-modal .modal-btn, .promo-modal .modal-btn { height: calc(var(--u)*9); }
.discount-modal { width: calc(var(--u)*62); padding: calc(var(--u)*5) calc(var(--u)*4) calc(var(--u)*3); gap: calc(var(--u)*2); }
.radio-option {
  display: flex; align-items: center; gap: calc(var(--u)*2.5);
  padding: calc(var(--u)*2) calc(var(--u)*2);
  border-radius: calc(var(--u)*2); cursor: pointer;
  background: #fff; border: calc(var(--u)*0.4) solid #e8e4df;
  transition: border-color 0.12s, background 0.12s;
  -webkit-tap-highlight-color: transparent;
}
.radio-option.selected { border-color: var(--accent); background: rgba(100,105,130,0.06); }
.radio-circle {
  width: calc(var(--u)*5); height: calc(var(--u)*5); border-radius: 50%;
  border: calc(var(--u)*0.4) solid #ccc;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: border-color 0.12s;
}
.radio-circle.checked { border-color: var(--accent); }
.radio-dot { width: calc(var(--u)*2.5); height: calc(var(--u)*2.5); border-radius: 50%; background: var(--accent); }
.radio-label { font-size: calc(var(--u)*3); color: var(--text); font-weight: 400; flex: 1; }
.radio-pct { font-size: calc(var(--u)*2.8); color: var(--text-muted); }

/* ===== МОДАЛКА ПРОМОКОДА ===== */
.promo-modal { width: calc(var(--u)*62); padding: calc(var(--u)*5) calc(var(--u)*4) calc(var(--u)*3); gap: calc(var(--u)*2.5); }
.promo-display { font-size: calc(var(--u)*4.5); font-weight: 700; color: var(--accent); min-height: calc(var(--u)*7); padding: calc(var(--u)*1) 0; border-bottom: calc(var(--u)*0.4) solid var(--accent); width: 100%; }
.promo-cursor { display: inline-block; width: 2px; height: calc(var(--u)*4.5); background: var(--accent); vertical-align: middle; margin-left: 1px; animation: blink 1s step-end infinite; }
@keyframes blink { 50% { opacity: 0; } }
.promo-error { font-size: calc(var(--u)*2.6); color: #c53030; min-height: calc(var(--u)*3.5); }
.promo-alpha-kb { display: flex; flex-direction: column; gap: calc(var(--u)*1); }
.promo-alpha-row { display: flex; justify-content: center; gap: calc(var(--u)*0.8); }
.promo-alpha-key { width: calc(var(--u)*5.5); height: calc(var(--u)*5.8); border-radius: calc(var(--u)*1); background: var(--key-bg); display: flex; align-items: center; justify-content: center; font-size: calc(var(--u)*2.5); color: var(--text); cursor: pointer; border: none; user-select: none; transition: transform 0.1s; }
.promo-alpha-key:active { transform: scale(0.88); }
.promo-alpha-wide { width: calc(var(--u)*9); background: var(--key-aux-bg); color: #fff; }
.promo-alpha-wide svg { width: calc(var(--u)*3.5); height: calc(var(--u)*3.5); }
.promo-btn-row { display: flex; gap: calc(var(--u)*2); width: 100%; }

/* ===== PAGE 5 (Payment) ===== */
.p5-screen { flex-direction: column; overflow: hidden; --p5-gap: calc(var(--u)*3); }
.p5-header { flex-shrink: 0; position: relative; display: flex; flex-direction: column; align-items: center; }
.p5-back { position: absolute; left: calc(var(--u)*3); top: calc(var(--u)*3); }

.p5-body {
  flex: 1; overflow: hidden;
  display: flex; flex-direction: column; align-items: center;
  margin-top: calc(var(--u)*2);
}

/* ===== СОСТОЯНИЕ А: QR ===== */
.p5-stateA {
  width: var(--col-w);
  display: flex; flex-direction: column; align-items: center;
}
.p5-qr-wrap {
  width: calc(var(--col-w)*0.85);
  height: calc(var(--col-w)*0.85);
  background: #fff;
  border-radius: calc(var(--u)*2);
  padding: calc(var(--u)*1.5);
  box-sizing: border-box;
  display: flex; align-items: center; justify-content: center;
}
.p5-qr-wrap img {
  width: 100%; height: 100%;
  image-rendering: pixelated;
}
/* Номер заказа под QR на стр. оплаты картой — легче и меньше, чем на page6 */
.p5-qr-code {
  margin-top: calc(var(--u)*1.5);
  font-size: calc(var(--u)*6);
  font-weight: 700;
  color: var(--accent);
  letter-spacing: calc(var(--u)*0.3);
  line-height: 1;
  text-align: center;
}
.p5-qr-code-label {
  font-size: calc(var(--u)*2.2);
  color: var(--text-muted);
  font-weight: 400;
  display: block;
  margin-bottom: calc(var(--u)*0.3);
  letter-spacing: 0;
}
.p5-qr-timer {
  margin-top: calc(var(--u)*2);
  font-size: calc(var(--u)*2.4);
  color: var(--text-muted);
  text-align: center;
}
.p5-qr-timer-val { color: var(--text); font-weight: 700; }
.p5-qr-hint {
  margin-top: calc(var(--u)*1.5);
  font-size: calc(var(--u)*2.5);
  color: var(--text-muted);
  text-align: center;
  line-height: 1.4;
}

.p5-cashier-link {
  margin-top: calc(var(--u)*2.5);
  background: #fff;
  border: calc(var(--u)*0.35) solid #e5e7eb;
  border-radius: calc(var(--u)*2.2);
  cursor: pointer;
  display: flex; align-items: center; gap: calc(var(--u)*1.5);
  padding: calc(var(--u)*1.7) calc(var(--u)*2.2);
  color: var(--text-muted);
  font-size: calc(var(--u)*2.6);
  font-family: Arial, sans-serif;
  -webkit-tap-highlight-color: transparent;
  transition: opacity 0.15s ease, transform 0.12s ease, border-color 0.15s ease;
}
.p5-cashier-link:active { opacity: 0.6; transform: scale(0.97); }
.p5-cashier-icon { display: flex; flex-shrink: 0; }
.p5-cashier-icon svg { width: calc(var(--u)*3.4); height: calc(var(--u)*3.4); display: block; }
.p5-cashier-label { white-space: nowrap; }
.p5-cashier-arrow { display: flex; flex-shrink: 0; opacity: 0.55; margin-left: calc(var(--u)*0.3); }
.p5-cashier-arrow svg { width: calc(var(--u)*3); height: calc(var(--u)*3); display: block; }

/* ===== СОСТОЯНИЕ Б: ошибка оплаты ===== */
.p5-stateB {
  width: var(--col-w);
  display: none; flex-direction: column; align-items: center;
  margin: auto 0;
}
.p5-fail-icon {
  width: calc(var(--u)*17); height: calc(var(--u)*17);
  border-radius: 50%;
  background: #fde8e8;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: calc(var(--u)*3.5);
  flex-shrink: 0;
}
.p5-fail-icon svg { width: 42%; height: 42%; }
.p5-fail-title {
  font-size: calc(var(--u)*4.4);
  font-weight: 900;
  color: var(--text);
  text-align: center;
  line-height: 1.25;
}
.p5-fail-desc {
  margin-top: calc(var(--u)*1.8);
  font-size: calc(var(--u)*2.6);
  color: var(--text-muted);
  text-align: center;
  line-height: 1.45;
}
.p5-fail-actions {
  margin-top: calc(var(--u)*5.5);
  width: 100%;
  display: flex; flex-direction: column; align-items: center;
}
.p5-fail-actions .action-btn { margin-top: 0; }

/* ===== СОСТОЯНИЕ В: ожидание (через кассира) ===== */
.p5-stateC {
  width: var(--col-w);
  display: none; flex-direction: column; align-items: center;
  margin: auto 0; text-align: center;
}
.p5-cashier-icon-big {
  width: calc(var(--u)*17); height: calc(var(--u)*17);
  border-radius: 50%;
  background: var(--accent-5);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: calc(var(--u)*3.5);
  flex-shrink: 0;
}
.p5-cashier-icon-big svg { width: 42%; height: 42%; }

/* ===== PAGE 6 (Complete) ===== */
.p6-screen { flex-direction: column; align-items: center; overflow: hidden; }

.p6-header { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; }

.p6-body {
  flex: 1; overflow: hidden;
  width: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
  padding-top: calc(var(--u)*2);
}

.p6-code-card {
  background: var(--accent-light);
  border-radius: calc(var(--u)*4);
  padding: calc(var(--u)*4) calc(var(--u)*3) calc(var(--u)*4);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.p6-qr {
  width: calc(var(--col-w)*0.85);
  height: calc(var(--col-w)*0.85);
  background: #fff;
  border-radius: calc(var(--u)*2);
  padding: calc(var(--u)*1.5);
  margin-bottom: calc(var(--u)*3);
  box-sizing: border-box;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.p6-qr img { width: 100%; height: 100%; image-rendering: pixelated; }
.p6-code {
  font-size: calc(var(--u)*10);
  font-weight: 900;
  color: var(--accent);
  letter-spacing: calc(var(--u)*0.5);
  line-height: 1;
}
.p6-status {
  margin-top: calc(var(--u)*2);
  font-size: calc(var(--u)*2.8);
  font-weight: 700;
  color: var(--accent);
}
.p6-status--paid { color: #16794a; }
.p6-status--pending { color: #b45309; }

.p6-instruction {
  margin-top: calc(var(--u)*4);
  font-size: calc(var(--u)*2.8);
  color: var(--text);
  text-align: center;
  line-height: 1.5;
  width: var(--col-w);
}
/* ============================================================
   SMS-экраны (pLS, pCS) - фиксированный лейаут без скролла
   ============================================================
   Структура col-mid:
     [page-header-logo]   фиксированная высота --header-h
     [sms-title-row]      заголовок + подзаголовок + ссылка-попап гостей (pCS)
     [sms-spacer]         flex:1 - пустой гибкий промежуток
     [sms-code-fixed]     4 слота кода + resend, прижаты к низу top-зоны
     [bottom-area]        numpad + action-btn (--bottom-h)
   Список гостей и выбор срока вынесены в попап-модалку, открывается
   по тапу на ссылку "Разрешаете вход — открыть список".
   ============================================================ */
#pageLoyaltySms .col-mid,
#pageConsentSms .col-mid {
  height: var(--h);
  display: flex;
  flex-direction: column;
  /* ТЗ v75: safety — что бы ни случилось с содержимым, экран не вылезает
     за пределы .screen; кнопка «Подтвердить согласие» видна всегда. */
  overflow: hidden;
}

/* Заголовок прижат к логотипу. ТЗ v75: разрешаем сжимать и, если контент
   всё-таки шире (очень длинный заголовок/подзаголовок), прокручивать
   внутри самой строки, не выдавливая код/клавиатуру/кнопку вниз. */
.sms-title-row {
  flex-shrink: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: calc(var(--u) * 0.5) calc(var(--u) * 2) calc(var(--u) * 1);
  text-align: center;
}
.sms-title {
  font-size: calc(var(--u) * 4.5);
  font-weight: 900;
  color: var(--text);
  line-height: 1.15;
}
.sms-subtitle {
  margin-top: calc(var(--u) * 1);
  font-size: calc(var(--u) * 2.4);
  color: var(--text-muted);
  line-height: 1.3;
}
/* ТЗ v74: одна строка на всю ширину. Шрифт подобран так, чтобы фраза
   из 2-3 строк + заголовок + поле ввода кода + клавиатура помещались
   на мобильном Safari/Chrome без обрезания кнопки «Подтвердить согласие». */
.sms-subtitle-single {
  margin-top: calc(var(--u) * 1.2);
  font-size: calc(var(--u) * 2.4);
  color: var(--text);
  line-height: 1.3;
  padding: 0;
}
.sms-guests-link-inline {
  color: var(--accent);
  text-decoration: underline;
  font-weight: 700;
  cursor: pointer;
}
.sms-guests-link-inline:hover,
.sms-guests-link-inline:active { opacity: 0.85; }

/* Ссылка-попап "Разрешаете вход — открыть список" */
.sms-guests-link {
  display: inline-block;
  margin-top: calc(var(--u) * 1.5);
  background: none;
  border: 0;
  color: var(--text);
  font-size: calc(var(--u) * 2.4);
  font-weight: 600;
  cursor: pointer;
  padding: calc(var(--u) * 1) calc(var(--u) * 2);
  font-family: inherit;
}
.sms-guests-link-cta {
  color: var(--accent);
  text-decoration: underline;
  font-weight: 700;
}

/* ТЗ v58: Срок действия согласия ПРЯМО на экране SMS (не в модалке).
   Для свободного визита — три пилюли с радио-кнопками. */
.sms-period-row {
  margin-top: calc(var(--u) * 2);
  padding: calc(var(--u) * 1.8) calc(var(--u) * 2);
  background: var(--accent-5, #fff7e6);
  border-radius: calc(var(--u) * 1.5);
}
.sms-period-title {
  font-size: calc(var(--u) * 2.4);
  font-weight: 600;
  color: var(--text);
  margin-bottom: calc(var(--u) * 1.3);
}
.sms-period-opts {
  display: flex;
  gap: calc(var(--u) * 1);
  flex-wrap: wrap;
}
.sms-period-opt {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 0.8);
  padding: calc(var(--u) * 1.2) calc(var(--u) * 1.5);
  background: #fff;
  border: 2px solid rgba(0,0,0,0.08);
  border-radius: calc(var(--u) * 1.2);
  cursor: pointer;
  min-width: 0;
  font-size: calc(var(--u) * 2.2);
  font-weight: 600;
  color: var(--text);
  transition: border-color 0.15s, background 0.15s;
  user-select: none;
}
.sms-period-opt:has(input:checked) {
  border-color: var(--accent, #ff8800);
  background: #fff;
}
.sms-period-opt input[type="radio"] {
  margin: 0;
  width: calc(var(--u) * 2.2);
  height: calc(var(--u) * 2.2);
  accent-color: var(--accent, #ff8800);
  flex: 0 0 auto;
}
.sms-period-label {
  white-space: nowrap;
}
.sms-period-hint {
  margin-top: calc(var(--u) * 1.2);
  font-size: calc(var(--u) * 1.8);
  color: var(--text-muted, #777);
  line-height: 1.3;
}

/* Гибкий промежуток - подъедает оставшееся пространство,
   прижимая код+resend к низу top-зоны (= к клавиатуре) */
.sms-spacer {
  flex: 1 1 auto;
  min-height: 0;
}

/* Код + resend, прямо над клавиатурой */
.sms-code-fixed {
  flex-shrink: 0;
  padding: calc(var(--u) * 0.5) calc(var(--u) * 2) calc(var(--u) * 0.5);
}
.sms-resend-row {
  margin-top: calc(var(--u) * 1);
  text-align: center;
  min-height: calc(var(--u) * 3.5);
}
/* ТЗ v75: убираем 4u-зазор над полем кода внутри sms-code-fixed —
   промежуток уже даёт .sms-spacer выше, лишний margin только съедает высоту
   и выталкивает action-btn за край экрана. */
#pageConsentSms .sms-code-fixed .code-area,
#pageLoyaltySms .sms-code-fixed .code-area {
  margin-top: calc(var(--u) * 1.5);
}

/* ТЗ v75: клавиатура+кнопка на SMS-экранах тесно упакованы — иначе
   «Подтвердить согласие» уезжает за нижний край адресной строки
   мобильного браузера. На экране ввода телефона (p1) верстка остаётся
   прежней. */
#pageConsentSms .bottom-area,
#pageLoyaltySms .bottom-area {
  height: auto;
  padding-bottom: calc(var(--u) * 3);
}
#pageConsentSms .numpad,
#pageLoyaltySms .numpad {
  margin-top: calc(var(--u) * 3);
}
#pageConsentSms .action-btn,
#pageLoyaltySms .action-btn {
  margin-top: calc(var(--u) * 2);
}

/* Кнопка "Повторить отправку кода" с таймером */
.sms-resend-btn {
  background: none;
  border: 0;
  color: var(--accent);
  font-size: calc(var(--u) * 2.2);
  cursor: pointer;
  text-decoration: underline;
  padding: calc(var(--u) * 0.5) calc(var(--u) * 1);
  font-family: inherit;
}
.sms-resend-btn.is-disabled {
  color: var(--text-muted);
  text-decoration: none;
  cursor: default;
  opacity: 0.7;
}

/* Модалка списка гостей (попап) */
.pCS-guests-modal { max-width: calc(var(--u) * 65); }
.pCS-guests-list {
  text-align: center;
  font-size: calc(var(--u) * 2.6);
  color: var(--text);
  line-height: 1.6;
  padding: 0 calc(var(--u) * 1);
}
.pCS-guests-list b {
  font-size: calc(var(--u) * 2.9);
  color: var(--text);
}
/* Заголовки секций в попапе (Разрешаете вход / Срок действия согласия) */
.pCS-guests-section-title {
  font-size: calc(var(--u) * 2.3);
  font-weight: 600;
  color: var(--text-muted);
  text-align: center;
  margin-top: calc(var(--u) * 2);
  margin-bottom: calc(var(--u) * 1);
  text-transform: none;
  letter-spacing: 0;
}
.pCS-period-section {
  margin-top: calc(var(--u) * 2.5);
  padding-top: calc(var(--u) * 2);
  border-top: 1px solid rgba(0,0,0,0.08);
}
.pCS-period-value {
  text-align: center;
  font-size: calc(var(--u) * 3);
  font-weight: 700;
  color: var(--accent);
  padding: calc(var(--u) * 0.5) 0;
}

/* На экране "Спасибо" подзаголовок (короткое сообщение "Пожалуйста, проходите.") */
#page6 .page-subtitle {
  font-size: calc(var(--u) * 2.6);
  line-height: 1.4;
  color: var(--text-muted);
  padding: 0 calc(var(--u) * 2);
}

/* Инфо о зале на экране "Спасибо" (во всех сценариях):
   - название зала жирным и крупным
   - описание серым
   - адрес · телефон одной строкой, телефон - кликабельная tel:-ссылка */
.p6-hall-info {
  margin-top: calc(var(--u) * 3);
  padding: 0 calc(var(--u) * 2);
  text-align: center;
  line-height: 1.4;
}
.p6-hall-name {
  font-size: calc(var(--u) * 3.4);
  font-weight: 900;
  color: var(--text);
  line-height: 1.15;
}
.p6-hall-desc {
  margin-top: calc(var(--u) * 0.6);
  font-size: calc(var(--u) * 2.6);
  color: var(--text);
}
.p6-hall-contact {
  margin-top: calc(var(--u) * 1.2);
  font-size: calc(var(--u) * 2.6);
  color: var(--text);
}
.p6-hall-phone {
  color: var(--accent);
  text-decoration: underline;
  font-weight: 700;
  -webkit-tap-highlight-color: rgba(100,105,130,0.1);
}
.p6-hall-phone:active { opacity: 0.6; }

/* Крупная дата мероприятия/посещения на экране "Спасибо" (ТЗ) */
.p6-bigdate {
  margin-top: calc(var(--u)*1);
  margin-bottom: calc(var(--u)*2);
  font-size: calc(var(--u)*7);
  font-weight: 900;
  color: var(--accent);
  text-align: center;
  line-height: 1.1;
  letter-spacing: calc(var(--u)*0.05);
  padding: 0 calc(var(--u)*2);
}
/* Бейджи статуса согласия/оплаты в карточке гостя (экран выбора) */
.guest-badges { display: inline-flex; gap: calc(var(--u)*1); margin-left: calc(var(--u)*1); vertical-align: middle; flex-wrap: wrap; }
.guest-badge {
  display: inline-flex; align-items: center; gap: calc(var(--u)*0.4);
  padding: calc(var(--u)*0.3) calc(var(--u)*1.2);
  border-radius: calc(var(--u)*1);
  font-size: calc(var(--u)*1.6);
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.guest-badge svg { width: calc(var(--u)*1.8); height: calc(var(--u)*1.8); }
.guest-badge-consent { background: #d1fae5; color: #065f46; }
.guest-badge-paid { background: #dbeafe; color: #1e40af; }
/* ТЗ v59: пилюля «находится в зале» — красным, как предупреждение.
   У такого гостя заблокирован выбор, карточка приглушена. */
.guest-badge-in-hall { background: #fee2e2; color: #991b1b; }
.guest-card.is-in-hall {
  opacity: 0.55;
  cursor: not-allowed;
  background: #f8f8f8;
}
.guest-card.is-in-hall .guest-cb { visibility: hidden; }
.guest-card.is-in-hall .guest-name,
.guest-card.is-in-hall .guest-age { color: #777; }
/* Текст-метка М/Ж внутри кнопки пола (дублирует иконку - страховка от путаницы) */
.gender-label {
  position: absolute;
  bottom: calc(var(--u)*0.3);
  right: calc(var(--u)*0.6);
  font-size: calc(var(--u)*1.6);
  font-weight: 700;
  color: var(--text-ph);
  pointer-events: none;
}
.gender-btn { position: relative; }
/* ТЗ: только силуэты, без букв «М / Ж». Иконка во всю ширину кружка.
   Голубой для М, розовый для Ж. При выборе — заливка акцентом + смена
   рамки/фона (правило .selected выше). */
.gender-icon { width: 75%; height: 75%; display: block; }
.gender-btn-m .gender-icon { color: #4aa3ff; }   /* голубой */
.gender-btn-f .gender-icon { color: #ec4899; }   /* розовый */
.gender-btn.selected .gender-icon { color: var(--accent); }
/* label оставлен в DOM-ветках других страниц — тут на всякий случай скрываем */
.gender-btn .gender-label { display: none; }

.p6-home-btn {
  margin-top: calc(var(--u)*5);
  background: #fff;
  border: calc(var(--u)*0.3) solid #e5e7eb;
  border-radius: calc(var(--u)*2.2);
  padding: calc(var(--u)*2) calc(var(--u)*4);
  font-size: calc(var(--u)*2.6);
  font-family: Arial, sans-serif;
  color: var(--text-muted);
  cursor: pointer;
  display: none;
  align-items: center;
  gap: calc(var(--u)*1.5);
  -webkit-tap-highlight-color: transparent;
  transition: opacity 0.15s ease;
}
.p6-home-btn:active { opacity: 0.6; }
.p6-home-btn-val { font-weight: 700; color: var(--text-muted); min-width: calc(var(--u)*7); display: inline-block; text-align: left; }

/* ===== LOADER ===== */
.kiosk-loader {
  position: fixed; inset: 0; z-index: 10000;
  background: rgba(255,255,255,0.7);
  display: flex; align-items: center; justify-content: center;
}
.kiosk-loader-spinner {
  width: calc(var(--u)*10); height: calc(var(--u)*10);
  border: calc(var(--u)*0.8) solid #e5e7eb;
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: kiosk-spin 0.7s linear infinite;
}
@keyframes kiosk-spin { to { transform: rotate(360deg); } }

/* ===== PAGE 5 extras ===== */
.p5-cashier-icon-big {
  width: calc(var(--u)*17); height: calc(var(--u)*17);
  border-radius: 50%; background: var(--accent-5);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: calc(var(--u)*3.5); flex-shrink: 0;
}
.p5-cashier-icon-big svg { width: 42%; height: 42%; }
.p5-stateC {
  width: var(--col-w); display: none; flex-direction: column; align-items: center;
  margin: auto 0; text-align: center;
}


/* Ссылки на внешние документы в пунктах согласия (target="_blank") */
.p3-item-link {
  color: var(--accent, #646982); text-decoration: underline;
  font-weight: 500;
}
.p3-item-link-disabled {
  color: #999; text-decoration: line-through; cursor: not-allowed;
}