.meter-demo{width:100%;min-width:0;max-width:400px;margin:0}@media (width>=768px){.meter-demo{zoom:1.2}}.mx-root{--row-h:40px;--scope:var(--mx-scope-group);padding:var(--sp-6) var(--sp-6) 0;background:var(--surface);border:1px solid color-mix(in srgb, var(--scope) 60%, transparent);border-radius:var(--r-card);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--scope) 22%, transparent), var(--shadow-window);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-12);-webkit-user-select:none;user-select:none;flex-direction:column;line-height:1.25;display:flex;position:relative;overflow:hidden}.mx-body{flex-direction:column;display:flex}.mx-titlebar{align-items:center;gap:var(--sp-6);min-height:24px;display:flex}.mx-target{min-width:0;font-size:var(--fs-13);letter-spacing:.005em;text-overflow:ellipsis;white-space:nowrap;flex:auto;font-weight:600;overflow:hidden}.mx-badge{height:18px;padding:0 var(--sp-6);border-radius:var(--r-pill);font-size:var(--fs-11);white-space:nowrap;flex:none;align-items:center;font-weight:600;display:inline-flex}.mx-badge.is-ok{color:var(--ok);background:var(--ok-soft);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ok) 35%, transparent)}.mx-badge[hidden]{display:none}.mx-winctl,.mx-tools{flex:none;align-items:center;gap:2px;display:inline-flex}.mx-sep{width:1px;height:14px;margin:0 var(--sp-4);background:var(--line-strong)}.mx-btn{width:var(--target-overlay);height:var(--target-overlay);border-radius:var(--r-row);color:var(--text-2);justify-content:center;align-items:center;display:inline-flex}.mx-core img{opacity:.82;width:16px;height:16px}.mx-hp{align-items:center;gap:var(--sp-8);margin-top:var(--sp-4);font-size:var(--fs-11);font-variant-numeric:tabular-nums;display:flex}.mx-hp-track{border-radius:var(--r-pill);background:var(--mx-hp-track);flex:auto;height:5px;overflow:hidden}.mx-bar{width:100%;height:100%;display:block;overflow:hidden}.mx-bar rect{transition:width var(--t-bar) var(--ease)}.mx-hp-from{stop-color:var(--mx-hp-from)}.mx-hp-to{stop-color:var(--hp)}.mx-hp.is-low .mx-hp-fill{fill:var(--warn)}.mx-hp-abs{color:var(--text-2);white-space:nowrap}.mx-hp-pct{text-align:right;min-width:38px;font-weight:600}.mx-summary{justify-content:space-between;align-items:center;gap:var(--sp-12);margin-top:var(--sp-6);padding-bottom:var(--sp-6);border-bottom:1px solid var(--line);display:flex}.mx-kpi{align-items:baseline;gap:var(--sp-8);min-width:0;display:flex}.mx-kpi-value{font-family:var(--font-display);font-size:var(--fs-20);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600;line-height:1}.mx-kpi-value small,.mx-dps small,.mx-pct small{font-family:var(--font-ui);font-size:var(--fs-11);letter-spacing:0;margin-left:1px}.mx-kpi-value small{color:var(--text-2);font-weight:500}.mx-kpi-meta{align-items:center;column-gap:var(--sp-8);min-width:0;height:14px;color:var(--text-2);font-size:var(--fs-11);font-variant-numeric:tabular-nums;white-space:nowrap;flex-wrap:wrap;display:inline-flex;overflow:hidden}@media (width<=331px){.mx-kpi-meta,.mx-ping [data-md=ping]{display:none}}.mx-clock{align-items:center;gap:3px;display:inline-flex}.mx-clock svg{opacity:.8}.mx-list{margin:var(--sp-6) 0 0;flex-direction:column;gap:2px;display:flex}.mx-row{--cc:var(--mx-neutral);align-items:center;column-gap:var(--sp-8);min-height:var(--row-h);padding:3px var(--sp-8) 3px var(--sp-6);border-radius:var(--r-row);background:var(--tile);grid-template-columns:16px 28px minmax(0,1fr) auto 46px;display:grid;position:relative;overflow:hidden}.mx-row>:not(.mx-fill){z-index:1;position:relative}.mx-row[data-role=tank]{--cc:var(--role-tank)}.mx-row[data-role=dps]{--cc:var(--role-dps)}.mx-row[data-role=healer]{--cc:var(--role-healer)}.mx-fill{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.mx-fill rect{fill:color-mix(in srgb, var(--cc) 36%, transparent)}.mx-row.is-self{box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--me) 72%, transparent)}.mx-row.is-self .mx-fill rect{fill:color-mix(in srgb, var(--cc) 42%, transparent)}.mx-row.is-self .mx-name,.mx-row.is-self .mx-rank{font-weight:700}.mx-row.is-self .mx-rank{color:var(--text)}.mx-rank{color:var(--mx-on-fill);font-size:var(--fs-11);font-variant-numeric:tabular-nums;text-align:right}.mx-emblem{border-radius:var(--r-chip);background:var(--mx-sink);object-fit:contain;width:28px;height:28px;display:block}.mx-id{min-width:0;padding-right:var(--sp-8);flex-direction:column;gap:2px;display:flex}.mx-name{font-size:var(--fs-13);text-overflow:ellipsis;text-shadow:var(--mx-text-shadow);white-space:nowrap;font-weight:500;overflow:hidden}.mx-sub{column-gap:var(--sp-8);height:14px;color:var(--mx-on-fill);font-size:var(--fs-11);font-variant-numeric:tabular-nums;text-shadow:var(--mx-text-shadow-soft);white-space:nowrap;flex-wrap:wrap;display:flex;overflow:hidden}.mx-dps{min-width:50px;font-size:var(--fs-13);font-variant-numeric:tabular-nums;text-align:right;text-shadow:var(--mx-text-shadow);white-space:nowrap;font-weight:600}.mx-dps small,.mx-pct small{color:var(--mx-on-fill);font-weight:400}.mx-pct{color:var(--mx-on-fill);font-size:var(--fs-12);font-variant-numeric:tabular-nums;text-align:right;text-shadow:var(--mx-text-shadow-soft);white-space:nowrap}.mx-foot{justify-content:space-between;align-items:center;gap:var(--sp-8);margin-top:var(--sp-6);padding:var(--sp-4) 0 var(--sp-6);border-top:1px solid var(--line);display:flex}.mx-controls{align-items:center;gap:var(--sp-4);min-width:0;display:inline-flex}.mx-focus-btn{height:var(--target-overlay);border-radius:var(--r-row);background:var(--mx-sink);box-shadow:inset 0 0 0 1px var(--line);color:var(--text-2);align-items:center;gap:1px;padding:0 3px 0 6px;display:inline-flex}.mx-focus-label{color:var(--text);font-size:var(--fs-11);white-space:nowrap;padding:0 1px 0 3px;font-weight:600;line-height:1}.mx-focus-btn svg{flex-shrink:0}.mx-scope-btn .mx-focus-label{color:var(--scope)}.mx-tabs{height:var(--target-overlay);border-radius:var(--r-row);background:var(--mx-sink);box-shadow:inset 0 0 0 1px var(--line);gap:1px;padding:2px;display:inline-flex}.mx-tab{border-radius:var(--r-chip);min-width:32px;color:var(--text-2);font-size:var(--fs-11);letter-spacing:.04em;justify-content:center;align-items:center;padding:0 6px;font-weight:600;line-height:1;display:inline-flex}.mx-tab.is-on{color:var(--text);background:var(--mx-tab-on);box-shadow:var(--mx-tab-on-shadow), inset 0 -2px 0 var(--accent)}.mx-status{min-width:0;color:var(--text-2);font-size:var(--fs-11);white-space:nowrap;align-items:center;display:inline-flex}.mx-ping{font-variant-numeric:tabular-nums;align-items:center;gap:4px;display:inline-flex}.mx-ping-bars{height:9px;color:var(--ok);align-items:flex-end;gap:1px;display:inline-flex}.mx-ping-bars i{background:currentColor;border-radius:1px;width:2px;display:block}.mx-ping-bars i:first-child{height:3px}.mx-ping-bars i:nth-child(2){height:6px}.mx-ping-bars i:nth-child(3){height:9px}.meter-demo__caption{align-items:center;gap:var(--sp-8);margin-top:var(--sp-12);color:var(--text-2);font-size:var(--fs-13);line-height:1.4;display:flex}.meter-demo__caption:before{content:"";background:var(--accent);width:6px;height:6px;box-shadow:0 0 0 2px var(--accent-soft);border-radius:50%;flex:none}@media (width>=768px){.meter-demo__caption{font-size:calc(var(--fs-13) / 1.2)}}@media (prefers-reduced-motion:reduce){.mx-bar rect{transition:none}}@media (prefers-reduced-motion:no-preference){.mx-fill rect{transform-box:fill-box;animation:grow-x var(--t-block) var(--ease) var(--t-reveal) both}.mx-item:nth-child(2) .mx-fill rect{animation-delay:calc(var(--t-reveal) + var(--t-stagger))}.mx-item:nth-child(n+3) .mx-fill rect{animation-delay:calc(var(--t-reveal) + 2 * var(--t-stagger))}}.mx-target-icon{color:var(--text-2);flex:none}.mx-ttk{align-items:center;gap:var(--sp-4);color:var(--text-2);font-size:var(--fs-11);margin-top:2px;display:flex}.mx-ttk b{color:var(--text);font-variant-numeric:tabular-nums;font-weight:600}.mx-cards{gap:var(--sp-4);margin-top:var(--sp-6);grid-template-columns:repeat(3,minmax(0,1fr));display:none}.mx-card{padding:var(--sp-6) var(--sp-8);background:var(--tile);color:var(--text-2);font-size:var(--fs-11);border-radius:8px;gap:2px;display:grid}.mx-card b{color:var(--text);font-size:var(--fs-15);font-variant-numeric:tabular-nums}.meter-demo__head{justify-content:space-between;align-items:center;gap:var(--sp-12);color:var(--text-2);font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px;font-size:11px;display:flex}.meter-demo__live{align-items:center;gap:6px;display:flex}.meter-demo__live:before{content:"";background:var(--ok);border-radius:50%;width:6px;height:6px}