.login-page {min-height:100dvh;display:grid;place-items:center;padding:28px;background:var(--bg);}
.login-card {width:min(100%,400px);padding:36px;border:1px solid var(--border);background:var(--surface);}
.login-brand {display:flex;align-items:center;gap:14px;color:var(--text);font:32px Georgia,serif;}
.login-brand span {font-size:40px;}
.login-eyebrow {margin-top:32px;letter-spacing:.15em;font-size:10px;color:var(--muted);}
.login-card h1 {font-size:28px;margin:12px 0;}
.login-card > p:not(.login-eyebrow),.login-website,.account-settings > p {font-size:12px;color:var(--muted);}
.login-form,.account-form {display:grid;gap:18px;margin-top:24px;}
.login-form label,.account-form label {display:grid;gap:8px;font-size:13px;}
.login-form input,.account-form input {width:100%;height:40px;padding:0 12px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:0;}
.login-form button {height:40px;}
.login-website {display:inline-block;margin-top:24px;}
.account-settings {margin:0 0 24px;}
.account-form {grid-template-columns:repeat(2,minmax(0,1fr));}
.account-form [role=alert] {grid-column:1 / -1;}
.account-form button {justify-self:start;}
.gradient-avatar[data-avatar] {position:relative;overflow:hidden;display:inline-grid;place-items:center;}
.gradient-avatar[data-avatar]::before,.gradient-avatar[data-avatar]::after {content:"";position:absolute;display:block;}
.gradient-avatar[data-avatar="initial"] {background:#244b37;color:white;}
.gradient-avatar[data-avatar="initial"]::before {content:var(--avatar-initial,"D");position:static;font:inherit;font-size:1.3em;}
@media(max-width:480px){.login-page{padding:16px;}.login-card{padding:24px;}.account-form{grid-template-columns:1fr;}}
.login-page {--border:var(--line);--text:var(--ink);}
.account-settings {--border:var(--line);--text:var(--ink);}
.gradient-avatar[data-avatar="meadow"] { background: #286548; }
.gradient-avatar[data-avatar="meadow"]::before { width: 26%; height: 26%; top: 14%; right: 14%; background: #f3d36a; border-radius: 50%; }
.gradient-avatar[data-avatar="meadow"]::after { width: 82%; height: 34%; left: -10%; bottom: -5%; background: #9cc46b; transform: rotate(-12deg); }

.gradient-avatar[data-avatar="sunrise"] { background: #7f5b8f; }
.gradient-avatar[data-avatar="sunrise"]::before { width: 52%; height: 52%; left: 24%; bottom: 8%; background: #ffd36a; border-radius: 50%; }
.gradient-avatar[data-avatar="sunrise"]::after { width: 100%; height: 34%; left: 0; bottom: 0; background: #e67855; }

.gradient-avatar[data-avatar="coral"] { background: #e87768; }
.gradient-avatar[data-avatar="coral"]::before { width: 26%; height: 26%; top: 14%; right: 14%; background: #8d384b; border-radius: 50%; box-shadow: -24px 24px 0 #ffd9c7; }
.gradient-avatar[data-avatar="coral"]::after { width: 14%; height: 54%; left: 43%; top: 23%; background: #f4a396; transform: rotate(38deg); }

.gradient-avatar[data-avatar="lagoon"] { background: #117a7a; }
.gradient-avatar[data-avatar="lagoon"]::before { width: 34%; height: 34%; top: 13%; left: 14%; background: #b9f2df; border-radius: 50%; }
.gradient-avatar[data-avatar="lagoon"]::after { width: 54%; height: 54%; right: -14%; bottom: -10%; background: #45b6a7; transform: rotate(24deg); }

.gradient-avatar[data-avatar="violet"] { background: #624a91; }
.gradient-avatar[data-avatar="violet"]::before { width: 28%; height: 28%; top: 14%; right: 14%; background: #e4c7ff; border-radius: 50%; }
.gradient-avatar[data-avatar="violet"]::after { width: 74%; height: 20%; left: 13%; bottom: 22%; background: #9b72c5; transform: rotate(-28deg); }

.gradient-avatar[data-avatar="plum"] { background: #44233d; }
.gradient-avatar[data-avatar="plum"]::before { width: 38%; height: 38%; left: 16%; bottom: 14%; background: #f0b7cc; border-radius: 50%; }
.gradient-avatar[data-avatar="plum"]::after { width: 38%; height: 38%; right: 13%; top: 14%; background: #93566f; transform: rotate(18deg); }

.gradient-avatar[data-avatar="ocean"] { background: #173d64; }
.gradient-avatar[data-avatar="ocean"]::before { width: 72%; height: 32%; left: 14%; bottom: -7%; background: #8ed4dc; border-radius: 50% 50% 0 0; }
.gradient-avatar[data-avatar="ocean"]::after { width: 44%; height: 12%; left: 28%; bottom: 30%; background: #327da0; border-radius: 50%; }

.gradient-avatar[data-avatar="moss"] { background: #455c36; }
.gradient-avatar[data-avatar="moss"]::before { width: 30%; height: 30%; right: 13%; bottom: 13%; background: #d2d68a; border-radius: 50%; }
.gradient-avatar[data-avatar="moss"]::after { width: 22%; height: 74%; left: 24%; top: 13%; background: #71824b; transform: rotate(34deg); }

.gradient-avatar[data-avatar="rose"] { background: #763b59; }
.gradient-avatar[data-avatar="rose"]::before { width: 46%; height: 46%; left: 27%; top: 27%; background: #cb7188; border-radius: 50%; }
.gradient-avatar[data-avatar="rose"]::after { width: 22%; height: 22%; left: 39%; top: 39%; background: #f7cad5; border-radius: 50%; }

.gradient-avatar[data-avatar="graphite"] { background: #273033; }
.gradient-avatar[data-avatar="graphite"]::before { width: 18%; height: 88%; left: 41%; top: 6%; background: #aeb4b5; transform: rotate(42deg); }
.gradient-avatar[data-avatar="graphite"]::after { width: 40%; height: 40%; right: -8%; bottom: -8%; background: #596366; }

.gradient-avatar[data-avatar="citrus"] { background: #e5a92f; }
.gradient-avatar[data-avatar="citrus"]::before { width: 54%; height: 54%; left: 23%; top: 23%; background: #f4cf55; border: 4px solid #fff0a3; border-radius: 50%; box-sizing: border-box; }
.gradient-avatar[data-avatar="citrus"]::after { width: 8%; height: 54%; left: 46%; top: 23%; background: #e5a92f; transform: rotate(45deg); }

.gradient-avatar[data-avatar="midnight"] { background: #121b37; }
.gradient-avatar[data-avatar="midnight"]::before { width: 20%; height: 20%; top: 14%; right: 15%; background: #f3df93; border-radius: 50%; }
.gradient-avatar[data-avatar="midnight"]::after { width: 34%; height: 34%; left: 16%; bottom: 14%; background: #5573a6; transform: rotate(45deg); }
.personal-space .gradient-avatar,
.personal-space .personal-avatar-options .avatar-option { border-radius:0; }
.website-ai-settings { padding-bottom:32px; }
.ai-account-overview { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line); margin:22px 0 30px; background:var(--surface); }
.ai-account-overview > div { display:flex; flex-direction:column; align-items:flex-start; padding:26px; min-width:0; gap:12px; }
.ai-current-model { border-left:1px solid var(--line); }
.ai-account-overview span, .ai-account-overview p, .ai-billing-note { color:var(--muted); font-size:12px; line-height:1.7; }
.ai-account-overview strong { font-size:28px; font-weight:500; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.ai-account-overview p { margin:0; }
.ai-account-overview a { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--accent); }
.ai-account-overview .icon { width:14px; height:14px; }
.website-ai-settings .ai-config-directory { margin-top:0; }
.website-ai-settings .ai-config-card { border-radius:0; }
.ai-model-price { margin:8px 0 0; font-size:12px; color:var(--ink); line-height:1.7; }
.ai-model-price span, .ai-model-selected { color:var(--muted); font-size:12px; }
.ai-billing-note { margin:22px 0 0; }
.settings-page .storage-settings .storage-card { border-radius:0; }
.settings-page .plan-heading-actions > a { display:inline-flex; align-items:center; justify-content:center; gap:8px; text-decoration:none; }
@media(max-width:560px) {
  .ai-account-overview { grid-template-columns:minmax(0,1fr); }
  .ai-current-model { border-left:0; border-top:1px solid var(--line); }
  .ai-account-overview > div { padding:20px; }
  .website-ai-settings .ai-config-card { flex-wrap:wrap; }
  .website-ai-settings .ai-config-copy { min-width:0; flex:1; }
  .website-ai-settings .ai-config-actions { margin-left:auto; }
}
.appearance-settings { padding:24px; margin-top:24px; border:1px solid var(--line); background:var(--surface); }
.appearance-settings h2 { margin:0 0 10px; font-size:19px; font-weight:400; color:var(--heading); font-family:var(--font-editorial); }
.appearance-settings > p { color:var(--muted); font-size:12px; line-height:1.7; }
.appearance-themes { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:22px; }
.appearance-theme { display:flex; gap:14px; align-items:center; min-width:0; padding:18px; border:1px solid var(--line); border-radius:0; color:var(--ink); background:var(--surface); text-align:left; cursor:pointer; }
.appearance-theme.selected { border-color:var(--accent); background:var(--accent-soft); }
.appearance-swatch { display:grid; place-items:center; width:36px; height:36px; flex:0 0 36px; color:#fff; }
.appearance-swatch .icon { width:18px; height:18px; }
.appearance-theme-name { display:flex; flex-direction:column; gap:7px; font-size:14px; }
.appearance-theme-name small { color:var(--muted); font-size:11px; min-height:14px; }
.appearance-status { min-height:20px; margin:18px 0 0; }
@media(max-width:950px) { .appearance-themes { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:480px) { .appearance-settings { padding:18px; }.appearance-themes { gap:10px; }.appearance-theme { padding:12px; gap:10px; }.appearance-swatch { width:28px; height:28px; flex-basis:28px; } }
