:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}html{margin:0;padding:0;background:linear-gradient(to bottom,#fff,#649ab0);background-repeat:no-repeat;background-size:cover;background-attachment:fixed}body{font-family:Quicksand,sans-serif}html,body,#root{height:100%;margin:0}.layout-main{flex-grow:1;padding:20px}.app-footer{flex-shrink:0;padding:20px;text-align:center;background-color:#f2f2f2;font-size:14px;color:#444;border-top:1px solid #ddd}.layout-wrapper{display:flex;flex-direction:column;min-height:100vh}.layout-container{padding:10px;height:34px;margin-bottom:5px;display:flex;flex-direction:row;background-color:#4794b4;color:#fff;box-shadow:0 6px 6px #00000026}.layout-right{display:flex;margin-right:auto}.layout-left{display:flex;margin-left:auto}.layout-link{padding:5px 10px;color:#fff;text-decoration:none;font-weight:700;transition:transform .3s ease}.layout-link:hover{color:#fff;transform:translateY(-2px)}.layout-user{padding:5px 10px;color:#fff;text-decoration:none;font-weight:700;transition:transform .3s ease}.download-link{color:#fff;text-decoration:none;font-weight:700;background:none;background-size:400% 400%;padding:4px 10px;border:1px solid #fff;border-radius:10px;margin:0 5px;transition:transform .3s ease}.download-link:hover,.download-link:active,.download-link:focus{color:#fff;transform:translateY(-2px);background:none;border:1px solid #fff;box-shadow:none}.design-link{color:#fff;text-decoration:none;font-weight:700;background:linear-gradient(-45deg,#3842ef,#1ca945,#b6a214,#a923d5);background-size:400% 400%;padding:5px 10px;border-radius:10px;margin:0 5px;animation:gradient 15s ease infinite;transition:transform .3s ease}.design-link:hover{color:#fff;transform:translateY(-2px)}.icon-star{color:#f7e77c;font-size:12px;transition:color .3s ease}.icon-home{color:#f8cf89;font-size:12px;transition:color .3s ease}.icon-register{color:#ead9fa;font-size:12px;transition:color .3s ease}.icon-sign-in{color:#93f889;font-size:12px;transition:color .3s ease}.icon-save{color:#defbdb;font-size:12px;transition:color .3s ease}.icon-question{color:#dbe0fb;font-size:12px;transition:color .3s ease}.save-btn{padding:5px 10px;color:#fff;text-decoration:none;font-weight:700;background-color:#52bd48;cursor:pointer;border:2px solid #fff;transition:transform .8s ease,background .1s ease}.save-btn:hover{background-color:#52bd48;border:2px solid #fff}.save-btn:focus{outline:none;background-color:#52bd48}.save-btn:active{transform:scale(.9)}.last-saved-time{padding:5px 10px;color:#fff;text-decoration:none;font-weight:700}.design-current-name{padding:5px 10px;color:#fff;text-decoration:none;font-weight:700;transition:transform .3s ease}.dropdown{position:relative;display:inline-block}.dropdown-toggle,.dropdown-toggle:focus{color:#fff;text-decoration:none;font-weight:700;background:none;padding:6px 10px;border:1px solid #fff;border-radius:10px;margin:0 5px;outline:none;transition:color .1s ease,background-color .1s ease,border .1s ease,box-shadow .1s ease}.dropdown-toggle:hover,.dropdown-toggle:active{color:#fff;background-color:#73bcdb;border:1px solid #fff;box-shadow:none;outline:none}.dropdown-arrow{margin-left:4px}.dropdown-menu{display:block;position:absolute;background-color:#4794b4;box-shadow:0 8px 16px #0003;z-index:1;min-width:190px;left:0;top:100%;border-radius:10px;padding:10px}.dropdown-menu button{width:100%;padding:10px;border:none;background:none;color:#fff;text-align:left;cursor:pointer;border:solid 1px #fff;transition:background-color .3s ease}.dropdown-menu button:hover,.dropdown-menu button:focus,.dropdown-menu button:active{background-color:#73bcdb;color:#fff;border:solid 1px #fff;text-align:left;cursor:pointer}.dropdown-menu button:focus{outline:none}.threeD-btn{padding:5px 10px;color:#fff;text-decoration:none;font-size:1rem;background-color:#4794b4;cursor:pointer;border:1px solid #fff;text-shadow:1px 2px 2px rgba(0,0,0,.8);transition:transform .3s ease-in-out,background .1s ease}.threeD-btn:hover{background-color:#73bcdb;border:1px solid #fff}.threeD-btn:focus{outline:none;background-color:#73bcdb}.threeD-btn:active{transform:scale(.95)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:none;z-index:1000}.modal{background-color:#1f5268;color:#fff;padding:16px 24px;border-radius:8px;font-size:1rem;box-shadow:0 0 12px #0000004d;pointer-events:auto;animation:fadeInOut 3s forwards}@keyframes fadeInOut{0%{opacity:0;transform:scale(.95)}10%{opacity:1;transform:scale(1)}90%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@media (max-width: 1100px){.layout-user,.design-current-name{display:none}}@media (max-width: 1300px){.last-saved-time{display:none}}@media (max-width: 810px){.button-title{display:none}}@media (max-width: 400px){.dash-title{display:none}}.app-footer{padding:5px;text-align:center;background-color:#d0e9f0;font-size:14px;color:#444;margin-top:100px;border-top:10px solid #105e5b}.footer-content a{color:#07c;text-decoration:none}.footer-content a:hover{text-decoration:underline}.notfound{color:#1a3d4b}.notfoundcontainer{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:40px 20px}.background-circles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:0}@media (max-width: 670px){.background-circles{display:none}}.circle{position:absolute;width:20px;height:20px;border-radius:50%;animation:floatUpDown 6s ease-in-out infinite;opacity:.6}@keyframes floatUpDown{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.home-container{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:40px 20px}.hero-container{display:flex;justify-content:center;align-items:center;flex-direction:column}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.home-card{text-align:center;padding:40px;max-width:600px;border-radius:16px;background:linear-gradient(-45deg,#3842ef,#1ca945,#b6a214,#a923d5);background-size:400% 400%;animation:gradient 15s ease infinite;box-shadow:0 10px 30px #0000001a}.home-card h2{font-size:2.5rem;color:#fff;margin-bottom:16px;text-shadow:1px 1px 2px rgba(0,0,0,.05)}.home-card p{font-size:1.2rem;color:#fff;margin-top:0}.support-container{margin-top:20px;display:flex;justify-content:center;align-items:center;padding:20px;max-width:600px;height:100px;border-radius:16px;box-shadow:0 10px 30px #0000001a;transition:all .3s ease-in-out}.support-container:hover{transform:scale(1.005);box-shadow:0 15px 40px #0003}.info-outercontainer{width:100vw;margin-top:30px;overflow:hidden;position:relative}.info-container{display:flex;width:max-content;animation:scrollRight 40s linear infinite}.info-card{padding:15px;background-color:#4794b4;width:250px;height:180px;border-radius:16px;color:#fff;text-align:center;margin-right:16px;flex-shrink:0}@keyframes scrollRight{0%{transform:translate(0)}to{transform:translate(-50%)}}.info-card h3{font-size:1.5rem;margin-bottom:10px;color:#fff}.info-card p{font-size:1rem;margin-top:0}.help-container{color:#1a3d4b;padding:40px 20px}.account-btn{padding:20px;color:#fff!important;border-radius:16px;background:linear-gradient(-45deg,#3842ef,#1ca945,#b6a214,#a923d5);background-size:400% 400%;animation:gradient 15s ease infinite;box-shadow:0 10px 30px #0000001a;text-decoration:none;transition:transform .3s ease,box-shadow .1s ease}.account-btn:hover{color:#fff;transform:translateY(-2px)}.getting-started{display:flex;flex-direction:column;align-items:center;font-size:1.2rem}.getting-started-container{max-width:800px;margin:20px auto 0;padding:20px;background:linear-gradient(to top right,#9984f4,#e4eaff);border-radius:16px;box-shadow:0 0 30px #0000001a}.getting-started-item{margin-bottom:20px;padding-bottom:10px;box-shadow:0 5px 8px -8px #1a3d4b}.icon-check{color:#217539;font-size:1.5rem;animation:bounce 1.5s infinite ease-in-out}h3{color:#226681;margin-bottom:15px}h4{color:#5e4665;margin-bottom:5px}strong{font-size:1.05rem;color:#2a2a32}@keyframes bounce{0%{transform:translateY(0)}50%{transform:translateY(-5px)}to{transform:translateY(0)}}.braid-disc-container{display:flex;justify-content:center;margin-top:20px}.braid-disc{width:400px;height:400px;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.getting-started-item a{color:#5168c4;text-decoration:none}.FAQ-link{display:flex;max-width:300px;width:100%;justify-content:center;background-color:#4794b4;color:#fff;padding:10px 20px;border-radius:5px;text-decoration:none;cursor:pointer;transition:background-color .3s ease,transform .3s ease}.FAQ-link:hover{color:#fff;background-color:#357a9c;transform:translateY(-2px)}.FAQ-link:focus{color:#fff;outline:none;background-color:#357a9c}.FAQ-link:active{color:#fff;transform:translateY(2px)}.FAQ-section{display:flex;max-width:800px;margin:0 auto;justify-content:center}.faq-container{max-width:600px;margin:0 auto;padding:1rem}.faq-title{font-size:2rem;font-weight:700;margin-bottom:1.5rem}.faq-item{border:1px solid #ccc;border-radius:8px;margin-bottom:1rem;overflow:hidden;box-shadow:0 2px 4px #0000001a;background-color:#4794b4;transition:background-color .1s ease-in-out}.faq-item:hover,.faq-question:hover,faq-item:active,.faq-question:focus{background-color:#4794b4}.faq-item.open{background-color:#4794b4;box-shadow:0 2px 8px #0000001a}.faq-question{display:block;width:100%;padding:1rem;text-align:left;background:none;border:none;font-size:1.1rem;font-weight:500;cursor:pointer;outline:none}.faq-question:active,faq-question:focus{border:none;box-shadow:none;outline:none}.faq-answer-wrapper{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}.faq-item.open .faq-answer-wrapper{max-height:300px;padding:0 1rem 1rem}.faq-answer{padding:.5rem;border-radius:10px;border:2px solid #fff;background-color:#ffffff1a;color:#fff;font-size:1rem}.login-container{padding:60px 20px}h1{color:#4794b4;font-size:2.5rem;text-align:center;margin-bottom:30px!important}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.form-container{max-width:700px;padding:20px;border-radius:10px;background:linear-gradient(to top right,#9984f4,#e4eaff);box-shadow:0 0 10px #cfcbe0;border:1px solid #4f3b8f;margin:0 auto;opacity:0;transition:transform .8s ease,box-shadow .8s ease;animation:fadeSlideIn .8s ease-out both}.form-container:hover{box-shadow:0 0 20px #cfcbe0}.form-space{margin-bottom:5px}.form-label{font-size:1.2rem;color:#4f3b8f;margin-left:5px}.form-input{border-radius:5px;color:#000;padding:10px;border:1.5px solid #9984f4;background:linear-gradient(to bottom right,#fff,#f1f4fd);margin:5px;width:95%;transition:padding .15s ease,border-color .3s ease,transform .3s ease}.form-input:focus{outline:none;border-color:#210b5e;padding-top:18px;padding-bottom:18px}@media (max-width: 600px){.form-input{width:90%}.disclaimer{font-size:.8rem!important}.image-container{font-size:1rem!important}.loading-spinner{height:150px!important}}.btn-primary{background-color:#210b5e;border:none;padding:10px 20px;font-size:1.2rem;color:#fff;border-radius:5px;cursor:pointer;width:100%;transition:transform .3s ease,box-shadow .1s ease}.btn-primary:hover{background-color:#4f3b8f;transform:translateY(-2px)}.btn-primary:focus{outline:none;background-color:#4f3b8f}.btn-primary:active{transform:translateY(2px)}.account-link-wrapper{display:flex;justify-content:center;padding:12px}.account-link{color:#4f3b8f;text-decoration:none;font-weight:700;padding:8px;border-radius:10px}.account-link:hover{text-decoration:underline}.account-link:focus{outline:none;color:#210b5e}.text-danger-error{position:relative;top:0;text-align:center;transform:translateY(5px);transition:opacity 1s ease,transform .5s ease;color:#4f3b8f!important;min-height:12px;pointer-events:none;margin-left:10px}.btn-google{background-color:#4f3b8f;color:#fff;padding:.6rem 1.2rem;border:none;border-radius:4px;cursor:pointer;font-weight:700;font-size:1rem}.btn-google:hover{background-color:#210b5e}.google-login-container{margin-top:1rem;text-align:center}.form-error-box{margin-top:1rem;padding:.5rem;background-color:#f8d7da;border:1px solid #f5c2c7;color:#842029;border-radius:4px}.form-error-list{margin:0;padding-left:1.2rem}.failed-registration{color:#842029;font-weight:700;text-align:center;margin-top:1rem;font-size:1.2rem}.email-message{color:#4f3b8f;font-weight:700;text-align:center;margin-top:1rem;font-size:1.2rem}.loading-spinner{height:200px;background:#f1f4fd;border-radius:10px;margin-top:10px}.image-container{font-size:1.2rem;color:#4f3b8f;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.button-loader-container{position:relative;transition:height .4s ease;height:60px}.transition-item{max-height:0;opacity:0;visibility:hidden;overflow:hidden;transition:transform .3s ease-in-out,.3s ease-in-out,visibility .3s ease-in-out,max-height .5s ease-in-out .3s}.transition-item.visible{opacity:1;visibility:visible;max-height:500px;transition-delay:0s}.transition-item.hover{transform:translateY(-2px)}.transition-item.hidden{opacity:0;height:0;font-size:0rem;visibility:hidden}.transition-item.hidden btn-primary,.transition-item.hidden .button-loader-container{height:0;margin:0}.button-loader-container.expanded{height:350px}.disclaimer{font-size:1rem;color:#4f3b8f;text-align:center;align-content:center;margin-top:1rem}h1{font-size:2rem;margin:10px 10px 10px 20px;color:#4794b4}h3{margin:0 0 5px;border-bottom:5px double #ccc;width:100%}.design-canvas-container{max-width:100%;width:100%;margin:0 auto;box-sizing:border-box;display:flex;flex-direction:column;align-items:stretch;user-select:none;-webkit-user-select:none;-ms-user-select:none}.design-canvas-outercontainer{width:96vw;max-width:95vw;overflow-x:auto;box-sizing:border-box;padding-top:0;padding-bottom:0}.canvas-top{display:flex;flex-wrap:nowrap;gap:20px;width:100%;flex-shrink:1;box-sizing:border-box;min-width:0}.simulator-stack{flex-shrink:1;min-width:0;display:flex;flex-direction:column;gap:16px;flex-grow:1;max-width:100%;box-sizing:border-box}table{border-collapse:collapse;width:100%}th,td{padding:.25rem;text-align:center}.braid-simulator{display:flex;flex-direction:column;padding-top:3px;padding-bottom:3px;flex:0 0 auto;min-width:fit-content;touch-action:none}.braid-simulator-wrapper{overflow-x:auto;overflow-y:hidden;background:linear-gradient(to bottom,#1a3d4b,#326f89);border-radius:12px;padding:10px;height:322px;box-sizing:border-box}.braid-row{display:flex;flex:0 0 auto!important}.braid-cell{width:30px;height:30px;margin:1px;border:none;cursor:pointer}.braid-cell:hover{opacity:.7}.color-picker-container{display:flex;flex-direction:column;background:linear-gradient(to bottom,#1a3d4b,#326f89);padding:10px;border-radius:12px;box-shadow:0 0 10px #00000040;overflow-y:auto;height:312px}.color-swatch{display:flex;align-items:center;gap:.5rem;padding:.25rem 0;min-height:40px;overflow:hidden}.color-swatch input[type=color],.add-color input[type=color]{width:32px;height:32px;border:none;background:none;padding:0;margin:0;cursor:pointer}.color-picker input[type=color]{width:25px;height:30px;margin-bottom:.5rem}.color-buttons{display:flex;gap:.25rem;min-width:170px;font-size:.85rem}.color-buttons button{min-width:85px;padding:.3rem .6rem;border:1px solid #ccc;font-size:.85rem;cursor:pointer;background-color:transparent;transition:background-color .2s ease}.color-buttons button.selected,.color-buttons button:focus{background-color:#2e5666}.color-buttons button:hover{background-color:#649ab0}.main-color{display:inline-block;font-size:.9rem;font-weight:700;background-color:#062938;border-radius:8px;color:#209836;padding:3px 7px 3.8px}.add-color{display:flex;align-items:center;gap:8px;height:40px;margin-top:4px}.add-btn{background-color:#0e242d;color:#fff;box-shadow:0 2px 4px #00000040;width:170px;padding:10px}.add-btn:hover{border:1px solid #fff;background-color:#1a3d4b}.add-btn.selected,.add-btn:active{border:1px solid #fff;background-color:#0e242d}.add-btn:focus{border:1px solid #fff;background-color:#0e242d}.simulator-stack{display:flex;flex-direction:column;gap:16px;flex-grow:1;max-width:100%;box-sizing:border-box}.finished-braid-container{flex:3;border-radius:1rem;box-shadow:0 4px 12px #00000026;overflow-x:auto;overflow-y:hidden;background-color:#fff;padding:10px;min-height:204px;box-sizing:border-box}.toggle-view-button{margin:8px;max-width:380px;width:100%;padding:6px 12px;font-size:.9rem;cursor:pointer;background-color:#eee;border:1px solid #aaa;border-radius:6px;color:#000;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;transition:background-color .2s ease,border-color .2s ease}.toggle-view-button:hover{background-color:#d4effb;border-color:#4794b4}@media (max-width: 775px){.toggle-view-button .button-label{display:none}.toggle-view-button svg{margin-left:0}}.braid-simulator-wrapper::-webkit-scrollbar,.finished-braid-container::-webkit-scrollbar,.color-picker-container::-webkit-scrollbar{width:24px;height:36px}.braid-simulator-wrapper::-webkit-scrollbar-thumb,.finished-braid-container::-webkit-scrollbar-thumb,.color-picker-container::-webkit-scrollbar-thumb{background-color:#888;border-radius:12px;border:6px solid #e0e0e0}.braid-simulator-wrapper::-webkit-scrollbar-track,.finished-braid-container::-webkit-scrollbar-track,.color-picker-container::-webkit-scrollbar-track{background-color:#e0e0e0;border-radius:12px}.color-toolbar{margin-top:8px;flex-wrap:wrap;background:linear-gradient(to bottom,#1a3d4b,#326f89);padding:10px;border-radius:12px;box-shadow:0 0 10px #00000040;height:250px;width:240px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}.color-toolbar button{gap:.25rem;font-size:9pt;padding:4px;background:#4794b4;border:1px solid #ccc;transition:background-color .2s ease;height:28px;width:115px}.color-toolbar button:hover{background-color:#326f89}.color-toolbar button:focus{background-color:#4794b4}.color-toolbar button.selected{background-color:#649ab0}.color-toolbar-buttons{display:flex;flex-wrap:wrap;gap:8px}.picking-color{cursor:crosshair}.selected-cell{border:2px solid #ff0000;background-color:#ff00004d}button{-webkit-appearance:none;background-color:#fff;border:1px solid #ccc;color:#fff;outline:none}button:focus,button:active{background-color:#fff;-webkit-appearance:none}button:hover{background-color:#f0f0f0}.toggle-btns{display:flex;justify-content:center}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;pointer-events:all}.modal-box{background:linear-gradient(to bottom,#fff,#d4effb);padding:20px;border-radius:8px;width:300px;box-shadow:0 4px 20px #0000004d;display:flex;flex-direction:column;gap:10px;color:#1a3d4b;justify-content:center;pointer-events:auto}.modal-box input{padding:8px;font-size:1rem;background-color:#fff;border:2px solid #4794b4;border-radius:10px;color:#1a3d4b;outline:none}.modal-buttons{display:flex;gap:10px;justify-content:space-between;width:100%}.modal-save-button,.modal-save-button:focus{background-color:#1ca945;width:48%;border-radius:10px;transition:all .3s ease;border:none}.modal-save-button:hover{background-color:#2b6d32}.modal-cancel-button,.modal-cancel-button:focus{background-color:#de7272;width:48%;border-radius:10px;transition:all .3s ease;border:none}.modal-cancel-button:hover{background-color:#c74a4a}.modal-remove-button,.modal-remove-button:focus{background-color:#de7272;width:48%;border-radius:10px;transition:all .3s ease;border:none}.modal-remove-button:hover{background-color:#c74a4a}.modal-error{color:#de7272;margin:0;padding:0}body.modal-open{pointer-events:none}body.modal-open .modal-overlay{pointer-events:all}.remove-icon{color:#de7272}@media (max-width: 630px){.selecting-btn-text,.remove-text{display:none}.color-buttons button{min-width:35px}.color-buttons{min-width:60px}.main-hidden{display:none}.main-color{min-width:20px;text-align:center}.add-btn{width:72px}.add-hidden,.palette-title-hidden{display:none}.color-toolbar{width:110px;gap:0px}.tool-hidden{display:none}.slider-input{width:50px!important}.color-toolbar button{width:50px}.info-hidden{display:none}.color-picker-container::-webkit-scrollbar{width:15px}.color-picker-container::-webkit-scrollbar-thumb{background-color:#888;border-radius:8px;border:4px solid #e0e0e0}.canvas-top{gap:10px}.info-icon{display:none}.design-canvas-outercontainer{padding:10px}}@media (max-height: 690px){.color-picker-container{height:220px!important}.color-toolbar{height:240px!important;gap:0}.toggle-btns{display:none}.toggle-btns-small{display:flex;justify-content:center;margin-top:10px}.toggle-btns-small button{margin:0}.toggle-btns-small .button-label{display:none}}@media (min-height: 690px){.toggle-btns-small{display:none}}@media (min-width: 630px){.selecting-btn-icon,.remove-icon{display:none}.palette-title-hidden{margin-right:5px}}@media (min-height: 800px){.design-canvas-outercontainer{margin-top:50px}}.braid-simulator-wrapper{display:flex;align-items:flex-start;gap:10px}.info-icon{margin:0;cursor:pointer;color:#2ba34f;font-size:14pt}.braid-simulator{display:flex;flex-direction:column}.braid-header{display:flex}.empty-cell{width:46px}.braid-column-header{display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;width:30px;height:15px;box-sizing:border-box;flex:1 1 auto}.braid-row{display:flex}.row-header{width:40px;min-width:40px;text-align:right;padding-right:5px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:flex-end;border:1px solid transparent;background-color:transparent}.row-header.hovered{border:1px dashed #2ba34f;background-color:#2ba34f33}.braid-cell{display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;width:30px;height:30px;box-sizing:border-box;border:1px solid #ccc}.braid-cell.selected{border:1px solid #2ba34f}.info-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;z-index:1000;display:flex;align-items:center;justify-content:center}.info-panel{width:75%;max-height:80%;background-color:#fff;border-radius:8px;padding:20px;overflow-y:auto;box-shadow:0 4px 20px #0000004d;color:#062938}.info-content{display:flex;gap:40px}.info-text{flex:1}.info-images{flex-shrink:0;width:37%;height:40%}.info-image{text-align:center}.info-image img{width:80%;height:auto;border:1px solid #ccc;border-radius:4px}.info-image div{margin-top:5px}h3{border:none}.dashboard-container{padding:1.5rem}.dashboard-subtitle{font-size:1.125rem;font-weight:600;color:#4b5563;margin-bottom:1.5rem}.design-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem}.design-card{display:flex;flex-direction:column;align-items:center;background:linear-gradient(to bottom,#fff,#d4effb);border-radius:.75rem;padding:1rem;text-decoration:none;box-shadow:0 1px 2px #0000000d;transition:box-shadow .2s ease,transform .3s ease!important}.design-card:hover{box-shadow:0 4px 6px #0000001a;transform:translateY(-2px)!important}.design-preview{display:flex;align-items:center;justify-content:center;background-color:#4794b4;border-radius:.5rem}.design-list .design-preview>*{margin-left:35px}.design-list{display:flex;flex-direction:column;gap:1.5rem}.design-list>*{opacity:0;transform:translateY(20px);animation:fadeInUp .5s ease-out forwards}.design-list>*:nth-child(1){animation-delay:.05s}.design-list>*:nth-child(2){animation-delay:.1s}.design-list>*:nth-child(3){animation-delay:.15s}.design-grid>*{opacity:0;transform:translateY(20px);animation:fadeInUp .4s ease-out forwards}.design-grid>*:nth-child(1){animation-delay:.05s}.design-grid>*:nth-child(2){animation-delay:.1s}.design-grid>*:nth-child(3){animation-delay:.15s}.design-grid>*:nth-child(4){animation-delay:.2s}.design-grid>*:nth-child(5){animation-delay:.25s}.design-grid>*:nth-child(6){animation-delay:.3s}.design-grid>*:nth-child(7){animation-delay:.35s}.design-grid>*:nth-child(8){animation-delay:.4s}.design-grid>*:nth-child(9){animation-delay:.45s}.design-grid>*:nth-child(10){animation-delay:.5s}.design-grid>*:nth-child(11){animation-delay:.55s}.design-grid>*:nth-child(12){animation-delay:.6s}.design-grid>*:nth-child(13){animation-delay:.65s}.design-grid>*:nth-child(14){animation-delay:.7s}.design-grid>*:nth-child(15){animation-delay:.75s}.design-grid>*:nth-child(16){animation-delay:.8s}.design-grid>*:nth-child(17){animation-delay:.85s}.design-grid>*:nth-child(18){animation-delay:.9s}.design-grid>*:nth-child(19){animation-delay:.95s}.design-grid>*:nth-child(20){animation-delay:1s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in-up{animation:fadeInUp .4s ease-out forwards}.design-list .design-preview{display:flex;align-items:center;justify-content:center;background-color:#4794b4;border-radius:.5rem;width:100%}.design-list .preview-link{width:100%}.design-preview>*{width:100%;height:auto}.design-name-section{margin:10pt}.design-name{text-align:center;color:#1f2937;font-weight:500}.design-actions{display:flex;justify-content:center;gap:.5rem;margin-top:.5rem;height:40px}.design-open-button{background-color:#1ca945;color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;cursor:pointer;transition:background-color .2s ease}.design-open-button:hover,.design-open-button:focus{background-color:#2b6d32;color:#fff}.design-duplicate-button{background-color:#e39c19;color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;cursor:pointer;transition:background-color .2s ease}.design-duplicate-button:hover,.design-duplicate-button:focus{background-color:#d7701b;color:#fff}.design-delete-button{background-color:#de7272;color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;cursor:pointer;transition:background-color .2s ease}.design-delete-button:hover,.design-delete-button:focus{background-color:#c74a4a;color:#fff}.no-designs-message{text-align:center;margin-top:2rem;font-size:1.2rem;color:#666}.grid-list-button{background-color:#4794b4;color:#fff;border:none;padding:.5rem 1rem;width:150px;border-radius:.375rem;cursor:pointer;transition:background-color .2s ease,color .2s ease}.grid-list-button:hover,.grid-list-button:focus{background-color:#3b7a9c;color:#fff}.create-design-link{color:#fff;text-decoration:none;font-weight:700;background:linear-gradient(-45deg,#3842ef,#1ca945,#b6a214,#a923d5);background-size:400% 400%;padding:10px 15px;border-radius:10px;margin:0 5px;animation:gradient 15s ease infinite;border:none;transition:border .2s ease-in-out}.create-design-link:hover{color:#fff;border:2px solid #4794b4}.create-template-link{color:#fff;text-decoration:none;font-weight:700;background:linear-gradient(-45deg,#3842ef,#1ca945,#b6a214,#a923d5);background-size:400% 400%;padding:10px 15px;border-radius:10px;margin:0 5px;animation:gradient 15s ease infinite;border:none;transition:border .2s ease-in-out}.create-template-link:hover{color:#fff;border:2px solid #4794b4}.no-designs{margin-bottom:40px}.design-name-section{display:flex;align-items:center;gap:.5rem}.edit-name-form{display:flex;gap:.4rem;align-items:center;margin-top:.2rem;margin-bottom:.2rem}.design-name-input{font-size:1.125rem;max-width:120px;border:2px solid #89c3de;background-color:#f3f4f6;color:#173e4e;border-radius:.375rem;outline:none}.design-edit-name-btn,.design-save-name-btn,.design-edit-name-btn:focus,.design-save-name-btn:focus{font-size:10pt;padding:5px 6px;cursor:pointer;background-color:#1ca945;border:none;transition:background-color .1s ease,color .1s ease}.design-cancel-name-btn{font-size:.8rem;padding:5px 6px;cursor:pointer;background-color:#de7272;border:none;transition:background-color .1s ease,color .1s ease}.design-edit-name-btn:hover,.design-save-name-btn:hover{background-color:#2b6d32;color:#1ca945}.design-cancel-name-btn:hover{background-color:#c74a4a;color:#de7272}.new-design-card{display:flex;align-items:center;justify-content:center;border:4px dashed #4794b4;cursor:pointer;height:185.75px}.new-design-content{display:flex;align-items:center;justify-content:center;flex-direction:column;height:100%;width:100%;color:#555}.new-design-label{margin-top:10px;font-size:1.5rem;color:#4794b4}.modal-buttons{display:flex;justify-content:center;margin-top:20px}.modal-delete-button{background-color:#4794b4;width:50%;border-radius:10px;border:none;transition:all .3s ease}.modal-delete-button:hover,.modal-delete-button:focus,.modal-delete-button:active{background-color:#c74a4a!important;border:none}.modal-cancel-button{background-color:#e39c19;width:50%;border-radius:10px;transition:all .3s ease;border:none}.modal-cancel-button:hover,.modal-cancel-button:focus,.modal-cancel-button:active{background-color:#d7701b;border:none}.design-progress-bar-container{margin:10px 0 20px;text-align:center}.design-progress-bar{width:100%;height:12px;background-color:#e0e0e0;border-radius:6px;overflow:hidden;margin-bottom:6px}.design-progress-fill{height:100%;background-color:#4794b4;transition:width .3s ease-in-out}.design-progress-text{font-size:14px;color:#555}.design-card{position:relative}.design-select-checkbox{position:absolute;top:8px;left:8px;z-index:0;transform:none}.multi-delete-btn,.multi-delete-btn:focus{background-color:#de7272;color:#fff;width:120px;padding:6px 0;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease,color .2s ease}.multi-delete-btn:hover{background-color:#c9302c;color:#fff}.multi-delete-confirm-btn{background-color:#de7272;color:#fff;padding:8px 12px;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease,color .2s ease}.multi-delete-btn.cancel-mode{background-color:#e39c19}.multi-delete-btn.cancel-mode:hover{background-color:#d7701b;color:#fff}.multi-delete-confirm-btn:hover{background-color:#c9302c;color:#fff}.mass-select-container{display:flex;justify-content:right;margin-top:10px;margin-bottom:10px;gap:10px}.multi-delete-btn-container{display:flex;flex-direction:row;gap:10px}.design-select-button{width:40px;height:40px;background-color:#fff;border:2px solid #ccc;border-radius:4px;cursor:pointer;padding:0;font-size:16pt;color:#fff;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease,border-color .2s ease}.design-select-button.selected{background-color:#e39c19;border-color:#e39c19}.design-select-button:hover{border:2px solid #ccc}.dashboard-controls{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.design-search-input{padding:.5rem;font-size:1rem;flex:1;min-width:200px;border:2px solid #4794b4;border-radius:10px;background-color:#f3f4f6;color:#1f2937}.design-search-input:focus{outline:none}.design-sort-select{padding:.5rem;font-size:1rem;min-width:150px;border:2px solid #4794b4;border-radius:10px;background-color:#f3f4f6;color:#1f2937}.top-buttons{display:flex;width:100%;flex-direction:row;justify-content:space-between}.terms-container{color:#1a3d4b;padding:40px 20px;display:flex;flex-direction:column;align-items:center}.account-container{color:#1a3d4b;padding:40px;display:flex;flex-direction:column;align-items:center;height:400px}.button-account{background-color:#1ca945;color:#fff;padding:6px 8px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:background-color .3s ease}.button-account:hover,.button-account:focus{background-color:#2b6d32}.button-cancel{background-color:#e39c19;margin-top:10px;color:#fff;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:background-color .3s ease,transform .2s ease}.button-cancel:hover,.button-cancel:focus{background-color:#d7701b;transform:translateY(-2px)}.account-actions{display:flex;justify-content:center;flex-direction:column;gap:.5rem;margin-top:20px}.account-form{display:flex;flex-direction:column;gap:.5rem;font-weight:400}.account-input{padding:10px;border:1px solid #ccc;border-radius:10px;background-color:#f9f9f9;color:#1a3d4b;font-size:1rem;outline:none}.button-edit{background-color:#1ca945;color:#fff;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:background-color .3s ease,transform .2s ease}.button-edit:hover,.button-edit:focus{background-color:#2b6d32;transform:translateY(-2px)}.button-logout{background-color:#e39c19;color:#fff;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:background-color .3s ease,transform .2s ease}.button-logout:hover,.button-logout:focus{background-color:#d7701b;transform:translateY(-2px)}.button-delete{background-color:#de7272;color:#fff;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:background-color .3s ease,transform .2s ease}.button-delete:hover,.button-delete:focus{background-color:#c74a4a;transform:translateY(-2px)}.template-card{background:linear-gradient(to bottom,#fff,#d4effb);padding-top:10px;padding-bottom:10px;border-radius:12px;box-shadow:0 4px 8px #0000001a;transition:box-shadow .3s ease-in-out;margin:20px auto}.template-name{font-size:1.25rem;font-weight:600;color:#333;margin-bottom:16px;text-align:center}.preview-container{overflow:hidden;margin-bottom:20px;padding-left:20px}.button-container{text-align:center}.use-template-button{background-color:#4794b4;color:#fff;width:95%;border-radius:50px;font-size:1rem;cursor:pointer;border:none;transition:background-color .3s ease,transform .3s ease}.use-template-button:hover{background-color:#326f89;transform:translateY(-2px)}.use-template-button:focus{outline:none}