/* Entry doors (invitation, join, sign-in, link sent, confirm, closed, errors) and the Garden.
   Scoped to their main.mode-* shells; loads after style.css and never restyles You, claims or records. */

/* ---------- entry: the wreath, the question, one column ---------- */
.entry-intro,.entry-door{text-align:center}
.entry-intro .wreath,.entry-door .wreath{display:block;width:44px;height:auto;margin:8px auto 0}
.entry-intro h1.q,.entry-door h1.q{margin:18px auto 14px}
.entry-door>p{text-align:center}
.entry-door form{text-align:left}
.night-label{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0 0 4px}
.night-label .lbl{margin:0;color:var(--ink)}
.night-label .lbl+.lbl{color:var(--grey)}
.entry-card form{margin:8px 0 0}
.entry-card label:first-of-type{margin-top:10px}
.entry-card input:not([type=hidden]):not([type=checkbox]):focus{border-bottom-width:2px;padding-bottom:7px}
.entry-card .choice{margin-top:18px}
.entry-card .small{text-align:center}
.entry-card .button{margin-top:20px}
.split-form .form-note{margin:10px 0 0}
.entry-door .links,.split-form .links{margin-top:12px}

/* check your inbox: the typed address, then a quiet way back */
.sent-to{display:flex;flex-direction:column;align-items:center;gap:2px;margin:16px 0 4px}
.sent-to .lbl{margin:0}
.sent-email{font-weight:400;font-size:16px;overflow-wrap:anywhere;max-width:100%}
.entry-check .recovery{margin:0 auto;max-width:34ch}
.entry-check .links{margin-top:6px}

/* working: a submitted button says so and cannot be sent twice */
.button.is-busy{cursor:progress;opacity:.72;text-decoration:none}
.pull.is-busy{cursor:progress}
.pull.is-busy::before{border-style:dashed;animation:pull-wait 1.2s linear infinite}
@keyframes pull-wait{to{transform:rotate(360deg)}}

@media(min-width:700px){
  main.form-shell.mode-join,main.form-shell.mode-login,main.form-shell.mode-check,main.form-shell.mode-session,
  main.form-shell.mode-closed,main.form-shell.mode-error,main.form-shell.mode-garden_missing,main.has-nav.mode-garden_error{max-width:560px;padding-top:clamp(40px,7vh,88px)}
  .entry-door{border:1px solid var(--line);padding:36px 40px 32px}
  .entry-door .wreath{width:52px}
  .entry-door h1.q{font-size:26px}
  main.mode-invite{max-width:620px;padding-top:40px}
  .entry-intro .wreath{width:60px}
}

/* invitation, desktop: wreath + question + night on the left, the fields in a hairline card on the right */
@media(min-width:900px){
  main.mode-invite{max-width:1080px;padding-top:clamp(48px,9vh,96px)}
  main.mode-invite .split{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:clamp(48px,7vw,104px);min-height:0}
  .entry-intro{display:flex;flex-direction:column;align-items:center;gap:0}
  .entry-intro .wreath{width:76px}
  .entry-intro h1.q{font-size:clamp(30px,2.6vw,36px);max-width:16ch;margin:26px auto 22px}
  .split-form.entry-card{border:1px solid var(--line);padding:32px 36px 28px;margin:0}
}

/* ---------- the garden ---------- */
.garden-head .t{overflow-wrap:anywhere}
.mode-garden .voice-line{max-width:46ch}
.member-card .evt-links{display:flex;flex-wrap:wrap;gap:0 20px;margin:8px 0 -6px}
.evt-link{display:inline-flex;align-items:center;min-height:44px;font-family:var(--label);font-size:11px;letter-spacing:var(--track);text-transform:lowercase;color:var(--ink);text-underline-offset:5px}
.evt-link:hover{text-decoration-thickness:2px}
.garden-rail .evt .button{min-height:48px}
.rail-pulls .lbl{margin:28px 0 8px}
.rail-pulls .empty{margin:0;padding:12px 0;border-top:1px solid var(--line);font-size:13px}
.rail-list a{gap:12px;padding:6px 0;letter-spacing:.08em;text-transform:lowercase}
.rail-list img{width:40px;height:40px;object-fit:contain;flex:none}
.rail-list .rail-name{flex:1 1 auto;min-width:0;line-height:1.4}
.rail-list .dot{flex:none}
.rail-list a:hover .rail-name{text-decoration:underline;text-underline-offset:4px}

/* cards: a visible ✦ on every rei, ink when saved, with the word beside the count */
.mode-garden .rei-card{padding:16px 10px 14px}
.mode-garden .rei-card img{width:80%;margin-top:14px}
.mode-garden .rei-card .count{font-size:10.5px;line-height:1.5}
.rei-card .yours{color:var(--ink)}
.mode-garden .rei-link:focus-visible{outline-offset:-2px}
.mode-garden .pull{top:4px;right:4px}
.mode-garden .pull::before{width:32px;height:32px}
.mode-garden .pull span[aria-hidden]{font-size:14px}
.mode-garden .pull.gate::before{border-color:var(--ink)}
.mode-garden .pull:disabled{color:var(--muted)}
.mode-garden .pull:disabled::before{border-color:var(--muted)}
.mode-garden .coming-soon{padding:56px 20px}

@media(min-width:700px){
  .mode-garden .rei-card{padding:22px 16px 18px}
  .mode-garden .pull{top:8px;right:8px}
  .mode-garden .rei-card h2{font-size:12.5px}
  .mode-garden .rei-card .count{font-size:11px}
}
@media(min-width:1024px){
  .mode-garden .head .t{font-size:30px;line-height:1.2}
  .mode-garden .lbl.meta{margin-top:8px}
  .mode-garden .voice-line{font-size:20px;margin:8px 0 28px}
  .mode-garden .garden-layout{grid-template-columns:280px minmax(0,1fr);gap:48px}
  .mode-garden .garden-rail{padding-top:0}
  .mode-garden .garden-rail .evt{padding:18px 18px 16px}
  .mode-garden .collection{margin-top:0;gap:18px}
  .mode-garden .rei-card img{width:78%}
}
@media(max-width:699px){
  .mode-garden .garden-rail .evt{margin:14px 0 4px}
  .mode-garden .collection{margin-top:12px}
}
@media(prefers-reduced-motion:reduce){.pull.is-busy::before{animation:none}}

@media(min-width:1024px){.mode-garden .head .t{font-size:25px}.mode-garden .voice-line{font-size:18px;margin-bottom:20px}}
.mode-session .entry-door>p{font-size:14px;color:var(--muted)}
.mode-session .entry-door h1.q{font-size:24px;margin:14px auto}
.mode-session .entry-door .wreath{width:44px}
.mode-session .entry-door .button{margin-top:14px}
@media(min-width:700px){main.form-shell.mode-session{max-width:480px}.mode-session .entry-door{padding:28px 32px}}
