.birth-form {
  padding: 0 0 26px;
  border-bottom: 1px solid rgba(196,169,107,.25);
}
.birth-date-label { color: #c4a96b; font-weight: 500; margin-bottom: 14px; }
.birth-wheel-labels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(100%, 520px); margin-bottom: 8px; text-align: center; color: #a7a9b5; font-size: .78rem; }
.birth-wheel-picker { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(100%, 520px); height: 132px; overflow: hidden; border: 1px solid rgba(196,169,107,.4); border-radius: 8px; background: #191b2a; }
.birth-wheel-picker::before { content: ''; position: absolute; z-index: 1; top: 44px; left: 0; right: 0; height: 44px; border-block: 1px solid rgba(217,191,142,.65); background: rgba(196,169,107,.12); pointer-events: none; }
.birth-wheel { position: relative; height: 132px; overflow-y: auto; overscroll-behavior: contain; scroll-snap-type: y mandatory; scrollbar-width: none; padding: 44px 0; touch-action: pan-y; }
.birth-wheel + .birth-wheel { border-left: 1px solid rgba(196,169,107,.13); }
.birth-wheel::-webkit-scrollbar { display: none; }
.birth-wheel:focus-visible { outline: 2px solid #d9bf8e; outline-offset: -3px; z-index: 3; }
.birth-wheel-option { display: flex; align-items: center; justify-content: center; width: 100%; height: 44px; scroll-snap-align: center; color: #898d9f; font: inherit; font-size: .95rem; cursor: pointer; user-select: none; }
.birth-wheel-option[aria-selected="true"] { color: #f0d6a0; font-size: 1.12rem; font-weight: 700; }
.birth-controls { display: flex; gap: 12px; margin-top: 16px; }
.birth-controls button {
  padding: 12px 20px; border: 0; border-radius: 7px;
  background: #c4a96b; color: #171424; font-family: inherit; font-size: .95rem; font-weight: 700; cursor: pointer;
}
.birth-controls button:hover { background: #d9bf8e; }
.birth-controls button:focus-visible { outline: 2px solid #e8e3d8; outline-offset: 2px; }
.birth-privacy { color: #9a9da8; font-size: .82rem; margin: 10px 0 0; }
#birth-error { color: #f0a49c; margin: 10px 0 0; }
.birth-summary { color: #d9bf8e; font-size: .95rem; margin: 26px 0 8px; }
.birth-card-result {
  display: grid; grid-template-columns: 170px minmax(0,1fr);
  gap: 26px; padding: 32px 0; border-bottom: 1px solid rgba(196,169,107,.22);
}
.birth-card-result img { display: block; width: 100%; height: auto; border-radius: 7px; }
.birth-card-result h2 { font-size: 1.35rem; margin: 0 0 2px; color: #d9bf8e; }
.birth-role { color: #a7a9b5; font-size: .85rem; margin: 0 0 10px; }
.birth-tagline { font-size: 1.05rem; color: #e8e3d8; font-weight: 500; }
.birth-keywords { color: #c4a96b; font-size: .85rem; }
.birth-card-result h3 { font-size: .95rem; color: #c4a96b; margin: 20px 0 6px; font-weight: 600; }
.birth-card-result p, .birth-card-result li { overflow-wrap: anywhere; }
.birth-card-result ul { padding-left: 20px; margin: 0 0 10px; }
.birth-card-result a { display: inline-block; margin-top: 12px; }
.birth-disclaimer { color: #a7a9b5; font-size: .85rem; margin: 28px 0 0; }
@media (max-width: 600px) {
  .birth-controls { flex-wrap: wrap; }
  .birth-card-result { grid-template-columns: 110px minmax(0,1fr); gap: 16px; }
  .birth-card-result h2 { font-size: 1.1rem; }
}
@media (max-width: 370px) {
  .birth-card-result { grid-template-columns: 1fr; }
  .birth-card-result img { width: 150px; }
}
