/* Account workspace and browser-local portal appearance. No subsystem selectors. */
:root { --account-start:#eaf5ed;--account-end:#fae4eb;--account-tint:.7;--account-opacity:1;--account-font-scale:1; }
body.account-appearance-custom .portal-main-panel { background:linear-gradient(120deg,color-mix(in srgb,var(--account-start) calc(var(--account-tint)*100%),#fafafa),color-mix(in srgb,var(--account-end) calc(var(--account-tint)*100%),#fafafa)); }
body.account-appearance-custom .portal-card-item { background:rgb(255 255 255 / var(--account-opacity)); }
body.account-appearance-custom .portal-card-title { font-size:calc(18px * var(--account-font-scale)); }
body.account-appearance-custom .portal-card-desc { font-size:calc(14px * var(--account-font-scale)); }
#adminModal.account-focus { background:linear-gradient(120deg,color-mix(in srgb,var(--account-start) calc(var(--account-tint)*100%),#fafafa),#faf9f8 50%,color-mix(in srgb,var(--account-end) calc(var(--account-tint)*100%),#fafafa));min-height:100vh; }
#adminModal.account-focus .admin-section:not(#adminProfileSection) { display:none; }
#adminModal.account-focus .admin-workspace-content { max-width:none; }
#adminModal.account-focus .admin-workspace-header { background:#ffffffb8;backdrop-filter:blur(16px); }
#adminModal.account-focus #adminProfileSection { background:transparent;border:0;box-shadow:none;padding:0; }
#adminModal #adminProfileSection { --account-green:#286b46;--account-ink:#252e2b;--account-muted:#5a6862;color:var(--account-ink); }
#adminModal #adminProfileSection > h2 { margin-bottom:22px; }
#adminModal .account-grid { display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.88fr) minmax(0,1.12fr);gap:20px;align-items:start; }
#adminModal .account-stack { display:grid;gap:20px;min-width:0; }
#adminModal .account-card { min-width:0;border-radius:24px;padding:22px;background:rgb(255 255 255 / var(--account-opacity));box-shadow:0 12px 32px #4d62500d;border:1px solid #ffffff; }
#adminModal .account-card h3 { font-size:calc(16px * var(--account-font-scale));line-height:1.5;margin:0 0 18px;font-weight:700; }
#adminModal .account-person { display:flex;align-items:center;gap:12px;margin-bottom:20px;min-width:0; }
#adminModal .account-person > div:last-child { min-width:0; }
#adminModal .account-person h3 { margin:0;font-size:calc(19px * var(--account-font-scale));overflow-wrap:anywhere; }
#adminModal .account-person p { color:var(--account-muted);font-size:calc(13px * var(--account-font-scale));margin:3px 0 0;overflow-wrap:anywhere; }
#adminModal .account-avatar { width:48px;height:48px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;background:#eff7f1;color:var(--account-green);font-size:22px;font-weight:700; }
#adminModal #profileSettingsForm,#adminModal #passwordSettingsForm { display:block; }
#adminModal .account-fields { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 12px; }
#adminModal .account-span { grid-column:1/-1; }
#adminModal #adminProfileSection label { display:block;font-size:calc(13px * var(--account-font-scale));color:var(--account-muted);min-width:0; }
#adminModal #adminProfileSection input:not([type=range]):not([type=hidden]) { display:block;width:100%;margin:6px 0 0;padding:9px 11px;min-height:44px;border:1px solid #d5ded7;border-radius:11px;color:var(--account-ink);background:white;font-size:max(16px,calc(15px * var(--account-font-scale)));box-shadow:none; }
#adminModal #adminProfileSection input[readonly] { background:#f3f5f3!important;color:var(--account-muted)!important; }
#adminModal .account-actions { display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:8px;margin-top:16px; }
#adminModal .account-primary,#adminModal .account-secondary { border:1px solid var(--account-green);border-radius:11px;background:var(--account-green);color:white;padding:10px 15px;min-height:44px;font:inherit;font-size:calc(13px * var(--account-font-scale));font-weight:700;cursor:pointer;white-space:normal; }
#adminModal .account-secondary { background:white;color:var(--account-muted);border-color:#d5ded7; }
#adminModal #adminProfileSection button:disabled { opacity:.6;cursor:wait; }
#adminModal #accountPermissions { padding:0;margin:0;list-style:none; }
#adminModal .account-permission { display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #e7ede8;font-size:calc(13px * var(--account-font-scale)); }
#adminModal .account-permission:last-child { border-bottom:0; }
#adminModal .account-permission > span:nth-child(2) { flex:1;min-width:0;overflow-wrap:anywhere; }
#adminModal .account-permission-icon { display:flex;padding:7px;border-radius:9px;background:#eaf2ed;color:var(--account-green);flex-shrink:0; }
#adminModal .account-permission-icon svg { width:17px;height:17px; }
#adminModal .account-permission strong { color:var(--account-green);white-space:nowrap;font-size:calc(12px * var(--account-font-scale)); }
#adminModal .account-permission strong[data-level=none] { color:var(--account-muted); }
#adminModal .account-hint { color:var(--account-muted);font-size:calc(12px * var(--account-font-scale));margin:15px 0 0; }
#adminModal .account-sample { height:72px;background:linear-gradient(110deg,var(--account-start),var(--account-end));border-radius:14px;padding:15px;margin-bottom:14px; }
#adminModal .account-sample > div { display:flex;align-items:center;gap:8px;background:#ffffffb8;border:1px solid white;padding:10px;border-radius:12px; }
#adminModal .account-sample i { width:20px;height:17px;background:var(--account-green);border-radius:5px; }
#adminModal .account-sample span { flex:1;background:white;border-radius:20px;height:17px; }
#adminModal .account-swatches { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:20px; }
#adminModal .account-swatch { min-width:0;border:2px solid transparent;border-radius:12px;background:transparent;color:var(--account-ink);padding:6px;font:inherit;font-size:calc(12px * var(--account-font-scale));cursor:pointer;text-align:left;min-height:70px; }
#adminModal .account-swatch[aria-pressed=true] { border-color:var(--account-green); }
#adminModal .account-swatch span { display:block;height:29px;border-radius:8px;margin-bottom:6px; }
#adminModal #adminProfileSection .account-range-label { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px; }
#adminModal #adminProfileSection input[type=range] { width:100%;height:30px;min-height:30px;accent-color:var(--account-green);margin:3px 0 8px;padding:0;border:0; }
#adminModal .account-size-label { color:var(--account-muted);font-size:calc(13px * var(--account-font-scale));margin:12px 0 8px; }
#adminModal .account-sizes { display:flex;gap:3px;background:#f1f3f1;padding:4px;border-radius:11px; }
#adminModal .account-sizes button { flex:1;min-width:0;min-height:40px;border:0;border-radius:8px;background:transparent;color:var(--account-muted);font:inherit;font-size:calc(12px * var(--account-font-scale));padding:6px 2px;cursor:pointer; }
#adminModal .account-sizes button[aria-pressed=true] { background:white;color:var(--account-ink);box-shadow:0 2px 5px #00000010; }
#adminModal .account-dialog { border:1px solid #d5ded7;border-radius:20px;padding:24px;width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;box-shadow:0 20px 80px #183a2430;color:var(--account-ink); }
#adminModal .account-dialog::backdrop { background:#17322155; }
#adminModal .account-dialog h3 { font-size:20px;margin:0 0 12px; }
#adminModal .account-dialog p { color:var(--account-muted); }
@container (max-width:1050px) { #adminModal .account-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } #adminModal .account-appearance { grid-column:1/-1; } #adminModal .account-swatches { grid-template-columns:repeat(6,minmax(0,1fr)); } }
@container (max-width:620px) { #adminModal .account-grid { grid-template-columns:minmax(0,1fr);gap:16px; } #adminModal .account-appearance { grid-column:auto; } #adminModal .account-card { padding:20px 16px; } #adminModal .account-swatches { grid-template-columns:repeat(3,minmax(0,1fr)); } #adminModal .account-fields { grid-template-columns:minmax(0,1fr); } }
