/* The one on/off switch for every Illustrated Analytics app (<isl-switch> tag helper, Illustrated.AppShell).
   A sunken groove when off, green when on, a pearl knob that stretches while held and springs across.
   The real checkbox covers the whole control, so the label is the tap target (44px) and forms/scripts
   see a checkbox. Colors are fixed (not app tokens) so it looks the same in every app; light theme via [data-theme="light"]. */
.isl-switch{--sw-w:54px;--sw-h:32px;--sw-pad:3px;--sw-knob:calc(var(--sw-h) - var(--sw-pad)*2);position:relative;display:inline-flex;align-items:center;flex:none;min-width:44px;min-height:44px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.isl-switch input{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;opacity:0;cursor:inherit}
.isl-switch-track{position:relative;display:block;width:var(--sw-w);height:var(--sw-h);border-radius:999px;border:1px solid rgba(150,178,208,.28);background:linear-gradient(180deg,#081527,#1b3050);box-shadow:inset 0 2px 5px rgba(0,0,0,.55),inset 0 -1px 0 rgba(255,255,255,.06),0 1px 0 rgba(255,255,255,.05);transition:background .25s ease,border-color .25s ease,box-shadow .25s ease}
.isl-switch-knob{position:absolute;top:var(--sw-pad);left:var(--sw-pad);width:var(--sw-knob);height:var(--sw-knob);border-radius:999px;background:radial-gradient(circle at 34% 28%,#fff 0,#eef3f7 42%,#b8c3cf 100%);box-shadow:0 3px 7px rgba(0,0,0,.45),inset 0 -2px 3px rgba(8,24,43,.18),inset 0 1px 0 #fff;transition:left .32s cubic-bezier(.3,1.45,.55,1),width .18s ease}
.isl-switch-knob::after{content:"";position:absolute;left:50%;top:46%;width:5px;height:10px;border:solid #23875a;border-width:0 2.5px 2.5px 0;opacity:0;transform:translate(-50%,-50%) rotate(45deg) scale(.4);transition:opacity .2s ease,transform .28s cubic-bezier(.3,1.45,.55,1)}
.isl-switch input:checked+.isl-switch-track{border-color:rgba(120,222,166,.62);background:linear-gradient(150deg,#5fd694,#248a57 62%,#1c7449);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -3px 6px rgba(4,37,15,.35),0 0 14px rgba(95,214,148,.35)}
.isl-switch input:checked+.isl-switch-track .isl-switch-knob{left:calc(100% - var(--sw-knob) - var(--sw-pad))}
.isl-switch input:checked+.isl-switch-track .isl-switch-knob::after{opacity:1;transform:translate(-50%,-50%) rotate(45deg) scale(1)}
.isl-switch:active input:not(:disabled)+.isl-switch-track .isl-switch-knob{width:calc(var(--sw-knob) + 7px)}
.isl-switch:active input:checked:not(:disabled)+.isl-switch-track .isl-switch-knob{left:calc(100% - var(--sw-knob) - 7px - var(--sw-pad))}
.isl-switch input:focus-visible+.isl-switch-track{outline:3px solid #79b7ee;outline-offset:3px}
.isl-switch:has(input:disabled){cursor:not-allowed;opacity:.5}
[data-theme="light"] .isl-switch-track{border-color:rgba(11,27,50,.16);background:linear-gradient(180deg,#c3cdd8,#e3e9ef);box-shadow:inset 0 2px 5px rgba(11,27,50,.28),0 1px 0 #fff}
@media(prefers-reduced-motion:reduce){.isl-switch-track,.isl-switch-knob,.isl-switch-knob::after{transition:none}}