.fio-circular-slider{display:inline-block;position:relative;container-type:inline-size;max-width:100%;aspect-ratio:1;vertical-align:middle;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:4px;letter-spacing:0}.fio-circular-slider:focus-visible{outline:2px solid currentColor;outline-offset:4px}.fio-circular-slider.is-pointer-focused{outline:none}.fio-circular-slider.is-disabled{opacity:.45}.fio-cs-dial{display:block;width:100%;height:100%;overflow:visible}.fio-cs-draggable{cursor:grab}.fio-circular-slider.is-dragging .fio-cs-draggable{cursor:grabbing}.fio-cs-knob-ring{transform-box:fill-box;transform-origin:center}.has-draggable-knob .fio-cs-knob-ring{animation:fio-cs-knob-pulse 1.5s ease-out infinite}.fio-circular-slider:is(.is-dragging,.is-disabled,[aria-readonly=true]) .fio-cs-knob-ring{animation-play-state:paused}@keyframes fio-cs-knob-pulse{0%,to{transform:scale(1)}50%{transform:scale(.8)}}@media(prefers-reduced-motion:reduce){.fio-circular-slider .fio-cs-knob-ring{animation:none}}.fio-circular-slider:is(.is-disabled,[aria-readonly=true]){touch-action:auto}.fio-cs-labels{position:absolute;inset:22%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;min-width:0}.fio-cs-default-labels{position:absolute;inset:0;display:grid;grid-template-rows:minmax(0,1fr) auto minmax(0,1fr);justify-items:center}.fio-cs-label,.fio-cs-value{max-width:100%;overflow-wrap:anywhere}.fio-cs-label{grid-row:1;align-self:end;margin-bottom:var(--label-gap, .5rem);font-size:min(var(--label-font-size, 1rem),6cqi);line-height:1.15}.fio-cs-label-bottom{grid-row:3;align-self:start;margin-bottom:0;margin-top:var(--label-gap, .5rem)}.fio-cs-value{grid-row:2;position:relative;font-size:min(var(--value-font-size, 3rem),18cqi);line-height:1;font-variant-numeric:tabular-nums}.fio-cs-value [data-slider-value]{display:block}.fio-cs-affix{position:absolute;bottom:0;width:max-content;max-width:max(0px,calc(42cqi - 50%));font-size:.4em}.fio-cs-prefix{right:100%;margin-right:.3em;text-align:right}.fio-cs-suffix{left:100%;margin-left:.3em;text-align:left}.fio-cs-affix:empty{display:none}.fio-cs-knob-content{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;color:#fff}*{box-sizing:border-box}body{margin:8px;color:#1f2937;font-family:Inter,system-ui,-apple-system,sans-serif;letter-spacing:0}.page{padding:1rem;border-top:4px solid #15805c;background:linear-gradient(135deg,#f5f7fa,#e4e8f0);min-height:100vh}main{max-width:1024px;margin:1rem auto;background:#fff;padding:1.75rem 2rem;border-radius:8px;box-shadow:0 10px 30px #0f172a14,0 1px 3px #0f172a0d}header{display:grid;gap:.75rem;margin-bottom:1.75rem}h1{margin:0;color:#15805c;font-size:3.15rem;line-height:1.2;font-weight:600;overflow-wrap:anywhere}.intro{margin:0;color:#526174;font-size:1.1rem;line-height:1.6;overflow-wrap:anywhere}.install{margin:0;background:#111827;color:#f9fafb;border-left:3px solid #42b883;border-radius:8px;padding:.85rem 1rem;font:.9rem Fira Code,Roboto Mono,monospace;overflow-x:auto}.tabs{display:flex;border-bottom:2px solid #e2e8f0;margin-bottom:1.5rem;padding-bottom:1px;overflow-x:auto;scrollbar-width:none}button,input,select{font:inherit}button{cursor:pointer}.tabs button{appearance:none;background:transparent;border:0;border-bottom:3px solid transparent;color:#64748b;font-size:.95rem;font-weight:600;padding:.75rem 1.1rem;white-space:nowrap}.tabs button[aria-selected=true]{border-bottom-color:#15805c;color:#15805c}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,section:focus-visible{outline:2px solid #15805c;outline-offset:3px}#example{background:#f8fafc;padding:1.25rem}.example-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:start;margin-bottom:1rem}h2{color:#273449;font-size:1.45rem;font-weight:700;margin:0 0 .35rem}.chips{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.45rem;max-width:320px}.chips code{background:#ecfdf5;border:1px solid #a7f3d0;border-radius:4px;color:#047857;font:.76rem/1 Fira Code,Roboto Mono,monospace;padding:.45rem .55rem;white-space:nowrap}.workspace{display:grid;justify-items:center;gap:1rem;min-width:0}.preview{display:grid;place-items:center;width:100%;min-width:0;padding:1rem;margin:.25rem 0 0}.volume-form{width:280px;max-width:100%;margin:0}.settings{width:100%;max-width:540px;min-width:0}.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}label{display:grid;gap:5px;font-size:13px;color:#526174}input:not([type=checkbox]),select{width:100%;min-width:0;background:#fff;color:#202326;border:1px solid #cbd5e1;border-radius:4px;padding:7px 8px}.checks{display:flex;flex-wrap:wrap;gap:8px 20px}.check{display:flex;align-items:center;margin:4px 0}input[type=checkbox]{accent-color:#15805c}output{display:inline-block;margin-top:12px;font-size:22px;font-weight:600}.status{color:#64748b;font-size:12px;margin-left:10px}dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 20px;font-size:14px}dt{color:#64748b}dd{margin:0}.swatches{display:flex;align-items:center;gap:5px}.swatches i{width:16px;height:16px;border-radius:50%}.actions{display:flex;gap:12px;flex-wrap:wrap}.actions button,.code-actions button{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem .85rem;background:#ecfdf5;border:1px solid #a7f3d0;border-radius:8px;color:#047857;font-size:.88rem;font-weight:600}.code-actions{display:none;text-align:center;margin:1rem 0 0}.code-sample{background:#0f172a;border:1px solid #1e293b;border-radius:8px;box-shadow:0 12px 24px #0f172a24;margin-top:1.25rem;overflow:hidden}.code-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem;background:#111827;border-bottom:1px solid #94a3b82e;padding:.7rem .9rem}.code-heading>span{color:#94a3b8;font:700 .72rem Fira Code,Roboto Mono,monospace;text-transform:uppercase}.code-heading button{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;min-width:4.6rem;height:2rem;padding:0 .65rem;background:#1e293b;border:1px solid #334155;border-radius:6px;color:#e2e8f0;font-size:.8rem;font-weight:600}.code-heading button.copied{background:#065f46;border-color:#059669;color:#d1fae5}.code{margin:0;padding:1rem 0;overflow-x:auto;color:#d1d5db;font:.86rem/1.6 Fira Code,Roboto Mono,monospace}.code>code{display:grid;min-width:max-content;font:inherit}.code-line{display:grid;grid-template-columns:2.75rem minmax(0,1fr);min-height:1.35rem}.line-number{color:#94a3b8;border-right:1px solid #94a3b82e;padding-right:.75rem;text-align:right;font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none}.line-content{padding:0 1rem;white-space:pre}.hljs-string,.hljs-attr{color:#fde68a}.hljs-keyword,.hljs-literal{color:#f0abfc}.hljs-number{color:#c4b5fd}.hljs-title,.hljs-name,.hljs-built_in{color:#67e8f9}.hljs-property,.hljs-attribute{color:#93c5fd}.hljs-comment,.hljs-punctuation{color:#94a3b8}.battery-label{position:relative;width:max-content;flex:none;line-height:1}.battery-value{display:block;font-size:32px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.battery-unit{position:absolute;left:calc(100% + .15em);top:50%;transform:translateY(-50%);font-size:16px;line-height:1}.battery-caption{position:absolute;top:calc(100% + .5rem);left:50%;transform:translate(-50%);white-space:nowrap;font-size:16px;line-height:1.15}.rotated{transform:rotate(180deg)}footer{text-align:center;color:#64748b;margin-top:2rem;padding-bottom:.5rem;font-size:.9rem;line-height:1.5}footer p{margin:0 0 .35rem}footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;margin-bottom:.35rem}footer a{color:#475569;text-decoration-color:#cbd5e1;text-underline-offset:3px}.support{font-size:.8rem}@media(max-width:767px){.page{padding:.75rem .5rem}main{margin:0 auto;padding:1.25rem 1rem}header{margin-bottom:1.25rem;text-align:center}h1{font-size:2.6rem}.intro{font-size:1rem}.install{padding:.75rem;font-size:.78rem;text-align:left}.tabs{margin-bottom:1rem}.tabs button{padding:.55rem .75rem;font-size:.85rem}#example{padding:1rem .85rem}.example-header{grid-template-columns:1fr;gap:.85rem}h2{font-size:1.2rem}.chips{justify-content:flex-start;max-width:100%}.preview{padding:.5rem}.code-actions{display:block}.code-sample{display:none;margin-top:1rem}.code-sample.is-open{display:block}.code-heading{padding:.65rem .75rem}.code-heading button{font-size:.76rem;min-width:4.25rem}.code{padding:.8rem 0;font-size:.76rem}.code-line{grid-template-columns:2.35rem minmax(0,1fr)}.line-number{padding-right:.55rem}.line-content{padding:0 .75rem}}@media(max-width:380px){main{padding:1rem .65rem}h1{font-size:2.15rem}.fields{grid-template-columns:minmax(0,1fr)}}