@layer base,utils,components;@layer base{:root{--background0: #fff;--background1: #ddd;--background2: #bbb;--background3: #999;--foreground0: #000;--foreground1: #444;--foreground2: #888;--font-size: 16px;--line-height: 1.3;--font-weight-bold: 700;--font-weight-normal: 400;--font-family: monospace}[data-webtui-theme=dark]{--background0: #000;--background1: #222;--background2: #444;--background3: #666;--foreground0: #fff;--foreground1: #ccc;--foreground2: #999}body,html{background-color:var(--background0);color:var(--foreground0);font-family:var(--font-family);font-size:var(--font-size);font-weight:var(--font-weight-normal);line-height:var(--line-height, 1.5);font-variant-ligatures:common-ligatures}*{box-sizing:border-box;margin:0;padding:0;outline:none}}@layer utils{@property --box-rounded-radius{syntax: "<length>"; inherits: false; initial-value: 4px;}@property --box-border-width{syntax: "<length>"; inherits: false; initial-value: 2px;}@property --box-double-border-width{syntax: "<length>"; inherits: false; initial-value: 1px;}[box-~=square],[box-~=round],[box-~=double]{--box-border-color: var(--foreground0);position:relative;isolation:isolate;padding:1lh 1ch}[box-~=square]:before,[box-~=round]:before,[box-~=double]:before{content:"";position:absolute;top:50%;left:50%;translate:-50% -50%;width:calc(100% - 1ch - 2px);height:calc(100% - 1lh - 2px);border:solid var(--box-border-width) var(--box-border-color);z-index:-1}[box-~=square][box-~=round]:before,[box-~=round][box-~=round]:before,[box-~=double][box-~=round]:before{border-radius:var(--box-rounded-radius)}[box-~=square][box-~=round]:after,[box-~=round][box-~=round]:after,[box-~=double][box-~=round]:after{border-radius:calc(var(--box-rounded-radius) + 2px)}[box-~=square][box-~=double]:before,[box-~=round][box-~=double]:before,[box-~=double][box-~=double]:before{border-width:var(--box-double-border-width)}[box-~=square][box-~=double]:after,[box-~=round][box-~=double]:after,[box-~=double][box-~=double]:after{content:"";position:absolute;top:50%;left:50%;translate:-50% -50%;width:calc(100% - 1ch + 2px);height:calc(100% - 1lh + 2px);border:solid var(--box-double-border-width) var(--box-border-color);z-index:-1}[box-~=square][box-~="contain:none"],[box-~=round][box-~="contain:none"],[box-~=double][box-~="contain:none"]{padding-top:0;padding-bottom:0}[box-~=square][box-~="contain:!top"],[box-~=round][box-~="contain:!top"],[box-~=double][box-~="contain:!top"]{padding-top:0}[box-~=square][box-~="contain:!bottom"],[box-~=round][box-~="contain:!bottom"],[box-~=double][box-~="contain:!bottom"]{padding-bottom:0}}@layer components{button,[is-~=button]{--button-primary: var(--foreground0);--button-secondary: var(--background0);color:var(--button-secondary);background-color:var(--button-primary);font-family:var(--font-family);font-size:var(--font-size);line-height:var(--line-height);display:inline-flex;align-items:center;justify-content:center;border:none;padding:0 2ch;height:3lh;outline:none}button[box-],[is-~=button][box-]{color:var(--button-primary);background-color:transparent;--box-border-color: var(--button-primary)}button:focus,[is-~=button]:focus{font-weight:700;text-decoration:underline}button:active,[is-~=button]:active{color:var(--button-primary);background-color:var(--button-secondary)}button:active[box-],[is-~=button]:active[box-]{--box-border-color: var(--button-secondary);background-color:transparent}button:disabled,[is-~=button]:disabled{text-decoration:line-through;pointer-events:none}button[size-=small],[is-~=button][size-=small]{padding:0 1ch;height:1lh}button[variant-=foreground0],button:not([variant]),[is-~=button][variant-=foreground0],[is-~=button]:not([variant]){--button-primary: var(--foreground0);--button-secondary: var(--background0)}button[variant-=foreground1],[is-~=button][variant-=foreground1]{--button-primary: var(--foreground1);--button-secondary: var(--background0)}button[variant-=foreground2],[is-~=button][variant-=foreground2]{--button-primary: var(--foreground2);--button-secondary: var(--background0)}button[variant-=background0],[is-~=button][variant-=background0]{--button-primary: var(--background0);--button-secondary: var(--foreground0)}button[variant-=background1],[is-~=button][variant-=background1]{--button-primary: var(--background1);--button-secondary: var(--foreground0)}button[variant-=background2],[is-~=button][variant-=background2]{--button-primary: var(--background2);--button-secondary: var(--foreground0)}button[variant-=background3],[is-~=button][variant-=background3]{--button-primary: var(--background3);--button-secondary: var(--foreground0)}}@layer components{h1,h2,h3,h4,h5,h6{font-family:var(--font-family);font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight-bold)}h1 code,h2 code,h3 code,h4 code,h5 code,h6 code{color:inherit;background-color:var(--background1);padding:0 1ch}h1:before{content:"# "}h2:before{content:"## "}h3:before{content:"### "}h4:before{content:"#### "}h5:before{content:"##### "}h6:before{content:"###### "}ol{list-style-position:inside}ol li>ol{margin-left:2ch}ul{list-style-type:none}ul li:before{color:inherit;content:"- "}ul[marker-=bullet] li:before{content:"• "}ul[marker-~=tree] li:before{content:"├ "}ul[marker-~=tree]:not([marker-^=open]) li:first-of-type:before{content:"┌ "}ul[marker-~=tree]:not([marker-$=open]) li:last-of-type:before{content:"└ "}ul li>ul{margin-left:2ch}p,blockquote,li,[is-~=typography-block]{font-family:var(--font-family);font-size:var(--font-size);line-height:var(--line-height);color:var(--foreground1)}p:is(blockquote),blockquote:is(blockquote),li:is(blockquote),[is-~=typography-block]:is(blockquote){padding-left:2ch;position:relative}p:is(blockquote):before,blockquote:is(blockquote):before,li:is(blockquote):before,[is-~=typography-block]:is(blockquote):before{content:"";position:absolute;top:0;left:.5ch;width:var(--box-border-width, 2px);height:100%;translate:-50%;background-color:var(--background2)}p strong,blockquote strong,li strong,[is-~=typography-block] strong{font-weight:var(--font-weight-bold);color:var(--foreground0)}p a,blockquote a,li a,[is-~=typography-block] a{text-decoration:underline}p code,blockquote code,li code,[is-~=typography-block] code{display:inline-block;background-color:var(--background1);padding-left:1ch;padding-right:1ch}}@layer components{[is-~=badge]{color:var(--badge-text);background-image:linear-gradient(90deg,transparent 0,transparent calc(1ch - 1px),var(--badge-color) calc(1ch - 1px),var(--badge-color) calc(100% - 1ch + 1px),transparent calc(100% - 1ch + 1px),transparent);display:inline-flex;vertical-align:middle;white-space:nowrap;height:1lh;line-height:1lh}[is-~=badge][variant-=foreground0],[is-~=badge]:not([variant]){--badge-color: var(--foreground0);--badge-text: var(--background0)}[is-~=badge][variant-=foreground1]{--badge-color: var(--foreground1);--badge-text: var(--background0)}[is-~=badge][variant-=foreground2]{--badge-color: var(--foreground2);--badge-text: var(--background0)}[is-~=badge][variant-=background0]{--badge-color: var(--background0);--badge-text: var(--foreground0)}[is-~=badge][variant-=background1]{--badge-color: var(--background1);--badge-text: var(--foreground0)}[is-~=badge][variant-=background2]{--badge-color: var(--background2);--badge-text: var(--foreground0)}[is-~=badge][variant-=background3]{--badge-color: var(--background3);--badge-text: var(--foreground0)}[is-~=badge]:before,[is-~=badge]:after{content:"";width:1ch;height:1lh;display:inline-block;vertical-align:middle;background-color:var(--badge-color);overflow:hidden}[is-~=badge][cap-^=round]:before{border-top-left-radius:1lh;border-bottom-left-radius:1lh}[is-~=badge][cap-$=round]:after{border-top-right-radius:1lh;border-bottom-right-radius:1lh}[is-~=badge][cap-^=triangle]:before{clip-path:polygon(100% 0,100% 100%,0 50%)}[is-~=badge][cap-$=triangle]:after{clip-path:polygon(0 0,0 100%,100% 50%)}[is-~=badge][cap-^=slant-top]:before{clip-path:polygon(0 0,100% 0,100% 100%)}[is-~=badge][cap-$=slant-top]:after{clip-path:polygon(0 0,100% 0,0 100%)}[is-~=badge][cap-^=slant-bottom]:before{clip-path:polygon(100% 0,100% 100%,0 100%)}[is-~=badge][cap-$=slant-bottom]:after{clip-path:polygon(0 0,100% 100%,0 100%)}[is-~=badge][cap-^=ribbon]:before{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,100% 50%)}[is-~=badge][cap-$=ribbon]:after{clip-path:polygon(0 0,100% 0,0% 50%,100% 100%,0% 100%)}}@layer components{input,[is-~=input]{background-color:var(--background1);color:var(--foreground0);font-family:var(--font-family);font-size:var(--font-size);font-weight:var(--font-weight-normal);line-height:var(--line-height);outline:none;border:none;min-width:24ch}input::placeholder,[is-~=input]::placeholder{color:var(--foreground2)}input:not([size-]),[is-~=input]:not([size-]){height:1lh;padding:0 1ch}input[size-=small],[is-~=input][size-=small]{height:1lh;padding:0}input[size-=large],[is-~=input][size-=large]{height:3lh;padding:1lh 2ch}}@layer components{@property --popover-offset-x{syntax: "<length>"; inherits: true; initial-value: 0;}@property --popover-offset-y{syntax: "<length>"; inherits: true; initial-value: 0;}details[is-=popover]{--popover-backdrop-color: transparent;position:relative}details[is-=popover] summary:focus{text-decoration:underline}details[is-=popover] summary::marker{content:"";display:none}details[is-=popover][open] summary:before{content:"";display:block;width:100vw;height:100vh;position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;background-color:var(--popover-backdrop-color);cursor:default}details[is-=popover][open] summary::marker{content:"";display:none}details[is-=popover][open] summary+*{position:absolute;z-index:2}details[is-=popover][open][position-~=baseline-left] summary+*,details[is-=popover][open]:not([position-]) summary+*{left:0%}details[is-=popover][open][position-~=baseline-right] summary+*{left:100%;translate:-100%}details[is-=popover][open][position-~=left] summary+*{left:calc(var(--popover-offset-x) * -1);translate:-100%}details[is-=popover][open][position-~=right] summary+*{left:calc(100% + var(--popover-offset-x))}details[is-=popover][open][position-~=baseline-top] summary+*{top:0%}details[is-=popover][open][position-~=baseline-bottom] summary+*{top:100%;transform:translateY(-100%)}details[is-=popover][open][position-~=top] summary+*{top:calc(var(--popover-offset-y) * -1);transform:translateY(-100%)}details[is-=popover][open][position-~=bottom] summary+*,details[is-=popover][open]:not([position-]) summary+*{top:calc(100% + var(--popover-offset-y))}}@layer components{input[type=checkbox]{appearance:none;-webkit-appearance:none;-moz-appearance:none;display:inline-block;position:relative;width:3ch;min-width:initial;vertical-align:text-top;cursor:pointer;color:var(--foreground2);font-family:var(--font-family);font-size:var(--font-size);line-height:var(--line-height);outline:none}input[type=checkbox]:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;display:inline-flex;align-items:center;justify-content:center;width:3ch;height:1lh;background:var(--background1)}input[type=checkbox]:checked:before{content:"X"}label:has(input[type=checkbox]){display:inline-flex;align-items:flex-start;gap:1ch;cursor:pointer;max-width:fit-content}label:has(input[type=checkbox]:focus){font-weight:700;text-decoration:underline}input[type=checkbox]:disabled{color:var(--foreground2);cursor:default;pointer-events:none}label:has(input[type=checkbox]:disabled){color:var(--foreground2);text-decoration:line-through;cursor:default}}