:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #172033; background: #f3f6fb; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
a { color: #225fc2; }
input, select, button { font: inherit; padding: 11px; border: 1px solid #cad4e3; border-radius: 9px; }
.wrap { width: min(940px, 100%); margin: auto; padding: 48px 24px; }
.panel { display: grid; gap: 18px; background: white; padding: 28px; border: 1px solid #e1e7f0; border-radius: 18px; box-shadow: 0 16px 50px rgba(20,36,68,.08); }
.form { display: grid; gap: 18px; }
.form > label { display: grid; gap: 6px; }
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.card { display: grid; gap: 8px; padding: 16px; border: 1px solid #dce4ef; border-radius: 12px; }
.card input { width: 90px; }
.button, button { display: inline-block; width: fit-content; background: #225fc2; color: white; border: 0; font-weight: 700; text-decoration: none; cursor: pointer; }
.button.secondary { background: #eaf0f8; color: #273852; }
.notice { background: #fff7da; border: 1px solid #f2d77d; padding: 16px; border-radius: 12px; }
.success { background: #e8f8ef; border-color: #94d5ac; }
.danger { background: #fff0f0; border-color: #efb1b1; }
.muted { color: #65728a; }
.status { display: inline-flex; width: fit-content; padding: 7px 11px; border-radius: 999px; background: #edf4ff; color: #235aa6; font-weight: 700; }
.summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.summary > div { background: #f7f9fc; padding: 14px; border-radius: 12px; }
.items { width: 100%; border-collapse: collapse; }
.items td, .items th { padding: 12px 8px; border-bottom: 1px solid #e8edf5; text-align: left; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pending-list { display: grid; gap: 10px; margin: 18px 0; }
.pending-item { display: grid; gap: 5px; padding: 14px; border: 1px solid #dce4ef; border-radius: 12px; }
@media (max-width: 700px) { .plans, .summary { grid-template-columns: 1fr; } .wrap { padding: 24px 16px; } }