.launch-screen{width:100%;height:100%;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1000}.start-icon{width:220px;height:220px;margin-bottom:30px;cursor:pointer;animation:pulse 2s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.launch-text{font-size:24px;color:var(--primary-purple);text-align:center;min-height:60px;opacity:0;transition:opacity .5s ease}.launch-text.visible{opacity:1}.character{position:absolute;left:-7%;top:55%;transform:translateY(-50%);height:95vh;cursor:pointer;z-index:10}.character:hover{animation:character-hover .3s ease}@keyframes character-hover{0%,to{transform:translateY(-50%) scale(1)}50%{transform:translateY(-50%) scale(1.02)}}.dialogue-bubble{position:absolute;left:33%;top:42%;background:#fff;padding:12px 20px;border-radius:22px;font-size:15px;color:var(--text-dark, #2D2D3A);opacity:0;transition:opacity .3s ease;z-index:20;pointer-events:none;box-shadow:0 2px 12px #0000001a;border:1px solid rgba(155,126,255,.3);white-space:nowrap;width:fit-content;max-width:none}.dialogue-bubble:after{content:"";position:absolute;bottom:-12px;left:15px;border-width:12px 12px 0;border-style:solid;border-color:#FFFFFF transparent transparent;filter:drop-shadow(0 1px 1px rgba(0,0,0,.05))}.dialogue-bubble:after{content:"";position:absolute;bottom:-10px;left:30px;border-width:10px 10px 0;border-style:solid;border-color:rgba(255,255,255,.9) transparent transparent}.dialogue-bubble.visible{opacity:1}.bottom-nav{position:fixed;bottom:20px;left:0;right:0;display:flex;justify-content:center;gap:12px;z-index:30;padding:0 16px;box-sizing:border-box}.nav-button{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:none;padding:10px 16px;border-radius:24px;color:var(--soft-white);font-size:14px;cursor:pointer;transition:all .3s ease;white-space:nowrap;flex:1;min-width:0;text-align:center}@media (max-width: 375px){.bottom-nav{gap:10px;padding:0 12px}}.nav-button:hover{background:#ffffff40;transform:translateY(-2px)}.nav-button:active{transform:translateY(0)}.hidden-key{position:absolute;left:76%;top:62.5%;width:30px;height:30px;opacity:.4;cursor:pointer;z-index:15;transition:opacity .3s ease;display:flex;align-items:center;justify-content:center}.hidden-key img{width:100%;height:100%;object-fit:contain;display:block}.hidden-key:hover{opacity:1}.hidden-key.blinking{animation:key-blink .5s ease 3}@keyframes key-blink{0%,to{opacity:.4}50%{opacity:1}}.home-page{position:relative;width:100%;height:100%;overflow:hidden}.home-background{position:absolute;top:0;left:0;width:100%;height:100%;background-image:url(/background/home-bg.png);background-size:cover;background-position:center}.home-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#0f0c2366}.collection-page{position:relative;width:100%;height:100vh;height:100dvh;background:url(/background/home-bg.png) center/cover no-repeat;display:flex;flex-direction:column;overflow:hidden}.collection-page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0f0c2380;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:0}.page-header{position:relative;z-index:10;display:flex;align-items:center;justify-content:center;padding:16px 20px;background:#ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0}.back-button{position:absolute;left:20px;background:none;border:none;font-size:28px;color:#fff9f0;cursor:pointer;padding:4px 8px;transition:transform .2s;z-index:2}.back-button:hover{transform:scale(1.1)}.page-title{font-family:PingFang SC,Noto Sans CJK SC,sans-serif;font-size:18px;font-weight:500;color:#fff9f0;letter-spacing:1px}.collection-content{position:relative;z-index:5;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px 16px;min-height:0}.photo-area{width:100%;max-width:560px;margin-bottom:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.photo-container{width:100%;max-width:560px;aspect-ratio:3 / 4;max-height:none;padding:10px 10px 32px;border-radius:16px;background-color:#f5f0eb;box-shadow:0 12px 40px #00000040;position:relative;overflow:visible}.photo-container img{width:100%;height:100%;object-fit:cover;border-radius:6px;display:block}.chibi-area{position:absolute;bottom:2%;right:6%;display:flex;flex-direction:column;align-items:flex-end;gap:8px;z-index:50;transform:scale(1)}.chibi-character{width:72px;height:72px;object-fit:contain;animation:chibi-float 2s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15))}.chibi-character.switching{animation:chibi-float-intense .6s ease-in-out}.chibi-dialogue{background:#fffffff2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:8px 14px;border-radius:14px;font-size:13px;color:#2d2d3a;min-width:80px!important;max-width:180px!important;text-align:center;border:1px solid rgba(155,126,255,.2);box-shadow:0 4px 12px #00000014;position:relative;line-height:1.5;word-wrap:break-word;white-space:normal}.chibi-dialogue:after{content:"";position:absolute;top:-6px;bottom:auto;left:auto;right:16px;transform:translate(-50%);border-width:0 6px 6px 6px;border-style:solid;border-color:transparent transparent rgba(255,255,255,.95) transparent}.companion-status{font-size:11px;color:#fff9f080;text-align:right;margin-top:2px;font-style:italic;letter-spacing:.5px}@keyframes chibi-float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes chibi-float-intense{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.pagination-dots{display:flex;gap:8px;margin-top:16px;padding:8px 16px;background:#ffffff14;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:20px}.pagination-dot{width:8px;height:8px;border-radius:50%;background:#ffffff4d;transition:all .3s ease;cursor:pointer}.pagination-dot.active{background:#9b7eff;transform:scale(1.2);box-shadow:0 0 8px #9b7eff80}.pagination-dot:hover{background:#ffffff80}@media (max-width: 375px){.photo-area{max-width:460px}.photo-container{max-width:460px;padding:8px 8px 24px}.chibi-area{bottom:2%;right:4%;transform:scale(.9)}.chibi-character{width:60px;height:60px}.chibi-dialogue{min-width:70px;max-width:120px;font-size:12px;padding:6px 12px}.chibi-dialogue:after{top:-5px;border-width:0 5px 5px 5px}.companion-status{font-size:10px}}@media (min-width: 376px) and (max-width: 768px){.photo-area,.photo-container{max-width:500px}.chibi-area{bottom:2%;right:5%;transform:scale(.95)}.chibi-character{width:68px;height:68px}.chibi-dialogue{max-width:130px;font-size:13px;padding:8px 14px}}@media (min-width: 769px){.photo-area,.photo-container{max-width:600px}.chibi-area{bottom:2%;right:6%;transform:scale(1.05)}.chibi-character{width:80px;height:80px}.chibi-dialogue{max-width:160px;font-size:14px;padding:10px 16px}.chibi-dialogue:after{top:-7px;border-width:0 7px 7px 7px}}.message-page{width:100%;height:100%;display:flex;flex-direction:column;background:url(/letter/message-bg.jpg) center/cover no-repeat;position:relative}.message-page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0f0c2366;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:0}.message-page .page-header,.message-page .message-content{position:relative;z-index:1}.message-content{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:40px}.message-text{font-size:24px;color:var(--soft-white);text-align:center;opacity:0;transition:opacity 1s ease;min-height:80px}.message-text.visible{opacity:1}.envelope-container{margin-top:0;opacity:0;transition:opacity 1s ease;cursor:pointer;transform:translateY(-80px)}.envelope-container.visible{opacity:1}.envelope-image{width:200px;height:auto;animation:envelope-float 3s ease-in-out infinite}@keyframes envelope-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.letter-container{position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100vh!important;height:100dvh!important;z-index:999999!important;display:none!important;align-items:center!important;justify-content:center!important;background:#000000d9!important;margin:0!important;padding:0!important;border:none!important;border-radius:0!important}.letter-container.visible{display:flex!important}.letter-content{width:100%!important;height:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;background:transparent!important;padding:0!important;margin:0!important;border:none!important;border-radius:0!important;max-width:none!important;max-height:none!important;position:relative!important}.letter-wrapper{position:fixed;top:0;left:0;width:100vw;height:100vh;background:url(/letter/letter.png) center/cover no-repeat;display:flex;align-items:center;justify-content:center;z-index:99999}.letter-text{width:100%;max-width:none;height:95vh;max-height:none;padding:50px 30px;box-sizing:border-box;border-radius:0;overflow-y:auto;font-family:Ma Shan Zheng,PingFang SC,Noto Sans CJK SC,cursive;font-size:20px;font-weight:400;color:#000;line-height:2;text-align:left;text-shadow:none;background:#fff8eb14;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);box-shadow:none;position:relative;z-index:100000;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.letter-text p{margin-bottom:14px;text-indent:2em;font-size:20px;font-weight:400;color:#000;line-height:2;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-shadow:none;font-family:Ma Shan Zheng,PingFang SC,Noto Sans CJK SC,cursive}.letter-text .letter-greeting,.letter-text .letter-highlight,.letter-text .letter-ending,.letter-text .letter-signature{font-size:20px;font-weight:400;color:#000;text-indent:2em;text-align:left;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-shadow:none;background:transparent;border:none;padding:0;margin:0 0 14px;font-family:Ma Shan Zheng,PingFang SC,Noto Sans CJK SC,cursive}.letter-text::-webkit-scrollbar{width:3px}.letter-text::-webkit-scrollbar-track{background:transparent}.letter-text::-webkit-scrollbar-thumb{background:#0000001f;border-radius:4px}.letter-text::-webkit-scrollbar-thumb:hover{background:#00000040}.letter-close{position:fixed!important;top:20px!important;right:20px!important;background:transparent!important;border:none!important;font-size:28px!important;color:#ffffff80!important;cursor:pointer!important;z-index:1000001!important;padding:4px 8px!important;transition:color .3s ease!important}.letter-close:hover{color:#fffc!important}@media (max-width: 375px){.letter-text{width:100%;padding:30px 20px;font-size:18px;height:95vh}.letter-text p,.letter-text .letter-greeting,.letter-text .letter-highlight,.letter-text .letter-ending,.letter-text .letter-signature{font-size:19px}.letter-close{font-size:22px!important;top:12px!important;right:12px!important}}.message{display:flex;gap:10px;max-width:80%;opacity:0;animation:message-appear .3s ease forwards}@keyframes message-appear{to{opacity:1}}.message.user{align-self:flex-end;flex-direction:row-reverse}.message.ai{align-self:flex-start}.message-avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0;overflow:hidden;background:var(--primary-purple, #9B7EFF);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;color:#fff9f0}.message-avatar img{width:100%;height:100%;object-fit:cover;display:block}.message.user .message-avatar{background:var(--light-purple, #D4C4FF)}.message-bubble{padding:12px 16px;border-radius:16px;font-size:15px;line-height:1.5;word-wrap:break-word;max-width:100%}.message.user .message-bubble{background:linear-gradient(135deg,#e8d9ff,#d4c4ff);color:var(--text-dark, #2D2D3A);border-bottom-right-radius:4px}.message.ai .message-bubble{background:#fff;border:2px solid var(--light-purple, #D4C4FF);color:var(--text-dark, #2D2D3A);border-bottom-left-radius:4px;box-shadow:0 2px 8px #0000000f}@media (max-width: 375px){.message{max-width:90%;gap:8px}.message-avatar{width:30px;height:30px;font-size:13px}.message-bubble{font-size:13px;padding:10px 14px}}.chat-page{width:100%;height:100%;display:flex;flex-direction:column;background:url(/chat/chat-bg.jpg) center/cover no-repeat;position:relative}.chat-page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0f0c2380;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:0}.chat-page>*{position:relative;z-index:1}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);flex-shrink:0;min-height:56px}.back-btn{flex:0 0 auto;background:none;border:none;font-size:24px;color:#fff9f0;cursor:pointer;padding:4px 8px;transition:transform .2s}.back-btn:hover{transform:scale(1.1)}.chat-title{flex:1 1 0%;text-align:center;margin:0 45px 0 50px;min-width:0;font-size:18px;font-weight:600;color:#fff9f0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-title span{display:block;width:100%;text-align:center}.remaining-badge{flex:0 0 auto;margin-left:auto;font-size:12px;padding:2px 10px;border-radius:12px;background:#ffffff1f;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:#fff9f0;border:1px solid rgba(255,255,255,.06);font-weight:400;letter-spacing:.5px;white-space:nowrap;transition:all .3s ease}.remaining-badge.blinking{animation:badge-blink .5s ease}@keyframes badge-blink{0%,to{opacity:1}50%{opacity:.5}}.chat-area{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:16px}.chat-input-area{padding:15px 20px;background:#ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;gap:10px;flex-shrink:0}.chat-input{flex:1;padding:12px 16px;border:none;border-radius:24px;background:#ffffff1a;color:var(--soft-white);font-size:16px;outline:none}.chat-input::placeholder{color:#ffffff80}.send-button{background:var(--primary-purple);border:none;padding:12px 24px;border-radius:24px;color:var(--soft-white);font-size:16px;cursor:pointer;transition:background .3s ease}.send-button:hover{background:var(--deep-purple)}.send-button:disabled{background:#9b7eff4d;cursor:not-allowed}.closed-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:none;justify-content:center;align-items:center;z-index:100}.closed-modal.visible{display:flex}.closed-content{background:#fffffff2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:40px;border-radius:24px;text-align:center;max-width:300px}.closed-content h2,.closed-content p{color:var(--text-dark);margin-bottom:20px}.closed-button{background:var(--primary-purple);border:none;padding:12px 24px;border-radius:24px;color:var(--soft-white);font-size:16px;cursor:pointer}.channel-closing{text-align:center;color:var(--primary-purple);padding:20px;font-size:18px}@media (max-width: 375px){.chat-title{margin-left:50px;font-size:16px}.remaining-badge{font-size:10px;padding:2px 8px}.chat-input{font-size:14px;padding:10px 14px}.send-button{font-size:14px;padding:10px 16px}}*{margin:0;padding:0;box-sizing:border-box}:root{--primary-purple: #9B7EFF;--deep-purple: #6B4FD0;--light-purple: #C4B5FD;--warm-beige: #F5E6D3;--gold: #FFEAA7;--soft-white: #FFF9F0;--text-dark: #2D2D3A;--glass-bg: rgba(255, 255, 255, .15);--glass-blur: blur(10px);--glass-radius: 16px}body{font-family:PingFang SC,Noto Sans CJK SC,sans-serif;background:var(--text-dark);color:var(--text-dark);overflow:hidden;width:100vw;height:100vh;position:relative}#root{width:100%;height:100%}.glass{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-radius:var(--glass-radius)}@media (max-width: 768px){body{font-size:14px}}
