/* Keep the visit quiet: one invitation, one question, one answer at a time. */
@media screen {
  .arrival-immersive .arrival-panel { bottom:max(29px,env(safe-area-inset-bottom)) }
  .arrival-immersive .arrival-welcome { font-size:16px; line-height:1.9; margin:15px 0 25px }
  .study-sound-controls { position:relative; z-index:45 }
  .study-sound-controls .arrival-sound-toggle {
    position:fixed;
    top:calc(16px + env(safe-area-inset-top,0px));
    right:max(16px,calc((100vw - 480px)/2 + 16px));
    width:44px; height:44px; min-height:44px;
    padding:11px; border:0; background:#07121750; gap:0;
  }
  .study-sound-controls .arrival-sound-toggle[hidden] { display:none }
  .study-sound-controls .arrival-sound-toggle svg { width:20px; height:20px }
  .arrival-sound-hint {
    position:fixed;
    top:calc(65px + env(safe-area-inset-top,0px));
    right:max(17px,calc((100vw - 480px)/2 + 17px));
    max-width:180px; padding:4px 7px;
    color:#d2e4e2; background:#07121770; border-radius:4px;
    font:400 10px/1.7 var(--sans); letter-spacing:0;
    pointer-events:none; animation:sound-hint-in .5s ease both;
  }
  .arrival-sound-hint[hidden] { display:none }
  body[data-view="intake"] main { border:0; min-height:100svh }
  body[data-view="intake"] .site-header,
  body[data-view="intake"] .site-footer { display:none }
  .intake-view { padding:0; background:#071217 }
  .flow-shell.flow-conversation {
    position:relative; isolation:isolate; display:flex; flex-direction:column;
    min-height:100vh; min-height:100svh;
    padding:0 27px max(27px,env(safe-area-inset-bottom));
    background:#071217; overflow:hidden;
  }
  .flow-scene { position:absolute; z-index:-1; inset:0; pointer-events:none; overflow:hidden }
  .flow-scene img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 23%; opacity:.48; filter:blur(3px); transform:scale(1.04) }
  .flow-scene > span { position:absolute; inset:0; background:linear-gradient(180deg,#07121760,#07121730 22%,#071217a6 50%,#071217d9 77%,#071217f5 100%) }
  .flow-toolbar { position:absolute; top:calc(15px + env(safe-area-inset-top,0px)); left:18px; right:18px; height:44px }
  .flow-conversation .flow-home {
    width:44px; height:44px; min-height:44px; padding:0; margin:0;
    display:grid; place-content:center; border:0; border-radius:50%;
    color:#deeeeb; background:#07121740; font:400 23px var(--sans);
  }
  .flow-dots { position:absolute; left:50%; top:19px; transform:translateX(-50%); display:flex; gap:7px }
  .flow-dots i { display:block; width:5px; height:5px; border-radius:50%; background:#bfded13b }
  .flow-dots i.is-current { background:#afe9df }
  .flow-conversation .flow-step {
    position:relative; margin-top:auto; padding-top:clamp(220px,38svh,370px);
    animation:conversation-enter .4s ease both;
  }
  .flow-speaker { color:#b7e6dc; font:400 12px/1.7 var(--serif); letter-spacing:.15em; margin:0 0 12px }
  .flow-conversation .flow-question {
    color:#edf7f4; font:400 clamp(25px,6.9vw,32px)/1.6 var(--serif);
    letter-spacing:-.035em; white-space:pre-line; margin:0;
    text-shadow:0 2px 20px #071217;
  }
  .flow-conversation .flow-description { color:#a9c5c9; font-size:13px; line-height:1.8; margin:12px 0 0 }
  .flow-conversation .flow-form { margin-top:25px; padding:0 }
  .flow-conversation .flow-field { margin:0 0 18px }
  .flow-conversation .flow-fieldset { border:0; padding:0; min-width:0 }
  .flow-conversation .flow-input {
    border:0; border-bottom:1px solid #537c86; border-radius:0;
    color:#eff8f5; background:#10252b90; box-shadow:none;
    min-height:58px; padding:15px 13px; font-size:17px; line-height:1.6;
  }
  .flow-conversation .flow-input:focus { outline:0; border-bottom-color:#b2efe2; box-shadow:0 1px 0 #b2efe2 }
  .flow-conversation .flow-input::placeholder { color:#809fa5; opacity:1 }
  .flow-conversation .flow-input:disabled { opacity:.42 }
  .flow-conversation .flow-help { margin-top:10px; color:#8facb4; font-size:11px; line-height:1.9 }
  .flow-conversation .flow-field > label:not(.flow-check),
  .flow-conversation[data-step="2"] .flow-fieldset > legend,
  .flow-conversation .flow-date-part > label,
  .flow-conversation .flow-time-grid > div > label {
    position:absolute; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip-path:inset(50%); white-space:nowrap;
  }
  .flow-conversation #flow-date-note { display:none }
  .flow-conversation .flow-segments { gap:8px; margin-top:0 }
  .flow-conversation .flow-segments span { min-height:46px; padding:10px; border-radius:6px; background:#10252b90; border-color:#34535e; color:#adc8ce; font-size:14px }
  .flow-conversation .flow-segments input:checked + span { color:#cdf6ec; background:#254f52b0; border-color:#8ccbbf }
  .flow-conversation .flow-check { color:#bed5d7; font-size:13px; gap:9px; line-height:1.8 }
  .flow-conversation .flow-check input { accent-color:#a4e8df }
  .flow-conversation .flow-time-unknown { margin-bottom:17px; padding:0; background:none; border:0 }
  .flow-conversation .flow-date-grid { grid-template-columns:1.5fr 1fr 1fr; gap:10px }
  .flow-conversation .flow-unit > span { right:12px; color:#9db9be; font-size:13px }
  .flow-conversation .flow-time-grid { gap:12px }
  .flow-conversation .flow-fieldset > legend { color:#adc6cc; font-size:12px; margin-bottom:12px }
  .flow-conversation .flow-actions { display:flex; gap:10px; margin-top:25px; padding:0 }
  .flow-conversation .flow-actions .flow-back { flex:0 0 48px; min-height:56px; padding:12px; border:1px solid #385b65; background:transparent; color:#c2d9dc; border-radius:7px; font-size:18px }
  .flow-conversation .flow-next { flex:1; min-height:56px; padding:15px 19px; font-size:15px; border-radius:7px; justify-content:space-between; background:linear-gradient(110deg,#b5eee3,#99d8de); color:#092e34; border:1px solid #bceee8 }
  .flow-conversation .flow-error { margin:14px 0; color:#f0c1b8; background:#462f3280; border-color:#8b5f62; border-radius:6px; font-size:13px; line-height:1.8 }
  .flow-review { margin-top:18px; padding:12px 0 0; border-top:1px solid #36535d70 }
  .flow-review > summary { font-size:12px; color:#9ab6bc; line-height:1.8; cursor:pointer }
  .flow-conversation .flow-summary { border:0; border-radius:0; background:transparent; padding:13px 0 0; margin:0 }
  .flow-conversation .flow-summary > div { padding:9px 0; gap:10px }
  .flow-conversation .flow-summary dt { min-width:65px; font-size:11px }
  .flow-conversation .flow-summary dd { font-size:13px }
  .flow-conversation .flow-summary button { font-size:11px; min-height:36px }
  @keyframes sound-hint-in { from { opacity:0 } to { opacity:1 } }
  @keyframes conversation-enter { from { opacity:0; transform:translateY(7px) } to { opacity:1; transform:translateY(0) } }
  @media (min-width:780px) { .flow-shell.flow-conversation { padding-inline:36px } }
  @media (max-height:720px) {
    .flow-conversation .flow-step { padding-top:190px }
    .flow-conversation .flow-question { font-size:25px; line-height:1.55 }
    .flow-conversation .flow-form { margin-top:20px }
    .flow-conversation .flow-field { margin-bottom:14px }
    .flow-conversation .flow-actions { margin-top:20px }
  }
  @media (prefers-reduced-motion:reduce) {
    .flow-conversation .flow-step,.arrival-sound-hint { animation:none }
  }
}

@media screen {
  .flow-auto .flow-step {
    margin-top:0;
    padding-top:clamp(265px,48svh,470px);
    padding-bottom:32px;
  }
  .flow-auto .flow-question { font:500 clamp(24px,6.6vw,30px)/1.55 var(--sans); letter-spacing:-.035em }
  .flow-auto .flow-form { margin-top:24px }
  .flow-options { display:flex; flex-direction:column; gap:3px }
  .flow-option {
    display:flex; align-items:center; gap:13px; width:100%; min-height:55px;
    padding:12px 0; border:0; border-radius:0; background:transparent;
    color:#dce9e8; text-align:left; font:400 16px/1.65 var(--sans);
    cursor:pointer; -webkit-tap-highlight-color:transparent;
    transition:color .15s ease;
  }
  .flow-option-circle { width:18px; height:18px; flex-shrink:0; border:1px solid #c3d9d180; border-radius:50%; position:relative }
  .flow-option[aria-pressed="true"] { color:#c3f4e7 }
  .flow-option[aria-pressed="true"] .flow-option-circle { border-color:#b0eadd }
  .flow-option[aria-pressed="true"] .flow-option-circle:after { content:""; position:absolute; inset:4px; border-radius:50%; background:#b0eadd }
  .flow-option:focus-visible { outline:2px solid #a4e8df; outline-offset:3px; border-radius:4px }
  .flow-auto .flow-description { font-size:12px; color:#adc5c8; line-height:1.8; margin-top:12px }
  .flow-auto .flow-skip {
    display:block; padding:12px 0; margin:12px 0 0; min-height:44px;
    background:transparent; border:0; color:#a6c0c5; font:400 12px/1.8 var(--sans);
    cursor:pointer; text-underline-offset:5px;
  }
  .flow-auto .flow-skip:focus-visible { outline:1px solid #a4e8df; outline-offset:3px }
  .flow-auto .flow-time-skip { margin-top:18px }
  .flow-auto .flow-time-skip .flow-option { font-size:14px }
  .flow-auto .flow-submit-native,
  .flow-auto .flow-fieldset > legend {
    position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0;
    overflow:hidden; clip-path:inset(50%); white-space:nowrap;
  }
  .flow-auto .flow-input { background:#07121730; border-bottom-color:#9fbdbb70; padding-inline:4px; font-size:20px }
  .flow-auto .flow-unit > span { right:6px }
  .flow-auto .flow-unit input { padding-right:25px }
  .flow-auto .flow-help { color:#92aeb5; font-size:11px; margin-top:10px }
  @media (max-height:720px) {
    .flow-auto .flow-step { padding-top:clamp(180px,42svh,310px); padding-bottom:25px }
  }
  @media (prefers-reduced-motion:reduce) { .flow-option { transition:none } }
}

@media screen {
  .flow-calendar { display:flex; gap:8px; margin:0 0 22px }
  .flow-calendar .flow-option {
    width:auto; min-height:42px; padding:8px 14px; gap:0;
    border:1px solid #789b9b66; border-radius:22px;
    font-size:12px; line-height:1.6; white-space:nowrap;
    background:#07121730; justify-content:center;
  }
  .flow-calendar .flow-option-circle { display:none }
  .flow-calendar .flow-option[aria-pressed="true"] { border-color:#a4e8df; background:#2854558c; color:#ddfff5 }
  .flow-calendar .flow-option:focus-visible { border-radius:22px }
}

@media screen {
  .flow-auto .flow-toolbar { z-index:10 }
}

@media screen {
  .flow-time-trigger {
    display:flex; align-items:center; gap:7px; min-height:64px; width:100%;
    padding:12px 15px; border:1px solid #567880; border-radius:9px;
    background:#112b3299; color:#e8f5f2; text-align:left; cursor:pointer;
  }
  .flow-time-trigger .time-value { font:400 25px/1.4 var(--sans); font-variant-numeric:tabular-nums }
  .flow-time-trigger .time-unit { font-size:13px; color:#b2cbd0 }
  .flow-time-trigger svg { margin-left:auto; width:18px; height:18px; color:#a7d8d0 }
  .flow-time-trigger:focus-visible { outline:2px solid #a4e8df; outline-offset:3px }
  dialog.flow-time-dialog {
    position:fixed; inset:auto 0 0; margin:0 auto; width:min(100%,480px); max-width:480px;
    max-height:min(74svh,560px); padding:18px 20px max(22px,env(safe-area-inset-bottom));
    color:#e6f3f1; background:#0c2028; border:1px solid #44646d; border-bottom:0;
    border-radius:21px 21px 0 0; overflow:hidden; box-shadow:0 -18px 70px #0007;
  }
  dialog.flow-time-dialog[open] { display:flex; flex-direction:column; gap:14px }
  dialog.flow-time-dialog::backdrop { background:#02090cb3; backdrop-filter:blur(5px) }
  .time-picker-header { display:flex; align-items:center; justify-content:space-between; gap:16px }
  .time-picker-header h2 { margin:0; color:#e7f5f2; font:500 18px/1.6 var(--sans); letter-spacing:-.02em }
  .time-picker-header > button { width:44px; height:44px; padding:0; border:0; border-radius:50%; background:#19363e; color:#c7ddd9; font-size:25px; cursor:pointer }
  .time-picker-tabs { display:grid; grid-template-columns:1fr 1fr; gap:11px }
  .time-picker-tabs button { min-height:57px; padding:10px; border:1px solid #365761; border-radius:9px; background:#132f37; color:#a9c3c9; font-size:14px; cursor:pointer }
  .time-picker-tabs button > span { color:inherit; font-size:24px; font-variant-numeric:tabular-nums }
  .time-picker-tabs button[aria-pressed="true"] { border-color:#a4e8df; color:#cbf7eb; background:#23474b }
  .time-picker-guide { margin:0; color:#a7c0c8; font-size:12px; line-height:1.8 }
  .time-picker-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:7px; overflow-y:auto; overscroll-behavior:contain; min-height:0; max-height:290px; padding:2px 1px 5px; scrollbar-width:thin; scrollbar-color:#5b9294 #102d35; touch-action:pan-y }
  .time-picker-grid button { min-height:47px; border:1px solid #294b55; border-radius:7px; background:#142e37; color:#d2e5e6; font:400 15px var(--sans); font-variant-numeric:tabular-nums; cursor:pointer }
  .time-picker-grid button small { font-size:10px; margin-left:2px; color:#9dbbc1 }
  .time-picker-grid button[aria-pressed="true"] { border-color:#b0ecdf; background:#b0ecdf; color:#0d3038 }
  .time-picker-grid button[aria-pressed="true"] small { color:#285459 }
  .flow-time-dialog button:focus-visible { outline:2px solid #b0ecdf; outline-offset:1px }
  @media(max-width:370px) { dialog.flow-time-dialog { padding-inline:16px } .time-picker-grid { gap:5px } }
}

/* Keep the experience in a phone-width canvas on larger screens. */
@media screen {
  main,.site-header,.header-inner,.footer-inner,.purchase-bar,.mobile-home-cta { width:min(100%,480px) }
  .site-header { margin-inline:auto }
}
