.shptrk-widget { max-width: 600px; margin: 0 auto; font-family: inherit; }
.shptrk-hero { text-align: center; margin-bottom: 20px; }
.shptrk-hero h3 { margin-bottom: 4px; }
.shptrk-form { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-top: 14px; }
.shptrk-form input[type=text] { flex: 1; min-width: 220px; padding: 12px 14px; border: 1px solid #ccc; border-radius: 6px; font-size: 1rem; }
.shptrk-form button { padding: 12px 22px; border: none; border-radius: 6px; background: #0d5f8a; color: #fff; font-weight: 600; cursor: pointer; }
.shptrk-form button:hover { background: #084160; }
.shptrk-result { margin-top: 20px; }
.shptrk-card { background: #fff; border: 1px solid #e3e6ea; border-radius: 10px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.shptrk-summary { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #eee; }
.shptrk-summary .label { font-size: .72rem; text-transform: uppercase; color: #6c757d; letter-spacing: .04em; }
.shptrk-summary .value { font-weight: 600; }
.shptrk-badge { display: inline-block; padding: 4px 12px; border-radius: 16px; background: #e7f1f8; color: #084160; font-weight: 600; font-size: .82rem; }
.shptrk-timeline { list-style: none; padding: 0; margin: 0; }
.shptrk-timeline li { position: relative; padding: 0 0 20px 28px; border-left: 2px solid #dee2e6; }
.shptrk-timeline li:last-child { border-left-color: transparent; padding-bottom: 0; }
.shptrk-timeline .dot { position: absolute; left: -7px; top: 0; width: 12px; height: 12px; border-radius: 50%; background: #adb5bd; border: 3px solid #fff; box-shadow: 0 0 0 2px #adb5bd; }
.shptrk-timeline li.done .dot { background: #198754; box-shadow: 0 0 0 2px #198754; }
.shptrk-timeline li.current .dot { background: #0d5f8a; box-shadow: 0 0 0 4px rgba(13,95,138,.25); }
.shptrk-error { text-align: center; color: #842029; padding: 20px; }
.shptrk-loading { text-align: center; color: #6c757d; padding: 20px; }