/* Shared simulated-date control. Deliberately avoids the browser's unstyleable calendar UI. */
.dob-control {
  display:grid;
  grid-template-columns:.8fr .8fr 1.4fr;
  gap:7px;
  padding:7px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--soft);
}

.dob-part-label { display:grid; gap:4px; min-width:0; }
.dob-part-label > span { color:var(--muted); font:500 9px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; }
.dob-part {
  width:100%;
  min-width:0;
  min-height:43px;
  appearance:textfield;
  border:1px solid transparent;
  border-radius:8px;
  background:#fff;
  color:var(--ink);
  padding:8px 6px;
  font:700 16px/1 var(--sans);
  letter-spacing:.02em;
  text-align:center;
}

.dob-part::-webkit-inner-spin-button,
.dob-part::-webkit-outer-spin-button { appearance:none; margin:0; }
.dob-part::selection { color:#fff; background:var(--blue); }
.dob-part:hover { border-color:#b9cad8; }
.dob-part:focus-visible { outline:3px solid rgba(36,107,255,.35); outline-offset:2px; border-color:var(--blue); }

@media (max-width:720px) {
  .dob-control { gap:6px; padding:6px; }
  .dob-part { min-height:46px; font-size:16px; }
}