:root{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;--bg: #000000;--panel: #000000;--panel-header: #000000;--bubble-in: #ffffff26;--bubble-out: #ee106033;--pink: #ea4c7d;--text: #ffffff;--text-muted: #7d8e98;--accent: #5aa6ff;--divider: rgba(255, 255, 255, .08)}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}#root{height:100%}.app{display:flex;justify-content:center;align-items:stretch;min-height:100vh;padding:0}.chat{display:flex;flex-direction:column;width:100%;max-width:780px;height:100vh;background:var(--panel);border:1px solid var(--divider);overflow:hidden}@media(min-width:700px){.app{padding:24px}.chat{height:calc(100vh - 48px);border-radius:14px;box-shadow:0 12px 40px #0006}}.chat__header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--panel-header);border-bottom:1px solid var(--divider)}.chat__avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#7b61ff);color:#fff;font-weight:600;flex-shrink:0;object-fit:cover;border:1px solid var(--divider)}.chat__heading{display:flex;flex-direction:column;min-width:0}.chat__title{margin:0;font-size:1rem;font-weight:600}.chat__subtitle{margin:0;font-size:.8rem;color:var(--text-muted)}.chat__toggle{margin-left:auto;display:inline-flex;padding:2px;border-radius:999px;background:var(--bg);border:1px solid var(--divider)}.chat__toggle-btn{border:none;background:transparent;color:var(--text-muted);font-size:.75rem;font-weight:600;padding:5px 12px;border-radius:999px;cursor:pointer;transition:background .15s ease,color .15s ease}.chat__toggle-btn:hover{color:var(--text)}.chat__toggle-btn--active{background:var(--bubble-out);color:#fff}.chat__body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:4px}.chat__day{display:flex;flex-direction:column;gap:2px}.chat__day-label{display:flex;justify-content:center;margin:12px 0}.chat__day-label span{padding:4px 12px;border-radius:999px;background:#00000040;color:var(--text-muted);font-size:.75rem}.bubble{display:flex;margin:0}.bubble--group-start{margin-top:14px}.chat__day>.bubble--group-start:first-child{margin-top:0}.bubble--in{justify-content:flex-start}.bubble--out{justify-content:flex-end}.bubble__content{max-width:75%;padding:8px 12px;border-radius:14px;position:relative;word-wrap:break-word}.bubble--in .bubble__content{background:var(--bubble-in);border-bottom-left-radius:4px}.bubble--out .bubble__content{background:var(--bubble-out);border-bottom-right-radius:4px}.bubble__reply{display:flex;flex-direction:column;gap:1px;width:100%;margin-bottom:4px;padding:4px 8px;border:none;border-left:3px solid rgba(255,255,255,.45);border-radius:4px;background:#0000002e;color:inherit;font:inherit;font-size:.8rem;text-align:left;cursor:pointer}.bubble__reply:hover{background:#0000004d}@keyframes bubble-highlight-in{0%{background:#fff6}to{background:var(--bubble-in)}}@keyframes bubble-highlight-out{0%{background:#ee106080}to{background:var(--bubble-out)}}.bubble--highlight.bubble--in .bubble__content{animation:bubble-highlight-in 1.2s ease-out}.bubble--highlight.bubble--out .bubble__content{animation:bubble-highlight-out 1.2s ease-out}.bubble__reply-author{font-weight:600;color:#ffffffd9}.bubble__reply-text{color:var(--text-muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;overflow-wrap:anywhere}.bubble__text{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.bubble__link{color:inherit;text-decoration:underline;font-weight:500}.attachments{display:flex;flex-direction:column;gap:6px}.attachments:not(:last-child){margin-bottom:6px}.attachment{display:block;border-radius:10px;overflow:hidden}.attachment__img{display:block;width:100%;max-width:260px;height:auto;border-radius:10px}.attachment--file{display:inline-block;padding:8px 12px;border-radius:10px;background:#00000040;color:var(--text);text-decoration:none;font-size:.9rem}.bubble__locked{margin:0;font-style:italic;color:var(--text-muted)}.bubble__content--deleted{background:transparent!important;border:1px dashed var(--divider)}.bubble__deleted{margin:0;font-style:italic;color:var(--text-muted)}.bubble__meta{display:flex;align-items:center;gap:6px;justify-content:flex-end;margin-top:2px;font-size:.68rem;color:#ffffff8c}.bubble__like{color:#ff5c8a;font-size:1rem;line-height:1}.composer{padding:12px 16px 8px;border-top:1px solid var(--divider);background:var(--panel-header)}.composer__row{display:flex;align-items:stretch;gap:12px}.composer__field{flex:1;display:flex;align-items:center;gap:8px;padding:4px 12px 4px 18px;border-radius:14px;background:#1c1c1e}.composer__input{flex:1;border:none;background:transparent;color:var(--text);font-size:1.05rem;padding:12px 0}.composer__input::placeholder{color:var(--text-muted)}.composer__input:focus{outline:none}.composer__icon{display:grid;place-items:center;width:34px;height:34px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:8px}.composer__icon:hover{color:var(--text)}.composer__icon svg{width:24px;height:24px}.composer__send{display:grid;place-items:center;width:68px;border:none;border-radius:14px;background:var(--pink);color:#fff;cursor:pointer}.composer__send:hover{filter:brightness(1.05)}.composer__send svg{width:26px;height:26px}.composer__counter{margin-top:6px;font-size:.8rem;color:var(--text-muted)}.gate{display:grid;place-items:center;min-height:100vh;padding:24px}.gate__card{display:flex;flex-direction:column;gap:12px;width:100%;max-width:320px;padding:28px 24px;background:var(--panel);border:1px solid var(--divider);border-radius:14px;box-shadow:0 12px 40px #0006}.gate__title{margin:0;font-size:1.25rem;font-weight:600;text-align:center}.gate__hint{margin:0 0 4px;font-size:.85rem;color:var(--text-muted);text-align:center}.gate__input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--divider);background:#1c1c1e;color:var(--text);font-size:1rem}.gate__input:focus{outline:none;border-color:var(--pink)}.gate__button{padding:12px 14px;border:none;border-radius:10px;background:var(--pink);color:#fff;font-size:1rem;font-weight:600;cursor:pointer}.gate__button:disabled{opacity:.5;cursor:default}.gate__error{margin:0;font-size:.85rem;color:#ff6b6b;text-align:center}
