
.p4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch}
@media(max-width:1060px){.p4{grid-template-columns:1fr 1fr}}@media(max-width:640px){.p4{grid-template-columns:1fr}}
.price .amt{font-size:46px}
.price .tagline{font-size:14px;color:var(--muted);min-height:42px}
.price.pop .tagline{color:color-mix(in srgb,var(--bg) 80%,transparent)}
.price .when{font:500 11px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.price.pop .when{color:var(--accent3)}
.badge-top{position:absolute;top:-14px;left:24px}
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.how{grid-template-columns:1fr}}
.how .card h3{margin:10px 0 6px}
.num{width:42px;height:42px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font:700 19px var(--font-display);border:var(--bw) solid var(--ink)}
[data-theme="a"] .num{border-color:var(--accent)}
.add{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.add{grid-template-columns:1fr}}
.add .card{display:grid;gap:8px;align-content:start}
.add .p{font-family:var(--font-display);font-weight:var(--dw);font-size:32px;letter-spacing:var(--dls)}
.add .p small{font:500 13px var(--font-body);color:var(--muted);letter-spacing:0}
table.mx{width:100%;border-collapse:separate;border-spacing:0;font-size:14.5px;background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.mx th,.mx td{padding:14px 16px;text-align:center;border-bottom:var(--bw) solid var(--line)}
.mx th:first-child,.mx td:first-child{text-align:left;font-weight:600}
.mx thead th{font:500 11px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);background:color-mix(in srgb,var(--bg2) 55%,var(--surface))}
.mx tr:last-child td{border-bottom:0}
.mx .y{color:var(--good);font-weight:800}.mx .n{color:var(--muted)}.mx small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.mx td.hl,.mx th.hl{background:var(--soft)}
@media(max-width:760px){.mx{font-size:12px}.mx th,.mx td{padding:9px 6px}}
.ex{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.ex{grid-template-columns:1fr}}
.ex .card{padding:22px}.ex .who{font:500 11px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.ex .tot{font-family:var(--font-display);font-weight:var(--dw);font-size:34px;letter-spacing:var(--dls);margin:6px 0}
.ex .tot small{font:500 14px var(--font-body);color:var(--muted)}
