*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#2c2c2c;background:#f5f0eb;justify-content:center;align-items:flex-start;min-height:100dvh;padding:2rem 1rem;font-family:system-ui,-apple-system,sans-serif;display:flex}#game{width:100%;max-width:860px}h1{margin-bottom:.25rem;font-size:2rem}h2{text-transform:capitalize;margin-bottom:.5rem;font-size:1.4rem}.instruction{color:#666;margin-bottom:1rem}.card-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;margin:1rem 0 2rem;display:grid}.card{cursor:pointer;text-align:center;background:#fff;border:2px solid #ddd;border-radius:12px;justify-content:center;align-items:center;min-height:80px;padding:1rem;font-size:.9rem;font-weight:600;line-height:1.4;transition:border-color .15s,transform .15s,opacity .15s;display:flex}.card:hover:not(.disabled):not(.selected){border-color:#bbb;transform:translateY(-2px)}.card.selected{background:#fdf6f0;border-color:#e07b39}.card.disabled{opacity:.4;cursor:default}.budget-panel{background:#fff;border:1px solid #ddd;border-radius:12px;margin-bottom:1.5rem;padding:1rem 1.5rem}.budget-panel h3{color:#555;margin-bottom:.75rem;font-size:1rem}.budget-rows{flex-wrap:wrap;gap:.5rem 1.5rem;display:flex}.budget-row{gap:.4rem;font-size:.85rem;display:flex}.budget-row .label{color:#888}.budget-row .value{font-weight:700}.budget-row .value.over{color:#c0392b}.result{text-align:center;padding:2rem 0}.result h2{margin-bottom:1rem;font-size:2rem}.result p{color:#555;margin-bottom:1.5rem}.btn{color:#fff;cursor:pointer;background:#e07b39;border:none;border-radius:8px;padding:.75rem 2rem;font-size:1rem;font-weight:600;transition:background .15s;display:inline-block}.btn:hover{background:#c96a2c}
