:root{
  --me-blue:#1E3A8A;
  --me-gold:#D4AF37;
  --me-bg:#F5F5F5;
  --me-white:#FFFFFF;
  --me-text:#333333;
  --me-muted:#555555;
}

.me-wrap{ background:var(--me-bg); padding:24px; }
.me-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.me-title{ font-size:24px; font-weight:700; color:#fff; background:var(--me-blue); padding:10px 16px; border-radius:8px; }
.me-nav a{ margin:0 8px; color:var(--me-muted); text-decoration:none; font-weight:600; }
.me-nav a.active{ color:var(--me-blue); border-bottom:2px solid var(--me-gold); }

.me-card{ background:var(--me-white); border-radius:12px; padding:16px; box-shadow:0 2px 10px rgba(0,0,0,.05); border:1px solid #eee; }
.me-input-card{ margin-bottom:16px; }
.me-label{ display:block; color:var(--me-muted); margin-bottom:6px; }
.me-input-row{ display:flex; gap:10px; }
#me-area{ flex:1; padding:10px 12px; border:1px solid #ddd; border-radius:8px; font-size:15px; color:var(--me-text); background:#fff; }
.me-btn{ background:var(--me-gold); color:#000; border:none; border-radius:8px; padding:10px 16px; font-weight:700; cursor:pointer; }
.me-btn:hover{ filter:brightness(0.95); }

.me-meta{ margin-top:8px; display:flex; gap:16px; color:var(--me-muted); font-size:13px; }

.me-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; margin-top:16px; }

.me-item .me-item-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.me-item-title{ font-weight:700; color:var(--me-text); }
.me-item-brand{ color:var(--me-muted); font-size:13px; }

.me-item-row{ display:flex; align-items:center; gap:8px; margin:6px 0; }
.me-muted{ color:var(--me-muted); }
.me-strong{ color:var(--me-text); font-weight:700; }
.me-unit-label{ color:var(--me-muted); font-size:12px; }

.me-item-total{ display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.me-total-badge{ background:var(--me-gold); padding:6px 10px; border-radius:999px; color:#000; border:1px solid rgba(0,0,0,.08); }
.me-total-badge b{ font-weight:800; }

.me-cut-btn{ background:transparent; border:1px solid var(--me-gold); color:var(--me-blue); padding:6px 10px; border-radius:8px; cursor:pointer; font-weight:600; }
.me-cut-btn.active{ transform:scale(0.97); }

.me-summary{ margin-top:16px; }
.me-summary-row{ display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px dashed #e6e6e6; }
.me-summary-row.total{ border-bottom:none; font-size:18px; color:var(--me-blue); font-weight:800; }

@media (max-width:600px){
  .me-input-row{ flex-direction:column; }
}
