@property --charge{syntax:"<number>";inherits:true;initial-value:0}.circuit{--rail:#fffcfc29;--current:#7ee08a;--current-hot:#b6f5bf;--ink:#fffcfc;--ink-dim:#b9c9bb;width:100%;display:flex;flex-direction:column;gap:22px}.circuit__viewport{overflow:hidden;width:100%;padding-block:8px 4px}.circuit__track{display:flex;align-items:center;gap:14px;padding-inline:12px}.circuit__slide{flex:0 0 78%;min-width:0;margin:0;display:flex;flex-direction:column;gap:10px;opacity:.42;transform:scale(.94);transition:opacity .45s ease,transform .45s cubic-bezier(.22,.61,.36,1)}.circuit__slide.is-live{opacity:1;transform:scale(1)}.circuit__frame{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:10px;border:1px solid var(--rail);background:#122115;transition:border-color .45s ease,box-shadow .45s ease}.circuit__frame img{width:100%;height:100%;object-fit:cover;display:block}.circuit__slide.is-live .circuit__frame{border-color:#7ee08a8c;box-shadow:0 0 0 1px #7ee08a47,0 18px 44px -20px #000000d9}.circuit__terminalMark{position:absolute;inset-block-end:10px;inset-inline-start:10px;width:8px;height:8px;border-radius:50%;background:var(--rail);transition:background-color .45s ease,box-shadow .45s ease}.circuit__slide.is-live .circuit__terminalMark{background:var(--current);box-shadow:0 0 10px 2px #7ee08aa6}.circuit__caption{display:flex;flex-direction:column;gap:2px;min-height:44px;padding-inline:2px}.circuit__sector{font-size:11px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--current)}.circuit__name{font-size:14px;font-weight:400;line-height:1.35;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;overflow:hidden}.circuit__bus{position:relative;padding-inline:12px}.circuit__rail{position:relative;height:2px;border-radius:2px;background:var(--rail);overflow:hidden}.circuit__live{position:absolute;inset-block:0;inset-inline-start:0;width:calc(var(--charge, 0) * 100%);min-width:2px;background:linear-gradient(90deg,#7ee08a40,var(--current) 65%,var(--current-hot));box-shadow:0 0 12px 1px #7ee08a80;transition:width .6s cubic-bezier(.4,.01,.2,1)}[dir=rtl] .circuit__live{background:linear-gradient(270deg,#7ee08a40,var(--current) 65%,var(--current-hot))}.circuit__taps{display:flex;justify-content:space-between;align-items:flex-start;gap:4px;margin-top:-7px}.circuit__tap{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:7px;padding:0 2px 4px;background:none;border:0;cursor:pointer;min-height:44px}.circuit__node{width:12px;height:12px;border-radius:50%;border:2px solid var(--rail);background:#16301c;transition:border-color .35s ease,background-color .35s ease,box-shadow .35s ease,transform .35s ease}.circuit__tap:hover .circuit__node{border-color:#7ee08ab3}.circuit__tap.is-closed .circuit__node{border-color:var(--current-hot);background:var(--current);box-shadow:0 0 0 4px #7ee08a2e,0 0 14px 2px #7ee08a99;transform:scale(1.15)}.circuit__tapLabel{font-size:10.5px;font-weight:500;letter-spacing:.04em;line-height:1.25;color:var(--ink-dim);text-align:center;transition:color .35s ease;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.circuit__tap.is-closed .circuit__tapLabel{color:var(--ink)}.circuit__tap:focus-visible{outline:2px solid var(--current);outline-offset:3px;border-radius:6px}@media screen and (min-width:641px){.circuit{gap:26px}.circuit__slide{flex:0 0 46%}.circuit__track{gap:18px}.circuit__bus,.circuit__track{padding-inline:20px}.circuit__name{font-size:15px}.circuit__tapLabel{font-size:12px}}@media screen and (min-width:1025px){.circuit__slide{flex:0 0 32%}.circuit__track{gap:22px}.circuit__bus,.circuit__track{padding-inline:40px}.circuit__name{font-size:16px}}@media (prefers-reduced-motion:reduce){.circuit__frame,.circuit__live,.circuit__node,.circuit__slide,.circuit__tapLabel,.circuit__terminalMark{transition:none}.circuit__slide{transform:none;opacity:.75}.circuit__slide.is-live,.circuit__tap.is-closed .circuit__node{transform:none}}