.mr{--mr-loop:12s;--mr-good:#067a3a;--mr-bad:var(--accent-text);border:1px solid var(--line);background:var(--card);border-radius:1rem;font-size:.75rem;line-height:1.4;overflow:hidden;container:mr/inline-size}.dark .mr{--mr-good:#3ddc84}.mr-head{border-bottom:1px solid var(--line);background:var(--bg-subtle);font-family:var(--font-geist-mono), ui-monospace, monospace;color:var(--fg-muted);align-items:center;gap:.6rem;padding:.6rem .9rem;display:flex}.mr-dots{gap:.35rem;display:flex}.mr-dots i{background:var(--line-strong);border-radius:9999px;width:.55rem;height:.55rem}.mr-title{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.mr-tag{border:1px solid var(--line-strong);text-transform:uppercase;border-radius:9999px;margin-left:auto;padding:.05rem .5rem;font-size:.625rem}.mr-race{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:1rem .9rem 1.1rem;display:grid}.mr-side{grid-row:span 4;grid-template-rows:subgrid;grid-template-areas:"name""phone""stats""checks";align-content:start;row-gap:.75rem;display:grid}@container mr (min-width:52rem){.mr-race{gap:2.5rem;padding:1.75rem 2rem 2rem;font-size:.8125rem}.mr-side{grid-template:"phone."1fr"phone name""phone stats""phone checks""phone."1fr/minmax(0,11.5rem) minmax(0,1fr);grid-row:auto;column-gap:1.5rem}}.mr-name{grid-area:name;align-content:start;margin:0;display:grid}.mr-name b{color:var(--fg);font-size:.9375rem;font-weight:500}.mr-name small{font-size:inherit;color:var(--fg-muted)}.mr-phone{border:1px solid var(--line-strong);background:var(--bg-subtle);border-radius:1.1rem;grid-area:phone;width:100%;max-width:12rem;padding:.3rem;box-shadow:0 24px 48px -28px #00000059;container-type:inline-size}.mr-bar{font-family:var(--font-geist-mono), ui-monospace, monospace;white-space:nowrap;color:var(--fg-muted);justify-content:center;align-items:center;gap:.3em;padding:.2em .3em .45em;font-size:6.4cqi;display:flex;overflow:hidden}.mr-warn{color:var(--mr-bad)}.mr-lock{fill:none;width:1.1em;height:1.1em;stroke:var(--mr-good);stroke-width:2.4px;flex:none}.mr-screen{aspect-ratio:9/15;background:#fff;border-radius:.8rem;position:relative;overflow:hidden}.is-new .mr-screen{background:var(--bg)}.mr-page{height:100%}.mr-progress{transform-origin:0;background:var(--accent);opacity:0;height:3px;position:absolute;inset:0 0 auto}.mr-spin{opacity:0;border:1.5cqi solid #d4d4d4;border-top-color:#737373;border-radius:9999px;width:16cqi;height:16cqi;margin:-8cqi 0 0 -8cqi;position:absolute;top:50%;left:50%}.mr-toast{color:#fff;background:#171717;border-radius:3cqi;margin:0;padding:3cqi 4cqi;font-size:6cqi;line-height:1.3;position:absolute;inset:auto 4cqi 4cqi;box-shadow:0 6px 16px -6px #00000080}.mr-old{color:#333;padding:4cqi;font-family:Georgia,Times New Roman,serif}.mr-old-top{background:linear-gradient(#5b7fb3,#2e5287);border-radius:1cqi;gap:2cqi;padding:2.5cqi 3cqi;display:grid}.mr-old-top b{color:#fff;font-size:4.2cqi;font-weight:700}.mr-old-nav{gap:2cqi;display:flex}.mr-old-nav i{background:#ffffff8c;border-radius:1cqi;flex:1;height:1.6cqi}.mr-old-banner{background:linear-gradient(135deg,#c9ced6,#a7afba);border-radius:1cqi;height:30cqi;margin-top:3cqi}.mr-old-cols{grid-template-columns:repeat(3,1fr);gap:3cqi;margin-top:4cqi;display:grid}.mr-old-cols span{gap:1.6cqi;display:grid}.mr-old-cols i{background:#c4c4c4;border-radius:1cqi;height:1.6cqi}.mr-old-cols i:first-child{background:#1a0dab;width:70%;height:2.2cqi}.mr-old-text{grid-template-columns:2fr 1fr;gap:3cqi;margin-top:4cqi;display:grid}.mr-old-text span{align-content:start;gap:1.6cqi;display:grid}.mr-old-text i{background:#d4d4d4;border-radius:1cqi;height:1.6cqi}.mr-old-text i:last-child{width:60%}.mr-old-text b{background:#e5e7eb;border-radius:1cqi;height:22cqi}.mr-old-foot{color:#555;margin:5cqi 0 0;font-size:3.4cqi}.mr-new{color:var(--fg);align-content:start;gap:4cqi;padding:6cqi;display:grid}.mr-new-top{align-items:center;gap:3cqi;font-size:6.5cqi;display:flex}.mr-new-top b{font-weight:600}.mr-logo{background:var(--accent);border-radius:2.5cqi;width:8cqi;height:8cqi}.mr-menu{gap:1.6cqi;width:8cqi;margin-left:auto;display:grid}.mr-menu i{background:var(--fg);border-radius:1cqi;height:1cqi}.mr-new-open{color:var(--mr-good);background:#067a3a1f;border-radius:9999px;justify-self:start;margin:3cqi 0 0;padding:1.2cqi 3.5cqi;font-size:5.2cqi}.mr-new-h{letter-spacing:-.02em;margin:0;font-size:11.5cqi;line-height:1.1}.mr-new-btn{background:var(--accent-strong);text-align:center;color:#fff;border-radius:3cqi;padding:3.5cqi;font-size:6cqi;font-weight:500}.mr-new-btn.is-ghost{border:1px solid var(--line-strong);color:var(--fg);background:0 0;margin-top:-1.5cqi}.mr-new-card{border:1px solid var(--line);background:var(--bg-subtle);border-radius:3cqi;height:26cqi}.mr-stats{border-top:1px solid var(--line);grid-area:stats;margin:0}.mr-stats div{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:.5rem;padding:.4rem 0;display:flex}.mr-stats dt{font-family:var(--font-geist-mono), ui-monospace, monospace;color:var(--fg-muted);font-size:.6875rem}.mr-stats dd{font-variant-numeric:tabular-nums;align-items:center;gap:.35rem;margin:0;font-size:1rem;font-weight:500;display:flex}.is-old dd{color:var(--mr-bad)}.is-new dd{color:var(--mr-good)}.mr-ring{width:1.05rem;height:1.05rem;transform:rotate(-90deg)}.mr-ring circle{fill:none;stroke:var(--line);stroke-width:5px}.mr-ring circle+circle{stroke:currentColor;stroke-linecap:round}.mr-checks{grid-area:checks;gap:.35rem;margin:0;padding:0;list-style:none;display:grid}.mr-checks li{color:var(--fg);gap:.4rem;display:flex}.mr-checks svg{flex:none;width:.95rem;height:.95rem;margin-top:.05rem}.is-old .mr-checks svg{color:var(--mr-bad)}.is-new .mr-checks svg{color:var(--mr-good)}[data-play] :is(.mr-progress,.mr-spin,.mr-old-top,.mr-old-rest,.mr-old-banner,.mr-new,.mr-toast,.mr-checks li){animation-duration:var(--mr-loop);animation-timing-function:linear;animation-delay:calc(var(--mr-loop) * -.8);animation-iteration-count:infinite;animation-fill-mode:both}[data-play] .is-new .mr-progress{animation-name:mr-bar-new}[data-play] .is-old .mr-progress{animation-name:mr-bar-old}[data-play] .mr-spin{animation-name:mr-spin}[data-play] .mr-old-top{animation-name:mr-old-top}[data-play] .mr-old-rest{animation-name:mr-old-rest}[data-play] .mr-old-banner{animation-name:mr-old-banner}[data-play] .mr-new{animation-name:mr-new}[data-play] .mr-toast{animation-name:mr-toast}[data-play] .mr-checks li{animation-delay:calc(var(--mr-loop) * -.8 + var(--i) * .25s)}[data-play] .is-new .mr-checks li{animation-name:mr-check-new}[data-play] .is-old .mr-checks li{animation-name:mr-check-old}@keyframes mr-bar-new{0%,2%{opacity:1;transform:scaleX(0)}11.2%{opacity:1;transform:scaleX(1)}12.5%,to{opacity:0;transform:scaleX(1)}}@keyframes mr-bar-old{0%,2%{opacity:1;transform:scaleX(0)}12%{transform:scaleX(.25)}27%{transform:scaleX(.32)}40%{transform:scaleX(.6)}52%{transform:scaleX(.7)}58.7%{opacity:1;transform:scaleX(1)}60%,to{opacity:0;transform:scaleX(1)}}@keyframes mr-spin{0%,2%{opacity:0;transform:rotate(0)}3%{opacity:1}39.9%{opacity:1;transform:rotate(1440deg)}40%,to{opacity:0;transform:rotate(1440deg)}}@keyframes mr-old-top{0%,40%{clip-path:inset(0 0 100%)}41%,to{clip-path:inset(0)}}@keyframes mr-old-rest{0%,47%{clip-path:inset(0 0 100%)}50%{clip-path:inset(0 0 55%)}55%{clip-path:inset(0 0 40%)}58.7%,to{clip-path:inset(0)}}@keyframes mr-old-banner{0%,56%{height:0}58.7%,to{height:30cqi}}@keyframes mr-new{0%,11.2%{clip-path:inset(0 0 100%)}13%,to{clip-path:inset(0)}}@keyframes mr-toast{0%,27%{clip-path:inset(0 100% 0 0)}28.5%,to{clip-path:inset(0)}}@keyframes mr-check-new{0%,13%{clip-path:inset(0 100% 0 0)}15%,to{clip-path:inset(0)}}@keyframes mr-check-old{0%,60%{clip-path:inset(0 100% 0 0)}62%,to{clip-path:inset(0)}}
