html,body,#root{width:100%;min-height:100%;margin:0}:root{color:#1f2937;background:#f7f8ff;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}.phone *{-webkit-user-select:none;user-select:none}.bubble,.system-bubble{-webkit-user-select:text;user-select:text}body{background:radial-gradient(1200px 700px at 20% 0,#ffe7f3 0%,#f2f6ff 45%,#eef2ff 100%);min-height:100vh;margin:0;overflow:hidden}.app-shell{place-items:center;min-height:100dvh;padding:20px;display:grid}.phone{background:#fff;border-radius:32px;grid-template-rows:1fr auto;width:min(100%,430px);height:min(92vh,860px);display:grid;position:relative;overflow:hidden;box-shadow:0 22px 60px #3b205e33,inset 0 0 0 1px #ffffffb3}.chat-header{background:linear-gradient(#fff 0%,#fcfcff 100%);border-bottom:1px solid #eef0fb;justify-content:space-between;align-items:center;gap:12px;padding:12px 12px 10px;display:flex;position:relative}.header-spacer{width:1px;height:1px}.header-actions{align-items:center;gap:8px;display:flex}.lang-btn,.clear-btn{color:#4b5563;background:#f2f3ff;border:0;border-radius:12px;padding:8px 12px;font-weight:600}.lang-btn{padding:8px 10px;font-size:1rem;line-height:1}.lang-menu{z-index:21;background:#fff;border:1px solid #e8ebfb;border-radius:12px;min-width:170px;position:absolute;top:52px;right:10px;overflow:hidden;box-shadow:0 10px 30px #0f172a1f}.lang-menu.floating{top:52px}.lang-item{text-align:left;background:#fff;border:0;width:100%;padding:9px 11px;font-size:.84rem}.lang-item.active{color:#312e81;background:#eef2ff;font-weight:700}.messages{flex-direction:column;gap:12px;min-height:0;padding:56px 14px 18px;display:flex;position:relative;overflow:auto}.floating-actions{z-index:20;gap:6px;display:flex;position:absolute;top:10px;right:10px}.lang-fab:hover,.legal-fab:hover{background:#f8fafc}.lang-fab,.legal-fab{width:36px;height:36px;box-shadow:none;color:#1f2937;cursor:pointer;background:#f2f3ff;border:0;border-radius:999px;justify-content:center;align-items:center;font-size:1rem;text-decoration:none;display:inline-flex}.empty{text-align:center;color:#6b7280;background:#f5f6ff;border:1px dashed #d5daf8;border-radius:16px;max-width:290px;margin:auto;padding:14px;line-height:1.4}.bubble-row{align-self:flex-end;justify-items:end;gap:5px;display:grid}.bubble{background:linear-gradient(135deg,#ffd5ec,#ffc4e5);border-radius:18px 18px 4px;padding:11px 14px;font-size:2rem;line-height:1;box-shadow:0 5px 16px #f18ac840}.meta{color:#7c7f8d;padding-right:2px;font-size:.73rem}.system-bubble{color:#374151;background:#eef2ff;border:1px solid #d8ddfb;border-radius:18px 18px 18px 4px;align-self:flex-start;max-width:78%;padding:10px 12px;font-size:.85rem}.system-bubble.ad{background:#fff7ed;border-color:#f8d5ac}.system-bubble.coffee{background:#dbe7ff;border-radius:18px 18px 18px 4px;max-width:fit-content;padding:11px 14px;font-size:2rem;line-height:1;box-shadow:0 5px 16px #818cf82e}.support-link,.not-now{border:0;border-radius:10px;align-items:center;margin-top:8px;padding:6px 10px;font-size:.78rem;text-decoration:none;display:inline-flex}.support-link{color:#1e3a8a;background:#dbe7ff;font-weight:700}.not-now{color:#4b5563;background:#f3f4f6}.keyboard-wrap{background:#fcfcff;border-top:1px solid #eef0fb;padding:12px 12px 14px}.control-grid{gap:8px;margin-bottom:12px;display:grid}.control-row{color:#4b5563;grid-template-columns:auto 1fr;align-items:center;gap:10px;font-size:.83rem;display:grid}.control-row select{background:#fff;border:1px solid #d9def7;border-radius:10px;padding:6px 8px}.tuning-note{color:#6b7280;font-size:.78rem}.picker-frame{border:1px solid #e7e9f8;border-radius:14px;overflow:hidden}.EmojiPickerReact{--epr-bg-color:#fcfcff;--epr-category-label-bg-color:#fcfcff;--epr-hover-bg-color:#f1f3ff;--epr-focus-bg-color:#e7ebff;--epr-search-input-bg-color:#fff;--epr-search-border-color:#d9def7;--epr-text-color:#374151;--epr-picker-border-color:transparent;border:0!important}.EmojiPickerReact,.EmojiPickerReact *{-webkit-user-drag:none}.EmojiPickerReact input{font-size:16px!important}.desktop-only{display:inline-flex}@media (width<=820px) and (pointer:coarse){html,body,#root{height:100%;overflow:hidden}body{background:#fff}.app-shell{background:#fff;min-height:100svh;padding:0}.phone{width:100vw;height:100svh;max-height:100svh;box-shadow:none;border-radius:0}.desktop-only{display:none}}
