:root{box-sizing:border-box;margin:unset;padding:unset}html,body{margin:inherit;padding:inherit}*,*:before,*:after{box-sizing:inherit}img,picture,svg,canvas{display:block;max-inline-size:100%;block-size:auto}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{width:100dvw;min-height:100dvh}body{width:inherit;min-height:inherit}:root{color-scheme:only dark}[color-scheme=light]{color-scheme:light}[color-scheme=dark]{color-scheme:dark}:lang(uk){font-family:sans-serif}html{font-size:100%}body{font-size:16px;font-family:Segoe UI,sans-serif;line-height:1.5;font-weight:400;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}h1,h2,h3,h4,h5,h6{font-family:Segoe UI,sans-serif;font-weight:500;line-height:normal;letter-spacing:.5px}h1{font-size:1.5rem;font-weight:500}h2{font-size:1.5rem}h3{font-size:1.25rem}h4,h5,h6{font-size:1rem}h{font-size:1rem}b,strong{font-weight:bolder}big{font-size:120%}small{font-size:80%}pre,code,kbd,samp{font-size:1em;font-family:Monaco,Menlo,Consolas,monospace}p,ol,ul,dl{padding:1rem}loader svg{height:8rem;width:8rem;display:grid;stroke:transparent;pointer-events:none}loader svg path:nth-child(1){animation:fade 2.2s ease-in forwards,spin 1.1s linear forwards infinite;fill:#c9e8ee;transform-origin:center}loader svg path:nth-child(2){animation:fade 2.2s ease-in forwards,spin 1.1s linear forwards infinite reverse;fill:#75c441;transform-origin:center}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fade{0%{opacity:.01}to{opacity:1}}[state=in],[state=out],[state=appear],[state=disappear]{backface-visibility:hidden;animation-fill-mode:both}[state=appear],[state=disappear]{visibility:hidden;animation-name:slotAppearDisappear;animation-duration:.01ms}[state=in],[state=out]{will-change:transform;animation-duration:.4s;animation-timing-function:cubic-bezier(0,0,.2,1)}[state=in]{animation-direction:normal}[state=out]{animation-direction:reverse}@keyframes slotAppearDisappear{0%{opacity:1}}[view=cards]{contain:layout style;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(16rem,100%),1fr));gap:.5rem;width:100%}[view=list]{display:grid;contain:layout style;gap:.5rem;max-width:25rem;width:100%}[view=list]>item{user-select:none;cursor:grab;touch-action:none;will-change:transform;display:grid;grid-template-columns:auto auto auto 1fr auto;place-content:center;gap:1rem;padding:1.25rem;border-radius:.5rem;font-size:1.5rem;text-transform:capitalize;background:#fff;color:#222;box-shadow:0 0 .125rem .125rem #0000001a}[view=list]>item>*{pointer-events:none;touch-action:none}[view=list]>item ico{width:1.125rem;height:1.125rem;opacity:.3}[view=table]{display:table;border-spacing:0;border-collapse:collapse;width:100%;table-layout:auto}[view=table] row{display:table-row}[view=table] cell{display:table-cell;vertical-align:middle;padding:.5rem}[view=table]>header{display:table-header-group;background-color:#2e8b57}[view=table]>footer{display:table-footer-group;background-color:tomato;column-span:all;padding:0;margin:0}[view=table]>section{display:table-row-group}[scope=row]:nth-of-type(odd){background-color:#505050}[placement=top]{bottom:calc(100% + .5rem);left:50%;translate:-50% 0;transform-origin:bottom center}[placement=top-start]{bottom:calc(100% + .5rem);left:0;transform-origin:bottom left}[placement=top-end]{bottom:calc(100% + .5rem);right:0;transform-origin:bottom right}[placement=bottom]{top:calc(100% + .5rem);left:50%;translate:-50% 0 0;transform-origin:top center}[placement=bottom-start]{top:calc(100% + .5rem);left:0;transform-origin:top left}[placement=bottom-end]{top:calc(100% + .5rem);right:0;transform-origin:top right}[placement=left]{right:calc(100% + .5rem);top:50%;translate:0 -50%;transform-origin:center right}[placement=left-start]{right:calc(100% + .5rem);transform-origin:top right}[placement=left-end]{bottom:0;right:calc(100% + .5rem);transform-origin:bottom right}[placement=right]{left:calc(100% + .5rem);top:50%;translate:0 -50%;transform-origin:center left}[placement=right-start]{left:calc(100% + .5rem);transform-origin:top left}[placement=right-end]{left:calc(100% + .5rem);bottom:0;transform-origin:bottom left}ico{display:grid;place-content:center center;width:1.5rem;height:1.5rem;-webkit-user-select:none;user-select:none}svg{aspect-ratio:1/1;stroke-width:.05;fill:currentColor;display:inherit;width:inherit;height:inherit;place-content:inherit;max-width:100%;max-height:100%;contain:strict}use{pointer-events:none;user-select:none}loader{display:grid;place-content:center;padding:1.5rem}button{-webkit-user-select:none;user-select:none;padding:.5rem;text-transform:uppercase;background-color:Canvas;border:.125rem solid ButtonFace}[type=radio],[type=chexckbox]{background-color:red}field{display:grid;place-content:start;place-items:center}[type=radio],[type=checkbox]{background-color:red;padding:1rem;width:1rem;height:1rem}nav{display:flex;gap:1rem;list-style:none}nav li{display:flex;list-style:inherit}bar{display:flex;gap:1.25rem;padding:1.25rem;background-color:#ff00001a}menu{isolation:isolate;appearance:none;display:flex;flex-flow:column;list-style:none;margin:unset;padding:.25rem;gap:.25rem;background-color:#0060df;box-shadow:1px 1px 4px #0003;border-radius:.25rem}menu li{width:100%;display:flex;gap:.75rem;place-items:center;margin:unset;padding:.75rem;line-height:1.25rem;border-radius:.25rem}slot{display:grid;position:absolute;user-select:none;top:0;left:0;width:100%;height:100%;background-color:#ff00001a}control{display:inline-flex;background-color:#2e8b57}dropdown{display:inline-flex;position:relative;gap:.5rem}dropdown>menu{width:max-content;position:absolute;z-index:10;box-shadow:.0625rem .0625rem 1rem #0006}popover{display:inline-flex;position:relative;gap:.5rem}popover>pop{width:max-content;position:absolute;z-index:10;box-shadow:.0625rem .0625rem 1rem #0006}menu[state=in],menu[state=out]{animation-name:dropdown}@keyframes dropdown{0%{opacity:0;transform:scale(.15)}}aside{z-index:inherit;width:100%;height:inherit;contain:layout;max-width:20rem;background-color:#000000b3;box-shadow:.0625rem .0625rem 1rem #0006}aside>header{padding:1.25rem}aside>header>button{width:1.5rem;height:1.5rem;font-size:1rem;padding:0;border-radius:.25rem}aside>section{padding:1.25rem}aside[state=in],aside[state=out]{animation-name:slotAside}@keyframes slotAside{0%{transform:translate3d(-100%,0,0)}}modal{display:grid;grid-template-rows:auto 1fr auto;z-index:inherit;position:absolute;place-self:center;padding:1.5rem;gap:1.5rem;max-width:40rem;background-color:Canvas;box-shadow:.0625rem .0625rem 1rem #0006;border-radius:.25rem}modal>header{display:grid;grid-auto-flow:column;place-content:space-between;place-items:center}modal[state=in],modal[state=out]{animation-name:slotModal}@keyframes slotModal{0%{opacity:.5;transform:translateY(-10%)}}:nth-child(1){--idx: 1}:nth-child(2){--idx: 2}:nth-child(3){--idx: 3}:nth-child(4){--idx: 4}:nth-child(5){--idx: 5}:nth-child(6){--idx: 6}:nth-child(7){--idx: 7}:nth-child(8){--idx: 8}:nth-child(9){--idx: 9}:nth-child(10){--idx: 10}:nth-last-child(1){--rev-idx: 1}:nth-last-child(2){--rev-idx: 2}:nth-last-child(3){--rev-idx: 3}:nth-last-child(4){--rev-idx: 4}:nth-last-child(5){--rev-idx: 5}:nth-last-child(6){--rev-idx: 6}:nth-last-child(7){--rev-idx: 7}:nth-last-child(8){--rev-idx: 8}:nth-last-child(9){--rev-idx: 9}:nth-last-child(10){--rev-idx: 10}toast{--d: -1;--g: .75rem;--of: .2;--sf: .05;--n: calc(var(--idx) - 1);--ty: var(--g);--z: calc(1 - var(--n));--o: calc(1 - var(--n) * var(--of));--s: calc(1 - var(--n) * var(--sf));--y: calc(var(--ty) * var(--n) * var(--d))}toaster[state=expand] toast{--ty: calc(100% + var(--g));--o: 1;--s: 1}toaster[state=expand] toast *{opacity:1}toaster{position:fixed;display:flex;left:50%;translate:-50% 0;top:20rem;z-index:100;isolation:isolate;height:max-content;width:26rem;max-width:80dvw!important;background-color:#ff14931a}toast{display:flex;place-content:space-between;place-items:center;overflow-wrap:anywhere;padding:1rem;gap:.5rem;background-color:#555;border-radius:.5rem;box-shadow:.0625rem .0625rem 1rem #0006;position:absolute;width:inherit;max-width:inherit;isolation:isolate;z-index:var(--z);opacity:var(--o);transition-property:transform,opacity;transition-duration:.4s;transition-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(var(--y)) scale(var(--s))}toast:not(:first-child) *{opacity:0;transition-property:transform,opacity;transition-duration:.4s;transition-timing-function:cubic-bezier(0,0,.2,1)}toast[state=in],toast[state=out]{animation-name:toast}@keyframes toast{0%{transform:translateY(100%);background-color:red}to{opacity:var(--o);transform:translateY(var(--y)) scale(var(--s))}}shell{display:grid;width:inherit;min-height:inherit}app{display:grid;grid-template-rows:auto 1fr auto}main{display:block}#top{display:flex;place-content:space-between;place-items:center}#bottom{display:grid;padding:1.25rem;gap:1.25rem;place-items:start}pane{display:flex;place-items:center;place-content:center;contain:layout style}counters{display:flex;flex-flow:column;gap:1rem}counters>header>button{display:flex;gap:.5rem}counters>list{user-select:none;display:grid;contain:content;content-visibility:auto;contain-intrinsic-size:1000px}counter{overflow-wrap:anywhere;display:grid;grid-auto-flow:column;grid-template-columns:1fr auto;contain:content}counter>div{padding:1rem}counter>button{width:5rem;padding:1rem;border:none;outline:none;background-color:transparent;pointer-events:auto}counter wrapper{background-color:#555;position:absolute;display:flex;place-content:center;place-items:center;contain:strict;inset:0;border-radius:.5rem}counter wrapper>*{pointer-events:none}counter[state=in],counter[state=out]{will-change:max-height,opacity}counter[state=in]{animation-name:item-in;animation-timing-function:ease-out;animation-duration:.5s}counter[state=out]{animation-name:item-out;animation-timing-function:ease-in;animation-duration:.25s}@keyframes item-in{0%{opacity:0;max-height:0}}@keyframes item-out{0%{opacity:0;max-height:0}}card{contain:content;display:grid;grid-template-rows:auto 1fr auto;padding:1rem;user-select:none;cursor:grab;touch-action:none;will-change:transform;text-transform:capitalize;background:#fff;color:#222;box-shadow:0 0 .125rem .125rem #0000001a;border-radius:1rem}card>*{pointer-events:none;touch-action:none}card>header{display:flex;place-content:space-between;font-size:1.5rem}card>header>span:first-child{display:flex;gap:1rem}card>section{display:flex;place-content:center;font-size:3rem}card>footer{display:flex;place-content:center;font-size:1.5rem}[status=active]{cursor:grabbing;z-index:100;box-shadow:0 0 .5rem .5rem #0003}[status=checked],[status=less],[status=over],[status=idle]{transition-duration:.2s;transition-timing-function:ease-out;transition-property:transform}[untouchable]{background-color:#ff0;pointer-events:none;touch-action:none}pagination{display:flex;gap:1em}