.q-badge{--q-badge-bg:#4d4d4d;--q-badge-fg:#fff;--q-badge-low-fg:#171717;--q-badge-overlay:oklch(.94 .0000468155 23.644);display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:9999px;white-space:nowrap;padding:2px 12px;font-weight:500;text-transform:capitalize;font-variant-numeric:tabular-nums;height:24px;gap:5px;font-size:12px;line-height:24px;letter-spacing:normal;background:var(--q-badge-bg);color:var(--q-badge-fg)}
.q-badge[data-size=sm]{height:20px;padding-inline:8px;gap:4px;font-size:11px;line-height:20px;letter-spacing:.2px}
.q-badge[data-size=lg]{height:32px;gap:6px;font-size:14px;line-height:20px}
.q-badge__label{min-width:0;position:relative;display:inline-flex;align-items:center;gap:inherit}
.q-badge__icon{display:block;position:relative;flex-shrink:0;width:14px;height:14px;margin-left:-4px;transform:translate(0,0)}
.q-badge[data-size=sm] .q-badge__icon{width:12px;height:12px;margin-left:-2px}
.q-badge[data-size=lg] .q-badge__icon{width:16px;height:16px;margin-left:0}
.q-badge[data-contrast=low]:not([data-variant=inverted],[data-variant=trial],[data-variant=brand],.q-pill){position:relative;background:transparent;color:var(--q-badge-low-fg)}
.q-badge[data-contrast=low]:not([data-variant=inverted],[data-variant=trial],[data-variant=brand],.q-pill)::before{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;mix-blend-mode:multiply;background:var(--q-badge-overlay)}
.q-badge[data-variant=blue]{--q-badge-bg:#0062d1;--q-badge-low-fg:#0068d6;--q-badge-overlay:oklch(.94 .0226934 248.117)}
.q-badge[data-variant=purple]{--q-badge-bg:var(--q-purple-700);--q-badge-low-fg:var(--q-purple-700);--q-badge-overlay:oklch(from var(--q-purple-700) .94 .0255073 h)}
.q-badge[data-variant=amber]{--q-badge-bg:#ffb224;--q-badge-fg:#000;--q-badge-low-fg:#a35200;--q-badge-overlay:oklch(.94 .0529728 90.312)}
.q-badge[data-variant=red]{--q-badge-bg:#cb2a2f;--q-badge-low-fg:#cb2a2f;--q-badge-overlay:oklch(.94 .0289907 17.5627)}
.q-badge[data-variant=pink]{--q-badge-bg:#bd2864;--q-badge-low-fg:#bd2864;--q-badge-overlay:oklch(.94 .0384071 355.521)}
.q-badge[data-variant=green]{--q-badge-bg:#297a3a;--q-badge-low-fg:#297a3a;--q-badge-overlay:oklch(.94 .0335236 145.282)}
.q-badge[data-variant=teal]{--q-badge-bg:#067a6e;--q-badge-low-fg:#067a6e;--q-badge-overlay:oklch(.94 .0495123 182.024)}
.q-badge[data-variant=inverted]{--q-badge-bg:#171717;--q-badge-fg:#f2f2f2}
.q-badge[data-variant=trial],.q-badge[data-variant=brand]{background:#000 linear-gradient(135deg,var(--ss-primary),var(--ss-accent));color:var(--ss-on-brand-gradient)}
[data-theme=dark] .q-badge{--q-badge-bg:#454545;--q-badge-low-fg:#ededed;--q-badge-overlay:oklch(.27 .0000118029 23.7495)}
[data-theme=dark] .q-badge[data-contrast=low]:not([data-variant=inverted],[data-variant=trial],[data-variant=brand],.q-pill)::before{mix-blend-mode:screen}
[data-theme=dark] .q-badge[data-variant=blue]{--q-badge-bg:#0062d1;--q-badge-low-fg:#52a8ff;--q-badge-overlay:oklch(.27 .0713857 255.879)}
[data-theme=dark] .q-badge[data-variant=purple]{--q-badge-bg:var(--q-purple-700);--q-badge-low-fg:#bf7af0;--q-badge-overlay:oklch(from var(--q-purple-700) .27 .0808775 h)}
[data-theme=dark] .q-badge[data-variant=amber]{--q-badge-bg:#ffb224;--q-badge-low-fg:#f2a20d;--q-badge-overlay:oklch(.27 .0721289 66.3196)}
[data-theme=dark] .q-badge[data-variant=red]{--q-badge-bg:#d93036;--q-badge-low-fg:#ff6166;--q-badge-overlay:oklch(.27 .0771755 19.1242)}
[data-theme=dark] .q-badge[data-variant=pink]{--q-badge-bg:#b31a57;--q-badge-low-fg:#f75f8f;--q-badge-overlay:oklch(.27 .103737 356.731)}
[data-theme=dark] .q-badge[data-variant=green]{--q-badge-bg:#1a9338;--q-badge-low-fg:#62c073;--q-badge-overlay:oklch(.27 .0709306 150.485)}
[data-theme=dark] .q-badge[data-variant=teal]{--q-badge-bg:#0c9784;--q-badge-low-fg:#0ac7b4;--q-badge-overlay:oklch(.27 .0677945 180.212)}
[data-theme=dark] .q-badge[data-variant=inverted]{--q-badge-bg:#ededed;--q-badge-fg:#1a1a1a}
.q-pill{background:var(--ss-surface-light);color:#000;text-decoration:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.q-pill:hover{background:#ebebeb}
[data-theme=dark] .q-pill{background:#000;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
[data-theme=dark] .q-pill:hover{background:#1f1f1f}
.q-badge{font-feature-settings:"calt" 0,"rlig","ss11"}

.q-badge[data-numerical=true]{min-width:24px}
.q-badge[data-size=sm] .q-badge__icon:is([data-glyph=circular],:has([data-glyph=circular])){margin-left:-4px}
.q-badge[data-size=md] .q-badge__icon:is([data-glyph=circular],:has([data-glyph=circular])){margin-left:-7px}
.q-badge[data-size=md]:has([data-glyph=circular]){padding-right:10px}
.q-badge[data-size=lg] .q-badge__icon:is([data-glyph=circular],:has([data-glyph=circular])){margin-left:-4px}
.q-badge[data-icon-only=true]{min-width:0;padding-inline:0!important;width:24px}
.q-badge[data-icon-only=true][data-size=sm]{width:20px}
.q-badge[data-icon-only=true][data-size=lg]{width:32px}
.q-badge[data-icon-only=true] .q-badge__icon{margin-left:0!important}
.q-docs .q-pill:focus-visible{outline:1px auto -webkit-focus-ring-color;outline-offset:1px}