@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@500;700;900&display=swap";:root{--color-bg-dark:#070313;--color-bg-card:#120b26bf;--color-border-glass:#7850c826;--color-strawberry:#ff6b8a;--color-choco:#6c5ce7;--color-user:#00b894;--color-text-bright:#f0e6ff;--color-text-muted:#c8aaff8c;--color-text-dim:#c8b4ff59;--font-title:"Outfit", "Inter", system-ui, sans-serif;--font-body:"Inter", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{color:var(--color-text-bright);font-family:var(--font-body);background-color:#03010a;justify-content:center;align-items:center;width:100vw;height:100dvh;display:flex;overflow:hidden}#root{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.app-viewport{background-color:var(--color-bg-dark);justify-content:center;align-items:center;width:100vw;height:100dvh;display:flex;position:relative;overflow:hidden}.bg-glow-blob{filter:blur(80px);pointer-events:none;z-index:1;opacity:.35;border-radius:50%;animation:8s ease-in-out infinite alternate pulse-glow;position:absolute}.bg-glow-strawberry{background:radial-gradient(circle, var(--color-strawberry) 0%, transparent 70%);width:320px;height:320px;animation-delay:0s;top:-10%;left:-10%}.bg-glow-choco{background:radial-gradient(circle,#3b1575 0%,#0000 70%);width:380px;height:380px;animation-delay:2s;bottom:15%;right:-10%}.bg-glow-center{background:radial-gradient(circle,#0a1d52 0%,#0000 70%);width:250px;height:250px;animation-delay:4s;top:40%;left:30%}@keyframes pulse-glow{0%{opacity:.3;transform:scale(1)translate(0)}to{opacity:.45;transform:scale(1.2)translate(15px,-15px)}}.phone-frame{-webkit-backdrop-filter:blur(20px);z-index:10;border:1px solid var(--color-border-glass);background:#080418d9;flex-direction:column;width:100%;height:100%;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden;box-shadow:0 24px 60px #000c}@media (width>=480px){.phone-frame{border:2px solid #b464ff40;border-radius:40px;width:420px;height:90vh;max-height:840px;box-shadow:0 30px 70px #000000e6,0 0 40px #6c5ce726}}.phone-header{border-bottom:1px solid var(--color-border-glass);z-index:40;background:#070313eb;justify-content:space-between;align-items:center;padding:24px 20px 16px;display:flex}.brand-section{flex-direction:column;display:flex}.app-title{font-family:var(--font-title);color:#fff;letter-spacing:1.5px;background:linear-gradient(135deg, #fff 30%, var(--color-text-muted) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:24px;font-weight:900}.app-subtitle{color:var(--color-text-muted);letter-spacing:1px;margin-top:2px;font-size:11px;font-weight:500}.btn-settings{color:#fff;cursor:pointer;background:#643ca026;border:1px solid #b464ff40;border-radius:50%;outline:none;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex}.btn-settings:hover{background:#643ca059;border-color:#b464ff80;transform:rotate(30deg)}.status-banner{border:1px solid #0000;border-radius:12px;justify-content:space-between;align-items:center;margin:12px 16px 4px;padding:10px 14px;font-size:12px;animation:.4s fadeIn;display:flex}.status-banner.no-key{color:#feca57e6;background:#feca5714;border-color:#feca5740}.status-banner.error{color:#ff6b6be6;background:#d6303114;border-color:#d6303140}.banner-link{color:#fff;cursor:pointer;background:0 0;border:none;margin-left:8px;font-size:12px;font-weight:700;text-decoration:underline}.phone-content{scroll-behavior:smooth;border-bottom:1px solid #7850c814;flex-direction:column;flex:0 0 58%;padding:16px 16px 20px;display:flex;overflow-y:auto}.phone-content::-webkit-scrollbar{width:5px}.chat-history-list::-webkit-scrollbar{width:5px}.phone-content::-webkit-scrollbar-track{background:0 0}.chat-history-list::-webkit-scrollbar-track{background:0 0}.phone-content::-webkit-scrollbar-thumb{background:#b464ff26;border-radius:10px}.chat-history-list::-webkit-scrollbar-thumb{background:#b464ff26;border-radius:10px}.phone-content::-webkit-scrollbar-thumb:hover{background:#b464ff59}.chat-history-list::-webkit-scrollbar-thumb:hover{background:#b464ff59}.chat-history-container{flex-direction:column;width:100%;display:flex}.chat-history-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.chat-history-title{color:var(--color-text-muted);letter-spacing:1.5px;text-transform:uppercase;font-size:11px;font-weight:700}.btn-clear-history{color:#ff6b6bcc;cursor:pointer;background:#ff6b6b1a;border:1px solid #ff6b6b33;border-radius:8px;align-items:center;padding:4px 8px;font-size:10px;transition:all .2s;display:flex}.btn-clear-history:hover{color:#ff6b6b;background:#ff6b6b33}.chat-history-list{flex-direction:column;gap:12px;display:flex}.chat-history-row{flex-direction:column;width:100%;animation:.3s fadeInUp;display:flex}.chat-history-row.row-user{align-items:flex-end}.chat-history-row.row-mascot{align-items:flex-start}.chat-history-label{color:var(--color-text-dim);letter-spacing:.5px;margin-bottom:4px;font-size:10px;font-weight:700}.chat-history-bubble{border:1px solid #0000;border-radius:16px;max-width:82%;padding:10px 14px;font-size:13px;line-height:1.45}.bubble-user{color:#e6fffb;background:#00b89414;border-color:#00b89433;border-top-right-radius:4px}.bubble-strawberry{color:#ffeef2;background:#ff6b8a14;border-color:#ff6b8a33;border-top-left-radius:4px}.bubble-choco{color:#f0eeff;background:#6c5ce714;border-color:#6c5ce740;border-top-left-radius:4px}.history-empty{text-align:center;color:var(--color-text-dim);border:1px dashed #7850c826;border-radius:16px;padding:40px 20px;font-size:12px;line-height:1.6}.character-fixed-overlay{z-index:30;pointer-events:none;background:0 0;position:absolute;bottom:72px;left:0;right:0}.widget-container{justify-content:center;width:100%;display:flex}.widget-frame{background:0 0;width:100%;position:relative}.characters-row{justify-content:space-around;align-items:flex-end;min-height:350px;padding:0 12px 10px;display:flex}.character-slot{pointer-events:auto;flex-direction:column;flex:1;justify-content:flex-end;align-items:center;display:flex}.name-tag{color:var(--color-text-muted);letter-spacing:2px;text-transform:uppercase;background:#07031399;border:1px solid #7850c81a;border-radius:10px;margin-top:6px;padding:2px 8px;font-size:10px;font-weight:700}.bubble-container{justify-content:flex-end;align-items:center;width:100%;min-height:64px;margin-bottom:6px;display:flex}.speech-bubble{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#140a2af0;border:1.5px solid #fff;border-radius:16px;max-width:175px;padding:12px 14px;transition:all .3s;animation:.25s cubic-bezier(.175,.885,.32,1.275) scaleIn;position:relative;box-shadow:0 4px 15px #00000080}.speech-bubble-left,.speech-bubble-right{align-self:center}.speech-bubble-text{color:var(--color-text-bright);word-break:keep-all;font-size:12px;font-weight:500;line-height:1.5}.speech-bubble-cursor{margin-left:2px;font-size:12px;font-weight:900;animation:.8s steps(2,end) infinite blink}.speech-bubble-tail{border-top:9px solid #fff;border-left:7px solid #0000;border-right:7px solid #0000;width:0;height:0;margin-left:-7px;position:absolute;bottom:-9px;left:50%}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.character-sprite-container{background:0 0;justify-content:center;align-items:flex-end;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);animation:3.5s ease-in-out infinite alternate float-character;display:flex}.character-sprite-container.strawberry{animation-delay:0s}.character-sprite-container.choco{animation-delay:.8s}@keyframes float-character{0%{transform:translateY(0)}to{transform:translateY(-8px)}}.character-sprite-container.active{animation-play-state:paused;transform:scale(1.08)}.character-sprite-container.pressed{transform:scale(.95)!important}.character-sprite{object-fit:contain;pointer-events:none;image-rendering:-webkit-optimize-contrast}.strawberry-img{width:175px;height:auto}.choco-img{width:95px;height:auto}.loading-progress-bar{background:linear-gradient(90deg, var(--color-strawberry) 0%, var(--color-choco) 50%, var(--color-strawberry) 100%);border-radius:10px;height:3px;margin:0 40px;animation:1.2s ease-in-out infinite alternate loading-pulse}@keyframes loading-pulse{0%{opacity:.3;transform:scaleX(.9)}to{opacity:.95;transform:scaleX(1)}}.phone-footer{border-top:1px solid var(--color-border-glass);z-index:40;background:#070313f2;gap:10px;margin-top:auto;padding:12px 16px 20px;display:flex}.input-container-flex{flex:1;position:relative}.input-message{border:1px solid var(--color-border-glass);color:#fff;width:100%;font-family:var(--font-body);background:#120b2699;border-radius:20px;outline:none;padding:11px 16px;font-size:13px;transition:all .25s}.input-message:focus{background:#120b26e6;border-color:#b464ff73;box-shadow:0 0 10px #b464ff1a}.input-message::placeholder{color:#b496ff73}.btn-send{background:linear-gradient(135deg, var(--color-choco) 0%, #4f3cc4 100%);color:#fff;cursor:pointer;border:none;border-radius:20px;outline:none;justify-content:center;align-items:center;padding:0 18px;font-size:13px;font-weight:600;transition:all .2s;display:flex}.btn-send:hover:not(:disabled){opacity:.95;transform:translateY(-1px);box-shadow:0 4px 12px #6c5ce740}.btn-send:active:not(:disabled){transform:translateY(1px)}.btn-send:disabled{color:var(--color-text-dim);cursor:not-allowed;background:#3c326466}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:100;background:#05020fd9;justify-content:center;align-items:flex-end;animation:.25s fadeIn;display:flex;position:absolute;inset:0}@media (width>=480px){.modal-overlay{border-radius:40px;align-items:center}}.modal-card{background:#0f0820f2;border-top:2px solid #b464ff33;border-top-left-radius:24px;border-top-right-radius:24px;width:100%;max-height:80%;padding:24px 20px;animation:.3s cubic-bezier(.16,1,.3,1) slideUp;overflow-y:auto;box-shadow:0 -10px 40px #000c}@media (width>=480px){.modal-card{border:1px solid #b464ff33;border-radius:24px;width:90%;max-width:380px;margin:auto}}.modal-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.modal-title{font-family:var(--font-title);color:#fff;align-items:center;font-size:18px;font-weight:700;display:flex}.modal-close-btn{color:var(--color-text-muted);cursor:pointer;background:#ffffff0d;border:none;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;transition:all .2s;display:flex}.modal-close-btn:hover{color:#fff;background:#ffffff26}.modal-form{flex-direction:column;gap:20px;display:flex}.form-section{flex-direction:column;gap:8px;display:flex}.form-section.divider{border-top:1px solid #7850c826;padding-top:16px}.form-label{color:#fff;align-items:center;font-size:13px;font-weight:600;display:flex}.form-label.label-subtitle{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:11px}.input-with-icon{align-items:center;width:100%;display:flex;position:relative}.input-text{border:1px solid var(--color-border-glass);color:#fff;width:100%;font-size:16px;font-family:var(--font-body);background:#120b26cc;border-radius:12px;outline:none;padding:12px 40px 12px 12px;transition:border .2s}.input-text:focus{border-color:var(--color-choco)}.btn-toggle-visibility{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;align-items:center;display:flex;position:absolute;right:12px}.btn-toggle-visibility:hover{color:#fff}.form-hint{color:var(--color-text-muted);align-items:flex-start;font-size:11px;line-height:1.5;display:flex}.interval-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.interval-chip{color:var(--color-text-muted);cursor:pointer;background:#7850c81a;border:1px solid #7850c833;border-radius:10px;padding:10px 4px;font-size:12px;font-weight:500;transition:all .2s}.interval-chip:hover{color:#fff;background:#7850c840}.interval-chip.active{background:var(--color-choco);color:#fff;border-color:#b464ff80;box-shadow:0 0 10px #6c5ce74d}.interval-chip.chip-off.active{color:#ff8fa3;background:#ff6b6b40;border-color:#ff6b6b80;box-shadow:0 0 10px #ff6b6b26}.test-buttons-row{gap:10px;display:flex}.btn-secondary{color:var(--color-text-bright);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;outline:none;justify-content:center;align-items:center;padding:10px 12px;font-size:12px;font-weight:500;transition:all .2s;display:flex}.btn-secondary:hover{background:#ffffff1f;border-color:#fff3}.btn-primary{background:linear-gradient(135deg, var(--color-choco) 0%, #4f3cc4 100%);color:#fff;cursor:pointer;border:none;border-radius:12px;outline:none;padding:12px;font-size:13px;font-weight:600;transition:all .2s}.btn-primary:hover{opacity:.95;box-shadow:0 4px 15px #6c5ce759}.modal-actions{gap:10px;margin-top:10px;display:flex}.flex-1{flex:1}.icon-gold{color:#feca57}.icon-purple{color:#a29bfe}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}