body.date-catalog:not([data-date-stage=date]) { overflow-y:auto; }
.date-catalog:not([data-date-stage=date]) .brief-studio { position:relative; inset:auto; min-height:100dvh; height:auto; overflow:visible; animation:none; }
.date-catalog:not([data-date-stage=date]) .brief-header { position:relative; }
.date-catalog:not([data-date-stage=date]) .brief-layout { min-height:calc(100dvh - 72px); height:auto; padding-top:0; }
.date-catalog .brief-results { display:block; width:100%; max-width:1160px; height:auto; padding-bottom:48px; overflow:visible; }
.date-catalog .brief-results-heading h2 { font:500 clamp(42px,5vw,66px)/1.08 var(--serif); letter-spacing:-.035em; }
.date-catalog .brief-recommendations { display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:32px; }
.date-catalog .cosmos-direction { display:flex; height:auto; flex-direction:column; padding:0; border:0; background:transparent; text-align:left; box-shadow:none; transform:none; }
.date-catalog .cosmos-direction > img { width:100%; height:auto; aspect-ratio:1.2; object-fit:cover; border-radius:0; border:0; box-shadow:none; }
.date-catalog .cosmos-direction > div { width:100%; padding:24px 0 0; border:0; margin-top:0; }
.date-catalog .cosmos-direction small { display:block; font-size:10px; color:var(--muted); letter-spacing:.1em; }
.date-catalog .cosmos-direction strong { display:block; margin:12px 0; font:500 32px/1.1 var(--serif); }
.date-catalog .cosmos-direction p { font-size:14px; color:var(--muted); line-height:1.6; }
.date-catalog .cosmos-direction span { display:block; background:var(--ink); color:var(--white); padding:16px; font-size:13px; margin-top:20px; }
.date-catalog .cosmos-direction:hover { transform:none; }
.date-catalog .cosmos-direction:hover span { background:#4b3b33; }
.date-catalog :focus-visible { outline:3px solid var(--clay); outline-offset:4px; }
.date-catalog[data-date-stage=preview] { overflow:hidden; }
.date-catalog[data-date-stage=preview] .brief-studio { position:fixed; inset:0; height:100dvh; overflow:hidden; }
.date-catalog[data-date-stage=preview] .brief-header { position:absolute; }
.date-catalog[data-date-stage=preview] .brief-layout { height:100dvh; min-height:0; padding-top:72px; }
@media(max-width:899px) {
  .date-catalog:not([data-date-stage=date]) .brief-layout { display:block; padding:28px 24px; }
  .date-catalog:not([data-date-stage=date]) .brief-index { display:none; }
  .date-catalog .brief-recommendations { grid-template-columns:1fr; gap:40px; padding:0; overflow:visible; }
  .date-catalog .brief-results-heading { padding:0; }
  .date-catalog .brief-results { padding:0 0 24px; }
  .date-catalog .cosmos-direction > img { aspect-ratio:1.2; }
  .date-catalog .cosmos-direction strong { font-size:30px; }
  .date-catalog[data-date-stage=preview] .brief-layout { padding:58px 0 0; }
  .date-catalog[data-date-stage=preview] .cosmos-preview { height:calc(100dvh - 58px); }
}

/* The decorative circle must not create a second scroll axis on date forms. */
.date-catalog .brief-header > button { grid-column:3; justify-self:end; min-height:44px; min-width:44px; }
.date-catalog .brief-form fieldset { min-width:0; }
@media(max-width:899px) {
  .date-catalog .brief-input-panel { min-width:0; }
  .date-catalog .brief-input-panel::before { display:none; }
  .date-catalog .special-date-field { grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr) minmax(0,.7fr); }
  .date-catalog .brief-form .special-date-field select,
  .date-catalog .brief-form .special-date-field input { font-size:21px; padding-right:4px; }
}