.vl-arctic-demo{--ink-1000:#08080a;--ink-900:#0b0b0d;--ink-850:#0e0e10;--ink-800:#151518;--ink-820:#101013;--ink-700:#1b1b1f;--ink-600:#232327;--ink-500:#2c2c31;--ink-450:#3a3a40;--frost-50:#ffffff;--frost-100:#ededf0;--frost-200:#d4d4d8;--frost-300:#b7b7bb;--frost-400:#8a8a90;--frost-500:#66666c;--frost-600:#4a4a50;--mint:#1ee8c3;--mint-bright:#19faa2;--mint-cyan:#1ed0d8;--brand-ink:#04241d;--down:#d65560;--down-text:#e8848d;--close-hover:#f0919a;--warn:#ff9800;--border-subtle:rgba(255,255,255,.06);--border-default:rgba(255,255,255,.10);--border-strong:rgba(255,255,255,.16);--border-accent:rgba(30,232,195,.45);--hover-fill:rgba(255,255,255,.06);--titlebar-fill:rgba(21,21,24,.72);--footer-fill:rgba(11,11,13,.50);--grid-line:rgba(255,255,255,.018);--mint-tint:rgba(30,232,195,.12);--mint-line:rgba(30,232,195,.34);--mint-orb:rgba(30,232,195,.09);--mint-hover:rgba(30,232,195,.08);--mint-focus:rgba(30,232,195,.14);--warn-tint:rgba(255,152,0,.12);--warn-line:rgba(255,152,0,.34);--down-tint:rgba(214,85,96,.12);--down-line:rgba(214,85,96,.36);--down-orb:rgba(214,85,96,.10);--down-hover:rgba(214,85,96,.18);--down-input:rgba(214,85,96,.55);--errcode-fill:rgba(214,85,96,.08);--errcode-line:rgba(214,85,96,.20);--art-teal:#12312c;--art-slate:#16333f;--art-ink:#101018;--scroll-track:rgba(255,255,255,.04);--scroll-thumb:var(--frost-500);--scroll-thumb-hover:var(--frost-400);--scroll-thumb-drag:var(--mint);--warn-orb:rgba(255,152,0,.10);--warn-errcode-fill:rgba(255,152,0,.08);--warn-errcode-line:rgba(255,152,0,.20);--shadow-window:0 40px 90px -24px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.06);--shadow-lg:0 24px 60px -16px rgba(0,0,0,.65);--edge-top:inset 0 1px 0 rgba(255,255,255,.06);--glow-accent:0 10px 40px -10px rgba(30,232,195,.50);--glow-accent-hover:0 12px 46px -10px rgba(30,232,195,.62);--glow-live:0 0 16px -2px rgba(30,232,195,.60);--glow-down:0 0 16px -2px rgba(214,85,96,.60);--focus-halo:0 0 0 3px rgba(30,232,195,.14);--error-halo:0 0 0 3px rgba(214,85,96,.12);--orb-glow:0 0 48px -8px rgba(30,232,195,.5);--orb-glow-down:0 0 48px -8px rgba(214,85,96,.42);--ring-glow:0 0 40px -6px rgba(30,232,195,.45);--track-glow:0 0 14px rgba(30,232,195,.6);--keycap-drop:0 1px 0 rgba(0,0,0,.5);--knob-shadow:0 1px 3px rgba(0,0,0,.5);--knob-halo:0 0 0 3px rgba(30,232,195,.18);--orb-glow-warn:0 0 48px -8px rgba(255,152,0,.42);--window-pad:26px;--window-pad-bottom:20px;--titlebar-pad-left:14px;--titlebar-pad-right:8px;--footer-pad:16px;--field-gap:22px;--section-gap:20px;--progress-gap:28px;--control-gap:10px;--row-pad:10px;--card-pad:15px;--art-pad:14px;--label-gap:8px;--icon-gap:9px;--step-gap:2px;--menu-pad:20px;--panel-gap:16px;--panel-pad:14px;--nav-gap:4px;--scroll-inset:6px;--scroll-edge:2px;--radius-window:18px;--radius-card:16px;--radius-control:12px;--radius-keyrow:11px;--radius-keycap:10px;--radius-tag:8px;--radius-window-button:7px;--radius-key:6px;--radius-checkbox:5px;--radius-pill:999px;--radius-menu:8px;--radius-menu-panel:6px;--radius-menu-control:4px;--window-width:400px;--window-height:640px;--titlebar-height:44px;--footer-height:36px;--input-height:50px;--button-height:48px;--button-small-height:38px;--window-button:26px;--pill-height:24px;--checkbox:16px;--mark-small:16px;--mark-large:44px;--ring:96px;--orb:88px;--art-height:104px;--track-height:5px;--status-dot:6px;--grid-cell:26px;--menu-width:840px;--menu-height:520px;--sidebar-width:240px;--logo-width:136px;--nav-item-height:38px;--panel-header-height:40px;--row-height:36px;--select-height:28px;--keybind-height:24px;--toggle-width:30px;--toggle-height:18px;--toggle-knob:12px;--slider-knob:12px;--scrollbar-width:10px;--scroll-thumb-width:4px;--scroll-thumb-width-hover:6px;--scroll-thumb-min:24px;--scroll-fade-height:20px;--scroll-step:72px;--risk-tag-height:18px;--tooltip-width:224px;--grad-brand:linear-gradient(105deg, #19faa2 0%, #1ee8c3 52%, #1ed0d8 100%);--grad-sheen:linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,0) 60%);--grad-window:linear-gradient(180deg, #151518 0%, #101013 100%);--grad-aurora:radial-gradient(75% 45% at 50% -6%, rgba(30,232,195,.13), transparent 62%);--grad-art:linear-gradient(118deg, #12312c 0%, #16333f 45%, #101018 100%);--grad-art-fade:linear-gradient(180deg, rgba(14,14,16,0) 20%, rgba(11,11,13,.92) 100%);--grad-scroll-top:linear-gradient(180deg, #151518 0%, rgba(21,21,24,0) 100%);--grad-scroll-bottom:linear-gradient(0deg, #151518 0%, rgba(21,21,24,0) 100%);--duration-fast:140ms;--duration-base:160ms;--duration-progress:380ms;--duration-ring:1.5s;--duration-step-spin:0.8s;--ease-out:cubic-bezier(.22,1,.36,1);--font-display:"Manrope",system-ui,sans-serif;--font-body:"Inter",system-ui,sans-serif;--font-accent:"Rajdhani","Inter",system-ui,sans-serif}.vl-arctic-demo{--menu-width:835px}.vl-arctic-demo *,.vl-arctic-demo ::after,.vl-arctic-demo ::before{box-sizing:border-box}.vl-arctic-demo{margin:0;background:#06070a;font-family:var(--font-body);color:var(--frost-300);-webkit-font-smoothing:antialiased;display:grid;place-items:center;min-height:100vh;padding:24px}.vl-arctic-demo button{font:inherit}.vl-arctic-demo .al-menu{width:var(--menu-width);height:var(--menu-height);display:flex;overflow:hidden;box-sizing:border-box;position:relative;background:var(--ink-850);border:1px solid var(--border-default);border-radius:var(--radius-menu);box-shadow:var(--shadow-window);font-family:var(--font-body);color:var(--frost-300)}.vl-arctic-demo .al-sidebar{width:var(--sidebar-width);flex:none;display:flex;flex-direction:column;box-sizing:border-box;padding:var(--menu-pad) 12px 16px;background:var(--ink-900);border-right:1px solid var(--border-subtle)}.vl-arctic-demo .al-sidebar-logo{width:var(--logo-width);height:auto;display:block;margin:6px 0 0 10px}.vl-arctic-demo .al-sidebar-foot{margin-top:auto;display:flex;align-items:center;gap:var(--label-gap);padding:0 10px;font-size:12px;color:var(--frost-500)}.vl-arctic-demo .al-menu-content{flex:1;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--panel-gap);padding:var(--menu-pad);box-sizing:border-box}.vl-arctic-demo .al-menu-col{display:flex;flex-direction:column;gap:var(--panel-gap);min-height:0}.vl-arctic-demo .al-nav{display:flex;flex-direction:column;gap:var(--nav-gap);margin-top:30px}.vl-arctic-demo .al-nav-item{position:relative;width:100%;height:var(--nav-item-height);display:flex;align-items:center;gap:var(--control-gap);padding:0 12px;box-sizing:border-box;border:1px solid transparent;border-radius:var(--radius-menu-control);background:0 0;cursor:pointer;text-align:left;font-family:var(--font-body);font-size:13.5px;font-weight:500;color:var(--frost-400);transition:all var(--duration-fast) var(--ease-out)}.vl-arctic-demo .al-nav-item svg{flex:none;color:var(--frost-500)}.vl-arctic-demo .al-nav-item.is-hover,.vl-arctic-demo .al-nav-item:hover{background:var(--hover-fill);color:var(--frost-100)}.vl-arctic-demo .al-nav-item.is-active{background:var(--ink-700);border-color:var(--border-subtle);color:var(--frost-50)}.vl-arctic-demo .al-nav-item.is-active svg{color:var(--mint)}.vl-arctic-demo .al-nav-item:focus-visible{outline:2px solid var(--mint);outline-offset:2px}.vl-arctic-demo .al-panel{display:flex;flex-direction:column;min-height:0;overflow:hidden;box-sizing:border-box;background:var(--ink-800);border:1px solid var(--border-default);border-radius:var(--radius-menu-panel);box-shadow:var(--edge-top)}.vl-arctic-demo .al-panel.is-fill{flex:1}.vl-arctic-demo .al-panel-head{height:var(--panel-header-height);flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 var(--panel-pad);box-sizing:border-box;border-bottom:1px solid var(--border-subtle);font-family:var(--font-accent);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--frost-300)}.vl-arctic-demo .al-panel-body{display:flex;flex-direction:column;padding:4px var(--panel-pad) 8px;overflow-y:auto}.vl-arctic-demo .al-panel-body{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}.vl-arctic-demo .al-panel-body::-webkit-scrollbar{width:var(--scrollbar-width)}.vl-arctic-demo .al-panel-body::-webkit-scrollbar-track{background:0 0}.vl-arctic-demo .al-panel-body::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:3px solid transparent;border-radius:var(--radius-pill);background-clip:padding-box}.vl-arctic-demo .al-divider{height:1px;flex:none;margin:6px 0;background:var(--border-subtle)}.vl-arctic-demo .al-setting{min-height:var(--row-height);display:flex;align-items:center;justify-content:space-between;gap:var(--control-gap)}.vl-arctic-demo .al-setting-label{font-size:13px;font-weight:500;color:var(--frost-100);white-space:nowrap;transition:color var(--duration-fast) var(--ease-out)}.vl-arctic-demo .al-setting.is-off .al-setting-label{color:var(--frost-400)}.vl-arctic-demo .al-setting.is-disabled{opacity:.4;pointer-events:none}.vl-arctic-demo .al-setting-end{display:flex;align-items:center;gap:var(--label-gap)}.vl-arctic-demo .al-toggle{position:relative;width:var(--toggle-width);height:var(--toggle-height);flex:none;padding:0;box-sizing:border-box;cursor:pointer;border:1px solid var(--border-strong);border-radius:var(--radius-pill);background:var(--ink-600);transition:all var(--duration-fast) var(--ease-out)}.vl-arctic-demo .al-toggle::after{content:"";position:absolute;top:2px;left:2px;width:var(--toggle-knob);height:var(--toggle-knob);border-radius:50%;background:var(--frost-400);transition:all var(--duration-fast) var(--ease-out)}.vl-arctic-demo .al-toggle.is-on{background:var(--grad-brand);border-color:transparent}.vl-arctic-demo .al-toggle.is-on::after{left:calc(100% - var(--toggle-knob) - 2px);background:var(--frost-50);box-shadow:var(--knob-shadow)}.vl-arctic-demo .al-toggle:focus-visible{outline:2px solid var(--mint);outline-offset:2px}.vl-arctic-demo .al-slider{padding:8px 0 10px}.vl-arctic-demo .al-slider-top{display:flex;align-items:baseline;justify-content:space-between;gap:var(--control-gap)}.vl-arctic-demo .al-slider-value{font-family:var(--font-accent);font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--frost-50);font-variant-numeric:tabular-nums}.vl-arctic-demo .al-slider-track{position:relative;height:var(--track-height);margin-top:12px;border-radius:var(--radius-pill);background:var(--ink-600);box-shadow:var(--edge-top)}.vl-arctic-demo .al-slider-fill{position:absolute;left:0;top:0;bottom:0;border-radius:var(--radius-pill);background:var(--grad-brand)}.vl-arctic-demo .al-slider-knob{position:absolute;top:50%;width:var(--slider-knob);height:var(--slider-knob);margin:calc(var(--slider-knob)/ -2) 0 0 calc(var(--slider-knob)/ -2);border-radius:50%;background:var(--frost-50);box-shadow:var(--knob-shadow),var(--knob-halo)}.vl-arctic-demo .al-select{height:var(--select-height);max-width:170px;display:inline-flex;align-items:center;gap:8px;padding:0 8px 0 10px;box-sizing:border-box;cursor:pointer;border:1px solid var(--border-default);border-radius:var(--radius-menu-control);background:var(--ink-900);font-family:var(--font-body);font-size:12.5px;font-weight:500;color:var(--frost-100);transition:all var(--duration-fast) var(--ease-out)}.vl-arctic-demo .al-select span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vl-arctic-demo .al-select svg{flex:none;color:var(--frost-400)}.vl-arctic-demo .al-select.is-hover,.vl-arctic-demo .al-select:hover{border-color:var(--border-strong)}.vl-arctic-demo .al-select.is-open{border-color:var(--border-accent);box-shadow:var(--focus-halo)}.vl-arctic-demo .al-select-menu{width:184px;padding:4px;box-sizing:border-box;border:1px solid var(--border-strong);border-radius:var(--radius-menu-panel);background:var(--ink-700);box-shadow:var(--shadow-lg)}.vl-arctic-demo .al-option{height:30px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 8px;border-radius:var(--radius-menu-control);font-size:12.5px;font-weight:500;color:var(--frost-300)}.vl-arctic-demo .al-option svg{color:var(--mint)}.vl-arctic-demo .al-option.is-hover,.vl-arctic-demo .al-option:hover{background:var(--hover-fill);color:var(--frost-50)}.vl-arctic-demo .al-option.is-selected{color:var(--mint)}.vl-arctic-demo .al-key,.vl-arctic-demo .al-keybind{min-width:36px;height:var(--keybind-height);display:inline-flex;align-items:center;justify-content:center;padding:0 8px;box-sizing:border-box;cursor:pointer;border:1px solid var(--border-default);border-radius:var(--radius-menu-control);background:var(--ink-600);box-shadow:var(--keycap-drop);font-family:var(--font-accent);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--frost-100)}.vl-arctic-demo .al-key{min-width:0;height:20px;padding:0 7px;cursor:default}.vl-arctic-demo .al-keybind.is-hover,.vl-arctic-demo .al-keybind:hover{border-color:var(--border-strong)}.vl-arctic-demo .al-keybind.is-unbound{color:var(--frost-400)}.vl-arctic-demo .al-keybind.is-listening{border-color:var(--border-accent);box-shadow:var(--focus-halo);color:var(--mint)}.vl-arctic-demo .al-scroll{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}.vl-arctic-demo .al-scroll-view{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none}.vl-arctic-demo .al-scroll-view::-webkit-scrollbar{display:none}.vl-arctic-demo .al-scroll-view.is-static{overflow:hidden}.vl-arctic-demo .al-scroll-fade{position:absolute;left:0;right:0;z-index:1;height:var(--scroll-fade-height);pointer-events:none;transition:opacity var(--duration-fast) var(--ease-out)}.vl-arctic-demo .al-scroll-fade.is-top{top:0;background:var(--grad-scroll-top)}.vl-arctic-demo .al-scroll-fade.is-bottom{bottom:0;background:var(--grad-scroll-bottom)}.vl-arctic-demo .al-scroll-fade.is-hidden{opacity:0}.vl-arctic-demo .al-scrollbar{position:absolute;z-index:2;top:var(--scroll-inset);bottom:var(--scroll-inset);right:var(--scroll-edge);width:var(--scrollbar-width)}.vl-arctic-demo .al-scroll-thumb,.vl-arctic-demo .al-scrollbar::before{position:absolute;left:50%;width:var(--scroll-thumb-width);transform:translateX(-50%);border-radius:var(--radius-pill);transition:width var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.vl-arctic-demo .al-scrollbar::before{content:"";top:0;bottom:0;background:var(--scroll-track)}.vl-arctic-demo .al-scroll-thumb{top:0;min-height:var(--scroll-thumb-min);background:var(--scroll-thumb)}.vl-arctic-demo .al-scroll.is-dragging .al-scrollbar::before,.vl-arctic-demo .al-scroll.is-hover .al-scrollbar::before,.vl-arctic-demo .al-scrollbar:hover::before{width:var(--scroll-thumb-width-hover)}.vl-arctic-demo .al-scroll.is-hover .al-scroll-thumb,.vl-arctic-demo .al-scrollbar:hover .al-scroll-thumb{width:var(--scroll-thumb-width-hover);background:var(--scroll-thumb-hover)}.vl-arctic-demo .al-scroll.is-dragging .al-scroll-thumb{width:var(--scroll-thumb-width-hover);background:var(--scroll-thumb-drag);box-shadow:var(--glow-live)}.vl-arctic-demo .al-errcode.is-warn{background:var(--warn-errcode-fill);border-color:var(--warn-errcode-line);color:var(--warn)}.vl-arctic-demo .al-setting-name{display:inline-flex;align-items:center;gap:var(--label-gap);min-width:0}.vl-arctic-demo .al-risk{position:relative;display:inline-flex;align-items:center;gap:4px;height:var(--risk-tag-height);padding:0 6px 0 5px;box-sizing:border-box;cursor:help;border:1px solid var(--warn-line);border-radius:var(--radius-menu-control);background:var(--warn-tint);color:var(--warn);font-family:var(--font-accent);font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;line-height:1}.vl-arctic-demo .al-risk svg{flex:none}.vl-arctic-demo .al-nav-item .al-risk{margin-left:auto}.vl-arctic-demo .al-nav-item .al-risk svg{color:var(--warn)}.vl-arctic-demo .al-tooltip{position:absolute;z-index:20;top:calc(100% + 8px);left:-6px;width:var(--tooltip-width);padding:10px 12px;box-sizing:border-box;display:none;border:1px solid var(--border-strong);border-radius:var(--radius-menu-panel);background:var(--ink-700);box-shadow:var(--shadow-lg);font-family:var(--font-body);font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.5;color:var(--frost-300);cursor:default}.vl-arctic-demo .al-tooltip b{display:block;margin-bottom:4px;font-family:var(--font-accent);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--warn)}.vl-arctic-demo .al-risk.is-open .al-tooltip,.vl-arctic-demo .al-risk:hover .al-tooltip{display:block}.vl-arctic-demo .al-panel{overflow:visible}.vl-arctic-demo .al-panel-body{overflow:visible}.vl-arctic-demo .dd{position:relative;display:inline-flex}.vl-arctic-demo .dd-menu{position:absolute;right:0;top:calc(100% + 4px);z-index:30;display:none}.vl-arctic-demo .dd.is-open .dd-menu{display:block}.vl-arctic-demo .dd.is-open .al-select{border-color:var(--border-accent);box-shadow:var(--focus-halo)}.vl-arctic-demo .al-option{cursor:pointer}.vl-arctic-demo .al-slider-track{cursor:pointer}.vl-arctic-demo{--mint:rgb(var(--cl-accent));--mint-bright:rgb(var(--cl-accent));--mint-cyan:rgb(var(--cl-accent));--grad-brand:rgb(var(--cl-accent));--border-accent:rgba(var(--cl-accent),.7);--font-display:inherit;--font-body:inherit;--font-accent:inherit;--menu-pad:12px;--panel-gap:10px;--panel-pad:10px;--sidebar-width:130px;--menu-width:100%;--menu-height:auto;--nav-item-height:44px;--row-height:42px;--select-height:32px;--menu-height:auto;display:block;padding:0;min-height:0;font-family:inherit;color:#d4d4d8;background:0 0;position:absolute;left:18px;top:18px;width:min(660px,calc(100% - 36px));z-index:5;text-align:left}.vl-arctic-demo .al-menu{width:100%;height:auto;min-height:380px;box-shadow:0 18px 50px #0009;border-radius:10px;background:#101013}.vl-arctic-demo .al-sidebar{padding:15px 8px}.vl-arctic-demo .al-nav{margin-top:22px;gap:5px}.vl-arctic-demo .al-nav-item{font-size:12px;padding:0 8px;gap:8px}.vl-arctic-demo .al-panel-head{height:32px;font-size:10px}.vl-arctic-demo .al-brand{font-weight:700;font-size:15px;color:#fff;padding:4px 8px}.vl-arctic-demo .al-brand small{display:block;font-size:9px;letter-spacing:.12em;margin-top:6px;color:#a5a5ad;font-weight:400}.vl-arctic-demo .al-setting-label{font-size:11px;color:#dedee2}.vl-arctic-demo .al-setting{min-height:42px}.vl-arctic-demo .al-select{max-width:114px;width:114px;font-size:10px;color:#ededf0;appearance:auto}.vl-arctic-demo .al-select option{background:#151518}.vl-arctic-demo .al-toggle{appearance:none}.vl-arctic-demo .al-toggle:checked{background:rgb(var(--cl-accent))}.vl-arctic-demo .al-toggle:checked:after{left:calc(100% - var(--toggle-knob) - 2px);background:#fff}.vl-arctic-demo .al-toggle-wrap{display:flex;align-items:center;min-height:44px;padding:5px}.vl-arctic-demo input[type=range]{width:100%;min-height:32px;accent-color:rgb(var(--cl-accent));cursor:pointer}.vl-arctic-demo .al-menu-content{padding:12px;gap:10px}.vl-arctic-demo .al-panel-body{overflow:visible}.vl-arctic-demo .al-menu-col{gap:10px}.vl-arctic-demo button:focus-visible,.vl-arctic-demo input:focus-visible,.vl-arctic-demo select:focus-visible{outline:2px solid #eee;outline-offset:3px}.vl-arctic-demo .al-demo-note{margin:10px 3px 0;color:#eee;font-size:11px;text-shadow:0 1px 3px #000}.vl-preview-ring{position:absolute;left:50%;top:50%;aspect-ratio:1;transform:translate(-50%,-50%);border:1px solid #fff9;border-radius:50%;pointer-events:none}.vl-preview-target{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:rgb(var(--cl-accent));font-size:36px;pointer-events:none;line-height:1}.vl-preview-highlight{position:absolute;pointer-events:none;border:2px solid rgb(var(--cl-accent));box-shadow:0 0 18px rgba(var(--cl-accent),.35);border-radius:4px}@media(max-width:767px){.vl-arctic-demo{position:relative;left:auto;top:auto;width:100%;margin-top:16px}.vl-arctic-demo .al-menu{display:block;min-height:0}.vl-arctic-demo .al-sidebar{width:100%;padding:12px;border-right:0;border-bottom:1px solid #ffffff14}.vl-arctic-demo .al-brand{font-size:14px}.vl-arctic-demo .al-nav{flex-direction:row;flex-wrap:wrap;margin-top:12px;gap:5px}.vl-arctic-demo .al-nav-item{width:auto;flex:1;white-space:nowrap;padding:0 8px;min-width:110px}.vl-arctic-demo .al-menu-content{display:grid;grid-template-columns:1fr 1fr;padding:10px;gap:8px}.vl-arctic-demo .al-select{width:100%;max-width:100%;height:44px}.vl-arctic-demo .al-setting{flex-wrap:wrap;gap:3px;padding-block:5px}.vl-arctic-demo .al-setting-label{font-size:12px}.vl-arctic-demo .al-toggle{width:34px;height:20px}.vl-arctic-demo .al-demo-note{text-shadow:none;color:#c3c3c3;font-size:12px}.vl-arctic-demo .al-panel-body{padding:6px 9px}.vl-arctic-demo .al-slider-top{gap:4px}.vl-arctic-demo .al-slider-value{font-size:11px}}@media(max-width:360px){.vl-arctic-demo .al-menu-content{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.vl-arctic-demo *{transition:none!important}}.vl-arctic-demo{width:min(560px,calc(100% - 36px))}.vl-arctic-demo .al-setting{min-height:36px}.vl-arctic-demo input[type=range]{appearance:none;background:0 0;padding:0;height:32px}.vl-arctic-demo input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,rgb(var(--cl-accent)) var(--range-fill,0),#ffffff18 var(--range-fill,0))}.vl-arctic-demo input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;background:#ededf0;border-radius:50%;margin-top:-4px}.vl-arctic-demo input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:#ffffff18}.vl-arctic-demo input[type=range]::-moz-range-progress{height:4px;background:rgb(var(--cl-accent))}.vl-arctic-demo input[type=range]::-moz-range-thumb{width:12px;height:12px;border:0;background:#ededf0;border-radius:50%}@media(max-width:767px){.vl-arctic-demo{width:100%}.vl-arctic-demo .al-setting{min-height:44px}.vl-arctic-demo input[type=range]{height:44px}}
@media(min-width:768px){.vl-arctic-demo{top:60px;left:18px;width:560px;transform:scale(.7);transform-origin:top left}.vl-arctic-demo .al-menu{min-height:0}.vl-arctic-demo .al-setting,.vl-arctic-demo .al-toggle-wrap{min-height:32px}.vl-arctic-demo .al-nav-item{height:36px}.vl-arctic-demo .al-nav{margin-top:16px}.vl-arctic-demo .al-slider{padding:4px 0 6px}.vl-arctic-demo .al-demo-note{font-size:12px}}.vl-arctic-demo .al-brand{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:0 3px}.vl-arctic-demo .al-brand img{width:28px;height:28px;object-fit:contain}.vl-arctic-demo .al-brand span{font-size:12px;white-space:nowrap}.vl-arctic-demo .al-brand small{width:100%;font-size:8px;margin-top:2px}@media(max-width:767px){.vl-arctic-demo{transform:none;margin-top:8px}.vl-arctic-demo .al-brand small{width:auto;margin-left:4px}.vl-arctic-demo .al-nav{margin-top:8px}}
@media(max-width:767px){.vl-bear-menu-controls .vl-menu-toggle{display:none!important}.vl-arctic-demo{position:absolute;left:10px;top:10px;width:560px;margin:0;transform:scale(.4);transform-origin:top left;pointer-events:none;user-select:none}.vl-arctic-demo .al-menu{display:flex;min-height:0}.vl-arctic-demo .al-sidebar{width:130px;padding:15px 8px;border-right:1px solid #ffffff10;border-bottom:0}.vl-arctic-demo .al-brand{gap:6px;padding:0 3px}.vl-arctic-demo .al-brand small{width:100%;margin-left:0}.vl-arctic-demo .al-nav{flex-direction:column;flex-wrap:nowrap;margin-top:16px}.vl-arctic-demo .al-nav-item{width:100%;flex:none;min-width:0;height:36px}.vl-arctic-demo .al-menu-content{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;gap:10px}.vl-arctic-demo .al-setting{flex-wrap:nowrap;gap:10px;padding:0;min-height:32px}.vl-arctic-demo .al-setting-label{font-size:11px}.vl-arctic-demo .al-select{width:114px;max-width:114px;height:32px}.vl-arctic-demo .al-toggle-wrap{min-height:32px}.vl-arctic-demo .al-panel-body{padding:4px 10px 8px}.vl-arctic-demo .al-slider{padding:4px 0 6px}.vl-arctic-demo input[type=range]{height:32px}.vl-arctic-demo .al-demo-note{display:none}}@media(max-width:360px){.vl-arctic-demo{transform:scale(.34)}}
/* Keep dragged positions desktop-only so mobile remains a fixed preview. */
@media(min-width:768px){.vl-arctic-demo{left:var(--bear-menu-left,18px);top:var(--bear-menu-top,60px)}.vl-arctic-demo [data-menu-drag-handle]{cursor:grab;touch-action:none;user-select:none}.vl-arctic-demo.is-dragging [data-menu-drag-handle]{cursor:grabbing}.vl-arctic-demo [data-menu-drag-handle]:focus-visible{outline:1px solid #d5b59b;outline-offset:4px;border-radius:3px}}
