kempo 2.3.0 → 2.5.0

package/dist/components/Accordion.js

@@ -0,0 +1 @@
+import Component from"./Component.js";import{onEvent,offEvent,dispatchEvent}from"../utils/element.js";import raf from"../utils/raf.js";export default class Accordion extends Component{constructor(){super(),this.unrender=!0}get activeHeader(){return this.querySelector('k-accordion-header[active="true"]')}get activePanel(){return this.querySelector('k-accordion-panel[active="true"]')}getHeader(e){return this.querySelector(`k-accordion-header[for-panel="${e}"]`)}getPanel(e){return this.querySelector(`k-accordion-panel[name="${e}"]`)}openPanel(e){const t=this.querySelector('k-accordion-panel[active="true"]');if(t&&t.name!==e){t.active=!1;const e=this.getHeader(t.name);e&&(e.active=!1)}const n=this.getPanel(e);if(n){n.active=!0,n.transitioning=!0,setTimeout((()=>{n.transitioning=!1}),parseInt(getComputedStyle(this).getPropertyValue("--animation_ms")||256));const t=this.getHeader(e);t&&(t.active=!0),dispatchEvent(this,"openpanel",{panelName:e})}}closePanel(e){const t=this.getPanel(e);if(t){t.active=!1,t.transitioning=!0,setTimeout((()=>{t.transitioning=!1}),parseInt(getComputedStyle(this).getPropertyValue("--animation_ms")||256));const n=this.getHeader(e);n&&(n.active=!1),dispatchEvent(this,"closepanel",{panelName:e})}}togglePanel(e){const t=this.getPanel(e);t&&(t.active?this.closePanel(e):this.openPanel(e),dispatchEvent(this,"togglepanel",{panelName:e}))}get shadowStyles(){return'\n      :host {\n        display: block;\n        border: 1px solid var(--c_border);\n        border-radius: var(--radius);\n      }\n      ::slotted(k-accordion-header){\n        border-top: 1px solid var(--c_border);\n      }\n      ::slotted(k-accordion-header[active="true"]) {\n        border-bottom: 1px solid var(--c_border);\n      }\n      ::slotted(k-accordion-header:first-of-type) {\n        border-top: 0;\n      }\n      ::slotted(k-accordion-header:last-of-type:not([active="true"])) {\n        border-bottom: 0;\n      }\n    '}}window.customElements.define("k-accordion",Accordion);const clickHandler=Symbol();export class AccordionHeader extends Component{constructor(e="Show More",t=""){super(),this[clickHandler]=()=>{this.accordion.togglePanel(this.forPanel)},this.registerAttributes({forPanel:t,active:!1})}async render(e){return!!await super.render(e)&&(onEvent(this,"click",this[clickHandler]),!0)}disconnectedCallback(){super.disconnectedCallback(),offEvent(this,"click",this[clickHandler])}get accordion(){return this.closest("k-accordion")}get shadowStyles(){return"\n      :host {\n        display: block;\n        padding: 1rem;\n        cursor: pointer;\n      }\n    "}}window.customElements.define("k-accordion-header",AccordionHeader);export class AccordionPanel extends Component{constructor(e=""){super(),this.registerAttributes({name:e,active:!1,transitioning:!1})}get accordion(){return this.closest("k-accordion")}get shadowStyles(){return`\n      ${super.shadowStyles}\n      :host {\n        display: block;\n        interpolate-size: allow-keywords;\n        height: 0;\n        overflow: hidden;\n        transition: height var(--animation_ms) ease-in-out;\n      }\n      :host([active="true"]) {\n        height: max-content;\n      }\n    `}}window.customElements.define("k-accordion-panel",AccordionPanel);

package/dist/components/LazyComponent.js

@@ -1 +1 @@
-import Component from"./Component.js";import{isInView}from"../utils/element.js";export default class LazyComponent extends Component{constructor(e){super(e),new IntersectionObserver((([e])=>{e.intersectionRatio>0&&!this.rendered?this.inViewCallback():this.outOfViewCallback()})).observe(this),this.registerAttribute("unrender",!1)}async connectedCallback(){await this.renderSkelton(),await isInView(this)&&await this.inViewCallback()}async inViewCallback(){await this.render()}async outOfViewCallback(){this.unrender&&await this.renderSkelton()}async renderSkelton(){this.shadowRoot.innerHTML=`<link rel="stylesheet" href="${Component.pathToKempo}/kempo-styles.css" />${this.skeletonTemplate}<style>${this.shadowStyles}</style>`,this.rendered=!1}get skeletonTemplate(){return'<div style="height: var(--skeleton_height, 1rem)"></div>'}}
+import Component from"./Component.js";import{isInView}from"../utils/element.js";import raf from"../utils/raf.js";export default class LazyComponent extends Component{constructor(e){super(e),new IntersectionObserver((([e])=>{e.intersectionRatio>0&&!this.rendered?this.inViewCallback():this.outOfViewCallback()})).observe(this),this.registerAttribute("unrender",!1)}async connectedCallback(){await this.renderSkelton(),raf((async()=>{await isInView(this)&&await this.inViewCallback()}),2)}async inViewCallback(){return await this.render()}async outOfViewCallback(){return!!this.unrender&&(await this.renderSkelton(),!0)}async renderSkelton(){return this.shadowRoot.innerHTML=`<link rel="stylesheet" href="${Component.pathToKempo}/kempo-styles.css" />${this.skeletonTemplate}<style>${this.shadowStyles}</style>`,this.rendered=!1,!0}get skeletonTemplate(){return'<div style="height: var(--skeleton_height, 1rem)"></div>'}}

package/dist/components/Stack.js

@@ -0,0 +1 @@
+import Component from"./components/Component.js";export default class Stack extends Component{constructor(){super()}}window.customElements.define("k-stack",Stack);export class StackPanel extends Component{get shadowStyles(){return"\n      :host {\n        display: block;\n      }\n    "}}window.customElements.define("k-stack-panel",StackPanel);

package/dist/components/Stacks.js

@@ -0,0 +1 @@
+import Component from"./Component.js";export default class Stacks extends Component{get panels(){return[...this.querySelectorAll("k-stack-panel")]}reorderPanels(){this.panels.reverse().forEach(((t,e)=>t.style.setProperty("--order",e)))}get shadowStyles(){return"\n      :host {\n        --stack_width: 16rem;\n        display: block;\n        height: 100%;\n        position: relative;\n      }\n    "}}window.customElements.define("k-stacks",Stacks);export class StackPanel extends Component{constructor(){super(),this.registerAttribute("stack",0)}connectedCallback(){super.connectedCallback();const t=this.stacks;t&&t.reorderPanels()}attributeChangedCallback(t,e,s){super.attributeChangedCallback(t,e,s),"stack"===t&&e!==s&&this.style.setProperty("--stack",s)}get stacks(){return this.closest("k-stacks")}get shadowStyles(){return"\n      :host {\n        --stack: 0;\n        display: block;\n        height: 100%;\n        width: var(--stack_width);\n        position: absolute;\n        top: 0;\n        left: calc(var(--stack) * var(--stack_width));\n        transition: left var(--animation_ms) ease-in-out;\n        z-index: var(--order);\n      }\n    "}static observedAttributes=[...super.observedAttributes,"stack"]}window.customElements.define("k-stack-panel",StackPanel);

package/dist/index.js

@@ -1 +1 @@
-import Card from"./components/Card.js";import Component from"./components/Component.js";import ContentSlider from"./components/ContentSlider.js";import Dialog from"./components/Dialog.js";import DirectoryViewer from"./components/DirectoryViewer.js";import FocusCapture from"./components/FocusCapture.js";import Icon from"./components/Icon.js";import Import from"./components/Import.js";import LazyComponent from"./components/LazyComponent.js";import ReactiveComponent from"./components/ReactiveComponent.js";import ReactiveLazyComponent from"./components/ReactiveLazyComponent.js";import Resize from"./components/Resize.js";import Search from"./components/Search.js";import ShowMore from"./components/ShowMore.js";import SideMenu from"./components/SideMenu.js";import Split from"./components/Split.js";import Table from"./components/Table.js";import Tabs from"./components/Tabs.js";import Tags from"./components/Tags.js";import ThemeSwitcher from"./components/ThemeSwitcher.js";import Timestamp from"./components/Timestamp.js";import Toggle from"./components/Toggle.js";import cli from"./utils/cli.js";import cookie from"./utils/cookie.js";import debounce from"./utils/debounce.js";import drag from"./utils/drag.js";import element from"./utils/element.js";import files from"./utils/files.js";import formatTimestamp from"./utils/formatTimestamp.js";import fuzzyMatch from"./utils/fuzzyMatch.js";import getPreferredTheme from"./utils/getPreferredTheme.js";import loadCss from"./utils/loadCss.js";import loadScript from"./utils/loadScript.js";import object from"./utils/object.js";import string from"./utils/string.js";import toFunction from"./utils/toFunction.js";import type from"./utils/type.js";import waitFrames from"./utils/waitFrames.js";import watchDirectoryHandle from"./utils/watchDirectoryHandle.js";export default{Card:Card,Component:Component,ContentSlider:ContentSlider,Dialog:Dialog,DirectoryViewer:DirectoryViewer,FocusCapture:FocusCapture,Icon:Icon,Import:Import,LazyComponent:LazyComponent,ReactiveComponent:ReactiveComponent,ReactiveLazyComponent:ReactiveLazyComponent,Resize:Resize,Search:Search,ShowMore:ShowMore,SideMenu:SideMenu,Split:Split,Table:Table,Tabs:Tabs,Tags:Tags,ThemeSwitcher:ThemeSwitcher,Timestamp:Timestamp,Toggle:Toggle,cli:cli,cookie:cookie,debounce:debounce,drag:drag,element:element,files:files,formatTimestamp:formatTimestamp,fuzzyMatch:fuzzyMatch,getPreferredTheme:getPreferredTheme,loadCss:loadCss,loadScript:loadScript,object:object,string:string,toFunction:toFunction,type:type,waitFrames:waitFrames,watchDirectoryHandle:watchDirectoryHandle};
+import Accordion from"./components/Accordion.js";import Card from"./components/Card.js";import Component from"./components/Component.js";import ContentSlider from"./components/ContentSlider.js";import Dialog from"./components/Dialog.js";import DirectoryViewer from"./components/DirectoryViewer.js";import FocusCapture from"./components/FocusCapture.js";import Icon from"./components/Icon.js";import Import from"./components/Import.js";import LazyComponent from"./components/LazyComponent.js";import ReactiveComponent from"./components/ReactiveComponent.js";import ReactiveLazyComponent from"./components/ReactiveLazyComponent.js";import Resize from"./components/Resize.js";import Search from"./components/Search.js";import ShowMore from"./components/ShowMore.js";import SideMenu from"./components/SideMenu.js";import Split from"./components/Split.js";import Stacks from"./components/Stacks.js";import Table from"./components/Table.js";import Tabs from"./components/Tabs.js";import Tags from"./components/Tags.js";import ThemeSwitcher from"./components/ThemeSwitcher.js";import Timestamp from"./components/Timestamp.js";import Toggle from"./components/Toggle.js";import cli from"./utils/cli.js";import cookie from"./utils/cookie.js";import debounce from"./utils/debounce.js";import drag from"./utils/drag.js";import element from"./utils/element.js";import files from"./utils/files.js";import formatTimestamp from"./utils/formatTimestamp.js";import fuzzyMatch from"./utils/fuzzyMatch.js";import getPreferredTheme from"./utils/getPreferredTheme.js";import loadCss from"./utils/loadCss.js";import loadScript from"./utils/loadScript.js";import object from"./utils/object.js";import raf from"./utils/raf.js";import string from"./utils/string.js";import toFunction from"./utils/toFunction.js";import type from"./utils/type.js";import waitFrames from"./utils/waitFrames.js";import watchDirectoryHandle from"./utils/watchDirectoryHandle.js";export default{Accordion:Accordion,Card:Card,Component:Component,ContentSlider:ContentSlider,Dialog:Dialog,DirectoryViewer:DirectoryViewer,FocusCapture:FocusCapture,Icon:Icon,Import:Import,LazyComponent:LazyComponent,ReactiveComponent:ReactiveComponent,ReactiveLazyComponent:ReactiveLazyComponent,Resize:Resize,Search:Search,ShowMore:ShowMore,SideMenu:SideMenu,Split:Split,Stacks:Stacks,Table:Table,Tabs:Tabs,Tags:Tags,ThemeSwitcher:ThemeSwitcher,Timestamp:Timestamp,Toggle:Toggle,cli:cli,cookie:cookie,debounce:debounce,drag:drag,element:element,files:files,formatTimestamp:formatTimestamp,fuzzyMatch:fuzzyMatch,getPreferredTheme:getPreferredTheme,loadCss:loadCss,loadScript:loadScript,object:object,raf:raf,string:string,toFunction:toFunction,type:type,waitFrames:waitFrames,watchDirectoryHandle:watchDirectoryHandle};

package/dist/kempo-styles.css

