/* /account — flat blocks, hard edges, the site's own tokens. Nothing here picks a
   colour of its own; every value is a --token from styles.css. */

.acct{max-width:56rem}
.acct .body{max-width:44rem}

.acct__msg{margin:1rem 0 0;font:500 .95rem/1.5 var(--font);color:var(--on-bone-2)}
.acct__msg.is-bad{color:var(--failover)}
.acct__msg[hidden]{display:none}

.acct__act{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;margin:1.6rem 0 2.2rem}

.acct__block{margin:2.6rem 0 0;padding-top:1.4rem;border-top:1px solid var(--rule-bone)}
.acct__block .subhead{margin:0 0 .6rem}

.acct__lic{border:1px solid var(--rule-bone);padding:1.1rem 1.2rem;margin:1rem 0 0;background:transparent}
.acct__lichead{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1rem;align-items:baseline}
.acct__plan{margin:0;font:600 1.15rem/1.2 var(--font);text-transform:capitalize;color:var(--on-bone)}
.acct__state{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--on-bone-3)}
.acct__seats{margin:.6rem 0 0;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--on-bone-2)}

.acct__seatlist{list-style:none;margin:.8rem 0 0;padding:0}
.acct__seat{display:grid;grid-template-columns:1fr auto;grid-template-areas:"name free" "meta free";gap:.1rem 1rem;align-items:center;padding:.7rem 0;border-top:1px solid var(--rule-bone)}
.acct__seatname{grid-area:name;font:500 1rem/1.3 var(--font);color:var(--on-bone)}
.acct__seatmeta{grid-area:meta;font:400 .78rem/1.4 var(--mono);color:var(--on-bone-3)}
.acct__free{grid-area:free;padding:.45rem .8rem;font-size:.82rem}

@media (max-width:520px){
  .acct__seat{grid-template-columns:1fr;grid-template-areas:"name" "meta" "free"}
  .acct__free{justify-self:start;margin-top:.4rem}
}