:root {
  --account-ink: #2d2018;
  --account-muted: #75675e;
  --account-saffron: #d86d2a;
  --account-saffron-dark: #a94b18;
  --account-gold: #edb84f;
  --account-cream: #fffaf1;
  --account-line: #eadccb;
  --account-green: #27745b;
  --account-shadow: 0 24px 70px rgba(75, 43, 22, .13);
}

.account-page { color: var(--account-ink); background: #fbf7f0; }
.account-main { min-height: 62vh; background: radial-gradient(circle at 8% 8%, rgba(237,184,79,.13), transparent 28%), #fbf7f0; padding: 48px 20px 72px; }
.account-main h1, .account-main h2, .account-main h3 { font-family: Georgia, 'Times New Roman', serif; font-style: normal; text-transform: none; }
.account-local-banner { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 9px 18px; color: #59300c; background: #fff0c7; border-block: 1px solid #eccd79; font-size: 13px; }
.account-local-banner strong { text-transform: uppercase; letter-spacing: .09em; font-size: 11px; }
.account-login-shell { width: min(1100px, 100%); margin: 0 auto; display: grid; grid-template-columns: .9fr 1.1fr; border: 1px solid var(--account-line); border-radius: 28px; overflow: hidden; background: #fff; box-shadow: var(--account-shadow); }
.account-login-story { position: relative; overflow: hidden; padding: clamp(38px, 6vw, 72px); color: #fff; background: linear-gradient(155deg, #863b1a, #bd5523 54%, #e38932); }
.account-login-story::before { content: ""; position: absolute; inset: 0; opacity: .14; background-image: radial-gradient(circle at 2px 2px, #fff 1.3px, transparent 1.4px); background-size: 24px 24px; }
.account-login-story > * { position: relative; z-index: 1; }
.account-login-story h1 { max-width: 420px; margin: 10px 0 18px; color: #fff; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(38px, 5vw, 62px); line-height: 1.04; }
.account-lead { max-width: 440px; color: rgba(255,255,255,.89); font-size: 17px; line-height: 1.7; }
.account-eyebrow { margin: 0; color: var(--account-saffron-dark); text-transform: uppercase; letter-spacing: .14em; font-weight: 800; font-size: 11px; }
.account-login-story .account-eyebrow { color: #ffe4a8; }
.account-benefits { display: grid; gap: 14px; margin: 32px 0 0; padding: 0; list-style: none; }
.account-benefits li { display: flex; align-items: flex-start; gap: 11px; color: rgba(255,255,255,.94); }
.account-benefits i { display: grid; place-items: center; width: 25px; height: 25px; margin-top: -1px; border-radius: 50%; color: #713212; background: #ffd783; font-size: 11px; }
.account-sacred-mark { position: absolute; right: -35px; bottom: -55px; width: 220px; height: 220px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; }
.account-sacred-mark::before, .account-sacred-mark::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; inset: 25px; }
.account-sacred-mark::after { inset: 50px; }
.account-sacred-mark span { font-size: 65px; color: rgba(255,255,255,.7); }
.account-auth-card { padding: clamp(30px, 5vw, 64px); align-self: center; }
/* The photo shortcut opens the existing authentication card before any intro. */
.account-photo-contributor-entry .account-login-shell { width: min(560px, 100%); grid-template-columns: minmax(0, 1fr); }
.account-photo-contributor-entry .account-login-story { display: none; }
.account-photo-contributor-entry .account-auth-card { display: flex; flex-direction: column; min-width: 0; padding: 24px 20px 28px; }
.account-photo-contributor-entry .account-entry-tabs { order: -3; margin-bottom: 18px; }
.account-photo-contributor-entry .account-auth-heading { order: -2; margin-bottom: 16px; }
.account-photo-contributor-entry .account-auth-heading h1,
.account-photo-contributor-entry .account-auth-heading h2 { margin: 0 0 8px; font-size: 26px; }
.account-photo-contributor-entry .account-google-button,
.account-photo-contributor-entry .account-fixture-block { order: -1; }
.account-photo-contributor-entry .account-entry-choice { margin: 16px 0 20px; }
.account-google-button { width: 100%; min-width: 0; }
.account-entry-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; margin-bottom: 32px; border: 1px solid var(--account-line); border-radius: 13px; background: #faf5ed; }
.account-entry-tabs a { padding: 11px 14px; border-radius: 10px; color: var(--account-muted); text-align: center; font-weight: 700; }
.account-entry-tabs a.is-active { color: #783513; background: #fff; box-shadow: 0 3px 14px rgba(67,37,20,.1); }
.account-auth-heading { margin-bottom: 24px; }
.account-auth-heading > p { margin: 0 0 5px; color: var(--account-saffron-dark); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.account-auth-heading h2 { margin: 0 0 8px; font-family: Georgia, 'Times New Roman', serif; font-size: 34px; }
.account-entry-choice { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -8px 0 20px; padding: 10px 12px; border: 1px solid var(--account-line); border-radius: 11px; background: #fffaf1; color: var(--account-muted); font-size: 13px; }
.account-entry-choice a { color: var(--account-saffron-dark); font-weight: 900; text-decoration: underline; text-underline-offset: 3px; }
.account-role-note { display: block; color: var(--account-muted); font-size: 13px; }
.account-provider-button, .account-primary-button, .account-secondary-button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 11px 18px; border-radius: 11px; font-weight: 800; transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.account-provider-button { border: 1px solid #d8cec3; color: #3f342d; background: #fff; }
.account-provider-button:hover, .account-secondary-button:hover { transform: translateY(-1px); box-shadow: 0 8px 22px rgba(65,39,21,.1); }
.account-provider-button--disabled { color: #a49a92; background: #f4f1ed; cursor: not-allowed; }
.account-fixture-block { display: grid; gap: 8px; }
.account-fixture-label, .account-test-code { margin: 0 0 6px; padding: 8px 10px; border-radius: 8px; color: #6e4a16; background: #fff5d9; font-size: 12px; }
.account-fixture-block form { margin: 0; }
.account-divider { display: flex; align-items: center; gap: 12px; margin: 22px 0; color: #92857c; font-size: 12px; text-transform: uppercase; letter-spacing: .09em; }
.account-divider::before, .account-divider::after { content: ""; flex: 1; height: 1px; background: var(--account-line); }
.account-email-form, .account-profile-form, .account-otp-form, .account-claim-form { display: grid; gap: 10px; }
.account-email-form label, .account-profile-form label, .account-otp-form label, .account-claim-form label { font-weight: 800; font-size: 13px; }
.account-page input[type="text"], .account-page input[type="tel"], .account-page input[type="email"] { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid #cfc2b5; border-radius: 10px; color: var(--account-ink); background: #fff; }
.account-page input:focus { outline: 3px solid rgba(216,109,42,.18); border-color: var(--account-saffron); }
.account-primary-button { border: 1px solid var(--account-saffron-dark); color: #fff; background: linear-gradient(135deg, var(--account-saffron-dark), var(--account-saffron)); box-shadow: 0 8px 20px rgba(173,77,26,.2); }
.account-primary-button:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 11px 25px rgba(173,77,26,.28); }
.account-secondary-button { border: 1px solid #d9a35d; color: #783513; background: #fff8eb; }
.account-field-help, .account-terms { margin: 0; color: var(--account-muted); font-size: 12px; line-height: 1.55; }
.account-terms { margin-top: 18px; text-align: center; }
.account-terms a { color: var(--account-saffron-dark); font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }
.account-guest-link { min-height: 44px; display: flex; align-items: center; justify-content: center; margin-top: 15px; color: var(--account-saffron-dark); text-align: center; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.account-alert { margin: 0 0 18px; padding: 12px 14px; border-radius: 10px; font-size: 13px; }
.account-alert--error { color: #842d22; border: 1px solid #ecc3bd; background: #fff0ed; }
.account-alert--success { color: #185b45; border: 1px solid #b7decf; background: #ebf8f3; }
.account-alert--info { color: #554019; border: 1px solid #ead6a4; background: #fff8e5; }
.account-state-main { display: grid; place-items: center; }
.account-state-card { width: min(500px, 100%); padding: clamp(30px, 6vw, 54px); border: 1px solid var(--account-line); border-radius: 24px; text-align: center; background: #fff; box-shadow: var(--account-shadow); }
.account-state-card--wide { width: min(620px, 100%); }
.account-state-card h1 { margin: 8px 0 12px; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(32px, 5vw, 46px); }
.account-state-card > p:not(.account-eyebrow):not(.account-test-code):not(.account-field-help) { color: var(--account-muted); }
.account-state-icon { width: 62px; height: 62px; display: grid; place-items: center; margin: 0 auto 18px; border-radius: 50%; color: #fff; background: linear-gradient(145deg, var(--account-saffron-dark), var(--account-gold)); font-size: 24px; }
.account-otp-form input { text-align: center; letter-spacing: .45em; font-size: 25px; font-weight: 800; }
.account-dashboard-wrap { width: min(1120px, 100%); margin: 0 auto; }
.account-dashboard-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.account-tabs { display: flex; flex-wrap: wrap; gap: 7px; padding: 5px; border: 1px solid var(--account-line); border-radius: 13px; background: #fff; }
.account-tabs a { padding: 9px 14px; border-radius: 9px; color: var(--account-muted); font-size: 13px; font-weight: 800; }
.account-tabs a.is-active { color: #fff; background: var(--account-saffron-dark); }
.account-logout-form { margin: 0; }
.account-link-button, .account-text-button { padding: 7px 4px; border: 0; color: var(--account-saffron-dark); background: transparent; font-weight: 800; }
.account-welcome-card { display: flex; align-items: center; gap: 22px; padding: clamp(24px, 4vw, 40px); border-radius: 22px; color: #fff; background: linear-gradient(120deg, #743114, #b94f20 60%, #dc7e2f); box-shadow: var(--account-shadow); }
.account-welcome-card .account-eyebrow { color: #ffe2a6; }
.account-welcome-card h1 { margin: 5px 0 6px; color: #fff; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(30px, 4vw, 44px); }
.account-welcome-card p:last-child { margin: 0; color: rgba(255,255,255,.85); }
.account-avatar { flex: 0 0 auto; width: 72px; height: 72px; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.6); border-radius: 50%; color: #7c3315; background: #ffe2a4; font: 800 23px/1 Georgia, serif; }
.account-stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 22px; }
.account-stat-grid article, .account-panel, .account-assurance { padding: 25px; border: 1px solid var(--account-line); border-radius: 17px; background: #fff; box-shadow: 0 10px 32px rgba(69,43,24,.06); }
.account-stat-grid span { color: var(--account-saffron-dark); font: 700 34px/1 Georgia, serif; }
.account-stat-grid > article > i { color: var(--account-saffron-dark); font-size: 28px; }
.account-stat-grid h2 { margin: 14px 0 7px; font-size: 18px; }
.account-stat-grid p { min-height: 46px; color: var(--account-muted); font-size: 13px; }
.account-stat-grid a { color: var(--account-saffron-dark); font-weight: 800; }
.account-assurance { display: flex; gap: 17px; margin-top: 20px; }
.account-assurance > i { color: var(--account-green); font-size: 27px; }
.account-assurance h2 { margin: 0 0 5px; font-size: 18px; }
.account-assurance p { margin: 0; color: var(--account-muted); }
.account-settings-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 20px; align-items: start; }
.account-panel h1, .account-panel h2 { margin: 6px 0 20px; font-family: Georgia, 'Times New Roman', serif; }
.account-panel-intro { max-width: 650px; margin: -10px 0 20px; color: var(--account-muted); }
.account-method-list { display: grid; gap: 10px; }
.account-method-card { padding: 18px; border: 1px solid var(--account-line); border-radius: 14px; background: #fffdfa; }
.account-method-card-heading { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; }
.account-method-card-heading h2 { margin: 0 0 3px; font: 800 18px/1.2 Arial, sans-serif; }
.account-method-card-heading p { margin: 0; color: var(--account-muted); font-size: 12px; }
.account-method-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--account-saffron-dark); background: #fff2da; }
.account-method-status { display: inline-block; padding: 6px 9px; border-radius: 999px; font-size: 10px; font-weight: 900; letter-spacing: .04em; white-space: nowrap; }
.account-method-status--connected { color: #17603c; background: #dff5e8; }
.account-method-status--missing { color: #74421d; background: #fff0d6; }
.account-method-identities { display: grid; gap: 7px; margin: 14px 0 0 54px; }
.account-method-identity { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding-top: 10px; border-top: 1px solid var(--account-line); }
.account-method-identity strong, .account-method-identity small { display: block; }
.account-method-identity small { margin-top: 2px; color: var(--account-muted); font-size: 11px; }
.account-method-empty { margin: 14px 0 0 54px; color: var(--account-muted); font-size: 12px; }
.account-method-action { margin: 14px 0 0 54px; }
.account-method-action:empty { display: none; }
.account-legacy-methods { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--account-line); }
.account-legacy-methods h2 { margin: 0 0 10px; font-size: 15px; }
.account-legacy-methods > div { display: flex; align-items: center; gap: 10px; color: var(--account-muted); font-size: 12px; }
.account-legacy-methods i { color: var(--account-saffron-dark); }
.account-legacy-methods strong, .account-legacy-methods small { display: block; }
.account-method-assurance { margin: 18px 0 0; padding-top: 15px; border-top: 1px solid var(--account-line); }
.account-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 22px; }
.account-page-heading h1 { margin: 5px 0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(34px, 5vw, 50px); }
.account-page-heading p:last-child { max-width: 720px; margin: 0; color: var(--account-muted); }
.account-inline-button { width: auto; white-space: nowrap; }
.account-panel + .account-panel { margin-top: 20px; }
.account-panel-heading { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--account-line); margin-bottom: 16px; padding-bottom: 14px; }
.account-panel-heading h2 { margin: 0; }
.account-panel-heading span { color: var(--account-muted); font-weight: 800; }
.account-empty-state { padding: 35px 18px; text-align: center; }
.account-empty-state i { color: #d1a56b; font-size: 38px; }
.account-empty-state h3 { margin: 12px 0 7px; }
.account-empty-state p { color: var(--account-muted); }
.account-empty-state a { color: var(--account-saffron-dark); font-weight: 800; }
.account-contribution-list { display: grid; gap: 12px; }
.account-contribution-card { display: grid; grid-template-columns: 1fr auto; gap: 25px; padding: 18px; border: 1px solid var(--account-line); border-radius: 13px; }
.account-photo-contribution-card { grid-template-columns: minmax(0,1fr) auto; }
.account-photo-contribution-card > div { min-width: 0; }
.account-photo-contribution-card h3, .account-photo-contribution-card dd { overflow-wrap: anywhere; }
.account-contribution-card h3 { margin: 8px 0 4px; font-size: 18px; }
.account-contribution-card p { margin: 0; color: var(--account-muted); }
.account-status-pill { display: inline-block; padding: 4px 8px; border-radius: 999px; color: #6d4315; background: #fff0c8; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.account-contribution-card dl { display: grid; grid-template-columns: repeat(3, auto); gap: 20px; margin: 0; }
.account-contribution-card dt { color: var(--account-muted); font-size: 10px; text-transform: uppercase; letter-spacing: .07em; }
.account-contribution-card dd { margin: 3px 0 0; font-size: 12px; font-weight: 800; }
.account-claim-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 35px; align-items: center; }
.account-claim-panel h2 { margin-bottom: 8px; }
.account-claim-panel p { color: var(--account-muted); }

@media (max-width: 900px) {
  .account-login-shell { grid-template-columns: 1fr; }
  .account-login-story { min-height: 330px; }
  .account-stat-grid, .account-settings-grid { grid-template-columns: 1fr; }
  .account-contribution-card { grid-template-columns: 1fr; }
  .account-contribution-card dl { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 640px) {
  .account-main { padding: 24px 12px 48px; }
  .account-local-banner { align-items: flex-start; flex-direction: column; gap: 2px; }
  .account-login-shell { border-radius: 18px; }
  .account-login-story { min-height: 285px; padding: 32px 25px; }
  .account-login-story h1 { font-size: 40px; }
  .account-benefits { margin-top: 22px; }
  .account-sacred-mark { width: 150px; height: 150px; }
  .account-auth-card { padding: 28px 20px 32px; }
  .account-entry-tabs a { padding-inline: 7px; font-size: 12px; }
  .account-dashboard-top, .account-page-heading { align-items: stretch; flex-direction: column; }
  .account-tabs { display: grid; grid-template-columns: 1fr; width: 100%; }
  .account-logout-form { align-self: flex-end; }
  .account-welcome-card { align-items: flex-start; flex-direction: column; }
  .account-stat-grid { grid-template-columns: 1fr; }
  .account-stat-grid p { min-height: 0; }
  .account-contribution-card dl { grid-template-columns: 1fr; gap: 9px; }
  .account-claim-panel { grid-template-columns: 1fr; gap: 15px; }
  .account-inline-button { width: 100%; }
  .account-method-card-heading { grid-template-columns: auto 1fr; }
  .account-method-status { grid-column: 1 / -1; justify-self: start; margin-left: 54px; }
  .account-method-identities, .account-method-empty, .account-method-action { margin-left: 0; }
  .account-method-identity { align-items: flex-start; flex-direction: column; }
}
.account-method-address { max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.account-login-options { margin-top: 18px; border: 1px solid var(--account-line); border-radius: 13px; background: #fffdfa; }
.account-login-options summary { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 15px; color: var(--account-saffron-dark); cursor: pointer; font-weight: 800; list-style: none; }
.account-login-options summary::-webkit-details-marker { display: none; }
.account-login-options summary::after { content: "+"; flex: 0 0 auto; font-size: 21px; line-height: 1; }
.account-login-options[open] summary::after { content: "−"; }
.account-login-options-body { padding: 0 15px 15px; }
.account-login-options-body > .account-inline-button { width: auto; margin-bottom: 12px; }
.account-login-option-removals { border-top: 1px solid var(--account-line); }
.account-login-option-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 0; }
.account-login-option-row + .account-login-option-row { border-top: 1px solid var(--account-line); }
.account-login-option-row span { min-width: 0; }
.account-login-option-row strong, .account-login-option-row small { display: block; }
.account-login-option-row small { margin-top: 2px; color: var(--account-muted); }
.account-login-option-row form { flex: 0 0 auto; margin: 0; }
.account-combine-card { width: min(1040px, 100%); max-width: none; padding: clamp(28px, 4vw, 46px); }
.account-combine-card > h1 { max-width: 760px; margin-inline: auto; font-size: clamp(28px, 3vw, 38px); line-height: 1.15; }
.account-combine-card > p { max-width: 720px; margin-inline: auto; }
.account-combine-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 24px 0; }
.account-combine-grid .account-method-card { min-width: 0; padding: 22px; text-align: left; }
.account-combine-grid .account-method-card h2 { margin: 0 0 12px; font-size: 20px; }
.account-combine-summary { min-width: 0; margin: 0; }
.account-combine-summary div { display: grid; grid-template-columns: minmax(105px, .75fr) minmax(0, 1.25fr); gap: 16px; padding: 11px 0; border-top: 1px solid rgba(92,61,42,.14); }
.account-combine-summary dt { font-weight: 700; }
.account-combine-summary dd { min-width: 0; margin: 0; text-align: right; overflow-wrap: anywhere; word-break: break-word; }
.account-combine-preservation { text-align: left; padding: 17px 19px; border-radius: 14px; background: #fff8eb; border: 1px solid rgba(181,117,33,.22); }
.account-combine-preservation h2 { font-size: 18px; margin: 0 0 7px; }
.account-combine-preservation ul { margin: 6px 0 0; padding-left: 20px; }
.account-combine-preservation li + li { margin-top: 6px; }
.account-combine-form { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.account-combine-check { flex: 1 0 100%; display: flex; align-items: flex-start; gap: 10px; text-align: left; font-weight: 600; }
.account-combine-check input[type="checkbox"] { flex: 0 0 20px; width: 20px; height: 20px; min-height: 20px; margin: 2px 0 0; padding: 0; accent-color: #bd541b; }
.account-combine-check span { min-width: 0; overflow-wrap: anywhere; }
.account-combine-form .account-secondary-button { width: auto; }
@media (max-width: 700px) {
  .account-login-options-body > .account-inline-button { width: 100%; }
  .account-login-option-row { align-items: flex-start; }
  .account-combine-card { padding: 25px 18px; }
  .account-combine-card > h1 { font-size: 29px; }
  .account-combine-grid { grid-template-columns: 1fr; gap: 12px; margin: 18px 0; }
  .account-combine-grid .account-method-card { padding: 17px; }
  .account-combine-summary div { display: block; }
  .account-combine-summary dd { margin-top: 3px; text-align: left; }
  .account-combine-form button { width: 100%; }
}