@@ -1 +1 @@
-/* Reset*/*, *::before, *::after{font-family:inherit;box-sizing:border-box;line-height:var(--line-height)}body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, dt, blockquote, pre, code{margin:0;padding:0.1px}html{font-family:var(--ff_body);font-size:var(--fs_base);font-weight:var(--fw_base);color:var(--tc)}::selection{background:var(--c_highlight)}body{min-height:100vh;background-color:var(--c_bg);color:var(--tc);overflow-y:scroll;font-family:var(--ff_body);position:relative}main, .container{max-width:var(--container_width);margin-left:auto;margin-right:auto;padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer)}nav > a,nav > .link{display:inline-block;padding:var(--spacer) !important;text-decoration:none}menu{margin:0;padding:0}menu a{display:block;padding:var(--spacer_q);text-decoration:none;color:inherit}summary{cursor:pointer;margin-bottom:var(--sapcer);outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:var(--radius)}summary:focus{box-shadow:var(--focus_shadow)}/* Display / Flex*/.d-b{display:block !important}.d-ib{display:inline-block !important}.d-g{display:grid !important}.d-i{display:inline !important}.d-n{display:none !important}.d-f{display:flex !important;flex-wrap:wrap}.d-if{display:inline-flex !important;flex-wrap:wrap}.flex, .flex-1{flex:1 1 auto}.flex-0{flex:0 0}.flex-2{flex:2 2 auto}.flex-3{flex:3 3 auto}.flex-4{flex:4 4 auto}.flex-5{flex:5 5 auto}.flex-6{flex:6 6 auto}.flex-7{flex:7 7 auto}.flex-8{flex:8 8 auto}.flex-9{flex:9 9 auto}.flex-10{flex:10 10 auto}@media (min-width:1024px){.d-d-b{display:block !important}.d-d-ib{display:inline-block !important}.d-d-g{display:grid !important}.d-d-i{display:inline !important}.d-d-n{display:none !important}.d-d-if{display:inline-flex !important;flex-wrap:wrap}.d-d-f{display:flex !important;flex-wrap:wrap}.d-flex, .d-flex-1{flex:1 1 auto}.d-flex-0{flex:0 0}.d-flex-2{flex:2 2 auto}.d-flex-3{flex:3 3 auto}.d-flex-4{flex:4 4 auto}.d-flex-5{flex:5 5 auto}.d-flex-6{flex:6 6 auto}.d-flex-7{flex:7 7 auto}.d-flex-8{flex:8 8 auto}.d-flex-9{flex:9 9 auto}.d-flex-10{flex:10 10 auto}}@media (min-width:769px) and (max-width:1023px){.t-d-b{display:block !important}.t-d-ib{display:inline-block !important}.t-d-g{display:grid !important}.t-d-i{display:inline !important}.t-d-n{display:none !important}.t-d-if{display:inline-flex !important;flex-wrap:wrap}.t-d-f{display:flex !important;flex-wrap:wrap}.t-flex, .t-flex-1{flex:1 1 auto}.t-flex-0{flex:0 0}.t-flex-2{flex:2 2 auto}.t-flex-3{flex:3 3 auto}.t-flex-4{flex:4 4 auto}.t-flex-5{flex:5 5 auto}.t-flex-6{flex:6 6 auto}.t-flex-7{flex:7 7 auto}.t-flex-8{flex:8 8 auto}.t-flex-9{flex:9 9 auto}.t-flex-10{flex:10 10 auto}}@media (max-width:768px){.m-d-b{display:block !important}.m-d-ib{display:inline-block !important}.m-d-g{display:grid !important}.m-d-i{display:inline !important}.m-d-n{display:none !important}.m-d-if{display:inline-flex !important;flex-wrap:wrap}.m-d-f{display:flex !important;flex-wrap:wrap}.m-flex, .m-flex-1{flex:1 1 auto}.m-flex-0{flex:0 0}.m-flex-2{flex:2 2 auto}.m-flex-3{flex:3 3 auto}.m-flex-4{flex:4 4 auto}.m-flex-5{flex:5 5 auto}.m-flex-6{flex:6 6 auto}.m-flex-7{flex:7 7 auto}.m-flex-8{flex:8 8 auto}.m-flex-9{flex:9 9 auto}.m-flex-10{flex:10 10 auto}}.fixed{position:fixed;top:0;width:100%;z-index:99}/* Typography*/.small,small{font-size:var(--fs_small) !important}.large{font-size:var(--fs_large) !important}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6,b, strong{font-weight:var(--fw_bold)}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6{font-family:var(--ff_heading)}.h1, h1{font-size:var(--fs_h1)}.h2, h2{font-size:var(--fs_h2)}.h3, h3{font-size:var(--fs_h3)}.h4, h4{font-size:var(--fs_h4)}.h5, h5{font-size:var(--fs_h5)}.h6, h6{font-size:var(--fs_h6)}p, h1, h2, h3, h4, h5, h6, blockquote, ul, ol, dl, pre, hr, dd{margin-bottom:var(--spacer)}ul, ol, dl{padding-left:calc(1.5 * var(--spacer))}blockquote{border-left:2px solid var(--c_border);padding:var(--spacer)}mark{background-color:var(--c_highlight);color:inherit}.ff-mono, pre, code{font-family:var(--ff_mono)}code{background-color:var(--c_bg__alt);border-radius:var(--radius);word-break:break-word;padding:calc(0.125 * var(--spacer)) var(--spacer_q)}pre code{display:block;padding:var(--spacer);word-break:normal;overflow:auto;white-space:pre-wrap}output{display:block;border:1px solid var(--c_border);border-radius:var(--radius);padding:var(--spacer) var(--spacer) 0 var(--spacer)}.ta-left{text-align:left}.ta-center{text-align:center}.ta-right{text-align:right}a,.link{color:var(--tc_link);box-shadow:0 0 0 transparent;transition:color var(--animation_ms), box-shadow var(--animation_ms);outline:none;border-radius:var(--radius);text-decoration:var(--link_decoration)}a:hover,.link:hover{color:var(--tc_link__hover)}a:focus,.link:focus-visible{box-shadow:var(--focus_shadow)}.no-link,.no-link:hover{text-decoration:none;color:inherit}hr{border:none;border-top:1px solid var(--c_border)}small{font-size:0.75em}dl{padding:0;margin:0}dt, dd{padding-left:var(--spacer);border-left:2px solid var(--c_border)}dt{padding-top:var(--spacer_h)}dd{padding-bottom:var(--spacer_h)}dd + dd{margin-top:calc(-1 * var(--spacer));padding-top:0}li ul{margin-bottom:0}.td-n{text-decoration:none}/* Spacing, Borders and Radius*/.p, .pt, .py{padding-top:var(--spacer) !important}.p, .pr, .px{padding-right:var(--spacer) !important}.p, .pb, .py{padding-bottom:var(--spacer) !important}.p, .pl, .px{padding-left:var(--spacer) !important}.ph, .pth, .pyh{padding-top:var(--spacer_h) !important}.ph, .prh, .pxh{padding-right:var(--spacer_h) !important}.ph, .pbh, .pyh{padding-bottom:var(--spacer_h) !important}.ph, .plh, .pxh{padding-left:var(--spacer_h) !important}.pq, .ptq, .pyq{padding-top:var(--spacer_q) !important}.pq, .prq, .pxq{padding-right:var(--spacer_q) !important}.pq, .pbq, .pyq{padding-bottom:var(--spacer_q) !important}.pq, .plq, .pxq{padding-left:var(--spacer_q) !important}.p0, .pt0, .py0{padding-top:0.1px !important}.p0, .pr0, .px0{padding-right:0.1px !important}.p0, .pb0, .py0{padding-bottom:0.1px !important}.p0, .pl0, .px0{padding-left:0.1px !important}.m, .mt, .my{margin-top:var(--spacer) !important}.m, .mr, .mx{margin-right:var(--spacer) !important}.m, .mb, .my{margin-bottom:var(--spacer) !important}.m, .ml, .mx{margin-left:var(--spacer) !important}.mh, .mth, .myh{margin-top:var(--spacer_h) !important}.mh, .mrh, .mxh{margin-right:var(--spacer_h) !important}.mh, .mbh, .myh{margin-bottom:var(--spacer_h) !important}.mh, .mlh, .mxh{margin-left:var(--spacer_h) !important}.mq, .mtq, .myq{margin-top:var(--spacer_q) !important}.mq, .mrq, .mxq{margin-right:var(--spacer_q) !important}.mq, .mbq, .myq{margin-bottom:var(--spacer_q) !important}.mq, .mlq, .mxq{margin-left:var(--spacer_q) !important}.m0, .mt0, .my0{margin-top:0 !important}.m0, .mr0, .mx0{margin-right:0 !important}.m0, .mb0, .my0{margin-bottom:0 !important}.m0, .ml0, .mx0{margin-left:0 !important}.-m, .-mt, .-my{margin-top:calc(-1 * var(--spacer)) !important}.-m, .-mr, .-mx{margin-right:calc(-1 * var(--spacer)) !important}.-m, .-mb, .-my{margin-bottom:calc(-1 * var(--spacer)) !important}.-m, .-ml, .-mx{margin-left:calc(-1 * var(--spacer)) !important}.b, .bt, .by{border-top:1px solid var(--c_border) !important}.b, .br, .bx{border-right:1px solid var(--c_border) !important}.b, .bb, .by{border-bottom:1px solid var(--c_border) !important}.b, .bl, .bx{border-left:1px solid var(--c_border) !important}.b0, .bt0, .by0{border-top:none !important}.b0, .br0, .bx0{border-right:none !important}.b0, .bb0, .by0{border-bottom:none !important}.b0, .bl0, .bx0{border-left:none !important}.r, .rtl, .rt, .rl{border-top-left-radius:var(--radius) !important}.r, .rtr, .rt, .rr{border-top-right-radius:var(--radius) !important}.r, .rbr, .rb, .rr{border-bottom-right-radius:var(--radius) !important}.r, .rbl, .rb, .rl{border-bottom-left-radius:var(--radius) !important}.r0, .rtl0, .rt0, .rl0{border-top-left-radius:0 !important}.r0, .rtr0, .rt0, .rr0{border-top-right-radius:0 !important}.r0, .rbr0, .rb0, .rr0{border-bottom-right-radius:0 !important}.r0, .rbl0, .rb0, .rl0{border-bottom-left-radius:0 !important}.round{border-radius:9999rem !important}/* Rows and Columns*/.row{display:flex;flex-wrap:wrap}.col{flex:1 1}.span-1{min-width:8.333%;flex-basis:8.333%}.span-2{min-width:16.666%;flex-basis:16.666%}.span-3{min-width:25%;flex-basis:25%}.span-4{min-width:33.333%;flex-basis:33.333%}.span-5{min-width:41.666%;flex-basis:41.666%}.span-6{min-width:50%;flex-basis:50%}.span-7{min-width:58.333%;flex-basis:58.333%}.span-8{min-width:66.666%;flex-basis:66.666%}.span-9{min-width:75%;flex-basis:75%}.span-10{min-width:83.333%;flex-basis:83.333%}.span-11{min-width:91.333%;flex-basis:91.333%}.span-12{min-width:100%;flex-basis:100%}@media (min-width:1024px){.d-span-1{min-width:8.333%;flex-basis:8.333%}.d-span-2{min-width:16.666%;flex-basis:16.666%}.d-span-3{min-width:25%;flex-basis:25%}.d-span-4{min-width:33.333%;flex-basis:33.333%}.d-span-5{min-width:41.666%;flex-basis:41.666%}.d-span-6{min-width:50%;flex-basis:50%}.d-span-7{min-width:58.333%;flex-basis:58.333%}.d-span-8{min-width:66.666%;flex-basis:66.666%}.d-span-9{min-width:75%;flex-basis:75%}.d-span-10{min-width:83.333%;flex-basis:83.333%}.d-span-11{min-width:91.333%;flex-basis:91.333%}.d-span-12{min-width:100%;flex-basis:100%}}@media (min-width:769px) and (max-width:1023px){.t-span-1{min-width:8.333%;flex-basis:8.333%}.t-span-2{min-width:16.666%;flex-basis:16.666%}.t-span-3{min-width:25%;flex-basis:25%}.t-span-4{min-width:33.333%;flex-basis:33.333%}.t-span-5{min-width:41.666%;flex-basis:41.666%}.t-span-6{min-width:50%;flex-basis:50%}.t-span-7{min-width:58.333%;flex-basis:58.333%}.t-span-8{min-width:66.666%;flex-basis:66.666%}.t-span-9{min-width:75%;flex-basis:75%}.t-span-10{min-width:83.333%;flex-basis:83.333%}.t-span-11{min-width:91.333%;flex-basis:91.333%}.t-span-12{min-width:100%;flex-basis:100%}}@media (max-width:768px){.m-span-1{min-width:8.333%;flex-basis:8.333%}.m-span-2{min-width:16.666%;flex-basis:16.666%}.m-span-3{min-width:25%;flex-basis:25%}.m-span-4{min-width:33.333%;flex-basis:33.333%}.m-span-5{min-width:41.666%;flex-basis:41.666%}.m-span-6{min-width:50%;flex-basis:50%}.m-span-7{min-width:58.333%;flex-basis:58.333%}.m-span-8{min-width:66.666%;flex-basis:66.666%}.m-span-9{min-width:75%;flex-basis:75%}.m-span-10{min-width:83.333%;flex-basis:83.333%}.m-span-11{min-width:91.333%;flex-basis:91.333%}.m-span-12{min-width:100%;flex-basis:100%}}.cols-2{grid-template-columns:repeat(2, 1fr)}.cols-3{grid-template-columns:repeat(3, 1fr)}.cols-4{grid-template-columns:repeat(4, 1fr)}.cols-5{grid-template-columns:repeat(5, 1fr)}.cols-6{grid-template-columns:repeat(6, 1fr)}.cols-7{grid-template-columns:repeat(7, 1fr)}.cols-8{grid-template-columns:repeat(8, 1fr)}.cols-9{grid-template-columns:repeat(9, 1fr)}.cols-10{grid-template-columns:repeat(10, 1fr)}@media (min-width:1024px){.d-cols-2{grid-template-columns:repeat(2, 1fr)}.d-cols-3{grid-template-columns:repeat(3, 1fr)}.d-cols-4{grid-template-columns:repeat(4, 1fr)}.d-cols-5{grid-template-columns:repeat(5, 1fr)}.d-cols-6{grid-template-columns:repeat(6, 1fr)}.d-cols-7{grid-template-columns:repeat(7, 1fr)}.d-cols-8{grid-template-columns:repeat(8, 1fr)}.d-cols-9{grid-template-columns:repeat(9, 1fr)}.d-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (min-width:769px) and (max-width:1023px){.t-cols-2{grid-template-columns:repeat(2, 1fr)}.t-cols-3{grid-template-columns:repeat(3, 1fr)}.t-cols-4{grid-template-columns:repeat(4, 1fr)}.t-cols-5{grid-template-columns:repeat(5, 1fr)}.t-cols-6{grid-template-columns:repeat(6, 1fr)}.t-cols-7{grid-template-columns:repeat(7, 1fr)}.t-cols-8{grid-template-columns:repeat(8, 1fr)}.t-cols-9{grid-template-columns:repeat(9, 1fr)}.t-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (max-width:768px){.m-cols-2{grid-template-columns:repeat(2, 1fr)}.m-cols-3{grid-template-columns:repeat(3, 1fr)}.m-cols-4{grid-template-columns:repeat(4, 1fr)}.m-cols-5{grid-template-columns:repeat(5, 1fr)}.m-cols-6{grid-template-columns:repeat(6, 1fr)}.m-cols-7{grid-template-columns:repeat(7, 1fr)}.m-cols-8{grid-template-columns:repeat(8, 1fr)}.m-cols-9{grid-template-columns:repeat(9, 1fr)}.m-cols-10{grid-template-columns:repeat(10, 1fr)}}/* Buttons*/button:not(.no-btn):not(.no-style),.btn,input[type="button"],input[type="submit"],input[type="reset"]{display:inline-block;padding:var(--btn_padding);background-color:var(--btn_bg);border:1px solid var(--btn_border);cursor:pointer;outline:none;border-radius:var(--radius);color:var(--btn_tc);transition:background-color var(--animation_ms), box-shadow var(--animation_ms);text-decoration:none;box-shadow:var(--btn_box_shadow);font-size:inherit;vertical-align:middle}button:not(.no-btn):not(.no-style):hover,.btn:hover,input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover{background-color:var(--btn_bg__hover);color:var(--btn_tc);box-shadow:var(--btn_box_shadow__hover)}button:not(.no-btn):not(.no-style):focus,.btn:focus,input[type="button"]:focus,input[type="submit"]:focus,input[type="reset"]:focus{box-shadow:var(--btn_box_shadow__hover), var(--focus_shadow);z-index:1}button:not(.no-btn):not(.no-style):disabled,.btn[disabled],input[type="button"]:disabled,input[type="submit"]:disabled,input[type="reset"]:disabled{opacity:0.6}button:not(.no-btn).primary,.btn.primary,input[type="button"].primary,input[type="submit"].primary,input[type="reset"].primary{background-color:var(--c_primary);--btn_tc:var(--tc_on_primary)}button:not(.no-btn).primary:hover,.btn.primary:hover,input[type="button"].primary:hover,input[type="submit"].primary:hover,input[type="reset"].primary:hover{background-color:var(--c_primary__hover)}button:not(.no-btn).secondary,.btn.secondary,input[type="button"].secondary,input[type="submit"].secondary,input[type="reset"].secondary{background-color:var(--c_secondary);--btn_tc:var(--tc_on_secondary)}button:not(.no-btn).secondary:hover,.btn.secondary:hover,input[type="button"].secondary:hover,input[type="submit"].secondary:hover,input[type="reset"].secondary:hover{background-color:var(--c_secondary__hover)}button:not(.no-btn).success,.btn.success,input[type="button"].success,input[type="submit"].success,input[type="reset"].success{background-color:var(--c_success);--btn_tc:var(--tc_on_success)}button:not(.no-btn).success:hover,.btn.success:hover,input[type="button"].success:hover,input[type="submit"].success:hover,input[type="reset"].success:hover{background-color:var(--c_success__hover)}button:not(.no-btn).warning,.btn.warning,input[type="button"].warning,input[type="submit"].warning,input[type="reset"].warning{background-color:var(--c_warning);--btn_tc:var(--tc_on_warning)}button:not(.no-btn).warning:hover,.btn.warning:hover,input[type="button"].warning:hover,input[type="submit"].warning:hover,input[type="reset"].warning:hover{background-color:var(--c_warning__hover)}button:not(.no-btn).danger,.btn.danger,input[type="button"].danger,input[type="submit"].danger,input[type="reset"].danger{background-color:var(--c_danger);--btn_tc:var(--tc_on_danger)}button:not(.no-btn).danger:hover,.btn.danger:hover,input[type="button"].danger:hover,input[type="submit"].danger:hover,input[type="reset"].danger:hover{background-color:var(--c_danger__hover)}button:not(.no-btn):not(.no-style).link,.btn.link,input[type="button"].link,input[type="submit"].link,input[type="reset"].link{background-color:transparent;color:inherit;box-shadow:0 0 0 transparent;border:none;padding:0.1px;font-size:inherit}.btn-grp{display:inline-flex}.btn-grp button:not(.no-btn):not(:first-child),.btn-grp .btn:not(:first-child),.btn-grp input[type="button"]:not(:first-child),.btn-grp input[type="submit"]:not(:first-child),.btn-grp input[type="reset"]:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;border-left:1px solid rgba(0, 0, 0, 0.25)}.btn-grp button:not(.no-btn):not(:last-child),.btn-grp .btn:not(:last-child),.btn-grp input[type="button"]:not(:last-child),.btn-grp input[type="submit"]:not(:last-child),.btn-grp input[type="reset"]:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.no-btn{display:inline;border:none;background-color:transparent;padding:0;font-size:inherit;font-family:inherit;cursor:pointer;outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:0;text-align:left;color:inherit}.no-btn:focus{box-shadow:var(--focus_shadow)}.full{display:block;width:100%}/* Inputs*/input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]),select,textarea{display:block;width:100%;background-color:var(--input_bg);color:var(--input_tc);border:var(--input_border_width) solid var(--c_border);padding:var(--input_padding);border-radius:var(--radius);outline:none;transition:box-shadow var(--animation_ms)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):focus,select:focus,textarea:focus,input[type="checkbox"]:focus,input[type="radio"]:focus{box-shadow:var(--focus_shadow)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):disabled,select:disabled,textarea:disabled,input[type="checkbox"]:disabled,input[type="radio"]:disabled{opacity:0.6}textarea,select[multiple]{resize:vertical;max-height:75vh;height:6rem;min-height:4rem}select[multiple]{height:8rem}select{cursor:pointer}label{display:block;cursor:pointer;padding-bottom:var(--spacer_h)}label.checkbox,label.radio{display:inline-block;vertical-align:top;width:calc(100% - 1em - (2 * var(--spacer_h)) - 6px);margin-top:2px}input[type="checkbox"],input[type="radio"]{display:inline-block;width:1em;height:1em;cursor:pointer;vertical-align:top;outline:none;accent-color:var(--c_input_accent);margin:var(--spacer_q) var(--spacer_h)}select option{padding:var(--spacer_h) var(--spacer)}select[multiple]{padding:0.1px}select[multiple] option{padding:var(--spacer_h) var(--spacer)}input[type="color"]{padding:0 !important;height:2.35em}input[type="color"]::-webkit-color-swatch-wrapper{padding:0}input[type="color"]::-webkit-color-swatch{border-radius:var(--radius, 0.25rem);cursor:pointer}/* Tables*/.table-wrapper{overflow-x:auto}table{width:100%;border-spacing:0}th{font-weight:var(--fw_bold);text-align:left;background-color:var(--c_bg__alt);border-top:1px solid var(--c_border)}th, td{padding:var(--spacer_h) var(--spacer);border-bottom:1px solid var(--c_border);border-left:1px solid var(--c_border)}th:last-child,td:last-child{border-right:1px solid var(--c_border)}th:first-child{border-top-left-radius:var(--radius)}th:last-child{border-top-right-radius:var(--radius)}tr:last-child td:first-child{border-bottom-left-radius:var(--radius)}tr:last-child td:last-child{border-bottom-right-radius:var(--radius)}/* Colors*/.bg-default{background-color:var(--c_bg);color:var(--tc)}.bg-alt{background-color:var(--c_bg__alt);color:var(--tc)}.bg-inv{--c_primary:var(--c_primary__inv);--c_primary__hover:var(--c_primary__inv__hover);--c_secondary:var(--c_secondary__inv);--c_secondary__hover:var(--c_secondary__inv__hover);--c_success:var(--c_success__inv);--c_success__hover:var(--c_success__inv__hover);--c_warning:var(--c_warning__inv);--c_warning__hover:var(--c_warning__inv__hover);--c_danger:var(--c_danger__inv);--c_danger__hover:var(--c_danger__inv__hover);--tc_link:var(--tc_link__inv);--tc_link__hover:var(--tc_link__inv__hover);background-color:var(--c_bg__inv);color:var(--tc_inv)}.bg-primary{--tc_link:var(--tc_on_primary);--tc_link__hover:var(--tc_on_primary);--c_border:var(--tc_on_primary);background-color:var(--c_primary);color:var(--tc_on_primary);--focus_shadow:var(--focus_shadow_on_primary)}.bg-secondary{--tc_link:var(--tc_on_secondary);--tc_link__hover:var(--tc_on_secondary);background-color:var(--c_secondary);color:var(--tc_on_secondary)}.bg-success{--tc_link:var(--tc_on_success);--tc_link__hover:var(--tc_on_success);background-color:var(--c_success);color:var(--tc_on_success)}.bg-warning{--tc_link:var(--tc_on_warning);--tc_link__hover:var(--tc_on_warning);background-color:var(--c_warning);color:var(--tc_on_warning)}.bg-danger{--tc_link:var(--tc_on_danger);--tc_link__hover:var(--tc_on_danger);background-color:var(--c_danger);color:var(--tc_on_danger)}.tc-default{color:var(--tc)}.tc-inv{color:var(--tc__inv)}.tc-primary{color:var(--tc_primary)}.is-inv .tc-primary,.bg-inv .tc-primary{color:var(--tc_primary__inv)}.tc-secondary{color:var(--tc_secondary)}.is-inv .tc-secondary,.bg-inv .tc-secondary{color:var(--tc_secondary__inv)}.tc-success{color:var(--tc_success)}.is-inv .tc-success,.bg-inv .tc-success{color:var(--tc_success__inv)}.tc-warning{color:var(--tc_warning)}.is-inv .tc-warning,.bg-inv .tc-warning{color:var(--tc_warning__inv)}.tc-danger{color:var(--tc_danger)}.is-inv .tc-danger,.bg-inv .tc-danger{color:var(--tc_danger__inv)}.tc-muted{color:var(--tc_muted)}/* Misc*/.card{border:1px solid var(--c_border);border-radius:var(--radius);padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer);margin-bottom:var(--spacer)}.drop-shadow{box-shadow:var(--drop_shadow)}.icon{display:inline-block;width:1.35em;vertical-align:top;margin-left:auto;margin-right:auto}iframe{border:none;width:100%}
+/* Reset*/:root{interpolate-size:allow-keywords}*, *::before, *::after{font-family:inherit;box-sizing:border-box;line-height:var(--line-height)}body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, dt, blockquote, pre, code{margin:0;padding:0.1px}html{font-family:var(--ff_body);font-size:var(--fs_base);font-weight:var(--fw_base);color:var(--tc)}::selection{background:var(--c_highlight)}body{min-height:100vh;background-color:var(--c_bg);color:var(--tc);overflow-y:scroll;font-family:var(--ff_body);position:relative}main, .container{max-width:var(--container_width);margin-left:auto;margin-right:auto;padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer)}nav > a,nav > .link{display:inline-block;padding:var(--spacer) !important;text-decoration:none}menu{margin:0;padding:0}menu a{display:block;padding:var(--spacer_q);text-decoration:none;color:inherit}summary{cursor:pointer;margin-bottom:var(--sapcer);outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:var(--radius)}summary:focus{box-shadow:var(--focus_shadow)}/* Display / Flex*/.d-b{display:block !important}.d-ib{display:inline-block !important}.d-g{display:grid !important}.d-i{display:inline !important}.d-n{display:none !important}.d-f{display:flex !important;flex-wrap:wrap}.d-if{display:inline-flex !important;flex-wrap:wrap}.flex, .flex-1{flex:1 1 auto}.flex-0{flex:0 0}.flex-2{flex:2 2 auto}.flex-3{flex:3 3 auto}.flex-4{flex:4 4 auto}.flex-5{flex:5 5 auto}.flex-6{flex:6 6 auto}.flex-7{flex:7 7 auto}.flex-8{flex:8 8 auto}.flex-9{flex:9 9 auto}.flex-10{flex:10 10 auto}@media (min-width:1024px){.d-d-b{display:block !important}.d-d-ib{display:inline-block !important}.d-d-g{display:grid !important}.d-d-i{display:inline !important}.d-d-n{display:none !important}.d-d-if{display:inline-flex !important;flex-wrap:wrap}.d-d-f{display:flex !important;flex-wrap:wrap}.d-flex, .d-flex-1{flex:1 1 auto}.d-flex-0{flex:0 0}.d-flex-2{flex:2 2 auto}.d-flex-3{flex:3 3 auto}.d-flex-4{flex:4 4 auto}.d-flex-5{flex:5 5 auto}.d-flex-6{flex:6 6 auto}.d-flex-7{flex:7 7 auto}.d-flex-8{flex:8 8 auto}.d-flex-9{flex:9 9 auto}.d-flex-10{flex:10 10 auto}}@media (min-width:769px) and (max-width:1023px){.t-d-b{display:block !important}.t-d-ib{display:inline-block !important}.t-d-g{display:grid !important}.t-d-i{display:inline !important}.t-d-n{display:none !important}.t-d-if{display:inline-flex !important;flex-wrap:wrap}.t-d-f{display:flex !important;flex-wrap:wrap}.t-flex, .t-flex-1{flex:1 1 auto}.t-flex-0{flex:0 0}.t-flex-2{flex:2 2 auto}.t-flex-3{flex:3 3 auto}.t-flex-4{flex:4 4 auto}.t-flex-5{flex:5 5 auto}.t-flex-6{flex:6 6 auto}.t-flex-7{flex:7 7 auto}.t-flex-8{flex:8 8 auto}.t-flex-9{flex:9 9 auto}.t-flex-10{flex:10 10 auto}}@media (max-width:768px){.m-d-b{display:block !important}.m-d-ib{display:inline-block !important}.m-d-g{display:grid !important}.m-d-i{display:inline !important}.m-d-n{display:none !important}.m-d-if{display:inline-flex !important;flex-wrap:wrap}.m-d-f{display:flex !important;flex-wrap:wrap}.m-flex, .m-flex-1{flex:1 1 auto}.m-flex-0{flex:0 0}.m-flex-2{flex:2 2 auto}.m-flex-3{flex:3 3 auto}.m-flex-4{flex:4 4 auto}.m-flex-5{flex:5 5 auto}.m-flex-6{flex:6 6 auto}.m-flex-7{flex:7 7 auto}.m-flex-8{flex:8 8 auto}.m-flex-9{flex:9 9 auto}.m-flex-10{flex:10 10 auto}}.fixed{position:fixed;top:0;width:100%;z-index:99}/* Typography*/.small,small{font-size:var(--fs_small) !important}.large{font-size:var(--fs_large) !important}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6,b, strong{font-weight:var(--fw_bold)}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6{font-family:var(--ff_heading)}.h1, h1{font-size:var(--fs_h1)}.h2, h2{font-size:var(--fs_h2)}.h3, h3{font-size:var(--fs_h3)}.h4, h4{font-size:var(--fs_h4)}.h5, h5{font-size:var(--fs_h5)}.h6, h6{font-size:var(--fs_h6)}p, h1, h2, h3, h4, h5, h6, blockquote, ul, ol, dl, pre, hr, dd{margin-bottom:var(--spacer)}ul, ol, dl{padding-left:calc(1.5 * var(--spacer))}blockquote{border-left:2px solid var(--c_border);padding:var(--spacer)}mark{background-color:var(--c_highlight);color:inherit}.ff-mono, pre, code{font-family:var(--ff_mono)}code{background-color:var(--c_bg__alt);border-radius:var(--radius);word-break:break-word;padding:calc(0.125 * var(--spacer)) var(--spacer_q)}pre code{display:block;padding:var(--spacer);word-break:normal;overflow:auto;white-space:pre-wrap}output{display:block;border:1px solid var(--c_border);border-radius:var(--radius);padding:var(--spacer) var(--spacer) 0 var(--spacer)}.ta-left{text-align:left}.ta-center{text-align:center}.ta-right{text-align:right}a,.link{color:var(--tc_link);box-shadow:0 0 0 transparent;transition:color var(--animation_ms), box-shadow var(--animation_ms);outline:none;border-radius:var(--radius);text-decoration:var(--link_decoration)}a:hover,.link:hover{color:var(--tc_link__hover)}a:focus,.link:focus-visible{box-shadow:var(--focus_shadow)}.no-link,.no-link:hover{text-decoration:none;color:inherit}hr{border:none;border-top:1px solid var(--c_border)}small{font-size:0.75em}dl{padding:0;margin:0}dt, dd{padding-left:var(--spacer);border-left:2px solid var(--c_border)}dt{padding-top:var(--spacer_h)}dd{padding-bottom:var(--spacer_h)}dd + dd{margin-top:calc(-1 * var(--spacer));padding-top:0}li ul{margin-bottom:0}.td-n{text-decoration:none}/* Spacing, Borders and Radius*/.p, .pt, .py{padding-top:var(--spacer) !important}.p, .pr, .px{padding-right:var(--spacer) !important}.p, .pb, .py{padding-bottom:var(--spacer) !important}.p, .pl, .px{padding-left:var(--spacer) !important}.ph, .pth, .pyh{padding-top:var(--spacer_h) !important}.ph, .prh, .pxh{padding-right:var(--spacer_h) !important}.ph, .pbh, .pyh{padding-bottom:var(--spacer_h) !important}.ph, .plh, .pxh{padding-left:var(--spacer_h) !important}.pq, .ptq, .pyq{padding-top:var(--spacer_q) !important}.pq, .prq, .pxq{padding-right:var(--spacer_q) !important}.pq, .pbq, .pyq{padding-bottom:var(--spacer_q) !important}.pq, .plq, .pxq{padding-left:var(--spacer_q) !important}.p0, .pt0, .py0{padding-top:0.1px !important}.p0, .pr0, .px0{padding-right:0.1px !important}.p0, .pb0, .py0{padding-bottom:0.1px !important}.p0, .pl0, .px0{padding-left:0.1px !important}.m, .mt, .my{margin-top:var(--spacer) !important}.m, .mr, .mx{margin-right:var(--spacer) !important}.m, .mb, .my{margin-bottom:var(--spacer) !important}.m, .ml, .mx{margin-left:var(--spacer) !important}.mh, .mth, .myh{margin-top:var(--spacer_h) !important}.mh, .mrh, .mxh{margin-right:var(--spacer_h) !important}.mh, .mbh, .myh{margin-bottom:var(--spacer_h) !important}.mh, .mlh, .mxh{margin-left:var(--spacer_h) !important}.mq, .mtq, .myq{margin-top:var(--spacer_q) !important}.mq, .mrq, .mxq{margin-right:var(--spacer_q) !important}.mq, .mbq, .myq{margin-bottom:var(--spacer_q) !important}.mq, .mlq, .mxq{margin-left:var(--spacer_q) !important}.m0, .mt0, .my0{margin-top:0 !important}.m0, .mr0, .mx0{margin-right:0 !important}.m0, .mb0, .my0{margin-bottom:0 !important}.m0, .ml0, .mx0{margin-left:0 !important}.-m, .-mt, .-my{margin-top:calc(-1 * var(--spacer)) !important}.-m, .-mr, .-mx{margin-right:calc(-1 * var(--spacer)) !important}.-m, .-mb, .-my{margin-bottom:calc(-1 * var(--spacer)) !important}.-m, .-ml, .-mx{margin-left:calc(-1 * var(--spacer)) !important}.b, .bt, .by{border-top:1px solid var(--c_border) !important}.b, .br, .bx{border-right:1px solid var(--c_border) !important}.b, .bb, .by{border-bottom:1px solid var(--c_border) !important}.b, .bl, .bx{border-left:1px solid var(--c_border) !important}.b0, .bt0, .by0{border-top:none !important}.b0, .br0, .bx0{border-right:none !important}.b0, .bb0, .by0{border-bottom:none !important}.b0, .bl0, .bx0{border-left:none !important}.r, .rtl, .rt, .rl{border-top-left-radius:var(--radius) !important}.r, .rtr, .rt, .rr{border-top-right-radius:var(--radius) !important}.r, .rbr, .rb, .rr{border-bottom-right-radius:var(--radius) !important}.r, .rbl, .rb, .rl{border-bottom-left-radius:var(--radius) !important}.r0, .rtl0, .rt0, .rl0{border-top-left-radius:0 !important}.r0, .rtr0, .rt0, .rr0{border-top-right-radius:0 !important}.r0, .rbr0, .rb0, .rr0{border-bottom-right-radius:0 !important}.r0, .rbl0, .rb0, .rl0{border-bottom-left-radius:0 !important}.round{border-radius:9999rem !important}/* Rows and Columns*/.row{display:flex;flex-wrap:wrap}.col{flex:1 1}.span-1{min-width:8.333%;flex-basis:8.333%}.span-2{min-width:16.666%;flex-basis:16.666%}.span-3{min-width:25%;flex-basis:25%}.span-4{min-width:33.333%;flex-basis:33.333%}.span-5{min-width:41.666%;flex-basis:41.666%}.span-6{min-width:50%;flex-basis:50%}.span-7{min-width:58.333%;flex-basis:58.333%}.span-8{min-width:66.666%;flex-basis:66.666%}.span-9{min-width:75%;flex-basis:75%}.span-10{min-width:83.333%;flex-basis:83.333%}.span-11{min-width:91.333%;flex-basis:91.333%}.span-12{min-width:100%;flex-basis:100%}@media (min-width:1024px){.d-span-1{min-width:8.333%;flex-basis:8.333%}.d-span-2{min-width:16.666%;flex-basis:16.666%}.d-span-3{min-width:25%;flex-basis:25%}.d-span-4{min-width:33.333%;flex-basis:33.333%}.d-span-5{min-width:41.666%;flex-basis:41.666%}.d-span-6{min-width:50%;flex-basis:50%}.d-span-7{min-width:58.333%;flex-basis:58.333%}.d-span-8{min-width:66.666%;flex-basis:66.666%}.d-span-9{min-width:75%;flex-basis:75%}.d-span-10{min-width:83.333%;flex-basis:83.333%}.d-span-11{min-width:91.333%;flex-basis:91.333%}.d-span-12{min-width:100%;flex-basis:100%}}@media (min-width:769px) and (max-width:1023px){.t-span-1{min-width:8.333%;flex-basis:8.333%}.t-span-2{min-width:16.666%;flex-basis:16.666%}.t-span-3{min-width:25%;flex-basis:25%}.t-span-4{min-width:33.333%;flex-basis:33.333%}.t-span-5{min-width:41.666%;flex-basis:41.666%}.t-span-6{min-width:50%;flex-basis:50%}.t-span-7{min-width:58.333%;flex-basis:58.333%}.t-span-8{min-width:66.666%;flex-basis:66.666%}.t-span-9{min-width:75%;flex-basis:75%}.t-span-10{min-width:83.333%;flex-basis:83.333%}.t-span-11{min-width:91.333%;flex-basis:91.333%}.t-span-12{min-width:100%;flex-basis:100%}}@media (max-width:768px){.m-span-1{min-width:8.333%;flex-basis:8.333%}.m-span-2{min-width:16.666%;flex-basis:16.666%}.m-span-3{min-width:25%;flex-basis:25%}.m-span-4{min-width:33.333%;flex-basis:33.333%}.m-span-5{min-width:41.666%;flex-basis:41.666%}.m-span-6{min-width:50%;flex-basis:50%}.m-span-7{min-width:58.333%;flex-basis:58.333%}.m-span-8{min-width:66.666%;flex-basis:66.666%}.m-span-9{min-width:75%;flex-basis:75%}.m-span-10{min-width:83.333%;flex-basis:83.333%}.m-span-11{min-width:91.333%;flex-basis:91.333%}.m-span-12{min-width:100%;flex-basis:100%}}.cols-2{grid-template-columns:repeat(2, 1fr)}.cols-3{grid-template-columns:repeat(3, 1fr)}.cols-4{grid-template-columns:repeat(4, 1fr)}.cols-5{grid-template-columns:repeat(5, 1fr)}.cols-6{grid-template-columns:repeat(6, 1fr)}.cols-7{grid-template-columns:repeat(7, 1fr)}.cols-8{grid-template-columns:repeat(8, 1fr)}.cols-9{grid-template-columns:repeat(9, 1fr)}.cols-10{grid-template-columns:repeat(10, 1fr)}@media (min-width:1024px){.d-cols-2{grid-template-columns:repeat(2, 1fr)}.d-cols-3{grid-template-columns:repeat(3, 1fr)}.d-cols-4{grid-template-columns:repeat(4, 1fr)}.d-cols-5{grid-template-columns:repeat(5, 1fr)}.d-cols-6{grid-template-columns:repeat(6, 1fr)}.d-cols-7{grid-template-columns:repeat(7, 1fr)}.d-cols-8{grid-template-columns:repeat(8, 1fr)}.d-cols-9{grid-template-columns:repeat(9, 1fr)}.d-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (min-width:769px) and (max-width:1023px){.t-cols-2{grid-template-columns:repeat(2, 1fr)}.t-cols-3{grid-template-columns:repeat(3, 1fr)}.t-cols-4{grid-template-columns:repeat(4, 1fr)}.t-cols-5{grid-template-columns:repeat(5, 1fr)}.t-cols-6{grid-template-columns:repeat(6, 1fr)}.t-cols-7{grid-template-columns:repeat(7, 1fr)}.t-cols-8{grid-template-columns:repeat(8, 1fr)}.t-cols-9{grid-template-columns:repeat(9, 1fr)}.t-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (max-width:768px){.m-cols-2{grid-template-columns:repeat(2, 1fr)}.m-cols-3{grid-template-columns:repeat(3, 1fr)}.m-cols-4{grid-template-columns:repeat(4, 1fr)}.m-cols-5{grid-template-columns:repeat(5, 1fr)}.m-cols-6{grid-template-columns:repeat(6, 1fr)}.m-cols-7{grid-template-columns:repeat(7, 1fr)}.m-cols-8{grid-template-columns:repeat(8, 1fr)}.m-cols-9{grid-template-columns:repeat(9, 1fr)}.m-cols-10{grid-template-columns:repeat(10, 1fr)}}/* Buttons*/button:not(.no-btn):not(.no-style),.btn,input[type="button"],input[type="submit"],input[type="reset"]{display:inline-block;padding:var(--btn_padding);background-color:var(--btn_bg);border:1px solid var(--btn_border);cursor:pointer;outline:none;border-radius:var(--radius);color:var(--btn_tc);transition:background-color var(--animation_ms), box-shadow var(--animation_ms);text-decoration:none;box-shadow:var(--btn_box_shadow);font-size:inherit;vertical-align:middle}button:not(.no-btn):not(.no-style):hover,.btn:hover,input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover{background-color:var(--btn_bg__hover);color:var(--btn_tc);box-shadow:var(--btn_box_shadow__hover)}button:not(.no-btn):not(.no-style):focus,.btn:focus,input[type="button"]:focus,input[type="submit"]:focus,input[type="reset"]:focus{box-shadow:var(--btn_box_shadow__hover), var(--focus_shadow);z-index:1}button:not(.no-btn):not(.no-style):disabled,.btn[disabled],input[type="button"]:disabled,input[type="submit"]:disabled,input[type="reset"]:disabled{opacity:0.6}button:not(.no-btn).primary,.btn.primary,input[type="button"].primary,input[type="submit"].primary,input[type="reset"].primary{background-color:var(--c_primary);--btn_tc:var(--tc_on_primary)}button:not(.no-btn).primary:hover,.btn.primary:hover,input[type="button"].primary:hover,input[type="submit"].primary:hover,input[type="reset"].primary:hover{background-color:var(--c_primary__hover)}button:not(.no-btn).secondary,.btn.secondary,input[type="button"].secondary,input[type="submit"].secondary,input[type="reset"].secondary{background-color:var(--c_secondary);--btn_tc:var(--tc_on_secondary)}button:not(.no-btn).secondary:hover,.btn.secondary:hover,input[type="button"].secondary:hover,input[type="submit"].secondary:hover,input[type="reset"].secondary:hover{background-color:var(--c_secondary__hover)}button:not(.no-btn).success,.btn.success,input[type="button"].success,input[type="submit"].success,input[type="reset"].success{background-color:var(--c_success);--btn_tc:var(--tc_on_success)}button:not(.no-btn).success:hover,.btn.success:hover,input[type="button"].success:hover,input[type="submit"].success:hover,input[type="reset"].success:hover{background-color:var(--c_success__hover)}button:not(.no-btn).warning,.btn.warning,input[type="button"].warning,input[type="submit"].warning,input[type="reset"].warning{background-color:var(--c_warning);--btn_tc:var(--tc_on_warning)}button:not(.no-btn).warning:hover,.btn.warning:hover,input[type="button"].warning:hover,input[type="submit"].warning:hover,input[type="reset"].warning:hover{background-color:var(--c_warning__hover)}button:not(.no-btn).danger,.btn.danger,input[type="button"].danger,input[type="submit"].danger,input[type="reset"].danger{background-color:var(--c_danger);--btn_tc:var(--tc_on_danger)}button:not(.no-btn).danger:hover,.btn.danger:hover,input[type="button"].danger:hover,input[type="submit"].danger:hover,input[type="reset"].danger:hover{background-color:var(--c_danger__hover)}button:not(.no-btn):not(.no-style).link,.btn.link,input[type="button"].link,input[type="submit"].link,input[type="reset"].link{background-color:transparent;color:inherit;box-shadow:0 0 0 transparent;border:none;padding:0.1px;font-size:inherit}.btn-grp{display:inline-flex}.btn-grp button:not(.no-btn):not(:first-child),.btn-grp .btn:not(:first-child),.btn-grp input[type="button"]:not(:first-child),.btn-grp input[type="submit"]:not(:first-child),.btn-grp input[type="reset"]:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;border-left:1px solid rgba(0, 0, 0, 0.25)}.btn-grp button:not(.no-btn):not(:last-child),.btn-grp .btn:not(:last-child),.btn-grp input[type="button"]:not(:last-child),.btn-grp input[type="submit"]:not(:last-child),.btn-grp input[type="reset"]:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.no-btn{display:inline;border:none;background-color:transparent;padding:0;font-size:inherit;font-family:inherit;cursor:pointer;outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:0;text-align:left;color:inherit}.no-btn:focus{box-shadow:var(--focus_shadow)}.full{display:block;width:100%}/* Inputs*/input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]),select,textarea{display:block;width:100%;background-color:var(--input_bg);color:var(--input_tc);border:var(--input_border_width) solid var(--c_border);padding:var(--input_padding);border-radius:var(--radius);outline:none;transition:box-shadow var(--animation_ms)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):focus,select:focus,textarea:focus,input[type="checkbox"]:focus,input[type="radio"]:focus{box-shadow:var(--focus_shadow)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):disabled,select:disabled,textarea:disabled,input[type="checkbox"]:disabled,input[type="radio"]:disabled{opacity:0.6}textarea,select[multiple]{resize:vertical;max-height:75vh;height:6rem;min-height:4rem}select[multiple]{height:8rem}select{cursor:pointer}label{display:block;cursor:pointer;padding-bottom:var(--spacer_h)}label.checkbox,label.radio{display:inline-block;vertical-align:top;width:calc(100% - 1em - (2 * var(--spacer_h)) - 6px);margin-top:2px}input[type="checkbox"],input[type="radio"]{display:inline-block;width:1em;height:1em;cursor:pointer;vertical-align:top;outline:none;accent-color:var(--c_input_accent);margin:var(--spacer_q) var(--spacer_h)}select option{padding:var(--spacer_h) var(--spacer)}select[multiple]{padding:0.1px}select[multiple] option{padding:var(--spacer_h) var(--spacer)}input[type="color"]{padding:0 !important;height:2.35em}input[type="color"]::-webkit-color-swatch-wrapper{padding:0}input[type="color"]::-webkit-color-swatch{border-radius:var(--radius, 0.25rem);cursor:pointer}/* Tables*/.table-wrapper{overflow-x:auto}table{width:100%;border-spacing:0}th{font-weight:var(--fw_bold);text-align:left;background-color:var(--c_bg__alt);border-top:1px solid var(--c_border)}th, td{padding:var(--spacer_h) var(--spacer);border-bottom:1px solid var(--c_border);border-left:1px solid var(--c_border)}th:last-child,td:last-child{border-right:1px solid var(--c_border)}th:first-child{border-top-left-radius:var(--radius)}th:last-child{border-top-right-radius:var(--radius)}tr:last-child td:first-child{border-bottom-left-radius:var(--radius)}tr:last-child td:last-child{border-bottom-right-radius:var(--radius)}/* Colors*/.bg-default{background-color:var(--c_bg);color:var(--tc)}.bg-alt{background-color:var(--c_bg__alt);color:var(--tc)}.bg-inv{--c_primary:var(--c_primary__inv);--c_primary__hover:var(--c_primary__inv__hover);--c_secondary:var(--c_secondary__inv);--c_secondary__hover:var(--c_secondary__inv__hover);--c_success:var(--c_success__inv);--c_success__hover:var(--c_success__inv__hover);--c_warning:var(--c_warning__inv);--c_warning__hover:var(--c_warning__inv__hover);--c_danger:var(--c_danger__inv);--c_danger__hover:var(--c_danger__inv__hover);--tc_link:var(--tc_link__inv);--tc_link__hover:var(--tc_link__inv__hover);background-color:var(--c_bg__inv);color:var(--tc_inv)}.bg-primary{--tc_link:var(--tc_on_primary);--tc_link__hover:var(--tc_on_primary);--c_border:var(--tc_on_primary);background-color:var(--c_primary);color:var(--tc_on_primary);--focus_shadow:var(--focus_shadow_on_primary)}.bg-secondary{--tc_link:var(--tc_on_secondary);--tc_link__hover:var(--tc_on_secondary);background-color:var(--c_secondary);color:var(--tc_on_secondary)}.bg-success{--tc_link:var(--tc_on_success);--tc_link__hover:var(--tc_on_success);background-color:var(--c_success);color:var(--tc_on_success)}.bg-warning{--tc_link:var(--tc_on_warning);--tc_link__hover:var(--tc_on_warning);background-color:var(--c_warning);color:var(--tc_on_warning)}.bg-danger{--tc_link:var(--tc_on_danger);--tc_link__hover:var(--tc_on_danger);background-color:var(--c_danger);color:var(--tc_on_danger)}.tc-default{color:var(--tc)}.tc-inv{color:var(--tc__inv)}.tc-primary{color:var(--tc_primary)}.is-inv .tc-primary,.bg-inv .tc-primary{color:var(--tc_primary__inv)}.tc-secondary{color:var(--tc_secondary)}.is-inv .tc-secondary,.bg-inv .tc-secondary{color:var(--tc_secondary__inv)}.tc-success{color:var(--tc_success)}.is-inv .tc-success,.bg-inv .tc-success{color:var(--tc_success__inv)}.tc-warning{color:var(--tc_warning)}.is-inv .tc-warning,.bg-inv .tc-warning{color:var(--tc_warning__inv)}.tc-danger{color:var(--tc_danger)}.is-inv .tc-danger,.bg-inv .tc-danger{color:var(--tc_danger__inv)}.tc-muted{color:var(--tc_muted)}/* Misc*/.card{border:1px solid var(--c_border);border-radius:var(--radius);padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer);margin-bottom:var(--spacer)}.drop-shadow{box-shadow:var(--drop_shadow)}.icon{display:inline-block;width:1.35em;vertical-align:top;margin-left:auto;margin-right:auto}iframe{border:none;width:100%}

