@import "https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600&family=Lora:ital,wght@0,400;0,500;0,600;1,400&display=swap";:root{--bg-color:#fcfbf9;--text-main:#3d352b;--text-muted:#6b6356;--accent-gold:#b38b4d;--accent-gold-hover:#c99e5e;--border-color:#b38b4d4d;--border-strong:#b38b4d99;--glass-bg:#ffffffd9;--glass-blur:blur(20px);--font-serif:"Lora", serif;--font-sans:"Be Vietnam Pro", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);font-family:var(--font-sans);background-image:url(/bg-bright.jpg);background-position:50%;background-size:cover;background-attachment:fixed;justify-content:center;align-items:center;min-height:100vh;line-height:1.6;display:flex}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#fff3 0%,#fff9 100%);position:absolute;inset:0}#root{z-index:1;justify-content:center;align-items:center;width:100%;height:100vh;display:flex}.app-container{background:var(--glass-bg);width:100%;max-width:900px;height:90vh;max-height:850px;-webkit-backdrop-filter:var(--glass-blur);border:1px solid #fff9;border-radius:20px;flex-direction:column;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 50px #0000001a,inset 0 1px 1px #fffc}.app-container:after{content:"";background:linear-gradient(90deg,#0000,#fffc,#0000);height:1px;position:absolute;top:0;left:10%;right:10%}header{text-align:center;background:linear-gradient(#fffc,#fff6);border-bottom:1px solid #b38b4d26;padding:30px 24px}header h1{font-family:var(--font-serif);color:var(--accent-gold);text-shadow:0 2px 4px #fffc;margin-bottom:8px;font-size:2.2rem;font-weight:600}header p{color:var(--text-muted);letter-spacing:1.5px;text-transform:uppercase;font-size:.95rem;font-weight:400}.chat-container{scroll-behavior:smooth;flex-direction:column;flex:1;gap:24px;padding:30px;display:flex;overflow-y:auto}.chat-container::-webkit-scrollbar{width:8px}.chat-container::-webkit-scrollbar-track{background:#00000008;border-radius:4px}.chat-container::-webkit-scrollbar-thumb{background:#b38b4d33;border-radius:4px}.chat-container::-webkit-scrollbar-thumb:hover{background:#b38b4d66}.message{flex-direction:column;max-width:85%;animation:.5s cubic-bezier(.16,1,.3,1) forwards slideUp;display:flex}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.message.user{align-self:flex-end}.message.ai{align-self:flex-start}.message-sender{color:var(--text-muted);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:8px;font-size:.8rem;font-weight:600}.message.user .message-sender{text-align:right;color:#3d352b80}.message.ai .message-sender{color:var(--accent-gold)}.message-bubble{white-space:pre-wrap;border-radius:16px;padding:18px 24px;font-size:1.05rem;line-height:1.7;position:relative;box-shadow:0 4px 15px #0000000a}.message.user .message-bubble{color:var(--text-main);background:#ffffffe6;border:1px solid #0000000d;border-bottom-right-radius:4px}.message.ai .message-bubble{border:1px solid var(--border-color);color:var(--text-main);font-family:var(--font-serif);background:linear-gradient(135deg,#fbf8f1e6,#fffc);border-bottom-left-radius:4px;font-size:1.1rem}.tts-btn{color:var(--accent-gold);cursor:pointer;font-family:var(--font-sans);opacity:.7;background:0 0;border:none;border-radius:12px;align-items:center;gap:6px;margin-top:8px;padding:4px 8px;font-size:.85rem;transition:opacity .2s;display:flex}.tts-btn:hover{opacity:1;background:#b38b4d1a}.tts-btn.playing{color:#ff8c42;animation:2s infinite pulse-tts}@keyframes pulse-tts{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.input-container{background:#ffffff80;border-top:1px solid #0000000d;align-items:center;gap:16px;padding:24px 30px;display:flex}.text-input{color:var(--text-main);font-family:var(--font-sans);background:#fffc;border:1px solid #0000001a;border-radius:30px;outline:none;flex:1;padding:18px 24px;font-size:1rem;transition:all .3s;box-shadow:inset 0 2px 4px #00000005}.text-input:focus{border-color:var(--border-strong);background:#fff;box-shadow:0 0 15px #b38b4d1a,inset 0 2px 4px #00000005}.text-input::placeholder{color:#3d352b66;font-weight:400}.btn{cursor:pointer;width:56px;height:56px;color:var(--accent-gold);background:#b38b4d1a;border:1px solid #b38b4d4d;border-radius:50%;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:flex}.btn:hover:not(:disabled){border-color:var(--accent-gold);background:#b38b4d33;transform:translateY(-2px)scale(1.05);box-shadow:0 10px 20px #b38b4d26}.btn:active:not(:disabled){transform:translateY(1px)scale(.95)}.btn.recording{color:#e63946;background:#e639461a;border-color:#e6394680;animation:2s cubic-bezier(.66,0,0,1) infinite pulse-recording}@keyframes pulse-recording{0%{box-shadow:0 0 #e6394666}70%{box-shadow:0 0 0 15px #e6394600}to{box-shadow:0 0 #e6394600}}.btn:disabled{opacity:.4;cursor:not-allowed;filter:grayscale()}.typing-indicator{align-items:center;gap:6px;padding:10px 5px;display:flex}.typing-dot{background-color:var(--accent-gold);opacity:.4;border-radius:50%;width:8px;height:8px;animation:1.4s ease-in-out infinite both typing}.typing-dot:first-child{animation-delay:-.32s}.typing-dot:nth-child(2){animation-delay:-.16s}.typing-dot:nth-child(3){animation-delay:0s}@keyframes typing{0%,80%,to{opacity:.3;transform:scale(0)}40%{opacity:1;transform:scale(1);box-shadow:0 0 10px #b38b4d80}}@media (width<=768px){.app-container{border:none;border-radius:0;height:100vh;max-height:100vh}.message{max-width:95%}}