*{ box-sizing: border-box;}
body {  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; margin: 24px; }
.card { max-width: 1100px; margin: 0 auto 1rem; padding: 20px; border: 1px solid #e6e6e6; border-radius: 12px; box-shadow: 0 2px 8px rgba(0,0,0,0.05);}    
label { display:block; margin: 12px 0 6px; font-weight:600; }
select, button { width:100%; padding:10px; border:1px solid #ccc; border-radius:8px; font-size:16px; }
.row { display:flex; gap:12px; }
.row > div { flex:1; }
.total { margin-top: 16px; font-weight:700; font-size: 18px; }
.hint { color:#666; font-size:12px; margin-top:4px; }
.flash { background:#ecfdf5; color:#065f46; padding:10px 12px; border-radius:8px; margin-bottom:12px; border:1px solid #a7f3d0; }
.errors { background:#fef2f2; color:#991b1b; padding:10px 12px; border-radius:8px; margin-bottom:12px; border:1px solid #fecaca; }
ul{
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    gap: 10px;
}
.btn{
    text-decoration: none;
    padding: 10px 1em ;
    display: inline-block;
}

@media screen and (max-width: 768px) {
    .card{
        width: 100%;
    }
    .grid{
        gap: 0!important;
    }
}