.sbc{--sbc-good:#3ee08a;--sbc-mid:#ffb31f;--sbc-low:#ff4d4f;--sbc-quiet:#a9b2bf;grid-template-columns:minmax(0,1fr);gap:1.1rem;margin-block:1.25rem 2rem;display:grid}.sbc-dim{color:var(--sbc-quiet);margin:0;font-size:.9rem;line-height:1.5}.sbc-bar{border:1px solid var(--line);background:radial-gradient(80% 140% at 0% 0%, #ff3c281f, transparent 55%), radial-gradient(80% 140% at 100% 0%, #0ab9e61f, transparent 55%), var(--panel-2);border-radius:14px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.8rem 1.2rem;padding:1rem 1.15rem;display:grid}.sbc-status{align-items:center;gap:.8rem;min-width:0;display:flex}.sbc-led{background:#3a4251;border-radius:50%;flex:none;width:.8rem;height:.8rem;box-shadow:0 0 0 3px #ffffff0d}.sbc-status[data-state=connected] .sbc-led{background:var(--sbc-good);box-shadow:0 0 14px 2px var(--sbc-good)}.sbc-status[data-state=busy] .sbc-led,.sbc-status[data-state=lost] .sbc-led,.sbc-status[data-state=unsupported] .sbc-led{background:var(--warning)}.sbc-status-text{gap:.15rem;min-width:0;display:grid}.sbc-status-text strong{font:800 1.1rem/1.2 var(--font-display);color:var(--text)}.sbc-status-text span{color:var(--text-2);font-size:.92rem;line-height:1.45}.sbc-actions{flex-wrap:wrap;justify-content:flex-end;gap:.5rem;display:flex}.sbc-why{color:var(--sbc-quiet);grid-column:1/-1;margin:0;font-size:.9rem;line-height:1.5}.sbc-cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,30rem),1fr));gap:1rem;display:grid}.sbc-card{--sbc-tone:var(--sbc-good);--sbc-body:#2d2f33;--sbc-buttons:#e6e6e6;--sbc-grip-l:#2d2f33;--sbc-grip-r:#2d2f33;border:1px solid color-mix(in srgb, var(--sbc-tone) 34%, var(--line));background:radial-gradient(90% 70% at 22% 34%, color-mix(in srgb, var(--sbc-body) 26%, transparent), transparent 70%), linear-gradient(180deg, #121722, #0c1018);border-radius:16px;align-content:start;gap:.9rem;padding:1.1rem 1.15rem 1.15rem;transition:border-color .6s;display:grid;position:relative;overflow:hidden;container:sbc-card/inline-size}.sbc-card[data-tone=mid]{--sbc-tone:var(--sbc-mid)}.sbc-card[data-tone=low]{--sbc-tone:var(--sbc-low)}.sbc-card[data-lost]{opacity:.45;filter:grayscale(.7)}.sbc-card-head{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.sbc-model{font:800 1.15rem/1.2 var(--font-display);color:var(--text);margin-right:auto}.sbc-chip,.sbc-demo{font:700 .78rem/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);color:var(--text-2);border-radius:999px;padding:.38rem .55rem}.sbc-demo{border-color:color-mix(in srgb, var(--sbc-mid) 60%, transparent);color:var(--sbc-mid)}.sbc-body{grid-template-columns:minmax(0,24rem) minmax(0,1fr);align-items:center;gap:1rem 1.6rem;display:grid}.sbc-figure{justify-items:center;gap:.6rem;min-width:0;margin:0;display:grid}.sbc-card[data-kind=pro] [data-for=joycon],.sbc-card[data-kind=joycon] [data-for=pro]{display:none}.sbc-pro{width:100%;height:auto;display:block;overflow:visible}.sbc-pair{justify-content:center;gap:.35rem;width:100%;max-width:15rem;display:flex}.sbc-jc{width:50%;height:auto;transition:opacity .4s;display:block;overflow:visible}.sbc-jc[data-absent]{opacity:.18}.sbc-shell{fill:var(--sbc-body);stroke:#ffffff29;stroke-width:1.5px;transition:fill .6s}.sbc-jc-left .sbc-shell{fill:var(--sbc-body-l,var(--sbc-body))}.sbc-jc-right .sbc-shell{fill:var(--sbc-body-r,var(--sbc-body))}.sbc-grip{stroke:none;transition:fill .6s}.sbc-grip-left{fill:var(--sbc-grip-l)}.sbc-grip-right{fill:var(--sbc-grip-r)}.sbc-rail{fill:#15171b;stroke:#ffffff14}.sbc-port{fill:#0b0d10}.sbc-well{fill:#00000047}.sbc-stick{fill:#1c1e22;stroke:#ffffff1f;stroke-width:2.5px}.sbc-dpad rect,.sbc-face circle,.sbc-small{fill:var(--sbc-buttons);stroke:#00000040;transition:fill .6s}.sbc-jc-left .sbc-face circle,.sbc-jc-left .sbc-small{fill:var(--sbc-buttons-l,var(--sbc-buttons))}.sbc-jc-right .sbc-face circle,.sbc-jc-right .sbc-small{fill:var(--sbc-buttons-r,var(--sbc-buttons))}.sbc-home{stroke:color-mix(in srgb, var(--sbc-buttons-r,var(--sbc-buttons)) 50%, #fff);stroke-width:2px}.sbc-player circle{fill:#ffffff24}.sbc-player circle[data-player="0"]{fill:#4dff9a;filter:drop-shadow(0 0 3px #4dff9a)}.sbc-bolt{fill:var(--sbc-tone);opacity:0;transform-box:fill-box;transform-origin:50%;stroke:#00000080;stroke-width:1px}.sbc-card[data-charging] .sbc-pro .sbc-bolt,.sbc-jc[data-charging] .sbc-bolt{opacity:.95;animation:1.6s ease-in-out infinite sbc-bolt}@keyframes sbc-bolt{0%,to{opacity:.35;transform:scale(.92)}50%{opacity:1;transform:scale(1.06)}}.sbc-colours{flex-wrap:wrap;justify-content:center;gap:.4rem .9rem;display:flex}.sbc-colours[hidden],.sbc-swatch[hidden]{display:none}.sbc-swatch{font:700 .78rem/1 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-2);align-items:center;gap:.35rem;display:inline-flex}.sbc-swatch i{background:var(--swatch,#444);border:1px solid #ffffff4d;border-radius:50%;width:.85rem;height:.85rem}.sbc-readings{grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr));gap:1rem 1.4rem;min-width:0;display:grid}.sbc-reading{--sbc-tone:var(--sbc-good);grid-template-columns:auto minmax(0,1fr);grid-template-areas:"side side""cell level""cell state""volt volt";align-items:center;gap:.25rem .9rem;min-width:0;display:grid}.sbc-reading[data-tone=mid]{--sbc-tone:var(--sbc-mid)}.sbc-reading[data-tone=low]{--sbc-tone:var(--sbc-low)}.sbc-side{font:700 .78rem/1.2 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:#ffffff9e;grid-area:side}.sbc-side[hidden]{display:none}.sbc-cell{border:2px solid color-mix(in srgb, var(--sbc-tone) 55%, #fff3);width:3.6rem;height:7.6rem;box-shadow:inset 0 0 18px #0009, 0 0 26px color-mix(in srgb, var(--sbc-tone) 22%, transparent);background:#090c12;border-radius:11px;grid-area:cell;margin-top:.55rem;padding:.38rem;position:relative}.sbc-cap{background:color-mix(in srgb, var(--sbc-tone) 55%, #fff3);border-radius:4px 4px 0 0;width:1.4rem;height:.48rem;position:absolute;top:-.55rem;left:50%;transform:translate(-50%)}.sbc-segments{flex-direction:column-reverse;gap:4px;height:100%;display:flex}.sbc-segments i{background:#ffffff0d;border-radius:4px;flex:1;transition:background .5s,box-shadow .5s}.sbc-segments i[data-on]{background:linear-gradient(90deg, color-mix(in srgb, var(--sbc-tone) 78%, #000), var(--sbc-tone));box-shadow:0 0 10px color-mix(in srgb, var(--sbc-tone) 45%, transparent)}.sbc-reading[data-tone=low]:not([data-charging]) .sbc-segments i[data-on]{animation:1.4s ease-in-out infinite sbc-low}@keyframes sbc-low{50%{opacity:.45}}.sbc-flow{pointer-events:none;opacity:0;background:linear-gradient(#0000 0%,#ffffff52 50%,#0000 100%) 0 0/100% 40% no-repeat;border-radius:6px;position:absolute;inset:.38rem}.sbc-reading[data-charging] .sbc-flow{opacity:1;animation:1.8s linear infinite sbc-flow}@keyframes sbc-flow{0%{background-position:0 140%}to{background-position:0 -40%}}.sbc-level{font:800 clamp(1.5rem, 4vw, 2rem)/1.05 var(--font-display);color:var(--text);overflow-wrap:normal;word-break:keep-all;grid-area:level;align-self:end;margin:0}.sbc-state{font:700 .88rem/1.3 var(--font-body,inherit);color:var(--sbc-tone);grid-area:state;align-self:start;margin:0}.sbc-volt{grid-area:volt;gap:.3rem;margin-top:.55rem;display:grid}.sbc-volt[hidden]{display:none}.sbc-scale{background:#ffffff0d;border-radius:999px;height:.6rem;position:relative;overflow:visible}.sbc-band{border-right:1px solid #0c1018;position:absolute;top:0;bottom:0}.sbc-band[data-band=critical]{background:color-mix(in srgb, var(--sbc-low) 55%, transparent);border-radius:999px 0 0 999px}.sbc-band[data-band=low]{background:color-mix(in srgb, var(--sbc-mid) 50%, transparent)}.sbc-band[data-band=medium]{background:color-mix(in srgb, var(--sbc-good) 38%, transparent)}.sbc-band[data-band=full]{background:color-mix(in srgb, var(--sbc-good) 62%, transparent);border-right:0;border-radius:0 999px 999px 0}.sbc-mark{background:#fff;border-radius:2px;width:3px;height:1.2rem;margin-left:-1.5px;transition:left .8s;position:absolute;top:-.3rem;left:50%;box-shadow:0 0 8px #fffc}.sbc-volt-read{font:700 .95rem/1.2 var(--font-mono);color:var(--text);margin:0}.sbc-volt-read b{font-variant-numeric:tabular-nums}.sbc-scale-axis{font:700 .78rem/1.2 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:#ffffff80;justify-content:space-between;display:flex}.sbc-fw{border-top:1px solid var(--line);padding-top:.75rem}.sbc-fw summary{cursor:pointer;color:var(--text);font-weight:700}.sbc-fw dl{grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:.6rem 1rem;margin:.8rem 0;display:grid}.sbc-fw dt{font:700 .78rem/1.2 var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--sbc-quiet)}.sbc-fw dd{font:700 .95rem/1.3 var(--font-mono);color:var(--text);overflow-wrap:anywhere;margin:.2rem 0 0}.sbc-note{border:1px solid color-mix(in srgb, var(--sbc-mid) 45%, var(--line));color:var(--text-2);border-radius:12px;margin:0;padding:.75rem .9rem;font-size:.92rem;line-height:1.5}.sbc-note[hidden]{display:none}@media (width<=720px){.sbc-bar{grid-template-columns:minmax(0,1fr)}.sbc-actions{justify-content:flex-start}}@media (width<=380px){.sbc-card{padding:.9rem .85rem 1rem}}@container sbc-card (width<=44rem){.sbc-body{grid-template-columns:minmax(0,1fr)}.sbc-figure{justify-self:center;width:100%;max-width:22rem}}@media (prefers-reduced-motion:reduce){.sbc-bolt,.sbc-flow,.sbc-segments i{animation:none!important}}
