html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:root{--primary-color: #F0F0F4;--secondary-color: #15141A;--main-color: #fde725;--gray--color: #CCC;font-family:Karla,sans-serif}html{scrollbar-width:none}html::-webkit-scrollbar{width:0px}a{color:var(--primary-color)}label{display:block;font-size:.9rem;font-weight:500;color:#aaa;margin-bottom:4px}.checkbox{margin-top:8px;position:relative}input[type=text],textarea{display:block;width:100%}input[type=checkbox]{width:24px;height:24px;position:absolute;opacity:0;cursor:pointer;z-index:1}input[type=checkbox]+span.checkmark{content:"";display:block;box-sizing:border-box;width:32px;aspect-ratio:1;border-radius:5px;background-color:var(--secondary-color)}input[type=checkbox]+span.checkmark:after{color:#444;font-size:32px;content:"\2714";padding:1px}input[type=checkbox]:checked+span.checkmark:after{color:var(--primary-color);content:"\2714";padding:1px}.hero{background-color:var(--secondary-color);height:100vh;width:100vw;top:0;left:0;display:flex;vertical-align:middle;justify-content:center;flex-direction:column;z-index:1;gap:2rem;animation-name:hero;animation-duration:4s;animation-timing-function:ease-in;transform:translateY(0);position:relative}.hero__title{color:var(--main-color);font-size:5rem;text-align:center;font-family:DynaPuff,cursive}.hero__author{color:var(--primary-color);font-size:1rem;text-align:center;font-family:DynaPuff,cursive}.hero__author>a{color:var(--main-color)}.mural{width:100%;height:100vh;position:relative;overflow:hidden;background-color:var(--secondary-color)}.branch{position:absolute;overflow:hidden;box-sizing:border-box;transition:all;display:flex;gap:8px;flex-direction:column;cursor:pointer;user-select:none;color:#fff;text-align:left;outline:2px solid #FFF;transition:width .3s,height .3s,top .3s,left .3s}.branch__title{mix-blend-mode:difference;font-family:DynaPuff,cursive;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.branch__description{mix-blend-mode:difference;font-family:Karla,sans-serif;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}.board{position:fixed;display:none;top:0;left:0;width:100%;height:100%;z-index:10000}.board.show{display:block}.board__container{position:absolute;box-sizing:border-box;display:flex;flex-direction:column;gap:8px;max-width:calc(100vw - 16px);height:520px;overflow:hidden;margin:0 auto;width:680px;transform:translate(-50%,-50%);padding:16px;border-radius:5px;top:50%;left:50%;background-color:var(--secondary-color);color:var(--primary-color);box-shadow:#0003 0 8px 24px}.board__container>nav>ul{font-size:2rem;font-family:monospace;display:flex;flex-direction:row;gap:16px;margin-bottom:16px;user-select:none;justify-content:flex-end}.board__container>nav>ul>li:hover{color:var(--main-color);cursor:pointer}.board__background{width:100%;height:100%;backdrop-filter:blur(2px) grayscale(100%);cursor:pointer}.board__data{display:block;flex-direction:column;gap:16px;width:calc(100% - 88px)}.board__data>div{margin-bottom:16px}.board__data>button{width:100%}.board input[type=text]{background-color:var(--secondary-color);color:var(--primary-color);font-size:24px;font-family:DynaPuff,cursive;border:none;outline:none}.board input[type=text]:focus{outline:none;color:var(--main-color)}.board input::placeholder{font-weight:700;opacity:.5;color:var(--primary-color)}.board textarea{background-color:var(--secondary-color);color:var(--primary-color);font-size:20px;font-family:Karla,sans-serif;border:none;outline:none}.board textarea:focus{outline:none;color:var(--main-color)}.board textarea::placeholder{font-weight:700;opacity:.5;color:var(--primary-color)}.board__list.hide,.board__edit.hide,.board__add.hide{display:none}.board__edit{box-sizing:border-box;position:relative;display:grid;grid-template:"a a b" auto "d d d" auto "c c c" auto "e e e" auto / auto 100px 70px;flex-direction:column;gap:16px}.board__add{box-sizing:border-box;position:relative;display:grid;grid-template:"a b" auto "c c" auto "d d" auto / auto 100px;gap:16px}.board__list{box-sizing:border-box;position:relative;display:flex;flex-direction:column;gap:16px}.board__edit>div:nth-of-type(1){grid-area:a}.board__edit>div:nth-of-type(4){grid-area:d}.board__edit>div:nth-of-type(5){grid-area:e}.board__add>div:nth-of-type(3){grid-area:c}.board__add>div:nth-of-type(4){grid-area:d}.list{overflow:auto;padding:0 16px}.list__item{background-color:#fff;padding:8px;cursor:pointer;border-radius:4px;color:var(--secondary-color)}.list__item.archived{background-color:#aaa}.list__item:hover{background-color:var(--main-color)}.list__title{font-family:DynaPuff,cursive;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:1.2rem;margin-bottom:4px}.list__description{padding:2px;font-family:Karla,sans-serif;font-size:1rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.edit__actions{display:flex;gap:16px;justify-content:space-around}.edit__action__remove,.edit__action__update,.edit__action__update{text-decoration:underline;padding:8px;cursor:pointer;text-underline-offset:3px;text-decoration-style:underline;text-decoration-thickness:2px;user-select:none}.edit__action__remove{color:#ff5733}.edit__action__update{color:#aaa;cursor:not-allowed}.edit__action__update.active{color:#fff;cursor:pointer}.add__actions{display:flex;gap:16px;justify-content:space-around}.add__action__add{text-decoration:underline;padding:8px;cursor:pointer;text-underline-offset:3px;text-decoration-style:underline;text-decoration-thickness:2px;user-select:none;color:#aaa}.add__action__add.active{color:#fff}
