.account-main {
  padding: 60px 20px;
  min-height: calc(100vh - 130px);
  display: grid;
  place-items: center;
  background: linear-gradient(90deg, rgba(9,9,9,.82), rgba(9,9,9,.7)), url("hero-flow.png") center / cover;
}
.account-panel { width: min(100%, 460px); padding: clamp(24px, 5vw, 42px); background: rgba(15,15,15,.96); border: 1px solid #333; border-radius: 12px; }
.back-link { display: inline-flex; gap: 10px; align-items: center; color: #bbb; text-decoration: none; font-size: .875rem; }
.account-panel h1 { font-weight: 500; font-size: clamp(1.8rem, 5vw, 2.2rem); line-height: 1.2; letter-spacing: -.04em; margin: 30px 0 10px; }
.account-subtitle { color: #aaa; margin: 0 0 24px; }
.account-notice { font-size: .875rem; line-height: 1.6; padding: 12px 14px; background: #231719; border-left: 2px solid #ef2b2d; color: #dbbfc0; }
.account-panel form { display: grid; gap: 10px; margin-top: 24px; }
.account-panel label { font-size: .875rem; margin-top: 8px; }
.account-panel input { width: 100%; min-width: 0; min-height: 48px; padding: 12px 14px; background: #181818; border: 1px solid #424242; border-radius: 6px; color: #fff; font: inherit; font-size: 1rem; }
.account-panel input:focus { outline: 2px solid #ef686a; outline-offset: 2px; }
.password-field { position: relative; }
.password-field input { padding-right: 54px; }
.password-toggle { position: absolute; right: 2px; top: 2px; bottom: 2px; width: 44px; color: #ccc; background: transparent; border: 0; cursor: pointer; }
.account-submit { margin-top: 16px; min-height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; font: inherit; color: #fff; background: #c92429; border: 0; border-radius: 6px; cursor: pointer; }
.account-submit:hover { background: #ad1d23; }
@media (hover: none) {
  .account-submit:hover { background: var(--red); }
  .account-submit:active { transform: scale(.98); }
}
.account-switch { text-align: center; font-size: .875rem; color: #aaa; margin: 24px 0 0; }
.account-switch a { color: #ff898b; text-underline-offset: 4px; }
.form-message { margin: 0; font-size: .875rem; color: #dfbfc0; line-height: 1.5; }
.form-message:empty { display: none; }
@media(max-width:470px) { .account-main { padding: 28px 16px; } }
.account-panel label small { float: right; color: #777; font-weight: 400; }.form-alert { margin: 18px 0 0; padding: 12px 14px; border: 1px solid #563033; border-radius: 6px; background: #261517; color: #f0c8ca; font-size: .82rem; line-height: 1.55; }.form-alert p { margin: 0; }.form-alert p + p { margin-top: 5px; }.check-row { display: flex!important; flex-direction: row; align-items: flex-start; gap: 10px; margin-top: 14px!important; color: #aaa; line-height: 1.5; }.check-row input { width: 18px; height: 18px; min-height: 18px; margin: 2px 0 0; accent-color: var(--red); }.check-row a { color: #ff898b; }.verification-panel { text-align: center; }.verification-panel .back-link { display: flex; }.verification-icon { width: 62px; height: 62px; margin: 30px auto 0; display: grid; place-items: center; border-radius: 50%; background: #271719; color: #ff696b; font-size: 1.45rem; }.verification-panel h1 { margin-top: 20px; }.verification-panel .account-subtitle { line-height: 1.7; }.verification-panel .account-subtitle strong { color: #fff; overflow-wrap: anywhere; }.code-input { text-align: center; font-size: 1.7rem!important; font-weight: 600; letter-spacing: .42em; padding-left: calc(14px + .42em)!important; }.resend-form { margin-top: 10px!important; }.resend-form button { border: 0; background: transparent; color: #ff898b; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }.profile-main { width: min(1120px,92vw); margin: 0 auto; padding: 48px 0 80px; display: block; }.profile-hero { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 20px; padding: 26px; border: 1px solid #303030; border-radius: 10px; background: linear-gradient(135deg,#1d1415,#111); }.profile-avatar { width: 72px; height: 72px; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: #fff; font-size: 1.35rem; font-weight: 700; }.profile-hero h1 { margin: 5px 0 2px; font-size: 1.7rem; }.profile-hero p { margin: 0; color: #999; font-size: .85rem; }.verified-label { color: #ff7779; font-size: .72rem; font-weight: 600; }.logout-form { margin: 0!important; }.logout-form button { min-height: 42px; padding: 9px 14px; border: 1px solid #3b3b3b; border-radius: 6px; background: #171717; color: #ddd; cursor: pointer; }.logout-form i { margin-right: 7px; }.profile-alert { margin: 18px 0; }.profile-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 20px; align-items: start; margin-top: 20px; }.profile-nav { position: sticky; top: 84px; display: grid; gap: 5px; padding: 9px; border: 1px solid #303030; border-radius: 8px; background: #111; }.profile-nav a { padding: 11px 12px; border-radius: 5px; color: #999; text-decoration: none; font-size: .82rem; }.profile-nav a:hover { color: #fff; background: #211719; }.profile-nav i { width: 20px; color: #df5557; }.profile-content { display: grid; gap: 18px; min-width: 0; }.settings-card { scroll-margin-top: 85px; padding: clamp(20px,4vw,30px); border: 1px solid #303030; border-radius: 9px; background: #121212; }.settings-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid #292929; }.settings-heading span { color: #ff6668; font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }.settings-heading h2 { margin: 4px 0 0; font-size: 1.2rem; }.settings-heading > i { color: #7d4b4c; font-size: 1.2rem; }.settings-form { display: grid; gap: 9px; margin-top: 20px; }.settings-form label { color: #bbb; font-size: .82rem; }.settings-form input,.settings-form select { width: 100%; min-height: 46px; margin-top: 7px; padding: 10px 12px; border: 1px solid #3d3d3d; border-radius: 6px; background: #0b0b0b; color: #fff; font: inherit; }.settings-form input:focus,.settings-form select:focus { outline: 2px solid #ef686a; outline-offset: 2px; }.verified-input { position: relative; }.verified-input i { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: #4fa96f; }.verified-input input { padding-right: 44px; color: #999; }.settings-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 8px; }.settings-grid.two { grid-template-columns: 1fr 1fr; }.settings-form .password-field input { margin-top: 0; padding-right: 52px; }.settings-form label > .password-field { margin-top: 7px; }.account-submit.compact { width: fit-content; min-width: 180px; margin-top: 16px; gap: 20px; }.danger-card { border-color: #4c292c; }.danger-card > p { color: #999; font-size: .83rem; line-height: 1.65; }.danger-card details { margin-top: 16px; }.danger-card summary { width: fit-content; color: #ff7779; cursor: pointer; font-size: .85rem; }.delete-form { max-width: 480px; }.danger-button { min-height: 46px; margin-top: 10px; padding: 10px 14px; border: 1px solid #d52b30; border-radius: 6px; background: transparent; color: #ff7779; cursor: pointer; }.danger-button:hover { background: #361417; }.legal-main { min-height: calc(100vh - 130px); padding: 60px 20px; }.legal-main article { width: min(760px,100%); margin: 0 auto; }.legal-main h1 { font-size: clamp(2rem,5vw,3rem); }.legal-main p { color: #aaa; line-height: 1.85; }.legal-main a { color: #ff7779; }
@media(max-width:760px){.profile-main{padding-top:24px}.profile-hero{grid-template-columns:auto 1fr}.logout-form{grid-column:1/-1}.logout-form button{width:100%}.profile-layout{grid-template-columns:1fr}.profile-nav{position:static;display:flex;overflow-x:auto}.profile-nav a{white-space:nowrap}.settings-grid,.settings-grid.two{grid-template-columns:1fr}}
@media(max-width:470px){.profile-hero{grid-template-columns:1fr;text-align:center}.profile-avatar{margin:auto}.profile-hero p{overflow-wrap:anywhere}.settings-card{padding:18px}.account-submit.compact{width:100%}.code-input{font-size:1.45rem!important}.global-flash{top:70px}}

/* Account-selected color theme */
.account-notice { border-left-color: var(--red); }
.account-panel input:focus,
.settings-form input:focus,
.settings-form select:focus { outline-color: var(--accent-soft); }
.account-submit { background: var(--red); }
.account-submit:hover { background: var(--red-dark); }
.account-switch a,
.check-row a,
.resend-form button,
.verified-label,
.settings-heading span,
.danger-card summary,
.legal-main a { color: var(--accent-soft); }
.verification-icon,
.profile-hero,
.profile-nav a:hover { background: color-mix(in srgb, var(--red) 13%, #111); }
.verification-icon,
.profile-nav i { color: var(--accent-soft); }
.settings-heading > i { color: color-mix(in srgb, var(--red) 55%, #777); }

.theme-colors { margin: 4px 0 12px; padding: 0; border: 0; }
.theme-colors legend { margin-bottom: 11px; color: #bbb; font-size: .82rem; }
.theme-options { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.theme-choice { --choice-color:#ef2b2d; position: relative; display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 6px 10px; border: 1px solid color-mix(in srgb,var(--choice-color) 55%,#303030); border-radius: 999px; background: color-mix(in srgb,var(--choice-color) 12%,var(--field)); cursor: pointer; }
.theme-choice:hover { border-color: var(--choice-color); }
.theme-choice input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.theme-choice[data-color="blue"] { --choice-color:#2f7df4; }
.theme-choice[data-color="green"] { --choice-color:#10a96b; }
.theme-choice[data-color="gold"] { --choice-color:#d49a19; }
.theme-choice[data-color="black"] { --choice-color:#111; }
.theme-choice[data-color="black"] .theme-swatch { border:1px solid #777; }
.theme-choice[data-color="black"]:has(input:checked) { border-color:#777; }
.theme-swatch { width: 10px; height: 10px; flex:0 0 auto; border-radius: 50%; background:var(--choice-color); box-shadow:0 0 0 3px color-mix(in srgb,var(--choice-color) 16%,transparent); }
.theme-choice:has(input:checked) { border-color:var(--choice-color); background:var(--choice-color); }
.theme-choice:has(input:checked) strong { color:#fff; }
.theme-choice input:focus-visible + .theme-swatch { outline: 3px solid var(--choice-color); outline-offset: 4px; }
.theme-choice strong { color: #ddd; font-size: .75rem; }
.appearance-note { margin: 4px 0 0; color: #888; font-size: .76rem; line-height: 1.6; }
.appearance-note i { margin-right: 6px; color: var(--accent-soft); }

@media(max-width:620px){.theme-options{gap:7px}.theme-choice{padding:6px 9px}}

/* The selected account color changes the complete application surface. */
.profile-main,.legal-main{background:transparent}
.account-main{background:linear-gradient(90deg,color-mix(in srgb,var(--background) 86%,transparent),color-mix(in srgb,var(--background) 72%,transparent)),url("hero-flow.png") center/cover}
html[data-accent="black"] .account-main{background-image:linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.72)),url("hero-flow.png");background-blend-mode:saturation,normal}
.account-panel,.profile-hero,.profile-nav,.settings-card{background:var(--panel);border-color:var(--border)}
.profile-hero{background:linear-gradient(135deg,color-mix(in srgb,var(--red) 18%,var(--panel)),var(--panel))}
.settings-form input,.settings-form select,.account-panel input{background:var(--field);border-color:var(--border)}
.profile-nav a:hover{background:var(--accent-surface)}
.account-submit{background:var(--red)}
.account-submit:hover{background:var(--red-dark)}
.public-id-input{position:relative}.public-id-input input{padding-right:54px;letter-spacing:.05em}.public-id-input button{position:absolute;right:3px;top:10px;width:40px;height:40px;border:0;border-radius:5px;background:var(--panel-raised);color:var(--accent-soft);cursor:pointer}.public-id-help{margin-top:-3px;color:var(--muted);font-size:.68rem;line-height:1.5}
.account-submit:disabled{opacity:.48;cursor:not-allowed}.form-label-row{margin-top:8px;display:flex;align-items:center;justify-content:space-between;gap:14px}.form-label-row label{margin:0}.form-label-row a{color:var(--accent-soft);font-size:.78rem;text-underline-offset:4px}.recaptcha-wrap{width:100%;min-height:78px;margin-top:12px;display:flex;align-items:center;overflow:hidden}.profile-button>span img,.profile-avatar img,.avatar-preview img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}.avatar-form{margin:20px 0 4px;padding:15px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;border:1px solid var(--border);border-radius:8px;background:var(--field)}.avatar-preview{width:62px;height:62px;display:grid;place-items:center;overflow:hidden;border-radius:50%;color:#fff;background:var(--red);font-size:1rem;font-weight:700}.avatar-copy{display:flex;flex-direction:column;min-width:0}.avatar-copy strong{font-size:.84rem}.avatar-copy>span{margin:3px 0 9px;color:var(--muted);font-size:.68rem}.avatar-upload{width:fit-content;margin:0!important;display:inline-flex;align-items:center;gap:7px;color:var(--accent-soft)!important;font-size:.75rem!important;cursor:pointer}.avatar-upload input{position:absolute;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;opacity:0;pointer-events:none}.avatar-actions{display:flex;flex-direction:column;gap:7px}.avatar-actions button{min-height:36px;padding:7px 11px;border:1px solid var(--border);border-radius:5px;color:var(--text);background:var(--panel-raised);font:inherit;font-size:.72rem;cursor:pointer}.avatar-actions .avatar-save{border-color:var(--accent-border);background:var(--accent-surface)}.avatar-actions .avatar-remove{color:#ff8587}@media(max-width:470px){.avatar-form{grid-template-columns:auto 1fr}.avatar-actions{grid-column:1/-1;flex-direction:row}.avatar-actions button{flex:1}}@media(max-width:370px){.recaptcha-wrap{height:70px;overflow:visible}.recaptcha-wrap .g-recaptcha{transform:scale(.84);transform-origin:left top}}