.ecc-muted{color:var(--ecc-muted)}
.ecc-spacer{flex:1}

.ecc-card + .ecc-card{margin-top:12px}

.ecc-section-title{font-size:16px;margin:0 0 8px}
.ecc-help{color:var(--ecc-muted);font-size:13px;margin:4px 0 0}

.ecc-form{display:flex;flex-direction:column;gap:10px}
.ecc-field{display:flex;flex-direction:column;gap:6px}
.ecc-label{font-weight:700;font-size:13px}
.ecc-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ecc-page-head{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;margin:0 0 14px}
.ecc-subtitle{color:var(--ecc-muted);margin:4px 0 0}
.ecc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ecc-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ecc-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ecc-tree{display:flex;flex-direction:column;gap:8px}
.ecc-tree-node{border:1px solid var(--ecc-border);border-radius:12px;padding:10px;background:var(--ecc-card)}
.ecc-tree-children{margin:8px 0 0 18px;display:flex;flex-direction:column;gap:8px}

.ecc-input--sm{min-width:120px;padding:8px 10px;border-radius:10px}
.ecc-input--full{width:100%;min-width:0}
.ecc-textarea{min-height:120px;resize:vertical}

.ecc-btn--ghost{
  background:transparent;
  border:1px solid var(--ecc-border);
  color:var(--ecc-text);
}
.ecc-btn--danger{
  background:var(--ecc-danger);
  color:#ffffff;
}

.ecc-badge{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid var(--ecc-border);
  background:var(--ecc-badge-bg, rgba(0,0,0,.04));
  font-size:12px;
  color:var(--ecc-text);
}
.ecc-badge[data-tone="success"]{border-color:rgba(22,163,74,.35);color:#166534;background:rgba(22,163,74,.08)}
.ecc-badge[data-tone="warning"]{border-color:rgba(245,158,11,.35);color:#92400e;background:rgba(245,158,11,.10)}
.ecc-badge[data-tone="danger"]{border-color:rgba(220,38,38,.35);color:#991b1b;background:rgba(220,38,38,.10)}

.ecc-table-wrap{overflow:auto;border:1px solid var(--ecc-border);border-radius:var(--ecc-radius);background:var(--ecc-table-wrap-bg, #fff)}
.ecc-table{width:100%;border-collapse:collapse;min-width:720px}
.ecc-table th,.ecc-table td{padding:10px 12px;border-bottom:1px solid var(--ecc-border);text-align:left;vertical-align:top}
.ecc-table th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--ecc-muted);background:var(--ecc-table-head-bg, rgba(0,0,0,.03));position:sticky;top:0}
.ecc-table tr:hover td{background:var(--ecc-table-hover-bg, rgba(0,0,0,.02))}
.ecc-table--dense th,.ecc-table--dense td{padding:8px 10px}

.ecc-pager{display:flex;gap:10px;align-items:center;margin:12px 0;flex-wrap:wrap}
.ecc-pager-page-input{
  box-sizing:border-box;
  width:48px;
  min-width:48px;
  max-width:48px;
  text-align:center;
  padding-left:6px;
  padding-right:6px;
}

.ecc-modal-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.55);
  display:none;
  align-items:center;justify-content:center;
  padding:18px;
  z-index:1000;
}
.ecc-modal{
  width:min(920px, 100%);
  max-height:min(86vh, 900px);
  overflow:auto;
  border-radius:16px;
  border:1px solid var(--ecc-border);
  background:var(--ecc-modal-bg, #fff);
  padding:14px;
}

.ecc-toast-host{
  position:fixed;right:14px;bottom:14px;z-index:1100;
  display:flex;flex-direction:column;gap:10px;
}
.ecc-toast{
  border:1px solid var(--ecc-border);
  background:var(--ecc-toast-bg, #fff);
  color:var(--ecc-text);
  border-radius:12px;
  padding:10px 12px;
  max-width:420px;
  box-shadow:var(--ecc-shadow-lg, 0 12px 30px rgba(0,0,0,.18));
}
.ecc-toast[data-tone="danger"]{border-color:rgba(239,68,68,.45)}
.ecc-toast[data-tone="success"]{border-color:rgba(34,197,94,.45)}
@media (max-width: 900px){
  .ecc-page-head{flex-direction:column}
  .ecc-grid,.ecc-grid--3,.ecc-grid--4{grid-template-columns:1fr}
}