@charset "UTF-8";*{box-sizing:border-box;margin:0;padding:0}button{cursor:pointer}body{scrollbar-width:none;background-color:var(--bg-color)}@font-face{font-display:swap;font-family:Pixelify Sans;font-style:normal;font-weight:400;src:url(/fonts/pixelify-sans-v3-latin/pixelify-sans-v3-latin-regular.woff2) format("woff2")}@font-face{font-display:swap;font-family:Pixelify Sans;font-style:normal;font-weight:600;src:url(/fonts/pixelify-sans-v3-latin/pixelify-sans-v3-latin-600.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:400;src:url(/fonts/inter-v20-latin/inter-v20-latin-regular.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:600;src:url(/fonts/inter-v20-latin/inter-v20-latin-600.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:800;src:url(/fonts/inter-v20-latin/inter-v20-latin-600.woff2) format("woff2")}@font-face{font-display:block;font-family:Material Symbols Rounded;src:url(/fonts/MaterialSymbolsRounded-variable.woff2) format("woff2")}.material-symbols-rounded{font-family:Material Symbols Rounded;font-weight:400;font-style:normal;font-size:24px;line-height:1;min-width:1em;min-height:1em;overflow:hidden;text-align:center;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-feature-settings:"liga";font-feature-settings:"liga";-webkit-font-smoothing:antialiased}.app-loader{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;background-color:var(--bg-color);position:fixed;top:0;left:0;z-index:9999}.spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--font-color);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.lp-container{display:flex;flex-direction:column;justify-content:space-between;align-items:center;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--bg-color);color:var(--font-color)}.lp-container section{width:100%}.lp-header{display:flex;height:64px;justify-content:space-between;align-items:center;width:100%;padding:.5rem 1rem;position:sticky;top:0;z-index:1000;background-color:var(--card-bg-color);box-shadow:0 2px 8px #00000008}.lp-header h1{font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:clamp(1.5rem,4vw,2.5rem);color:#f3d617;text-shadow:-2px -2px 0 #4370f4,2px -2px 0 #4370f4,-2px 2px 0 #4370f4,2px 2px 0 #4370f4}.lp-header button{border:2px solid var(--font-color);background-color:transparent;cursor:pointer;color:var(--font-color);font-size:14px;padding:.5rem 1rem;border-radius:.5rem;transition:opacity transform .1s ease-out}.lp-header button:hover{opacity:.8}.lp-header button:active{transform:translateY(1px)}.auth-container{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:clamp(320px,15vw,450px);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:var(--font-color)}.auth-form{background-color:var(--bg-color);border-radius:16px;display:flex;padding:clamp(2rem,5vw,2.5rem);flex-direction:column;align-items:center;gap:20px;box-shadow:var(--shadow-card-big)}.auth-form h1{margin:0;padding:0;font-size:2rem;color:#fcff5f;text-shadow:-2px -2px 0 #1e3a9f,2px -2px 0 #1e3a9f,-2px 2px 0 #1e3a9f,2px 2px 0 #1e3a9f;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.auth-form button{display:flex;justify-content:center;align-items:center;background-color:var(--font-color);border-radius:12px;border:none;color:var(--bg-color);min-height:40px;min-width:100px;font-size:1.1rem;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;box-shadow:var(--shadow-button)}.auth-form .auth-OAuth{display:flex;align-items:center;justify-content:center;background-color:var(--card-bg--color);color:var(--font-color);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;border-radius:16px;border:1px solid var(--border-color)}.auth-form .error{font-size:14px;color:red}.auth-form .success{font-size:14px}.auth-mode--toggle{height:2.5rem;width:250px;display:flex;align-items:center;background-color:var(--card-bg--color);position:relative;overflow:hidden;border-radius:12px;box-shadow:1px 2px 25px #0000001a;border:1px solid var(--border-color);color:var(--font-color)}.auth-mode--toggle label{display:flex;justify-content:center;flex:1;background:transparent;z-index:2;transition:.3s all ease-in;padding:-10px;margin:-10px 10px -10px -10px}.auth-mode--toggle input{opacity:0}.auth-mode--toggle .auth-mode--indicator{background:var(--font-color);height:100%;width:50%;position:absolute;border-radius:12px;box-shadow:1px 2px 15px #00000026;opacity:.2}.auth-mode--toggle .auth-mode--indicator :focus{transition:all .1s ease-in;border:2px solid var(--button-primary-bg)}.auth-form--input{margin-top:8px}.auth-form--input input{margin-bottom:16px;margin-top:8px;border:1px solid var(--border-color);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:450;font-size:1.1rem;border-radius:12px;padding:8px;background-color:var(--card-bg-color);color:var(--font-color)}.auth-form--input input :focus{transition:all .2s ease-in;transform:scale(1.01);border:2px solid var(--button-primary-bg)}.gsi-material-button{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-appearance:none;background-color:#fff;background-image:none;border:none;-webkit-border-radius:4px;border-radius:13px;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--font-color);cursor:pointer;font-family:VT323,sans-serif;letter-spacing:.25px;outline:none;overflow:hidden;padding:0 12px;position:relative;text-align:center;-webkit-transition:background-color .218s,border-color .218s,box-shadow .218s;transition:background-color .218s,border-color .218s,box-shadow .218s;vertical-align:middle;white-space:nowrap;max-width:250px;min-width:min-content}.gsi-material-button .gsi-material-button-icon{height:20px;margin-right:12px;min-width:20px;width:20px}.gsi-material-button .gsi-material-button-content-wrapper{-webkit-align-items:center;align-items:center;display:flex;-webkit-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;height:100%;justify-content:center;position:relative;width:250px}.gsi-material-button .gsi-material-button-contents{padding:2px;overflow:hidden;text-overflow:ellipsis;vertical-align:top;color:var(--font-color);font-size:16px}.gsi-material-button .gsi-material-button-state{-webkit-transition:opacity .218s;transition:opacity .218s;bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.gsi-material-button-content-wrapper{display:flex;justify-content:center;align-items:center}.modalContainer{position:fixed;width:100%;height:100%;z-index:100;top:0;left:0;display:flex;justify-content:center;align-items:center;pointer-events:auto;background:#0000004d;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.moveModal{z-index:1000;will-change:transform,opacity}.modal-underlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0000;opacity:.8;z-index:99;border:none;width:100%;box-shadow:unset}.modal-underlay:hover{transform:translate(0);box-shadow:unset}.pokeballIcon{width:100px;position:absolute;top:60%;left:75%;animation:rotate-and-scale .5s ease-in-out}@keyframes rotate-and-scale{0%{transform:scale(1) rotate(0)}50%{transform:scale(1.5) rotate(180deg)}to{transform:scale(1) rotate(360deg)}}@media(max-width:768px){.pokeballIcon{width:80px}}@media(max-width:450px){.pokeballIcon{width:70px}}.hero{width:100%;background:linear-gradient(to bottom,var(--card-bg-color),var(--bg-color));display:flex;align-items:center;justify-content:center;flex-direction:column;padding:2rem 1rem;min-height:calc(100vh - 64px);gap:1rem}@media(min-width:768px){.hero{padding:3rem 2rem;gap:1.25rem}}@media(min-width:1024px){.hero{padding:1.5rem}}.hero-content{display:flex;width:100%;max-width:600px;flex-direction:column;justify-content:center;gap:.75rem;text-align:center;align-items:center}@media(min-width:768px){.hero-content{gap:1rem}}.hero-content h1{font-size:1.75rem;line-height:1.3}@media(min-width:768px){.hero-content h1{font-size:2rem}}.hero-content h1 span{font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;text-shadow:0 0 4px rgba(0,0,0,.1),0 2px 15px rgba(0,0,0,.05)}.hero-content p{font-size:.875rem;max-width:450px;opacity:.85}@media(min-width:768px){.hero-content p{font-size:1rem}}.hero-content button{width:fit-content;font-size:.875rem;font-weight:600;margin-top:.75rem;padding:10px 20px;border-radius:.5rem;border:none;cursor:pointer;background-color:#fff941;color:#1a1a1a;transition:background-color .1s ease-out,transform .1s ease-out;box-shadow:0 0 4px #0000001a,0 2px 15px #0000000d}@media(min-width:768px){.hero-content button{font-size:1rem;padding:12px 24px;margin-top:1rem}}.hero-content button:hover{background-color:#fffb7c}.hero-content button:active{transform:translateY(1px)}.hero-illustration{display:flex;align-items:center;justify-content:center;width:100%;max-width:100%;height:auto;min-height:450px}@media(min-width:768px){.hero-illustration{width:100%;max-width:800px}}@media(min-width:1024px){.hero-illustration{max-width:1000px}}.palette-illustration-container{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:visible}.trading-card{position:absolute;width:180px;height:270px;border-radius:.75rem;overflow:hidden;background:#fff;box-shadow:0 10px 20px #0000001a,0 2px 5px #0000000d;border:6px solid #fff;transform-origin:bottom center;cursor:pointer}@media(min-width:768px){.trading-card{width:240px;height:360px;border-radius:1rem;border:8px solid #fff}}.trading-card:hover{transform:translateY(-5px);box-shadow:0 15px 30px #00000026,0 5px 10px #0000000d}.card-background{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;z-index:0;height:100%}.ribbon{flex:1;width:100%;position:relative}.ribbon:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,rgba(255,255,255,.1),transparent)}.card-content{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:space-between}.pokemon-info{padding:.5rem 1rem;display:flex;justify-content:space-between;align-items:center;background-color:#fff}.pokemon-name{font-size:.9rem;font-weight:800;color:#1a1a1a;letter-spacing:-.5px;text-transform:capitalize}@media(min-width:768px){.pokemon-name{font-size:1rem}}.pokemon-id{font-family:monospace;font-size:.7rem;color:#888;font-weight:600}@media(min-width:768px){.pokemon-id{font-size:.8rem}}.trading-card-img{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;border-radius:.5rem;overflow:hidden}.sprite-container{position:absolute;top:1.5rem;left:50%;transform:translate(-50%);z-index:2;width:120px;height:120px;display:flex;align-items:center;justify-content:center}@media(min-width:768px){.sprite-container{top:2rem;width:160px;height:160px}}.pokemon-sprite{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 8px 16px rgba(0,0,0,.2))}.color-codes{width:100%;padding:.75rem;display:grid;grid-template-columns:repeat(2,1fr);gap:.25rem;background:#ffffff80;margin:.5rem;border-radius:.5rem;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);margin-top:auto}@media(min-width:768px){.color-codes{padding:1rem;gap:.5rem}}.hex-code{font-family:monospace;font-size:.75rem;text-align:center;background:#ffffffe6;padding:.25rem;border-radius:.25rem;display:flex;align-items:center;justify-content:center}.hex-code span{font-weight:700;text-shadow:0 1px 2px rgba(255,255,255,.8)}.features{margin-top:4rem;margin-bottom:4rem;display:grid;grid-template-columns:1fr;gap:1.5rem;padding:0 1rem}@media(min-width:640px){.features{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}}@media(min-width:1024px){.features{margin-top:10rem;margin-bottom:10rem}}.feature{display:flex;flex-direction:column;color:var(--font-color);gap:.5rem;padding:1rem;border-radius:1rem;background-color:var(--card-bg-color);box-shadow:var(--shadow-button);transition:transform .2s ease-in-out;cursor:pointer}.feature:hover{transform:translateY(-5px) scale(1.05)}.feature h3{font-size:1rem}@media(min-width:1024px){.feature h3{font-size:1.2rem}}.feature p{font-size:.9rem;letter-spacing:.01em;opacity:70%}@media(min-width:1024px){.feature p{font-size:1rem}}.feature .feature-skeleton{margin-bottom:1rem;height:100%;min-height:200px;background-color:var(--card-bg-color)}.lock-skeleton{width:100%;height:100%;min-height:200px;display:flex;align-items:center;justify-content:center;border-radius:.75rem;overflow:hidden;position:relative;background-color:var(--card-bg-color)}.lock-skeleton .swatch-grid{background-color:var(--bg-color);position:absolute;top:-20%;right:-20%;bottom:-20%;left:-20%;display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:8px;z-index:1;opacity:.5;mask-image:radial-gradient(circle at center,black 30%,transparent 80%);-webkit-mask-image:radial-gradient(circle at center,black 30%,transparent 80%);transform:rotate(12deg)}.lock-skeleton .swatch-grid .grid-swatch{width:100%;aspect-ratio:1;border-radius:6px}.lock-skeleton .icon-container{position:relative;z-index:10;background-color:var(--card-bg-color);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:2rem;border-radius:1.5rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;border:1px solid var(--border-color)}.lock-skeleton .icon-container .main-icon{width:4rem;height:4rem;color:var(--font-color)}.save-skeleton{width:100%;height:100%;min-height:200px;display:flex;align-items:center;justify-content:center;border-radius:.75rem;overflow:hidden;position:relative;background-color:var(--card-bg-color)}.save-skeleton .swatch-grid{background-color:var(--bg-color);position:absolute;top:-20%;right:-20%;bottom:-20%;left:-20%;display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:8px;z-index:1;opacity:.5;mask-image:radial-gradient(circle at center,black 30%,transparent 80%);-webkit-mask-image:radial-gradient(circle at center,black 30%,transparent 80%);transform:rotate(-12deg)}.save-skeleton .swatch-grid .grid-swatch{width:100%;aspect-ratio:1;border-radius:6px}.save-skeleton .folder-container{position:relative;z-index:10;background-color:var(--card-bg-color);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:2rem;border-radius:1.5rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;border:1px solid var(--border-color)}.save-skeleton .folder-container .folder-icon{width:4rem;height:4rem;color:var(--font-color)}.export-skeleton{width:100%;height:100%;min-height:200px;display:flex;align-items:center;justify-content:center;border-radius:.75rem;overflow:hidden;position:relative;background-color:var(--card-bg-color)}.export-skeleton .code-background{background-color:var(--bg-color);position:absolute;top:-20%;right:-20%;bottom:-20%;left:-20%;display:flex;flex-direction:column;justify-content:center;gap:12px;transform:rotate(-5deg);z-index:1;opacity:.6;mask-image:radial-gradient(circle at center,black 30%,transparent 80%);-webkit-mask-image:radial-gradient(circle at center,black 30%,transparent 80%);padding:2rem}.export-skeleton .code-background .code-line{height:12px;border-radius:4px;display:flex;align-items:center}.export-skeleton .code-background .code-line .code-indents{display:flex;gap:8px}.export-skeleton .code-background .code-line .code-token{height:12px;border-radius:4px}.export-skeleton .icon-container{position:relative;z-index:10;background-color:var(--card-bg-color);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:2rem;border-radius:1.5rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;border:1px solid var(--border-color)}.export-skeleton .icon-container .main-icon{width:4rem;height:4rem;color:var(--font-color)}.shiny-skeleton{width:100%;height:100%;min-height:200px;display:flex;align-items:center;justify-content:center;border-radius:.75rem;overflow:hidden;position:relative;background-color:var(--card-bg-color)}.shiny-skeleton .particles-container{background-color:var(--bg-color);position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;mask-image:radial-gradient(circle at center,black 20%,transparent 92%);-webkit-mask-image:radial-gradient(circle at center,black 20%,transparent 92%)}.shiny-skeleton .particles-container .particle{position:absolute;width:6px;height:6px;border-radius:50%;box-shadow:0 0 8px currentColor}.shiny-skeleton .icon-container{position:relative;z-index:10;background-color:var(--card-bg-color);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:2rem;border-radius:1.5rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;border:1px solid var(--border-color)}.shiny-skeleton .icon-container .main-icon{width:4rem;height:4rem;color:var(--font-color)}.landing-footer{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#000;color:#fff;gap:3rem;width:100%;position:relative}@media(min-width:1024px){.landing-footer{gap:5rem}}.landing-footer .pokemon-color-stripe-container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%}.landing-footer .pokemon-color-stripe{height:32px;width:100%}.landing-footer .footer-cta{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;text-align:center}.landing-footer .footer-cta h2{font-size:2rem;font-weight:700;line-height:1.2}@media(min-width:768px){.landing-footer .footer-cta h2{font-size:3rem}}@media(min-width:1024px){.landing-footer .footer-cta h2{font-size:4rem}}.landing-footer .footer-cta p{font-size:1rem;letter-spacing:.01em;padding:0 1rem}.landing-footer .footer-cta button{width:fit-content;font-size:1rem;font-weight:600;margin-top:1.5rem;padding:12px 24px;border-radius:.5rem;border:none;cursor:pointer;background-color:#fff941;color:#1a1a1a;transition:background-color transform .1s ease-out;box-shadow:0 0 4px #0000001a,0 2px 15px #0000000d}@media(min-width:1024px){.landing-footer .footer-cta button{font-size:1.2rem}}.landing-footer .footer-cta button:hover{background-color:#fffb7c}.landing-footer .footer-cta button:active{transform:translateY(1px)}.landing-footer .footer-links{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2rem;width:100%}@media(min-width:768px){.landing-footer .footer-links{flex-direction:row;align-items:flex-start;gap:15%}}@media(min-width:1024px){.landing-footer .footer-links{gap:30%}}.landing-footer .footer-links div{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}@media(min-width:768px){.landing-footer .footer-links div{align-items:start}}.landing-footer .footer-links div h3{font-size:1.1rem;font-weight:700}@media(min-width:1024px){.landing-footer .footer-links div h3{font-size:1rem}}.landing-footer .footer-links div ul{list-style:none;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.75rem}@media(min-width:768px){.landing-footer .footer-links div ul{align-items:start;gap:.5rem}}.landing-footer .footer-links div ul li a{text-decoration:none;color:#fff;font-size:16px;opacity:80%;letter-spacing:.01em;transition:text-decoration .1s ease-out}@media(min-width:1024px){.landing-footer .footer-links div ul li a{font-size:14px}}.landing-footer .footer-links div ul li a:hover{text-decoration:underline}.landing-footer .footer-copyright{font-size:12px;margin-top:1rem;opacity:.6;letter-spacing:.01em;text-align:center}@media(min-width:1024px){.landing-footer .footer-copyright{margin-top:2rem}}.app{display:flex;flex-direction:column;flex-grow:1}@media(min-width:1024px){.app{flex-direction:row}}.pokecard{display:flex;flex-direction:column;flex-grow:1;min-height:0;position:relative;background-color:var(--bg-color)}.pokecard main{display:flex;flex-direction:column;flex-grow:1;min-height:0;position:relative}.pc-action{display:flex;width:100%;justify-content:space-between;height:clamp(90px,15vw,120px);gap:16px;background-color:var(--bg-color);opacity:1;align-items:center;padding:0px clamp(8px,3vw,32px);font-family:inherit;flex-shrink:0}.pc-action span{display:flex;justify-content:space-between;gap:clamp(2px,5vw,24px);align-items:center}.pc-action button{display:flex;align-items:center;justify-content:center;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;border:none;transition:all .2s ease-in}.pc-action button:hover{transform:scale(1.01) translateY(-1px);transition:all .1s ease-in}.pc-action button:focus{transition:all .1s ease-in;border:1px solid var(--accent-dark);transform:scale(1.01) translateY(-1px)}.pc-action button:active{transform:translateY(0) scale(.99);filter:brightness(.9)}.pc-action .pc-action--primary{height:40%;width:40%;background-color:var(--accent-dark);border-radius:8px;color:var(--accent-light);letter-spacing:2%;box-shadow:var(--shadow-button);font-size:clamp(1rem,2vw,1.3rem);font-weight:600}.pc-action .pc-action--secondary{background:none;max-width:clamp(32px,10vw,45px);max-height:clamp(32px,10vw,40px);border:2px solid var(--accent-dark);border-radius:50%;padding:8px;color:var(--accent-dark);box-shadow:var(--shadow-button)}@media(min-width:1024px){.pc-action{display:flex;justify-content:center;align-items:center;position:absolute;width:auto;height:auto;padding:8px;border-radius:100px;bottom:16px;left:50%;transform:translate(-50%);border:2px solid rgba(0,0,0,.15);background-color:#ececec59;box-shadow:0 2px 15px #0000001a}.pc-action span{justify-content:center;gap:16px}.pc-action .pc-action--secondary{background:var(--accent-dark);border:none;color:var(--accent-light);opacity:.9}}.btn-61,.btn-61 *,.btn-61 :after,.btn-61 :before,.btn-61:after,.btn-61:before{border:0 solid;box-sizing:border-box}.btn-61{-webkit-tap-highlight-color:transparent;-webkit-appearance:button;color:#fff;background-color:#2295f3;cursor:pointer;font-family:VT323,monospace;font-size:70%;line-height:1.5;margin:0;-webkit-mask-image:-webkit-radial-gradient(#000,#fff);padding:0}.btn-61:disabled{cursor:default}.btn-61:-moz-focusring{outline:auto}.btn-61 svg{display:block;vertical-align:middle}.btn-61 [hidden]{display:none}.btn-61{background:none;box-sizing:border-box;color:#000;display:block;font-weight:900;-webkit-mask-image:none;padding:1.5rem 4rem;position:relative;text-transform:uppercase}.btn-61 span{background:#12b7f8;border:5px solid #96c6ee;border-radius:999px;display:grid;top:0;right:0;bottom:0;left:0;place-items:center;pointer-events:none;position:absolute;color:#fff}.btn-61:hover span{-webkit-animation:rubberBand .8s;animation:rubberBand .8s}@-webkit-keyframes rubberBand{0%{transform:scaleX(1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{transform:scaleX(1)}}@keyframes rubberBand{0%{transform:scaleX(1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{transform:scaleX(1)}}.viewPalette{display:flex;flex-direction:column;position:relative;flex-grow:1;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;transition:.3s all cubic-bezier(.87,0,.13,1);color:var(--font-color)}.viewPalette .paletteBarContainer{display:grid;grid-template-rows:repeat(6,1fr);flex-grow:1;overflow:hidden;min-height:0}.viewPalette .paletteSpriteContainer{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;transition:.3s all cubic-bezier(.87,0,.13,1);transform-origin:center center}.viewPalette .paletteSpriteContainer .paletteSprite{image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:-webkit-crisp-edges;pointer-events:none}.viewPalette.is-loading{filter:grayscale(100%)}.vp-save{background-color:var(--card-bg-color);border-radius:16px;display:flex;padding:clamp(2rem,5vw,2.5rem);flex-direction:column;align-items:center;gap:8px;box-shadow:var(--shadow-card-big);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.1rem;color:var(--font-color)}.vp-save h1{margin:0;padding:0;font-size:1.5rem;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;letter-spacing:1px;font-weight:600}.vp-save span{height:80px;width:100%;display:flex;justify-content:center;overflow:hidden;border-radius:10px;margin-top:16px;box-shadow:var(--shadow-card-small)}.vp-save span div{height:100%;flex-grow:1}.vp-save label{margin-top:24px;text-align:start;margin-bottom:2px;opacity:.8}.vp-save input{border:2.5px solid var(--border-color);border-radius:12px;padding:8px;font-size:1.1rem;max-width:90%;font-family:inherit;margin-top:0;background-color:inherit;color:var(--font-color)}.vp-save button{display:flex;justify-content:center;align-items:center;background-color:var(--font-color);border-radius:12px;border:none;color:var(--bg-color);min-height:40px;min-width:100px;font-size:1.1rem;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;box-shadow:1px 2px 25px #0000001a;margin-top:24px}.vp-save button:disabled{transition:.1s ease-in opacity;opacity:.2;cursor:not-allowed}@media(min-width:1024px){.viewPalette{margin:8px;border-radius:16px;overflow:hidden;box-shadow:2px 4px 10px #0003}}.tooltip{box-sizing:border-box;padding:8px;box-shadow:0 2px 15px #0000001a;border:1px solid var(--border-color);z-index:100;text-align:center;font-size:.8rem;border-radius:12px;width:220px;color:var(--font-color);background-color:var(--card-bg-color);position:absolute;left:50%;top:2%;transition:.2 ease-in all;animation:scaleIn .2s forwards;margin-left:-110px}@keyframes scaleIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.paletteBar{font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;letter-spacing:.02em;min-height:0;display:flex;align-items:center}.colorSwatch{color:inherit;display:flex;align-items:center;justify-content:space-between;padding:16px;border:none;font-size:1rem;cursor:pointer;font-weight:500;opacity:1;transition:ease-in .1s all;overflow:hidden;width:100%}.colorSwatch p{margin:0;padding:0}.colorSwatch .paletteBar-actions{display:flex;gap:1.5rem}.colorSwatch .paletteBar-actions button{border:none;background:none;color:inherit;opacity:.8;padding:10px;margin:-10px}.colorSwatch .paletteBar-actions button:hover{transform:scale(1.2);transition:all .1s ease-in;opacity:1}.colorSwatch .paletteBar-actions button .material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 200,"GRAD" 0,"opsz" 24}.colorValue{font-family:inherit;font-size:inherit;opacity:1;border:none;background:none;color:inherit;opacity:.85;padding:10px;margin:-10px;border-radius:8px;font-weight:600}.colorValue:hover{opacity:1;background-color:#b5b5b540;transition:all .18s ease-in}.paletteBar.is-locked{position:relative}.paletteBar.is-locked:after{content:"";position:absolute;bottom:0;left:0;width:8px;height:100%;background-color:var(--bg-color);opacity:.5}.shadesContainer{display:flex;flex-direction:column;width:clamp(250px,50vw,500px);height:clamp(600px,70vh,900px);border-radius:24px;overflow:hidden;box-shadow:var(--shadow-card-big);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.shadesContainer button{margin:0;border:none;padding:0 16px;display:flex;justify-content:space-between;align-items:center;font-size:.9rem;font-family:inherit;font-weight:500}.shadesContainer button .originalMarker span{height:8px;width:8px;border-radius:100%;display:block}.shade{flex-grow:1}.closeShades{background:none;font-size:1.5rem;padding:5px}@media(min-width:1024px){.colorSwatch{padding:8px 16px}}.custom-tooltip{background-color:#242424;color:#fff;padding:8px;border-radius:6px;font-size:.8rem;z-index:999;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.tooltip-arrow{fill:#242424}.savedPaletteWindow{height:clamp(500px,80vh,1400px);width:100%;position:absolute;background-color:var(--card-bg-color);border-radius:24px;top:10%;z-index:100;display:flex;flex-direction:column;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;box-shadow:0 -2px 10px #00000026;will-change:transform;color:var(--font-color);font-size:1rem}.savedPaletteWindow input{height:48px;border-radius:16px;border:2px solid var(--border-color);padding:8px;background:transparent;font-size:1rem;letter-spacing:.1em;margin:8px 24px;color:var(--font-color)}.savedPaletteContainer{height:100%;display:flex;flex-grow:1;flex-direction:column}.savedPaletteHeader{display:flex;justify-content:center;align-items:center;padding:25px;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;position:relative;font-weight:600;font-size:1rem;line-height:38px;letter-spacing:.1em;color:var(--font-color)}.savedPaletteHeader button{background:none;position:absolute;border:none;right:16px;top:16px;display:inline;display:flex;justify-content:center;align-items:center;padding:10px;margin:-10px;color:var(--font-color)}.savedPaletteHeader h1{margin:0;padding:0}.guestPaletteWindow{flex-grow:1}.frame{color:var(--font-color);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;height:100%;justify-content:center;align-items:center;background:var(--card-bg-color);margin-top:1rem}.frame h1{font-size:1rem}.savedPalettesPane{height:100%;display:flex;flex-direction:column;gap:24px;padding:32px 8px;overflow-y:auto}.noPalettesSaved{margin-top:48px;height:100%;display:flex;flex-direction:column;justify-content:start;align-items:center;font-size:1rem;line-height:32px;letter-spacing:.1em;text-align:center;position:relative}.noPalettesSaved p{opacity:.8}.noPalettesSaved svg{width:200px;fill:none;stroke:var(--font-color);opacity:.25;stroke-width:.5;transform:rotate(45deg);margin-top:64px}@media(min-width:1024px){.savedPaletteWindow{width:320px;height:100%;top:0;right:0;overflow:hidden;border-radius:0;box-shadow:0 8px 8px #00000040;background-color:var(--bg-color)}.savedPaletteWindow input{margin:8px 8px 0;height:2.5rem;font-size:.8rem;border-radius:12px}.savedPalettesPane{scrollbar-width:none}.savedPaletteHeader{padding:16px 8px;font-size:.8rem;line-height:24px}.frame{background:var(--bg-color)}}.paletteCard{width:100%;display:flex;flex-direction:column;align-items:center;border:1px solid var(--border-color);overflow:hidden;border-radius:20px;padding:8px;box-shadow:var(--shadow-card-small);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:var(--font-color);font-size:1rem}.plc-delete{background-color:var(--card-bg-color);border-radius:16px;display:flex;padding:clamp(2rem,5vw,2.5rem);flex-direction:column;align-items:center;width:min-content;gap:8px;box-shadow:var(--shadow-card-big);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.1rem;color:var(--font-color)}.plc-delete span{display:flex;gap:1rem;align-items:center}.plc-delete span button{display:flex;justify-content:center;align-items:center;background-color:var(--card-bg-color);border-radius:12px;border:none;color:var(--font-color);min-height:50px;min-width:110px;font-size:1.1rem;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;box-shadow:var(--shadow-button);margin-top:24px;border:2px solid var(--border-color)}.plc-delete span .plc-delete--btn{color:#6b0000;background-color:#e2caca;border:2px solid rgba(107,0,0,.218)}.plc-delete h1{margin:0 0 32px;padding:0;font-size:1.5rem;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;letter-spacing:1px;font-weight:600}.plc-delete p{margin:0;padding:0;text-align:center}.paletteCard button{border:none;background:none;font-size:1.1rem;color:var(--font-color)}.paletteCard button:hover{opacity:.5;transition:.2s ease-in opacity}.palette-color-stripes{display:flex;overflow:hidden;height:80px;width:100%;min-width:0;border-radius:12px}.savedColorStripe{flex:1;padding:0;margin:0;min-width:0;overflow-wrap:break-word;display:flex;flex-direction:column;align-items:center;justify-content:start;height:100%}.palette-content{width:100%;display:flex;flex-direction:column;align-items:start}.palette-content span{width:100%;display:flex;align-items:center;justify-content:space-between;position:relative}.palette-content span p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.palette-content span form{display:flex;justify-content:start;padding:0;margin:0}.palette-content span form input{width:60%;height:32px;margin:2px 0;border:none;font-family:inherit;font-size:inherit;font-weight:600;outline:none;-moz-appearance:none;appearance:none;-webkit-appearance:none;border-bottom:2px solid #ccc;border-radius:0;transition:border-color .3s ease}.palette-content span form input:focus{border-bottom-color:var(--font-color)}.palette-content span form button{display:inline;display:flex;justify-content:center;align-items:center;padding:10px;margin:-10px -10px -10px 2px}.palette-content p{margin:8px;font-size:1rem;font-weight:600}.saved-palette-options{display:flex;gap:16px}.saved-palette-options button{display:inline;display:flex;justify-content:center;align-items:center;padding:10px;margin:-10px}.saved-palette-options button .material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 350,"GRAD" 0,"opsz" 24}.palette-sprites-container{display:flex;justify-content:start;flex-grow:1;flex-wrap:wrap;padding:0;margin-top:8px;width:100%;height:50px}.palette-sprites-container img{transform:scale(1.05);padding:0;margin:0;height:100%}@media(min-width:1024px){.palette-color-stripes{height:50px}.palette-sprites-container{height:35px}.palette-sprites-container img{transform:scale(1)}.saved-palette-options{display:flex;gap:16px}.saved-palette-options button{display:inline;display:flex;justify-content:center;align-items:center;padding:10px;margin:-10px}.saved-palette-options button .material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 350,"GRAD" 0,"opsz" 16}}.export{display:flex;flex-direction:column;align-items:center;gap:1rem;background-color:var(--bg-color);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:1rem 1.5rem;font-size:1rem;color:var(--font-color);border-radius:16px}.code-container{min-height:300px;aspect-ratio:3/4;border:2px solid var(--border-color);overflow-y:auto;scrollbar-width:none}.export-actions{display:flex;gap:8px}.export-actions button{display:flex;justify-content:center;align-items:center;background-color:var(--card-bg-color);border-radius:12px;border:none;color:var(--font-color);min-height:50px;min-width:110px;font-size:1.1rem;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;box-shadow:var(--shadow-button);margin-top:16px;border:2px solid var(--border-color)}pre{margin:0}*{box-sizing:border-box}.sidenav{position:absolute;z-index:100;background-color:var(--card-bg-color);top:0;right:0;height:100vh;overflow:hidden;padding:16px 8px;width:clamp(240px,40vw,560px);box-shadow:0 8px 8px #00000040;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;min-height:0;color:--font-color}.sidenav .sn-header{display:flex;justify-content:space-between;align-items:center;padding:2px 8px;margin-bottom:16px;margin-top:8px;font-size:1.5rem;letter-spacing:1px;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.sidenav input{border:2.5px solid rgba(0,0,0,.18);width:100%;border-radius:12px;padding:8px;font-size:inherit;color:var(--font-color);background-color:var(--card-bg-color)}.sn-list{overflow-y:auto;scrollbar-width:none;padding:8px;height:100%}.sn-list .sn-button{margin:12px 0;padding:12px 8px;display:flex;justify-content:start;gap:16px;align-items:center;border-radius:12px;width:100%;background-color:var(--card-bg-color);box-shadow:var(--shadow-button);font-size:1.1rem;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;border:1px solid var(--border-color);height:fit-content;color:var(--font-color)}.sn-list .sn-button:hover{transform:scale(1.01) translateY(-1px);transition:all .1s ease-in}.sn-list .sn-button:focus{border:1px solid var(--accent-dark);transform:scale(1.01) translateY(-1px)}.sn-list .sn-button:active{transform:translateY(0) scale(.99);filter:brightness(.9)}.sn-list .sn-button--selected{background-color:var(--accent-dark);transition:all .3s ease-in;color:var(--accent-light);font-weight:600}body.menu-open{overflow:hidden}body.menu-open .app{pointer-events:none}body.menu-open .savedPaletteWindow{pointer-events:auto}@media(min-width:1024px){.sidenav-desktop{background-color:var(--bg-color);display:flex;flex-direction:column;position:relative;overflow:hidden;padding:16px 8px;width:250px;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;flex-shrink:0;height:calc(100vh - 70px)}.sidenav-desktop input{border:2.5px solid var(--border-color);width:100%;border-radius:12px;padding:8px;font-size:inherit;color:var(--font-color);background-color:var(--card-bg-color);z-index:100}.sidenav-desktop .sn-list{min-height:0;flex-grow:1;overflow-y:auto;background-color:var(--bg-color)}}.h-container{display:flex;align-items:center;justify-content:space-between;padding:clamp(.5rem,5vw,1.5rem) clamp(1rem,3vw,1.2rem);margin:none;background-color:var(--bg-color);font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;position:relative;flex-shrink:0;width:100%;color:var(--font-color)}.h-container button{border:none;background:none;display:flex;justify-content:center;align-items:center;color:var(--font-color)}.h-title{color:#f3d617;text-shadow:-2px -2px 0 #4370f4,2px -2px 0 #4370f4,-2px 2px 0 #4370f4,2px 2px 0 #4370f4;font-size:clamp(2rem,8vw,4rem)}.h-icon{font-size:clamp(1.8rem,5vw,2.5rem);font-variation-settings:"FILL" 0,"wght" 320,"GRAD" 0,"opsz" 24}.h-container--menu{display:flex;align-items:center;justify-content:center;position:relative}@media(min-width:1024px){.h-icon{font-size:32px}}.menu-container{font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:1.5rem}.menu-container .menu-trigger{border:none;background:none;cursor:pointer;position:relative}.menu-container .menu{position:fixed;width:240px;background-color:var(--card-bg-color);border-radius:16px;z-index:99;padding:1rem;gap:1rem;display:flex;flex-direction:column;align-items:start;justify-content:space-between;box-shadow:var(--shadow-card-big);overflow:hidden;text-overflow:ellipsis;will-change:height,width,transform}.menu-container .menu .menu-top{position:absolute;z-index:100;display:flex;align-items:center;gap:1rem;top:1rem;left:1rem}.menu-container .menu .menu-top div{font-weight:600;white-space:nowrap;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.menu-container .menu footer{font-size:.75rem;padding-top:1rem;font-family:inherit;width:100%;text-align:center}.menu-container .menu footer a{color:#6161e8;text-decoration:none}.menu-container .menu footer a:hover{text-decoration:underline}.menu-container .menu .menu-nav{padding-top:5rem;display:flex;flex-direction:column;gap:1.2rem;align-items:start;font-size:1.5rem}.menu-container .menu .menu-nav button{font-family:inherit;font-size:inherit}.menu-container .menu .menu-nav a{color:inherit;text-decoration:none}.menu-container .menu .menu-nav .menu-signout{color:red}.about-modal-content{padding:1.5rem 2rem;display:flex;flex-direction:column;gap:1.5rem;align-items:center;text-align:center;width:clamp(300px,60vw,500px);background-color:var(--card-bg-color);color:var(--font-color);font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;border-radius:24px}.about-modal-content h2{font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#f3d617;text-shadow:-2px -2px 0 #4370f4,2px -2px 0 #4370f4,-2px 2px 0 #4370f4,2px 2px 0 #4370f4}.about-modal-content p{font-size:1rem;line-height:1.5}.about-modal-content p a{text-decoration:none;color:#6161e8}.about-modal-content p a:hover{text-decoration:underline}.about-modal-content .about-github-link{background-color:var(--font-color);color:var(--card-bg-color);padding:.5rem 1.2rem;font-size:14px;text-decoration:none;box-shadow:var(--shadow-card);transition:transform .2s ease;border-radius:.5rem;box-shadow:0 2px 8px #00000040}.about-modal-content .about-github-link:hover{transform:scale(1.02)}@media(min-width:1024px){.menu-container{width:100%;display:flex;flex-direction:column;align-items:flex-end;font-size:1rem}.menu-container .menu{align-items:flex-end;gap:.7rem;transform-origin:top right;max-width:200px}.menu-container .menu .menu-nav{padding-top:3.5rem;width:fit-content;gap:1rem;align-items:end;font-size:1rem}.menu-container .menu footer{font-size:.7rem}.menu-container .menu footer a{color:#6161e8}.menu-container .menu footer a:hover{text-decoration:underline}.menu-container .menu .menu-top{left:auto;right:1rem;flex-direction:row-reverse}}:root{--bg-color: #f5f5f7;--card-bg-color: #ffffff;--border-color: #c2c2c2;--font-color: #1a1a1a;--shadow-button: 1px 1px 15px rgba(0, 0, 0, .1);--shadow-card-small: 2px 2px 15px rgba(0, 0, 0, .1);--shadow-card-big: 5px 5px 15px rgba(0, 0, 0, .2)}body.dark-mode{--bg-color: #161515;--card-bg-color: #212125;--border-color: #313136;--font-color: #ebebeb;--shadow-button: 1px 1px 15px rgba(0, 0, 0, .2);--shadow-card-small: 2px 2px 15px rgba(0, 0, 0, .2);--shadow-card-big: 5px 5px 15px rgba(0, 0, 0, .3)}.hd-container{display:flex;align-items:center;justify-content:space-between;padding:1.5rem clamp(1rem,3vw,2rem);gap:55%;margin:none;background-color:var(--bg-color);font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;position:relative;flex-shrink:0;height:70px;color:var(--font-color)}.hd-container .hd-title{color:#f3d617;text-shadow:-2px -2px 0 #4370f4,2px -2px 0 #4370f4,-2px 2px 0 #4370f4,2px 2px 0 #4370f4;animation-delay:.2s;font-size:clamp(1.5rem,8vw,1.8rem);font-weight:600;letter-spacing:.1em}.hd-container button{border:none;background:none;display:flex;justify-content:center;align-items:center;color:var(--font-color)}.hd-container nav{font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;justify-content:space-between;align-items:center;width:fit-content;gap:2.5rem}.hd-container nav button{font-family:inherit;font-size:inherit;cursor:pointer}.hd-container nav .hd-library{font-size:1.2rem;color:var(--accent-dark);font-weight:600;font-family:Pixelify Sans,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;cursor:pointer;transition:all .1s ease}.hd-container nav .hd-library:hover{opacity:.8;transform:scale(1.02)}.hd-container nav a{text-decoration:none;color:var(--font-color)}.app-layout{display:flex;flex-direction:column;height:100vh;overflow:hidden}.app-content{flex-grow:1;min-height:0;display:flex;flex-direction:column}