:root{--track-orange:#ff5620;--track-ink:#111;--track-black:#0b0b0b;--track-green:#99dc28;--track-gray:#292929;--track-soft:#f3f0eb}*{box-sizing:border-box}body{margin:0;background:var(--track-black);color:#fff;font-family:Manrope,Arial,sans-serif}.tracking-app{min-height:100dvh;background:radial-gradient(circle at 50% 18%,#2b2b2b 0,#111 39%,#090909 74%);padding:20px}.tracking-shell{max-width:940px;margin:auto}.tracking-top{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;margin:0 0 38px}.tracking-top a{width:46px;height:46px;display:grid;place-items:center;border:1px solid #454545;border-radius:50%;color:#fff;text-decoration:none;font:400 38px/.8 Arial}.tracking-top h1{margin:0;text-align:center;font:600 26px/1 Oswald,Manrope,sans-serif;letter-spacing:.01em;text-transform:uppercase}.tracking-tag{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 auto 28px;max-width:800px;padding:12px 15px;border:1px solid #3c3c3c;border-radius:12px;background:rgba(255,255,255,.04);font-size:11px;color:#bdbdbd}.tracking-tag b{color:#fff;font-size:12px}.tracking-gauge-area{position:relative;width:min(100%,650px);height:340px;margin:0 auto 10px;overflow:hidden}.tracking-gauge{position:absolute;left:50%;bottom:10px;width:580px;height:290px;transform:translateX(-50%);overflow:hidden}.tracking-gauge:before{content:"";position:absolute;width:520px;height:520px;left:30px;top:30px;border:25px solid #2d2d2d;border-bottom:0;border-radius:520px 520px 0 0;box-shadow:inset 0 0 0 1px #3a3a3a}.gauge-progress{position:absolute;width:520px;height:520px;left:30px;top:30px;border:25px solid transparent;border-top-color:var(--track-orange);border-left-color:var(--track-orange);border-bottom:0;border-radius:520px 520px 0 0;clip-path:inset(0 50% 0 0);filter:drop-shadow(0 0 9px rgba(255,86,32,.45))}.gauge-center{position:absolute;z-index:3;left:50%;bottom:6px;width:92px;height:92px;border:11px solid #181818;border-radius:50%;background:var(--track-orange);box-shadow:0 0 0 8px rgba(255,86,32,.13);transform:translateX(-50%)}.gauge-needle{--needle-rotation:-70deg;position:absolute;z-index:2;left:50%;bottom:47px;width:220px;height:10px;transform-origin:0 50%;transform:rotate(-110deg);transition:transform 1.45s cubic-bezier(.2,.9,.2,1);background:linear-gradient(90deg,#ff9f21,var(--track-orange));border-radius:999px;box-shadow:0 0 15px rgba(255,86,32,.55)}.tracking-shell.ready .gauge-needle{transform:rotate(var(--needle-rotation))}.gauge-labels{position:absolute;z-index:4;bottom:123px;left:50%;width:490px;display:flex;justify-content:space-between;transform:translateX(-50%);font-size:10px;font-weight:800;color:#858585}.gauge-labels b{color:#fff}.tracking-status{position:relative;max-width:700px;margin:-5px auto 32px;padding:20px 22px;border-radius:15px;background:var(--track-orange);text-align:center}.tracking-status:before{content:"";position:absolute;top:-11px;left:50%;width:22px;height:22px;background:var(--track-orange);transform:translateX(-50%) rotate(45deg)}.tracking-status b{position:relative;display:block;font:600 31px/1 Oswald,Manrope,sans-serif;letter-spacing:.02em;text-transform:uppercase}.tracking-status small{position:relative;display:block;margin-top:6px;font-size:12px;font-weight:700}.tracking-timeline{max-width:700px;margin:0 auto 24px;padding:24px;border:1px solid #393939;border-radius:15px;background:#161616}.timeline-row{display:grid;grid-template-columns:36px 1fr auto;gap:13px;align-items:center;padding:13px 0;border-bottom:1px solid #2e2e2e;color:#888}.timeline-row:last-child{border-bottom:0}.timeline-check{width:28px;height:28px;display:grid;place-items:center;border:1px solid #555;border-radius:50%;font-size:15px}.timeline-row.done{color:#fff}.timeline-row.done .timeline-check{border-color:var(--track-green);background:var(--track-green);color:#111;font-weight:900}.timeline-row b{font-size:13px}.timeline-row small{font-size:10px;color:#949494}.tracking-details{max-width:700px;margin:0 auto 38px;border-radius:15px;overflow:hidden;background:var(--track-soft);color:#111}.tracking-details h2{margin:0;padding:18px 21px;background:#111;color:#fff;font:600 22px/1 Oswald,Manrope,sans-serif;letter-spacing:.02em}.tracking-details-grid{display:grid;grid-template-columns:1fr 1fr}.track-detail{min-height:112px;padding:20px;border-right:1px solid #d6d1ca;border-bottom:1px solid #d6d1ca}.track-detail:nth-child(2n){border-right:0}.track-detail b{display:block;margin:0 0 6px;font-size:11px;color:#777;text-transform:uppercase;letter-spacing:.05em}.track-detail span{font-size:15px;font-weight:800;line-height:1.4}.track-route{display:flex;justify-content:space-between;gap:15px;padding:18px 21px;background:var(--track-orange);color:#111;font-weight:900}.track-route i{font-style:normal;color:#fff}.tracking-empty{min-height:100dvh;display:grid;place-items:center;text-align:center}.tracking-empty h1{font-size:25px}.tracking-empty a{color:#fff}.status-delivered .tracking-status{background:var(--track-orange)}@media(max-width:600px){.tracking-app{padding:16px}.tracking-top{margin-bottom:25px}.tracking-top h1{font-size:22px}.tracking-tag{font-size:10px}.tracking-gauge-area{height:250px}.tracking-gauge{width:430px;height:215px}.tracking-gauge:before,.gauge-progress{width:380px;height:380px;left:25px;top:25px;border-width:19px}.gauge-center{bottom:0;width:70px;height:70px;border-width:8px}.gauge-needle{bottom:31px;width:150px;height:8px}.gauge-labels{bottom:91px;width:355px;font-size:8px}.tracking-status{margin-top:-1px;padding:18px 12px}.tracking-status b{font-size:26px}.tracking-timeline{padding:17px}.timeline-row{grid-template-columns:33px 1fr auto;gap:9px}.timeline-row b{font-size:12px}.tracking-details-grid{grid-template-columns:1fr}.track-detail,.track-detail:nth-child(2n){border-right:0}.track-detail{min-height:90px}.track-route{font-size:12px}.tracking-details h2{font-size:19px}}