.grid { display: grid !important; }
.flex { display: flex !important; grid-gap: 1em; align-items: baseline; width: fit-content; }
.hidden { display: none !important; }
.conts { display: contents !important; font-size: 1em !important; }
.auto { width: fit-content !important; height: fit-content !important; min-height: unset !important; min-width: unset !important; margin: auto !important; }
.end { place-items: end; }
.onAuto { display: none; }
.auto > div { display: none !important; }
.auto > div.onAuto { display: block !important; }
.flex.abs { width: auto; }
.flex > * { margin: auto; }
.flex .btn { border: none; padding: unset; margin: unset; top: 0.2em; }
.flex .btn svg { background-color: var(--textaction); padding: 0.35em; width: 2em; margin: auto; border-radius: 50%; }
svg:first-child:last-child { margin: 0; }
.conts > svg:first-child:last-child { margin: 0 0.5em; }
svg.reddot, svg.rednew { position: absolute; right: 0 !important; opacity: 1 !important; z-index: 10; color: var(--notif); }
svg.reddot { color: var(--notif) !important; padding: 0 0 0.7em 0.7em !important; -webkit-filter: drop-shadow(0px 0px 1px currentColor) !important; }
svg.rednew { bottom: 0 !important; padding: 0 !important; width: 0.8em !important; background-color: transparent !important; margin: auto 0 0 auto !important; }
div.rednew { display: block; margin: auto; aspect-ratio: 1 / 1; width: fit-content; position: relative; min-width: unset !important; }
.rednew svg:first-of-type { width: 2em; padding: 0.5em; border-radius: 50%; position: static; margin: auto; background-color: var(--white); color: var(--brown); }
.rednew svg:last-of-type { position: absolute; bottom: 0 !important; top: auto; left: auto; right: 0; padding: 0 !important; width: 0.8em !important; background-color: transparent !important; color: var(--notif); -webkit-filter: drop-shadow(0px 0px 1px currentColor) !important; }
svg[nn=yes].rednew { color: var(--turquoise); }
.trash { margin: 3em auto 0; -webkit-filter: drop-shadow(1px 1px 4px var(--oops) ); }
.float { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.3); display: grid; place-content: center; background-color: rgba(0,0,0,0.5); aspect-ratio: 1 / 1; border-radius: 50%; place-content: center; padding: 3em; width: 35em; margin: auto; }
.float .checks { position: absolute; bottom: 3em; left: 0; right: 0; margin: auto; grid-column: 1 / -1; width: 12em; }
.float .close { position: absolute; bottom: 45%; left: auto; right: 1rem; margin: 0; font-size: 2em; color: var(--action); }
.float input, .float select { width: 4em; padding: 0.2em }
.float .time input { width: 1.75em; font-size: 1.5em; }
.linkback { position: absolute; top: 5em; left: 4em; z-index: 2; }
.linkback > * { font-size: 0.7em; position: relative; }
.linkback > a { color: var(--backlay) !important; }
.flex .oneline { margin: auto !important; }
h1 + .flex { margin-top: 1.5em; }
.central { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; display: grid; place-content: center; aspect-ratio: 1 / 1; width: 10em; max-width: 10em; }
.central > * { max-width: inherit; }
.cnr { position: fixed; bottom: 0; left: 0; top: 0; right: 0; margin: auto; }
.cnr.mgn { margin: 1rem; }
.cnr .close { position: absolute; z-index: 2; color: var(--action); top: inherit; bottom: inherit; left: inherit; right: inherit; width: 3em; padding: 1em; }
.br { left: auto; right: 0; top: auto; bottom: 0; text-align: right; }
.bm { left: auto; right:auto; top: auto; bottom: 0; text-align: center; }
.bl { left: 0; right: auto; top: auto; bottom: 0; text-align: left; }
.tr { left: auto; right: 0; bottom: auto; top: 0; text-align: right; }
.tm { left: auto; right:auto; top: 0; bottom: auto; text-align: center; }
.tl { left: 0; right: auto; bottom: auto; top: 0; text-align: left; }
.flex.abs.tr { top: -0.5em; font-size: 0.8em; }
.card, .command { display: block; position: absolute; bottom: auto; left: auto; top: auto; right: auto; color: var(--textaction); }
.card { bottom: 5em; left: 5em; text-align: left; max-width: 30em; }
.card > * { margin: 0; }
.card [contenteditable]:empty { min-width: 12rem; }
.command { bottom: 2em; right: 2em; text-align: right; max-width: 12em; }
.command input[type] + label { display: inline-block; background-color: rgba(0, 0, 0, 0.7); border-radius: 2em; padding: 0.5em; line-height: 0.8em; color: var(--white); opacity: 1; margin: 0 0.5em; }
.command input[type] + label svg { width: 1.3em; top: 0; }
#eggBox { }
.egg { display: flex; width: fit-content; grid-gap: 1em; padding: 2em; }
.egg button { display: contents; }
.egg svg { opacity: 1 !important; }
.egg *:hover { color: var(--lowlink) !important; }
.command #qrBox { max-width: 18em; }
.veil.bl { background-image: linear-gradient(30deg, rgba(0, 0, 0, 0.9) 1.5em, rgba(0, 0, 0, 0.1) 33%); background-color: transparent; }
.fs .cnr { padding: 5em 0 0 3em; max-width: 20vw; }
@media only screen and (max-width: 609px) { .card { bottom: 0; left: 0; padding: 2rem; }
.command { bottom: 0; right: 0; padding: 2rem; }
.fs .cnr { padding: 5em 1.5em 0; max-width: unset; }
}
.blink { animation: blink 3s linear infinite; -webkit-filter: drop-shadow(0px 0px 4px currentColor); }
.close.rot { animation: spin 5s linear infinite; -webkit-filter: drop-shadow(0px 0px 4px #222); }
@media only screen and (max-width: 609px) { p, h1, h2, h3, h4, blockquote, ul, ol, table, form, .ctn, .wiki { max-width: calc(100vw - 2rem); }
}
.heads { }
.heads .alt.menu { padding: 1em; display: contents; }
.heads .alt.menu > * { position: fixed; padding: 1em; grid-gap: 1.4em; }
.heads .alt.menu :first-child { z-index: 10; }
.heads .alt.menu :first-child input[type] + label { border: none; padding: 0; position: relative; opacity: 1; color: var(--lowlink); -webkit-filter: drop-shadow(1px 1px 0px #222); }
.heads .alt.menu :first-child input[type] + label svg { padding: 0; left: unset; opacity: 0.8; }
.heads .alt.menu .stack { z-index: 9; margin: 0 auto 0 0; width: fit-content; height: 0; }
.heads .alt.menu .ctn { font-size: 1em; color: var(--light); font-family: Raleway; font-variation-settings: "wght" 250; max-width: 30em; }
.menubox { position: fixed !important; top: 0 ; left: 0; bottom: 0; width: max-content; max-width: 60vw; min-width: 20em; padding: 6rem 2rem; z-index: 9; background-color: var(--menu); color: var(--cream); overflow: scroll; }
.menubox > div { display: grid; grid-template-columns: 100%; grid-gap: 0.5em; margin: 0 auto 0 0; font-size: 0.85em; }
.menubox > div > * { width: 100%; text-align: left; }
.menubox ul { display: grid; }
.menubox a { color: var(--cream); }
.menubox a svg { display: inline-block; opacity: 1; margin: 0 1em 0 0; }
.menubox > div > p { opacity: 0.5; font-family: monospace; padding: 0.5em 0 0; }
.menubox h2 { font-size: 2em; font-variation-settings: "wght" 180; padding: 0.3em 0 0; font-family: Oswald; }
.menubox h2 svg { margin: 0; top: 0; padding: 0.2em 0 0; }
.menubox h4 { font-size: 0.85em; font-family: Oswald; padding: 0; color: var(--dark-gre); }
.menubox .icons a { display: contents; }
.menubox .icons li { opacity: 0.7; }
.menubox .icons span{ font-size: 0.5em; opacity: 1; }
.menubox .icons li:hover { opacity: 0.85; }
.menubox .icons li:active { opacity: 1; }
.menubox input[type=checkbox] + label { display: block; position: relative; width: 100%; }
.menubox input[type=checkbox] + label svg { display: inline-block; position: absolute; right: 0; top: -0.3em; }
.menubox input[type=checkbox] + label + div { text-align: left; font-size: 0.9em; padding: 0 2em; }
.menubox input[type=checkbox] + label + div a { display: block; width: 100%; }
.menubox .ctn h4 { color: currentColor; font-size: 1em; font-variation-settings: "wght" 330; padding: 0.5em 0 0.2em; }
.menubox .ctn > * { color: var(--cream); }
.menubox .ctn .styler { opacity: 0.5; font-size: 0.85em; }
.notifs { display: grid; grid-template-columns: repeat(auto-fit, 5em); grid-gap: 0.2em; }
.notifs h3, .notifs h4, .notifs div { grid-column: 1 / -1; text-align: left; width: 100%; }
.notifs div > * { width: 100%; text-align: left; max-width: 18em; margin: 0; }
.notifs h3 { opacity: 0.3; padding: 1em 0 0; }
.notifs svg.back { opacity: 0.3; width: 80%; bottom: auto; top: 0.3em; left: auto; right: 0.3em; margin: 0 0 auto auto; }
.notifs > a { display: grid; grid-template: 2fr 1fr / 1fr; aspect-ratio: 1 / 1; border: none; position: relative; width: 100%; font-variation-settings: "wght" 400; text-align: left; }
.notifs a > span { display: block; font-size: 0.8em; width: 100%; padding-top: 0.5em; }
.notifs a > span:nth-child(2) { font-size: 1.5em; align-self: end; }
.notifs span span { font-size: 0.5em; }
.VP .notifs { max-width: 100%; grid-gap: 1em; }
@media screen and (max-width: 609px) { .menubox { padding: 5rem 1.3rem; font-size: 0.85em; }
.menubox a { font-weight: 400; }
.menubox .vspacer { margin: 0.5em auto 1em auto; }
.notifs { max-width: calc(100vw - 1rem); }
}
input:checked + label + .mini { display: inline-block !important; }
.mini { display: block; position: relative !important; background-color: var(--link); color: var(--textaction); right: 1em; margin: calc(-50% + 1em) 0 0; width: 10rem; height: auto; padding: 1em !important; }
.mini ul { display: block; width: 100%; }
.mini li { display: grid; width: 100%; grid-template-columns: 1em auto; grid-gap: 1em; text-transform: capitalize !important; font-size: 0.9em; }
.mini li span { width: 100%; margin: 0; text-align: left !important; display: block; }
.mini a { color: inherit; }
.mini input[type=radio] + label { display: grid; width: 100%; grid-template-columns: auto 1fr; grid-gap: 0.5em; opacity: 1; margin: 0; padding: 0.3em 0; }
.mini input[type] + label svg { padding: 0.1em; top: 0; border: none; background: unset; }
.mini label span { width: 100% !important; text-align: left; font-size: 0.8em; }
.mini > svg { position: absolute; right: -0.5em; top: 0; bottom: 0; left: auto; margin: auto; color: var(--link); }
.mini input[type=radio]:hover + label { background-color: var(--action); }
.mini input[type=radio]:checked + label, .mini input[type=radio]:active + label { color: var(--action); }
.mini input[type]:checked + label svg { color: inherit; }
.itemlist .mini { margin: -5em 0 0 -11em; }
.alert { position: fixed; width: 100vw; height: 100vh; z-index: 9; background-color: rgba(0, 0, 0, 0.15); text-align: center; }
.alert > div:first-child { display: grid; place-items: center; background-color: rgba(0, 0, 0, 0.8); color: var(--yellow); height: auto; min-height: 8rem; padding: 3rem; -webkit-filter: drop-shadow(1px 1px 2px #000); }
.alert * { text-align: center; margin: auto; font-variation-settings: "wght" 700; }
.alert p { color: white; font-variation-settings: "wght" 270; font-size: 0.85em; }
.alert .btn { display: grid; place-content: center; padding: 0.5em; margin: 1em auto; border-radius: 2em; border: none; color: black; background-color: var(--oops); font-family: Oswald; min-width: 2.65em; }
.alert .close { bottom: 0.8em; color: var(--oops); background-color: black; margin: auto; }
.alert p.fineprint { font-size: 0.6em; }
.popup { position: fixed; top: 6em; bottom: 0em; right: 0; left: 0; margin: auto; display: block; max-width: calc(100vw - 4rem); height: fit-content; background-color: var(--menu); color: var(--cream); width: 20Em; z-index: 20; padding: 2rem; box-shadow: 3px 3px 36px #000; }
.popup form label { padding: 1em 0 0.5em; font-size: 0.8em; font-weight: 700; display: block; }
.popup input[type=submit] { margin-top: 2.5em; }
.popup input[type=text], .popup input[type=number], .popup input[type=password], .popup textarea, .popup select { color: var(--brown); }
.popup ::placeholder { color: var(--cafe); }
.popup svg.close { position: absolute; top: 1em; right: 1em; color: var(--link); padding: 0; margin: 0; width: 1em; background-color: transparent; }
.popup svg.undsp { position: absolute; top: auto; bottom: 0.7em; right: 0.7em; color: var(--link); padding: 0; margin: 0; width: 1em; background-color: transparent; }
.popup .icons { display: grid; width: 100%; margin: 0 auto; }
.popup .btn { padding: 0.8em; }
.popup .fineprint { margin: 0.7em 0; }
.popup.alt { text-align: left; }
.popup.alt > div:first-child { margin-bottom: 2em; }
.popup.alt > div:first-child input[type] + label { border: none; color: currentColor; opacity: 0.7; padding: 0; margin: auto auto 0 0; font-variation-settings: "wght" 350; }
.popup.alt > div:first-child input[type]:checked + label { font-size: 2em; opacity: 1; position: relative; bottom: -0.17em; }
.popup.alt [type=submit] { margin-left: 0; }
.popup.small { aspect-ratio: 1 / 1; border-radius: 50%; }
.popup.small .thumb { max-width: 8em; }
.popup.small .onpop { place-content: center; margin: 1em auto; grid-gap: 1em; }
.popup.small .tools svg { opacity: 0.5; }
.popup.small .close { top: auto; bottom: 1em; left: auto; right: auto; color: var(--action); }
.popper .close { display: none; }
.popper .popup .close { display: block; }
@media screen and (max-width: 609px) { .popup { font-size: 0.85em; top: 2em; }
}
li.popup { background-color: var(--creli); color: var(--taupe); width: 36rem; min-height: 36rem; top: 0; box-shadow: 1px 1px 7px var(--taupe); padding: 2em; border-radius: 0.4em; }
li.popup h2 { font-size: 0.7em; color: var(--cafe); text-transform: uppercase; font-variation-settings: "wght" 350; padding: 0 0 0.5em; }
li.popup h4 { font-size: 2em; }
li.popup form { padding: 0; }
li.popup input { background-color: transparent; }
li.popup input:focus { background-color: var(--cafli); }
li.popup .sidelabel { grid-gap: 2em 1em; margin: 1em 0; grid-template-columns: 8em 1fr; }
li.popup .block { }
li.popup :active { color: var(--cafe); }
li.popup [contenteditable] { min-height: 1em; min-width: 8em; }
.creds { margin: auto 3rem 5rem auto; font-size: 0.9em; padding: 1em; width: fit-content; }
.creds > div { display: grid; grid-template-columns: 6em 12em; place-content: start; grid-gap: 1em; }
.creds > div > * { display: block; margin: 0 0 auto; }
.creds > div p { position: static; font-size: 0.85em; width: 100%; }
.imgPrm { display: grid; grid-template: 1fr auto / 100%; }
.imgPrm div.img { aspect-ratio: 1 / 1; object-fit: contain; border: 1px dashed var(--brack); }
.imgPrm div.img img { object-fit: contain; }
.popup.light { background-color: var(--creli); color: var(--taupe); width: 36rem; min-height: 36rem; top: 0; box-shadow: 1px 1px 7px var(--taupe); padding: 2em; border-radius: 0.4em; }
.popup.light h2 { font-size: 0.7em; color: var(--cafe); text-transform: uppercase; font-variation-settings: "wght" 350; padding: 0 0 0.5em; }
.popup.light h3 svg { padding: 0.1em; }
.popup.light a, .popup.light button { color: var(--editBl); background-color: transparent; }
.popup.light *[type=submit] { background-color: var(--editBl); color: var(--white); border: none; min-height: 3em; min-width: 3em; margin-bottom: 0; }
.popup.light .inline > svg { position: relative; top: 0.25em; width: 1.5em; margin-right: 1em; }
.popup.light div[id] > span { display: inline-block; padding: 0.15em 0.15em 0.15em 0.3em; margin-right: 0.3em; border-radius: 0.2em; background-color: var(--whitey); position: relative; }
.popup.light div[id] > span svg.remove { width: 1em; margin-left: 0.3em; padding: 0.1em; position: relative; display: inline-block; top: 0.15em; }
.popup.light input + label.btn { opacity: 1; }
.popup.light input + label.btn svg { border-radius: 50%; padding: 0.25em; top: 0.15em; }
.popup.light input { background-color: transparent; padding: 0; text-align: left; border-bottom: 1px dotted var(--grock); width: 5em; }
.popup.light input[concat] { border-bottom: none; width: 100%; text-align: center; }
.popup.light input[concat].transparent { }
.popup.light .oneline input[concat] { width: 100%; }
.popup.light .inline input[type=text] { padding: 0; width: 5em; }
.popup.light .addr { grid-template-columns: 2fr 1fr; width: 12em; }
.popup.light .inline .addr input[type=text] { width: 100%; }
.popup.light *[type=submit].btn { position: absolute; right: 1rem; bottom: 1rem; margin: 0; padding: 0.5em; border-radius: 50%; width: fit-content; font-size: 1em; font-variation-settings: "wght" 650; }
.popup.light form *[type=submit] { position: static; margin: 0; }
.popup.light .oneline { width: max-content; }
.popup.light .oneline input { width: 7em; }
.popup.light .block { justify-content: center; }
.popup.light .block input + label { }
.popup.light .block input:checked + label { }
.block.hashtag input + label { display: block; color: inherit; background-color: transparent; font-variation-settings: "wght" 400; font-size: 1.1em; padding: 0.2em 0.4em; }
.block.hashtag input:checked + label { background-color: var(--whitey); }
.popup.feather { background-color: transparent; background-image: radial-gradient( #000d 40%, #0005 70%); color: var(--cream); max-width: 100vw; max-height: 100vh; width: 100%; top: 0; padding: 25% 20%; }
.popup.feather > div { position: relative; display: grid; grid-gap: 1em; }
.popup.feather input { background-color: var(--browner); }
.popup.feather .btn { margin: -1em auto; padding: 0.6em 1.2em; }
.popup.feather .close { top: 20%; right: 20%; }
.popup.feather button { color: inherit; border: none; }
.popup.feather button svg { color: inherit; border: none; color: var(--editBl); }
.popup.feather ::placeholder { color: var(--beige); }
@media only screen and (max-width: 609px) { .popup.light { min-height: 24rem; }
.popup.feather { padding: 25% 1em; grid-gap: 0.3em; background-image: unset; border-radius: 50%; background-color: black; }
}
footer { display: grid; grid-gap: 2.5em; background-color: black; color: var(--beige); width: 100%; padding: 3em 2em 1.5em; font-size: 0.8em; text-align: center; z-index: 8; position: relative; }
footer * { padding: 0; }
footer h2 { font-variation-settings: "wght" 150; font-size: 2em; width: 100%; padding: 0.8em 0; }
footer h3 { font-variation-settings: "wght" 400; padding-bottom: 0.35em; }
footer h4 { font-variation-settings: "wght" 320; font-family: 'Oswald'; padding: 0.5em 0 1em; letter-spacing: 0.03em; }
footer p { font-size: 0.9em; font-variation-settings: "wght" 240; }
footer a { color: var(--weGuid); opacity: 0.9; font-size: 1.1Em; }
footer a:hover { color: var(--weGuid); opacity: 1; }
footer div[ajf].oops { background-color: rgba(240,192,20, 0.1); color: var(--white); padding: 2em; margin: 1.5em auto; }
footer div[ajf] * { text-align: center; }
footer button { background-color: var(--weGuid); border-radius: 0; color: inherit; }
footer *[type=button].inline { color: var(--weGuid); opacity: 0.9; font-size: 1.1em; border: none; font-style: inherit; }
footer *[type=button].inline:hover { color: var(--weGuid); opacity: 1; }
}
footer form label svg { color: var(--weGuid); }
footer form label div { opacity: 1; }
footer .fb > div { border: 1px dashed var(--weGuid); padding: 1em; border-radius: 0.5em; }
footer .fb label svg { color: var(--weGuid); }
footer .fb input[type]:checked + label svg { -webkit-filter: drop-shadow(1px 1px 1px currentColor); }
footer textarea { width: 20em; margin: 2em auto; padding: 1em; color: var(--weGuid); background-color: transparent; border: 1px dashed; }
footer *[type=submit] { background-color: var(--weGuid); color: black; border: none; }
footer .oops { width: 100%; }
.oops .fb { grid-template-columns: repeat(auto-fit, minmax(11em, auto)); }
@media only screen and (max-width: 780px) { footer textarea { width: 80%; }
footer .fb { grid-gap: 0.2em; }
.oops .fb { grid-template-columns: repeat(auto-fit, minmax(40%, 1fr)); grid-gap: 0.7em; width: 100%; }
}
.footer { padding: 2em; font-size: 0.8em; background-color: var(--lowbkg); color: var(--cream); position: relative; text-align: center; }
.footer h3 { padding: 0.8em 0 1.5em; font-size: 1.8em; border: none; }
.footer h4 { padding: 1em 0; }
.footer a { color: var(--turquoise); }
.footer button { padding: 0.5em 1em; color: var(--lowbkg); background-color: var(--cream); border-radius: 0.3em; font-variation-settings: "wght" 575; width: auto; margin: 1em auto; }
.footer div svg { }
.footer .grid > div { text-align: center; }
.footer .grid svg { display: inline-block; top: 0; margin: auto; background-color: var(--cream); opacity: 1; color: #122; width: 2.5em; height: 2.5em; padding: 0.6em; border-radius: 50%; font-size: 1em; }
.footer .grid h4 { padding: 0 0 1em; font-variation-settings: "wght" 600; }
.footer .grid form { display: contents; }
.footer .grid button { display: contents; font-size: unset; }
.footer.sub { background-color: transparent; color: var(--text); font-size: 0.7em; }
.footer.sub .fb input[type] + label svg { background-color: #bbb; color: #111; }
.footer.sub .fb input[type]:checked + label svg { background-color: #ddd; }
.footer.sub h3 { padding: 0.5em 0 1em; font-size: 1.4em; }
.footer.sub p { padding: 1em 0; }
.footer.sub svg { }
.footer > div ~ div { display: none; }
.footer > div.hidden ~ div { display: block; }
@media only screen and (max-width: 609px) { footer { padding: 2em 1em; font-size: 0.8em; }
footer h2 { font-size: 1.4em; }
footer > *, footer > .conts > * { max-width: calc(100vw - 3em); width: 100%; }
.footer { padding: 2em 1em; }
}
.footer .tip { background-color: rgba(34,222,51,0.1); color: var(--light); padding: 1em; width: 100%; margin: 2em auto; position: relative; }
.footer .tip::before { content: 'Tip: '; position: absolute; left: 1em; color: var(--youCan); font-family: Oswald; font-variation-settings: "wght" 600; }
.footer .tip svg { color: var(--youCan); }
.foots { display: contents !important; }
.debug { background-color: white; color: black; padding: 2em; line-break: anywhere; position: relative; text-align: left; font-size: 1rem; }
