.dashboard-wrapper{flex-direction:column;align-items:center;margin:1em;display:flex}.dashboard-title{letter-spacing:.1em;font-family:Geo;font-size:3em;font-weight:100}.board-holder{border-bottom:1px solid #fff;flex-direction:row;justify-content:space-between;align-items:center;width:30vw;height:8vh;display:flex}.dashboard-btn-container{clip-path:polygon(10% 0,90% 0,100% 12%,100% 100%,68% 95%,64% 87%,32% 87%,28% 94%,0 100%,0 12%);margin-right:1em}.dashboard-btn-container button{cursor:pointer;color:#fff;background:#000;border:none;padding:1em;font-family:Geo;font-size:1em;transition:all .3s ease-in}.dashboard-btn-container button:nth-child(2):hover{background:red}.dashboard-btn-container button:first-child:hover{background:#7fffd4}.dashboard-wrapper>div:first-of-type{background:#000000d9;border:1px solid #ffffff14;border-radius:10px;align-items:center;gap:.5em;padding:.4em;display:flex}.dashboard-wrapper input{color:#fff;letter-spacing:1px;background:0 0;border:none;outline:none;width:200px;padding:.6em;font-family:Geo}.dashboard-wrapper input:focus{border-bottom:1px solid #0f86}.dashboard-wrapper>div:first-of-type button{color:#fff;letter-spacing:1px;cursor:pointer;background:#000;border:none;border-radius:6px;padding:.5em 1em;font-family:Geo;transition:all .2s}.dashboard-wrapper>div:first-of-type button:hover{background:#00ff8826}.board-wrapper{background:var(--dark-bg);flex-direction:column;justify-content:start;align-items:center;width:100vw;height:100vh;margin:0;display:flex}.board-content-wrapper-main{aspect-ratio:16/10;width:clamp(700px,70vw,1600px);height:auto;padding:1px;position:relative;overflow:hidden}.board-content-wrapper{clip-path:polygon(0 71%,0 53%,0 11%,6% 0,100% 0,100% 10%,100% 100%,60% 100%,55% 96%,49% 96%,44% 100%,0 100%);z-index:2;background:#fff;width:100%;height:100%;padding:1px;position:relative;inset:0}.board-content{clip-path:polygon(0 71%,0 53%,0 11%,6% 0,100% 0,100% 10%,100% 100%,60% 100%,55% 96%,49% 96%,44% 100%,0 100%);background:#000;height:100%;padding:2em 2em 1.9em;display:grid;inset:0}.board-wrapper h1{color:#fff}.board-name-text{-webkit-text-stroke:.2px aquamarine;color:#000;letter-spacing:1px;font-size:2em}.board-upload-wrapper{background:#000000ce;border:2px solid #ffffffa1;justify-content:center;align-items:center;width:70%;height:4em;margin:1em;display:flex;position:relative;top:0;right:0;overflow:hidden}.board-upload-wrapper:before{content:"";filter:blur(8px);opacity:0;z-index:0;background:linear-gradient(120deg,#e4fff39c,#2bcde2ad,#006336e1) 0 0/300% 300%;transition:opacity .3s;position:absolute;inset:-2px}.board-upload-wrapper:hover:before,.board-upload-wrapper:focus-within:before{opacity:1;animation:4s linear infinite glowMove}@keyframes glowMove{0%{background-position:0%}to{background-position:300%}}.board-input-container,.add-pic-btn{z-index:1;position:relative}.board-input-container{color:#fff;letter-spacing:1px;background:#000000f1;border:none;width:100%;height:60%;padding:.7em;font-family:Geo;font-size:1em}.add-pic-btn{background:#0000008c;border:none;padding:1em}.empty-board-text{color:#fff;font-family:Geo;font-size:1.5em;position:absolute;top:50%;left:40%}.side-boardName-deco{color:#ffffff0e;letter-spacing:.4em;font-size:3em;position:absolute;bottom:50%;right:-3.5em;transform:rotate(-90deg)}.login-btn-wrapper{clip-path:polygon(100% 0,100% 78%,91% 100%,0 100%,0 0);background:#ffffff65;justify-content:center;align-items:center;width:6.5em;height:2em;padding:.3em;display:flex;position:relative}.login-btn{color:#fff;letter-spacing:1px;clip-path:polygon(100% 0,100% 78%,91% 100%,0 100%,0 0);background:#000;border:none;padding:.5em 1.9em;font-family:Geo;font-size:1.1em;position:absolute}body{color:#fff;background:#000;margin:0}.login-page{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}.login-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000c;border-radius:16px;width:350px;margin-bottom:8em;padding:2em;position:relative;overflow:hidden}.login-card:before{content:"";filter:blur(10px);opacity:.6;z-index:0;background:linear-gradient(120deg,#0f8,#8a2be2,#0f8) 0 0/300% 300%;animation:9s linear infinite glowMove;position:absolute;inset:-2px}.login-card:after{content:"";z-index:1;background:radial-gradient(#000000c4,#000,#000);position:absolute;inset:0}.login-card *{z-index:2;position:relative}.login-title{text-align:center;letter-spacing:2px;margin-bottom:1.5em;font-weight:200}.login-form{flex-direction:column;gap:1.2em;display:flex}.input-wrapper{position:relative}.input-wrapper input{color:#fff;letter-spacing:1px;background:#000000d9;border:1px solid #ffffff1a;width:100%;padding:.8em;font-family:Geo;transition:border .2s,box-shadow .2s}.input-wrapper input:focus{background:#000;border:1px solid #0f86;outline:none;box-shadow:0 0 6px #0f83}.input-wrapper:before{content:"";opacity:0;z-index:0;background:linear-gradient(120deg,#0f8,#8a2be2);transition:all .3s;position:absolute;inset:0}.input-wrapper:focus-within:before{opacity:1;filter:blur(6px)}.error-text{color:#ff4d4d;text-align:center;font-size:.9em}.signup-text{text-align:center;color:#fff9;margin-top:1.5em}.signup-text a{color:#0f8;text-decoration:none}.success-text{color:#0f8;text-align:center;font-size:.9em}.login-btn-wrapper.signup{white-space:nowrap;flex-flow:column;justify-content:center;width:7.5em;display:flex}.login-btn.signup{margin-top:1em;margin-bottom:1em}body{margin:0;overflow-x:hidden}.logout-btn-wrapper{clip-path:polygon(100% 0,100% 78%,91% 100%,0 100%,0 0);background:#ffffff65;justify-content:center;align-items:center;width:6.5em;height:2em;padding:.3em;display:flex;position:relative}.logout-btn{color:#fff;letter-spacing:1px;clip-path:polygon(100% 0,100% 78%,91% 100%,0 100%,0 0);background:#000;border:none;padding:.5em 1.5em;font-family:Geo;font-size:1.1em;position:absolute}:root{--title-txt:#cacaca;--main-txt-dm:#b6b6b6;--dark-bg:#030303;--secondary-dark-bg:#0f0f0f}.nav-wrapper{background:var(--dark-bg);width:50vw;height:5%;color:var(--main-txt-dm);justify-content:space-between;align-items:center;padding:.4em;display:flex}.user-logout-wrapper{flex-direction:row;margin-right:2em;display:flex;position:fixed;top:0;right:0}.user-email{letter-spacing:1px;margin:1em;font-family:Geo}@keyframes floatUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.navbar2-wrapper{z-index:100;background:#00504715;border-right:1px solid #ffffff1a;flex-direction:column;align-items:flex-start;width:70px;height:100vh;padding-top:1em;transition:width .3s;display:flex;position:fixed;top:0;left:0;overflow:hidden}.navbar2-wrapper:hover{width:220px}.navbar2-wrapper h2{color:#fff;white-space:nowrap;opacity:0;margin-bottom:2em;padding-left:1em;font-family:Geo;transition:opacity .2s}.navbar2-wrapper:hover h2{opacity:1}.nav-button-wrapper{flex-direction:column;gap:1em;width:100%;display:flex}.nav-button-wrapper a{color:#fff;align-items:center;height:50px;padding-left:20px;text-decoration:none;display:flex;position:relative}.nav-button-wrapper a svg{min-width:28px;max-width:28px}.nav-button-wrapper a:hover{background:#ffffff14}.nav-button-wrapper p{letter-spacing:1px;white-space:nowrap;opacity:0;font-family:Geo;font-size:1.1em;transition:opacity .2s,transform .2s;position:absolute;left:60px;transform:translate(-10px)}.navbar2-wrapper:hover .nav-button-wrapper p{opacity:1;transform:translate(0)}.main-words-container{flex-direction:column;justify-content:center;align-items:center;width:100%;margin-top:1em;margin-bottom:0;display:flex;position:absolute}.main-words-container p{letter-spacing:1px;opacity:0;font-family:Geo;font-size:1.2em;animation:1s ease-in 1.5s forwards txtFadeIn}@keyframes txtFadeIn{0%{opacity:0}to{opacity:1}}.title{color:var(--title-txt);letter-spacing:6px;background:linear-gradient(#bbffc4,#fff);-webkit-text-fill-color:transparent;opacity:0;-webkit-background-clip:text;justify-content:center;font-family:Offside;font-size:6em;font-weight:100;line-height:1.5;animation:.8s ease-out forwards floatUp;display:flex}.title:after{content:"";transform-origin:0;background:#fff;width:100%;height:1px;animation:.6s ease-out .9s forwards drawLine;position:absolute;bottom:-5px;left:0;transform:scaleX(0)}@keyframes drawLine{0%{transform:scaleX(0)}to{transform:scaleX(1)}}h2{margin:0}
