:root{
  --bg:#f5f2eb;
  --surface:#fff;
  --surface-2:#faf9f6;
  --text-primary:#1a1a18;
  --text-mid:#4a4a44;
  --text-muted:#8a8a82;
  --border-light:#e0dbd0;
  --border-mid:#c8c2b4;
  --green:#27500A;
  --red:#e24b4a;
  --red-dark:#a32d2d;
  --red-pale:#fcebeb;
  --green-pale:#EAF3DE;
  --green-border:#97C459;
  --green-dark:#173404;
}

*{box-sizing:border-box}

body{
  margin:0;
  padding:2rem 1rem;
  background:var(--bg);
  font-family:'DM Sans',sans-serif;
  color:var(--text-primary);
}

#app{max-width:420px;margin:0 auto}

.app-title{
  font-family:'Fraunces',serif;
  font-size:21px;
  font-weight:600;
  color:var(--red);
  margin:0 0 1.25rem;
  text-align:center;
}

.card{
  background:var(--surface);
  border:0.5px solid var(--border-light);
  border-radius:14px;
  padding:1rem;
  margin-bottom:0.75rem;
}

.sec-title{
  font-family:'Fraunces',serif;
  font-size:19px;
  font-weight:600;
  color:#000;
  margin:0 0 0.75rem;
}

.divider{border-top:0.5px solid var(--border-light);margin:0.75rem 0}

.section-bg{
  background:var(--surface-2);
  border-radius:10px;
  padding:0.75rem;
  margin-bottom:0.75rem;
}

.itemhead{display:grid;grid-template-columns:1fr 90px auto;gap:6px;margin-bottom:4px}
.row-grid{display:grid;grid-template-columns:1fr 90px auto;gap:6px;align-items:center;margin-bottom:6px}

.coupon-grid{margin-bottom:6px}
.coupon-type-row{margin-bottom:8px}
.coupon-fields{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;align-items:center}
.coupon-fields-2{display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:center}

.colhead{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:0.04em;
  color:var(--text-muted);
  margin-bottom:4px;
}

input, select{
  font-size:14px;
  padding:9px 10px;
  border:0.5px solid var(--border-light);
  border-radius:10px;
  background:var(--surface-2);
  width:100%;
  color:var(--text-primary);
  transition:0.15s;
  font-family:'DM Sans',sans-serif;
}
.section-bg input{background:#fff}
input:focus, select:focus{outline:none;border-color:var(--green)}

button{
  font-family:'DM Sans',sans-serif;
  font-size:14px;
  font-weight:500;
  border-radius:10px;
  border:0.5px solid var(--border-light);
  padding:9px 12px;
  background:#fff;
  cursor:pointer;
  transition:0.15s;
}
button:active{transform:scale(0.98)}

.btn-primary{background:var(--green);color:#fff;border-color:var(--green)}
.btn-full{width:100%;padding:12px}

.btn-danger{border-color:var(--red);color:var(--red-dark);background:#fff}
.btn-danger:hover{background:var(--red-pale)}

.btn-add{font-size:13px;padding:7px 10px;width:100%;margin-top:4px}

.seller-name{
  font-size:16px;
  font-weight:500;
  color:var(--text-mid);
  margin-bottom:8px;
}

.coupon-num{
  font-size:15px;
  font-weight:500;
  color:var(--text-mid);
  margin-bottom:4px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.muted{font-size:13px;color:var(--text-muted)}
.mono{font-family:'DM Mono',monospace}

.result-box{border-radius:10px;padding:1rem;margin-bottom:0.75rem}
.result-ok{background:var(--green-pale);border:0.5px solid var(--green-border);color:var(--green-dark)}
.result-title{font-weight:500;font-size:15px;margin-bottom:4px}

.assign-row{
  display:flex;
  justify-content:space-between;
  padding:8px 0;
  border-bottom:0.5px solid var(--border-light);
  font-size:14px;
  gap:8px;
}
.assign-row:last-child{border-bottom:none}

.tag{
  display:inline-block;
  border-radius:20px;
  border:0.5px solid var(--border-mid);
  padding:2px 10px;
  font-size:12px;
  color:var(--text-mid);
  white-space:nowrap;
}

.icon-btn{padding:6px 8px}