/* ============ Wedyay · sign in by email + your invitations (account.html) ============
   Tokens, header, buttons and blobs come from studio.css; this file is the card. */
#account{min-height:100svh;display:flex;flex-direction:column;align-items:center;padding:92px 16px 40px}
.a-card{
  max-width:520px;width:100%;text-align:center;
  background:var(--paper);border:1px solid rgba(169,131,56,.3);border-radius:30px;
  padding:44px 30px 34px;box-shadow:var(--shadow-lg);
  position:relative;overflow:hidden;
}
.a-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:5px;
  background:linear-gradient(90deg,var(--blush-deep),var(--gold),var(--sage),var(--maroon),var(--blush-deep));
  background-size:220% 100%;animation:ribbon 9s linear infinite;
}
.a-emo{font-size:34px;margin-bottom:8px}
.a-card h1{font-size:clamp(34px,8vw,46px);margin-bottom:12px}
.a-card h1 em{font-weight:600}
.a-lede{color:var(--ink-soft);font-size:16px;line-height:1.7;max-width:400px;margin:0 auto 22px}
.a-lede b{color:var(--ink);font-weight:500;word-break:break-all}

/* the form */
.a-form{display:flex;flex-direction:column;gap:10px;text-align:left;max-width:400px;margin:0 auto}
.a-label{font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-left:4px}
.a-input{
  font-family:inherit;font-size:16px;color:var(--ink);background:var(--paper);
  border:1px solid rgba(38,33,26,.22);border-radius:14px;padding:14px 16px;width:100%;outline:none;
  transition:border-color .25s ease,box-shadow .25s ease;
}
.a-input:focus{border-color:var(--maroon);box-shadow:0 0 0 3px rgba(126,47,68,.12)}
.a-form .btn-wide{margin-top:4px}

/* notes, the same green note as the Studio's receipt box; warn = rose */
.a-note{font-size:14px;line-height:1.55;color:var(--ink);background:rgba(157,175,142,.18);border:1px solid rgba(92,108,76,.28);border-radius:14px;padding:10px 14px;margin:14px auto 0;max-width:400px;text-align:left}
.a-note.warn{background:rgba(196,88,124,.10);border-color:rgba(156,36,71,.30)}
.a-note .linkish{font-size:inherit;display:inline;padding:0}
.a-who{font-size:14px;color:var(--ink-soft);margin:-4px 0 22px;word-break:break-all}
.a-who .linkish{font-size:inherit;display:inline;padding:0}

/* the invitations */
.a-orders{display:flex;flex-direction:column;gap:12px;text-align:left;max-width:420px;margin:0 auto 18px}
.a-order{border:1px solid rgba(169,131,56,.3);border-radius:18px;padding:16px 16px 14px;background:var(--paper);box-shadow:var(--shadow-sm)}
.a-order-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.a-order-head b{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:22px;line-height:1.15;color:var(--ink)}
.a-pill{font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;border-radius:99px;padding:4px 10px;white-space:nowrap;border:1px solid rgba(169,131,56,.4);color:var(--ink-soft)}
.a-pill.ready{background:rgba(157,175,142,.22);border-color:var(--sage-deep);color:var(--sage-deep)}
.a-pill.now{background:rgba(126,47,68,.08);border-color:rgba(126,47,68,.4);color:var(--maroon)}
.a-pill.snag{background:rgba(196,88,124,.10);border-color:rgba(156,36,71,.35);color:var(--red)}
.a-order-meta{font-size:13.5px;color:var(--ink-soft);margin:4px 0 12px}
.a-order-actions{display:flex;flex-wrap:wrap;gap:8px}
.a-order-actions .btn{padding:11px 18px;font-size:14px;flex:1 1 auto}
.a-empty{font-size:14.5px;color:var(--ink-soft);line-height:1.55;max-width:400px;margin:0 auto 16px;text-align:left}
.a-empty b{color:var(--ink);font-weight:500}

/* paid with a different email */
.a-claim{text-align:left;max-width:400px;margin:0 auto 14px;border-top:1px solid rgba(169,131,56,.25);padding-top:14px}
.a-claim summary{cursor:pointer;color:var(--maroon);font-size:14.5px;font-weight:500;list-style:none;text-decoration:underline;text-underline-offset:3px}
.a-claim summary::-webkit-details-marker{display:none}
.a-claim .a-form{margin-top:12px}

.a-card .w-micro{margin-top:18px}
.a-card .w-micro a{color:var(--maroon)}
.a-foot{text-align:center;font-size:13.5px;color:var(--ink-soft);margin-top:18px}
.a-foot a{color:var(--maroon)}
@media(prefers-reduced-motion:reduce){.a-card::before{animation:none}}