diff --git a/404.html b/404.html index 3d8cfb9..6994b8c 100644 --- a/404.html +++ b/404.html @@ -1 +1 @@ - Toolz by d3ward - 404

Not Found

Maybe you are looking for one of these toolz !
Toolz - Home
\ No newline at end of file + Toolz by d3ward - 404

Not Found

Maybe you are looking for one of these toolz !
Toolz - Home
\ No newline at end of file diff --git a/adblock.html b/adblock.html index 0e49332..c783eb4 100644 --- a/adblock.html +++ b/adblock.html @@ -1,4 +1,4 @@ - Test Ad Block - Toolz
Total :
The test may not work as expected with some browser/blocker combinations.
To ensure a smooth experience, please check the compatibility list before testing.

I ask that you please refrain from reporting them directly to the browser or adblock solution provider.
Instead, I encourage you to report problems directly to the Toolz project issues
Create issue on Toolz

  Cosmetic Filter
  Static Ad
  Dynamic Ad
Why Cosmetic Filter test fails?

If a cosmetic filter test fails, it simply means that the specific website being tested (in this case d3ward.github.io) isn't included in any of adblock's rules or lists.
It's important to note that this does not mean that cosmetic filtering fails on all websites.
You can confirm this by visiting a popular, ad-rich site where you're unlikely to see any ad boxes.
The purpose of this test is to assess the functionality of the blocking feature, not to determine its scope or coverage. By adding the following rules to your adblock solution, you may be able to solve the problem:

+         Test Ad Block - Toolz                          
Total :
The test may not work as expected with some browser/blocker combinations.
To ensure a smooth experience, please check the compatibility list before testing.

I ask that you please refrain from reporting them directly to the browser or adblock solution provider.
Instead, I encourage you to report problems directly to the Toolz project issues
Create issue on Toolz

  Cosmetic Filter
  Static Ad
  Dynamic Ad
Why Cosmetic Filter test fails?

If a cosmetic filter test fails, it simply means that the specific website being tested (in this case d3ward.github.io) isn't included in any of adblock's rules or lists.
It's important to note that this does not mean that cosmetic filtering fails on all websites.
You can confirm this by visiting a popular, ad-rich site where you're unlikely to see any ad boxes.
The purpose of this test is to assess the functionality of the blocking feature, not to determine its scope or coverage. By adding the following rules to your adblock solution, you may be able to solve the problem:

 											d3ward.github.io##.adbox.banner_ads.adsbox
 d3ward.github.io##.textads
Adding these rules could lead to a successful test result proving your adblock solution have that feature of blocking with cosmetic filters
  Ad Scripts Loading
ads.js
pagead.js
Why Ad Script Loading test fails??

Same as the cosmetic tests. If an ad script load test fails, it usually means that the specific website being tested isn't covered by any of adblock's rules or lists, especially for blocking ad-related scripts like my fake ads.js
However, this error doesn't indicate a general failure of ad script blocking on all websites.
To check, you can visit a popular website known for its abundance of ads scripts.
Chances are that you won't encounter any blocked ad scripts. It's important to understand that this test is designed to evaluate the functionality of ad script blocking, not its scope or effectiveness. To potentially fix the problem, consider adding the following rules to your adblock solution:

/pagead.js$domain=d3ward.github.io
-/widget/ads.
Adding these rules could lead to a successful test result proving your adblock solution have that feature of blocking script loading

\ No newline at end of file +/widget/ads.
Adding these rules could lead to a successful test result proving your adblock solution have that feature of blocking script loading

