body{font-family:Inter,Roboto,Helvetica,Arial,sans-serif;background:#f7f7f7;margin:0;padding:0;color:#222;}
header,footer{text-align:center;padding:1em;background:white;box-shadow:0 2px 4px rgba(0,0,0,.1);}
.panel{background:white;border-radius:1rem;margin:1em auto;padding:1em;max-width:800px;box-shadow:0 2px 8px rgba(0,0,0,.1);}
button{padding:.5em 1em;border:none;border-radius:.5em;font-size:1rem;cursor:pointer;}
button.blue{background:#007bff;color:#fff;}
button.orange{background:#ff9800;color:#fff;}
button.red{background:#e53935;color:#fff;}
.swatch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:.5em;margin-top:1em;}
.swatch{height:80px;border-radius:.5em;position:relative;}
.swatch span{position:absolute;bottom:4px;left:4px;font-size:.8em;background:rgba(255,255,255,.8);padding:2px 4px;border-radius:3px;}
.error{color:#e53935;}