
#ax-pane{max-width:none;padding:2px 0 0;margin:0}
#ax-pane .ax-intro{font-size:12.5px;color:var(--text2);line-height:1.5;margin:0 0 16px;max-width:820px}
#ax-pane .ax-sec{margin:0 0 12px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
#ax-pane .ax-sec h2{font-size:15px;font-weight:800;color:var(--text);margin:0;letter-spacing:-.2px}
#ax-pane .ax-sec p{font-size:12px;color:var(--text3);margin:0;flex:1;min-width:220px}
#ax-pane .ax-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;margin-bottom:30px}
.ax-card{background:var(--bg2,#171c22);border:1px solid var(--border,#2a313a);border-radius:12px;padding:14px 15px;display:flex;flex-direction:column;gap:9px}
.ax-card.editing{border-color:var(--blue-m,#5cc6d1);box-shadow:0 0 0 1px var(--blue-m,#5cc6d1) inset;grid-column:1/-1}
/* Full width while open. Left in its column the editor is far taller than a card, and a
   grid row is as tall as its tallest item — so every neighbour stretched to match and the
   levels beside it turned into mostly empty boxes. */
@media (min-width:900px){ #ax-pane .ax-card.editing .ax-grp{max-width:640px} }
.ax-c-top{display:flex;align-items:flex-start;gap:8px}
.ax-c-name{font-size:14px;font-weight:800;color:var(--text);flex:1;min-width:0;letter-spacing:-.1px}
.ax-money{font-size:10px;font-weight:800;letter-spacing:.4px;border-radius:999px;padding:2px 8px;white-space:nowrap}
.ax-money.on{background:#2b6a4a;color:#c9f5dc}
.ax-money.off{background:#2a313a;color:#98a1ab}
.ax-c-desc{font-size:11.5px;color:var(--text3);line-height:1.45}
.ax-chips{display:flex;flex-wrap:wrap;gap:4px}
.ax-chip{font-size:10.5px;background:rgba(92,198,209,.12);border:1px solid rgba(92,198,209,.25);color:var(--blue-m,#5cc6d1);border-radius:999px;padding:2px 7px}
.ax-chip.none{background:rgba(255,255,255,.04);border-color:var(--border,#2a313a);color:var(--text3)}
.ax-c-foot{display:flex;align-items:center;gap:7px;margin-top:auto;padding-top:6px;flex-wrap:wrap}
/* The roll-call gets its own line: squeezed beside three buttons it wrapped to two lines
   and shoved them out of alignment with the next card. margin-top:auto above pins every
   card's buttons to the same baseline however many area chips sit above them. */
.ax-users{font-size:11px;color:var(--text3);flex:1 1 100%}
#ax-pane .ax-ed{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--border,#2a313a);padding-top:11px}
#ax-pane .ax-ed label.ax-l{font-size:11px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--text3);display:block;margin-bottom:4px}
#ax-pane .ax-ed input[type=text],#ax-pane .ax-ed textarea{width:100%;background:var(--bg,#10141a);border:1px solid var(--border,#2a313a);border-radius:8px;color:var(--text);font-size:12.5px;padding:7px 9px;outline:none;font-family:inherit}
#ax-pane .ax-ed textarea{resize:vertical;min-height:44px;line-height:1.45}
.ax-grp{border:1px solid var(--border,#2a313a);border-radius:10px;overflow:hidden}
.ax-grp-t{font-size:10.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--text3);background:rgba(255,255,255,.03);padding:6px 10px}
.ax-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-top:1px solid rgba(255,255,255,.05)}
.ax-row.locked{opacity:.45}
.ax-r-l{font-size:12.5px;font-weight:600;color:var(--text)}
.ax-r-s{font-size:10.5px;color:var(--text3);line-height:1.35}
.ax-r-txt{flex:1;min-width:0}
.ax-people{border:1px solid var(--border,#2a313a);border-radius:12px;overflow:hidden;background:var(--bg2,#171c22)}
.ax-p-row{display:flex;align-items:center;gap:10px;padding:11px 14px;border-top:1px solid rgba(255,255,255,.05);flex-wrap:wrap}
.ax-p-row:first-child{border-top:none}
.ax-p-who{flex:1;min-width:170px}
.ax-p-n{font-size:13px;font-weight:700;color:var(--text)}
.ax-p-e{font-size:11px;color:var(--text3)}
.ax-p-row select{background:var(--bg,#10141a);border:1px solid var(--border,#2a313a);border-radius:8px;color:var(--text);font-size:12.5px;padding:7px 9px;outline:none;min-width:170px;font-family:inherit}
.ax-p-cust{width:100%;padding:2px 0 6px}
.ax-empty{padding:26px 18px;text-align:center;color:var(--text3);font-size:12.5px;line-height:1.6}
.ax-note{font-size:11.5px;color:var(--text3);line-height:1.5;margin:8px 0 0}
.ax-warn{color:#f0b866}
