/* Tiger Progress — premium (bar · circle · gauge) */
.tiger-prog{--tiger-prog-c:#ec7002;--tiger-prog-c2:#1c7d8f;--tiger-prog-track:#e5e7eb;}

/* ── Bar ── */
.tiger-prog--bar{width:100%;}
.tiger-prog__head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px;}
.tiger-prog__label{font-size:14px;font-weight:600;}
.tiger-prog__pct{font-size:13px;font-weight:700;color:var(--tiger-prog-c);font-variant-numeric:tabular-nums;}
.tiger-prog__track{position:relative;height:12px;border-radius:20px;background:var(--tiger-prog-track);overflow:hidden;}
.tiger-prog__fill{position:relative;height:100%;border-radius:20px;width:0;overflow:hidden;
	background:var(--tiger-prog-c);
	transition:width 1.3s cubic-bezier(.2,.8,.2,1);}

/* Fill styles */
.tiger-prog--fill-gradient .tiger-prog__fill{background:linear-gradient(90deg,var(--tiger-prog-c),var(--tiger-prog-c2));}
.tiger-prog--fill-striped .tiger-prog__fill,
.tiger-prog--fill-animated .tiger-prog__fill{
	background-image:linear-gradient(90deg,var(--tiger-prog-c),var(--tiger-prog-c2)),
		repeating-linear-gradient(45deg,rgba(255,255,255,.22) 0 12px,transparent 12px 24px);
	background-blend-mode:overlay;background-size:100% 100%,48px 48px;}
.tiger-prog--fill-animated .tiger-prog__fill{animation:tiger-prog-stripes 1s linear infinite;}
@keyframes tiger-prog-stripes{from{background-position:0 0,0 0;}to{background-position:0 0,48px 0;}}

/* Sweeping shine over the fill */
.tiger-prog__shine{position:absolute;top:0;left:-40%;width:40%;height:100%;
	background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);
	animation:tiger-prog-shine 2.4s ease-in-out infinite;}
@keyframes tiger-prog-shine{0%{left:-40%;}60%,100%{left:140%;}}

/* Glow */
.tiger-prog--glow.tiger-prog--bar .tiger-prog__fill{box-shadow:0 0 14px color-mix(in srgb,var(--tiger-prog-c) 70%,transparent);}

/* Segmented track (mask the fill into ticks) */
.tiger-prog__track--seg .tiger-prog__fill{
	-webkit-mask:repeating-linear-gradient(90deg,#000 0 16px,transparent 16px 22px);
	mask:repeating-linear-gradient(90deg,#000 0 16px,transparent 16px 22px);}

/* Milestone markers */
.tiger-prog__marker{position:absolute;top:50%;width:2px;height:130%;transform:translate(-50%,-50%);
	background:rgba(255,255,255,.7);z-index:2;border-radius:2px;}

/* Value bubble that rides the end of the fill */
.tiger-prog__bubble{position:absolute;right:0;top:50%;transform:translate(50%,-160%);
	background:var(--tiger-prog-c);color:#fff;font-size:11px;font-weight:800;line-height:1;
	padding:4px 7px;border-radius:6px;white-space:nowrap;font-variant-numeric:tabular-nums;z-index:3;}
.tiger-prog__bubble::after{content:"";position:absolute;left:50%;bottom:-3px;width:6px;height:6px;
	background:inherit;transform:translateX(-50%) rotate(45deg);}

/* ── Circle / Gauge (shared SVG) ── */
.tiger-prog--circle,.tiger-prog--semicircle{display:inline-flex;flex-direction:column;align-items:center;}
.tiger-prog__ring{position:relative;display:inline-flex;}
.tiger-prog__svg{width:150px;height:auto;overflow:visible;}
.tiger-prog--circle .tiger-prog__svg{transform:rotate(-90deg);}
.tiger-prog__svg circle,.tiger-prog__svg path{stroke-width:12;}
.tiger-prog__bg{stroke:var(--tiger-prog-track);}
.tiger-prog__fg{
	stroke:var(--tiger-prog-c);
	stroke-dasharray:100;stroke-dashoffset:100;
	transition:stroke-dashoffset 1.4s cubic-bezier(.2,.8,.2,1);
}
.tiger-prog--fill-solid .tiger-prog__fg{stroke:var(--tiger-prog-c)!important;}
.tiger-prog--glow .tiger-prog__fg{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--tiger-prog-c) 75%,transparent));}

/* Center content (number + optional icon) */
.tiger-prog__center{position:absolute;left:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
	gap:4px;text-align:center;pointer-events:none;}
.tiger-prog--circle .tiger-prog__center{top:50%;transform:translateY(-50%);}
.tiger-prog--semicircle .tiger-prog__center{bottom:6%;}
.tiger-prog__num{font-size:26px;font-weight:800;color:var(--tiger-prog-c);font-variant-numeric:tabular-nums;line-height:1;}
/* Icon is hard-capped to 1em (≈22px) whether it renders as <svg> or an <i> font
   glyph, so an unsized SVG can never blow up the layout. */
.tiger-prog__cicon{font-size:22px;line-height:1;color:var(--tiger-prog-c);display:inline-flex;align-items:center;justify-content:center;}
.tiger-prog__cicon svg{width:1em;height:1em;max-width:1em;max-height:1em;fill:currentColor;display:block;}
.tiger-prog__cicon i{font-size:1em;line-height:1;}
.tiger-prog__clabel{margin-top:12px;font-size:14px;font-weight:600;text-align:center;}

/* Hover: subtle scale + value emphasis */
.tiger-prog--tip .tiger-prog__ring{transition:transform .3s ease;}
.tiger-prog--tip:hover .tiger-prog__ring{transform:scale(1.04);}

@media (prefers-reduced-motion: reduce){
	.tiger-prog__fill,.tiger-prog__fg{transition:none;}
	.tiger-prog__shine,.tiger-prog--fill-animated .tiger-prog__fill{animation:none!important;}
}