xel/themes/cupertino.css

Widget toolkit for building native-like Web, Electron and Hybrid apps

:root{width:100%;height:100%;margin:0;interpolate-size:allow-keywords;font-family:sans-serif;line-height:1.6}body{width:100vw;height:100%;margin:0;overflow-y:overlay}h1{margin:22px 0 16px;box-sizing:border-box;line-height:1;font-size:3.25rem;font-weight:700}h2{margin:18px 0 14px 0;box-sizing:border-box;line-height:1;font-size:2.125rem;font-weight:700}h3{margin:16px 0 12px 0;box-sizing:border-box;line-height:1.2;font-size:1.75rem;font-weight:700}h4{margin:14px 0 10px 0;box-sizing:border-box;line-height:1.1;font-size:1.5rem;font-weight:700}h5{margin:12px 0 8px 0;box-sizing:border-box;line-height:1.1;font-size:1.25rem;font-weight:700}h6{margin:8px 0 5px 0;box-sizing:border-box;line-height:1.1;font-size:1rem;font-weight:700}h1 em, h2 em, h3 em, h4 em, h5 em, h6 em{font-weight:inherit}h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong{font-weight:900}p{margin:16px 0}p:last-child{margin-bottom:0}a{font-weight:500}table{width:100%;margin:16px 0;border-collapse:collapse;border-style:hidden;box-shadow:0 0 0 1px var(--border-color)}th{text-align:start;padding:8px 14px;border-spacing:0}td{padding:8px 14px;border-spacing:0}em{font-weight:500}pre, code, var{font-size:0.875rem;font-style:normal;padding:0 4px}pre{margin:14px 0;padding:4px 6px;white-space:pre-wrap;box-sizing:border-box}pre > code{display:block;padding:0;box-sizing:border-box;background-color:transparent;outline-width:0px;line-height:1.3}hr{width:100%;height:1px;min-height:1px;margin:24px 0;box-sizing:border-box;border:none}blockquote{box-sizing:border-box;margin:16px 0;padding:5px 14px;border-left-width:8px;border-left-style:solid}blockquote > blockquote{margin:6px 0}blockquote > p:first-child{margin-top:0}ul, ol{margin:12px 0;padding:0}p + ul{margin:-10px 0 0 0}li > ul, li > ol{margin:0}li{position:relative;margin:0;padding:0}ul li{margin-left:20px}ol li{margin-left:16px}li > p{margin:4px 0}ol > li::marker{font-weight:700}img{display:block;height:auto;margin:14px auto;max-width:100%;user-select:none;box-sizing:border-box;background:var(--checkboard-background);border-width:1px;border-style:solid;border-color:var(--border-color);-webkit-user-select:none;-webkit-user-modify:read-only}img:active{cursor:-webkit-grabbing}[popover]{color:var(--text-color);background-color:var(--foreground-color)}::-webkit-scrollbar{max-width:6px;max-height:6px}::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin}}x-card:not(:defined){display:none}x-card > footer{padding:8px 16px;width:calc(100% + 40px);height:calc(100% + 20px);margin-left:-20px;margin-bottom:-16px;box-sizing:border-box;background:lightgrey}x-card > footer:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}x-card > footer:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}x-card > h1:first-child{margin-top:0}x-card > h2:first-child{margin-top:0}x-card > h3:first-child{margin-top:0}x-card > h4:first-child{margin-top:0}x-card > h5:first-child{margin-top:0}x-card > h6:first-child{margin-top:0}x-avatar[size="small"]{width:28px;height:28px}x-avatar[size="large"]{width:54px;height:54px}x-avatar > img{width:100%;height:100%;-webkit-user-drag:none}x-avatar > x-icon{width:55%;height:55%}x-avatar > x-label{font-size:1rem;pointer-events:none}x-avatar[size="small"] > x-label{font-size:0.75rem}x-avatar[size="large"] > x-label{font-size:1.5rem}x-accordion:not(:defined){display:none}x-accordion[size="small"]::part(arrow){width:14px;height:14px}x-accordion[size="large"]::part(arrow){width:18px;height:18px}x-accordion > header{display:flex;align-items:center;box-sizing:border-box;width:100%;padding:7px 0 7px 20px}x-accordion[size="small"] > header{padding-left:18px}x-accordion[size="large"] > header{padding-left:22px}x-accordion > header > x-label:first-child{flex:1}x-accordion > header > *:not(:last-child){margin-right:20px}x-accordion:not([expanded]):not([animating]) > *:not(header){display:none!important}x-icon[size="small"]{width:15px;height:15px}x-icon[size="large"]{width:21px;height:21px}x-icon:not(:defined){display:none}x-label:not(:defined){display:none}x-shortcut:not(:defined){display:none}x-stepper:not(:defined){display:none}x-swatch[size="small"]{width:16px;height:16px}x-swatch[size="large"]{width:20px;height:20px}x-swatch:not(:defined){display:none}x-button{--min-pressed-time: 150ms;}@media (pointer:coarse){x-button{--min-pressed-time: 600ms;}}a:has(x-button){text-decoration:none}x-button[toggled]{z-index:1}x-button[condensed]{padding:2px 7px}x-button[size="small"]{min-height:24px}x-button[size="large"]{min-height:38px}x-buttons[vertical] > x-button{width:100%;justify-content:flex-start}x-button:not(:defined){display:none}x-button > x-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center;min-width:1px;pointer-events:none}x-button > x-label ~ x-icon, x-button > x-icon ~ x-label{margin:0 0 0 6px}x-button > x-menu{font-size:0.875rem}x-button[skin="normal"][size="small"] > x-icon{width:14px;height:14px}x-button[skin="normal"][size="large"] > x-icon{width:20px;height:20px}x-button[skin="flat"]{padding:0}x-buttons:not([vertical]) > x-button[skin="flat"]:not(:first-of-type){margin-left:10px}x-buttons:not([vertical]) > x-button[skin="flat"][size="small"]:not(:first-of-type){margin-left:5px}x-buttons[vertical] > x-button[skin="flat"]:not(:first-of-type){margin-top:10px}x-buttons[vertical] > x-button[skin="flat"][size="small"]:not(:first-of-type){margin-top:5px}x-button[skin="flat"] > x-icon{width:26px;height:26px}x-button[skin="flat"][size="small"] > x-icon{width:22px;height:22px}x-button[skin="flat"][size="large"] > x-icon{width:28px;height:28px}x-button[skin="recessed"]{min-height:18px;padding:4px 8px}x-button[skin="recessed"][size="small"]{padding:3px 8px}x-button[skin="recessed"][size="large"]{padding:5px 8px}x-buttons:not([vertical]) > x-button[skin="recessed"] + x-button[skin="recessed"]{margin-left:4px}x-buttons[vertical] > x-button[skin="recessed"] + x-button[skin="recessed"]{margin-top:4px}x-button[skin="recessed"] > x-icon{width:16px;height:16px}x-button[skin="recessed"][size="small"] > x-icon{width:12px;height:12px}x-button[skin="recessed"][size="large"] > x-icon{width:20px;height:20px}x-button[skin="dock"], x-buttons[vertical] > x-button[skin="dock"]{width:38px;height:38px;min-height:38px;padding:0;justify-content:center}x-button[skin="dock"][size="small"], x-buttons[vertical] > x-button[skin="dock"][size="small"]{width:30px;height:30px;min-height:30px}x-button[skin="dock"][size="large"], x-buttons[vertical] > x-button[skin="dock"][size="large"]{width:45px;height:45px;min-height:45px}x-buttons:not([vertical]) > x-button[skin="dock"] + x-button[skin="dock"]{margin-left:-1px}x-buttons[vertical] > x-button[skin="dock"] + x-button[skin="dock"]{margin-top:-1px}x-button[skin="dock"] > x-icon{width:17px;height:17px}x-button[skin="dock"][size="small"] > x-icon{width:14px;height:14px}x-button[skin="dock"][size="large"] > x-icon{width:20px;height:20px}x-buttons[vertical]{flex-flow:column;align-items:flex-start;justify-content:center}x-buttons:not(:defined){display:none}x-tag[size="small"]{height:18px}x-tag[size="large"]{height:30px}x-tag:not(:defined){display:none}x-tag > x-swatch{width:14px;height:14px}x-tag[size="small"] > x-swatch{width:12px;height:12px}x-tag[size="large"] > x-swatch{width:16px;height:16px}x-tag > x-label{font-size:0.75rem}x-tag :not(x-label) + x-label{margin-left:0.25rem}x-tag[size="small"] > x-label{font-size:0.6875rem}x-tag > x-icon{width:15px;height:15px}x-tags{margin-top:-2px;margin-left:-2px}x-tags:not(:defined){display:none}x-tags x-tag{margin:2px}x-tagsinput[size="small"]{padding:0px;gap:0px}x-tagsinput[size="small"] > x-tag{height:22px;transform:scale(0.92)}x-tagsinput[size="large"]{padding:6px;gap:6px}x-tagsinput:focus-within{z-index:10}x-tagsinput:not(:defined){display:none}x-tagsinput > x-label{position:absolute;top:50%;left:8px;transform:translateY(-50%);pointer-events:none}x-tagsinput[size="small"][error]::before{top:27px}x-tagsinput[size="large"][error]::before{top:41px}x-tab[size="small"]{min-height:24px}x-tab[size="large"]{min-height:38px}x-tab:not(:defined){display:none}x-tab x-icon{width:17px;height:17px;min-width:17px;color:inherit}x-tab[size="small"] x-icon{width:15px;height:15px;min-width:15px}x-tab[size="large"] x-icon{width:19px;height:19px;min-width:19px}x-tab x-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.2;cursor:inherit;flex:1}x-tab x-icon + x-label{margin-left:6px}x-tab x-box:is([vertical]) x-icon + x-label{margin-left:0px}x-tabs:not(:defined){display:none}x-menu:not(:defined){display:none}x-menu:has(x-menu[opened]){overflow:-webkit-paged-x}x-menu > x-label{margin:6px;font-weight:700}x-menu img{margin:0;background:none;border:none}x-menu hr{width:100%;height:1px;margin:4px 0px;box-sizing:border-box}x-menu hr + hr, x-menu hr:last-child{display:none}x-menuitem[size="small"]{min-height:24px}x-menuitem[size="large"]{min-height:38px}x-menuitem:not(:defined){display:none}x-menuitem[highlighted]{color:white;background:var(--accent-color)}x-menuitem img{width:16px;height:16px}x-menuitem x-icon{width:16px;height:16px}x-menuitem x-label{display:block;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:inherit;line-height:1.4}x-menuitem img + x-label, x-menuitem x-swatch + x-label, x-menuitem x-icon + x-label{margin-left:8px}x-menuitem x-shortcut{margin-left:auto}x-menuitem x-label + x-shortcut{margin-left:8px}x-menubar[size="small"]{height:30px}x-menubar[size="large"]{height:42px}x-menubar:not(:defined){display:none}x-menubar > x-menuitem{height:100%;padding:0 11px;min-height:0}x-menubar > x-menuitem[autohidden]{display:none}x-navitem + x-navitem, a:has(x-navitem) + a:has(x-navitem), a:has(x-navitem) + x-navitem, x-navitem + a:has(x-navitem){margin:3px 0}x-nav x-nav > *:first-child{margin-top:3px}x-nav x-nav > *:last-child{margin-bottom:0}x-nav x-nav > *{margin-left:34px!important}x-nav x-nav > *{max-width:calc(100% - 34px)!important}x-nav > a{display:block;text-decoration:none}x-nav x-label{max-width:100%;flex:1 1 0%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:500;font-size:0.9375rem;text-align:start}x-nav x-icon + x-label{margin-left:14px}x-nav[collapsed] x-navitem > x-label{display:none}x-nav x-icon{width:20px;height:20px}x-nav x-label + x-icon{width:18px;height:18px;margin:0 0 0 10px}x-nav[collapsed] x-navitem > x-label + x-icon{display:none}x-nav[collapsed] x-navitem::part(button){padding:0}x-nav[collapsed] x-navitem::part(arrow){display:none}x-contextmenu:not(:defined){display:none}dialog{overflow:hidden;position:fixed;min-width:200px;min-height:100px;max-height:none;margin:auto;padding:20px 24px;box-sizing:border-box;font-size:0.8125rem;line-height:1.6}dialog:focus{outline:none}dialog:not(:defined){display:none}dialog > footer{display:flex;flex-flow:row;justify-content:flex-end;padding:12px 24px;width:calc(100% + 48px);height:calc(100% + 22px);margin-top:10px;margin-left:-24px;margin-bottom:-20px;box-sizing:border-box;background:lightgrey}dialog > footer:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}dialog > footer:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}dialog > footer x-button + x-button{margin-left:8px}dialog h3{font-size:1.125rem;font-weight:700}dialog > *:first-child{margin-top:0}x-popover{padding:12px;overflow:auto}x-popover:has(footer){overflow:hidden}x-popover:not(:defined){display:none}x-popover > footer{padding:12px;width:calc(100% + 24px);height:calc(100% + 12px);margin-left:-12px;margin-bottom:-12px;margin-top:12px;box-sizing:border-box;background:lightgrey}x-popover > footer:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}x-popover > footer:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}x-notification[size="small"]{padding:3px 12px}x-notification[size="large"]{padding:8px 12px}x-notification:not(:defined){display:none}x-notification > p{margin:0}x-checkbox:not(:defined){display:none}x-checkbox + x-checkbox{margin-top:6px}x-checkbox[size="small"]::part(indicator){width:17px;height:17px}x-checkbox[size="large"]::part(indicator){width:21px;height:21px}x-checkbox > x-label{display:block;margin-left:8px;padding:1px 0}x-radio + x-radio{margin-top:6px}x-radio:not(:defined){display:none}x-radio[size="small"]::part(indicator){width:17px;height:17px}x-radio[size="large"]::part(indicator){width:21px;height:21px}x-radio > x-label{margin:0 0 0 8px;padding:1px 0}x-radio[size="small"] > x-label{margin-left:6px}x-radio[size="large"] > x-label{margin-left:10px}x-radios:not(:defined){display:none}x-switch + x-switch{margin-top:12px}x-switch:not(:defined){display:none}x-switch[size="large"]::part(indicator){width:42px;height:20px}x-switch[size="small"]::part(indicator){width:28px;height:12px}x-switch > x-label{margin:0 0 0 8px;padding:1px 0}x-switch[size="small"] > x-label{margin-left:6px}x-switch[size="large"] > x-label{margin-left:10px}x-select[size="small"]{height:24px}x-select[size="large"]{height:38px}x-select:not(:defined){display:none}x-colorselect[size="small"]{width:24px;height:24px}x-colorselect[size="large"]{width:38px;height:38px}x-colorselect:not(:defined){display:none}x-input[size="small"]{height:24px}x-input[size="large"]{height:38px}x-input:not(:defined){display:none}x-input + x-input{margin-top:20px}x-input > x-icon{width:15px;height:15px;min-width:15px;margin:0 0 0 8px}x-input[size="small"] > x-icon{transform:scale(0.8)}x-input[size="large"] > x-icon{transform:scale(1.1)}x-input > x-icon:hover{cursor:default}x-input > x-label{display:none;position:absolute;top:50%;max-width:100%;padding:0 5px 0 5px;transform:translateY(-50%);font-family:inherit;font-size:inherit;line-height:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}x-input[empty] > x-label{display:block}x-input > x-icon + x-label{padding:0 5px 0 29px}x-numberinput[size="small"]{height:24px}x-numberinput[size="large"]{height:38px}x-numberinput:focus{z-index:10}x-numberinput:not(:defined){display:none}x-numberinput > x-label{display:none;position:absolute;top:50%;max-width:100%;padding:0 5px 0 5px;transform:translateY(-50%);font-family:inherit;font-size:inherit;line-height:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}x-numberinput[empty] > x-label{display:block}x-numberinput[size="small"][error]::before{top:27px}x-numberinput[size="large"][error]::before{top:41px}x-texteditor:focus{z-index:10}x-texteditor:not(:defined){display:none}x-texteditor > x-label{display:none;position:absolute;width:100%;top:0;left:0;padding:2px 6px;font-family:inherit;font-size:inherit;line-height:inherit;pointer-events:none}x-texteditor[empty] > x-label{display:block}x-slider:not(:defined){display:none}x-colorpicker:not(:defined){display:none}x-progressbar[size="small"]{height:6px}x-progressbar[size="large"]{height:10px}x-progressbar:not(:defined){display:none}x-throbber[size="small"]{width:26px;height:26px}x-throbber[size="large"]{width:34px;height:34px}x-throbber:not(:defined){display:none}x-titlebar x-icon + x-label{margin-left:6px}:root{color:var(--text-color);background-color:var(--background-color);font-family:BlinkMacSystemFont, -apple-system, "Inter", "Roboto Flex", "Roboto", "Noto Sans", "Helvetica Neue", "Arial", sans-serif;--theme-id:                   "cupertino";--preset-accent-colors:       blue     color(srgb 0.00 0.48 1.00),
                                purple   color(srgb 0.58 0.24 0.59),
                                pink     color(srgb 0.97 0.31 0.62),
                                red      color(srgb 0.88 0.22 0.24),
                                orange   color(srgb 0.97 0.51 0.11),
                                yellow   color(srgb 1.00 0.78 0.15),
                                green    color(srgb 0.38 0.73 0.27),
                                gray     color(srgb 0.60 0.60 0.60);--accent-color:               color(srgb 0.00 0.48 1.00);--light-accent-color:         oklch(from var(--accent-color) calc(l + 0.08) calc(c + 0.02) h);--lighter-accent-color:       oklch(from var(--accent-color) calc(l + 0.15) c h);--dark-accent-color:          oklch(from var(--accent-color) calc(l - 0.04) calc(c - 0.02) h);--darker-accent-color:        oklch(from var(--accent-color) calc(l - 0.06) c h);--darkest-accent-color:       oklch(from var(--accent-color) calc(l - 0.2) calc(c - 0.07) h);--background-color:           color(srgb 0.96 0.96 0.96);--foreground-color:           color(srgb 0.98 0.98 0.98);--border-color:               color(srgb 0.85 0.85 0.85);--text-color:                 color(srgb 0 0 0 / 0.85);--error-color:                color(srgb 1 0.23 0.19);--selection-color:            currentColor;--selection-background-color: oklch(from var(--accent-color) l c h / 0.2);--autofill-background-color:  color(srgb 0.98 1 0.74);--titlebar-color:             auto;--autocapitalize:             titlecase;--checkboard-background:      linear-gradient( 45deg, #d6d6d6 25%, #0000   25%)  0px  0px / 10px 10px,
                                linear-gradient(-45deg, #d6d6d6 25%, #0000   25%)  0px  5px / 10px 10px,
                                linear-gradient( 45deg, #0000   75%, #d6d6d6 75%)  5px -5px / 10px 10px,
                                linear-gradient(-45deg, #0000   75%, #d6d6d6 75%) -5px  0px / 10px 10px, #ffffff;--arrow-left-path-data: M 65.96 29 C 68.96 26 69.96 21 67.96 19 C 64.96 17 60.96 17 57.96 20 L 33.96 44 C 33.96 44 32.96 45 32.96 45 C 32.96 45 31.96 46 31.96 46 C 30.96 47 30.96 48 30.96 50 C 30.96 52 30.96 53 31.96 54 C 31.96 54 32.96 55 32.96 55 C 32.96 55 33.96 56 33.96 56 L 57.96 80 C 60.96 83 64.96 83 67.96 81 C 69.96 79 68.96 74 65.96 71 L 44.96 50 L 65.96 29 Z;--arrow-right-path-data: M 34 29 C 31 26 30 21 32 19 C 35 17 39 17 42 20 L 66 44 C 66 44 67 45 67 45 C 67 45 68 46 68 46 C 69 47 69 48 69 50 C 69 52 69 53 68 54 C 68 54 67 55 67 55 C 67 55 66 56 66 56 L 42 80 C 39 83 35 83 32 81 C 30 79 31 74 34 71 L 55 50 Z;--arrow-up-path-data: M 13 61 L 46 28 C 46 28 48 26 50 26 C 52 26 54 28 54 28 L 87 61 C 87 61 92 67 87 72 C 82 76 77 71 77 71 L 50 46 L 23 71 C 23 71 18 77 13 72 C 8 67 13 61 13 61 Z;--arrow-down-path-data: M 13 38.99 L 46 71.99 C 46 71.99 48 73.99 50 73.99 C 52 73.99 54 71.99 54 71.99 L 87 38.99 C 87 38.99 92 32.99 87 27.99 C 82 23.99 77 28.99 77 28.99 L 50 53.99 L 23 28.99 C 23 28.99 18 22.99 13 27.99 C 8 32.99 13 38.99 13 38.99 Z;--double-arrow-left-path-data: M 80.98 29 C 83.98 26 84.98 21 82.98 19 C 79.98 17 75.98 17 72.98 20 L 48.98 44 C 48.98 44 47.98 45 47.98 45 C 47.98 45 46.98 46 46.98 46 C 45.98 47 45.98 48 45.98 50 C 45.98 52 45.98 53 46.98 54 C 46.98 54 47.98 55 47.98 55 C 47.98 55 48.98 56 48.98 56 L 72.98 80 C 75.98 83 79.98 83 82.98 81 C 84.98 79 83.98 74 80.98 71 L 59.98 50 L 80.98 29 Z M 50.98 29 C 53.98 26 54.98 21 52.98 19 C 49.98 17 45.98 17 42.98 20 L 18.98 44 C 18.98 44 17.98 45 17.98 45 C 17.98 45 16.98 46 16.98 46 C 15.98 47 15.98 48 15.98 50 C 15.98 52 15.98 53 16.98 54 C 16.98 54 17.98 55 17.98 55 C 17.98 55 18.98 56 18.98 56 L 42.98 80 C 45.98 83 49.98 83 52.98 81 C 54.98 79 53.98 74 50.98 71 L 29.98 50 L 50.98 29 Z;--double-arrow-right-path-data: M 19.02 29 C 16.02 26 15.02 21 17.02 19 C 20.02 17 24.02 17 27.02 20 L 51.02 44 C 51.02 44 52.02 45 52.02 45 C 52.02 45 53.02 46 53.02 46 C 54.02 47 54.02 48 54.02 50 C 54.02 52 54.02 53 53.02 54 C 53.02 54 52.02 55 52.02 55 C 52.02 55 51.02 56 51.02 56 L 27.02 80 C 24.02 83 20.02 83 17.02 81 C 15.02 79 16.02 74 19.02 71 L 40.02 50 L 19.02 29 Z M 49.02 29 C 46.02 26 45.02 21 47.02 19 C 50.02 17 54.02 17 57.02 20 L 81.02 44 C 81.02 44 82.02 45 82.02 45 C 82.02 45 83.02 46 83.02 46 C 84.02 47 84.02 48 84.02 50 C 84.02 52 84.02 53 83.02 54 C 83.02 54 82.02 55 82.02 55 C 82.02 55 81.02 56 81.02 56 L 57.02 80 C 54.02 83 50.02 83 47.02 81 C 45.02 79 46.02 74 49.02 71 L 70.02 50 L 49.02 29 Z;--arrow-up-down-path-data: M 25 41 L 50 16 L 75 41 L 83 34 L 50 1 L 17 34 Z M 17 66 L 50 100 L 83 66 L 75 59 L 50 84 L 25 59 Z;--checkmark-path-data: M 38 74 L 22 55 C 20 52 20 48 22 46 C 25 44 28 44 31 47 L 44 63 L 68 26 C 71 23 75 21 78 23 C 80 25 81 29 78 33 L 51 74 C 50 76 46 78 45 78 C 44 78 42 78 41 77 C 40 76 39 75 38 74 Z;--mixed-checkmark-path-data: M 87 42.6 L 13 42.6 L 13 57.4 L 87 57.4 L 87 42.6 Z;--clear-path-data: M 25 16 L 50 41 L 75 16 L 84 25 L 59 50 L 84 75 L 75 84 L 50 59 L 25 84 L 16 75 L 41 50 L 16 25 Z;--minimize-path-data: M 22 43 L 78 43 C 82 43 85 45 85 48 L 85 52 C 85 55 82 57 78 57 L 22 57 C 18 57 15 55 15 52 L 15 48 C 15 45 18 43 22 43 Z;--maximize-path-data: M 57 23 C 61 23 61 25 57 29 L 29 59 C 25 63 23 63 23 59 L 23 29 C 23 25 25 23 29 23 L 57 23 Z M 40 76 C 36 76 36 74 40 70 L 68 41 C 72 37 75 37 75 41 L 75 70 C 75 74 72 76 68 76 L 40 76 Z;--restore-path-data: M 14 50 C 10 50 10 48 14 44 L 42 14 C 46 10 48 10 48 14 L 48 44 C 48 48 46 50 42 50 L 14 50 Z M 84 50 C 88 50 88 52 84 56 L 56 85 C 52 89 49 89 49 85 L 49 56 C 49 52 52 50 56 50 L 84 50 Z;}h1, h2, h3, h4, h5, h6{color:color(srgb 0 0 0)}a{color:var(--accent-color);text-decoration:underline;font-weight:500}a:hover{text-decoration:none}a:focus{outline-width:3px;outline-style:solid;outline-color:var(--light-accent-color)}pre, code, var{background-color:color(srgb 0 0 0 / 0.02);outline-width:1px;outline-style:solid;outline-color:var(--border-color);font-family:ui-monospace, "Noto Sans Mono", "Menlo", "Consolas", monospace}pre{border-radius:7px}code, var{border-radius:4px}blockquote{border-color:color(srgb 0.97 0.39 0.4)}mark, ::highlight(mark){color:inherit;background-color:color(srgb 1 0.96 0.61)}hr{background-color:var(--border-color)}table{border-radius:7px;border-style:hidden;box-shadow:0 0 0 1px var(--border-color)}th, td{border-width:1px;border-style:solid;border-color:var(--border-color)}::selection{color:var(--selection-color);background-color:var(--selection-background-color)}::-webkit-scrollbar{background-color:transparent}::-webkit-scrollbar-thumb{background-color:color(srgb 0 0 0 / 0.23);border-radius:25px}::-webkit-scrollbar-thumb:hover{background-color:color(srgb 0 0 0 / 0.5)}@supports not selector(::-webkit-scrollbar){*{scrollbar-color:color(srgb 0 0 0 / 0.23) transparent}}x-avatar{color:color(srgb 1 1 1);background-color:color(srgb 0.67 0.67 0.67);border-width:0px;border-radius:999px}x-avatar > x-label{font-weight:600}x-card{background-color:var(--foreground-color);border-width:1px;border-style:solid;border-color:var(--border-color);border-radius:7px}x-card > footer{background-color:var(--background-color);border-top-width:1px;border-top-style:solid;border-top-color:var(--border-color)}x-accordion::part(arrow){color:color(srgb 0 0 0 / 0.48);--path-data: var(--arrow-right-path-data);}x-accordion::part(arrow):focus{outline-width:3px;outline-style:solid;outline-color:var(--light-accent-color);outline-offset:-2px}x-accordion > header > x-label{font-weight:500}x-tooltip{color:var(--text-color);background-color:color(srgb 0.93 0.93 0.93);border-color:var(--border-color);border-radius:4px;box-shadow:0px 4px 10px color(srgb 0 0 0 / 0.1)}x-stepper{width:14px;height:100%;min-width:14px;color:var(--text-color);background-color:color(srgb 1 1 1);box-shadow:0 0 0 1px var(--border-color)}x-stepper::part(increment-button){border-bottom-width:0.5px;border-bottom-style:solid;border-bottom-color:var(--border-color)}x-stepper::part(decrement-button){border-top-width:0.5px;border-top-style:solid;border-top-color:var(--border-color)}x-stepper[pressed="increment"]::part(increment-button), x-stepper[pressed="decrement"]::part(decrement-button){color:var(--text-color);background-color:color(srgb 0 0 0 / 0.1)}x-stepper::part(increment-arrow), x-stepper::part(decrement-arrow){width:10px;height:10px}x-stepper::part(increment-arrow){--path-data: var(--arrow-up-path-data);}x-stepper::part(decrement-arrow){--path-data: var(--arrow-down-path-data);}x-swatch{border-color:color(srgb 0.8 0.8 0.8);border-radius:99px}x-button:focus{box-shadow:0 0 0px 3px var(--light-accent-color)}x-button[disabled]{opacity:0.4}x-button[skin="normal"]{color:var(--text-color);background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color);border-radius:4px}x-button[skin="normal"][expanded]{background-color:color(srgb 0 0 0 / 0.05)}x-button[skin="normal"][toggled]{color:color(srgb 1 1 1);background-image:linear-gradient(to bottom, var(--light-accent-color), var(--accent-color));border-color:var(--darker-accent-color)}x-button[skin="normal"][pressed]{color:color(srgb 1 1 1);background-color:var(--dark-accent-color);border-color:var(--darkest-accent-color)}x-buttons:not([vertical]) > x-button[skin="normal"]:not(:first-of-type){border-top-left-radius:0;border-bottom-left-radius:0}x-buttons:not([vertical]) > x-button[skin="normal"]:not(:last-of-type){border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}x-buttons:not([vertical]) > x-button[skin="normal"][toggled] + x-button[skin="normal"]{border-left-color:var(--darker-accent-color)}x-buttons:not([vertical]) > x-button[skin="normal"][pressed] + x-button[skin="normal"],x-buttons:not([vertical]) > x-button[skin="normal"][toggled] + x-button[skin="normal"][pressed]{border-left-color:var(--darkest-accent-color)}x-buttons[vertical] > x-button[skin="normal"]:not(:first-of-type){border-top-left-radius:0;border-top-right-radius:0}x-buttons[vertical] > x-button[skin="normal"]:not(:last-of-type){border-bottom-width:0;border-bottom-left-radius:0;border-bottom-right-radius:0}x-buttons[vertical] > x-button[skin="normal"][toggled] + x-button[skin="normal"]{border-top-color:var(--darker-accent-color)}x-buttons[vertical] > x-button[skin="normal"][pressed] + x-button[skin="normal"],x-buttons[vertical] > x-button[skin="normal"][toggled] + x-button[skin="normal"][pressed]{border-top-color:var(--darkest-accent-color)}x-button[skin="flat"]{color:color(srgb 0 0 0 / 0.65)}x-button[skin="flat"][toggled],x-button[skin="flat"][expanded]{color:var(--dark-accent-color)}x-button[skin="flat"][pressed]{color:var(--darker-accent-color)}x-button[skin="recessed"]{color:var(--text-color);border-radius:4px}x-button[skin="recessed"][disabled]{opacity:0.3}x-button[skin="recessed"]:hover{background-color:color(srgb 0 0 0 / 0.07)}x-button[skin="recessed"][toggled]{color:color(srgb 1 1 1 / 0.95);background-color:color(srgb 0 0 0 / 0.42)}x-button[skin="recessed"][pressed]{color:color(srgb 1 1 1 / 0.95);background-color:color(srgb 0 0 0 / 0.6)}x-button[skin="recessed"] > x-label{font-size:0.75rem;font-weight:500;text-align:center}x-button[skin="dock"]{color:var(--text-color);background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color)}x-button[skin="dock"][toggled]{color:color(srgb 1 1 1);background-color:var(--accent-color);border-color:var(--darkest-accent-color);z-index:1}x-button[skin="dock"][pressed]{color:color(srgb 1 1 1);background-color:var(--dark-accent-color);border-color:var(--darkest-accent-color);z-index:2}x-tag{background-color:var(--background-color);border-color:var(--border-color);border-radius:4px}x-tag:active{filter:brightness(0.97)}x-tag:focus{border-color:var(--accent-color);box-shadow:0 0 0px 1px var(--light-accent-color)}x-tag[scoped]::part(main){background-color:var(--background-color)}x-tag[toggled]{color:color(srgb 0 0 0 / 0.8);filter:brightness(0.8)}x-tag[toggled]:active{filter:brightness(0.7)}x-tag::part(remove-button){--path-data: var(--clear-path-data);}x-tag::part(scope){background-color:var(--foreground-color);border-color:var(--border-color)}x-tagsinput{background-color:color(srgb 1 1 1);border-color:var(--border-color);border-width:1px;border-style:solid}x-tagsinput:focus{border-color:var(--accent-color);box-shadow:0 0 0px 3px var(--lighter-accent-color);outline-width:0}x-tagsinput[error]{border-color:var(--error-color);box-shadow:0 0 0px 3px color(srgb 1 0 0 / 0.49);--selection-background-color: oklch(from var(--error-color) l c h / 0.3);}x-tagsinput > x-label{color:color(srgb 0 0 0 / 0.4)}x-tabs{background-color:color(srgb 0.88 0.88 0.88);border-width:1px;border-style:solid;border-color:color(srgb 0 0 0 / 0.06);border-radius:10px}x-tab{border-width:1px;border-style:solid;border-color:transparent;border-radius:9px}x-tab:focus{box-shadow:0 0 0px 3px var(--light-accent-color)}x-tab[toggled]{background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color)}x-tab:active{background-color:color(srgb 0.96 0.96 0.96);border-color:color(srgb 0 0 0 / 0.1)}x-navitem:focus{outline-width:0}x-navitem::part(button){color:var(--text-color);border-radius:7px}x-navitem[toggled]::part(button){background-color:color(srgb 0 0 0 / 0.08)}x-navitem[pressed]::part(button){background-color:color(srgb 0 0 0 / 0.2)}x-navitem:focus::part(button){box-shadow:0 0 0px 3px var(--light-accent-color)}x-navitem::part(arrow){color:var(--accent-color);transform:scale(1.2);--path-data: var(--arrow-right-path-data);}x-nav x-icon:first-child{opacity:0.9}x-nav x-label + x-icon{color:var(--accent-color)}x-menu{padding:3px;color:var(--text-color);background-color:color(srgb 0.93 0.93 0.93);border-width:1px;border-style:solid;border-color:color(srgb 0.8 0.8 0.8);border-radius:7px;box-shadow:0px 4px 22px color(srgb 0 0 0 / 0.3);--close-transition: 200 opacity cubic-bezier(0.4, 0, 0.2, 1);}x-menu hr{width:calc(100% - 24px);margin:4px 0px 4px 12px}x-menuitem{color:var(--text-color);border-radius:5px}x-menuitem:focus, x-menuitem[expanded]{background-color:var(--darker-accent-color);color:color(srgb 1 1 1)}x-menuitem::part(checkmark){--path-data: var(--checkmark-path-data);}x-menuitem::part(arrow){--path-data: var(--arrow-right-path-data);}x-menuitem:focus > x-swatch, x-menuitem[expanded] > x-swatch{border-color:color(srgb 1 1 1 / 0.8)}x-menubar{padding:0 4px}dialog{color:inherit;background-color:var(--background-color);border-width:1px;border-style:solid;border-color:color(srgb 0.8 0.8 0.8);border-radius:7px;box-shadow:0px 4px 22px color(srgb 0 0 0 / 0.3);transition-duration:120ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);--transition-type: grow;}dialog::backdrop{background-color:color(srgb 0 0 0 / 0.3)}dialog h3{color:color(srgb 0 0 0 / 0.95)}dialog > footer{background-color:var(--background-color);border-top-width:1px;border-top-style:solid;border-top-color:var(--border-color)}x-pager{--prev-path-data: var(--arrow-left-path-data);--next-path-data: var(--arrow-right-path-data);--first-path-data: var(--double-arrow-left-path-data);--last-path-data: var(--double-arrow-right-path-data);}x-pager::part(item){color:var(--accent-color);background-color:var(--foreground-color);border-color:var(--border-color);border-radius:4px}x-pager::part(item):focus{border-color:var(--accent-color);outline-width:3px;outline-style:solid;outline-color:var(--light-accent-color)}x-pager::part(toggled-item){color:color(srgb 1 1 1);background-color:var(--accent-color);border-color:var(--dark-accent-color)}x-popover{color:var(--text-color);background-color:var(--foreground-color);border-width:1px;border-style:solid;border-color:color(srgb 0.8 0.8 0.8);border-radius:4px;box-shadow:0px 4px 22px color(srgb 0 0 0 / 0.3);--open-transition: none;}x-popover > footer{background-color:var(--background-color);border-top-width:1px;border-top-style:solid;border-top-color:var(--border-color)}x-notification{border-radius:5px}x-notification::selection{color:color(srgb 0 0 0);background-color:color(srgb 1 1 1)}x-notification a{color:var(--light-accent-color)}x-checkbox::part(indicator){background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:color(srgb 0.8 0.8 0.8);border-radius:4px;--path-data: var(--checkmark-path-data);}x-checkbox[mixed]::part(indicator){--path-data: var(--mixed-checkmark-path-data);}x-checkbox:active::part(indicator){background-color:color(srgb 0 0 0 / 0.03)}x-checkbox:focus::part(indicator){box-shadow:0 0 0px 3px var(--light-accent-color)}x-checkbox[toggled]::part(indicator){color:color(srgb 1 1 1);background-color:var(--accent-color);border-color:var(--accent-color)}x-checkbox[toggled]:active::part(indicator){background-color:var(--darkest-accent-color);border-color:var(--darkest-accent-color)}x-radio::part(indicator){background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:color(srgb 0.8 0.8 0.8)}x-radio:active::part(indicator){background-color:color(srgb 0 0 0 / 0.03)}x-radio:focus::part(indicator){box-shadow:0 0 0px 3px var(--light-accent-color)}x-radio[toggled]::part(indicator){background-color:var(--accent-color);border-color:var(--dark-accent-color)}x-radio[toggled]:active::part(indicator){background-color:var(--darkest-accent-color)}x-radio::part(indicator-dot){background-color:color(srgb 1 1 1);opacity:0}x-radio[toggled]::part(indicator-dot){transform:scale(0.4);box-shadow:1px 3px 7px color(srgb 0 0 0 / 0.4);opacity:1}x-switch::part(indicator-thumb){background-color:color(srgb 1 1 1);width:15px;height:15px}x-switch[toggled]::part(indicator-thumb){left:calc(100% - 15px)}x-switch:focus::part(indicator-thumb){box-shadow:0 0 0px 3px var(--light-accent-color)}x-switch[size="small"]::part(indicator-thumb){width:12px;height:12px}x-switch[size="small"][toggled]::part(indicator-thumb){left:calc(100% - 12px)}x-switch[size="large"]::part(indicator-thumb){width:18px;height:18px;left:1px}x-switch[size="large"][toggled]::part(indicator-thumb){left:calc(100% - 19px)}x-switch::part(indicator-track){height:100%;background-color:color(srgb 0.7 0.7 0.7);box-shadow:0 0 0 2px color(srgb 0.7 0.7 0.7)}x-switch[toggled]::part(indicator-track){background-color:var(--light-accent-color);box-shadow:0 0 0 2px var(--dark-accent-color)}x-select{color:var(--text-color);background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color);border-radius:4px}x-select[disabled]{opacity:0.4}x-select:focus{box-shadow:0 0 0px 3px var(--light-accent-color)}x-select::part(arrow){color:color(srgb 1 1 1);margin:0 5px 0 11px;--path-data: var(--arrow-up-down-path-data);}x-select::before{content:"";display:block;width:20px;height:calc(100% - 4px);position:absolute;top:2px;right:2px;background-image:linear-gradient(to bottom, var(--light-accent-color), var(--accent-color));border-width:1px;border-style:solid;border-color:var(--dark-accent-color);border-radius:4px;box-sizing:border-box}x-slider::part(groove-track){background-color:color(srgb 0.8 0.8 0.8);border-radius:5px}x-slider::part(range-track){background-color:var(--accent-color);border-radius:5px}x-slider::part(thumb){background-color:color(srgb 1 1 1);border-radius:99px}x-slider[dragging="start"]::part(start-thumb), x-slider[dragging="end"]::part(end-thumb){background-color:var(--background-color)}x-slider::part(thumb):focus{border-color:var(--accent-color);box-shadow:0 0 0px 3px var(--lighter-accent-color)}x-slider::part(tick){background-color:color(srgb 0 0 0 / 0.5)}x-input{background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color)}x-input:focus{border-color:var(--accent-color);outline-width:3px;outline-style:solid;outline-color:var(--lighter-accent-color)}x-input[error]{border-color:var(--error-color);outline-width:3px;outline-style:solid;outline-color:color(srgb 1 0 0 / 0.49);--selection-background-color: oklch(from var(--error-color) l c h / 0.3);}x-input > x-icon{color:color(srgb 0.34 0.34 0.34)}x-input > x-label{color:color(srgb 0 0 0 / 0.4)}x-input > x-icon + x-label{padding-top:1px}x-numberinput{background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color)}x-numberinput:focus{border-color:var(--accent-color);outline-width:3px;outline-style:solid;outline-color:var(--lighter-accent-color)}x-numberinput:focus:has(x-stepper){padding-right:14px}x-numberinput[error]{border-color:var(--error-color);outline-width:3px;outline-style:solid;outline-color:color(srgb 1 0 0 / 0.49);--selection-background-color: oklch(from var(--error-color) l c h / 0.3);}x-numberinput > x-label{color:color(srgb 0 0 0 / 0.4)}x-numberinput:focus > x-stepper{display:none}x-texteditor{background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color)}x-texteditor:focus{border-color:var(--accent-color);outline-width:3px;outline-style:solid;outline-color:var(--lighter-accent-color)}x-texteditor[error]{border-color:var(--error-color);outline-width:3px;outline-style:solid;outline-color:color(srgb 1 0 0 / 0.49);--selection-background-color: oklch(from var(--error-color) l c h / 0.3);}x-texteditor > x-label{color:color(srgb 0 0 0 / 0.4)}x-colorinput{background-color:color(srgb 1 1 1);border-width:1px;border-style:solid;border-color:var(--border-color)}x-colorinput:focus{border-color:var(--accent-color);outline-width:3px;outline-style:solid;outline-color:var(--lighter-accent-color)}x-colorinput[error]{border-color:var(--error-color);outline-width:3px;outline-style:solid;outline-color:color(srgb 1 0 0 / 0.49);--selection-background-color: oklch(from var(--error-color) l c h / 0.3);}x-colorinput::part(arrow){color:color(srgb 1 1 1);background-image:linear-gradient(to bottom, var(--light-accent-color), var(--accent-color));border-width:1px;border-style:solid;border-color:var(--dark-accent-color);border-radius:4px;padding:5px 2px;--path-data: var(--arrow-up-down-path-data);}x-colorinput[size="small"]::part(arrow){padding:2px}x-colorinput > x-label{color:color(srgb 0 0 0 / 0.4)}x-colorpicker::part(slider){border-radius:4px}x-colorselect{border-width:1px;border-style:solid;border-color:color(srgb 0.8 0.8 0.8);border-radius:999px}x-progressbar{background-color:color(srgb 0.93 0.93 0.93);border-radius:5px;box-shadow:0px 0px 0px 1px inset var(--border-color)}x-progressbar::part(bar){background-color:var(--light-accent-color)}x-throbber{color:var(--light-accent-color)}x-titlebar::part(buttons){left:10px;gap:8px}x-titlebar::part(button){width:12px;height:12px;min-width:12px;min-height:12px;border:1px solid transparent;border-radius:999px}x-titlebar::part(button):active{filter:brightness(0.8)}x-titlebar::part(minimize-button){background-color:color(srgb 1 0.74 0.18);border-color:color(srgb 0.89 0.62 0.11);--path-data: var(--minimize-path-data);}x-titlebar::part(maximize-button){background-color:color(srgb 0.15 0.8 0.25);border-color:color(srgb 0.12 0.67 0.15);--path-data: var(--maximize-path-data);}x-titlebar::part(restore-button){background-color:color(srgb 0.15 0.8 0.25);border-color:color(srgb 0.12 0.67 0.15);--path-data: var(--restore-path-data);}x-titlebar::part(close-button){background-color:color(srgb 1 0.37 0.34);border-color:color(srgb 0.9 0.33 0.29);order:-1;--path-data: var(--clear-path-data);}x-titlebar::part(icon){fill:color(srgb 0 0 0);opacity:0}x-titlebar:hover::part(icon){opacity:0.5}x-titlebar x-label{font-weight:700}