.pm-stage{--ph:var(--bad);text-align:center;padding:22px 18px 18px;background:color-mix(in srgb,var(--ph) 7%,var(--surface));border-color:color-mix(in srgb,var(--ph) 25%,var(--border));transition:background .4s,border-color .4s}
.pm-stage[data-phase=short]{--ph:var(--good)}
.pm-stage[data-phase=long]{--ph:var(--brand)}
.pm-phases{background:color-mix(in srgb,var(--ph) 10%,var(--surface-2))}
.pm-phases button{min-height:38px;padding:6px 12px}
.pm-phases button[aria-pressed=true]{color:var(--ph)}
.pm-digits{font-size:clamp(72px,22vw,132px);font-weight:700;line-height:1.05;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin:14px 0 14px;color:var(--ph);white-space:nowrap}
.pm-digits.long{font-size:clamp(54px,16vw,112px)}
.pm-bar{height:8px;background:color-mix(in srgb,var(--ph) 14%,var(--surface-2));border-radius:99px;overflow:hidden;max-width:520px;margin:0 auto}
.pm-bar i{display:block;height:100%;width:0;background:var(--ph);border-radius:inherit;transition:width .3s linear}
.pm-cycle{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:12px;color:var(--muted);font-weight:600;font-size:15px;min-height:24px}
.pm-dots{display:inline-flex;gap:5px}
.pm-dots i{width:10px;height:10px;border-radius:50%;border:2px solid var(--bad);display:block}
.pm-dots i.on{background:var(--bad)}
.pm-ctrl{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:8px;margin:16px auto 0;max-width:520px}
.pm-ctrl .btn{padding:0 8px}
.pm-ctrl .btn-primary{background:var(--ph);border-color:var(--ph);color:var(--brand-text)}
.pm-fs{margin-top:12px;color:var(--muted);background:transparent;border-color:transparent}
.pm-set{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:640px){.pm-set{grid-template-columns:repeat(4,minmax(0,1fr))}}
.pm-set .input-unit .input{padding-right:92px}
.pm-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.pm-stage:fullscreen{width:100vw;height:100vh;border-radius:0;border:0;align-content:center}
.pm-stage:fullscreen .pm-digits{font-size:min(25vw,44vh)}
.pm-stage:fullscreen .pm-bar{width:70vw;max-width:none}
.pm-stage:fullscreen .pm-ctrl{width:min(560px,90vw)}
.pm-ctrl .btn{min-width:0;white-space:normal;line-height:1.15;padding:0 6px;hyphens:auto;-webkit-hyphens:auto}
@media (max-width:480px){.pm-ctrl{grid-template-columns:1.2fr 1fr 1fr}.pm-ctrl .btn{font-size:15px}}