/* account-plan.armagi.co: page-specific rules on top of base.css */
.inputs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.inputs .panel + .panel { margin-top: 0; }
.inputs .panel:first-child { background: #0f1d3d; color: #e6ebf5; border-color: #0f1d3d; }
.inputs .panel:first-child .tag { color: var(--gold-soft); }
.inputs .tag { color: var(--muted); }
.inputs b { display: block; font-size: 18px; margin-top: 4px; }
.items { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.item { font-size: 13px; padding: 3px 10px; border-radius: 99px; background: var(--page); color: var(--ink-2); }
.inputs .panel:first-child .item { background: rgba(255, 255, 255, .1); color: #e6ebf5; }

.step { animation: fade .3s ease-out; }
.step h3 { font-size: 24px; letter-spacing: -.015em; margin: 0; }
.step .body { color: var(--ink-2); margin: 6px 0 0; }
.step-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.step-grid > div { padding: 14px 16px; border-radius: 14px; }
.step-grid .tag { font-size: 11px; }
.step-grid p { margin: 6px 0 0; font-size: 15.5px; }
.step-grid .we { background: var(--tint); }
.step-grid .proof { background: var(--gold-bg); border: 1px solid var(--gold-line); }
.step-grid .bank { background: var(--page); }
.step-grid .bank .tag { color: var(--muted); }

.heat-box { overflow-x: auto; }
.heat-head, .heat-row { display: grid; grid-template-columns: 15em repeat(6, minmax(64px, 1fr)); gap: 4px; align-items: center; min-width: 620px; }
.heat-head .h { font-family: var(--mono); font-size: 10.5px; color: var(--muted); text-align: center; line-height: 1.3; }
.heat { display: grid; gap: 4px; margin-top: 6px; }
.heat-row { min-height: 44px; padding: 3px 4px; border: 1px solid transparent; border-radius: 10px; background: none; text-align: left; font-size: 15px; }
.heat-row[aria-pressed="true"] { border-color: var(--gold); background: var(--gold-bg); }
.heat-row .k { font-weight: 600; }
.cell { height: 30px; border-radius: 6px; }
.cell.l0 { background: var(--page); }
.cell.l1 { background: #c9d6ee; }
.cell.l2 { background: #8da6d4; }
.cell.l3 { background: #1B3A7B; }
.answer.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.never { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.rule { padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--card); }
.rule b { display: block; font-size: 16px; }
.rule span { font-size: 14px; color: var(--ink-2); }

@media (max-width: 860px) {
  .inputs, .step-grid, .answer.three { grid-template-columns: minmax(0, 1fr); }
  .never { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .never { grid-template-columns: minmax(0, 1fr); }
}