package/dist/utils/raf.js

@@ -0,0 +1 @@
+const raf=(a,r=1)=>{requestAnimationFrame((()=>{1===r?a():raf(a,r-1)}))};export default raf;

package/docs/components/accordion.html

@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Accordion - Components - Kempo Docs - A Web Components Solution</title>
+  <link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
+  <link rel="stylesheet" href="../kempo/kempo-hljs.css" />
+</head>
+<body>
+  <k-import src="../nav-1.inc.html"></k-import>
+  <h1 class="ta-center">Accordion</h1>
+  <main>
+    <details
+      class="b r mb"
+    >
+      <summary class="p">Table of Contents</summary>
+      <div class="m mt0 pl">
+        <a href="#basicUsage">Basic Usage</a><br />
+        <a href="#constructor">Constructor</a><br />
+        <a href="#requirements">Requirements</a><br />
+        <a href="#attributes">Attributes</a><br />
+        <a href="#properties">Properties</a><br />
+        <a href="#methods">Methods</a><br />
+      </div>
+    </details>
+
+    <h3>Description</h3>
+    <p>A widget that allows a single panel of content to be opened and closed.</p>
+
+    <h3 id="basicUsage"><a href="#basicUsage" class="no-link">Basic Usage</a></h3>
+    <k-accordion
+      class="mb"
+    >
+      <k-accordion-header for-panel="panel1">Panel 1</k-accordion-header>
+      <k-accordion-panel name="panel1">
+        <p class="m">Panel 1 content</p>
+      </k-accordion-panel>
+      <k-accordion-header for-panel="panel2">Panel 2</k-accordion-header>
+      <k-accordion-panel name="panel2">
+        <p class="m">Panel 2 content</p>
+      </k-accordion-panel>
+      <k-accordion-header for-panel="panel3">Panel 3</k-accordion-header>
+      <k-accordion-panel name="panel3">
+        <p class="m">Panel 3 content</p>
+      </k-accordion-panel>
+    </k-accordion>
+
+    <h2 id="jsRef">JavaScript Refrerence</h2>
+
+    <h3 id="constructor"><a href="#constructor" class="no-link">Constructor</a></h3>
+    <h6>Extends <a href="./component.html">Component</a></h6>
+    <h5>
+      <code>new Accordion()</code><br />
+    </h5>
+
+    <h4>Paramters</h4>
+    <h5><code>param<i>: type</i></code></h5>
+    <p>param_description</p>
+
+    <h3 id="requirements"><a href="#requirements" class="no-link">Requirements</a></h3>
+    <ul>
+      <li><a href=""></a></li>
+    </ul>
+
+    <h3 id="attributes"><a href="#attributes" class="no-link">Attributes</a></h3>
+    <h5><code>attr<i>: type</i></code></h5>
+    <p>attr_description</p>
+
+    <h3 id="properties"><a href="#properties" class="no-link">Properties</a></h3>
+    <h5><code>prop<i>: type</i></code></h5>
+    <p>prop_description</p>
+
+    <h3 id="methods"><a href="#methods" class="no-link">Methods</a></h3>
+    <h5><code>method(<i>type<i> arg)<i>: return_type</i></code></h5>
+    <p>method_description</p>
+    
+  </main>
+  <script type="module" src="../kempo/components/Import.js"></script>
+  <script type="module" src="../kempo/components/Accordion.js"></script>
+</body>
+</html>

