.account-header { min-height: 76px; display:flex; align-items:center; flex-wrap:wrap; gap:12px 32px; padding:12px max(20px,calc((100vw - 1080px)/2)); border-bottom:1px solid var(--line); }
.account-header nav { display:flex; flex-wrap:wrap; gap:8px 24px; margin-left:auto; }
.account-header nav a { display:flex; align-items:center; min-height:44px; color:var(--muted); border-bottom:2px solid transparent; }
.account-header nav a[aria-current] { color:var(--ink); border-color:var(--accent); font-weight:600; }
.account-page { overflow-wrap:anywhere; width:min(760px,calc(100% - 40px)); margin:48px auto 80px; }
.account-page h1 { overflow-wrap:anywhere; }
.account-page button, .account-page .button { overflow-wrap:normal; max-width:100%; }
.account-page .eyebrow { margin-bottom:12px; }
.account-page h2 { font-size:1.375rem; margin-bottom:12px; }
.account-intro { margin:16px 0 28px; color:var(--muted); overflow-wrap:anywhere; }
.login-page { max-width:420px; margin-top:clamp(40px,9vh,100px); }
.login-page h1 { font-size:2.25rem; }
.account-form { display:flex; flex-direction:column; gap:8px; max-width:520px; }
.account-form > label:not(:first-child), .account-form fieldset > label:not(:first-child) { margin-top:16px; }
.account-form label { font-weight:560; }
.account-form input:not([type=checkbox]):not([type=hidden]), .account-form select, .member-search input { width:100%; min-width:0; min-height:48px; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:var(--radius); padding:10px 12px; font:inherit; }
.account-form > .button { margin-top:20px; align-self:flex-start; }
.account-form .checkbox-label { font-weight:400; align-items:center; }
.account-form .checkbox-label input { flex:none; }
.field-help, .login-help { font-size:.9375rem; color:var(--muted); }
.login-help { margin-top:36px; padding-top:24px; border-top:1px solid var(--line); }
.registration-link { display:flex; align-items:center; min-height:48px; width:fit-content; color:var(--accent); font-size:1rem; font-weight:600; }
.registration-tabs { display:flex; flex-wrap:wrap; gap:12px 24px; margin-bottom:24px; }
.registration-tabs a { display:flex; align-items:center; min-height:48px; color:var(--muted); border-bottom:2px solid transparent; }
.registration-tabs a[aria-current] { border-color:var(--accent); color:var(--ink); font-weight:600; }
.password-field { display:flex; min-width:0; border:1px solid var(--line); background:var(--surface); border-radius:var(--radius); }
.account-form .password-field input:not([type=checkbox]):not([type=hidden]) { border:0; background:transparent; }
.password-field button { flex:none; white-space:nowrap; border:0; background:transparent; padding-inline:12px; color:var(--accent); font-size:.9375rem; }
.account-errors, .account-notice { border:1px solid var(--line); background:var(--layer); padding:16px; margin-bottom:28px; }
.account-errors ul { margin-block:8px 0; padding-left:20px; }
.account-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; }
.member-search { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:stretch; gap:12px; margin-block:28px 24px; }
.member-search button { white-space:nowrap; }
.members-list { list-style:none; margin:0; padding:0; }
.members-list li { border-top:1px solid var(--line); }
.members-list li:last-child { border-bottom:1px solid var(--line); }
.members-list li > a { display:flex; gap:16px; align-items:center; padding:22px 0; }
.members-list li > a:hover { background:var(--layer); }
.members-list li > a > div:first-child { flex:1; min-width:0; }
.members-list strong { font-size:1.25rem; font-weight:600; display:block; }
.members-list span { display:block; color:var(--muted); overflow-wrap:anywhere; }
.member-labels { font-size:.9375rem; }
.empty-members { padding:32px 0; }
.empty-members a { color:var(--accent); text-decoration:underline; }
.member-facts { margin-block:28px; }
.member-facts div { display:grid; grid-template-columns:1fr 2fr; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
.member-facts dt { color:var(--muted); }.member-facts dd { margin:0; overflow-wrap:anywhere; }
.account-section { padding-top:28px; margin-top:36px; border-top:1px solid var(--line); }
.account-section > p { margin-bottom:20px; }.account-section details > p { margin-block:16px; }
.account-page summary { padding-block:12px; min-height:44px; font-weight:560; }
.account-page fieldset { border:0; border-top:1px solid var(--line); padding:24px 0 12px; margin:12px 0 0; min-width:0; display:flex; flex-direction:column; gap:8px; }
.account-page legend { font-size:1.25rem; font-weight:600; padding-right:12px; }
.pagination { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:24px; }.pagination a { min-height:44px; display:flex; align-items:center; }
#logout-state { margin-block:24px; }
@media(max-width:540px) { .account-header { gap:4px 16px; }.account-header nav { margin-left:0; width:100%; gap:16px; justify-content:space-between; }.account-page { margin-top:32px; }.member-facts div { grid-template-columns:1fr; gap:2px; }.members-list li > a { flex-wrap:wrap; }.member-labels { width:100%; order:3; display:flex; gap:16px; } }

.account-header .brand { order: 0; }
.account-header nav { order: 1; }
.account-form select, .appearance-theme select { appearance: none; padding-inline-end: 2.5rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%239caaa7' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .75rem center; }

.appearance-form { max-width:520px; }
.account-page .palette-options { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr)); gap:12px; padding:0; border:0; margin:0 0 16px; }
.palette-options label { display:flex; align-items:center; gap:12px; padding:12px; min-height:56px; border:1px solid var(--line); border-radius:var(--radius); cursor:pointer; }
.palette-options label:has(:checked) { border-color:var(--accent); background:var(--accent-soft); font-weight:600; }
.palette-options input { flex:none; width:20px; height:20px; margin:0; accent-color:var(--accent); }
.palette-swatch { width:22px; height:22px; flex:none; border-radius:50%; background:var(--swatch); border:1px solid var(--muted); }
.palette-swatch--teal { --swatch:oklch(0.60 0.065 194); }
.palette-swatch--blue { --swatch:oklch(0.60 0.065 255); }
.palette-swatch--terracotta { --swatch:oklch(0.60 0.065 45); }
.palette-swatch--plum { --swatch:oklch(0.60 0.065 310); }
.appearance-form .device-actions { margin-top:20px; }

.appearance-theme { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.appearance-theme select { min-width:0; max-width:100%; padding:8px 2.5rem 8px 12px; min-height:48px; }

.palette-swatch--green { --swatch:oklch(0.60 0.065 145); }
.palette-swatch--pink { --swatch:oklch(0.60 0.065 350); }
.palette-options legend { font-size:1rem; margin-bottom:12px; }
