/* MOMVE Phase 3 account clarity layer */
:root {
  --account-bg: #f7f1e6;
  --account-panel: #fffaf0;
  --account-ink: #1c2b22;
  --account-muted: #5f6a61;
  --account-line: rgba(45, 68, 53, .18);
  --account-green: #1f5a3b;
  --account-green-dark: #153e2a;
  --account-sand: #e7d0a0;
  --account-warning: #7a4b00;
  --account-danger: #7f1d1d;
}
.momve-account { margin: 0; background: var(--account-bg); color: var(--account-ink); font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.account-topbar { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem clamp(1rem, 3vw, 2rem); background: rgba(255,250,240,.96); border-bottom: 1px solid var(--account-line); backdrop-filter: blur(10px); }
.account-brand { display: inline-flex; align-items: center; gap: .7rem; color: var(--account-ink); text-decoration: none; }
.account-brand small { display: block; color: var(--account-muted); }
.account-brand__mark { width: 2.2rem; height: 2.2rem; border-radius: 999px; background: radial-gradient(circle at 32% 28%, var(--account-sand), var(--account-green)); box-shadow: inset 0 0 0 2px rgba(255,255,255,.5); }
.account-nav { display: flex; gap: .35rem; flex-wrap: wrap; justify-content: flex-end; }
.account-nav a { color: var(--account-ink); text-decoration: none; padding: .55rem .7rem; border-radius: 999px; }
.account-nav a:hover, .account-nav a:focus-visible { background: rgba(31,90,59,.12); outline: 2px solid transparent; }
.account-shell { width: min(1120px, calc(100% - 2rem)); margin: 0 auto; padding: clamp(1rem, 3vw, 2rem) 0 3rem; }
.account-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.account-card { background: var(--account-panel); border: 1px solid var(--account-line); border-radius: 1.25rem; padding: clamp(1rem, 3vw, 1.5rem); box-shadow: 0 20px 45px rgba(22, 48, 31, .08); }
.account-card--hero { background: linear-gradient(135deg, #153e2a, #1f5a3b); color: #fffaf0; }
.account-card--notice { max-width: 760px; margin: 2rem auto; }
.account-card h1, .account-card h2, .account-card h3 { margin-top: 0; line-height: 1.05; }
.account-eyebrow { margin: 0 0 .5rem; text-transform: uppercase; letter-spacing: .12em; font-size: .78rem; font-weight: 700; color: inherit; opacity: .78; }
.account-muted { color: var(--account-muted); }
.account-card--hero .account-muted { color: rgba(255,250,240,.78); }
.account-actions { display: flex; gap: .65rem; flex-wrap: wrap; margin-top: 1rem; }
.account-button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.75rem; padding: .75rem 1rem; border-radius: 999px; border: 1px solid var(--account-green); background: var(--account-green); color: #fffaf0; text-decoration: none; font-weight: 700; cursor: pointer; }
.account-button--secondary { background: #fffaf0; color: var(--account-green); }
.account-button--ghost { background: transparent; color: var(--account-green-dark); border-color: var(--account-line); }
.account-card--hero .account-button--secondary, .account-card--hero .account-button--ghost { background: rgba(255,250,240,.12); color: #fffaf0; border-color: rgba(255,250,240,.6); }
.account-form { display: grid; gap: .9rem; }
.account-field { display: grid; gap: .35rem; }
.account-field label { font-weight: 700; }
.account-field input, .account-field select, .account-field textarea { width: 100%; box-sizing: border-box; border: 1px solid var(--account-line); border-radius: .8rem; min-height: 2.75rem; padding: .7rem .85rem; font: inherit; background: #fff; color: var(--account-ink); }
.account-field textarea { min-height: 7rem; resize: vertical; }
.account-message { border-radius: .9rem; padding: .8rem 1rem; background: rgba(31,90,59,.10); border: 1px solid rgba(31,90,59,.2); }
.account-message--error { background: rgba(127,29,29,.08); border-color: rgba(127,29,29,.2); color: var(--account-danger); }
.account-message--warning { background: rgba(122,75,0,.10); border-color: rgba(122,75,0,.25); color: var(--account-warning); }
.account-badge { display: inline-flex; border-radius: 999px; padding: .25rem .6rem; font-size: .82rem; font-weight: 800; border: 1px solid var(--account-line); background: rgba(31,90,59,.10); color: var(--account-green-dark); }
.account-badge--suspended, .account-badge--disabled { background: rgba(127,29,29,.08); color: var(--account-danger); }
.account-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; }
.account-list li { padding: .8rem; border: 1px solid var(--account-line); border-radius: .9rem; background: rgba(255,255,255,.45); }
.account-permissions { display: grid; gap: .75rem; }
.account-permissions details { border: 1px solid var(--account-line); border-radius: .9rem; padding: .75rem 1rem; background: rgba(255,255,255,.5); }
.account-permissions summary { font-weight: 800; cursor: pointer; }
.account-footer { border-top: 1px solid var(--account-line); padding: 1.5rem; text-align: center; color: var(--account-muted); background: #fffaf0; }
.account-footer a { color: var(--account-green-dark); }
.skip-link { position: absolute; left: -999px; top: .5rem; background: #fff; color: #000; padding: .6rem; z-index: 999; }
.skip-link:focus { left: .5rem; }
code { font-size: .92em; background: rgba(31,90,59,.08); padding: .1rem .3rem; border-radius: .3rem; }
@media (max-width: 760px) { .account-topbar { align-items: flex-start; flex-direction: column; } .account-nav { justify-content: flex-start; } .account-shell { width: min(100% - 1rem, 1120px); } .account-actions { flex-direction: column; } .account-button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }