@import"https://fonts.googleapis.com/css2?family=Nunito:wght@500;700;800;900&display=swap";:global(html),:global(body){margin:0;padding:0;font-family:Nunito,sans-serif}h1,h2,h3,p,span,a,button,input,textarea{font-family:Nunito,sans-serif}.polka-bg-global{position:fixed;inset:0;background:#fdf2f8;background-image:radial-gradient(#fbcfe8 2px,transparent 2px),radial-gradient(#fbcfe8 2px,transparent 2px);background-size:60px 60px;background-position:0 0,30px 30px;z-index:-1}.animate-on-scroll{opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);will-change:opacity,transform}.animate-on-scroll.is-visible{opacity:1;transform:translateY(0)}.delay-100{transition-delay:.1s}.delay-200{transition-delay:.2s}.delay-300{transition-delay:.3s}.glass-panel{background:#ffffffb3;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:5px solid rgba(255,255,255,.9);border-radius:36px;box-shadow:0 20px 40px #a8a29e26}.kawaii-btn{display:inline-block;text-align:center;background:#fff;color:#57534e;border:3px solid #fff;border-radius:999px;padding:.8rem 1.6rem;font-weight:800;font-size:1.05rem;text-decoration:none;box-shadow:0 6px 15px #a8a29e33;transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer;box-sizing:border-box}.kawaii-btn:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 10px 20px #a8a29e4d;background:#fafaf9}.kawaii-btn:disabled{opacity:.6;transform:none!important;cursor:not-allowed}.primary-btn{background:#fdf2f8!important;color:#db2777!important}.primary-btn:hover{background:#fce7f3!important}.highlight-btn{background:#f1f5f9;color:#334155}.highlight-btn:hover{background:#e2e8f0}.mini-btn{padding:.5rem 1rem;font-size:.95rem;border-width:2px}.text-center{text-align:center}.highlight-pink{color:#db2777;font-weight:900}.guestbook-page{display:grid;gap:2rem;max-width:900px;margin:0 auto;padding:3rem 1.5rem}.hero{padding:2.5rem;text-align:center;position:relative}@media(max-width:768px){.hero{padding-top:5rem}}.header-back{position:absolute;top:2rem;left:2rem}.hero-kicker{margin:0;font-size:1.1rem;font-weight:800;color:#a8a29e;letter-spacing:.1em}.hero h1{margin:.5rem 0 0;font-size:clamp(2.2rem,5vw,3rem);font-weight:900;color:#44403c}.hero-subtitle{margin:.8rem 0 0;color:#78716c;font-size:1.1rem;font-weight:700}.composer-card{padding:2rem}.composer-head{display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap;margin-bottom:1.2rem}.composer-title{margin:0;font-weight:800;font-size:1.3rem;color:#44403c}.nickname-display{margin:0;color:#57534e;font-size:.95rem;font-weight:700;display:flex;align-items:center;gap:.5rem}.message-form textarea{width:100%;resize:vertical;min-height:120px;border:3px solid #fce7f3;border-radius:20px;padding:1.2rem;font:inherit;background:#fffc;color:#44403c;font-weight:700;transition:border-color .3s,box-shadow .3s;box-sizing:border-box}.message-form textarea:focus-visible{outline:none;border-color:#fbcfe8;box-shadow:0 0 20px #fbcfe866;background:#fff}.form-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1rem}.form-state{margin:0;color:#94a3b8;font-size:.95rem;font-weight:800}.list-section{padding:2rem 0;background:transparent;position:relative}.list-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem;padding:0 1rem;position:relative;z-index:2}.title-group{display:flex;flex-direction:column;gap:.2rem}.sort-controls{display:flex;gap:.6rem;flex-wrap:wrap}.sort-controls .kawaii-btn{font-size:.9rem;padding:.4rem .8rem;border-color:transparent;background:#fff9}.sort-controls .kawaii-btn.active{background:#fdf2f8;border-color:#fbcfe8;color:#db2777}.dir-icon{display:inline-block;transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.sort-controls .kawaii-btn[data-order=asc] .dir-icon{transform:rotate(180deg)}.list-head h2{margin:0;font-size:1.6rem;font-weight:900;color:#44403c}.list-head p{margin:0;font-size:.95rem;font-weight:800;color:#a8a29e}.message-list{list-style:none;padding:0 1rem;margin:0;display:flex;flex-direction:column;gap:1.2rem;position:relative}.message-list:before{content:"";position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%);width:4px;background:repeating-linear-gradient(to bottom,rgba(251,207,232,.4) 0,rgba(251,207,232,.4) 10px,transparent 10px,transparent 20px);z-index:0;border-radius:4px}.message-card{display:flex;width:100%;gap:.8rem;align-items:flex-end;position:relative;z-index:1}.left-bubble{flex-direction:row;justify-content:flex-start;padding-right:12%}.right-bubble{flex-direction:row-reverse;justify-content:flex-start;padding-left:12%}@media(max-width:768px){.left-bubble{padding-right:0}.right-bubble{padding-left:0}.list-tools{width:100%}.list-tool-label{width:100%;justify-content:space-between}.message-list:before{left:2rem}.right-bubble{flex-direction:row}}.avatar-circle{width:44px;height:44px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:900;color:#fff;font-size:1rem;box-shadow:0 4px 8px #0000000f;border:2px solid #fff;z-index:2}.color-1{background:#f472b6}.color-2{background:#34d399}.color-3{background:#38bdf8}.color-4{background:#fbbf24}.bubble-box{padding:1.2rem;border-radius:28px;box-shadow:0 6px 20px #fbcfe84d;position:relative;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);border:3px solid #fff;max-width:100%;box-sizing:border-box}.bubble-box:hover{transform:translateY(-3px)}.left-bubble .bubble-box{border-bottom-left-radius:6px}.right-bubble .bubble-box{border-bottom-right-radius:6px}.pastel-1{background:#fdf2f8}.pastel-2{background:#f0fdf4}.pastel-3{background:#e0f2fe}.pastel-4{background:#fffbeb}.message-head{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;flex-wrap:wrap;border-bottom:2px dashed rgba(251,207,232,.6);padding-bottom:.6rem;margin-bottom:.8rem}.author{margin:0;font-weight:800;font-size:1rem;color:#57534e}.time{margin:0;font-size:.9rem;color:#a8a29e;font-weight:700}.content{color:#44403c;line-height:1.6;font-weight:600;font-size:.95rem;margin:0;word-break:break-word}.message-foot{margin-top:1rem;display:flex;flex-direction:column;align-items:flex-start;gap:.5rem}.right-bubble .message-foot{align-items:flex-end}@media(max-width:768px){.right-bubble .message-foot{align-items:flex-start}}.like-btn{background:#fffc;border:2px solid #fbcfe8;color:#db2777;border-radius:999px;padding:.3rem .8rem;font-size:.85rem;font-weight:800;cursor:pointer;transition:all .2s cubic-bezier(.175,.885,.32,1.275);font-family:inherit}.like-btn:hover:not(:disabled){transform:scale(1.05) translateY(-2px);box-shadow:0 5px 15px #db277733}.like-btn.liked,.like-btn:disabled{background:#fce7f3;border-color:transparent;color:#be185d;cursor:default;transform:none!important}.likers{margin:0;font-size:.85rem;font-weight:700;color:#a8a29e}.load-more-wrap{margin-top:3rem;display:flex;justify-content:center}.infinite-loading{margin:0;font-size:1rem;font-weight:800;color:#94a3b8}.hidden{display:none!important}.nickname-dialog{border:0;border-radius:36px;padding:0;max-width:480px;width:95vw;background:transparent;overflow:visible;outline:none}.nickname-dialog[open]{animation:soft-float-up .5s cubic-bezier(.175,.885,.32,1.275) forwards}.nickname-dialog::backdrop{background:#282828a6;backdrop-filter:blur(15px);animation:backdrop-fade .4s ease forwards}.nickname-form{padding:2.5rem;display:grid;gap:1.2rem}.nickname-form h2{margin:0;font-size:1.8rem;color:#44403c;font-weight:900}.nickname-form p{margin:0;color:#57534e;font-size:1rem;line-height:1.6;font-weight:700}.nickname-form input{border:3px solid #fbcfe8;border-radius:16px;padding:1rem;font:inherit;text-align:center;font-size:1.2rem;font-weight:800;transition:all .3s;box-sizing:border-box}.nickname-form input::placeholder{color:#cbd5e1;opacity:1}.nickname-form input:focus::placeholder{opacity:0}.nickname-form input:focus-visible{outline:none;border-color:#f472b6;box-shadow:0 0 15px #f472b666}.nickname-tip{font-size:.85rem!important;color:#94a3b8!important}@keyframes soft-float-up{0%{opacity:0;transform:translateY(40px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes backdrop-fade{0%{opacity:0}to{opacity:1}}