package/docs/components/stacks.html

@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Stacks - Components - Kempo Docs - A Web Components Solution</title>
+  <link rel="stylesheet" href="../kempo/kempo-vars.css" /><link rel="stylesheet" href="../kempo/kempo-styles.css" />
+  <link rel="stylesheet" href="../kempo/kempo-hljs.css" />
+</head>
+<body>
+  <k-import src="../nav-1.inc.html"></k-import>
+  <h1 class="ta-center">Stacks</h1>
+  <main>
+    <details
+      class="b r mb"
+    >
+      <summary class="p">Table of Contents</summary>
+      <div class="m mt0 pl">
+        <a href="#basicUsage">Basic Usage</a><br />
+        <a href="#constructor">Constructor</a><br />
+        <a href="#requirements">Requirements</a><br />
+        <a href="#attributes">Attributes</a><br />
+        <a href="#properties">Properties</a><br />
+        <a href="#methods">Methods</a><br />
+      </div>
+    </details>
+
+    <h3>Description</h3>
+    <p>description</p>
+
+    <h3 id="basicUsage"><a href="#basicUsage" class="no-link">Basic Usage</a></h3>
+    <k-stacks
+      style="
+        height: 20rem;
+      "
+    >
+      <k-stack-panel
+        class="b r"
+        stack="1"
+        style="background: #633"
+      >
+        <p>Panel 1</p>
+      </k-stack-panel>
+      <k-stack-panel
+        class="b r"
+        stack="1"
+        style="background: #363;"
+      >
+        <p>Panel 2</p>
+      </k-stack-panel>
+      <k-stack-panel
+        class="b r"
+        stack="1"
+        style="background: #336;"
+      >
+        <p>Panel 3</p>
+      </k-stack-panel>
+    </k-stacks>
+
+    <h2 id="jsRef">JavaScript Refrerence</h2>
+
+    <h3 id="constructor"><a href="#constructor" class="no-link">Constructor</a></h3>
+    <h6>Extends <a href="./component.html">Component</a></h6>
+    <h5>
+      <code>new Template()</code><br />
+      <code>new Template(<i>type</i> param)</code>
+    </h5>
+
+    <h4>Paramters</h4>
+    <h5><code>param<i>: type</i></code></h5>
+    <p>param_description</p>
+
+    <h3 id="requirements"><a href="#requirements" class="no-link">Requirements</a></h3>
+    <ul>
+      <li><a href=""></a></li>
+    </ul>
+
+    <h3 id="attributes"><a href="#attributes" class="no-link">Attributes</a></h3>
+    <h5><code>attr<i>: type</i></code></h5>
+    <p>attr_description</p>
+
+    <h3 id="properties"><a href="#properties" class="no-link">Properties</a></h3>
+    <h5><code>prop<i>: type</i></code></h5>
+    <p>prop_description</p>
+
+    <h3 id="methods"><a href="#methods" class="no-link">Methods</a></h3>
+    <h5><code>method(<i>type<i> arg)<i>: return_type</i></code></h5>
+    <p>method_description</p>
+    
+  </main>
+  <script type="module" src="../kempo/components/Import.js"></script> 
+  <script type="module" src="../kempo/components/Stacks.js"></script>
+</body>
+</html>

package/docs/kempo/components/Accordion.js

@@ -0,0 +1 @@
+import Component from"./Component.js";import{onEvent,offEvent,dispatchEvent}from"../utils/element.js";import raf from"../utils/raf.js";export default class Accordion extends Component{constructor(){super(),this.unrender=!0}get activeHeader(){return this.querySelector('k-accordion-header[active="true"]')}get activePanel(){return this.querySelector('k-accordion-panel[active="true"]')}getHeader(e){return this.querySelector(`k-accordion-header[for-panel="${e}"]`)}getPanel(e){return this.querySelector(`k-accordion-panel[name="${e}"]`)}openPanel(e){const t=this.querySelector('k-accordion-panel[active="true"]');if(t&&t.name!==e){t.active=!1;const e=this.getHeader(t.name);e&&(e.active=!1)}const n=this.getPanel(e);if(n){n.active=!0,n.transitioning=!0,setTimeout((()=>{n.transitioning=!1}),parseInt(getComputedStyle(this).getPropertyValue("--animation_ms")||256));const t=this.getHeader(e);t&&(t.active=!0),dispatchEvent(this,"openpanel",{panelName:e})}}closePanel(e){const t=this.getPanel(e);if(t){t.active=!1,t.transitioning=!0,setTimeout((()=>{t.transitioning=!1}),parseInt(getComputedStyle(this).getPropertyValue("--animation_ms")||256));const n=this.getHeader(e);n&&(n.active=!1),dispatchEvent(this,"closepanel",{panelName:e})}}togglePanel(e){const t=this.getPanel(e);t&&(t.active?this.closePanel(e):this.openPanel(e),dispatchEvent(this,"togglepanel",{panelName:e}))}get shadowStyles(){return'\n      :host {\n        display: block;\n        border: 1px solid var(--c_border);\n        border-radius: var(--radius);\n      }\n      ::slotted(k-accordion-header){\n        border-top: 1px solid var(--c_border);\n      }\n      ::slotted(k-accordion-header[active="true"]) {\n        border-bottom: 1px solid var(--c_border);\n      }\n      ::slotted(k-accordion-header:first-of-type) {\n        border-top: 0;\n      }\n      ::slotted(k-accordion-header:last-of-type:not([active="true"])) {\n        border-bottom: 0;\n      }\n    '}}window.customElements.define("k-accordion",Accordion);const clickHandler=Symbol();export class AccordionHeader extends Component{constructor(e="Show More",t=""){super(),this[clickHandler]=()=>{this.accordion.togglePanel(this.forPanel)},this.registerAttributes({forPanel:t,active:!1})}async render(e){return!!await super.render(e)&&(onEvent(this,"click",this[clickHandler]),!0)}disconnectedCallback(){super.disconnectedCallback(),offEvent(this,"click",this[clickHandler])}get accordion(){return this.closest("k-accordion")}get shadowStyles(){return"\n      :host {\n        display: block;\n        padding: 1rem;\n        cursor: pointer;\n      }\n    "}}window.customElements.define("k-accordion-header",AccordionHeader);export class AccordionPanel extends Component{constructor(e=""){super(),this.registerAttributes({name:e,active:!1,transitioning:!1})}get accordion(){return this.closest("k-accordion")}get shadowStyles(){return`\n      ${super.shadowStyles}\n      :host {\n        display: block;\n        interpolate-size: allow-keywords;\n        height: 0;\n        overflow: hidden;\n        transition: height var(--animation_ms) ease-in-out;\n      }\n      :host([active="true"]) {\n        height: max-content;\n      }\n    `}}window.customElements.define("k-accordion-panel",AccordionPanel);

package/docs/kempo/components/LazyComponent.js

@@ -1 +1 @@
-import Component from"./Component.js";import{isInView}from"../utils/element.js";export default class LazyComponent extends Component{constructor(e){super(e),new IntersectionObserver((([e])=>{e.intersectionRatio>0&&!this.rendered?this.inViewCallback():this.outOfViewCallback()})).observe(this),this.registerAttribute("unrender",!1)}async connectedCallback(){await this.renderSkelton(),await isInView(this)&&await this.inViewCallback()}async inViewCallback(){await this.render()}async outOfViewCallback(){this.unrender&&await this.renderSkelton()}async renderSkelton(){this.shadowRoot.innerHTML=`<link rel="stylesheet" href="${Component.pathToKempo}/kempo-styles.css" />${this.skeletonTemplate}<style>${this.shadowStyles}</style>`,this.rendered=!1}get skeletonTemplate(){return'<div style="height: var(--skeleton_height, 1rem)"></div>'}}
+import Component from"./Component.js";import{isInView}from"../utils/element.js";import raf from"../utils/raf.js";export default class LazyComponent extends Component{constructor(e){super(e),new IntersectionObserver((([e])=>{e.intersectionRatio>0&&!this.rendered?this.inViewCallback():this.outOfViewCallback()})).observe(this),this.registerAttribute("unrender",!1)}async connectedCallback(){await this.renderSkelton(),raf((async()=>{await isInView(this)&&await this.inViewCallback()}),2)}async inViewCallback(){return await this.render()}async outOfViewCallback(){return!!this.unrender&&(await this.renderSkelton(),!0)}async renderSkelton(){return this.shadowRoot.innerHTML=`<link rel="stylesheet" href="${Component.pathToKempo}/kempo-styles.css" />${this.skeletonTemplate}<style>${this.shadowStyles}</style>`,this.rendered=!1,!0}get skeletonTemplate(){return'<div style="height: var(--skeleton_height, 1rem)"></div>'}}

package/docs/kempo/components/Stack.js

@@ -0,0 +1 @@
+import Component from"./components/Component.js";export default class Stack extends Component{constructor(){super()}}window.customElements.define("k-stack",Stack);export class StackPanel extends Component{get shadowStyles(){return"\n      :host {\n        display: block;\n      }\n    "}}window.customElements.define("k-stack-panel",StackPanel);

package/docs/kempo/components/Stacks.js

@@ -0,0 +1 @@
+import Component from"./Component.js";export default class Stacks extends Component{get panels(){return[...this.querySelectorAll("k-stack-panel")]}reorderPanels(){this.panels.reverse().forEach(((t,e)=>t.style.setProperty("--order",e)))}get shadowStyles(){return"\n      :host {\n        --stack_width: 16rem;\n        display: block;\n        height: 100%;\n        position: relative;\n      }\n    "}}window.customElements.define("k-stacks",Stacks);export class StackPanel extends Component{constructor(){super(),this.registerAttribute("stack",0)}connectedCallback(){super.connectedCallback();const t=this.stacks;t&&t.reorderPanels()}attributeChangedCallback(t,e,s){super.attributeChangedCallback(t,e,s),"stack"===t&&e!==s&&this.style.setProperty("--stack",s)}get stacks(){return this.closest("k-stacks")}get shadowStyles(){return"\n      :host {\n        --stack: 0;\n        display: block;\n        height: 100%;\n        width: var(--stack_width);\n        position: absolute;\n        top: 0;\n        left: calc(var(--stack) * var(--stack_width));\n        transition: left var(--animation_ms) ease-in-out;\n        z-index: var(--order);\n      }\n    "}static observedAttributes=[...super.observedAttributes,"stack"]}window.customElements.define("k-stack-panel",StackPanel);

package/docs/kempo/index.js

@@ -1 +1 @@
-import Card from"./components/Card.js";import Component from"./components/Component.js";import ContentSlider from"./components/ContentSlider.js";import Dialog from"./components/Dialog.js";import DirectoryViewer from"./components/DirectoryViewer.js";import FocusCapture from"./components/FocusCapture.js";import Icon from"./components/Icon.js";import Import from"./components/Import.js";import LazyComponent from"./components/LazyComponent.js";import ReactiveComponent from"./components/ReactiveComponent.js";import ReactiveLazyComponent from"./components/ReactiveLazyComponent.js";import Resize from"./components/Resize.js";import Search from"./components/Search.js";import ShowMore from"./components/ShowMore.js";import SideMenu from"./components/SideMenu.js";import Split from"./components/Split.js";import Table from"./components/Table.js";import Tabs from"./components/Tabs.js";import Tags from"./components/Tags.js";import ThemeSwitcher from"./components/ThemeSwitcher.js";import Timestamp from"./components/Timestamp.js";import Toggle from"./components/Toggle.js";import cli from"./utils/cli.js";import cookie from"./utils/cookie.js";import debounce from"./utils/debounce.js";import drag from"./utils/drag.js";import element from"./utils/element.js";import files from"./utils/files.js";import formatTimestamp from"./utils/formatTimestamp.js";import fuzzyMatch from"./utils/fuzzyMatch.js";import getPreferredTheme from"./utils/getPreferredTheme.js";import loadCss from"./utils/loadCss.js";import loadScript from"./utils/loadScript.js";import object from"./utils/object.js";import string from"./utils/string.js";import toFunction from"./utils/toFunction.js";import type from"./utils/type.js";import waitFrames from"./utils/waitFrames.js";import watchDirectoryHandle from"./utils/watchDirectoryHandle.js";export default{Card:Card,Component:Component,ContentSlider:ContentSlider,Dialog:Dialog,DirectoryViewer:DirectoryViewer,FocusCapture:FocusCapture,Icon:Icon,Import:Import,LazyComponent:LazyComponent,ReactiveComponent:ReactiveComponent,ReactiveLazyComponent:ReactiveLazyComponent,Resize:Resize,Search:Search,ShowMore:ShowMore,SideMenu:SideMenu,Split:Split,Table:Table,Tabs:Tabs,Tags:Tags,ThemeSwitcher:ThemeSwitcher,Timestamp:Timestamp,Toggle:Toggle,cli:cli,cookie:cookie,debounce:debounce,drag:drag,element:element,files:files,formatTimestamp:formatTimestamp,fuzzyMatch:fuzzyMatch,getPreferredTheme:getPreferredTheme,loadCss:loadCss,loadScript:loadScript,object:object,string:string,toFunction:toFunction,type:type,waitFrames:waitFrames,watchDirectoryHandle:watchDirectoryHandle};
+import Accordion from"./components/Accordion.js";import Card from"./components/Card.js";import Component from"./components/Component.js";import ContentSlider from"./components/ContentSlider.js";import Dialog from"./components/Dialog.js";import DirectoryViewer from"./components/DirectoryViewer.js";import FocusCapture from"./components/FocusCapture.js";import Icon from"./components/Icon.js";import Import from"./components/Import.js";import LazyComponent from"./components/LazyComponent.js";import ReactiveComponent from"./components/ReactiveComponent.js";import ReactiveLazyComponent from"./components/ReactiveLazyComponent.js";import Resize from"./components/Resize.js";import Search from"./components/Search.js";import ShowMore from"./components/ShowMore.js";import SideMenu from"./components/SideMenu.js";import Split from"./components/Split.js";import Stacks from"./components/Stacks.js";import Table from"./components/Table.js";import Tabs from"./components/Tabs.js";import Tags from"./components/Tags.js";import ThemeSwitcher from"./components/ThemeSwitcher.js";import Timestamp from"./components/Timestamp.js";import Toggle from"./components/Toggle.js";import cli from"./utils/cli.js";import cookie from"./utils/cookie.js";import debounce from"./utils/debounce.js";import drag from"./utils/drag.js";import element from"./utils/element.js";import files from"./utils/files.js";import formatTimestamp from"./utils/formatTimestamp.js";import fuzzyMatch from"./utils/fuzzyMatch.js";import getPreferredTheme from"./utils/getPreferredTheme.js";import loadCss from"./utils/loadCss.js";import loadScript from"./utils/loadScript.js";import object from"./utils/object.js";import raf from"./utils/raf.js";import string from"./utils/string.js";import toFunction from"./utils/toFunction.js";import type from"./utils/type.js";import waitFrames from"./utils/waitFrames.js";import watchDirectoryHandle from"./utils/watchDirectoryHandle.js";export default{Accordion:Accordion,Card:Card,Component:Component,ContentSlider:ContentSlider,Dialog:Dialog,DirectoryViewer:DirectoryViewer,FocusCapture:FocusCapture,Icon:Icon,Import:Import,LazyComponent:LazyComponent,ReactiveComponent:ReactiveComponent,ReactiveLazyComponent:ReactiveLazyComponent,Resize:Resize,Search:Search,ShowMore:ShowMore,SideMenu:SideMenu,Split:Split,Stacks:Stacks,Table:Table,Tabs:Tabs,Tags:Tags,ThemeSwitcher:ThemeSwitcher,Timestamp:Timestamp,Toggle:Toggle,cli:cli,cookie:cookie,debounce:debounce,drag:drag,element:element,files:files,formatTimestamp:formatTimestamp,fuzzyMatch:fuzzyMatch,getPreferredTheme:getPreferredTheme,loadCss:loadCss,loadScript:loadScript,object:object,raf:raf,string:string,toFunction:toFunction,type:type,waitFrames:waitFrames,watchDirectoryHandle:watchDirectoryHandle};

package/docs/kempo/kempo-styles.css

@@ -1 +1 @@
-/* Reset*/*, *::before, *::after{font-family:inherit;box-sizing:border-box;line-height:var(--line-height)}body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, dt, blockquote, pre, code{margin:0;padding:0.1px}html{font-family:var(--ff_body);font-size:var(--fs_base);font-weight:var(--fw_base);color:var(--tc)}::selection{background:var(--c_highlight)}body{min-height:100vh;background-color:var(--c_bg);color:var(--tc);overflow-y:scroll;font-family:var(--ff_body);position:relative}main, .container{max-width:var(--container_width);margin-left:auto;margin-right:auto;padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer)}nav > a,nav > .link{display:inline-block;padding:var(--spacer) !important;text-decoration:none}menu{margin:0;padding:0}menu a{display:block;padding:var(--spacer_q);text-decoration:none;color:inherit}summary{cursor:pointer;margin-bottom:var(--sapcer);outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:var(--radius)}summary:focus{box-shadow:var(--focus_shadow)}/* Display / Flex*/.d-b{display:block !important}.d-ib{display:inline-block !important}.d-g{display:grid !important}.d-i{display:inline !important}.d-n{display:none !important}.d-f{display:flex !important;flex-wrap:wrap}.d-if{display:inline-flex !important;flex-wrap:wrap}.flex, .flex-1{flex:1 1 auto}.flex-0{flex:0 0}.flex-2{flex:2 2 auto}.flex-3{flex:3 3 auto}.flex-4{flex:4 4 auto}.flex-5{flex:5 5 auto}.flex-6{flex:6 6 auto}.flex-7{flex:7 7 auto}.flex-8{flex:8 8 auto}.flex-9{flex:9 9 auto}.flex-10{flex:10 10 auto}@media (min-width:1024px){.d-d-b{display:block !important}.d-d-ib{display:inline-block !important}.d-d-g{display:grid !important}.d-d-i{display:inline !important}.d-d-n{display:none !important}.d-d-if{display:inline-flex !important;flex-wrap:wrap}.d-d-f{display:flex !important;flex-wrap:wrap}.d-flex, .d-flex-1{flex:1 1 auto}.d-flex-0{flex:0 0}.d-flex-2{flex:2 2 auto}.d-flex-3{flex:3 3 auto}.d-flex-4{flex:4 4 auto}.d-flex-5{flex:5 5 auto}.d-flex-6{flex:6 6 auto}.d-flex-7{flex:7 7 auto}.d-flex-8{flex:8 8 auto}.d-flex-9{flex:9 9 auto}.d-flex-10{flex:10 10 auto}}@media (min-width:769px) and (max-width:1023px){.t-d-b{display:block !important}.t-d-ib{display:inline-block !important}.t-d-g{display:grid !important}.t-d-i{display:inline !important}.t-d-n{display:none !important}.t-d-if{display:inline-flex !important;flex-wrap:wrap}.t-d-f{display:flex !important;flex-wrap:wrap}.t-flex, .t-flex-1{flex:1 1 auto}.t-flex-0{flex:0 0}.t-flex-2{flex:2 2 auto}.t-flex-3{flex:3 3 auto}.t-flex-4{flex:4 4 auto}.t-flex-5{flex:5 5 auto}.t-flex-6{flex:6 6 auto}.t-flex-7{flex:7 7 auto}.t-flex-8{flex:8 8 auto}.t-flex-9{flex:9 9 auto}.t-flex-10{flex:10 10 auto}}@media (max-width:768px){.m-d-b{display:block !important}.m-d-ib{display:inline-block !important}.m-d-g{display:grid !important}.m-d-i{display:inline !important}.m-d-n{display:none !important}.m-d-if{display:inline-flex !important;flex-wrap:wrap}.m-d-f{display:flex !important;flex-wrap:wrap}.m-flex, .m-flex-1{flex:1 1 auto}.m-flex-0{flex:0 0}.m-flex-2{flex:2 2 auto}.m-flex-3{flex:3 3 auto}.m-flex-4{flex:4 4 auto}.m-flex-5{flex:5 5 auto}.m-flex-6{flex:6 6 auto}.m-flex-7{flex:7 7 auto}.m-flex-8{flex:8 8 auto}.m-flex-9{flex:9 9 auto}.m-flex-10{flex:10 10 auto}}.fixed{position:fixed;top:0;width:100%;z-index:99}/* Typography*/.small,small{font-size:var(--fs_small) !important}.large{font-size:var(--fs_large) !important}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6,b, strong{font-weight:var(--fw_bold)}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6{font-family:var(--ff_heading)}.h1, h1{font-size:var(--fs_h1)}.h2, h2{font-size:var(--fs_h2)}.h3, h3{font-size:var(--fs_h3)}.h4, h4{font-size:var(--fs_h4)}.h5, h5{font-size:var(--fs_h5)}.h6, h6{font-size:var(--fs_h6)}p, h1, h2, h3, h4, h5, h6, blockquote, ul, ol, dl, pre, hr, dd{margin-bottom:var(--spacer)}ul, ol, dl{padding-left:calc(1.5 * var(--spacer))}blockquote{border-left:2px solid var(--c_border);padding:var(--spacer)}mark{background-color:var(--c_highlight);color:inherit}.ff-mono, pre, code{font-family:var(--ff_mono)}code{background-color:var(--c_bg__alt);border-radius:var(--radius);word-break:break-word;padding:calc(0.125 * var(--spacer)) var(--spacer_q)}pre code{display:block;padding:var(--spacer);word-break:normal;overflow:auto;white-space:pre-wrap}output{display:block;border:1px solid var(--c_border);border-radius:var(--radius);padding:var(--spacer) var(--spacer) 0 var(--spacer)}.ta-left{text-align:left}.ta-center{text-align:center}.ta-right{text-align:right}a,.link{color:var(--tc_link);box-shadow:0 0 0 transparent;transition:color var(--animation_ms), box-shadow var(--animation_ms);outline:none;border-radius:var(--radius);text-decoration:var(--link_decoration)}a:hover,.link:hover{color:var(--tc_link__hover)}a:focus,.link:focus-visible{box-shadow:var(--focus_shadow)}.no-link,.no-link:hover{text-decoration:none;color:inherit}hr{border:none;border-top:1px solid var(--c_border)}small{font-size:0.75em}dl{padding:0;margin:0}dt, dd{padding-left:var(--spacer);border-left:2px solid var(--c_border)}dt{padding-top:var(--spacer_h)}dd{padding-bottom:var(--spacer_h)}dd + dd{margin-top:calc(-1 * var(--spacer));padding-top:0}li ul{margin-bottom:0}.td-n{text-decoration:none}/* Spacing, Borders and Radius*/.p, .pt, .py{padding-top:var(--spacer) !important}.p, .pr, .px{padding-right:var(--spacer) !important}.p, .pb, .py{padding-bottom:var(--spacer) !important}.p, .pl, .px{padding-left:var(--spacer) !important}.ph, .pth, .pyh{padding-top:var(--spacer_h) !important}.ph, .prh, .pxh{padding-right:var(--spacer_h) !important}.ph, .pbh, .pyh{padding-bottom:var(--spacer_h) !important}.ph, .plh, .pxh{padding-left:var(--spacer_h) !important}.pq, .ptq, .pyq{padding-top:var(--spacer_q) !important}.pq, .prq, .pxq{padding-right:var(--spacer_q) !important}.pq, .pbq, .pyq{padding-bottom:var(--spacer_q) !important}.pq, .plq, .pxq{padding-left:var(--spacer_q) !important}.p0, .pt0, .py0{padding-top:0.1px !important}.p0, .pr0, .px0{padding-right:0.1px !important}.p0, .pb0, .py0{padding-bottom:0.1px !important}.p0, .pl0, .px0{padding-left:0.1px !important}.m, .mt, .my{margin-top:var(--spacer) !important}.m, .mr, .mx{margin-right:var(--spacer) !important}.m, .mb, .my{margin-bottom:var(--spacer) !important}.m, .ml, .mx{margin-left:var(--spacer) !important}.mh, .mth, .myh{margin-top:var(--spacer_h) !important}.mh, .mrh, .mxh{margin-right:var(--spacer_h) !important}.mh, .mbh, .myh{margin-bottom:var(--spacer_h) !important}.mh, .mlh, .mxh{margin-left:var(--spacer_h) !important}.mq, .mtq, .myq{margin-top:var(--spacer_q) !important}.mq, .mrq, .mxq{margin-right:var(--spacer_q) !important}.mq, .mbq, .myq{margin-bottom:var(--spacer_q) !important}.mq, .mlq, .mxq{margin-left:var(--spacer_q) !important}.m0, .mt0, .my0{margin-top:0 !important}.m0, .mr0, .mx0{margin-right:0 !important}.m0, .mb0, .my0{margin-bottom:0 !important}.m0, .ml0, .mx0{margin-left:0 !important}.-m, .-mt, .-my{margin-top:calc(-1 * var(--spacer)) !important}.-m, .-mr, .-mx{margin-right:calc(-1 * var(--spacer)) !important}.-m, .-mb, .-my{margin-bottom:calc(-1 * var(--spacer)) !important}.-m, .-ml, .-mx{margin-left:calc(-1 * var(--spacer)) !important}.b, .bt, .by{border-top:1px solid var(--c_border) !important}.b, .br, .bx{border-right:1px solid var(--c_border) !important}.b, .bb, .by{border-bottom:1px solid var(--c_border) !important}.b, .bl, .bx{border-left:1px solid var(--c_border) !important}.b0, .bt0, .by0{border-top:none !important}.b0, .br0, .bx0{border-right:none !important}.b0, .bb0, .by0{border-bottom:none !important}.b0, .bl0, .bx0{border-left:none !important}.r, .rtl, .rt, .rl{border-top-left-radius:var(--radius) !important}.r, .rtr, .rt, .rr{border-top-right-radius:var(--radius) !important}.r, .rbr, .rb, .rr{border-bottom-right-radius:var(--radius) !important}.r, .rbl, .rb, .rl{border-bottom-left-radius:var(--radius) !important}.r0, .rtl0, .rt0, .rl0{border-top-left-radius:0 !important}.r0, .rtr0, .rt0, .rr0{border-top-right-radius:0 !important}.r0, .rbr0, .rb0, .rr0{border-bottom-right-radius:0 !important}.r0, .rbl0, .rb0, .rl0{border-bottom-left-radius:0 !important}.round{border-radius:9999rem !important}/* Rows and Columns*/.row{display:flex;flex-wrap:wrap}.col{flex:1 1}.span-1{min-width:8.333%;flex-basis:8.333%}.span-2{min-width:16.666%;flex-basis:16.666%}.span-3{min-width:25%;flex-basis:25%}.span-4{min-width:33.333%;flex-basis:33.333%}.span-5{min-width:41.666%;flex-basis:41.666%}.span-6{min-width:50%;flex-basis:50%}.span-7{min-width:58.333%;flex-basis:58.333%}.span-8{min-width:66.666%;flex-basis:66.666%}.span-9{min-width:75%;flex-basis:75%}.span-10{min-width:83.333%;flex-basis:83.333%}.span-11{min-width:91.333%;flex-basis:91.333%}.span-12{min-width:100%;flex-basis:100%}@media (min-width:1024px){.d-span-1{min-width:8.333%;flex-basis:8.333%}.d-span-2{min-width:16.666%;flex-basis:16.666%}.d-span-3{min-width:25%;flex-basis:25%}.d-span-4{min-width:33.333%;flex-basis:33.333%}.d-span-5{min-width:41.666%;flex-basis:41.666%}.d-span-6{min-width:50%;flex-basis:50%}.d-span-7{min-width:58.333%;flex-basis:58.333%}.d-span-8{min-width:66.666%;flex-basis:66.666%}.d-span-9{min-width:75%;flex-basis:75%}.d-span-10{min-width:83.333%;flex-basis:83.333%}.d-span-11{min-width:91.333%;flex-basis:91.333%}.d-span-12{min-width:100%;flex-basis:100%}}@media (min-width:769px) and (max-width:1023px){.t-span-1{min-width:8.333%;flex-basis:8.333%}.t-span-2{min-width:16.666%;flex-basis:16.666%}.t-span-3{min-width:25%;flex-basis:25%}.t-span-4{min-width:33.333%;flex-basis:33.333%}.t-span-5{min-width:41.666%;flex-basis:41.666%}.t-span-6{min-width:50%;flex-basis:50%}.t-span-7{min-width:58.333%;flex-basis:58.333%}.t-span-8{min-width:66.666%;flex-basis:66.666%}.t-span-9{min-width:75%;flex-basis:75%}.t-span-10{min-width:83.333%;flex-basis:83.333%}.t-span-11{min-width:91.333%;flex-basis:91.333%}.t-span-12{min-width:100%;flex-basis:100%}}@media (max-width:768px){.m-span-1{min-width:8.333%;flex-basis:8.333%}.m-span-2{min-width:16.666%;flex-basis:16.666%}.m-span-3{min-width:25%;flex-basis:25%}.m-span-4{min-width:33.333%;flex-basis:33.333%}.m-span-5{min-width:41.666%;flex-basis:41.666%}.m-span-6{min-width:50%;flex-basis:50%}.m-span-7{min-width:58.333%;flex-basis:58.333%}.m-span-8{min-width:66.666%;flex-basis:66.666%}.m-span-9{min-width:75%;flex-basis:75%}.m-span-10{min-width:83.333%;flex-basis:83.333%}.m-span-11{min-width:91.333%;flex-basis:91.333%}.m-span-12{min-width:100%;flex-basis:100%}}.cols-2{grid-template-columns:repeat(2, 1fr)}.cols-3{grid-template-columns:repeat(3, 1fr)}.cols-4{grid-template-columns:repeat(4, 1fr)}.cols-5{grid-template-columns:repeat(5, 1fr)}.cols-6{grid-template-columns:repeat(6, 1fr)}.cols-7{grid-template-columns:repeat(7, 1fr)}.cols-8{grid-template-columns:repeat(8, 1fr)}.cols-9{grid-template-columns:repeat(9, 1fr)}.cols-10{grid-template-columns:repeat(10, 1fr)}@media (min-width:1024px){.d-cols-2{grid-template-columns:repeat(2, 1fr)}.d-cols-3{grid-template-columns:repeat(3, 1fr)}.d-cols-4{grid-template-columns:repeat(4, 1fr)}.d-cols-5{grid-template-columns:repeat(5, 1fr)}.d-cols-6{grid-template-columns:repeat(6, 1fr)}.d-cols-7{grid-template-columns:repeat(7, 1fr)}.d-cols-8{grid-template-columns:repeat(8, 1fr)}.d-cols-9{grid-template-columns:repeat(9, 1fr)}.d-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (min-width:769px) and (max-width:1023px){.t-cols-2{grid-template-columns:repeat(2, 1fr)}.t-cols-3{grid-template-columns:repeat(3, 1fr)}.t-cols-4{grid-template-columns:repeat(4, 1fr)}.t-cols-5{grid-template-columns:repeat(5, 1fr)}.t-cols-6{grid-template-columns:repeat(6, 1fr)}.t-cols-7{grid-template-columns:repeat(7, 1fr)}.t-cols-8{grid-template-columns:repeat(8, 1fr)}.t-cols-9{grid-template-columns:repeat(9, 1fr)}.t-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (max-width:768px){.m-cols-2{grid-template-columns:repeat(2, 1fr)}.m-cols-3{grid-template-columns:repeat(3, 1fr)}.m-cols-4{grid-template-columns:repeat(4, 1fr)}.m-cols-5{grid-template-columns:repeat(5, 1fr)}.m-cols-6{grid-template-columns:repeat(6, 1fr)}.m-cols-7{grid-template-columns:repeat(7, 1fr)}.m-cols-8{grid-template-columns:repeat(8, 1fr)}.m-cols-9{grid-template-columns:repeat(9, 1fr)}.m-cols-10{grid-template-columns:repeat(10, 1fr)}}/* Buttons*/button:not(.no-btn):not(.no-style),.btn,input[type="button"],input[type="submit"],input[type="reset"]{display:inline-block;padding:var(--btn_padding);background-color:var(--btn_bg);border:1px solid var(--btn_border);cursor:pointer;outline:none;border-radius:var(--radius);color:var(--btn_tc);transition:background-color var(--animation_ms), box-shadow var(--animation_ms);text-decoration:none;box-shadow:var(--btn_box_shadow);font-size:inherit;vertical-align:middle}button:not(.no-btn):not(.no-style):hover,.btn:hover,input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover{background-color:var(--btn_bg__hover);color:var(--btn_tc);box-shadow:var(--btn_box_shadow__hover)}button:not(.no-btn):not(.no-style):focus,.btn:focus,input[type="button"]:focus,input[type="submit"]:focus,input[type="reset"]:focus{box-shadow:var(--btn_box_shadow__hover), var(--focus_shadow);z-index:1}button:not(.no-btn):not(.no-style):disabled,.btn[disabled],input[type="button"]:disabled,input[type="submit"]:disabled,input[type="reset"]:disabled{opacity:0.6}button:not(.no-btn).primary,.btn.primary,input[type="button"].primary,input[type="submit"].primary,input[type="reset"].primary{background-color:var(--c_primary);--btn_tc:var(--tc_on_primary)}button:not(.no-btn).primary:hover,.btn.primary:hover,input[type="button"].primary:hover,input[type="submit"].primary:hover,input[type="reset"].primary:hover{background-color:var(--c_primary__hover)}button:not(.no-btn).secondary,.btn.secondary,input[type="button"].secondary,input[type="submit"].secondary,input[type="reset"].secondary{background-color:var(--c_secondary);--btn_tc:var(--tc_on_secondary)}button:not(.no-btn).secondary:hover,.btn.secondary:hover,input[type="button"].secondary:hover,input[type="submit"].secondary:hover,input[type="reset"].secondary:hover{background-color:var(--c_secondary__hover)}button:not(.no-btn).success,.btn.success,input[type="button"].success,input[type="submit"].success,input[type="reset"].success{background-color:var(--c_success);--btn_tc:var(--tc_on_success)}button:not(.no-btn).success:hover,.btn.success:hover,input[type="button"].success:hover,input[type="submit"].success:hover,input[type="reset"].success:hover{background-color:var(--c_success__hover)}button:not(.no-btn).warning,.btn.warning,input[type="button"].warning,input[type="submit"].warning,input[type="reset"].warning{background-color:var(--c_warning);--btn_tc:var(--tc_on_warning)}button:not(.no-btn).warning:hover,.btn.warning:hover,input[type="button"].warning:hover,input[type="submit"].warning:hover,input[type="reset"].warning:hover{background-color:var(--c_warning__hover)}button:not(.no-btn).danger,.btn.danger,input[type="button"].danger,input[type="submit"].danger,input[type="reset"].danger{background-color:var(--c_danger);--btn_tc:var(--tc_on_danger)}button:not(.no-btn).danger:hover,.btn.danger:hover,input[type="button"].danger:hover,input[type="submit"].danger:hover,input[type="reset"].danger:hover{background-color:var(--c_danger__hover)}button:not(.no-btn):not(.no-style).link,.btn.link,input[type="button"].link,input[type="submit"].link,input[type="reset"].link{background-color:transparent;color:inherit;box-shadow:0 0 0 transparent;border:none;padding:0.1px;font-size:inherit}.btn-grp{display:inline-flex}.btn-grp button:not(.no-btn):not(:first-child),.btn-grp .btn:not(:first-child),.btn-grp input[type="button"]:not(:first-child),.btn-grp input[type="submit"]:not(:first-child),.btn-grp input[type="reset"]:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;border-left:1px solid rgba(0, 0, 0, 0.25)}.btn-grp button:not(.no-btn):not(:last-child),.btn-grp .btn:not(:last-child),.btn-grp input[type="button"]:not(:last-child),.btn-grp input[type="submit"]:not(:last-child),.btn-grp input[type="reset"]:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.no-btn{display:inline;border:none;background-color:transparent;padding:0;font-size:inherit;font-family:inherit;cursor:pointer;outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:0;text-align:left;color:inherit}.no-btn:focus{box-shadow:var(--focus_shadow)}.full{display:block;width:100%}/* Inputs*/input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]),select,textarea{display:block;width:100%;background-color:var(--input_bg);color:var(--input_tc);border:var(--input_border_width) solid var(--c_border);padding:var(--input_padding);border-radius:var(--radius);outline:none;transition:box-shadow var(--animation_ms)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):focus,select:focus,textarea:focus,input[type="checkbox"]:focus,input[type="radio"]:focus{box-shadow:var(--focus_shadow)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):disabled,select:disabled,textarea:disabled,input[type="checkbox"]:disabled,input[type="radio"]:disabled{opacity:0.6}textarea,select[multiple]{resize:vertical;max-height:75vh;height:6rem;min-height:4rem}select[multiple]{height:8rem}select{cursor:pointer}label{display:block;cursor:pointer;padding-bottom:var(--spacer_h)}label.checkbox,label.radio{display:inline-block;vertical-align:top;width:calc(100% - 1em - (2 * var(--spacer_h)) - 6px);margin-top:2px}input[type="checkbox"],input[type="radio"]{display:inline-block;width:1em;height:1em;cursor:pointer;vertical-align:top;outline:none;accent-color:var(--c_input_accent);margin:var(--spacer_q) var(--spacer_h)}select option{padding:var(--spacer_h) var(--spacer)}select[multiple]{padding:0.1px}select[multiple] option{padding:var(--spacer_h) var(--spacer)}input[type="color"]{padding:0 !important;height:2.35em}input[type="color"]::-webkit-color-swatch-wrapper{padding:0}input[type="color"]::-webkit-color-swatch{border-radius:var(--radius, 0.25rem);cursor:pointer}/* Tables*/.table-wrapper{overflow-x:auto}table{width:100%;border-spacing:0}th{font-weight:var(--fw_bold);text-align:left;background-color:var(--c_bg__alt);border-top:1px solid var(--c_border)}th, td{padding:var(--spacer_h) var(--spacer);border-bottom:1px solid var(--c_border);border-left:1px solid var(--c_border)}th:last-child,td:last-child{border-right:1px solid var(--c_border)}th:first-child{border-top-left-radius:var(--radius)}th:last-child{border-top-right-radius:var(--radius)}tr:last-child td:first-child{border-bottom-left-radius:var(--radius)}tr:last-child td:last-child{border-bottom-right-radius:var(--radius)}/* Colors*/.bg-default{background-color:var(--c_bg);color:var(--tc)}.bg-alt{background-color:var(--c_bg__alt);color:var(--tc)}.bg-inv{--c_primary:var(--c_primary__inv);--c_primary__hover:var(--c_primary__inv__hover);--c_secondary:var(--c_secondary__inv);--c_secondary__hover:var(--c_secondary__inv__hover);--c_success:var(--c_success__inv);--c_success__hover:var(--c_success__inv__hover);--c_warning:var(--c_warning__inv);--c_warning__hover:var(--c_warning__inv__hover);--c_danger:var(--c_danger__inv);--c_danger__hover:var(--c_danger__inv__hover);--tc_link:var(--tc_link__inv);--tc_link__hover:var(--tc_link__inv__hover);background-color:var(--c_bg__inv);color:var(--tc_inv)}.bg-primary{--tc_link:var(--tc_on_primary);--tc_link__hover:var(--tc_on_primary);--c_border:var(--tc_on_primary);background-color:var(--c_primary);color:var(--tc_on_primary);--focus_shadow:var(--focus_shadow_on_primary)}.bg-secondary{--tc_link:var(--tc_on_secondary);--tc_link__hover:var(--tc_on_secondary);background-color:var(--c_secondary);color:var(--tc_on_secondary)}.bg-success{--tc_link:var(--tc_on_success);--tc_link__hover:var(--tc_on_success);background-color:var(--c_success);color:var(--tc_on_success)}.bg-warning{--tc_link:var(--tc_on_warning);--tc_link__hover:var(--tc_on_warning);background-color:var(--c_warning);color:var(--tc_on_warning)}.bg-danger{--tc_link:var(--tc_on_danger);--tc_link__hover:var(--tc_on_danger);background-color:var(--c_danger);color:var(--tc_on_danger)}.tc-default{color:var(--tc)}.tc-inv{color:var(--tc__inv)}.tc-primary{color:var(--tc_primary)}.is-inv .tc-primary,.bg-inv .tc-primary{color:var(--tc_primary__inv)}.tc-secondary{color:var(--tc_secondary)}.is-inv .tc-secondary,.bg-inv .tc-secondary{color:var(--tc_secondary__inv)}.tc-success{color:var(--tc_success)}.is-inv .tc-success,.bg-inv .tc-success{color:var(--tc_success__inv)}.tc-warning{color:var(--tc_warning)}.is-inv .tc-warning,.bg-inv .tc-warning{color:var(--tc_warning__inv)}.tc-danger{color:var(--tc_danger)}.is-inv .tc-danger,.bg-inv .tc-danger{color:var(--tc_danger__inv)}.tc-muted{color:var(--tc_muted)}/* Misc*/.card{border:1px solid var(--c_border);border-radius:var(--radius);padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer);margin-bottom:var(--spacer)}.drop-shadow{box-shadow:var(--drop_shadow)}.icon{display:inline-block;width:1.35em;vertical-align:top;margin-left:auto;margin-right:auto}iframe{border:none;width:100%}
+/* Reset*/:root{interpolate-size:allow-keywords}*, *::before, *::after{font-family:inherit;box-sizing:border-box;line-height:var(--line-height)}body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, dt, blockquote, pre, code{margin:0;padding:0.1px}html{font-family:var(--ff_body);font-size:var(--fs_base);font-weight:var(--fw_base);color:var(--tc)}::selection{background:var(--c_highlight)}body{min-height:100vh;background-color:var(--c_bg);color:var(--tc);overflow-y:scroll;font-family:var(--ff_body);position:relative}main, .container{max-width:var(--container_width);margin-left:auto;margin-right:auto;padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer)}nav > a,nav > .link{display:inline-block;padding:var(--spacer) !important;text-decoration:none}menu{margin:0;padding:0}menu a{display:block;padding:var(--spacer_q);text-decoration:none;color:inherit}summary{cursor:pointer;margin-bottom:var(--sapcer);outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:var(--radius)}summary:focus{box-shadow:var(--focus_shadow)}/* Display / Flex*/.d-b{display:block !important}.d-ib{display:inline-block !important}.d-g{display:grid !important}.d-i{display:inline !important}.d-n{display:none !important}.d-f{display:flex !important;flex-wrap:wrap}.d-if{display:inline-flex !important;flex-wrap:wrap}.flex, .flex-1{flex:1 1 auto}.flex-0{flex:0 0}.flex-2{flex:2 2 auto}.flex-3{flex:3 3 auto}.flex-4{flex:4 4 auto}.flex-5{flex:5 5 auto}.flex-6{flex:6 6 auto}.flex-7{flex:7 7 auto}.flex-8{flex:8 8 auto}.flex-9{flex:9 9 auto}.flex-10{flex:10 10 auto}@media (min-width:1024px){.d-d-b{display:block !important}.d-d-ib{display:inline-block !important}.d-d-g{display:grid !important}.d-d-i{display:inline !important}.d-d-n{display:none !important}.d-d-if{display:inline-flex !important;flex-wrap:wrap}.d-d-f{display:flex !important;flex-wrap:wrap}.d-flex, .d-flex-1{flex:1 1 auto}.d-flex-0{flex:0 0}.d-flex-2{flex:2 2 auto}.d-flex-3{flex:3 3 auto}.d-flex-4{flex:4 4 auto}.d-flex-5{flex:5 5 auto}.d-flex-6{flex:6 6 auto}.d-flex-7{flex:7 7 auto}.d-flex-8{flex:8 8 auto}.d-flex-9{flex:9 9 auto}.d-flex-10{flex:10 10 auto}}@media (min-width:769px) and (max-width:1023px){.t-d-b{display:block !important}.t-d-ib{display:inline-block !important}.t-d-g{display:grid !important}.t-d-i{display:inline !important}.t-d-n{display:none !important}.t-d-if{display:inline-flex !important;flex-wrap:wrap}.t-d-f{display:flex !important;flex-wrap:wrap}.t-flex, .t-flex-1{flex:1 1 auto}.t-flex-0{flex:0 0}.t-flex-2{flex:2 2 auto}.t-flex-3{flex:3 3 auto}.t-flex-4{flex:4 4 auto}.t-flex-5{flex:5 5 auto}.t-flex-6{flex:6 6 auto}.t-flex-7{flex:7 7 auto}.t-flex-8{flex:8 8 auto}.t-flex-9{flex:9 9 auto}.t-flex-10{flex:10 10 auto}}@media (max-width:768px){.m-d-b{display:block !important}.m-d-ib{display:inline-block !important}.m-d-g{display:grid !important}.m-d-i{display:inline !important}.m-d-n{display:none !important}.m-d-if{display:inline-flex !important;flex-wrap:wrap}.m-d-f{display:flex !important;flex-wrap:wrap}.m-flex, .m-flex-1{flex:1 1 auto}.m-flex-0{flex:0 0}.m-flex-2{flex:2 2 auto}.m-flex-3{flex:3 3 auto}.m-flex-4{flex:4 4 auto}.m-flex-5{flex:5 5 auto}.m-flex-6{flex:6 6 auto}.m-flex-7{flex:7 7 auto}.m-flex-8{flex:8 8 auto}.m-flex-9{flex:9 9 auto}.m-flex-10{flex:10 10 auto}}.fixed{position:fixed;top:0;width:100%;z-index:99}/* Typography*/.small,small{font-size:var(--fs_small) !important}.large{font-size:var(--fs_large) !important}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6,b, strong{font-weight:var(--fw_bold)}h1, h2, h3, h4, h5, h6,.h1, .h2, .h3, .h4, .h5, .h6{font-family:var(--ff_heading)}.h1, h1{font-size:var(--fs_h1)}.h2, h2{font-size:var(--fs_h2)}.h3, h3{font-size:var(--fs_h3)}.h4, h4{font-size:var(--fs_h4)}.h5, h5{font-size:var(--fs_h5)}.h6, h6{font-size:var(--fs_h6)}p, h1, h2, h3, h4, h5, h6, blockquote, ul, ol, dl, pre, hr, dd{margin-bottom:var(--spacer)}ul, ol, dl{padding-left:calc(1.5 * var(--spacer))}blockquote{border-left:2px solid var(--c_border);padding:var(--spacer)}mark{background-color:var(--c_highlight);color:inherit}.ff-mono, pre, code{font-family:var(--ff_mono)}code{background-color:var(--c_bg__alt);border-radius:var(--radius);word-break:break-word;padding:calc(0.125 * var(--spacer)) var(--spacer_q)}pre code{display:block;padding:var(--spacer);word-break:normal;overflow:auto;white-space:pre-wrap}output{display:block;border:1px solid var(--c_border);border-radius:var(--radius);padding:var(--spacer) var(--spacer) 0 var(--spacer)}.ta-left{text-align:left}.ta-center{text-align:center}.ta-right{text-align:right}a,.link{color:var(--tc_link);box-shadow:0 0 0 transparent;transition:color var(--animation_ms), box-shadow var(--animation_ms);outline:none;border-radius:var(--radius);text-decoration:var(--link_decoration)}a:hover,.link:hover{color:var(--tc_link__hover)}a:focus,.link:focus-visible{box-shadow:var(--focus_shadow)}.no-link,.no-link:hover{text-decoration:none;color:inherit}hr{border:none;border-top:1px solid var(--c_border)}small{font-size:0.75em}dl{padding:0;margin:0}dt, dd{padding-left:var(--spacer);border-left:2px solid var(--c_border)}dt{padding-top:var(--spacer_h)}dd{padding-bottom:var(--spacer_h)}dd + dd{margin-top:calc(-1 * var(--spacer));padding-top:0}li ul{margin-bottom:0}.td-n{text-decoration:none}/* Spacing, Borders and Radius*/.p, .pt, .py{padding-top:var(--spacer) !important}.p, .pr, .px{padding-right:var(--spacer) !important}.p, .pb, .py{padding-bottom:var(--spacer) !important}.p, .pl, .px{padding-left:var(--spacer) !important}.ph, .pth, .pyh{padding-top:var(--spacer_h) !important}.ph, .prh, .pxh{padding-right:var(--spacer_h) !important}.ph, .pbh, .pyh{padding-bottom:var(--spacer_h) !important}.ph, .plh, .pxh{padding-left:var(--spacer_h) !important}.pq, .ptq, .pyq{padding-top:var(--spacer_q) !important}.pq, .prq, .pxq{padding-right:var(--spacer_q) !important}.pq, .pbq, .pyq{padding-bottom:var(--spacer_q) !important}.pq, .plq, .pxq{padding-left:var(--spacer_q) !important}.p0, .pt0, .py0{padding-top:0.1px !important}.p0, .pr0, .px0{padding-right:0.1px !important}.p0, .pb0, .py0{padding-bottom:0.1px !important}.p0, .pl0, .px0{padding-left:0.1px !important}.m, .mt, .my{margin-top:var(--spacer) !important}.m, .mr, .mx{margin-right:var(--spacer) !important}.m, .mb, .my{margin-bottom:var(--spacer) !important}.m, .ml, .mx{margin-left:var(--spacer) !important}.mh, .mth, .myh{margin-top:var(--spacer_h) !important}.mh, .mrh, .mxh{margin-right:var(--spacer_h) !important}.mh, .mbh, .myh{margin-bottom:var(--spacer_h) !important}.mh, .mlh, .mxh{margin-left:var(--spacer_h) !important}.mq, .mtq, .myq{margin-top:var(--spacer_q) !important}.mq, .mrq, .mxq{margin-right:var(--spacer_q) !important}.mq, .mbq, .myq{margin-bottom:var(--spacer_q) !important}.mq, .mlq, .mxq{margin-left:var(--spacer_q) !important}.m0, .mt0, .my0{margin-top:0 !important}.m0, .mr0, .mx0{margin-right:0 !important}.m0, .mb0, .my0{margin-bottom:0 !important}.m0, .ml0, .mx0{margin-left:0 !important}.-m, .-mt, .-my{margin-top:calc(-1 * var(--spacer)) !important}.-m, .-mr, .-mx{margin-right:calc(-1 * var(--spacer)) !important}.-m, .-mb, .-my{margin-bottom:calc(-1 * var(--spacer)) !important}.-m, .-ml, .-mx{margin-left:calc(-1 * var(--spacer)) !important}.b, .bt, .by{border-top:1px solid var(--c_border) !important}.b, .br, .bx{border-right:1px solid var(--c_border) !important}.b, .bb, .by{border-bottom:1px solid var(--c_border) !important}.b, .bl, .bx{border-left:1px solid var(--c_border) !important}.b0, .bt0, .by0{border-top:none !important}.b0, .br0, .bx0{border-right:none !important}.b0, .bb0, .by0{border-bottom:none !important}.b0, .bl0, .bx0{border-left:none !important}.r, .rtl, .rt, .rl{border-top-left-radius:var(--radius) !important}.r, .rtr, .rt, .rr{border-top-right-radius:var(--radius) !important}.r, .rbr, .rb, .rr{border-bottom-right-radius:var(--radius) !important}.r, .rbl, .rb, .rl{border-bottom-left-radius:var(--radius) !important}.r0, .rtl0, .rt0, .rl0{border-top-left-radius:0 !important}.r0, .rtr0, .rt0, .rr0{border-top-right-radius:0 !important}.r0, .rbr0, .rb0, .rr0{border-bottom-right-radius:0 !important}.r0, .rbl0, .rb0, .rl0{border-bottom-left-radius:0 !important}.round{border-radius:9999rem !important}/* Rows and Columns*/.row{display:flex;flex-wrap:wrap}.col{flex:1 1}.span-1{min-width:8.333%;flex-basis:8.333%}.span-2{min-width:16.666%;flex-basis:16.666%}.span-3{min-width:25%;flex-basis:25%}.span-4{min-width:33.333%;flex-basis:33.333%}.span-5{min-width:41.666%;flex-basis:41.666%}.span-6{min-width:50%;flex-basis:50%}.span-7{min-width:58.333%;flex-basis:58.333%}.span-8{min-width:66.666%;flex-basis:66.666%}.span-9{min-width:75%;flex-basis:75%}.span-10{min-width:83.333%;flex-basis:83.333%}.span-11{min-width:91.333%;flex-basis:91.333%}.span-12{min-width:100%;flex-basis:100%}@media (min-width:1024px){.d-span-1{min-width:8.333%;flex-basis:8.333%}.d-span-2{min-width:16.666%;flex-basis:16.666%}.d-span-3{min-width:25%;flex-basis:25%}.d-span-4{min-width:33.333%;flex-basis:33.333%}.d-span-5{min-width:41.666%;flex-basis:41.666%}.d-span-6{min-width:50%;flex-basis:50%}.d-span-7{min-width:58.333%;flex-basis:58.333%}.d-span-8{min-width:66.666%;flex-basis:66.666%}.d-span-9{min-width:75%;flex-basis:75%}.d-span-10{min-width:83.333%;flex-basis:83.333%}.d-span-11{min-width:91.333%;flex-basis:91.333%}.d-span-12{min-width:100%;flex-basis:100%}}@media (min-width:769px) and (max-width:1023px){.t-span-1{min-width:8.333%;flex-basis:8.333%}.t-span-2{min-width:16.666%;flex-basis:16.666%}.t-span-3{min-width:25%;flex-basis:25%}.t-span-4{min-width:33.333%;flex-basis:33.333%}.t-span-5{min-width:41.666%;flex-basis:41.666%}.t-span-6{min-width:50%;flex-basis:50%}.t-span-7{min-width:58.333%;flex-basis:58.333%}.t-span-8{min-width:66.666%;flex-basis:66.666%}.t-span-9{min-width:75%;flex-basis:75%}.t-span-10{min-width:83.333%;flex-basis:83.333%}.t-span-11{min-width:91.333%;flex-basis:91.333%}.t-span-12{min-width:100%;flex-basis:100%}}@media (max-width:768px){.m-span-1{min-width:8.333%;flex-basis:8.333%}.m-span-2{min-width:16.666%;flex-basis:16.666%}.m-span-3{min-width:25%;flex-basis:25%}.m-span-4{min-width:33.333%;flex-basis:33.333%}.m-span-5{min-width:41.666%;flex-basis:41.666%}.m-span-6{min-width:50%;flex-basis:50%}.m-span-7{min-width:58.333%;flex-basis:58.333%}.m-span-8{min-width:66.666%;flex-basis:66.666%}.m-span-9{min-width:75%;flex-basis:75%}.m-span-10{min-width:83.333%;flex-basis:83.333%}.m-span-11{min-width:91.333%;flex-basis:91.333%}.m-span-12{min-width:100%;flex-basis:100%}}.cols-2{grid-template-columns:repeat(2, 1fr)}.cols-3{grid-template-columns:repeat(3, 1fr)}.cols-4{grid-template-columns:repeat(4, 1fr)}.cols-5{grid-template-columns:repeat(5, 1fr)}.cols-6{grid-template-columns:repeat(6, 1fr)}.cols-7{grid-template-columns:repeat(7, 1fr)}.cols-8{grid-template-columns:repeat(8, 1fr)}.cols-9{grid-template-columns:repeat(9, 1fr)}.cols-10{grid-template-columns:repeat(10, 1fr)}@media (min-width:1024px){.d-cols-2{grid-template-columns:repeat(2, 1fr)}.d-cols-3{grid-template-columns:repeat(3, 1fr)}.d-cols-4{grid-template-columns:repeat(4, 1fr)}.d-cols-5{grid-template-columns:repeat(5, 1fr)}.d-cols-6{grid-template-columns:repeat(6, 1fr)}.d-cols-7{grid-template-columns:repeat(7, 1fr)}.d-cols-8{grid-template-columns:repeat(8, 1fr)}.d-cols-9{grid-template-columns:repeat(9, 1fr)}.d-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (min-width:769px) and (max-width:1023px){.t-cols-2{grid-template-columns:repeat(2, 1fr)}.t-cols-3{grid-template-columns:repeat(3, 1fr)}.t-cols-4{grid-template-columns:repeat(4, 1fr)}.t-cols-5{grid-template-columns:repeat(5, 1fr)}.t-cols-6{grid-template-columns:repeat(6, 1fr)}.t-cols-7{grid-template-columns:repeat(7, 1fr)}.t-cols-8{grid-template-columns:repeat(8, 1fr)}.t-cols-9{grid-template-columns:repeat(9, 1fr)}.t-cols-10{grid-template-columns:repeat(10, 1fr)}}@media (max-width:768px){.m-cols-2{grid-template-columns:repeat(2, 1fr)}.m-cols-3{grid-template-columns:repeat(3, 1fr)}.m-cols-4{grid-template-columns:repeat(4, 1fr)}.m-cols-5{grid-template-columns:repeat(5, 1fr)}.m-cols-6{grid-template-columns:repeat(6, 1fr)}.m-cols-7{grid-template-columns:repeat(7, 1fr)}.m-cols-8{grid-template-columns:repeat(8, 1fr)}.m-cols-9{grid-template-columns:repeat(9, 1fr)}.m-cols-10{grid-template-columns:repeat(10, 1fr)}}/* Buttons*/button:not(.no-btn):not(.no-style),.btn,input[type="button"],input[type="submit"],input[type="reset"]{display:inline-block;padding:var(--btn_padding);background-color:var(--btn_bg);border:1px solid var(--btn_border);cursor:pointer;outline:none;border-radius:var(--radius);color:var(--btn_tc);transition:background-color var(--animation_ms), box-shadow var(--animation_ms);text-decoration:none;box-shadow:var(--btn_box_shadow);font-size:inherit;vertical-align:middle}button:not(.no-btn):not(.no-style):hover,.btn:hover,input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover{background-color:var(--btn_bg__hover);color:var(--btn_tc);box-shadow:var(--btn_box_shadow__hover)}button:not(.no-btn):not(.no-style):focus,.btn:focus,input[type="button"]:focus,input[type="submit"]:focus,input[type="reset"]:focus{box-shadow:var(--btn_box_shadow__hover), var(--focus_shadow);z-index:1}button:not(.no-btn):not(.no-style):disabled,.btn[disabled],input[type="button"]:disabled,input[type="submit"]:disabled,input[type="reset"]:disabled{opacity:0.6}button:not(.no-btn).primary,.btn.primary,input[type="button"].primary,input[type="submit"].primary,input[type="reset"].primary{background-color:var(--c_primary);--btn_tc:var(--tc_on_primary)}button:not(.no-btn).primary:hover,.btn.primary:hover,input[type="button"].primary:hover,input[type="submit"].primary:hover,input[type="reset"].primary:hover{background-color:var(--c_primary__hover)}button:not(.no-btn).secondary,.btn.secondary,input[type="button"].secondary,input[type="submit"].secondary,input[type="reset"].secondary{background-color:var(--c_secondary);--btn_tc:var(--tc_on_secondary)}button:not(.no-btn).secondary:hover,.btn.secondary:hover,input[type="button"].secondary:hover,input[type="submit"].secondary:hover,input[type="reset"].secondary:hover{background-color:var(--c_secondary__hover)}button:not(.no-btn).success,.btn.success,input[type="button"].success,input[type="submit"].success,input[type="reset"].success{background-color:var(--c_success);--btn_tc:var(--tc_on_success)}button:not(.no-btn).success:hover,.btn.success:hover,input[type="button"].success:hover,input[type="submit"].success:hover,input[type="reset"].success:hover{background-color:var(--c_success__hover)}button:not(.no-btn).warning,.btn.warning,input[type="button"].warning,input[type="submit"].warning,input[type="reset"].warning{background-color:var(--c_warning);--btn_tc:var(--tc_on_warning)}button:not(.no-btn).warning:hover,.btn.warning:hover,input[type="button"].warning:hover,input[type="submit"].warning:hover,input[type="reset"].warning:hover{background-color:var(--c_warning__hover)}button:not(.no-btn).danger,.btn.danger,input[type="button"].danger,input[type="submit"].danger,input[type="reset"].danger{background-color:var(--c_danger);--btn_tc:var(--tc_on_danger)}button:not(.no-btn).danger:hover,.btn.danger:hover,input[type="button"].danger:hover,input[type="submit"].danger:hover,input[type="reset"].danger:hover{background-color:var(--c_danger__hover)}button:not(.no-btn):not(.no-style).link,.btn.link,input[type="button"].link,input[type="submit"].link,input[type="reset"].link{background-color:transparent;color:inherit;box-shadow:0 0 0 transparent;border:none;padding:0.1px;font-size:inherit}.btn-grp{display:inline-flex}.btn-grp button:not(.no-btn):not(:first-child),.btn-grp .btn:not(:first-child),.btn-grp input[type="button"]:not(:first-child),.btn-grp input[type="submit"]:not(:first-child),.btn-grp input[type="reset"]:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;border-left:1px solid rgba(0, 0, 0, 0.25)}.btn-grp button:not(.no-btn):not(:last-child),.btn-grp .btn:not(:last-child),.btn-grp input[type="button"]:not(:last-child),.btn-grp input[type="submit"]:not(:last-child),.btn-grp input[type="reset"]:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.no-btn{display:inline;border:none;background-color:transparent;padding:0;font-size:inherit;font-family:inherit;cursor:pointer;outline:none;box-shadow:0 0 0 transparent;transition:box-shadow var(--animation_ms);border-radius:0;text-align:left;color:inherit}.no-btn:focus{box-shadow:var(--focus_shadow)}.full{display:block;width:100%}/* Inputs*/input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]),select,textarea{display:block;width:100%;background-color:var(--input_bg);color:var(--input_tc);border:var(--input_border_width) solid var(--c_border);padding:var(--input_padding);border-radius:var(--radius);outline:none;transition:box-shadow var(--animation_ms)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):focus,select:focus,textarea:focus,input[type="checkbox"]:focus,input[type="radio"]:focus{box-shadow:var(--focus_shadow)}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):disabled,select:disabled,textarea:disabled,input[type="checkbox"]:disabled,input[type="radio"]:disabled{opacity:0.6}textarea,select[multiple]{resize:vertical;max-height:75vh;height:6rem;min-height:4rem}select[multiple]{height:8rem}select{cursor:pointer}label{display:block;cursor:pointer;padding-bottom:var(--spacer_h)}label.checkbox,label.radio{display:inline-block;vertical-align:top;width:calc(100% - 1em - (2 * var(--spacer_h)) - 6px);margin-top:2px}input[type="checkbox"],input[type="radio"]{display:inline-block;width:1em;height:1em;cursor:pointer;vertical-align:top;outline:none;accent-color:var(--c_input_accent);margin:var(--spacer_q) var(--spacer_h)}select option{padding:var(--spacer_h) var(--spacer)}select[multiple]{padding:0.1px}select[multiple] option{padding:var(--spacer_h) var(--spacer)}input[type="color"]{padding:0 !important;height:2.35em}input[type="color"]::-webkit-color-swatch-wrapper{padding:0}input[type="color"]::-webkit-color-swatch{border-radius:var(--radius, 0.25rem);cursor:pointer}/* Tables*/.table-wrapper{overflow-x:auto}table{width:100%;border-spacing:0}th{font-weight:var(--fw_bold);text-align:left;background-color:var(--c_bg__alt);border-top:1px solid var(--c_border)}th, td{padding:var(--spacer_h) var(--spacer);border-bottom:1px solid var(--c_border);border-left:1px solid var(--c_border)}th:last-child,td:last-child{border-right:1px solid var(--c_border)}th:first-child{border-top-left-radius:var(--radius)}th:last-child{border-top-right-radius:var(--radius)}tr:last-child td:first-child{border-bottom-left-radius:var(--radius)}tr:last-child td:last-child{border-bottom-right-radius:var(--radius)}/* Colors*/.bg-default{background-color:var(--c_bg);color:var(--tc)}.bg-alt{background-color:var(--c_bg__alt);color:var(--tc)}.bg-inv{--c_primary:var(--c_primary__inv);--c_primary__hover:var(--c_primary__inv__hover);--c_secondary:var(--c_secondary__inv);--c_secondary__hover:var(--c_secondary__inv__hover);--c_success:var(--c_success__inv);--c_success__hover:var(--c_success__inv__hover);--c_warning:var(--c_warning__inv);--c_warning__hover:var(--c_warning__inv__hover);--c_danger:var(--c_danger__inv);--c_danger__hover:var(--c_danger__inv__hover);--tc_link:var(--tc_link__inv);--tc_link__hover:var(--tc_link__inv__hover);background-color:var(--c_bg__inv);color:var(--tc_inv)}.bg-primary{--tc_link:var(--tc_on_primary);--tc_link__hover:var(--tc_on_primary);--c_border:var(--tc_on_primary);background-color:var(--c_primary);color:var(--tc_on_primary);--focus_shadow:var(--focus_shadow_on_primary)}.bg-secondary{--tc_link:var(--tc_on_secondary);--tc_link__hover:var(--tc_on_secondary);background-color:var(--c_secondary);color:var(--tc_on_secondary)}.bg-success{--tc_link:var(--tc_on_success);--tc_link__hover:var(--tc_on_success);background-color:var(--c_success);color:var(--tc_on_success)}.bg-warning{--tc_link:var(--tc_on_warning);--tc_link__hover:var(--tc_on_warning);background-color:var(--c_warning);color:var(--tc_on_warning)}.bg-danger{--tc_link:var(--tc_on_danger);--tc_link__hover:var(--tc_on_danger);background-color:var(--c_danger);color:var(--tc_on_danger)}.tc-default{color:var(--tc)}.tc-inv{color:var(--tc__inv)}.tc-primary{color:var(--tc_primary)}.is-inv .tc-primary,.bg-inv .tc-primary{color:var(--tc_primary__inv)}.tc-secondary{color:var(--tc_secondary)}.is-inv .tc-secondary,.bg-inv .tc-secondary{color:var(--tc_secondary__inv)}.tc-success{color:var(--tc_success)}.is-inv .tc-success,.bg-inv .tc-success{color:var(--tc_success__inv)}.tc-warning{color:var(--tc_warning)}.is-inv .tc-warning,.bg-inv .tc-warning{color:var(--tc_warning__inv)}.tc-danger{color:var(--tc_danger)}.is-inv .tc-danger,.bg-inv .tc-danger{color:var(--tc_danger__inv)}.tc-muted{color:var(--tc_muted)}/* Misc*/.card{border:1px solid var(--c_border);border-radius:var(--radius);padding-top:var(--spacer);padding-left:var(--spacer);padding-right:var(--spacer);margin-bottom:var(--spacer)}.drop-shadow{box-shadow:var(--drop_shadow)}.icon{display:inline-block;width:1.35em;vertical-align:top;margin-left:auto;margin-right:auto}iframe{border:none;width:100%}