\ No newline at end of file diff --git a/css/adblock.css b/css/adblock.css index 091950c..60aa67d 100644 --- a/css/adblock.css +++ b/css/adblock.css @@ -1 +1 @@ -html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}img{max-width:100%}textarea{white-space:revert}hr{border:0;border-top:.1rem solid var(--brd)}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h2,h3,h5,h6{margin-top:1.5rem}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}h6{font-size:1em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h2+h3,h5+h6{margin:0}q:before{content:"“"}q q:before{content:"‘"}q q:after{content:"’"}q:after{content:"”"}summary{font-weight:bold;cursor:pointer}time{color:var(--txt);opacity:.7}small{font-size:75%}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}.cnt.full,main.full{max-width:auto}._2-col{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.5rem}.grid{flex-wrap:wrap}.row,.grid{display:flex;align-items:stretch}.row>[class*=col],.row>div,.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.row>[class*=col]>*,.row>div>*,.grid>[class*=col]>*,.grid>div>*{margin:0}.row>div,.grid>div{flex:1 1 100%}.row .col-6,.grid .col-6{width:50%}@media(max-width: 40em){.row:not(.keep-width),.grid:not(.keep-width){flex-direction:column !important}.row:not(.keep-width)>[class*=col],.row:not(.keep-width)>div,.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}button,input[type=button],input[type=reset],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],input[type=reset],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,input[type=reset]:active,input[type=reset]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,input[type=reset]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,input[type=reset]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],input[type=reset][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.outline,input[type=button].outline,input[type=reset].outline,.btn.outline{--btn-bg: transparent;color:var(--btn-brd);border:2px solid var(--focus)}button.outline:hover,input[type=button].outline:hover,input[type=reset].outline:hover,.btn.outline:hover{color:var(--btn-txt)}button.fill:hover,input[type=button].fill:hover,input[type=reset].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,input[type=reset]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-black{--btn-f: var(--black-h);--btn-brd: var(--black);--btn-bg-h: var(--black-l);--btn-bg: var(--black-l);--btn-txt: var(--white)}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-blue{--btn-f: var(--blue-h);--btn-brd: var(--blue);--btn-bg: var(--blue);--btn-bg-h: var(--blue-l);--btn-txt: var(--txt-on-blue)}.btn-red,[type=reset]{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.snackbar{position:fixed;top:-100%;left:50%;transform:translateX(-50%);background-color:var(--blue);border-radius:10px;width:400px;font-size:16px;transition:all .5s;z-index:9999;box-shadow:var(--shadow)}@media(max-width: 424px){.snackbar{width:calc(100% - 20px)}}.snackbar.success{background:var(--blue)}.snackbar div{color:var(--txt-on-blue);padding:20px 30px;text-align:center}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>img{height:auto;border-radius:var(--radius);width:100%}.card>img.full{width:calc(100% + 2rem);max-width:unset}.card>img.full:first-child{border-radius:var(--radius) var(--radius) 0 0;margin:-1rem -1rem 0 -1rem}.card>img.full:last-child{border-radius:0 0 var(--radius) var(--radius);margin:0 -1rem -1rem -1rem}.field{display:flex;justify-content:center;gap:.5rem;flex-direction:column}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,textarea[readonly],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[readonly],select:disabled,select[readonly]{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=checkbox],input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after,input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=checkbox]:checked,input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=checkbox]:disabled,input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked,input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=checkbox]:disabled+label,input[type=radio]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled),input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=checkbox]:focus,input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.toggle),input[type=radio]:not(.toggle){width:1.3rem}input[type=checkbox]:not(.toggle):after,input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=checkbox]:not(.toggle):checked,input[type=radio]:not(.toggle):checked{--o: 1}input[type=checkbox]+label,input[type=radio]+label{line-height:1.3rem;display:inline-block;vertical-align:top;cursor:pointer;margin-left:.3rem}input[type=checkbox]:not(.toggle){border-radius:.4rem}input[type=checkbox]:not(.toggle):after{width:.4rem;height:.6rem;border:.2rem solid var(--active-inner);border-top:0;border-left:0;left:.4rem;top:.2rem;transform:rotate(var(--r, 20deg))}input[type=checkbox]:not(.toggle):checked{--r: 43deg}input[type=checkbox].toggle{width:38px;border-radius:11px}input[type=checkbox].toggle:after{left:.1rem;top:.1rem;border-radius:50%;width:.9rem;height:.9rem;background:var(--ab, var(--border));transform:translateX(var(--x, 0))}input[type=checkbox].toggle:checked{--ab: var(--active-inner);--x: 1.1rem}input[type=checkbox].toggle:disabled:not(:checked):after{opacity:.6}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}code{color:var(--primary);background:var(--bg2)}pre{display:flex;box-shadow:var(--shadow);border-radius:var(--radius) !important;border-left:var(--radius) solid var(--primary);background-color:var(--bg)}pre>code{margin:0;padding:1.5rem 1rem;background-color:rgba(0,0,0,0)}code{padding:.1rem .3rem;background:var(--bg2);white-space:pre;font-size:90%;border-radius:6px}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}details{width:100%;overflow-x:hidden;display:flex;flex-flow:wrap column;border-radius:var(--radius);background:var(--bg-details)}details>summary{outline-color:initial;padding:.6rem;border-radius:var(--radius);outline:0;cursor:pointer;font-weight:500}details>summary:hover{color:var(--primary);background-color:var(--bg-details)}details>div{padding:.5rem}details[open] summary{background-color:var(--bg-details-open);color:var(--txt-details-open)}details+details{margin-top:.5rem}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._bg-red{background-color:var(--red) !important}._bg-green{background-color:var(--green) !important}._bg-orange{background-color:var(--orange) !important}._bg{background-color:var(--bg) !important}._bg3{background-color:var(--bg3) !important}._sticky{position:sticky !important}._radius{border-radius:var(--radius) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._mt-2{margin-top:2rem}._shadowless{box-shadow:none !important}._overflowhidden{overflow:hidden !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._h-100{height:100%}._cnt-grid-wrap{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}._pb-2{padding-bottom:2rem}._py-2{padding-top:2rem;padding-bottom:2rem}[class*="-2m"]{--spacer-m: 2rem!important}[class*="-3m"]{--spacer-m: 3rem!important}._txt-white{color:var(--white) !important}._txt-blue{color:var(--blue) !important}._txt-red{color:var(--red) !important}._txt-orange{color:var(--orange) !important}._txt{color:var(--txt) !important}main{min-height:100vh;--bg-details: var(--bg3)}#dlg_compatibility{z-index:52 !important}#adb_test{display:none}footer>div{background:var(--bg2)}.card{border-radius:12px;box-shadow:none;background:var(--bg2)}.test_block,.test>span{border-radius:var(--radius);position:relative;min-height:45px;width:100%}.test_block{text-align:center;margin:0;display:flex;align-items:center;justify-content:center;color:#000}#test_log{height:200px;overflow-y:auto;flex-wrap:nowrap}.test_wrapper{display:flex;flex-direction:column;gap:.5rem}.test_wrapper .col-6{gap:1rem;display:flex;flex-direction:column}.test_wrapper>div,.test_card{padding:.5rem;border-radius:12px;background:var(--bg2)}.rwd-table-t{display:flex;gap:.5rem;align-items:center}.badges{display:flex;flex-wrap:wrap;gap:.5rem}.badges>*{padding:5px;display:flex;align-items:center;gap:5px;background:var(--bg2);border-radius:var(--radius)}.badges>*.light-green{background:var(--green-h);color:var(--green-d)}.badges>*.light-red{background:var(--red-h);color:var(--red-d)}.badges>*.light-orange{background:var(--orange-h);color:var(--orange-d)}.test_wrapper svg,.test_card svg{height:1.5rem}.test_wrapper>div>div>h5,.test_card>h5,.test>span{text-align:center;margin:0;display:flex;align-items:center;justify-content:center}.test{background-color:var(--red);color:#000;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:10px;min-height:45px;transition:all 1s}.test>div>div{height:45px;width:100%;border-radius:8px;background:var(--bg2);color:var(--txt);padding:.5rem;display:flex;align-items:center;gap:.5rem}.test>div>div>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:left}.test>div{position:relative;user-select:none;display:none;flex-direction:column;overflow-x:auto;gap:.5rem;padding:.5rem;width:100%;white-space:nowrap;color:#000}.test.show>div{display:flex}#results{background-color:#fff;border:1px solid #ddd;bottom:1em;font-size:24px;left:1em;padding:4px 8px;position:fixed}.lt_wrap{display:flex;flex-direction:column;justify-content:center;align-items:center}.lt_particles{width:15rem;height:7.5rem;display:flex;justify-content:center;align-items:center;flex-direction:row;grid-gap:16px}.start .p1{animation:p1 1.6s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p2{animation:p2 1.5s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p3{animation:p3 1.6s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p4{animation:p4 1.4s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p5{animation:p5 1.2s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.p1,.p2,.p3,.p4,.p5{padding:4px;height:32px;width:32px;border-radius:50%}.p1{background:var(--blue-h);color:var(--blue)}.p2{background:var(--green-h);color:var(--green)}.p3{background:var(--orange-h);color:var(--orange)}.p5{background:var(--purple-h);color:var(--purple)}.p4{background:var(--red-h);color:var(--red)}@keyframes p1{0%{transform:translateY(0px) translateX(-20px) scale(0.8);opacity:0}50%{transform:translateY(40px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(100px) translateX(10px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(-10px) scale(0.8);opacity:0}}@keyframes p2{0%{transform:translateY(0px) translateX(-10px) scale(0.8);opacity:0}50%{transform:translateY(50px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(80px) translateX(5px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(5px) scale(0.8);opacity:0}}@keyframes p3{0%{transform:translateY(0px) scale(0.8) rotate(45deg);opacity:0}50%{transform:translateY(40px) scale(1) rotate(0deg);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(100px) scale(1) rotate(0deg);opacity:0}100%{transform:translateY(0px) scale(0.8) rotate(0deg);opacity:0}}@keyframes p4{0%{transform:translateY(0px) translateX(10px) scale(0.8);opacity:0}50%{transform:translateY(60px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(100px) translateX(0px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(10px) scale(0.8);opacity:0}}@keyframes p5{0%{transform:translateY(0px) translateX(20px) scale(0.8);opacity:0}50%{transform:translateY(50px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(90px) translateX(0px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(20px) scale(0.8);opacity:0}}:root{--liquid-percentage: 50%;--liquid-title: "BAD";--liquid-color: var(--red)}.r_wrap span{display:flex;align-items:center;gap:.5rem}.lt_template .lt_circle{width:60px;height:60px}.template_wrap.row>div{justify-content:center;gap:.5rem;align-items:center;display:flex;flex-direction:column}.lt_value_2{border-radius:8px;color:var(--white);padding:.4rem}.lt_cwrap{position:relative;border-radius:50rem;background-color:var(--bg2)}.lt_circle{width:200px;height:200px;background:var(--liquid-color);border:3px solid var(--black-h);border-radius:50%;overflow:hidden;clip-path:border-box;z-index:5}.lt_wave{position:relative;top:var(--liquid-percentage);width:100%;height:100%;background:var(--liquid-color);border-radius:50%;transition:3s}.lt_wave:before,.lt_wave:after{content:"";position:absolute;width:200%;height:200%;left:50%;-webkit-transform:translate(-50%, -75%);transform:translate(-50%, -75%);background:#000}.lt_wave:before{border-radius:45%;background:var(--bg2);animation:animate_lt_wave 6s linear infinite}.lt_wave:after{border-radius:40%;opacity:.5;background:var(--bg2);animation:animate_lt_wave 10s linear infinite}@keyframes animate_lt_wave{0%{transform:translate(-50%, -75%) rotate(0deg)}100%{transform:translate(-50%, -75%) rotate(360deg)}}.lt_cwrap .lt_value{position:absolute;height:100%;right:0;bottom:0;width:100%}.lt_cwrap .lt_value::after,.lt_cwrap .lt_value::before{content:var(--liquid-title);position:inherit;left:100%;margin-left:10px;bottom:calc(45% - var(--liquid-percentage));transform:translateY(50%);background:var(--liquid-color);color:var(--white);padding:10px;font-size:20px;font-weight:bold;border-radius:8px;transition:3s}.lt_cwrap .lt_value::after{content:"";border:12px solid rgba(0,0,0,0);border-right-color:var(--liquid-color);padding:0;border-radius:0;background:rgba(0,0,0,0);transform:translate(-78%, 50%)}#dlg_faq p{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased !important;margin-top:1rem}#adb_test_r>span{display:flex;align-items:center;gap:.5rem} +html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}img{max-width:100%}textarea{white-space:revert}hr{border:0;border-top:.1rem solid var(--brd)}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h2,h3,h5,h6{margin-top:1.5rem}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}h6{font-size:1em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h2+h3,h5+h6{margin:0}q:before{content:"“"}q q:before{content:"‘"}q q:after{content:"’"}q:after{content:"”"}summary{font-weight:bold;cursor:pointer}time{color:var(--txt);opacity:.7}small{font-size:75%}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}.cnt.full,main.full{max-width:auto}._2-col{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.5rem}.grid{flex-wrap:wrap}.row,.grid{display:flex;align-items:stretch}.row>[class*=col],.row>div,.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.row>[class*=col]>*,.row>div>*,.grid>[class*=col]>*,.grid>div>*{margin:0}.row>div,.grid>div{flex:1 1 100%}.row .col-6,.grid .col-6{width:50%}@media(max-width: 40em){.row:not(.keep-width),.grid:not(.keep-width){flex-direction:column !important}.row:not(.keep-width)>[class*=col],.row:not(.keep-width)>div,.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}button,input[type=button],input[type=reset],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],input[type=reset],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,input[type=reset]:active,input[type=reset]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,input[type=reset]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,input[type=reset]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],input[type=reset][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.outline,input[type=button].outline,input[type=reset].outline,.btn.outline{--btn-bg: transparent;color:var(--btn-brd);border:2px solid var(--focus)}button.outline:hover,input[type=button].outline:hover,input[type=reset].outline:hover,.btn.outline:hover{color:var(--btn-txt)}button.fill:hover,input[type=button].fill:hover,input[type=reset].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,input[type=reset]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-blue{--btn-f: var(--blue-h);--btn-brd: var(--blue);--btn-bg: var(--blue);--btn-bg-h: var(--blue-l);--btn-txt: var(--txt-on-blue)}.btn-red,[type=reset]{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.snackbar{position:fixed;top:-100%;left:50%;transform:translateX(-50%);background-color:var(--blue);border-radius:10px;width:400px;font-size:16px;transition:all .5s;z-index:9999;box-shadow:var(--shadow)}@media(max-width: 424px){.snackbar{width:calc(100% - 20px)}}.snackbar.success{background:var(--blue)}.snackbar div{color:var(--txt-on-blue);padding:20px 30px;text-align:center}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>img{height:auto;border-radius:var(--radius);width:100%}.card>img.full{width:calc(100% + 2rem);max-width:unset}.card>img.full:first-child{border-radius:var(--radius) var(--radius) 0 0;margin:-1rem -1rem 0 -1rem}.card>img.full:last-child{border-radius:0 0 var(--radius) var(--radius);margin:0 -1rem -1rem -1rem}.field{display:flex;justify-content:center;gap:.5rem;flex-direction:column}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,textarea[readonly],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[readonly],select:disabled,select[readonly]{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=checkbox],input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after,input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=checkbox]:checked,input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=checkbox]:disabled,input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked,input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=checkbox]:disabled+label,input[type=radio]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled),input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=checkbox]:focus,input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.toggle),input[type=radio]:not(.toggle){width:1.3rem}input[type=checkbox]:not(.toggle):after,input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=checkbox]:not(.toggle):checked,input[type=radio]:not(.toggle):checked{--o: 1}input[type=checkbox]+label,input[type=radio]+label{line-height:1.3rem;display:inline-block;vertical-align:top;cursor:pointer;margin-left:.3rem}input[type=checkbox]:not(.toggle){border-radius:.4rem}input[type=checkbox]:not(.toggle):after{width:.4rem;height:.6rem;border:.2rem solid var(--active-inner);border-top:0;border-left:0;left:.4rem;top:.2rem;transform:rotate(var(--r, 20deg))}input[type=checkbox]:not(.toggle):checked{--r: 43deg}input[type=checkbox].toggle{width:38px;border-radius:11px}input[type=checkbox].toggle:after{left:.1rem;top:.1rem;border-radius:50%;width:.9rem;height:.9rem;background:var(--ab, var(--border));transform:translateX(var(--x, 0))}input[type=checkbox].toggle:checked{--ab: var(--active-inner);--x: 1.1rem}input[type=checkbox].toggle:disabled:not(:checked):after{opacity:.6}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}code{color:var(--primary);background:var(--bg2)}pre{display:flex;box-shadow:var(--shadow);border-radius:var(--radius) !important;border-left:var(--radius) solid var(--primary);background-color:var(--bg)}pre>code{margin:0;padding:1.5rem 1rem;background-color:rgba(0,0,0,0)}code{padding:.1rem .3rem;background:var(--bg2);white-space:pre;font-size:90%;border-radius:6px}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}details{width:100%;overflow-x:hidden;display:flex;flex-flow:wrap column;border-radius:var(--radius);background:var(--bg-details)}details>summary{outline-color:initial;padding:.6rem;border-radius:var(--radius);outline:0;cursor:pointer;font-weight:500}details>summary:hover{color:var(--primary);background-color:var(--bg-details)}details>div{padding:.5rem}details[open] summary{background-color:var(--bg-details-open);color:var(--txt-details-open)}details+details{margin-top:.5rem}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._bg-red{background-color:var(--red) !important}._bg-green{background-color:var(--green) !important}._bg-orange{background-color:var(--orange) !important}._bg{background-color:var(--bg) !important}._bg3{background-color:var(--bg3) !important}._sticky{position:sticky !important}._radius{border-radius:var(--radius) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._mt-2{margin-top:2rem}._shadowless{box-shadow:none !important}._overflowhidden{overflow:hidden !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._h-100{height:100%}._cnt-grid-wrap{display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}._pb-2{padding-bottom:2rem}._py-2{padding-top:2rem;padding-bottom:2rem}[class*="-2m"]{--spacer-m: 2rem!important}[class*="-3m"]{--spacer-m: 3rem!important}._txt-white{color:var(--white) !important}._txt-blue{color:var(--blue) !important}._txt-red{color:var(--red) !important}._txt-orange{color:var(--orange) !important}._txt{color:var(--txt) !important}main{min-height:100vh;--bg-details: var(--bg3)}#dlg_compatibility{z-index:52 !important}#adb_test{display:none}footer>div{background:var(--bg2)}.card{border-radius:12px;box-shadow:none;background:var(--bg2)}.test_block,.test>span{border-radius:var(--radius);position:relative;min-height:45px;width:100%}.test_block{text-align:center;margin:0;display:flex;align-items:center;justify-content:center;color:#000}#test_log{height:200px;overflow-y:auto;flex-wrap:nowrap}.test_wrapper{display:flex;flex-direction:column;gap:.5rem}.test_wrapper .col-6{gap:1rem;display:flex;flex-direction:column}.test_wrapper>div,.test_card{padding:.5rem;border-radius:12px;background:var(--bg2)}.rwd-table-t{display:flex;gap:.5rem;align-items:center}.badges{display:flex;flex-wrap:wrap;gap:.5rem}.badges>*{padding:5px;display:flex;align-items:center;gap:5px;background:var(--bg2);border-radius:var(--radius)}.badges>*.light-green{background:var(--green-h);color:var(--green-d)}.badges>*.light-red{background:var(--red-h);color:var(--red-d)}.badges>*.light-orange{background:var(--orange-h);color:var(--orange-d)}.test_wrapper svg,.test_card svg{height:1.5rem}.test_wrapper>div>div>h5,.test_card>h5,.test>span{text-align:center;margin:0;display:flex;align-items:center;justify-content:center}.test{background-color:var(--red);color:#000;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:10px;min-height:45px;transition:all 1s}.test>div>div{height:45px;width:100%;border-radius:8px;background:var(--bg2);color:var(--txt);padding:.5rem;display:flex;align-items:center;gap:.5rem}.test>div>div>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:left}.test>div{position:relative;user-select:none;display:none;flex-direction:column;overflow-x:auto;gap:.5rem;padding:.5rem;width:100%;white-space:nowrap;color:#000}.test.show>div{display:flex}#results{background-color:#fff;border:1px solid #ddd;bottom:1em;font-size:24px;left:1em;padding:4px 8px;position:fixed}.lt_wrap{display:flex;flex-direction:column;justify-content:center;align-items:center}.lt_particles{width:15rem;height:7.5rem;display:flex;justify-content:center;align-items:center;flex-direction:row;grid-gap:16px}.start .p1{animation:p1 1.6s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p2{animation:p2 1.5s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p3{animation:p3 1.6s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p4{animation:p4 1.4s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.start .p5{animation:p5 1.2s cubic-bezier(0.2, 0.4, 0.35, 1) .2s infinite backwards}.p1,.p2,.p3,.p4,.p5{padding:4px;height:32px;width:32px;border-radius:50%}.p1{background:var(--blue-h);color:var(--blue)}.p2{background:var(--green-h);color:var(--green)}.p3{background:var(--orange-h);color:var(--orange)}.p5{background:var(--purple-h);color:var(--purple)}.p4{background:var(--red-h);color:var(--red)}@keyframes p1{0%{transform:translateY(0px) translateX(-20px) scale(0.8);opacity:0}50%{transform:translateY(40px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(100px) translateX(10px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(-10px) scale(0.8);opacity:0}}@keyframes p2{0%{transform:translateY(0px) translateX(-10px) scale(0.8);opacity:0}50%{transform:translateY(50px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(80px) translateX(5px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(5px) scale(0.8);opacity:0}}@keyframes p3{0%{transform:translateY(0px) scale(0.8) rotate(45deg);opacity:0}50%{transform:translateY(40px) scale(1) rotate(0deg);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(100px) scale(1) rotate(0deg);opacity:0}100%{transform:translateY(0px) scale(0.8) rotate(0deg);opacity:0}}@keyframes p4{0%{transform:translateY(0px) translateX(10px) scale(0.8);opacity:0}50%{transform:translateY(60px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(100px) translateX(0px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(10px) scale(0.8);opacity:0}}@keyframes p5{0%{transform:translateY(0px) translateX(20px) scale(0.8);opacity:0}50%{transform:translateY(50px) translateX(0px) scale(1);opacity:1;animation-timing-function:cubic-bezier(1, 0.4, 0.35, 1)}75%{transform:translateY(90px) translateX(0px) scale(1);opacity:0}100%{transform:translateY(0px) translateX(20px) scale(0.8);opacity:0}}:root{--liquid-percentage: 50%;--liquid-title: "BAD";--liquid-color: var(--red)}.r_wrap span{display:flex;align-items:center;gap:.5rem}.lt_template .lt_circle{width:60px;height:60px}.template_wrap.row>div{justify-content:center;gap:.5rem;align-items:center;display:flex;flex-direction:column}.lt_value_2{border-radius:8px;color:var(--white);padding:.4rem}.lt_cwrap{position:relative;border-radius:50rem;background-color:var(--bg2)}.lt_circle{width:200px;height:200px;background:var(--liquid-color);border:3px solid var(--black-h);border-radius:50%;overflow:hidden;clip-path:border-box;z-index:5}.lt_wave{position:relative;top:var(--liquid-percentage);width:100%;height:100%;background:var(--liquid-color);border-radius:50%;transition:3s}.lt_wave:before,.lt_wave:after{content:"";position:absolute;width:200%;height:200%;left:50%;-webkit-transform:translate(-50%, -75%);transform:translate(-50%, -75%);background:#000}.lt_wave:before{border-radius:45%;background:var(--bg2);animation:animate_lt_wave 6s linear infinite}.lt_wave:after{border-radius:40%;opacity:.5;background:var(--bg2);animation:animate_lt_wave 10s linear infinite}@keyframes animate_lt_wave{0%{transform:translate(-50%, -75%) rotate(0deg)}100%{transform:translate(-50%, -75%) rotate(360deg)}}.lt_cwrap .lt_value{position:absolute;height:100%;right:0;bottom:0;width:100%}.lt_cwrap .lt_value::after,.lt_cwrap .lt_value::before{content:var(--liquid-title);position:inherit;left:100%;margin-left:10px;bottom:calc(45% - var(--liquid-percentage));transform:translateY(50%);background:var(--liquid-color);color:var(--white);padding:10px;font-size:20px;font-weight:bold;border-radius:8px;transition:3s}.lt_cwrap .lt_value::after{content:"";border:12px solid rgba(0,0,0,0);border-right-color:var(--liquid-color);padding:0;border-radius:0;background:rgba(0,0,0,0);transform:translate(-78%, 50%)}#dlg_faq p{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased !important;margin-top:1rem}#adb_test_r>span{display:flex;align-items:center;gap:.5rem} diff --git a/css/fontlist.css b/css/fontlist.css index f97de12..41b83ac 100644 --- a/css/fontlist.css +++ b/css/fontlist.css @@ -1 +1 @@ -html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}html{--primary: var(--orange) !important;--primary-h: var(--orange-h)!important;--primary-l: var(--orange-l)!important;--primary-d: var(--orange-d)!important;--slider-color: var(--primary-l);--slider-thumb-color: #fff}body{background-color:var(--primary);background-image:linear-gradient(315deg, var(--primary) 0%, var(--primary-l) 74%);background-size:200% 100%;height:auto}#flist{display:grid;grid-gap:.5rem;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr))}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}img{max-width:100%}textarea{white-space:revert}hr{border:0;border-top:.1rem solid var(--brd)}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h1,h2,h3,h5{margin-top:1.5rem}h1{font-size:2.6em}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h1+h2,h2+h3{margin:0}summary{font-weight:bold;cursor:pointer}sub{font-size:75%}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,select:disabled{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}fieldset{margin-top:1rem;border-radius:var(--radius);border:.1rem solid var(--input-brd)}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=radio]:disabled+label{cursor:not-allowed}input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=radio]:not(.toggle){width:1.3rem}input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=radio]:not(.toggle):checked{--o: 1}input[type=radio]+label{line-height:1.3rem;display:inline-block;vertical-align:top;cursor:pointer;margin-left:.3rem}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}.cnt.full,main.full{max-width:auto}.grid{flex-wrap:wrap}.row,.grid{display:flex;align-items:stretch}.row>[class*=col],.row>div,.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.row>[class*=col]>*,.row>div>*,.grid>[class*=col]>*,.grid>div>*{margin:0}.row>div,.grid>div{flex:1 1 100%}.row .col-6,.grid .col-6{width:50%}@media(max-width: 40em){.row:not(.keep-width),.grid:not(.keep-width){flex-direction:column !important}.row:not(.keep-width)>[class*=col],.row:not(.keep-width)>div,.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}code{color:var(--primary);background:var(--bg2)}pre{display:flex;box-shadow:var(--shadow);border-radius:var(--radius) !important;border-left:var(--radius) solid var(--primary);background-color:var(--bg)}pre>code{margin:0;padding:1.5rem 1rem;background-color:rgba(0,0,0,0)}code{padding:.1rem .3rem;background:var(--bg2);white-space:pre;font-size:90%;border-radius:6px}button,input[type=button],input[type=reset],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],input[type=reset],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,input[type=reset]:active,input[type=reset]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,input[type=reset]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,input[type=reset]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],input[type=reset][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.fill:hover,input[type=button].fill:hover,input[type=reset].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,input[type=reset]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-black{--btn-f: var(--black-h);--btn-brd: var(--black);--btn-bg-h: var(--black-l);--btn-bg: var(--black-l);--btn-txt: var(--white)}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-red,[type=reset]{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>img{height:auto;border-radius:var(--radius);width:100%}.card>img.full{width:calc(100% + 2rem);max-width:unset}.card>img.full:first-child{border-radius:var(--radius) var(--radius) 0 0;margin:-1rem -1rem 0 -1rem}.card>img.full:last-child{border-radius:0 0 var(--radius) var(--radius);margin:0 -1rem -1rem -1rem}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.snackbar{position:fixed;top:-100%;left:50%;transform:translateX(-50%);background-color:var(--blue);border-radius:10px;width:400px;font-size:16px;transition:all .5s;z-index:9999;box-shadow:var(--shadow)}@media(max-width: 424px){.snackbar{width:calc(100% - 20px)}}.snackbar.success{background:var(--blue)}.snackbar div{color:var(--txt-on-blue);padding:20px 30px;text-align:center}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._sticky{position:sticky !important}._bg{background-color:var(--bg) !important}._bg3{background-color:var(--bg3) !important}._radius{border-radius:var(--radius) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._mt-2{margin-top:2rem}._my-2{margin-top:2rem;margin-bottom:2rem}._shadowless{box-shadow:none !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._p-0{padding:0}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}[class*="-3m"]{--spacer-m: 3rem!important}._txt{color:var(--txt) !important}#results>span{display:flex;align-items:center;gap:.5rem}pre{max-width:calc(100vw - 8rem);overflow:scroll}input[type=range]{-webkit-appearance:none;margin:10px 0;width:100%}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{height:6px;background:#ddd;border-radius:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:20px;width:20px;background:#fff;border-radius:50%;border:1px solid #ccc;margin-top:-8px}input[type=range]::-webkit-slider-runnable-track{background:var(--slider-color)}input[type=range]::-webkit-slider-thumb{background:var(--slider-thumb-color)} +html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}html{--primary: var(--orange) !important;--primary-h: var(--orange-h)!important;--primary-l: var(--orange-l)!important;--primary-d: var(--orange-d)!important;--slider-color: var(--primary-l);--slider-thumb-color: #fff}body{background-color:var(--primary);background-image:linear-gradient(315deg, var(--primary) 0%, var(--primary-l) 74%);background-size:200% 100%;height:auto}#flist{display:grid;grid-gap:.5rem;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr))}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}img{max-width:100%}textarea{white-space:revert}hr{border:0;border-top:.1rem solid var(--brd)}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h1,h2,h3,h5{margin-top:1.5rem}h1{font-size:2.6em}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h1+h2,h2+h3{margin:0}summary{font-weight:bold;cursor:pointer}sub{font-size:75%}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,select:disabled{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}fieldset{margin-top:1rem;border-radius:var(--radius);border:.1rem solid var(--input-brd)}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=radio]:disabled+label{cursor:not-allowed}input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=radio]:not(.toggle){width:1.3rem}input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=radio]:not(.toggle):checked{--o: 1}input[type=radio]+label{line-height:1.3rem;display:inline-block;vertical-align:top;cursor:pointer;margin-left:.3rem}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}.cnt.full,main.full{max-width:auto}.grid{flex-wrap:wrap}.row,.grid{display:flex;align-items:stretch}.row>[class*=col],.row>div,.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.row>[class*=col]>*,.row>div>*,.grid>[class*=col]>*,.grid>div>*{margin:0}.row>div,.grid>div{flex:1 1 100%}.row .col-6,.grid .col-6{width:50%}@media(max-width: 40em){.row:not(.keep-width),.grid:not(.keep-width){flex-direction:column !important}.row:not(.keep-width)>[class*=col],.row:not(.keep-width)>div,.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}code{color:var(--primary);background:var(--bg2)}pre{display:flex;box-shadow:var(--shadow);border-radius:var(--radius) !important;border-left:var(--radius) solid var(--primary);background-color:var(--bg)}pre>code{margin:0;padding:1.5rem 1rem;background-color:rgba(0,0,0,0)}code{padding:.1rem .3rem;background:var(--bg2);white-space:pre;font-size:90%;border-radius:6px}button,input[type=button],input[type=reset],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],input[type=reset],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,input[type=reset]:active,input[type=reset]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,input[type=reset]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,input[type=reset]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],input[type=reset][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.fill:hover,input[type=button].fill:hover,input[type=reset].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,input[type=reset]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-red,[type=reset]{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>img{height:auto;border-radius:var(--radius);width:100%}.card>img.full{width:calc(100% + 2rem);max-width:unset}.card>img.full:first-child{border-radius:var(--radius) var(--radius) 0 0;margin:-1rem -1rem 0 -1rem}.card>img.full:last-child{border-radius:0 0 var(--radius) var(--radius);margin:0 -1rem -1rem -1rem}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.snackbar{position:fixed;top:-100%;left:50%;transform:translateX(-50%);background-color:var(--blue);border-radius:10px;width:400px;font-size:16px;transition:all .5s;z-index:9999;box-shadow:var(--shadow)}@media(max-width: 424px){.snackbar{width:calc(100% - 20px)}}.snackbar.success{background:var(--blue)}.snackbar div{color:var(--txt-on-blue);padding:20px 30px;text-align:center}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._sticky{position:sticky !important}._bg{background-color:var(--bg) !important}._bg3{background-color:var(--bg3) !important}._radius{border-radius:var(--radius) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._mt-2{margin-top:2rem}._my-2{margin-top:2rem;margin-bottom:2rem}._shadowless{box-shadow:none !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._p-0{padding:0}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}[class*="-3m"]{--spacer-m: 3rem!important}._txt{color:var(--txt) !important}#results>span{display:flex;align-items:center;gap:.5rem}pre{max-width:calc(100vw - 8rem);overflow:scroll}input[type=range]{-webkit-appearance:none;margin:10px 0;width:100%}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{height:6px;background:#ddd;border-radius:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:20px;width:20px;background:#fff;border-radius:50%;border:1px solid #ccc;margin-top:-8px}input[type=range]::-webkit-slider-runnable-track{background:var(--slider-color)}input[type=range]::-webkit-slider-thumb{background:var(--slider-thumb-color)} diff --git a/css/index.css b/css/index.css index a112984..772e602 100644 --- a/css/index.css +++ b/css/index.css @@ -1 +1 @@ -html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}html{--primary: #f3535b!important;--primary-h: #fdddde!important;--primary-l: #f5757c!important;--primary-d: #a41c23!important}[data-theme=dark]{--primary: #f3535b !important;--primary-h: #a41c23!important;--primary-l: #f5757c!important;--primary-d: #d94148!important}body{background-color:#f7b42c;background-image:linear-gradient(315deg, #f7b42c 0%, #fc575e 74%);background-size:400% 100%;height:auto}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}img{max-width:100%}textarea{white-space:revert}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-top{transform:translate3d(0, -100px, 0)}._aos-bottom{transform:translate3d(0, 100px, 0)}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h1,h2,h3,h5,h6{margin-top:1.5rem}h1{font-size:2.6em}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}h6{font-size:1em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h1+h2,h2+h3,h5+h6{margin:0}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}._2-col{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.5rem}.grid{flex-wrap:wrap}.grid{display:flex;align-items:stretch}.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.grid>[class*=col]>*,.grid>div>*{margin:0}.grid>div{flex:1 1 100%}@media(max-width: 40em){.grid:not(.keep-width){flex-direction:column !important}.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}button,input[type=button],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.fill:hover,input[type=button].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-black{--btn-f: var(--black-h);--btn-brd: var(--black);--btn-bg-h: var(--black-l);--btn-bg: var(--black-l);--btn-txt: var(--white)}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-red{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>img{height:auto;border-radius:var(--radius);width:100%}.card>.img-w{padding:1rem;box-shadow:0 8px 20px -4px var(--b-shadow);max-width:100px;border-radius:50%;margin:15px auto 15px;width:100px;height:100px}.card>.img-w>img{height:auto;border-radius:50%;width:100%}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,select:disabled{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=radio]:not(.toggle){width:1.3rem}input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=radio]:not(.toggle):checked{--o: 1}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._bg{background-color:var(--bg) !important}._bg3{background-color:var(--bg3) !important}._sticky{position:sticky !important}._radius{border-radius:var(--radius) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._shadowless{box-shadow:none !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}[class*="-3m"]{--spacer-m: 3rem!important}._txt{color:var(--txt) !important}._mono{font-family:monospace}._txt-center{text-align:center} +html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}html{--primary: #f3535b!important;--primary-h: #fdddde!important;--primary-l: #f5757c!important;--primary-d: #a41c23!important}[data-theme=dark]{--primary: #f3535b !important;--primary-h: #a41c23!important;--primary-l: #f5757c!important;--primary-d: #d94148!important}body{background-color:#f7b42c;background-image:linear-gradient(315deg, #f7b42c 0%, #fc575e 74%);background-size:400% 100%;height:auto}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}textarea{white-space:revert}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-top{transform:translate3d(0, -100px, 0)}._aos-bottom{transform:translate3d(0, 100px, 0)}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h1,h2,h3,h5,h6{margin-top:1.5rem}h1{font-size:2.6em}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}h6{font-size:1em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h1+h2,h2+h3,h5+h6{margin:0}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}._2-col{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.5rem}.grid{flex-wrap:wrap}.grid{display:flex;align-items:stretch}.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.grid>[class*=col]>*,.grid>div>*{margin:0}.grid>div{flex:1 1 100%}@media(max-width: 40em){.grid:not(.keep-width){flex-direction:column !important}.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}button,input[type=button],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.fill:hover,input[type=button].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-red{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>.img-w{padding:1rem;box-shadow:0 8px 20px -4px var(--b-shadow);max-width:100px;border-radius:50%;margin:15px auto 15px;width:100px;height:100px}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,select:disabled{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=radio]:not(.toggle){width:1.3rem}input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=radio]:not(.toggle):checked{--o: 1}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._bg{background-color:var(--bg) !important}._bg3{background-color:var(--bg3) !important}._sticky{position:sticky !important}._radius{border-radius:var(--radius) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._shadowless{box-shadow:none !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}[class*="-3m"]{--spacer-m: 3rem!important}._txt{color:var(--txt) !important}._mono{font-family:monospace}._txt-center{text-align:center} diff --git a/css/units.css b/css/units.css index 440218b..4457f36 100644 --- a/css/units.css +++ b/css/units.css @@ -1 +1 @@ -html{--primary: var(--green) !important;--primary-h: var(--green-h)!important;--primary-l: var(--green-l)!important;--primary-d: var(--green-d)!important}html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}img{max-width:100%}textarea{white-space:revert}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h2,h3,h5{margin-top:1.5rem}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h2+h3{margin:0}summary{font-weight:bold;cursor:pointer}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}.grid{flex-wrap:wrap}.row,.grid{display:flex;align-items:stretch}.row>[class*=col],.row>div,.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.row>[class*=col]>*,.row>div>*,.grid>[class*=col]>*,.grid>div>*{margin:0}.row>div,.grid>div{flex:1 1 100%}@media(max-width: 40em){.row:not(.keep-width),.grid:not(.keep-width){flex-direction:column !important}.row:not(.keep-width)>[class*=col],.row:not(.keep-width)>div,.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}button,input[type=button],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.fill:hover,input[type=button].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-black{--btn-f: var(--black-h);--btn-brd: var(--black);--btn-bg-h: var(--black-l);--btn-bg: var(--black-l);--btn-txt: var(--white)}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-red{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>img{height:auto;border-radius:var(--radius);width:100%}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,select:disabled{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=radio]:not(.toggle){width:1.3rem}input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=radio]:not(.toggle):checked{--o: 1}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._bg{background-color:var(--bg) !important}._bg2{background-color:var(--bg2) !important}._bg3{background-color:var(--bg3) !important}._sticky{position:sticky !important}._radius{border-radius:var(--radius) !important}._brd-bg3{border:2px solid var(--bg3) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._mt-2{margin-top:2rem}._my-2{margin-top:2rem;margin-bottom:2rem}._shadowless{box-shadow:none !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._p-0{padding:0}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}[class*="-3m"]{--spacer-m: 3rem!important}._txt{color:var(--txt) !important}main{padding-top:6rem}.test{display:inline-flex;position:relative;align-items:center;justify-content:center;margin:0;font-size:18px;font-weight:bold;border-radius:var(--radius);text-align:center;box-sizing:border-box;background-color:var(--green);width:100%}.test.t-vh{height:calc(var(--100vh)/2)}.test.t-svh{height:calc(var(--100svh)/2)}.test.t-dvh{height:calc(var(--100dvh)/2)}.test.t-lvh{height:calc(var(--100lvh)/2)}.test.t-p{height:calc(var(--100p)/2)}.vtests{gap:.5rem}.vtests>*{padding:0 !important}div.test span{position:absolute;top:50%;width:30vh;transform:rotate(-90deg)}div.bar{width:20px;top:0px}.bar>.text{box-sizing:border-box;width:65vh;background-color:#fff;opacity:.7;height:20px;padding:0px 80px;transform:rotate(90deg);transform-origin:left bottom 0}.innerHeightLog{position:fixed;display:flex;gap:.5rem;align-items:center;top:80px;left:.5rem;padding:.5rem;background-color:var(--green);border-radius:var(--radius)} +html{--primary: var(--green) !important;--primary-h: var(--green-h)!important;--primary-l: var(--green-l)!important;--primary-d: var(--green-d)!important}html,[data-theme=light]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #E0F1FF;--blue-d: #002E57;--purple: #8034d5;--purple-l: #985add;--purple-h: #f7f2fc;--purple-d: #40186b;--green: #22C55E;--green-h: #CFF7DE;--green-l: #40DE7A;--green-d: #0D4E25;--red: #FF4132;--red-h: #FFD9D6;--red-l: #FF675C;--red-d: #7A0800;--orange: #FF851B;--orange-h: #FFE7D1;--orange-l: #FF9D47;--orange-d: #703400;--white: #fafafa;--white-h:#dbdbdb;--white-l:#fff;--black: #101010;--black-l: #000;--black-h: #4d4d4d;--txt-on-p: var(--white);--txt-on-red: var(--white);--txt-on-green: var(--white);--txt-on-purple: var(--white);--txt-on-blue: var(--white);--txt-on-orange: var(--white);--gray: #e5e7eb;--gray-l: #f3f4f6;--gray-d: #9ca3af;--primary: var(--blue);--primary-h: var(--blue-h);--primary-l: var(--blue-l);--primary-d: var(--blue-d);--accent: #E3F2FD;--active: #ECEFF1;--focus: var(--primary);--hover: #ECF4FD;--txt: var(--black);--txt-l:var(--black-l);--txt-h:var(--black-h);--txt-r: var(--white);--bg: #f9fafb;--bg2: #f3f4f6;--bg3: #e5e7eb;--brd: #d1d5db;--bg-nav: var(--bg);--bg-nav-h: var(--bg2);--bb-nav: var(--primary);--input-bg: var(--bg);--input-txt: var(--txt);--input-focus: var(--primary-t);--input-brd: var(--brd);--btn-bg: var(--bg);--btn-ac: var(--primary);--btn-txt: var(--txt);--btn-brd: var(--brd);--btn-hs: 0;--btn-f: var(--bg2);--btn-bg-h: var(--bg3);--btn-sd: 0 1px var(--btn-brd);--btn-radius: .5rem;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details-open: var(--primary);--txt-details-open: var(--white);--aside-bg: transparent;--aside-bg-h: var(--bg3);--aside-bs: none;--bg-tabs: var(--bg);--brd-tabs-l: var(--primary);--brd-tabs: var(--bg2);--bg-table: var(--bg);--fake-brd-table: inset 0 0px 0px 1px var(--bg3);--bg-table-hover: var(--bg3);--brd-table: var(--bg3);--shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;--b-shadow: #95abbb;--radius: .5rem}[data-theme=dark]{--blue: #0074D8;--blue-l: #1492FF;--blue-h: #002E57;--blue-d: #005CAD;--purple: #8034d5;--purple-l: #985add;--purple-h: #40186b;--purple-d: #6b2bb2;--green: #22C55E;--green-h: #0D4E25;--green-l: #40DE7A;--green-d: #6FE69B;--red: #FF4132;--red-h: #7A0800;--red-l: #FF675C;--red-d: #FF8D85;--orange: #FF851B;--orange-h: #703400;--orange-l: #FF9D47;--orange-d: #E06900;--txt-l:var(--white-l);--txt-p: var(--white);--txt-red: var(--white);--txt-green: var(--white);--txt-blue: var(--white);--txt-orange: var(--white);--txt: var(--white);--txt-r: var(--black);--bg3: #374151;--bg2: #1f2937;--bg: #111827;--brd: #4b5563;--aside-bg-h: #374151;--bg-card: var(--bg);--bg-details: var(--bg2);--bg-details2: var(--bg3);--txt-details-open: var(--txt);--shadow: none;--b-shadow: var(--black)}[data-theme=light] .light-icon,[data-theme=dark] .dark-icon{display:block !important}.theme-icon{display:none}*,*::before,*::after{box-sizing:border-box}*:focus:not(:focus-visible){outline:0}*:focus-visible{outline:.1rem solid var(--focus);outline-offset:.1rem}html{text-rendering:optimizeLegibility;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-size:12pt;color:var(--txt);background:var(--bg)}body{min-height:100vh;display:flex;flex-flow:wrap column;gap:.5rem;align-items:center;justify-content:center}@media(prefers-reduced-motion: no-preference){body{scroll-behavior:smooth}}body,html{margin:0;padding:0}header>*,main>*,footer>*{max-width:60rem}ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}.keep-ls{list-style:unset}img{max-width:100%}textarea{white-space:revert}section{overflow-x:hidden;display:flex;flex-direction:column}.better_r{-webkit-font-smoothing:antialiased !important;-moz-font-smoothing:antialiased !important;font-size:16px;letter-spacing:.7px;line-height:1.5;text-align:justify;text-rendering:optimizelegibility !important}[class*=_aos],._aos{opacity:0;transition:opacity 1s,transform 1.3s}._aos-done{opacity:1;transform:translateZ(0) scale(1)}h2,h3,h5{margin-top:1.5rem}h2{font-size:2em}h3{font-size:1.7em}h5{font-size:1.2em}p{margin-bottom:1.5rem}p b{color:var(--txt)}h2+h3{margin:0}summary{font-weight:bold;cursor:pointer}var{color:var(--yellow)}a{color:var(--primary);text-decoration:none;cursor:pointer}header{width:100%;z-index:2;padding:.5rem .5rem 0 .5rem;top:0}nav{display:flex;justify-content:space-between;align-items:center;background:var(--bg-nav);border-radius:calc(var(--radius) + .2rem);box-shadow:var(--shadow);padding:.4rem;width:100%;margin:auto;max-width:60rem}nav>.nav-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(17,17,17,.6);z-index:-1}nav *{margin:0;padding:0;display:flex;align-items:center}nav>button{display:none;margin:0 !important;min-width:auto;font-size:.875em;padding:.5rem}nav>button>svg line{stroke:currentColor;stroke-width:4;stroke-linecap:round;transform-origin:12px 12px;transition:all .4s}nav>a{gap:.5rem;font-size:1.6rem;padding:.4rem}nav>a>svg{height:1.6rem !important;width:1.6rem !important}nav a:hover{border:none !important}nav>ul{flex-direction:row;justify-content:space-between;list-style:none;width:auto;gap:.5rem}nav>ul>li{gap:.5rem}nav>ul>li>a,nav>ul>li .nav-item{padding:.4rem;border-radius:var(--radius);color:var(--txt)}nav>ul>li>a:hover,nav>ul>li>a.active,nav>ul>li .nav-item:hover,nav>ul>li .nav-item.active{background:var(--bg-nav-h)}nav>ul>li>a.active,nav>ul>li .nav-item.active{color:var(--primary)}@media only screen and (max-width: 768px){nav>ul{position:fixed;top:5rem;padding:.5rem;right:-100%;flex-direction:column;background:var(--bg-nav);width:calc(100% - 1rem);border-radius:10px;text-align:center;transition:.3s;box-shadow:var(--shadow)}nav>button{display:flex;cursor:pointer}nav.active>.nav-overlay{display:flex}nav.active>ul{right:.5rem}nav.active>button svg line:nth-child(1){opacity:0;transform:translateY(-100%)}nav.active>button svg line:nth-child(4){opacity:0;transform:translateY(100%)}nav.active>button svg line:nth-child(2){transform:rotate(45deg)}nav.active>button svg line:nth-child(3){transform:rotate(-45deg)}}.cnt,main{margin:auto;width:100%;max-width:60rem;padding:0 .5rem}.grid{flex-wrap:wrap}.row,.grid{display:flex;align-items:stretch}.row>[class*=col],.row>div,.grid>[class*=col],.grid>div{flex:0 0 auto;flex-shrink:0;width:100%;max-width:100%;padding:.5rem}.row>[class*=col]>*,.row>div>*,.grid>[class*=col]>*,.grid>div>*{margin:0}.row>div,.grid>div{flex:1 1 100%}@media(max-width: 40em){.row:not(.keep-width),.grid:not(.keep-width){flex-direction:column !important}.row:not(.keep-width)>[class*=col],.row:not(.keep-width)>div,.grid:not(.keep-width)>[class*=col],.grid:not(.keep-width)>div{width:auto}}footer{width:100%;padding:.5rem}footer>div{border-radius:calc(var(--radius) + .2rem);padding:.4rem}button,input[type=button],input[type=file],input[type=file]::file-selector-button,.btn{display:inline-flex;align-items:center;text-align:center;justify-content:center;cursor:pointer;gap:.4rem;line-height:1.5;font-size:1rem;border:.1rem solid var(--btn-brd);border-radius:var(--btn-radius);color:var(--btn-txt);background-color:var(--btn-bg);min-width:100px;cursor:pointer;padding:.4rem .7rem;margin:.4rem;outline-color:var(--primary);box-shadow:0 0 0 var(--btn-hs) var(--btn-f);transition:all 145ms ease;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=file]::file-selector-button{margin:0 .4rem 0 0}input[type=file]{inline-size:100%;padding:0;max-inline-size:max-content;background-color:var(--btn-brd);border:0}input[type=file]::file-selector-button{height:2.6rem;border-radius:var(--btn-radius) 0 0 var(--btn-radius)}button,input[type=button],.btn{height:2.6rem}button:active,button:focus,input[type=button]:active,input[type=button]:focus,.btn:active,.btn:focus{--btn-hs: .3rem}button:focus-visible,input[type=button]:focus-visible,.btn:focus-visible{outline:.1rem solid var(--btn-brd);outline-offset:.1rem}button:not(active):hover,input[type=button]:not(active):hover,.btn:not(active):hover{--btn-bg: var(--btn-bg-h);--btn-brd: var(--btn-bg-h)}button[disabled],input[type=button][disabled],.btn[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}button.fill:hover,input[type=button].fill:hover,.btn.fill:hover{background:var(--btn-bg);color:var(--btn-txt) !important}button>svg,input[type=button]>svg,.btn>svg{display:block;height:1.5rem;width:1.5rem;max-height:1.7rem}.btn-p{--btn-f: var(--primary-h);--btn-brd: var(--primary);--btn-bg: var(--primary);--btn-bg-h: var(--primary-l);--btn-txt: var(--txt-on-p)}.btn-red{--btn-f: var(--red-h);--btn-txt: var(--txt-on-red);--btn-brd: var(--red);--btn-bg-h: var(--red-l);--btn-bg: var(--red)}.card{display:flex;flex-wrap:wrap;flex-direction:column;gap:1rem;padding:1rem;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow)}.card>*{width:100%;margin:0}.card>img{height:auto;border-radius:var(--radius);width:100%}input[type=color]{-webkit-appearance:none;border:none;border-radius:var(--radius);width:32px;height:32px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--radius)}textarea,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]),select{display:block;width:100%;font-size:.875rem;line-height:1.25rem;height:2.6rem;padding:.6rem;border:.1rem solid var(--input-brd);border-radius:var(--radius);background-color:var(--input-bg);background-clip:padding-box;color:var(--input-txt)}textarea:focus,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):focus,select:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-h)}textarea[disabled],input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox])[disabled],select[disabled]{cursor:not-allowed}textarea:disabled,input:not([type=color]):not([type=file]):not([type=button]):not([type=range]):not([type=radio]):not([type=checkbox]):disabled,select:disabled{background-color:var(--input-brd);opacity:1}select{-webkit-appearance:none;-moz-appearance:none;color:var(--txt);background-image:url("data:image/svg+xml;utf8,");background-position:right center;background-size:18px 18px,18px 18px,2px 1.6rem;background-repeat:no-repeat}@supports(-webkit-appearance: none) or (-moz-appearance: none){input[type=radio]{--active: var(--primary);--active-inner: #fff;--focus: 3px var(--primary-h);--border: var(--input-brd);--border-hover: var(--primary);--background: var(--bg);-webkit-appearance:none;-moz-appearance:none;height:1.3rem;outline:none;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:.1rem solid var(--bc, var(--border));background:var(--b, var(--background));transition:background .3s,border-color .3s,box-shadow .2s}input[type=radio]:after{content:"";display:block;left:.1rem;top:.1rem;position:absolute;transition:transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s)}input[type=radio]:checked{--b: var(--active);--bc: var(--active);--d-o: 0.3s;--d-t: 0.6s;--d-t-e: cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=radio]:disabled{--b: var(--disabled);cursor:not-allowed;opacity:.9}input[type=radio]:disabled:checked{--b: var(--disabled-inner);--bc: var(--border)}input[type=radio]:hover:not(:checked):not(:disabled){--bc: var(--border-hover)}input[type=radio]:focus{--bc: var(--active);box-shadow:0 0 0 var(--focus)}input[type=radio]:not(.toggle){width:1.3rem}input[type=radio]:not(.toggle):after{opacity:var(--o, 0)}input[type=radio]:not(.toggle):checked{--o: 1}input[type=radio]{border-radius:50%}input[type=radio]:after{width:.9rem;height:.9rem;border-radius:50%;background:var(--active-inner);opacity:0;transform:scale(var(--s, 0.7))}input[type=radio]:checked{--s: 0.8}}.dialog,.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}.dialog{display:flex;z-index:50;padding:.5rem}.dialog[aria-hidden=true]{display:none}.dialog-overlay{background:rgba(43,46,56,.9)}.dialog-content{z-index:50;margin:auto;display:flex;flex-direction:column;align-items:start;max-block-size:80vh;max-block-size:80dvb;border-radius:.5em;width:100%;max-width:42rem;overflow:hidden;background:var(--bg)}.dialog-content *{margin:0}.dialog-content>*{padding:1rem}.dialog-content>footer{border-top:1px solid var(--brd);display:flex;gap:.5rem}.dialog-content>header{border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between}.dialog-content>section{width:100%}@keyframes dialog-fade-in{from{opacity:0}}@keyframes dialog-slide-up{from{transform:translateY(10%)}}.dialog-overlay{animation:dialog-fade-in 200ms both}.dialog-content{animation:dialog-fade-in 400ms 200ms both,dialog-slide-up 400ms 200ms both}@media(prefers-reduced-motion: reduce){.dialog-content{animation:none}}.gt-link{transition:all .25s ease-in-out;position:fixed;bottom:0;right:0;z-index:1;min-width:2.6rem;padding:.4rem;cursor:pointer;visibility:visible;opacity:1}.gt-link.hidden{visibility:hidden;opacity:0}@keyframes fade-out{from{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(0)}}@keyframes fade-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}._ta-center{text-align:center !important}._bg{background-color:var(--bg) !important}._bg2{background-color:var(--bg2) !important}._bg3{background-color:var(--bg3) !important}._sticky{position:sticky !important}._radius{border-radius:var(--radius) !important}._brd-bg3{border:2px solid var(--bg3) !important}._d-flex{display:flex !important}._mt-1{margin-top:1rem}._mt-2{margin-top:2rem}._my-2{margin-top:2rem;margin-bottom:2rem}._shadowless{box-shadow:none !important}._f-center{display:flex;flex-flow:wrap;justify-content:center;align-items:center}._p-0{padding:0}._p-1{padding:1rem}._py-1{padding-top:1rem;padding-bottom:1rem}[class*="-3m"]{--spacer-m: 3rem!important}._txt{color:var(--txt) !important}main{padding-top:6rem}.test{display:inline-flex;position:relative;align-items:center;justify-content:center;margin:0;font-size:18px;font-weight:bold;border-radius:var(--radius);text-align:center;box-sizing:border-box;background-color:var(--green);width:100%}.test.t-vh{height:calc(var(--100vh)/2)}.test.t-svh{height:calc(var(--100svh)/2)}.test.t-dvh{height:calc(var(--100dvh)/2)}.test.t-lvh{height:calc(var(--100lvh)/2)}.test.t-p{height:calc(var(--100p)/2)}.vtests{gap:.5rem}.vtests>*{padding:0 !important}div.test span{position:absolute;top:50%;width:30vh;transform:rotate(-90deg)}div.bar{width:20px;top:0px}.bar>.text{box-sizing:border-box;width:65vh;background-color:#fff;opacity:.7;height:20px;padding:0px 80px;transform:rotate(90deg);transform-origin:left bottom 0}.innerHeightLog{position:fixed;display:flex;gap:.5rem;align-items:center;top:80px;left:.5rem;padding:.5rem;background-color:var(--green);border-radius:var(--radius)} diff --git a/fontlist.html b/fontlist.html index 2efaf45..ed87737 100644 --- a/fontlist.html +++ b/fontlist.html @@ -1,7 +1,7 @@ - Fontlist - Toolz
Font Test
Click on below text to edit

abcde
12345


.custom-font {
+         Fontlist - Toolz                     
Font Test
Click on below text to edit

abcde
12345


.custom-font {
   font-family: Arial;
   font-weight: 500;
   font-size: 48px; 
   letter-spacing: 0px;
   line-height: 1.4;
-}
FontList

Standard fonts may appear differently on different devices or operating systems, causing inconsistency in the appearance of text on a webpage.
This testing tool allows you to check over 200+ standard fonts and see which ones are supported by your browser. The page displays a list of each supported font.
Users can also customize the sample text and adjust font size and style options to see how the different fonts look in various settings. This tool is useful for designers, developers, and anyone looking to experiment with different fonts on their website.

\ No newline at end of file +}
FontList

Standard fonts may appear differently on different devices or operating systems, causing inconsistency in the appearance of text on a webpage.
This testing tool allows you to check over 200+ standard fonts and see which ones are supported by your browser. The page displays a list of each supported font.
Users can also customize the sample text and adjust font size and style options to see how the different fonts look in various settings. This tool is useful for designers, developers, and anyone looking to experiment with different fonts on their website.

\ No newline at end of file diff --git a/index.html b/index.html index fdfec94..162a1eb 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ - Toolz by d3ward - Home

Toolz

Collection of browser testing tools.

Adblock Test
FontList
Units
\ No newline at end of file + Toolz by d3ward - Home

Toolz

Collection of browser testing tools.

Adblock Test
FontList
Units
\ No newline at end of file diff --git a/units.html b/units.html index 18de016..000915b 100644 --- a/units.html +++ b/units.html @@ -1 +1 @@ - Units - Toolz
Units

innerHeight property returns the height of the content area of a window
vh = 1% of the height of the viewport size

5 Units can be used with CSS to fix mobile issues; if you use a unit that does not match the innerheight, the user visiting your site may not see some absolute or fixed buttons because they are hidden by the navigation bar.
One of the browsers most affected by this problem is Webkit-based, so several units have been introduced over the years to compensate for the problem.
These tests can be used to check the value of each unit.

100vh
100%
100svh
100lvh
100dvh
100vh position:fixed
100lvh position:fixed
100svh position:fixed
100dvh position:fixed
100% position:fixed
100vh position:absolute
100lvh position:absolute
100svh position:absolute
100dvh position:absolute
100% position:absolute
CSS fix for 100vh 100vh in Safari CSS 100vh Mobile Browsers It’s not a bug, it’s a feature The trick of Viewport Units Avoid 100vh on Mobile Web WebKit Bugzilla Matt Smith Solution
\ No newline at end of file + Units - Toolz
Units

innerHeight property returns the height of the content area of a window
vh = 1% of the height of the viewport size

5 Units can be used with CSS to fix mobile issues; if you use a unit that does not match the innerheight, the user visiting your site may not see some absolute or fixed buttons because they are hidden by the navigation bar.
One of the browsers most affected by this problem is Webkit-based, so several units have been introduced over the years to compensate for the problem.
These tests can be used to check the value of each unit.

100vh
100%
100svh
100lvh
100dvh
100vh position:fixed
100lvh position:fixed
100svh position:fixed
100dvh position:fixed
100% position:fixed
100vh position:absolute
100lvh position:absolute
100svh position:absolute
100dvh position:absolute
100% position:absolute
CSS fix for 100vh 100vh in Safari CSS 100vh Mobile Browsers It’s not a bug, it’s a feature The trick of Viewport Units Avoid 100vh on Mobile Web WebKit Bugzilla Matt Smith Solution
\ No newline at end of file