@import "https://fonts.googleapis.com/css2?family=Cardo:ital,wght@0,400;0,700;1,400&family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Oooh+Baby&family=Outfit:wght@300;400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--font-main:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;--font-cardo:"Cardo", Georgia, serif;--font-oooh-baby:"Oooh Baby", cursive, sans-serif;--font-garamond:"EB Garamond", Garamond, Georgia, serif;--font-heading:"Outfit", sans-serif;--bg-carbon:#0f1115;--bg-carbon-deep:#0a0b0e;--bg-deep:#0f1115;--bg-meadow:#14171d;--bg-meadow-accent:#1e222a;--color-primary:#10b981;--color-primary-light:#34d399;--color-primary-glow:#10b98166;--color-accent-pink:#ff4d6d;--color-accent-gold:#fbbf24;--glass-bg-dark:#0f1115d9;--glass-bg-card:#ffffffe0;--glass-bg-card-dark:#12141ad9;--glass-border:#ffffff1f;--glass-border-light:#fff9;--glass-border-glow:#34d39966;--text-dark:#0f172a;--text-muted:#64748b;--text-light:#f8fafc;--radius-sm:10px;--radius-md:18px;--radius-lg:28px;--radius-full:9999px;--shadow-subtle:0 10px 30px #00000059;--shadow-glass:0 20px 50px #00000080, inset 0 1px 1px #ffffff26;--shadow-neon:0 0 30px #10b98173}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}button{color:inherit;background:0 0;border:none;outline:none;font-family:inherit}html,body,#root{width:100%;min-height:100%;font-family:var(--font-cardo);background-color:var(--bg-carbon);color:var(--text-light);-webkit-user-select:none;user-select:none;scrollbar-width:none;-ms-overflow-style:none;overflow:hidden auto}html::-webkit-scrollbar{display:none}body::-webkit-scrollbar{display:none}#root::-webkit-scrollbar{display:none}.glass-panel{background:var(--glass-bg-dark);-webkit-backdrop-filter:blur(24px)saturate(180%);border:1px solid var(--glass-border);box-shadow:var(--shadow-glass);transition:border-color .3s,box-shadow .3s}.glass-panel:hover{border-color:var(--glass-border-glow)}.glass-card-light{-webkit-backdrop-filter:blur(28px)saturate(190%);color:var(--text-dark);background:#ffffffeb;border:1px solid #fffc;box-shadow:0 25px 60px #0000004d,inset 0 1px 2px #fff}.text-gradient{background:linear-gradient(135deg,#a7f3d0 0%,#34d399 50%,#10b981 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.btn-fab{color:#fff;border-radius:var(--radius-full);font-family:var(--font-heading);letter-spacing:.5px;cursor:pointer;box-shadow:0 12px 35px #10b98166, var(--shadow-glass);background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:1px solid #ffffff59;align-items:center;gap:12px;padding:16px 32px;font-size:1.1rem;font-weight:700;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden}.btn-fab:after{content:"";opacity:0;background:radial-gradient(circle,#ffffff4d 0%,#0000 60%);width:200%;height:200%;transition:opacity .3s;position:absolute;top:-50%;left:-50%}.btn-fab:hover{box-shadow:0 18px 45px #10b9818c, var(--shadow-neon);transform:translateY(-4px)scale(1.04)}.btn-fab:hover:after{opacity:1}.btn-fab:active{transform:translateY(0)scale(.97)}.btn-icon{border-radius:var(--radius-full);width:48px;height:48px;color:var(--text-light);border:1px solid var(--glass-border);cursor:pointer;background:#ffffff1f;justify-content:center;align-items:center;transition:all .25s cubic-bezier(.16,1,.3,1);display:flex}.btn-icon:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.08)}.btn-primary{color:#fff;border-radius:var(--radius-md);font-family:var(--font-heading);cursor:pointer;background:linear-gradient(135deg,#10b981,#059669);border:1px solid #fff3;justify-content:center;align-items:center;gap:10px;padding:14px 24px;font-size:.98rem;font-weight:700;transition:all .25s;display:inline-flex;box-shadow:0 8px 20px #10b9814d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 28px #10b98173}.btn-secondary{color:var(--text-dark);border-radius:var(--radius-md);cursor:pointer;background:#0000000d;border:1px solid #0000001a;padding:12px 20px;font-weight:600;transition:all .2s}.btn-secondary:hover{background:#0000001a;transform:translateY(-1px)}.form-group{flex-direction:column;gap:8px;margin-bottom:18px;display:flex}.form-label{color:#1e293b;align-items:center;gap:8px;font-size:.9rem;font-weight:700;display:flex}.form-input,.form-textarea{border-radius:var(--radius-md);width:100%;font-family:var(--font-main);color:var(--text-dark);background:#f8fafccc;border:1px solid #cbd5e1;outline:none;padding:14px 16px;font-size:.98rem;transition:all .25s}.form-input:focus,.form-textarea:focus{border-color:var(--color-primary);background:#fff;box-shadow:0 0 0 4px #10b9812e}.drawing-canvas-wrapper{aspect-ratio:1;border-radius:var(--radius-lg);touch-action:none;background:linear-gradient(#d8f3dc 0%,#b7e4c7 100%);border:2px dashed #52b788;width:100%;max-width:320px;margin:0 auto;position:relative;overflow:hidden;box-shadow:inset 0 4px 12px #00000014}.drawing-canvas{touch-action:none;cursor:crosshair;width:100%;height:100%}.color-picker-grid{flex-wrap:wrap;justify-content:center;gap:10px;margin:14px 0;display:flex}.color-swatch{border-radius:var(--radius-full);cursor:pointer;border:2px solid #fff;width:32px;height:32px;transition:transform .2s cubic-bezier(.16,1,.3,1);box-shadow:0 4px 8px #00000026}.color-swatch.active{box-shadow:0 0 0 3px var(--color-primary), 0 6px 12px #0003;transform:scale(1.28)}.password-box{color:#78350f;border-radius:var(--radius-md);letter-spacing:5px;text-align:center;background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px dashed #f59e0b;margin:12px 0;padding:14px;font-family:monospace;font-size:1.5rem;font-weight:900;box-shadow:inset 0 2px 4px #0000000d}@keyframes fadeIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}@keyframes floatGentle{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.animate-fade-in{animation:.3s cubic-bezier(.16,1,.3,1) forwards fadeIn}.animate-slide-up{animation:.35s cubic-bezier(.16,1,.3,1) forwards slideUp}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0000000d}::-webkit-scrollbar-thumb{background:#ffffff59;border-radius:4px}@media (width>=560px){.header-top{flex-direction:row!important;align-items:center!important;gap:16px!important;padding:10px 22px!important}.header-row{flex:1;align-items:center;gap:12px;display:flex}.header-counter-row{flex-shrink:0;justify-content:flex-end;display:flex!important}}@media (width<=559px){.header-top{flex-direction:column!important;gap:6px!important;padding:10px 16px!important}.header-row{align-items:center;gap:10px;width:100%;display:flex}.header-counter-row{justify-content:center;width:100%;display:flex}}:root{--glitter:url(https://assets.codepen.io/13471/silver-glitter-background.png)}.fire{width:100%;height:100%;position:relative;overflow:hidden}.fire:before,.fire:after{content:"";pointer-events:none;position:absolute;inset:0}.fire:before{content:"";background-image:var(--glitter), var(--glitter), linear-gradient(0deg, white 0px, #ff8951 5px, #dcbc169c 30%, transparent 70%), radial-gradient(ellipse at bottom, transparent 30%, black 60%);background-blend-mode:hard-light, color-dodge, multiply;mix-blend-mode:color-dodge;filter:brightness(3.7)blur(7px)contrast(6);background-position:50% 0,50% 0,50% 100%,50%;background-repeat:repeat,repeat,repeat,no-repeat;background-size:350px 500px,400px 650px,100% 100%,100% 100%;animation:1.75s linear infinite fire;box-shadow:inset 0 -40px 50px -60px #63bbc5}@keyframes fire{0%{background-position:50% 0,50% 0,50% 100%,50%}to{background-position:50% -500px,50% -650px,50% 100%,50%}}.creeping-drawer-fire{pointer-events:none;z-index:9999;border-radius:26px;animation:4.5s cubic-bezier(.25,1,.5,1) forwards creepInward;position:absolute;inset:0;overflow:hidden;box-shadow:0 0 60px #ff8951f2,inset 0 0 50px #dcbc16d9}.creeping-drawer-fire:before{content:"";background-image:var(--glitter), var(--glitter), linear-gradient(0deg, white 0px, #ff8951 5px, #dcbc169c 30%, transparent 70%), radial-gradient(ellipse at center, transparent 35%, black 75%);background-blend-mode:hard-light, color-dodge, multiply;mix-blend-mode:color-dodge;filter:brightness(3.7)blur(7px)contrast(6);background-position:50% 0,50% 0,50% 100%,50%;background-repeat:repeat,repeat,repeat,no-repeat;background-size:350px 500px,400px 650px,100% 100%,100% 100%;animation:1.75s linear infinite fire;position:absolute;inset:0}@keyframes creepInward{0%{opacity:.2;transform:scale(.98)}to{opacity:1;transform:scale(1.02)}}.content{pointer-events:none;z-index:99999;width:100vw;height:100vh;margin:0;position:fixed;inset:0;overflow:hidden}.burn{will-change:width, height, top, right, opacity;background-color:#050507;border:8px solid #fffb5c;border-radius:50%;width:0;height:0;animation:18s linear forwards burn-grow;position:absolute;top:50%;right:50%;transform:translateZ(0);box-shadow:inset 0 0 14px 6px #fffb5c,inset 0 0 25px 12px #f36c00d9,0 0 18px 8px #fffb5c,0 0 35px 22px #f17c04e6,0 0 24px 30px #1c0901eb,inset 0 0 50px 35px #c4720f77}@keyframes burn-grow{0%{opacity:1;border:8px solid #fffb5c;width:0;height:0;top:50%;right:50%;box-shadow:inset 0 0 14px 6px #fffb5c,inset 0 0 25px 12px #f36c00d9,0 0 18px 8px #fffb5c,0 0 35px 22px #f17c04e6,0 0 24px 30px #1c0901eb,inset 0 0 50px 35px #c4720f77}90%{opacity:1;border:8px solid #fffb5c;width:3200px;height:3200px;top:calc(50% - 1600px);right:calc(50% - 1600px);box-shadow:inset 0 0 14px 6px #fffb5c,inset 0 0 25px 12px #f36c00d9,0 0 18px 8px #fffb5c,0 0 35px 22px #f17c04e6,0 0 24px 30px #1c0901eb,inset 0 0 50px 35px #c4720f77}to{opacity:1;border:8px solid #fffb5c;width:3600px;height:3600px;top:calc(50% - 1800px);right:calc(50% - 1800px)}}.burn .flame{will-change:transform, opacity;background-color:#fffc98;border-radius:50% 0;width:24px;height:24px;position:absolute;box-shadow:0 0 8px 4px #fffb5c}.burn .flame:first-of-type{animation:18s linear infinite flame-pulse-1;top:50%;left:0%}.burn .flame:nth-of-type(2){animation:18s linear infinite flame-pulse-2;top:25%;left:4.3%}.burn .flame:nth-of-type(3){animation:18s linear infinite flame-pulse-1;top:12%;left:8.6%}.burn .flame:nth-of-type(4){animation:18s linear infinite flame-pulse-2;top:3%;left:14%}.burn .flame:nth-of-type(5){animation:18s linear infinite flame-pulse-1;top:-2%;left:25%}.burn .flame:nth-of-type(6){animation:18s linear infinite flame-pulse-2;top:-3%;left:36%}.burn .flame:nth-of-type(7){animation:18s linear infinite flame-pulse-1;top:-4%;left:50%}.burn .flame:nth-of-type(8){animation:18s linear infinite flame-pulse-2;top:-3%;left:64%}.burn .flame:nth-of-type(9){animation:18s linear infinite flame-pulse-1;top:-2%;left:75%}.burn .flame:nth-of-type(10){animation:18s linear infinite flame-pulse-2;top:3%;left:86%}.burn .flame:nth-of-type(11){animation:18s linear infinite flame-pulse-1;top:12%;left:93%}.burn .flame:nth-of-type(12){animation:18s linear infinite flame-pulse-2;top:25%;left:97%}.burn .flame:nth-of-type(13){animation:18s linear infinite flame-pulse-1;top:50%;left:100%}.burn .flame:nth-of-type(14){animation:18s linear infinite flame-pulse-2;top:75%;left:97%}.burn .flame:nth-of-type(15){animation:18s linear infinite flame-pulse-1;top:88%;left:93%}.burn .flame:nth-of-type(16){animation:18s linear infinite flame-pulse-2;top:97%;left:86%}.burn .flame:nth-of-type(17){animation:18s linear infinite flame-pulse-1;top:102%;left:75%}.burn .flame:nth-of-type(18){animation:18s linear infinite flame-pulse-2;top:103%;left:64%}.burn .flame:nth-of-type(19){animation:18s linear infinite flame-pulse-1;top:104%;left:50%}.burn .flame:nth-of-type(20){animation:18s linear infinite flame-pulse-2;top:103%;left:36%}.burn .flame:nth-of-type(21){animation:18s linear infinite flame-pulse-1;top:102%;left:25%}.burn .flame:nth-of-type(22){animation:18s linear infinite flame-pulse-2;top:97%;left:14%}.burn .flame:nth-of-type(23){animation:18s linear infinite flame-pulse-1;top:88%;left:8.6%}.burn .flame:nth-of-type(24){animation:18s linear infinite flame-pulse-2;top:75%;left:4.3%}@keyframes flame-pulse-1{0%{opacity:.95;transform:scale(1)rotate(-15deg)}25%{opacity:1;transform:scale(1.35)rotate(25deg)}50%{opacity:.85;transform:scale(.85)rotate(-35deg)}75%{opacity:1;transform:scale(1.4)rotate(15deg)}to{opacity:.95;transform:scale(1)rotate(-15deg)}}@keyframes flame-pulse-2{0%{opacity:1;transform:scale(1.2)rotate(30deg)}25%{opacity:.85;transform:scale(.8)rotate(-20deg)}50%{opacity:1;transform:scale(1.4)rotate(40deg)}75%{opacity:.9;transform:scale(.9)rotate(-10deg)}to{opacity:1;transform:scale(1.2)rotate(30deg)}}.highlight{will-change:width, height, top, right, opacity;pointer-events:none;border-radius:50%;animation:18s linear forwards grow-highlight;position:absolute;top:50%;right:50%;transform:translateZ(0);box-shadow:inset 0 0 90px 70px #dcaa71,0 0 60px 40px #dcaa7199}@keyframes grow-highlight{0%{width:0;height:0;top:50%;right:50%;box-shadow:inset 0 0 40px 30px #dcaa71,0 0 30px 20px #dcaa7199}90%{width:3200px;height:3200px;top:calc(50% - 1600px);right:calc(50% - 1600px);box-shadow:inset 0 0 140px 100px #dcaa71,0 0 80px 60px #dcaa71b3}to{width:3600px;height:3600px;top:calc(50% - 1800px);right:calc(50% - 1800px);box-shadow:inset 0 0 160px 120px #dcaa71,0 0 90px 70px #dcaa71cc}}.melancholy-mode{filter:grayscale()contrast(108%)brightness(92%);transition:filter 1.5s ease-in-out;background:radial-gradient(circle,#1b2620 0%,#0d1310 50%,#040504 100%)!important}:root{--envelope-x:280px;--envelope-y:180px;--envelope-bg:#e6d3ba;--envelope-shadow:#b38f68;--letter-x:260px;--letter-y:170px;--letter-bg:#faf3e0;--letter-shadow:#d1b894;--letter-text:#180d07;--letter-font:"Dancing Script", "Cardo", Georgia, serif;--letter-button-text:#991b1b;--heart-bg:#991b1b;--heart-text:#fff}@media (width>=650px){:root{--envelope-x:320px;--envelope-y:210px;--letter-x:300px;--letter-y:200px}}.cssletter{-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;width:auto;height:auto;margin:0;display:flex;position:relative}.envelope{width:var(--envelope-x);height:var(--envelope-y);background:var(--envelope-bg);box-shadow:inset 0 0 30px -5px var(--envelope-shadow), 0 0 45px 5px #ffdca073;cursor:pointer;border-radius:8px;transition:transform .3s,box-shadow .3s;position:relative}.envelope:hover{box-shadow:inset 0 0 30px -5px var(--envelope-shadow), 0 0 55px 10px #ffdca099;transform:scale(1.03)rotate(-2deg)}.envelope:before{content:"˚ʚ❤︎ɞ˚";color:#fff;mix-blend-mode:soft-light;font-size:2.2rem;position:absolute;top:35%;left:50%;transform:translate(-50%,-50%)}.envelope-flap{z-index:3;transform-origin:top;pointer-events:all;width:100%;height:71%;transition:all .6s linear;position:absolute;top:0;overflow:hidden}.envelope-folds{z-index:2;width:100%;height:100%;position:absolute;inset:0;overflow:hidden}.envelope-flap:before,.envelope-left:before,.envelope-right:before,.envelope-bottom:before{content:"";background:var(--envelope-bg);box-shadow:0 0 30px -5px var(--envelope-shadow);aspect-ratio:1;width:100%;display:block;position:absolute;top:60%;transform:rotate(45deg)}.envelope-flap:before{border-radius:3rem;top:auto;bottom:30px}@media (width>=650px){.envelope-flap:before{bottom:50px}}.envelope-left:before{top:10%;left:-65%}.envelope-right:before{top:10%;right:-65%}.envelope-bottom:before{border-radius:3rem;top:60%}.heart{z-index:4;box-shadow:none;aspect-ratio:1;background:radial-gradient(circle at 60% 65%, var(--heart-bg) 64%, #0000 65%) top left/50% 50%, radial-gradient(circle at 40% 65%, var(--heart-bg) 64%, #0000 65%) top right/50% 50%, conic-gradient(from -45deg at 50% 85.5%, var(--heart-bg) 90deg, #0000 0) bottom/100% 50%;cursor:pointer;background-repeat:no-repeat;border:none;justify-content:center;align-items:center;width:54px;display:flex;position:relative;top:68%;left:50%;transform:translate(-50%,-50%)}@media (width>=650px){.heart{width:78px}}.heart:before{content:"";aspect-ratio:1;background:radial-gradient(circle at 60% 65%, #ffffff26 64%, #0000 65%) top left/50% 50%, radial-gradient(circle at 40% 65%, #ffffff26 64%, #0000 65%) top right/50% 50%, conic-gradient(from -45deg at 50% 85.5%, #ffffff26 90deg, #0000 0) bottom/100% 50%;z-index:-1;background-repeat:no-repeat;width:54px;transition:all .3s;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}@media (width>=650px){.heart:before{width:78px}}.heart:hover,.heart:active,.heart:focus{color:var(--heart-text);background-color:#0000;transform:translate(-50%,-50%)scale(1.08)}.heart:hover:before,.heart:active:before,.heart:focus:before{transform:translate(-50%,-50%)scale(.85)}.heart-text{color:var(--heart-text);font-size:.95rem;font-family:var(--letter-font);font-weight:700;display:block;transform:translateY(-4px)}.envelope.active *{pointer-events:none}.envelope.active .envelope-flap{perspective:10px;transform:rotateX(-180deg)translateY(0)}.envelope.active .envelope-flap:before{box-shadow:inset 0 0 30px -5px var(--envelope-shadow)}.envelope.active .heart{display:none}