*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{color:#fff;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background:#0a0519;min-height:100vh;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,Hiragino Sans,Yu Gothic UI,sans-serif;overflow-x:hidden}button{font-family:inherit}::selection{color:#fff;background:#ff4dd273}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:linear-gradient(#ff4dd2,#3bdcff);border-radius:10px}.bg{z-index:-1;background:radial-gradient(at 0 0,#1a0b3d 0%,#0000 55%),radial-gradient(at 100% 100%,#0b2a4a 0%,#0000 55%),linear-gradient(135deg,#0a0519 0%,#120a2e 50%,#051a2e 100%);position:fixed;inset:0;overflow:hidden}.blob{filter:blur(90px);opacity:.75;mix-blend-mode:screen;will-change:transform;border-radius:50%;position:absolute}.blob-1{background:radial-gradient(circle,#ff4dd2 0%,#0000 70%);width:520px;height:520px;animation:14s ease-in-out infinite float1;top:-140px;left:-120px}.blob-2{background:radial-gradient(circle,#3bdcff 0%,#0000 70%);width:600px;height:600px;animation:18s ease-in-out infinite float2;bottom:-180px;right:-140px}.blob-3{background:radial-gradient(circle,#ffd93b 0%,#0000 70%);width:420px;height:420px;animation:22s ease-in-out infinite float3;top:35%;left:45%}@keyframes float1{0%,to{transform:translate(0)scale(1)}50%{transform:translate(120px,80px)scale(1.2)}}@keyframes float2{0%,to{transform:translate(0)scale(1)}50%{transform:translate(-140px,-100px)scale(1.15)}}@keyframes float3{0%,to{transform:translate(-50%,-50%)scale(1)}50%{transform:translate(-30%,-70%)scale(1.25)}}.grid{background-image:linear-gradient(#ffffff0a 1px,#0000 1px),linear-gradient(90deg,#ffffff0a 1px,#0000 1px);background-size:48px 48px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000 40%,#0000 80%);mask-image:radial-gradient(#000 40%,#0000 80%)}.app-header{text-align:center;padding:48px 16px 24px}.app-title{letter-spacing:.02em;background:linear-gradient(90deg,#ff4dd2,#9b5cff,#3bdcff,#ffd93b,#ff4dd2) 0 0/300% 100%;color:#0000;filter:drop-shadow(0 0 24px #ff4dd259);-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(2.4rem,6vw,4rem);font-weight:800;animation:8s linear infinite hue}@keyframes hue{to{background-position:300% 0}}.sparkle{filter:drop-shadow(0 0 10px #fff7);margin:0 .4em;animation:2.4s ease-in-out infinite twinkle;display:inline-block}.sparkle:last-child{animation-delay:1.2s}@keyframes twinkle{0%,to{opacity:.9;transform:scale(1)rotate(0)}50%{opacity:1;transform:scale(1.3)rotate(20deg)}}.app-subtitle{color:#ffffffb3;margin:10px 0 20px;font-size:1rem}.count-pill{-webkit-backdrop-filter:blur(14px);background:#ffffff14;border:1px solid #fff3;border-radius:999px;align-items:baseline;gap:8px;padding:8px 20px;display:inline-flex;box-shadow:0 8px 30px #9b5cff40}.count-num{background:linear-gradient(90deg,#ff4dd2,#3bdcff);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:1.4rem;font-weight:800}.count-label{color:#ffffffbf;text-transform:uppercase;letter-spacing:.15em;font-size:.85rem}.memo-form{border-radius:24px;flex-direction:column;gap:14px;padding:24px;transition:transform .3s,box-shadow .3s,border-color .3s;display:flex;position:relative}.memo-form.is-focused{transform:scale(1.15);box-shadow:0 30px 80px #ff4dd259,0 0 0 2px #ff4dd299,inset 0 0 40px #3bdcff26;border-color:#ff4dd2b3!important}.memo-input,.memo-textarea{box-sizing:border-box;color:#fff;width:100%;font:inherit;background:#ffffff0f;border:1px solid #ffffff2e;border-radius:14px;outline:none;padding:14px 16px;transition:border-color .25s,background .25s,box-shadow .25s}.memo-input::placeholder,.memo-textarea::placeholder{color:#ffffff73}.memo-input:focus,.memo-textarea:focus{background:#ffffff1a;border-color:#3bdcff;box-shadow:0 0 0 3px #3bdcff40}.memo-textarea{resize:vertical;min-height:84px;font-family:inherit}.form-footer{justify-content:space-between;align-items:center;gap:12px;display:flex}.char-count{color:#ffffff8c;letter-spacing:.05em;font-size:.85rem}.add-btn{color:#fff;letter-spacing:.05em;cursor:pointer;background:linear-gradient(135deg,#ff4dd2,#9b5cff 45%,#3bdcff) 0 0/200% 200%;border:none;border-radius:999px;padding:12px 28px;font-weight:700;transition:transform .15s,box-shadow .3s,filter .3s;position:relative;overflow:hidden;box-shadow:0 10px 30px #9b5cff73}.add-btn:hover:not(:disabled){filter:saturate(1.15)brightness(1.05);background-position:100% 100%;transform:translateY(-2px);box-shadow:0 18px 50px #ff4dd28c}.add-btn:active:not(:disabled){transform:scale(.96)}.add-btn:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.4)}.btn-glow{border-radius:inherit;opacity:.6;pointer-events:none;background:linear-gradient(135deg,#fff7,#0000 40%);position:absolute;inset:-2px}.btn-text{position:relative}.burst{border-radius:inherit;pointer-events:none;background:radial-gradient(circle,#ffffff8c,#0000 60%);animation:.7s ease-out forwards burst;position:absolute;inset:0}@keyframes burst{0%{opacity:.9;transform:scale(.6)}to{opacity:0;transform:scale(1.4)}}.memo-form.is-burst{animation:.45s shake}@keyframes shake{0%,to{transform:scale(1.15)}25%{transform:scale(1.18)rotate(-.6deg)}75%{transform:scale(1.17)rotate(.6deg)}}.memo-item{border-radius:20px;flex-direction:column;gap:10px;padding:20px 20px 16px;transition:transform .35s,box-shadow .35s,filter .35s;animation:.5s cubic-bezier(.34,1.56,.64,1) both popIn;display:flex;position:relative;overflow:visible}.memo-item:hover{filter:saturate(1.15);z-index:2;transform:translateY(-24px)scale(1.05)rotate(-.4deg);box-shadow:0 50px 90px #ff4dd273,0 0 80px #3bdcff59,inset 0 0 40px #ffffff14}.memo-accent{border-radius:inherit;-webkit-mask-composite:xor;opacity:.55;pointer-events:none;background:linear-gradient(135deg,#ff4dd2,#9b5cff,#3bdcff);padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.memo-title{color:#fff;word-break:break-word;margin:0;font-size:1.15rem;font-weight:700}.memo-body{color:#fffc;white-space:pre-wrap;word-break:break-word;margin:0;line-height:1.55}.memo-foot{justify-content:space-between;align-items:center;margin-top:auto;padding-top:6px;display:flex}.memo-time{color:#ffffff8c;letter-spacing:.05em;font-size:.78rem}.delete-btn{color:#fff;cursor:pointer;background:#ff4dd226;border:1px solid #fff3;border-radius:50%;place-items:center;width:34px;height:34px;transition:transform .2s,background .2s,box-shadow .2s;display:grid}.delete-btn:hover{background:#ff4dd299;transform:rotate(90deg)scale(1.1);box-shadow:0 0 24px #ff4dd2b3}@keyframes popIn{0%{opacity:0;filter:blur(8px);transform:scale(.75)rotate(-4deg)translateY(20px)}60%{opacity:1;filter:blur();transform:scale(1.06)rotate(1.5deg)translateY(-4px)}to{opacity:1;transform:scale(1)rotate(0)translateY(0)}}.memo-item.is-leaving{pointer-events:none;z-index:10;animation:.9s cubic-bezier(.36,0,.66,-.56) forwards explodeOut}@keyframes explodeOut{0%{filter:brightness();transform:scale(1)}15%{filter:brightness(2.4)saturate(2);transform:scale(1.25)rotate(-4deg)}30%{filter:brightness(3)saturate(2);transform:scale(1.35)rotate(5deg)}45%{filter:brightness(2)blur(2px);opacity:1;transform:scale(.4)rotate(-30deg)}to{filter:blur(20px);opacity:0;transform:scale(0)rotate(540deg)}}.boom{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0;overflow:visible}.flash{mix-blend-mode:screen;background:radial-gradient(circle,#fff 0%,#ffd93b 18%,#ff4dd2 36%,#0000 60%);animation:.55s ease-out forwards flash;position:absolute;inset:-100%}@keyframes flash{0%{opacity:0;transform:scale(.2)}25%{opacity:1;transform:scale(1.2)}to{opacity:0;transform:scale(2.2)}}.shockwave{border:4px solid #fff;border-radius:50%;width:40px;height:40px;animation:.8s cubic-bezier(.2,.8,.3,1) forwards shock;position:absolute;box-shadow:0 0 40px #fff,0 0 80px #ff4dd2,inset 0 0 30px #3bdcff}.shockwave-2{border-color:#ffd93b;animation-delay:.15s;box-shadow:0 0 50px #ffd93b,0 0 100px #ff4dd2}@keyframes shock{0%{opacity:1;border-width:10px;transform:scale(.2)}to{opacity:0;border-width:1px;transform:scale(18)}}.boom-text{letter-spacing:.08em;color:#fff;text-shadow:0 0 20px #ffd93b,0 0 40px #ff4dd2,0 0 80px #3bdcff;white-space:nowrap;mix-blend-mode:screen;font-size:2.4rem;font-weight:900;animation:.9s cubic-bezier(.34,1.56,.64,1) forwards boomText;position:absolute}@keyframes boomText{0%{opacity:0;transform:scale(.3)rotate(-15deg)}30%{opacity:1;transform:scale(1.4)rotate(6deg)}60%{opacity:1;transform:scale(1.1)rotate(-3deg)}to{opacity:0;transform:scale(2)rotate(15deg)translateY(-40px)}}.particle{width:var(--s);height:var(--s);background:radial-gradient(circle, hsl(var(--hue), 100%, 75%) 0%, hsl(var(--hue), 100%, 55%) 60%, transparent 100%);box-shadow:0 0 20px hsl(var(--hue), 100%, 65%);animation:.85s cubic-bezier(.15,.7,.3,1) forwards particle;animation-delay:var(--d);mix-blend-mode:screen;border-radius:50%;position:absolute}@keyframes particle{0%{opacity:1;transform:translate(0)scale(1)rotate(0)}to{opacity:0;transform:translate(var(--x), var(--y)) scale(.2) rotate(var(--r))}}.memo-list{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;padding:8px 0 60px;display:grid}.empty{text-align:center;color:#fffc;border-radius:20px;padding:48px 20px;animation:.5s both popIn}.empty-emoji{filter:drop-shadow(0 0 16px #ffd93b80);margin-bottom:10px;font-size:3rem;animation:2.4s ease-in-out infinite twinkle}.app{flex-direction:column;gap:32px;max-width:1100px;margin:0 auto;padding:24px 24px 80px;display:flex}.glass{-webkit-backdrop-filter:blur(20px)saturate(1.4);background:#ffffff14;border:1px solid #ffffff2e;box-shadow:0 20px 60px #0a051973,inset 0 1px #ffffff26}