:root{--account-bg:#050607;--account-panel:#0b0d0f;--account-card:#16181b;--account-text:#f7f7f5;--account-muted:#b6b9b5;--account-gold:#e0b86f;--account-line:#34373b}
body{background:var(--account-bg)!important;color:var(--account-text)!important}
.page{grid-template-columns:minmax(420px,1.08fr) minmax(420px,.92fr);background:var(--account-bg)}
.story{isolation:isolate;min-height:100vh;padding:clamp(32px,6vw,84px);background:#080a0a;color:#fff}
.story-image{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% center}
.story::before{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgba(3,5,4,.88),rgba(3,5,4,.32) 72%),linear-gradient(0deg,rgba(3,5,4,.78),transparent 58%);content:""}
.story::after{z-index:-1;inset:8%;width:auto;height:auto;border:1px solid rgba(224,184,111,.26);border-radius:28px}
.brand{font-family:"DM Sans",system-ui,sans-serif;font-size:18px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;text-shadow:0 2px 16px rgba(0,0,0,.5)}
.brand-mark{width:48px;height:48px;border-color:var(--account-gold);color:var(--account-gold);font-size:21px}
.eyebrow{color:var(--account-gold)}
.story h1{max-width:680px;color:#fff;font-family:Italiana,Georgia,serif;font-size:clamp(54px,7vw,92px);line-height:.94;text-shadow:0 3px 25px rgba(0,0,0,.55)}
.story p:last-child{max-width:510px;color:rgba(255,255,255,.82);font-size:16px;text-shadow:0 2px 16px rgba(0,0,0,.5)}
.account-area{background:var(--account-panel)}
.card{border-color:var(--account-line);background:var(--account-card);box-shadow:0 28px 80px rgba(0,0,0,.38)}
.card h2{color:var(--account-text);font-family:Italiana,Georgia,serif}
.intro,.small,.account-separator{color:var(--account-muted)}
label{color:#d2d4d5}
input{border-color:var(--account-line);background:#0d0f11;color:#fff}
input::placeholder{color:#85898d}
input:focus,.button:focus-visible,.story a:focus-visible{outline:3px solid #f0c77f;outline-offset:3px}
.button{border:1px solid var(--account-gold);border-radius:999px;background:var(--account-gold);color:#171008}
.button:hover{background:#f0c77f}
.button.secondary,.oauth-button{border-color:var(--account-line);background:#0d0f11;color:var(--account-text)}
.button.secondary:hover,.oauth-button:hover{background:#202326}
.button.supplier-auth-entry{border-color:var(--account-gold);background:transparent;color:var(--account-gold)}
.message{background:#0d0f11;color:#d2d4d5}
.message.error{background:#241416;color:#ffc9c9;border-color:#754447}
.message.ok{background:#10231d;color:#b6e6cb;border-color:#386b57}
.auth-divider::before,.auth-divider::after,.account-separator::before,.account-separator::after{background:var(--account-line)}
@media(max-width:820px){.page{grid-template-columns:1fr}.story{min-height:390px;padding:28px}.story-image{object-position:58% center}.story::before{background:linear-gradient(0deg,rgba(3,5,4,.92),rgba(3,5,4,.22))}.story::after{inset:18px}.story-copy{margin-top:82px}.story h1{font-size:clamp(48px,13vw,66px)}.account-area{padding:20px}.card{border-radius:22px}}
@media(max-width:480px){.story{min-height:430px}.story-image{object-position:61% center}.story p:last-child{font-size:14px}.card{padding:26px 21px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}


/* WF-AUTH-023: readable legal acceptance on small screens. */
.legal-choice {
  min-width: 0;
  border-color: var(--account-line);
  background: var(--account-panel);
  color: var(--account-text);
}
.legal-choice legend {
  max-width: 100%;
  color: var(--account-gold);
  line-height: 1.4;
}
.legal-choice label {
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  color: var(--account-text);
  font-size: 16px;
  line-height: 1.6;
}
.legal-choice label span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.legal-choice input {
  width: 22px;
  height: 22px;
  min-height: 22px;
  accent-color: var(--account-gold);
}
.legal-choice a {
  color: var(--account-gold);
}
@media (max-width: 480px) {
  .legal-choice { padding: 16px; }
  .legal-choice label { gap: 10px; font-size: 16px; }
}
.wedding-settings{margin-top:28px;padding-top:24px;border-top:1px solid var(--account-line);min-width:0}
#weddingSettings{scroll-margin-top:100px}
.wedding-settings h3{font-size:22px;color:var(--account-text)}
.wedding-settings .field{margin-top:14px}
.wedding-settings button{margin-top:20px}
.wedding-settings input:disabled{opacity:.75}
.context-choice span,.wedding-settings .small{overflow-wrap:anywhere}
