/* Maliaz admin: page layouts on top of /shared/brand.css */
.auth-art { display: grid; place-items: center; }
.auth-art .art-grid { display: grid; grid-template-columns: repeat(2, 220px); gap: 14px; transform: rotateY(-8deg) rotateX(4deg); perspective: 1200px; }
.auth-art .art-grid .kpi { animation: floatB 9s ease-in-out infinite alternate; }
.auth-art .art-grid .kpi:nth-child(2) { animation-delay: -3s; } .auth-art .art-grid .kpi:nth-child(3) { animation-delay: -6s; }
@keyframes floatB { from { translate: 0 0; } to { translate: 0 -12px; } }

.clients-table td.r { font-variant-numeric: tabular-nums; }
.clients-table .co { display: grid; gap: 2px; }
.clients-table .co span { font-size: var(--fs-cap); color: var(--faint); }
.pipe-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.card .c-co { font-size: 0.66rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--champagne); font-weight: 800; }
.card .c-co.ice { color: var(--ice); }
.bill-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; }
.bill-bal { grid-column: span 5; } .bill-led { grid-column: span 7; }
@media (max-width: 1000px) { .bill-bal, .bill-led { grid-column: span 12; } }
.ledger { display: grid; gap: 6px; }
.ledger > div { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, 0.03); border: 1px solid var(--line); font-size: var(--fs-sm); }
.ledger > div span { color: var(--muted); font-size: var(--fs-cap); }
.ledger > div .amt { font-family: var(--serif); font-size: 1.15rem; }
.ledger > div .amt.neg { color: var(--good); }
.bal-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, 0.03); border: 1px solid var(--line); font-size: var(--fs-sm); cursor: pointer; }
.bal-row:hover { background: rgba(255, 255, 255, 0.06); }
.bal-row b.amt { font-family: var(--serif); font-size: 1.25rem; color: var(--champagne-hi); }
.codes-list { display: grid; gap: 10px; }
.code-item { display: grid; gap: 8px; padding: 16px 18px; }
.code-item .c-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.code-item .c-ref { font-size: var(--fs-cap); letter-spacing: 0.1em; text-transform: uppercase; color: var(--champagne); font-weight: 800; }
.code-item h3 { font-family: var(--serif); font-size: 1.3rem; }
.code-item p { font-size: var(--fs-sm); color: var(--ink-2); max-width: 78ch; }
.code-item .c-foot { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; font-size: var(--fs-cap); color: var(--faint); }
.code-item .c-foot a { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; }
.code-item .c-foot a svg { width: 13px; height: 13px; }
.trade-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.trade-chips label { display: inline-flex; gap: 6px; align-items: center; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--line-2); font-size: var(--fs-sm); cursor: pointer; }
.trade-chips label:has(input:checked) { border-color: var(--champagne); background: var(--champagne-soft); }
.trade-chips input { accent-color: var(--champagne); }
.wizard-steps { display: flex; gap: 8px; margin-bottom: 18px; }
.wizard-steps span { flex: 1; height: 4px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); }
.wizard-steps span.on { background: var(--champagne); box-shadow: 0 0 10px var(--champagne); }
.set-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; }
.set-grid > * { grid-column: span 6; }
@media (max-width: 1000px) { .set-grid > * { grid-column: span 12; } }
.kv { display: grid; gap: 8px; }
.kv > div { display: grid; gap: 3px; padding: 12px 14px; border-radius: var(--r-md); background: rgba(0, 0, 0, 0.25); border: 1px solid var(--line); }
.kv dt { font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--faint); font-weight: 700; }
.kv dd { margin: 0; font-size: var(--fs-sm); }
.kv code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--champagne-hi); overflow-wrap: anywhere; font-size: 0.85rem; }
.load-err { max-width: 520px; margin: 40px auto; text-align: center; gap: 12px; }
.load-err h2 { font-family: var(--serif); font-size: 1.8rem; }
.demo-link { all: unset; cursor: pointer; color: var(--champagne); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.choices button { height: 52px; border-radius: 14px; border: 1px solid var(--line-2); background: rgba(255, 255, 255, 0.04); font-weight: 700; }
.choices button[aria-pressed="true"] { background: var(--champagne-soft); border-color: var(--champagne); color: var(--champagne-hi); }