/* China→USA Shipping Cost Calculator — tool styles (namespaced .usc-)
   与站点设计语言一致：ink #0A1628 / primary #2563EB / sand #F8F9FA */

.usc { --usc-ink:#0A1628; --usc-primary:#2563EB; --usc-sand:#F8F9FA; --usc-rule:#E4E7EC;
  --usc-muted:#68758A; --usc-ok:#0E7C56; --usc-warn:#B45309; --usc-danger:#B42318;
  color:var(--usc-ink); }
.usc * { box-sizing:border-box; }

.usc-tabs { display:flex; gap:4px; background:var(--usc-sand); padding:4px; border-radius:14px; margin-bottom:18px; overflow-x:auto; }
.usc-tab { flex:0 0 auto; border:0; background:transparent; color:#46536B; font-weight:600; font-size:14px;
  padding:9px 16px; border-radius:10px; cursor:pointer; white-space:nowrap; }
.usc-tab[aria-selected="true"] { background:#fff; color:var(--usc-primary); box-shadow:0 1px 3px rgba(10,22,40,.12); }
.usc-tabpanel[hidden] { display:none; }

.usc-grid { display:grid; grid-template-columns:380px minmax(0,1fr); gap:20px; align-items:start; }
@media (max-width:1023px){ .usc-grid { grid-template-columns:1fr; } }

.usc-panel { background:#fff; border:1px solid var(--usc-rule); border-radius:20px; }
.usc-panel__head { padding:14px 18px; border-bottom:1px solid var(--usc-rule); display:flex; align-items:center; gap:8px; }
.usc-panel__head h2 { font-size:15px; margin:0; font-weight:700; }
.usc-panel__body { padding:16px 18px 20px; }
.usc-sticky { position:sticky; top:78px; }
@media (max-width:1023px){ .usc-sticky { position:static; } }

.usc-field { margin-bottom:13px; }
.usc-field > label { display:block; font-size:12.5px; font-weight:700; color:#46536B; margin-bottom:5px; }
.usc-hint { font-size:11.5px; color:var(--usc-muted); margin-top:4px; line-height:1.45; }
.usc-row2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.usc-row3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }
.usc input[type=text], .usc input[type=number], .usc select, .usc textarea {
  width:100%; border:1px solid var(--usc-rule); border-radius:10px; padding:9px 11px; font-size:14px;
  color:var(--usc-ink); background:#fff; font-family:inherit; }
.usc input:focus, .usc select:focus, .usc textarea:focus { outline:2px solid rgba(37,99,235,.25); border-color:var(--usc-primary); }
.usc-unit { display:flex; align-items:center; gap:6px; }
.usc-unit span { font-size:12px; color:var(--usc-muted); white-space:nowrap; }

.usc-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; cursor:pointer;
  background:var(--usc-primary); color:#fff; font-weight:700; font-size:15px; padding:12px 20px; border-radius:12px;
  width:100%; font-family:inherit; }
.usc-btn:hover { background:#1D4ED8; }
.usc-btn--ghost { background:#fff; color:var(--usc-primary); border:1px solid var(--usc-primary); }
.usc-btn--wa { background:#128C7E; }
.usc-btn--sm { font-size:13px; padding:9px 14px; width:auto; }

.usc-cur { display:flex; gap:4px; background:var(--usc-sand); border-radius:10px; padding:3px; }
.usc-cur button { flex:1; border:0; background:transparent; font-size:12.5px; font-weight:700; color:#46536B;
  padding:6px 4px; border-radius:8px; cursor:pointer; font-family:inherit; }
.usc-cur button[aria-pressed="true"] { background:#fff; color:var(--usc-primary); box-shadow:0 1px 2px rgba(10,22,40,.12); }

.usc-summary { background:var(--usc-sand); border:1px solid var(--usc-rule); border-radius:14px; padding:14px 16px; margin-bottom:16px; }
.usc-summary__zone { font-size:20px; font-weight:800; margin:2px 0 6px; }
.usc-summary__row { display:flex; justify-content:space-between; font-size:13px; padding:3px 0; color:#46536B; }
.usc-summary__row b { color:var(--usc-ink); }
.usc-badge { display:inline-block; font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:999px;
  background:rgba(37,99,235,.1); color:var(--usc-primary); }

.usc-card { border:1px solid var(--usc-rule); border-radius:18px; padding:16px 18px; margin-bottom:14px; background:#fff; }
.usc-card--best { border-color:var(--usc-primary); box-shadow:0 4px 18px rgba(37,99,235,.10); }
.usc-card__top { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; flex-wrap:wrap; }
.usc-card__name { font-size:16px; font-weight:800; margin:0 0 3px; }
.usc-card__sub { font-size:12.5px; color:var(--usc-muted); }
.usc-card__price { text-align:right; min-width:130px; }
.usc-card__from { font-size:19px; font-weight:800; color:var(--usc-primary); line-height:1.15; }
.usc-card__usd { font-size:12.5px; color:var(--usc-muted); }
.usc-card__meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:12px; }
@media (max-width:640px){ .usc-card__meta { grid-template-columns:1fr 1fr; } }
.usc-meta__k { font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--usc-muted); font-weight:700; }
.usc-meta__v { font-size:13.5px; font-weight:600; }
.usc-notes { margin-top:10px; font-size:12.5px; color:#46536B; line-height:1.55; }
.usc-notes li { margin-bottom:4px; }
.usc-tag { display:inline-block; font-size:11px; font-weight:700; padding:2px 8px; border-radius:6px; margin-right:6px; }
.usc-tag--ok { background:rgba(14,124,86,.1); color:var(--usc-ok); }
.usc-tag--no { background:rgba(180,35,24,.09); color:var(--usc-danger); }
.usc-tag--warn { background:rgba(180,83,9,.1); color:var(--usc-warn); }

.usc-note { border-left:3px solid var(--usc-primary); background:rgba(37,99,235,.05); padding:11px 14px;
  border-radius:0 10px 10px 0; font-size:13px; line-height:1.6; margin:14px 0; }
.usc-note--warn { border-left-color:var(--usc-warn); background:rgba(180,83,9,.06); }

.usc-table { width:100%; border-collapse:collapse; font-size:13.5px; }
.usc-table th, .usc-table td { border-bottom:1px solid var(--usc-rule); padding:9px 10px; text-align:left; vertical-align:top; }
.usc-table th { font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--usc-muted); }
.usc-table--zones td { font-weight:600; }

.usc-quote { border:1px solid var(--usc-rule); border-radius:18px; padding:18px; background:#fff; margin-top:16px; }
.usc-quote[hidden] { display:none; }
.usc-quote__grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:640px){ .usc-quote__grid { grid-template-columns:1fr; } }
.usc-quote__ok { color:var(--usc-ok); font-weight:700; font-size:14px; }
.usc-quote__err { color:var(--usc-danger); font-weight:700; font-size:14px; }

.usc-chips { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 0; }
.usc-chip { font-size:11.5px; background:var(--usc-sand); border:1px solid var(--usc-rule);
  border-radius:999px; padding:4px 10px; color:#46536B; }
.usc-kv { font-size:13px; line-height:1.7; }
.usc-kv b { color:var(--usc-ink); }
.usc-list { margin:6px 0 0; padding-left:18px; font-size:13px; line-height:1.65; color:#46536B; }
.usc-empty { text-align:center; padding:26px 10px; color:var(--usc-muted); font-size:13.5px; }
.usc-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
