*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;padding:0}body{color:#eaf6ff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#050714;min-height:100vh;font-family:Inter,Noto Sans JP,system-ui,-apple-system,Segoe UI,Roboto,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;overflow-x:hidden}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}textarea{font-family:inherit}#root{width:100%;min-height:100vh}.app-shell{z-index:1;flex-direction:column;gap:40px;max-width:1100px;margin:0 auto;padding:64px 24px 120px;display:flex;position:relative}.aurora-bg{z-index:0;background:radial-gradient(at 20% 10%,#0a1530 0%,#0000 60%),radial-gradient(at 80% 90%,#120826 0%,#0000 60%),linear-gradient(#03030d 0%,#0a0a1f 50%,#05060f 100%);position:fixed;inset:0;overflow:hidden}.aurora-layer{filter:blur(80px);mix-blend-mode:screen;opacity:.85;position:absolute;inset:-20%}.aurora-layer-1{background:radial-gradient(60% 40% at 30% 40%,#43ffb473 0%,#0000 70%);animation:22s ease-in-out infinite aurora-drift-1}.aurora-layer-2{background:radial-gradient(55% 45% at 70% 60%,#5a96ff8c 0%,#0000 70%);animation:28s ease-in-out infinite aurora-drift-2}.aurora-layer-3{background:radial-gradient(50% 40% at 50% 30%,#b478ff66 0%,#0000 70%);animation:32s ease-in-out infinite aurora-drift-3}@keyframes aurora-drift-1{0%,to{transform:translate(0)scale(1)}50%{transform:translate(8%,6%)scale(1.15)}}@keyframes aurora-drift-2{0%,to{transform:translate(0)scale(1.05)}50%{transform:translate(-10%,-5%)scale(.95)}}@keyframes aurora-drift-3{0%,to{transform:translate(0)scale(.95)}50%{transform:translate(5%,-10%)scale(1.1)}}.orb{filter:blur(40px);opacity:.65;mix-blend-mode:screen;border-radius:50%;position:absolute}.orb-1{background:radial-gradient(circle,#4effb0 0%,#0000 70%);width:320px;height:320px;animation:18s ease-in-out infinite orb-float-1;top:10%;left:5%}.orb-2{background:radial-gradient(circle,#5aa8ff 0%,#0000 70%);width:260px;height:260px;animation:24s ease-in-out infinite orb-float-2;top:60%;right:8%}.orb-3{background:radial-gradient(circle,#b478ff 0%,#0000 70%);width:220px;height:220px;animation:20s ease-in-out infinite orb-float-3;bottom:10%;left:35%}.orb-4{background:radial-gradient(circle,#6affd1 0%,#0000 70%);width:180px;height:180px;animation:26s ease-in-out infinite orb-float-4;top:30%;right:30%}@keyframes orb-float-1{0%,to{transform:translate(0)}50%{transform:translate(60px,-40px)}}@keyframes orb-float-2{0%,to{transform:translate(0)}50%{transform:translate(-70px,50px)}}@keyframes orb-float-3{0%,to{transform:translate(0)}50%{transform:translate(40px,-60px)}}@keyframes orb-float-4{0%,to{transform:translate(0)}50%{transform:translate(-50px,-30px)}}.glass{-webkit-backdrop-filter:blur(20px)saturate(180%);background:#ffffff0f;border:1px solid #ffffff24;border-radius:20px;position:relative;box-shadow:0 8px 32px #03081466,inset 0 1px #ffffff1a}.app-header{text-align:center;animation:.9s cubic-bezier(.2,.8,.2,1) both header-in}.app-title{letter-spacing:-.02em;background:linear-gradient(100deg,#6affd1 0%,#5aa8ff 35%,#b478ff 65%,#6affd1 100%) 0 0/200% 100%;color:#0000;filter:drop-shadow(0 0 28px #5aa8ff59);-webkit-background-clip:text;background-clip:text;align-items:center;gap:18px;margin:0 0 12px;font-size:clamp(40px,6vw,68px);font-weight:800;animation:6s linear infinite title-shine;display:inline-flex}.title-sparkle{color:#6affd1;text-shadow:0 0 16px #6affd1cc;-webkit-text-fill-color:#6affd1;font-size:.7em;animation:2.4s ease-in-out infinite sparkle-pulse}.title-sparkle:last-child{animation-delay:1.2s}.app-subtitle{color:#eaf6ffb3;letter-spacing:.08em;font-size:16px}@keyframes header-in{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes title-shine{0%{background-position:0%}to{background-position:200%}}@keyframes sparkle-pulse{0%,to{opacity:.7;transform:scale(1)rotate(0)}50%{opacity:1;transform:scale(1.25)rotate(180deg)}}.memo-input{align-items:flex-end;gap:16px;padding:20px;transition:border-color .4s,box-shadow .4s,transform .4s;animation:.8s cubic-bezier(.2,.8,.2,1) .1s both fade-up;display:flex;position:relative}.memo-input:focus-within{border-color:#6affd18c;transform:translateY(-2px);box-shadow:0 12px 40px #03081480,0 0 0 1px #6affd14d,0 0 40px #5aa8ff59,inset 0 1px #ffffff26}.memo-input-glow{opacity:0;z-index:-1;filter:blur(16px);background:linear-gradient(120deg,#6affd180,#5aa8ff80,#b478ff80);border-radius:22px;transition:opacity .4s;position:absolute;inset:-2px}.memo-input:focus-within .memo-input-glow{opacity:.8;animation:4s linear infinite glow-rotate}@keyframes glow-rotate{0%{filter:blur(16px)hue-rotate()}to{filter:blur(16px)hue-rotate(360deg)}}.memo-input-field{color:#eaf6ff;resize:vertical;background:#03081459;border:1px solid #ffffff1f;border-radius:12px;outline:none;flex:1;min-height:72px;padding:14px 16px;font-size:16px;line-height:1.55;transition:border-color .3s,background .3s}.memo-input-field::placeholder{color:#eaf6ff66}.memo-input-field:focus{background:#0308148c;border-color:#6affd180}.memo-add-btn{letter-spacing:.05em;color:#03030d;background:linear-gradient(120deg,#6affd1 0%,#5aa8ff 50%,#b478ff 100%) 0 0/200% 100%;border-radius:12px;padding:14px 28px;font-size:15px;font-weight:700;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background-position .6s,opacity .25s;position:relative;overflow:hidden;box-shadow:0 8px 24px #5aa8ff66}.memo-add-btn:hover:not(:disabled){background-position:100% 0;transform:translateY(-2px)scale(1.04);box-shadow:0 14px 36px #6affd18c}.memo-add-btn:active:not(:disabled){transform:translateY(0)scale(.98)}.memo-add-btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.btn-label{z-index:1;position:relative}.btn-shine{background:linear-gradient(120deg,#0000 0%,#fff9 50%,#0000 100%);width:60%;height:100%;position:absolute;top:0;left:-80%;transform:skew(-20deg)}.memo-add-btn:hover:not(:disabled) .btn-shine{animation:.9s btn-shine-slide}@keyframes btn-shine-slide{0%{left:-80%}to{left:130%}}.memo-list{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;display:grid}.memo-card{flex-direction:column;gap:14px;padding:20px;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s,opacity .3s;animation:.55s cubic-bezier(.2,.8,.2,1) both card-in;display:flex;overflow:hidden}.memo-card:hover{border-color:#6affd166;transform:translateY(-6px);box-shadow:0 22px 60px #03081499,0 0 30px #5aa8ff40,inset 0 1px #ffffff26}.memo-card.leaving{pointer-events:none;animation:.3s forwards card-out}.memo-card-shine{border-radius:inherit;pointer-events:none;background:linear-gradient(130deg,#ffffff1f 0%,#0000 40%);position:absolute;inset:0}.memo-text{color:#eaf6ff;white-space:pre-wrap;word-break:break-word;font-size:15px;line-height:1.7;position:relative}.memo-card-footer{justify-content:space-between;align-items:center;margin-top:auto;display:flex;position:relative}.memo-date{color:#eaf6ff80;letter-spacing:.04em;font-size:12px}.memo-delete-btn{color:#eaf6ff99;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:50%;width:32px;height:32px;font-size:20px;line-height:1;transition:color .25s,background .25s,transform .25s,box-shadow .25s}.memo-delete-btn:hover{color:#fff;background:#ff557840;border-color:#ff55788c;transform:rotate(90deg);box-shadow:0 0 20px #ff557873}@keyframes card-in{0%{opacity:0;filter:blur(8px);transform:translateY(16px)scale(.92)}to{opacity:1;filter:blur();transform:translateY(0)scale(1)}}@keyframes card-out{0%{opacity:1;filter:blur();transform:scale(1)rotate(0)translateY(0);box-shadow:0 8px 32px #03081466,0 0 #6affd199}15%{opacity:1;filter:blur();transform:scale(1.15)rotate(-8deg)translateY(-4px);box-shadow:0 0 60px #ffc850e6,0 0 100px #6affd1cc,0 0 140px #43ffb499,inset 0 0 40px #fff6}35%{opacity:.85;filter:blur(1px);transform:scale(.95)rotate(120deg)translateY(-12px);box-shadow:0 0 80px #6affd1b3,0 0 120px #5a96ff80,inset 0 0 30px #6affd126}60%{opacity:.5;filter:blur(4px);transform:scale(.6)rotate(360deg)translateY(-30px);box-shadow:0 0 100px #b478ff99,0 0 160px #6affd166}80%{opacity:.15;filter:blur(8px);transform:scale(.3)rotate(540deg)translateY(-60px);box-shadow:0 0 120px #43ffb44d,0 0 180px #6affd133}to{opacity:0;filter:blur(12px);transform:scale(0)rotate(720deg)translateY(-120px);box-shadow:0 0 150px #6affd11a,0 0 200px #43ffb400}}@keyframes fade-up{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.empty-state{text-align:center;color:#eaf6ffb3;padding:60px 20px;animation:.8s cubic-bezier(.2,.8,.2,1) .2s both fade-up}.empty-icon{background:linear-gradient(120deg,#6affd1,#5aa8ff,#b478ff);color:#0000;filter:drop-shadow(0 0 20px #5aa8ff80);-webkit-background-clip:text;background-clip:text;font-size:72px;animation:3.5s ease-in-out infinite float-up-down}.empty-text{color:#eaf6ff;margin-top:12px;font-size:18px;font-weight:600}.empty-sub{color:#eaf6ff80;margin-top:6px;font-size:14px}@keyframes float-up-down{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (width<=640px){.app-shell{gap:28px;padding:40px 16px 80px}.memo-input{flex-direction:column;align-items:stretch}.memo-add-btn{width:100%}}
