.transit-scene{min-height:100dvh;box-sizing:border-box;padding:48px 20px;display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 28% 30%,#3353a936,transparent 46%),radial-gradient(ellipse at 76% 72%,#7654bb24,transparent 45%),linear-gradient(135deg,#101626,#202a38);color:#e2e8f0;font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif}
.transit-scene:before,.transit-scene:after{content:"";position:absolute;z-index:-1;width:340px;height:340px;filter:blur(65px);border-radius:50%;pointer-events:none;background:#4b6ac927;top:14%;left:20%;animation:transit-drift 14s ease-in-out infinite alternate}.transit-scene:after{top:auto;left:auto;bottom:12%;right:18%;background:#8a68c323;animation-delay:-7s}
.transit-card{box-sizing:border-box;width:506px;max-width:100%;padding:46px 32px;border:1px solid #b6caed30;border-radius:24px;background:linear-gradient(145deg,#26324985,#111827b8);backdrop-filter:blur(30px) saturate(125%);-webkit-backdrop-filter:blur(30px) saturate(125%);box-shadow:0 30px 70px -15px #0009,inset 0 1px 0 #e2eaff18,inset 0 -1px 0 #ffffff08;text-align:center}
.transit-header{display:flex;justify-content:center;align-items:center;gap:12px;margin:0 0 32px}.transit-header h1{font-size:22px;line-height:1.4;margin:0;color:#e9efff;font-weight:650;letter-spacing:.3px}.transit-shield{font-size:30px;filter:drop-shadow(0 0 12px #8fb9ff40)}
.transit-progress{height:6px;background:#c2d3f01b;border-radius:99px;overflow:hidden;margin:0 0 32px}.transit-progress #progress{height:100%;width:10%;background:linear-gradient(90deg,#7aaeff,#8984ed);border-radius:99px;box-shadow:0 0 14px #7ca8ff88;transition:width .7s ease}
.transit-state{min-height:172px}.transit-ring{width:68px;height:68px;position:relative;margin:0 auto 20px;display:grid;place-items:center}.transit-ring .spinner{position:absolute;inset:0;width:auto;height:auto;border:5px solid #d5dfff22;border-top-color:#a8b7ff;border-right-color:#859fee77;border-radius:50%;animation:transit-spin 1.1s linear infinite;box-sizing:border-box}.transit-ring .spinner.stopped{animation:none;border-color:#95b7df44}.transit-ring #seconds{font-size:24px;color:#b6d5ff;font-weight:500}
.transit-state h2{font-size:20px;font-weight:600;margin:12px 0 8px;color:#e2e8f0;line-height:1.5}.transit-state p{font-size:14px;color:#a0adc5;line-height:1.65;min-height:46px;margin:0}
.transit-status{display:flex;align-items:center;justify-content:center;gap:12px;margin:30px 0 0;font-size:12px;color:#8997b1;line-height:1.6}.transit-status i{width:7px;height:7px;border-radius:50%;background:#8bcab5;box-shadow:0 0 10px #8bcab544}
.transit-manual{display:inline-block;margin-top:28px;font-size:14px;color:#a6c3ff;text-decoration:underline dotted;text-underline-offset:4px;cursor:pointer;transition:color .2s}.transit-manual:hover{color:#d0e0ff}.transit-manual[aria-disabled=true]{cursor:default;opacity:.65}.transit-retry{display:block;margin:24px auto 0;padding:10px 24px;border:1px solid #b7caff44;border-radius:12px;background:#7c96dd24;color:#c5d8ff;cursor:pointer}.transit-pause{display:block;margin:16px auto 0;border:0;background:none;color:#94a3bd;font-size:12px;cursor:pointer}.transit-card [hidden]{display:none!important}.transit-preview{position:absolute;top:18px;left:0;right:0;text-align:center;color:#9aa9c0;font-size:11px;letter-spacing:1px}.transit-card .probe-details{text-align:left;font-size:12px;overflow-wrap:anywhere;color:#a5b4ca}.transit-card a:focus-visible,.transit-card button:focus-visible{outline:2px solid #b7cdff;outline-offset:6px}
@keyframes transit-spin{to{transform:rotate(360deg)}}@keyframes transit-drift{to{transform:translate(25px,-20px)}}
@media(max-width:550px){.transit-scene{padding:48px 18px}.transit-card{padding:36px 24px;border-radius:22px}.transit-header h1{font-size:20px}.transit-state h2{font-size:18px}.transit-state p{font-size:13px}}
@media(prefers-reduced-motion:reduce){.transit-scene:before,.transit-scene:after,.transit-ring .spinner{animation:none}.transit-progress #progress{transition:none}}
.transit-header{height:auto;padding:0;border:0}.transit-ring .spinner{margin:0;min-width:0;min-height:0;width:68px;height:68px}