package/docs/kempo/utils/raf.js

@@ -0,0 +1 @@
+const raf=(a,r=1)=>{requestAnimationFrame((()=>{1===r?a():raf(a,r-1)}))};export default raf;

package/docs/nav-1.inc.html

@@ -40,6 +40,7 @@
       <a href="../components/reactivelazy-component.html">ReactiveLazyComponent</a>
       <a href="../components/focuscapture.html">FocusCapture</a>
       <hr />
+      <a href="../components/accordion.html">Accordion</a>
       <a href="../components/card.html">Card</a>
       <a href="../components/content-slider.html">Content Slider</a>
       <a href="../components/dialog.html">Dialog</a>
@@ -50,6 +51,7 @@
       <a href="../components/show-more.html">Show More</a>
       <a href="../components/sidemenu.html">Side Menu</a>
       <a href="../components/split.html">Split</a>
+      <a href="../components/stacks.html">Stack</a>
       <a href="../components/table.html">Table</a>
       <a href="../components/tabs.html">Tabs</a>
       <a href="../components/toggle.html">Toggle</a>

package/docs/nav.inc.html

@@ -40,6 +40,7 @@
       <a href="./components/reactivelazy-component.html">ReactiveLazyComponent</a>
       <a href="./components/focuscapture.html">FocusCapture</a>
       <hr />
