:root{--font-base:"Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--font-code:"Monaspace Argon", "Monaco", "Andale Mono", "Lucida Console", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;--body-bg:light-dark(#f8f8f6,#212121);--common-base:light-dark(#f9f9f9,#212121);--common-base-rev:light-dark(#212121,#efeeea);--tooltip-bg-color:light-dark(#f8f8f6,#353535);--modal-bg-color:light-dark(#efeeea,color-mix(in srgb, var(--body-bg) 95%, var(--common-base-rev) 5%));--tooltip-text-color:light-dark(#212121,#ededed);--tooltip-shadow-color:light-dark(#00000015,#00000030);--tooltip-shadow-border:light-dark(#00000040,#00000030);--tooltip-hover:light-dark(#00000012,#00000012);--tooltip-hover-2:light-dark(#00000012,#ededed20);--text-color-0:light-dark(#212121,#f9f9f9);--text-color-1:light-dark(#212121,#ededed);--section-bg-1:light-dark(#21212109,#ededed10);--text-color-2:color-mix(in srgb, var(--text-color-1) 80%, var(--body-bg));--text-color-3:color-mix(in srgb, var(--text-color-1) 50%, var(--body-bg));--text-color-4:color-mix(in srgb, var(--text-color-1) 30%, var(--body-bg));--text-color-5:color-mix(in srgb, var(--text-color-1) 20%, var(--body-bg));--text-color-rev-1:var(--body-bg);--text-color-rev-2:color-mix(in srgb, var(--text-color-rev-1) 80%, #fff);--text-color-rev-3:color-mix(in srgb, var(--text-color-rev-1) 50%, #fff);--text-color-error:#fb423f;--common-border:color-mix(in srgb, var(--text-color-1) 10%, transparent);--common-border-5:color-mix(in srgb, var(--text-color-1) 50%, transparent);--nav-action-hover:light-dark(#2121210f,color-mix(in srgb, var(--common-base-rev) 7%, transparent));--nav-action-hover-2:light-dark(#2121210f,color-mix(in srgb, var(--common-base-rev) 20%, transparent));--border-color-1:light-dark(color-mix(in srgb, #000 10%, var(--body-bg)),color-mix(in srgb, #fff 6%, var(--body-bg)));--border-color-2:light-dark(color-mix(in srgb, #000 10%, var(--body-bg)),color-mix(in srgb, #fff 6%, var(--body-bg)));--border-color-3:light-dark(color-mix(in srgb, #212121 20%, var(--body-bg)),color-mix(in srgb, #fff 30%, var(--body-bg)));--border-color-5:light-dark(color-mix(in srgb, #212121 30%, var(--body-bg)),color-mix(in srgb, #fff 50%, var(--body-bg)));--border-color-6:light-dark(color-mix(in srgb, #212121 35%, var(--body-bg)),color-mix(in srgb, #fff 60%, var(--body-bg)));--border-color-9:light-dark(color-mix(in srgb, #212121 8%, var(--body-bg)),color-mix(in srgb, #fff 90%, var(--body-bg)));--border-color-11:light-dark(color-mix(in srgb, #212121 20%, var(--body-bg)),color-mix(in srgb, #fff 35%, var(--body-bg)));--border-color-12:light-dark(color-mix(in srgb, #212121 40%, var(--body-bg)),color-mix(in srgb, #fff 70%, var(--body-bg)));--border-color-rev-2:light-dark(color-mix(in srgb, #212121 12%, var(--body-bg)),color-mix(in srgb, #fff 20%, var(--body-bg)));--common-accent:light-dark(oklch(70.89% .185 75.67),oklch(76.89% .147 75.67));--default-common-accent:light-dark(oklch(70.89% .185 75.67),oklch(76.89% .147 75.67));--header-bg:color-mix(in srgb, #000 2%, var(--body-bg));--sidebar-bg:light-dark(#efeeea,color-mix(in srgb, #000 20%, var(--body-bg)));--modal-inner-bg:light-dark(#fff,color-mix(in srgb, #000 20%, var(--body-bg)));--input-placeholder:light-dark(var(--text-color-3),var(--text-color-3));--input-bg:light-dark(#21212114,#ffffff1a);--input-bg-focus:light-dark(color-mix(in srgb, #212121 13%, var(--body-bg)),#ffffff18);--dropdown-area-bg:light-dark(color-mix(in srgb, #212121 10%, var(--body-bg)),color-mix(in srgb, #fff 10%, var(--body-bg)));--dropdown-area-hover:var(--nav-action-hover);--dropdown-area-border:light-dark(#00000040,color-mix(in srgb, #fff 70%, var(--body-bg)));--omnibox-backdrop:blur(10px) saturate(60%);--omnibox-bg:light-dark(color-mix(in srgb, var(--common-base-rev) 10%, transparent 95%),color-mix(in srgb, var(--common-base-rev) 10%, transparent 95%));--l-multiplier:1.05;--c-multiplier:1.2;--text-color-accent-0:light-dark(oklch(calc(67.3% * var(--l-multiplier)) calc(.21 * var(--c-multiplier)) 25.039),oklch(67.3% .21 25.039));--text-color-accent-1:light-dark(oklch(calc(57.85% * var(--l-multiplier)) calc(.15 * var(--c-multiplier)) 349.06),oklch(57.85% .15 349.06));--text-color-accent-2:light-dark(oklch(calc(72.4% * var(--l-multiplier)) calc(.16 * var(--c-multiplier)) 19.59),oklch(72.4% .16 19.59));--text-color-accent-3:light-dark(#de9d77,#de9d77);--text-color-accent-5:light-dark(#ffb82e,#ffb82e);--text-color-accent-6:light-dark(#b8b9ee,#b8b9ee);--text-color-accent-7:light-dark(#88d2fc,#88d2fc);--text-color-accent-8:light-dark(oklch(calc(66.3% * var(--l-multiplier)) calc(.08 * var(--c-multiplier)) 200.71),oklch(66.3% .08 200.71));--text-color-accent-9:light-dark(#70d18c,#70d18c);--text-color-accent-10:light-dark(oklch(calc(69.1% * var(--l-multiplier)) calc(.12 * var(--c-multiplier)) 151.34),oklch(69.1% .12 151.34));--text-color-accent-11:light-dark(#5071a7,#5071a7);--promo-accent:light-dark(oklch(59.1% .12 151.34),oklch(69.1% .12 151.34))}.tooltip{max-width:min(400px,100vw - 10px);color:var(--text-color-1);background-color:var(--tooltip-bg-color);box-shadow:0px 8px 16px 0px var(--tooltip-shadow-color), 0px 0px 1px 0px var(--tooltip-shadow-border);text-align:center;white-space:normal;opacity:0;transition-behavior:allow-discrete;border:0;border-radius:8px;outline:0;margin:0;padding:1px;font-size:13px;font-weight:500;line-height:1.4;transition-property:transform,opacity,display,overlay;transition-duration:.2s;position:fixed;inset:auto;overflow:visible;transform:scale(.8);&:popover-open{opacity:1;transition-duration:30ms;display:flex;transform:none}&[data-placement^=top]{transform-origin:bottom}&[data-placement^=bottom]{transform-origin:top}&[data-placement^=left]{transform-origin:100%}&[data-placement^=right]{transform-origin:0}&:not([data-interactive]){pointer-events:none}& kbd{color:var(--text-color-3);margin-top:5px;font-size:11px;font-weight:500;display:inline-block;&.pro{background:var(--common-accent);text-transform:uppercase;color:var(--common-base);border-radius:4px;padding:3px 6px;font-size:9px;font-weight:700}}& code{background:#0000001a;border-radius:6px;margin-right:5px;padding:1px 4px;font-size:11px}& strong{font-weight:700}& .menuList{display:block}}@starting-style{.tooltip:popover-open{opacity:0;transform:scale(.8)}}.tooltipArrow{width:16px;height:16px;position:absolute;&:before{content:"";border-style:solid;border-color:#0000;position:absolute}}.tooltip[data-placement^=top]>.tooltipArrow{bottom:0;&:before{border-width:8px 8px 0;border-top-color:var(--tooltip-bg-color);bottom:-7px;left:0}}.tooltip[data-placement^=bottom]>.tooltipArrow{top:0;&:before{border-width:0 8px 8px;border-bottom-color:var(--tooltip-bg-color);top:-7px;left:0}}.tooltip[data-placement^=left]>.tooltipArrow{right:0;&:before{border-width:8px 0 8px 8px;border-left-color:var(--tooltip-bg-color);right:-7px}}.tooltip[data-placement^=right]>.tooltipArrow{left:0;&:before{border-width:8px 8px 8px 0;border-right-color:var(--tooltip-bg-color);left:-7px}}.tooltipContent{z-index:1;padding:5px 9px;position:relative;&:has(.windowSettings){text-align:left;padding:0}}.profileTooptipCont{text-align:left;margin-top:10px;padding:0 10px;font-size:.9em;& h4{color:var(--text-color-2);text-transform:uppercase;letter-spacing:1px;font-size:9px}}.ptcUserInfo{align-items:center;margin:10px 0 20px;display:flex;& .pseudoAvatar{width:50px;height:50px;box-shadow:inset 0 0 0 2px var(--common-border-5);font-size:15px}& .ptcAuthorName{margin-left:10px;font-size:1.5em;font-weight:700;& a{color:var(--text-color-6)}}}.ptcBasicInfo{& svg{width:16px;stroke:var(--common-accent);margin-right:5px}& p{align-items:center;display:flex}& a{color:var(--common-accent);font-weight:400;text-decoration:underline}}.socialInfo{gap:5px;margin:20px 0 15px;display:flex;& a{background-color:var(--tooltip-hover);color:var(--text-color-6);border-radius:4px;padding:4px 8px;&:hover{background-color:var(--common-accent);color:var(--text-color-1)}}}.menuList{text-align:left;width:230px;margin:4px 0;display:none;& a{color:var(--text-color-1);border-radius:8px;align-items:center;padding:8px 10px;font-weight:500;display:flex;&:hover{background-color:var(--tooltip-hover)}}& svg{width:20px;margin-right:10px}& li.disabled a{opacity:.4;pointer-events:none}}.withSeparator{border-top:solid 1px var(--tooltip-hover);margin-top:10px;padding-top:10px}:root{color-scheme:light dark}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:400}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}input,select{font-size:14px;font-family:var(--font-base)}html{scroll-behavior:smooth}body{font-family:var(--font-base);color:var(--text-color-1);background-color:var(--body-bg);margin:0;font-size:14px;font-weight:700}a{color:var(--text-color-1);text-decoration:none}#app{grid-template-rows:1fr auto;row-gap:20px;height:100dvh;display:grid}header{grid-template-columns:55px 1fr;padding:20px 0 0 20px;display:none;& h1{font-size:2em;font-weight:800}& a{background-color:var(--modal-bg-color);color:var(--text-color-3);border-radius:6px;margin-left:10px;padding:4px 6px;font-size:.8rem;font-weight:500}}#layout{background-color:var(--modal-inner-bg);grid-template-columns:1fr 1fr;gap:20px;padding:20px;display:grid;position:relative}.fontSpecimen{border:solid 1px var(--border-color-1);border-radius:8px;padding:20px;transition:all .1s;position:relative;&:hover{border:solid 1px var(--body-bg);background-color:var(--body-bg);& .actions{opacity:1;pointer-events:all}}& h3{margin-bottom:20px;font-size:1.1em;font-weight:700;& span{color:var(--text-color-4);margin-left:10px;font-size:.9em;font-weight:400}& a{color:var(--text-color-4);text-decoration:underline}& strong{color:var(--text-color-2);background-color:var(--input-bg-focus);border-radius:4px;margin-left:10px;padding:4px 6px;font-size:12px;font-weight:500}}& .code{white-space:pre-wrap;opacity:0;font-size:13px;font-weight:400;line-height:1.55em}&.loaded{& .code{opacity:1}}&.selected{border:solid 1px var(--common-accent);&:after{content:"Currently selected";background:var(--common-accent);pointer-events:none;color:var(--text-color-rev-1);border-radius:4px;padding:3px 6px;font-size:10px;position:absolute;top:-9px;right:12px}}}.hl_a{color:light-dark(#00f,#569cd6)}.hl_b{color:light-dark(teal,#3ec9b0)}.hl_c{color:light-dark(#0431fa,#e9a530)}.hl_d{color:light-dark(#319331,orchid)}.hl_e{color:light-dark(maroon,#b56595)}aside{box-shadow:0px 8px 16px 0px var(--tooltip-shadow-color), 0px 0px 1px 0px var(--tooltip-shadow-border);background-color:var(--body-bg);border-radius:8px;margin-left:20px;padding:20px}.actions{opacity:0;pointer-events:none;flex-direction:row;display:flex;position:absolute;bottom:10px;right:10px;& li{margin:0 5px}& a{background-color:var(--input-bg);font-variation-settings:"wght" 500;border-radius:5px;justify-content:flex-start;align-items:center;height:35px;padding:0 10px;display:flex;&:hover{background-color:var(--input-bg-focus);text-decoration:none}}& a:has(span){& svg{margin-right:6px}}}#dropdown-generator{& fieldset{gap:15px;margin:10px 5px;display:flex;& input{width:70px}}}.s10{& #app{grid-template-rows:60px 1fr}& header{align-items:center;display:flex;& h1{align-items:center;margin-left:20px;display:flex}}}
