.notification-stack{z-index:50;width:calc(380px * var(--shell-spacing-scale));gap:calc(8px * var(--shell-spacing-scale));pointer-events:none;flex-direction:column;display:flex;position:absolute}.notification-card{--demo-border-paint:var(--shell-notifications-border);--demo-border-top:var(--shell-notifications-border-width-top);--demo-border-right:var(--shell-notifications-border-width-right);--demo-border-bottom:var(--shell-notifications-border-width-bottom);--demo-border-left:var(--shell-notifications-border-width-left);border-radius:var(--shell-notifications-radius);background:rgb(var(--shell-notifications-background-rgb) / var(--shell-notifications-background-alpha));width:100%;color:var(--shell-notifications-text);cursor:pointer;pointer-events:auto;text-shadow:-.12px 0 #0080ff2e,.12px 0 #ff80002e;overflow:hidden}.notification-card__content{align-items:center;gap:calc(12px * var(--shell-spacing-scale));padding:calc(var(--shell-notifications-border-width-top) + 10px * var(--shell-spacing-scale)) calc(var(--shell-notifications-border-width-right) + 12px * var(--shell-spacing-scale)) calc(var(--shell-notifications-border-width-bottom) + 10px * var(--shell-spacing-scale)) calc(var(--shell-notifications-border-width-left) + 12px * var(--shell-spacing-scale));display:flex}.notification-card__content--single{padding-top:calc(var(--shell-notifications-border-width-top) + 7px * var(--shell-spacing-scale));padding-bottom:calc(var(--shell-notifications-border-width-bottom) + 7px * var(--shell-spacing-scale))}.notification-card__icon-slot{width:calc(40px * var(--shell-spacing-scale));height:calc(40px * var(--shell-spacing-scale));flex:none;place-items:center;display:grid}.notification-card__icon-slot img,.notification-card__large-glyph{grid-area:1/1}.notification-card__icon-slot img{object-fit:contain;opacity:0;width:100%;height:100%}.notification-card__icon-slot img[data-ready=true]{opacity:1}.notification-card__large-glyph{font:400 var(--shell-font-display-large)/1 var(--font-mono)}.notification-card__compact-glyph{width:calc(12px * var(--shell-spacing-scale));font:400 var(--shell-font-icon)/calc(19px * var(--shell-spacing-scale)) var(--font-mono);flex:none}.notification-card__content:has(.notification-card__compact-glyph){gap:calc(8px * var(--shell-spacing-scale))}.notification-card__copy{gap:calc(2px * var(--shell-spacing-scale));min-width:0;margin-right:calc(10px * var(--shell-spacing-scale));font-family:Liberation Sans,sans-serif;font-size:var(--shell-font-title);letter-spacing:-.2px;flex-direction:column;flex:1;display:flex;transform:translateY(-.5px)}.notification-card__content:has(.notification-card__compact-glyph) .notification-card__copy{transform:none}.notification-card__summary,.notification-card__body{overflow-wrap:normal;-webkit-box-orient:vertical;line-height:normal;display:-webkit-box;overflow:hidden}.notification-card__summary{-webkit-line-clamp:2;font-weight:700}.notification-card__body{margin-top:calc(2px * var(--shell-spacing-scale));color:color-mix(in srgb, var(--shell-notifications-text) 86.9565%, black);white-space:pre-line;-webkit-line-clamp:3;font-weight:400}.notification-card__body a{color:#00f;pointer-events:none;text-decoration:underline}.notification-card__close{z-index:2;top:calc(var(--shell-notifications-border-width-top) + 3px * var(--shell-spacing-scale));right:calc(var(--shell-notifications-border-width-right) + 3px * var(--shell-spacing-scale));width:calc(18px * var(--shell-spacing-scale));height:calc(18px * var(--shell-spacing-scale));color:color-mix(in srgb, var(--shell-notifications-text) 71.4286%, black);cursor:pointer;opacity:0;pointer-events:none;background:0 0;border:0;place-items:center;padding:0;font-family:Liberation Sans,sans-serif;font-size:14px;font-weight:400;line-height:normal;transition:opacity .1s linear;display:grid;position:absolute}.notification-card:hover .notification-card__close,.notification-card[data-hovered=true] .notification-card__close{opacity:1;pointer-events:auto}.notification-card__close:hover{color:var(--shell-notifications-text)}.notification-card__close>span{display:block;transform:translateY(-.5px)scaleY(.923077)}.demo-gallery{color:var(--shell-color-foreground);font-family:var(--font-mono);position:fixed;inset:0;overflow:hidden}.demo-gallery__window{--demo-border-paint:var(--shell-hyprland-active-border);--demo-border-top:var(--shell-hyprland-active-border-width-top);--demo-border-right:var(--shell-hyprland-active-border-width-right);--demo-border-bottom:var(--shell-hyprland-active-border-width-bottom);--demo-border-left:var(--shell-hyprland-active-border-width-left);border-radius:var(--shell-radius);background:var(--shell-color-background);opacity:var(--window-opacity-active);position:absolute;inset:36px 10px 10px;overflow:hidden}.demo-gallery__section{left:calc(var(--shell-spacing-huge) + var(--shell-hyprland-active-border-width-left));right:calc(var(--shell-spacing-huge) + var(--shell-hyprland-active-border-width-right));position:absolute;top:439px}.demo-gallery__section:not([data-section=button]){top:429px}.demo-gallery__section[data-section=panel-action-button]{top:423px}.demo-gallery__section[data-section=panel-tool-tip]{top:433px}.demo-gallery__section[data-section=cursor-surface]{top:699px}.demo-gallery__section[data-section=slider]{top:423px}.demo-gallery__section[data-section=text-field]{top:411px}.demo-gallery__section[data-section=number-field]{top:380px}.demo-gallery__section[data-section=toggle]{top:373px}.demo-gallery__section[data-section=toggle-switch]{top:339px}.demo-gallery__section[data-section=dropdown]{top:389px}.demo-gallery__section[data-section=searchable-dropdown]{top:529px}.demo-gallery__section[data-section=composed]{top:669px}.demo-gallery__section h1{color:var(--shell-color-foreground);font-size:var(--shell-font-subtitle);margin:0;font-weight:700;line-height:16px;position:relative;top:-5px}.demo-gallery__section>h1+p{margin:var(--shell-spacing-lg) 0 0;color:color-mix(in srgb, var(--shell-color-foreground) 67%, black);font-size:var(--shell-font-caption);line-height:13px;position:relative;top:-4px}.demo-gallery__card{min-height:52px;margin-top:var(--shell-spacing-md);--demo-border-paint:rgb(var(--shell-color-foreground-rgb) / .1);--demo-border-top:var(--shell-spacing-hairline);--demo-border-right:var(--shell-spacing-hairline);--demo-border-bottom:var(--shell-spacing-hairline);--demo-border-left:var(--shell-spacing-hairline);border-radius:var(--shell-radius);background:rgb(var(--shell-color-foreground-rgb) / .04);padding:var(--shell-spacing-row-padding-x) var(--shell-spacing-xxxl)}.demo-gallery__section>h1+p+:not(.demo-gallery__card){margin-top:calc(var(--shell-spacing-lg) - var(--shell-spacing-xs))}.demo-gallery__section[data-section=button] .demo-gallery__card{height:77px}.demo-gallery__button-row{align-items:flex-start;gap:calc(var(--shell-spacing-lg) * 2);display:flex}.demo-gallery__example{align-items:center;gap:var(--shell-spacing-md);color:color-mix(in srgb, var(--shell-color-foreground) 67%, black);font-size:var(--shell-font-caption);white-space:nowrap;flex-direction:column;line-height:12px;display:flex}.demo-gallery__button{--demo-reserved-border-top:max(var(--shell-controls-hover-cursor-border-width-top), var(--shell-controls-selected-border-width-top));--demo-reserved-border-right:max(var(--shell-controls-hover-cursor-border-width-right), var(--shell-controls-selected-border-width-right));--demo-reserved-border-bottom:max(var(--shell-controls-hover-cursor-border-width-bottom), var(--shell-controls-selected-border-width-bottom));--demo-reserved-border-left:max(var(--shell-controls-hover-cursor-border-width-left), var(--shell-controls-selected-border-width-left));min-height:var(--shell-spacing-control-height);padding:var(--shell-spacing-control-padding-y) var(--shell-spacing-control-padding-x);border-style:solid;border-color:#0000;border-width:var(--demo-reserved-border-top) var(--demo-reserved-border-right) var(--demo-reserved-border-bottom) var(--demo-reserved-border-left);border-radius:var(--shell-controls-radius);color:var(--shell-color-foreground);font:inherit;font-size:var(--shell-font-body);cursor:pointer;background:0 0;line-height:14px;transition:background-color .12s}.demo-gallery__button[data-compact]{padding:var(--shell-spacing-label-gap) var(--shell-spacing-control-gap)}.demo-gallery__button[data-active],.demo-gallery__button[data-selected]{background:var(--shell-controls-selected-fill)}.demo-gallery__button[data-selected]{color:var(--shell-controls-selected-color);font-weight:700}.demo-gallery__button[data-bordered]{--demo-border-paint:var(--shell-controls-normal-border);--demo-border-top:var(--shell-controls-normal-border-width-top);--demo-border-right:var(--shell-controls-normal-border-width-right);--demo-border-bottom:var(--shell-controls-normal-border-width-bottom);--demo-border-left:var(--shell-controls-normal-border-width-left);--demo-reserved-border-top:max(var(--shell-controls-hover-cursor-border-width-top), var(--shell-controls-selected-border-width-top), var(--shell-controls-normal-border-width-top));--demo-reserved-border-right:max(var(--shell-controls-hover-cursor-border-width-right), var(--shell-controls-selected-border-width-right), var(--shell-controls-normal-border-width-right));--demo-reserved-border-bottom:max(var(--shell-controls-hover-cursor-border-width-bottom), var(--shell-controls-selected-border-width-bottom), var(--shell-controls-normal-border-width-bottom));--demo-reserved-border-left:max(var(--shell-controls-hover-cursor-border-width-left), var(--shell-controls-selected-border-width-left), var(--shell-controls-normal-border-width-left))}.demo-gallery__button[data-focusable]{--demo-reserved-border-top:max(var(--shell-controls-hover-cursor-border-width-top), var(--shell-controls-selected-border-width-top), var(--shell-controls-focus-border-width-top));--demo-reserved-border-right:max(var(--shell-controls-hover-cursor-border-width-right), var(--shell-controls-selected-border-width-right), var(--shell-controls-focus-border-width-right));--demo-reserved-border-bottom:max(var(--shell-controls-hover-cursor-border-width-bottom), var(--shell-controls-selected-border-width-bottom), var(--shell-controls-focus-border-width-bottom));--demo-reserved-border-left:max(var(--shell-controls-hover-cursor-border-width-left), var(--shell-controls-selected-border-width-left), var(--shell-controls-focus-border-width-left))}.demo-gallery__button[data-bordered][data-focusable]{--demo-reserved-border-top:max(var(--shell-controls-hover-cursor-border-width-top), var(--shell-controls-selected-border-width-top), var(--shell-controls-normal-border-width-top), var(--shell-controls-focus-border-width-top));--demo-reserved-border-right:max(var(--shell-controls-hover-cursor-border-width-right), var(--shell-controls-selected-border-width-right), var(--shell-controls-normal-border-width-right), var(--shell-controls-focus-border-width-right));--demo-reserved-border-bottom:max(var(--shell-controls-hover-cursor-border-width-bottom), var(--shell-controls-selected-border-width-bottom), var(--shell-controls-normal-border-width-bottom), var(--shell-controls-focus-border-width-bottom));--demo-reserved-border-left:max(var(--shell-controls-hover-cursor-border-width-left), var(--shell-controls-selected-border-width-left), var(--shell-controls-normal-border-width-left), var(--shell-controls-focus-border-width-left))}.demo-gallery__button[data-cursor],.demo-gallery__button:hover{--demo-border-paint:var(--shell-controls-hover-cursor-border);--demo-border-top:var(--shell-controls-hover-cursor-border-width-top);--demo-border-right:var(--shell-controls-hover-cursor-border-width-right);--demo-border-bottom:var(--shell-controls-hover-cursor-border-width-bottom);--demo-border-left:var(--shell-controls-hover-cursor-border-width-left);background:var(--shell-controls-hover-cursor-fill)}.demo-gallery__button[data-focusable]:focus{--demo-border-paint:var(--shell-controls-focus-border);--demo-border-top:var(--shell-controls-focus-border-width-top);--demo-border-right:var(--shell-controls-focus-border-width-right);--demo-border-bottom:var(--shell-controls-focus-border-width-bottom);--demo-border-left:var(--shell-controls-focus-border-width-left);background:var(--shell-controls-focus-fill);outline:none}.demo-gallery__button:active{background:var(--shell-controls-pressed-fill)}.demo-gallery__icon{margin-right:var(--shell-spacing-control-gap);font-size:var(--shell-font-icon)}.demo-gallery__button[data-compact] .demo-gallery__icon{margin:0}.demo-gallery__cursor-list{gap:var(--shell-spacing-md);flex-direction:column;display:flex}.demo-gallery__cursor-surface{border-radius:var(--shell-radius);min-height:30px;padding:var(--shell-spacing-control-gap) var(--shell-spacing-xl);color:var(--shell-color-foreground);font-size:var(--shell-font-body);cursor:pointer;background:0 0;line-height:14px;transition:background-color 60ms}.demo-gallery__cursor-surface[data-current]{background:var(--shell-controls-selected-fill)}.demo-gallery__cursor-surface[data-cursor]{--demo-border-paint:var(--shell-controls-hover-cursor-border);--demo-border-top:var(--shell-controls-hover-cursor-border-width-top);--demo-border-right:var(--shell-controls-hover-cursor-border-width-right);--demo-border-bottom:var(--shell-controls-hover-cursor-border-width-bottom);--demo-border-left:var(--shell-controls-hover-cursor-border-width-left);background:var(--shell-controls-hover-cursor-fill)}.demo-gallery__button-group,.demo-gallery__panel-action-row{align-items:center;display:flex}.demo-gallery__button-group{gap:var(--shell-spacing-md);outline:none}.demo-gallery__panel-action-row{gap:var(--shell-spacing-huge)}.demo-gallery__panel-action{width:calc(var(--shell-spacing-huge) + var(--shell-spacing-sm));height:calc(var(--shell-spacing-huge) + var(--shell-spacing-sm));border-radius:var(--shell-radius);color:var(--shell-color-foreground);font-family:inherit;font-size:var(--shell-font-icon);cursor:pointer;background:0 0;border:0;padding:0;line-height:1;transition:background-color 60ms}.demo-gallery__panel-action[data-large]{width:calc(var(--shell-spacing-huge) + var(--shell-spacing-lg));height:calc(var(--shell-spacing-huge) + var(--shell-spacing-lg));font-size:var(--shell-font-subtitle)}.demo-gallery__panel-action[data-cursor]:not(:disabled),.demo-gallery__panel-action:hover:not(:disabled){color:var(--shell-color-foreground);background:rgb(var(--shell-color-foreground-rgb) / var(--shell-controls-hover-cursor-fill-alpha))}.demo-gallery__panel-action[data-urgent][data-cursor]:not(:disabled),.demo-gallery__panel-action[data-urgent]:hover:not(:disabled){color:var(--shell-color-urgent);background:rgb(var(--shell-color-urgent-rgb) / var(--shell-controls-hover-cursor-fill-alpha))}.demo-gallery__panel-action[data-focusable]:focus{--demo-border-paint:var(--shell-controls-focus-border);--demo-border-top:var(--shell-controls-focus-border-width-top);--demo-border-right:var(--shell-controls-focus-border-width-right);--demo-border-bottom:var(--shell-controls-focus-border-width-bottom);--demo-border-left:var(--shell-controls-focus-border-width-left);background:var(--shell-controls-focus-fill);outline:none}.demo-gallery__panel-action:disabled{color:color-mix(in srgb, var(--shell-color-foreground) 50%, black);cursor:default}.demo-gallery__tooltip-swatch{width:calc(var(--shell-spacing-number-field-width) + var(--shell-spacing-control-padding-x) * 2);height:calc(var(--shell-spacing-control-height) + var(--shell-spacing-lg));--demo-border-paint:var(--shell-controls-hover-cursor-border);--demo-border-top:var(--shell-controls-hover-cursor-border-width-top);--demo-border-right:var(--shell-controls-hover-cursor-border-width-right);--demo-border-bottom:var(--shell-controls-hover-cursor-border-width-bottom);--demo-border-left:var(--shell-controls-hover-cursor-border-width-left);border-radius:var(--shell-radius);background:var(--shell-controls-hover-cursor-fill);font-family:monospace;font-size:var(--shell-font-body);cursor:pointer;place-items:center;display:grid}.demo-gallery__tooltip{z-index:2;bottom:calc(100% + var(--shell-spacing-xs));left:calc(-1 * var(--shell-spacing-control-padding-x));width:max-content;padding:calc(var(--shell-spacing-control-padding-y) + var(--shell-tooltip-border-width-top)) calc(var(--shell-spacing-control-padding-x) + var(--shell-tooltip-border-width-right)) calc(var(--shell-spacing-control-padding-y) + var(--shell-tooltip-border-width-bottom)) calc(var(--shell-spacing-control-padding-x) + var(--shell-tooltip-border-width-left));--demo-border-paint:var(--shell-tooltip-border);--demo-border-top:var(--shell-tooltip-border-width-top);--demo-border-right:var(--shell-tooltip-border-width-right);--demo-border-bottom:var(--shell-tooltip-border-width-bottom);--demo-border-left:var(--shell-tooltip-border-width-left);border-radius:var(--shell-tooltip-radius);color:var(--shell-tooltip-text);background:var(--shell-tooltip-background);font-family:monospace;font-size:var(--shell-font-body-small);line-height:calc(var(--shell-font-body-small) + var(--shell-spacing-sm));white-space:nowrap;position:absolute}.demo-gallery__form-card{padding:var(--shell-spacing-row-padding-x) var(--shell-spacing-xxxl);--demo-border-paint:rgb(var(--shell-color-foreground-rgb) / .1);--demo-border-top:var(--shell-spacing-hairline);--demo-border-right:var(--shell-spacing-hairline);--demo-border-bottom:var(--shell-spacing-hairline);--demo-border-left:var(--shell-spacing-hairline);border-radius:var(--shell-radius);background:rgb(var(--shell-color-foreground-rgb) / .04)}.demo-gallery__text-fields{gap:var(--shell-spacing-xl);flex-direction:column;display:flex}.demo-gallery__text-input,.demo-gallery__number-input{--demo-border-paint:var(--shell-controls-normal-border);--demo-border-top:var(--shell-controls-normal-border-width-top);--demo-border-right:var(--shell-controls-normal-border-width-right);--demo-border-bottom:var(--shell-controls-normal-border-width-bottom);--demo-border-left:var(--shell-controls-normal-border-width-left);border-radius:var(--shell-radius);background:var(--shell-controls-normal-fill)}.demo-gallery__text-input[data-cursor],.demo-gallery__text-input:hover,.demo-gallery__number-input[data-cursor],.demo-gallery__number-input:hover{--demo-border-paint:var(--shell-controls-hover-cursor-border);--demo-border-top:var(--shell-controls-hover-cursor-border-width-top);--demo-border-right:var(--shell-controls-hover-cursor-border-width-right);--demo-border-bottom:var(--shell-controls-hover-cursor-border-width-bottom);--demo-border-left:var(--shell-controls-hover-cursor-border-width-left);background:var(--shell-controls-hover-cursor-fill)}.demo-gallery__text-input:focus-within,.demo-gallery__number-input:focus-within{--demo-border-paint:var(--shell-controls-focus-border);--demo-border-top:var(--shell-controls-focus-border-width-top);--demo-border-right:var(--shell-controls-focus-border-width-right);--demo-border-bottom:var(--shell-controls-focus-border-width-bottom);--demo-border-left:var(--shell-controls-focus-border-width-left);background:var(--shell-controls-focus-fill)}.demo-gallery__text-input input,.demo-gallery__number-input input{box-sizing:border-box;width:100%;padding:calc(var(--shell-spacing-input-padding-y) + var(--demo-border-top)) calc(var(--shell-spacing-control-padding-x) + var(--demo-border-right)) calc(var(--shell-spacing-input-padding-y) + var(--demo-border-bottom)) calc(var(--shell-spacing-control-padding-x) + var(--demo-border-left));color:var(--shell-color-foreground);font:inherit;font-size:var(--shell-font-body);line-height:calc(var(--shell-font-body) + var(--shell-spacing-sm));background:0 0;border:0;outline:0}.demo-gallery__text-input input::placeholder{color:color-mix(in srgb, var(--shell-color-foreground) 62.5%, black);opacity:1}.demo-gallery__text-input input::selection{color:var(--shell-color-foreground);background:var(--shell-controls-selected-fill)}.demo-gallery__number-input input::selection{color:var(--shell-color-foreground);background:var(--shell-controls-selected-fill)}.demo-gallery__number-card{padding-right:0;padding-left:var(--shell-spacing-row-padding-x);--demo-border-paint:rgb(var(--shell-color-foreground-rgb) / .12)}.demo-gallery__number-field{align-items:flex-start;gap:var(--shell-spacing-md);color:color-mix(in srgb, var(--shell-color-foreground) 71.4%, black);font-size:var(--shell-font-body-small);line-height:calc(var(--shell-font-body-small) + var(--shell-spacing-sm));flex-direction:column;display:flex}.demo-gallery__number-input{width:var(--shell-spacing-number-field-width);height:var(--shell-spacing-control-height)}.demo-gallery__number-input input{height:100%;padding-top:var(--demo-border-top);padding-bottom:var(--demo-border-bottom);color:var(--shell-color-foreground);text-align:center;appearance:textfield}.demo-gallery__number-input input::-webkit-inner-spin-button{appearance:none;margin:0}.demo-gallery__number-input input::-webkit-outer-spin-button{appearance:none;margin:0}.demo-gallery__number-steppers{z-index:2;width:calc(var(--shell-spacing-xxxl) + var(--shell-spacing-xs));flex-direction:column;height:100%;display:flex;position:absolute;top:0;right:0}.demo-gallery__number-steppers button{cursor:pointer;background:0 0;border:0;flex:1;place-items:center;min-width:0;height:50%;padding:0;display:grid}.demo-gallery__number-steppers span{border-right:var(--shell-spacing-sm) solid transparent;border-left:var(--shell-spacing-sm) solid transparent;width:0;height:0}.demo-gallery__number-steppers button:first-child span{border-bottom:var(--shell-spacing-sm) solid color-mix(in srgb, var(--shell-color-foreground) 80%, black)}.demo-gallery__number-steppers button:last-child span{border-top:var(--shell-spacing-sm) solid color-mix(in srgb, var(--shell-color-foreground) 80%, black)}.demo-gallery__dropdown-card,.demo-gallery__composed-card{overflow:visible}.demo-gallery__dropdown{width:var(--shell-spacing-dropdown-width);gap:var(--shell-spacing-label-gap);flex-direction:column;display:flex}.demo-gallery__searchable-dropdown{width:var(--shell-spacing-searchable-dropdown-width)}.demo-gallery__dropdown>strong{color:color-mix(in srgb, var(--shell-popups-text) 71.4%, black);font-size:var(--shell-font-caption);line-height:calc(var(--shell-spacing-huge) - var(--shell-spacing-label-gap))}.demo-gallery__dropdown-anchor{position:relative}.demo-gallery__dropdown-trigger{width:100%;height:var(--shell-spacing-control-height);padding:0 calc(var(--shell-spacing-control-gap) + var(--demo-border-right)) 0 calc(var(--shell-spacing-control-padding-x) + var(--demo-border-left));--demo-border-paint:var(--shell-controls-normal-border);--demo-border-top:var(--shell-controls-normal-border-width-top);--demo-border-right:var(--shell-controls-normal-border-width-right);--demo-border-bottom:var(--shell-controls-normal-border-width-bottom);--demo-border-left:var(--shell-controls-normal-border-width-left);border-radius:var(--shell-radius);color:var(--shell-popups-text);background:var(--shell-controls-normal-fill);font:inherit;font-size:var(--shell-font-body);text-align:left;cursor:pointer;border:0;justify-content:space-between;align-items:center;display:flex}.demo-gallery__dropdown-trigger[data-cursor],.demo-gallery__dropdown-trigger:hover{--demo-border-paint:var(--shell-controls-hover-cursor-border);--demo-border-top:var(--shell-controls-hover-cursor-border-width-top);--demo-border-right:var(--shell-controls-hover-cursor-border-width-right);--demo-border-bottom:var(--shell-controls-hover-cursor-border-width-bottom);--demo-border-left:var(--shell-controls-hover-cursor-border-width-left);background:var(--shell-controls-hover-cursor-fill)}.demo-gallery__dropdown-trigger:focus{--demo-border-paint:var(--shell-controls-focus-border);--demo-border-top:var(--shell-controls-focus-border-width-top);--demo-border-right:var(--shell-controls-focus-border-width-right);--demo-border-bottom:var(--shell-controls-focus-border-width-bottom);--demo-border-left:var(--shell-controls-focus-border-width-left);background:var(--shell-controls-focus-fill);outline:0}.demo-gallery__dropdown-trigger>span:last-child{color:color-mix(in srgb, var(--shell-popups-text) 83.3%, black)}.demo-gallery__dropdown-trigger[data-placeholder]>span:first-child{color:color-mix(in srgb, var(--shell-popups-text) 67%, black)}.demo-gallery__dropdown-popup{z-index:5;top:calc(100% + var(--shell-spacing-xxs));box-sizing:border-box;gap:var(--shell-spacing-label-gap);width:100%;padding:calc(var(--shell-popups-border-width-top) + var(--shell-spacing-hairline)) calc(var(--shell-popups-border-width-right) + var(--shell-spacing-hairline)) calc(var(--shell-popups-border-width-bottom) + var(--shell-spacing-hairline)) calc(var(--shell-popups-border-width-left) + var(--shell-spacing-hairline));--demo-border-paint:var(--shell-popups-border);--demo-border-top:var(--shell-popups-border-width-top);--demo-border-right:var(--shell-popups-border-width-right);--demo-border-bottom:var(--shell-popups-border-width-bottom);--demo-border-left:var(--shell-popups-border-width-left);border-radius:var(--shell-popups-radius);background:var(--shell-popups-background);outline:0;flex-direction:column;display:flex;position:absolute;left:0}.demo-gallery__dropdown-popup button{box-sizing:border-box;width:100%;height:var(--shell-spacing-popup-row-height);padding:0 var(--shell-spacing-control-padding-x);color:var(--shell-popups-text);font:inherit;font-size:var(--shell-font-body);text-align:left;cursor:pointer;background:0 0;border:0;flex:none}.demo-gallery__dropdown-popup button[data-current]{color:var(--shell-controls-hover-cursor-color);background:var(--shell-controls-hover-cursor-fill)}.demo-gallery__dropdown-popup:not(.demo-gallery__search-popup){height:calc(var(--shell-spacing-popup-row-height) * 3 + var(--shell-spacing-label-gap) * 2 + var(--shell-spacing-xxs));overflow:hidden}.demo-gallery__search-popup{height:max(var(--shell-spacing-searchable-popup-min-height), min(calc((var(--shell-spacing-popup-row-height) + var(--shell-spacing-row-padding-x)) * var(--demo-search-count) + var(--shell-spacing-label-gap) * var(--demo-search-gap-count) + var(--shell-spacing-huge) * 2 + var(--shell-spacing-xxxl)), calc(var(--shell-spacing-popup-row-height) * 6 + var(--shell-spacing-label-gap) * 5 + var(--shell-spacing-huge) * 2 + var(--shell-spacing-xxxl))));padding:calc(var(--shell-popups-border-width-top) + var(--shell-spacing-hairline)) calc(var(--shell-popups-border-width-right) + var(--shell-spacing-hairline)) calc(var(--shell-popups-border-width-bottom) + var(--shell-spacing-hairline)) calc(var(--shell-popups-border-width-left) + var(--shell-spacing-hairline));display:block}.demo-gallery__search-header{box-sizing:border-box;height:calc(var(--shell-spacing-popup-row-height) + var(--shell-spacing-control-padding-x));padding:var(--shell-spacing-md)}.demo-gallery__search-header .demo-gallery__text-input,.demo-gallery__search-header input{height:100%}.demo-gallery__search-separator,.demo-gallery__separator{height:var(--shell-spacing-hairline);background:rgb(var(--shell-color-foreground-rgb) / .1)}.demo-gallery__search-results{height:calc(100% - var(--shell-spacing-popup-row-height) - var(--shell-spacing-control-padding-x) - var(--shell-spacing-xxs) - var(--shell-spacing-hairline));gap:var(--shell-spacing-label-gap);outline:0;flex-direction:column;display:flex;position:relative;overflow:hidden}.demo-gallery__search-results button{min-height:calc(var(--shell-spacing-popup-row-height) + var(--shell-spacing-lg));justify-content:center;gap:var(--shell-spacing-xxs);flex-direction:column;height:auto;display:flex}.demo-gallery__search-results button strong{font-size:var(--shell-font-body);font-weight:400}.demo-gallery__search-results button span{color:color-mix(in srgb, var(--shell-popups-text) 67%, black);font-size:var(--shell-font-caption)}.demo-gallery__search-empty{color:color-mix(in srgb, var(--shell-popups-text) 62.5%, black);font-size:var(--shell-font-body);place-items:center;display:grid;position:absolute;inset:0}.demo-gallery__composed-list{gap:var(--shell-spacing-md);flex-direction:column;display:flex}.demo-gallery__section-header{padding-top:var(--shell-spacing-xxs);color:color-mix(in srgb, var(--shell-color-foreground) 71.4%, black);font-size:var(--shell-font-caption);line-height:var(--shell-spacing-xxl)}.demo-gallery__wifi-row{min-height:0;height:calc(var(--shell-spacing-control-height) + var(--shell-spacing-huge) + var(--shell-spacing-xxs));padding:0 var(--shell-spacing-control-padding-x);align-items:center;gap:0;display:flex;position:relative}.demo-gallery__wifi-icon{margin-right:var(--shell-spacing-xl);font-size:var(--shell-font-title);flex:none}.demo-gallery__wifi-copy{gap:var(--shell-spacing-hairline);margin-right:var(--shell-spacing-control-gap);flex-direction:column;flex:1;display:flex}.demo-gallery__wifi-copy span:first-child{font-size:var(--shell-font-body)}.demo-gallery__wifi-copy span{font-size:var(--shell-font-caption)}.demo-gallery__composed-action{margin-left:0;display:inline-flex;position:relative}.demo-gallery__composed-action .demo-gallery__tooltip{right:calc(-1 * var(--shell-spacing-control-padding-x));left:auto}.demo-gallery__composed-list>.demo-gallery__separator{background:rgb(var(--shell-color-foreground-rgb) / .12)}.demo-gallery__wifi-row--idle .demo-gallery__wifi-icon{color:color-mix(in srgb, var(--shell-color-foreground) 71.4%, black)}.demo-gallery__wifi-row--idle .demo-gallery__idle-label{left:calc(var(--shell-spacing-control-padding-x) + var(--shell-spacing-xxl) * 2);position:absolute}.demo-gallery__slider-surface{min-height:calc(var(--shell-spacing-row-padding-x) * 2 + var(--shell-spacing-huge) + var(--shell-spacing-sm));padding:var(--shell-spacing-row-padding-x) var(--shell-spacing-xxxl);align-items:center;gap:var(--shell-spacing-xl);display:flex}.demo-gallery__slider-icon{width:calc(var(--shell-spacing-huge) + var(--shell-spacing-sm));font-size:var(--shell-font-heading);text-align:center;flex:none}.demo-gallery__slider{width:calc(100% - var(--shell-spacing-huge) * 3 - var(--shell-spacing-lg) * 2);height:calc(var(--shell-spacing-huge) + var(--shell-spacing-sm));cursor:pointer;touch-action:none;flex:none;position:relative}.demo-gallery__slider-track,.demo-gallery__slider-fill{height:var(--shell-spacing-sm);border-radius:calc(var(--shell-spacing-sm) / 2);position:absolute;top:50%;left:0;transform:translateY(-50%)}.demo-gallery__slider-track{background:var(--shell-controls-selected-fill);width:100%}.demo-gallery__slider-fill{background:var(--shell-color-foreground);transition:width .14s cubic-bezier(.215,.61,.355,1)}.demo-gallery__slider-knob{top:50%;left:clamp(calc(var(--shell-spacing-xxxl) / 2), var(--demo-slider-progress), calc(100% - var(--shell-spacing-xxxl) / 2));width:var(--shell-spacing-xxxl);height:var(--shell-spacing-xxxl);--demo-border-paint:var(--shell-color-background);--demo-border-top:var(--shell-spacing-xxs);--demo-border-right:var(--shell-spacing-xxs);--demo-border-bottom:var(--shell-spacing-xxs);--demo-border-left:var(--shell-spacing-xxs);background:var(--shell-color-foreground);border-radius:50%;transition:left .14s cubic-bezier(.215,.61,.355,1),scale .11s cubic-bezier(.215,.61,.355,1);position:absolute;transform:translate(-50%,-50%)}.demo-gallery__slider:hover .demo-gallery__slider-knob{scale:1.15}.demo-gallery__slider[data-dragging] .demo-gallery__slider-fill{transition:none}.demo-gallery__slider[data-dragging] .demo-gallery__slider-knob{transition:scale .11s cubic-bezier(.215,.61,.355,1);scale:1.15}.demo-gallery__slider-value{width:calc(var(--shell-spacing-huge) * 2 + var(--shell-spacing-xxs));font-size:var(--shell-font-body);text-align:right;flex:none}.demo-gallery__toggle-list{gap:var(--shell-spacing-lg);flex-direction:column;display:flex}.demo-gallery__toggle-row{width:100%;min-height:54px;padding-top:0;padding-right:calc(var(--shell-spacing-row-padding-x) + var(--demo-border-right));padding-bottom:0;padding-left:calc(var(--shell-spacing-row-padding-x) + var(--demo-border-left));align-items:center;gap:var(--shell-spacing-row-padding-x);--demo-border-paint:var(--shell-controls-normal-border);--demo-border-top:var(--shell-controls-normal-border-width-top);--demo-border-right:var(--shell-controls-normal-border-width-right);--demo-border-bottom:var(--shell-controls-normal-border-width-bottom);--demo-border-left:var(--shell-controls-normal-border-width-left);border-radius:var(--shell-radius);color:var(--shell-color-foreground);background:var(--shell-controls-normal-fill);text-align:left;cursor:pointer;border:0;font-family:inherit;transition:background-color .1s;display:flex}.demo-gallery__toggle-row[data-cursor],.demo-gallery__toggle-row:hover{--demo-border-paint:var(--shell-controls-hover-cursor-border);--demo-border-top:var(--shell-controls-hover-cursor-border-width-top);--demo-border-right:var(--shell-controls-hover-cursor-border-width-right);--demo-border-bottom:var(--shell-controls-hover-cursor-border-width-bottom);--demo-border-left:var(--shell-controls-hover-cursor-border-width-left);background:var(--shell-controls-hover-cursor-fill)}.demo-gallery__toggle-row:focus{--demo-border-paint:var(--shell-controls-focus-border);--demo-border-top:var(--shell-controls-focus-border-width-top);--demo-border-right:var(--shell-controls-focus-border-width-right);--demo-border-bottom:var(--shell-controls-focus-border-width-bottom);--demo-border-left:var(--shell-controls-focus-border-width-left);background:var(--shell-controls-focus-fill);outline:0}.demo-gallery__toggle-copy{gap:var(--shell-spacing-xs);flex-direction:column;flex:1;min-width:0;display:flex}.demo-gallery__toggle-copy strong{font-size:var(--shell-font-subtitle);text-overflow:ellipsis;white-space:nowrap;line-height:16px;overflow:hidden}.demo-gallery__toggle-copy>span{color:color-mix(in srgb, var(--shell-color-foreground) 67%, black);font-size:var(--shell-font-caption);line-height:13px}.demo-gallery__toggle-switch{width:calc(var(--shell-spacing-huge) * 2 + var(--shell-spacing-huge));height:calc(var(--shell-spacing-huge) + var(--shell-spacing-lg) * 2);border-radius:var(--shell-controls-radius);cursor:pointer;background:0 0;border:0;flex:none;place-items:center;padding:0;display:grid}.demo-gallery__toggle-switch:not([data-interactive]){width:calc(var(--shell-spacing-huge) * 2 + var(--shell-spacing-md));height:calc(var(--shell-spacing-huge) + var(--shell-spacing-sm));cursor:default}.demo-gallery__toggle-switch[data-cursor],.demo-gallery__toggle-switch[data-interactive]:hover{--demo-border-paint:var(--shell-controls-hover-cursor-border);--demo-border-top:var(--shell-controls-hover-cursor-border-width-top);--demo-border-right:var(--shell-controls-hover-cursor-border-width-right);--demo-border-bottom:var(--shell-controls-hover-cursor-border-width-bottom);--demo-border-left:var(--shell-controls-hover-cursor-border-width-left)}.demo-gallery__toggle-track{width:calc(var(--shell-spacing-huge) * 2 + var(--shell-spacing-md));height:calc(var(--shell-spacing-huge) + var(--shell-spacing-sm));--demo-border-paint:var(--shell-controls-normal-border);--demo-border-top:var(--shell-controls-normal-border-width-top);--demo-border-right:var(--shell-controls-normal-border-width-right);--demo-border-bottom:var(--shell-controls-normal-border-width-bottom);--demo-border-left:var(--shell-controls-normal-border-width-left);border-radius:clamp(0px, calc(var(--shell-controls-radius) * 999), 50%);background:var(--shell-controls-normal-fill);transition:background-color .12s;position:relative}.demo-gallery__toggle-switch[data-square] .demo-gallery__toggle-track{border-radius:0}.demo-gallery__toggle-switch[data-checked] .demo-gallery__toggle-track{--demo-border-paint:var(--shell-controls-selected-border);--demo-border-top:var(--shell-controls-selected-border-width-top);--demo-border-right:var(--shell-controls-selected-border-width-right);--demo-border-bottom:var(--shell-controls-selected-border-width-bottom);--demo-border-left:var(--shell-controls-selected-border-width-left);background:var(--shell-controls-selected-fill)}.demo-gallery__toggle-knob{top:var(--shell-spacing-xs);left:var(--shell-spacing-xs);width:calc(var(--shell-spacing-lg) * 2);height:calc(var(--shell-spacing-lg) * 2);border-radius:inherit;background:color-mix(in srgb, var(--demo-toggle-foreground,var(--shell-color-foreground)) 80%, black);transition:left .12s cubic-bezier(.215,.61,.355,1),background-color .12s;position:absolute}.demo-gallery__toggle-switch[data-checked] .demo-gallery__toggle-knob{left:calc(100% - var(--shell-spacing-xs) - var(--shell-spacing-lg) * 2);background:var(--shell-controls-selected-color)}.demo-gallery__switch-row{align-items:center;gap:calc(var(--shell-spacing-xxl) * 2);display:flex}.demo-gallery__switch-note{margin:var(--shell-spacing-lg) 0 0;color:color-mix(in srgb, var(--shell-color-foreground) 67%, black);font-size:var(--shell-font-caption);line-height:13px}