/* Rose Workground sign-in, shared by the public page and the account gate. */
body:has(.layout),
.auth-gate { background: #f3e9de; }

.layout,
.auth-experience {
  width: min(1300px, 100%);
  min-height: min(760px, calc(100dvh - 64px));
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  border: 1px solid #e6d8cc;
  border-radius: 24px;
  box-shadow: 0 28px 85px rgba(62, 32, 17, .13);
}

.story,
.auth-story {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 0;
  padding: clamp(38px, 5vw, 70px);
  background: radial-gradient(ellipse at 102% 91%, #4f210f 0, #29180f 31%, #140e0b 70%);
  color: #fff9f4;
}
.story::before,
.auth-story::before {
  content: "";
  position: absolute;
  inset: auto -85% -72% auto;
  width: 125%;
  height: auto;
  aspect-ratio: 1;
  border: 1px solid rgba(255, 119, 55, .7);
  border-radius: 50%;
  background: radial-gradient(circle at 30% 18%, rgba(255, 88, 31, .21), transparent 51%);
  box-shadow: 0 0 30px rgba(255, 97, 35, .55), 0 0 105px rgba(255, 97, 35, .23), inset 0 0 45px rgba(255, 93, 34, .13);
  pointer-events: none;
  z-index: 0;
}
.story::after,
.auth-story::after {
  content: "";
  position: absolute;
  display: block;
  right: -69%;
  bottom: -91%;
  width: 113%;
  aspect-ratio: 1;
  border: 1px solid rgba(255, 147, 93, .18);
  border-radius: 50%;
  box-shadow: 0 0 0 95px rgba(255, 119, 55, .025);
  pointer-events: none;
  z-index: 0;
}
.story > *,
.auth-story > * { position: relative; z-index: 1; }
.brand,
.auth-brand { min-height: 44px; display: flex; align-items: center; color: #ff783b; font-size: 15px; font-weight: 800; letter-spacing: .16em; line-height: 1; text-transform: uppercase; }
.story-copy,
.auth-story-copy { margin: clamp(42px, 6vh, 76px) 0 0; max-width: 560px; }
.eyebrow,
.auth-eyebrow { display: none; }
.story h1,
.auth-story-copy h2 { font: 600 clamp(48px, 4.9vw, 70px)/.99 Georgia, "Times New Roman", serif; letter-spacing: -.055em; }
.story h1 em,
.auth-story-copy h2 em { color: #ff682e; font-weight: 500; }
.story-copy p:last-child,
.auth-story-copy > p:last-child { max-width: 390px; margin: 23px 0 0; color: #d2c4bb; font-size: 17px; line-height: 1.48; }
.rose-benefits { display: grid; gap: 17px; margin-top: 40px; padding-top: 26px; max-width: 410px; border-top: 1px solid rgba(255, 255, 255, .16); }
.rose-benefit { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 15px; }
.rose-benefit-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; background: rgba(255, 107, 43, .10); color: #ff742e; }
.rose-benefit-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rose-benefit b { display: block; color: #fff9f4; font-size: 14px; line-height: 1.2; }
.rose-benefit small { display: block; margin-top: 3px; color: #a99d96; font-size: 12px; line-height: 1.3; }

.panel,
.auth-card { padding: clamp(40px, 6vw, 90px); background: #fffaf4; }
.panel form,
.auth-card-inner { max-width: 405px; }
.form-eyebrow,
.auth-form-eyebrow { display: none; }
.panel h2,
.auth-card h1 { font: 400 clamp(38px, 3.3vw, 47px)/1.03 Georgia, "Times New Roman", serif; letter-spacing: -.055em; }
.intro,
.auth-card-inner > p:not(.auth-form-eyebrow) { max-width: 360px; margin: 13px 0 25px; color: #6d665f; font-size: 14px; line-height: 1.45; }
.field label,
.auth-card label { color: #302a25; font-size: 13px; font-weight: 720; }
.field input,
.auth-card input { height: 49px; border-color: #dfd0c3; border-radius: 9px; background: #fffaf6; }
.field input::placeholder,
.auth-card input::placeholder { color: #a99e95; }
.field input:focus,
.auth-card input:focus { border-color: #f07840; box-shadow: 0 0 0 3px rgba(255, 103, 44, .12); }
.reveal,
.auth-reveal { background: transparent; color: #695d54; }
.submit,
.auth-card .account-submit { height: 51px; border-radius: 9px; background: #ff5722; color: #fff; box-shadow: 0 8px 18px rgba(255, 87, 34, .13); }
.submit:hover,
.auth-card .account-submit:hover { background: #e74e1d; }
.help,
.auth-card-foot { color: #796f67; }
.help a,
.switch-mode,
.auth-card-foot a { color: #cf4e22; }
.divider { background: #e7dcd2; }
.auth-card-foot { justify-content: flex-start; }
.help { font-size: 13px; }
.help .switch-mode { font-size: inherit; }
.field input:-webkit-autofill { -webkit-text-fill-color: #211813; -webkit-box-shadow: 0 0 0 1000px #fffaf6 inset; box-shadow: 0 0 0 1000px #fffaf6 inset; }
.payment-state { margin: -5px 0 4px; padding: 12px 14px; border: 1px solid #ead9c8; border-radius: 9px; background: #f9f2e9; color: #75583e; font-size: 13px; line-height: 1.45; }
.payment-state.verified { border-color: #c9dfce; background: #edf7ee; color: #315e3c; font-weight: 730; }
.payment-state[hidden], .invite-verified[hidden] { display: none; }

.invite-sent { display: none; width: 100%; max-width: 405px; margin: auto; }
.signup-mode.link-sent .signup { display: none; }
.signup-mode.link-sent:not(.show-login) .invite-sent { display: grid; align-content: center; }
.invite-mark { display: grid; place-items: center; width: 62px; height: 62px; margin-bottom: 25px; border: 1px solid #f5c2aa; border-radius: 17px; background: #fff0e7; color: #df5928; }
.invite-mark svg { width: 36px; height: 36px; }
.invite-kicker { margin: 0 0 9px; color: #c34e24; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.invite-verified { width: fit-content; margin: 0 0 15px; padding: 8px 11px; border: 1px solid #c9dfce; border-radius: 999px; background: #edf7ee; color: #315e3c; font-size: 12px; font-weight: 750; }
.invite-description { margin: 17px 0 12px; color: #6d665f; font-size: 15px; line-height: 1.55; }
.invite-email { width: fit-content; max-width: 100%; margin: 0 0 30px; padding: 10px 14px; overflow-wrap: anywhere; border: 1px solid #e7d9ce; border-radius: 8px; background: #f9f2ec; color: #2d231e; font-size: 14px; font-weight: 700; }
.signup-mode.link-sent.unlinked .invite-email { margin-bottom: 10px; }
.invite-next { display: grid; grid-template-columns: 30px 1fr; gap: 11px; padding: 16px 0; border-top: 1px solid #e9ded5; }
.invite-next[hidden] { display: none; }
.invite-next-number { padding-top: 2px; color: #e2602f; font-size: 12px; font-weight: 800; letter-spacing: .06em; }
.invite-next b { display: block; color: #30241f; font-size: 14px; }
.invite-next small { display: block; margin-top: 4px; color: #786d65; font-size: 13px; line-height: 1.45; }
.invite-fine { margin: 13px 0 0; color: #796e66; font-size: 12px; line-height: 1.5; }
.invite-edit { width: 100%; height: 49px; margin-top: 25px; border: 1px solid #dbc9bc; border-radius: 9px; background: transparent; color: #493329; font-size: 13px; font-weight: 750; }
.invite-edit:hover { border-color: #d36e45; color: #b34721; }
.invite-edit span { margin-left: 5px; }
.invite-sent .help { margin-top: 21px; }

@media (max-width: 900px) {
  .layout,
  .auth-experience { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .story,
  .auth-story { padding: 40px; }
  .panel,
  .auth-card { padding: 40px; }
  .story h1,
  .auth-story-copy h2 { font-size: 49px; }
  .rose-benefits { gap: 12px; margin-top: 28px; }
}
@media (max-width: 760px) {
  body:has(.layout),
  .auth-gate { background: #fffaf4; }
  .layout,
  .auth-experience { width: 100%; min-height: 100dvh; display: flex; flex-direction: column; border: 0; border-radius: 0; box-shadow: none; }
  .story,
  .auth-story { min-height: 0; padding: 25px 25px 29px; }
  .story::before,
  .auth-story::before { display: none; }
  .story::after,
  .auth-story::after { display: none; }
  .story-copy,
  .auth-story-copy { margin: 26px 0 0; }
  .story h1,
  .auth-story-copy h2 { font-size: clamp(34px, 8vw, 46px); }
  .story-copy p:last-child,
  .auth-story-copy > p:last-child { display: block; max-width: 340px; margin-top: 11px; font-size: 13px; }
  .rose-benefits { display: none; }
  .panel,
  .auth-card { flex: 1; padding: 35px 25px 50px; }
  .panel h2,
  .auth-card h1 { font-size: 37px; }
}