+      <a href="./components/accordion.html">Accordion</a>
       <a href="./components/card.html">Card</a>
       <a href="./components/content-slider.html">Content Slider</a>
       <a href="./components/dialog.html">Dialog</a>
@@ -50,6 +51,7 @@
       <a href="./components/show-more.html">Show More</a>
       <a href="./components/sidemenu.html">Side Menu</a>
       <a href="./components/split.html">Split</a>
+      <a href="./components/stacks.html">Stack</a>
       <a href="./components/table.html">Table</a>
       <a href="./components/tabs.html">Tabs</a>
       <a href="./components/toggle.html">Toggle</a>

package/docs/search.json

@@ -1,4 +1,15 @@
 {
+  "/components/accordion.html": {
+    "name": "Components > Accordion",
+    "terms": [
+      "accordion",
+      "collapsible",
+      "toggle",
+      "content",
+      "panel",
+      "header"
+    ]
+  },
   "/components/component.html": {
     "name": "Components > Component",
     "terms": [
@@ -57,6 +68,17 @@
       "content"
     ]
   },
+  "/components/stacks.html": {
+    "name": "Components > Stacks",
+    "terms": [
+      "component",
+      "stacks",
+      "content",
+      "layout",
+      "collapsible",
+      "panel"
+    ]
+  },
   "/components/table.html": {
     "name": "Components > Table",
     "terms": [

package/icons/arrow-back.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path fill="currentColor" d="m313-440 224 224-57 56-320-320 320-320 57 56-224 224h487v80H313Z"/></svg>

package/icons/arrow-forward.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path fill="currentColor" d="M647-440H160v-80h487L423-744l57-56 320 320-320 320-57-56 224-224Z"/></svg>