.life-countdown{--life-color:hsl(var(--battery-hue,130) 66% 68%);isolation:isolate;width:100%;min-width:0;color:var(--ink);font-variant-numeric:tabular-nums;padding:2px 0 4px;position:relative}.life-countdown[data-life-urgency=inactive]{--life-color:var(--ink-3)}:root[data-theme=light] .life-countdown{--life-color:hsl(var(--battery-hue,130) 64% 36%)}:root[data-theme=light] .life-countdown[data-life-urgency=inactive]{--life-color:var(--ink-3)}.life-countdown__heading{justify-content:space-between;align-items:center;gap:8px;max-width:254px;min-height:16px;margin-bottom:8px;display:flex}.life-countdown__title{color:var(--ink-2);font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;align-items:center;gap:7px;font-size:10px;font-weight:400;line-height:1.3;display:inline-flex}.life-countdown__demo{color:var(--ink-3);letter-spacing:.03em;border:1px solid var(--hair-2);border-radius:4px;padding:2px 5px;font-size:8px}.life-countdown__readout{align-items:flex-start;gap:14px;width:100%;max-width:254px;display:flex;position:relative}.life-countdown__status{color:var(--life-color);font-size:10px;line-height:1.3}.life-countdown__battery{width:44px;height:21px;color:var(--life-color);flex-shrink:0;margin-top:5.5px;display:block}.life-countdown__battery svg{width:100%;height:100%;overflow:visible}.battery-shell{fill:var(--panel-2);stroke:currentColor;stroke-width:1.3px;stroke-opacity:.7}.battery-tip{fill:currentColor;opacity:.75}.battery-charge{fill:currentColor;transition:width 1s linear}.life-countdown[data-life-urgency=critical] .battery-charge{animation:4s ease-in-out infinite life-battery-breathe}.life-countdown__digits{flex:1;grid-template-columns:minmax(0,1fr) 3px minmax(0,1fr) 3px minmax(0,1fr) 3px minmax(0,1fr);align-items:start;column-gap:3px;min-width:0;display:grid}.life-countdown__unit{flex-direction:column;align-items:center;min-width:0;display:flex}.life-countdown__number{height:32px;font-family:var(--font-body);letter-spacing:-.04em;justify-content:center;align-items:center;font-size:24px;font-style:normal;font-weight:500;line-height:1;display:inline-flex}.life-countdown__digit{width:.61em;height:1.2em;padding-block:.1em;display:inline-block;position:relative;overflow:hidden}.life-countdown__digit>span{animation:.3s cubic-bezier(.2,.7,.2,1) both life-digit-in;display:inline-block}.life-countdown__unit-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);margin-top:3px;font-size:7px;line-height:1}.life-countdown__colon{font-family:var(--font-body);text-align:center;color:var(--ink-3);opacity:.6;font-size:12px;line-height:32px}.life-countdown__milestone{pointer-events:none;z-index:-1;opacity:0;transform-origin:50%;background:radial-gradient(#ed76659c,#0000 72%);border-radius:12px;width:68px;height:42px;position:absolute;top:-8px;right:-8px}.life-countdown__milestone[data-milestone=hour]{background:radial-gradient(#ee7868d9,#0000 80%)}.life-countdown__accessible{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.life-countdown--compact{grid-template-columns:52px minmax(0,1fr);gap:8px;padding:0;display:grid;container:life-readout/inline-size}.life-countdown--compact .life-countdown__heading{max-width:none;height:24px;min-height:0;margin:0}.life-countdown--compact .life-countdown__title{letter-spacing:.025em;white-space:nowrap;font-size:9px}.life-countdown--compact .life-countdown__status{clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.life-countdown--compact .life-countdown__readout{gap:10px;max-width:none}.life-countdown--compact .life-countdown__number{height:24px;font-size:20px}.life-countdown--compact .life-countdown__colon{line-height:24px}.life-countdown--compact .life-countdown__battery{width:44px;height:21px;margin-top:1.5px;margin-left:auto}.life-countdown--compact .life-countdown__digits{column-gap:2px}@container life-readout (width<=225px){.life-countdown__number{font-size:16px!important}}.life-countdown[data-life-state=inactive] .life-countdown__digits{opacity:.5}@keyframes life-digit-in{0%{opacity:.35;transform:translateY(-22%)}to{opacity:1;transform:translateY(0)}}@keyframes life-battery-breathe{0%,to{opacity:.6}50%{opacity:1}}@media (prefers-reduced-motion:reduce){.life-countdown *{transition:none!important;animation:none!important}.life-countdown__milestone{display:none}}