:root{--blue:#2a6fdb;--blue-soft:#e8f0fd;--line:#06c755;--text:#1c1e21;--muted:#6b7280;--border:#e5e7eb;--bg:#f5f6f8;--red:#c62828;--red-soft:#fdecea;--amber-soft:#fff6e0;--green-soft:#e7f6ec;--surface:#fff;--surface-2:#f3f4f6;--amber-text:#7a5300;--green-text:#1b6b35;--chat-font:16px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html[data-theme=dark]{--blue:#5b9bff;--blue-soft:#1e3352;--text:#e6e8eb;--muted:#9aa3ae;--border:#2f3540;--bg:#0f1216;--red:#ff6b6b;--red-soft:#3a1f22;--amber-soft:#3a3020;--green-soft:#1d3326;--surface:#181c22;--surface-2:#232933;--amber-text:#f3cf7a;--green-text:#8fdca9;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:dark){html[data-theme=system]{--blue:#5b9bff;--blue-soft:#1e3352;--text:#e6e8eb;--muted:#9aa3ae;--border:#2f3540;--bg:#0f1216;--red:#ff6b6b;--red-soft:#3a1f22;--amber-soft:#3a3020;--green-soft:#1d3326;--surface:#181c22;--surface-2:#232933;--amber-text:#f3cf7a;--green-text:#8fdca9;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}html[data-font="1"]{--chat-font:13px}html[data-font="2"]{--chat-font:14.5px}html[data-font="3"]{--chat-font:16px}html[data-font="4"]{--chat-font:18.5px}html[data-font="5"]{--chat-font:21px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:var(--text);background:var(--bg);font-family:IBM Plex Sans Thai,system-ui,sans-serif;font-size:16px}button,input,textarea{font:inherit}input,textarea{border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);border-radius:10px;padding:10px 12px}.muted{color:var(--muted)}.small{font-size:13px}.grow{flex:1;min-width:0}.center{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:32px 20px;display:flex}.error-text{color:var(--red);margin:4px 0}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:10px;width:100%;max-width:360px;padding:16px;display:flex}.btn{background:var(--blue);color:#fff;cursor:pointer;border:0;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:10px 16px;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.5;cursor:default}.btn-ghost{color:var(--blue);background:0 0}.btn-danger{background:var(--red)}.btn-small{padding:6px 10px;font-size:14px}.btn-block{width:100%}.btn-line{background:var(--line);padding:12px 24px;font-size:18px}.link{color:var(--blue);cursor:pointer;background:0 0;border:0;padding:0 4px;text-decoration:underline}.notices{z-index:50;pointer-events:none;flex-direction:column;gap:6px;display:flex;position:fixed;top:8px;left:8px;right:8px}.notice{pointer-events:auto;border-radius:10px;justify-content:space-between;align-items:flex-start;gap:8px;width:100%;max-width:560px;margin:0 auto;padding:10px 12px;display:flex;box-shadow:0 2px 8px #0000001f}.notice button{cursor:pointer;background:0 0;border:0;font-size:20px;line-height:1}.notice-error{background:var(--red-soft);color:var(--red)}.notice-warning{background:var(--amber-soft);color:var(--amber-text)}.notice-success{background:var(--green-soft);color:var(--green-text)}.banner{padding:8px 12px;font-size:14px}.banner-error{background:var(--red-soft);color:var(--red)}.banner-warning{background:var(--amber-soft);color:var(--amber-text)}.page{background:var(--surface);flex-direction:column;max-width:720px;min-height:100%;margin:0 auto;display:flex;position:relative}.topbar{z-index:10;padding:8px 12px;padding-top:max(8px, env(safe-area-inset-top));background:var(--surface);border-bottom:1px solid var(--border);align-items:center;gap:8px;min-height:52px;display:flex;position:sticky;top:0}.topbar-back{color:var(--blue);width:28px;font-size:30px;line-height:1;text-decoration:none}.topbar-gap{width:4px}.topbar-title{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:600;overflow:hidden}.topbar-right{gap:4px;display:flex}.topbar-room{text-align:left;color:inherit;background:0 0;border:0;flex-direction:column;max-width:100%;padding:0;font-weight:600;display:flex}.topbar-room span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.avatar{object-fit:cover;border-radius:50%;flex:none}.avatar-text{background:var(--blue-soft);color:var(--blue);justify-content:center;align-items:center;font-weight:600;display:inline-flex}.room-list,.user-list{margin:0;padding:0;list-style:none}.room-item{color:inherit;border-bottom:1px solid var(--border);gap:12px;padding:10px 14px;text-decoration:none;display:flex}.room-main{flex:1;min-width:0}.room-top,.room-bottom{justify-content:space-between;align-items:center;gap:8px;display:flex}.room-title{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.room-time{color:var(--muted);flex:none;font-size:12px}.room-preview{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:14px;overflow:hidden}.badge{background:var(--blue);color:#fff;border-radius:999px;flex:none;padding:1px 7px;font-size:12px}.fab{right:20px;bottom:calc(20px + env(safe-area-inset-bottom));background:var(--blue);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;font-size:32px;text-decoration:none;display:flex;position:fixed;box-shadow:0 4px 12px #0003}.form-block{flex-direction:column;gap:8px;padding:12px;display:flex}.user-item{border-bottom:1px solid var(--border);cursor:pointer;align-items:center;gap:10px;padding:8px 14px;display:flex}.user-item input[type=checkbox]{flex:none;width:20px;height:20px}.admin-user{cursor:default}.row-actions{flex:none;gap:6px;display:flex}.bottom-bar{background:var(--surface);padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--border);margin-top:auto;position:sticky;bottom:0}.chat-page{height:100%}.messages{background:var(--bg);flex:1;padding:10px 10px 4px;overflow-y:auto}.date-sep{text-align:center;color:var(--muted);margin:10px 0;font-size:12px}.bubble-row{margin:3px 0;display:flex}.bubble-row.mine{justify-content:flex-end}.bubble{background:var(--surface);border-radius:14px;max-width:78%;padding:7px 11px;box-shadow:0 1px 1px #0000000d}.mine .bubble{background:var(--blue-soft)}.bubble-name{color:var(--blue);font-size:12px;font-weight:600}.bubble-body{white-space:pre-wrap;word-break:break-word;font-size:var(--chat-font)}.bubble-meta{color:var(--muted);text-align:right;font-size:11px}.bubble-sending{opacity:.7}.bubble-failed{background:var(--red-soft)!important}.bubble-fail{color:var(--red);margin-top:4px;font-size:12px}.composer{border-top:1px solid var(--border);padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:var(--surface)}.composer-row{align-items:flex-end;gap:8px;display:flex}.composer textarea{resize:none;max-height:120px}.sheet-backdrop{z-index:40;background:#00000059;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:var(--surface);width:100%;max-width:720px;max-height:80vh;padding:12px 12px calc(12px + env(safe-area-inset-bottom));border-radius:16px 16px 0 0;flex-direction:column;gap:8px;display:flex;overflow-y:auto}.sheet-head{justify-content:space-between;align-items:center;padding:4px;display:flex}.login h1{margin-top:15vh}.composer-tools{gap:4px;margin-bottom:6px;display:flex}.tool{background:var(--bg);border:1px solid var(--border);cursor:pointer;border-radius:999px;padding:4px 10px;font-size:14px}.tool:disabled{opacity:.5}.msg-image{background:var(--bg);border-radius:10px;width:auto;max-width:100%;height:auto;max-height:320px;margin:2px 0;display:block}.msg-audio{width:240px;max-width:100%;display:block}.file-card{color:inherit;align-items:center;gap:8px;padding:6px 4px;text-decoration:none;display:flex}.file-icon{font-size:26px}.file-info{flex-direction:column;min-width:0;display:flex}.file-name{text-overflow:ellipsis;white-space:nowrap;max-width:220px;font-weight:500;overflow:hidden}.file-expired,.file-broken{color:var(--muted);font-size:13px;font-style:italic}.file-broken{color:var(--red);font-style:normal}.progress{background:var(--border);border-radius:2px;height:4px;margin-top:3px;overflow:hidden}.progress div{background:var(--blue);height:100%;transition:width .2s}.recorder{align-items:center;gap:8px;padding:6px 0;display:flex}.rec-dot{background:var(--red);border-radius:50%;width:10px;height:10px;animation:1s infinite blink}.rec-time{font-variant-numeric:tabular-nums;flex:1}@keyframes blink{50%{opacity:.3}}.setup-card{background:var(--blue-soft);border-radius:12px;flex-direction:column;gap:10px;margin:10px 12px;padding:12px;display:flex}.setup-card p{margin:0}.setup-step{flex-direction:column;gap:6px;display:flex}.ios-guide .guide-steps{flex-direction:column;gap:12px;margin:0;padding-left:22px;display:flex}.share-icon{border:1px solid var(--blue);color:var(--blue);border-radius:6px;padding:0 5px;display:inline-block}.guide-arrow{text-align:center;color:var(--blue);font-size:40px;animation:1s infinite bounce}@keyframes bounce{50%{transform:translateY(8px)}}.section-title{margin:14px 14px 4px;font-size:15px}.card-like{border-bottom:1px solid var(--border)}.radio{align-items:flex-start;gap:8px;font-size:14px;display:flex}.radio input{width:auto;margin-top:4px}.plain-link{color:inherit;text-decoration:none}.readonly-note{text-align:center;color:var(--muted);border-top:1px solid var(--border);background:var(--surface);padding:12px;font-size:14px}.push-right{margin-left:auto}select{font:inherit;border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);border-radius:10px;padding:9px 10px}.form-card{border:1px solid var(--border);background:var(--surface);border-radius:12px;flex-direction:column;gap:6px;min-width:200px;margin:4px 0;padding:10px;display:flex}.chips{gap:6px;padding:8px 12px;display:flex;overflow-x:auto}.chip{border:1px solid var(--border);background:var(--surface);white-space:nowrap;color:inherit;cursor:pointer;border-radius:999px;padding:4px 12px;font-size:14px;text-decoration:none}.chip.on{background:var(--blue);color:#fff;border-color:var(--blue)}.order-card{border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:6px;margin:8px 12px;padding:12px;display:flex}.order-items{border-collapse:collapse;width:100%;font-size:14px}.order-items td{border-bottom:1px dashed var(--border);vertical-align:top;padding:3px 0}.order-items td:first-child{color:var(--muted);width:40%;padding-right:8px}.status{background:var(--bg);border-radius:999px;padding:2px 8px;font-size:12px}.status-new{background:var(--blue-soft);color:var(--blue)}.status-in_progress{background:var(--amber-soft);color:var(--amber-text)}.status-done{background:var(--green-soft);color:var(--green-text)}.status-cancelled{background:var(--red-soft);color:var(--red)}.field{flex-direction:column;gap:4px;display:flex}.field-editor{border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:6px;margin:6px 12px;padding:10px;display:flex}.bot-item{border-bottom:1px solid var(--border);flex-direction:column;gap:6px;padding:12px 14px;display:flex}.row-actions.wrap{flex-wrap:wrap}.token{word-break:break-all;background:var(--surface);border-radius:8px;padding:8px;font-size:13px;display:block}.pad{padding:12px 14px}.invite-panel{border-top:1px solid var(--border);flex-direction:column;gap:8px;padding-top:10px;display:flex}.invite-item{border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:6px;padding:10px;display:flex}.invite-item.dead{opacity:.6}.btn-line-small{background:var(--line)}.qr{flex-direction:column;align-items:center;gap:4px;display:flex}.join{max-width:420px;margin:0 auto}.join-icon{margin-top:8vh;font-size:56px}.join h2{margin:0}.join-btn{max-width:320px}.inapp-banner{z-index:60;color:#fff;text-align:left;cursor:pointer;max-width:560px;font:inherit;background:#1f2937;border:0;border-radius:12px;flex-direction:column;align-items:flex-start;gap:2px;margin:0 auto;padding:10px 14px;animation:.2s ease-out slide-down;display:flex;position:fixed;top:8px;left:8px;right:8px;box-shadow:0 4px 14px #00000040}.inapp-banner span{opacity:.9;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:.9em;overflow:hidden}@keyframes slide-down{0%{transform:translateY(-120%)}to{transform:none}}.pinned-bar{background:var(--amber-soft);border-bottom:1px solid var(--border);align-items:center;gap:8px;padding:6px 12px;display:flex}.pinned-main{text-align:left;min-width:0;font:inherit;cursor:pointer;background:0 0;border:0;flex-direction:column;flex:1;align-items:flex-start;padding:0;display:flex}.pinned-text,.ellipsis{text-overflow:ellipsis;white-space:nowrap;max-width:100%;display:block;overflow:hidden}.reply-quote{background:var(--surface-2);text-align:left;width:100%;font:inherit;cursor:pointer;border:0;border-left:3px solid #06c755;border-radius:4px;flex-direction:column;align-items:flex-start;margin-bottom:4px;padding:3px 8px;font-size:.85em;display:flex}.reply-quote span{opacity:.75;text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.reply-draft{background:var(--surface-2);border-left:3px solid #06c755;border-radius:4px;align-items:center;gap:8px;margin-bottom:6px;padding:6px 8px;display:flex}.reply-draft .grow{min-width:0}.mention-list{border:1px solid var(--border);background:var(--surface);border-radius:8px;max-height:200px;margin:0 0 6px;padding:4px;list-style:none;overflow-y:auto}.mention-list button{width:100%;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:6px;align-items:center;gap:8px;padding:6px;display:flex}.mention-list button:hover{background:var(--surface-2)}.bubble-more{font:inherit;color:inherit;opacity:.6;cursor:pointer;background:0 0;border:0;margin-left:6px;padding:0 4px}.tool-on{background:#fde68a}.badge-muted{background:#9ca3af}.bubble-row.flash .bubble{outline:3px solid #fbbf24;transition:outline .3s}.composer textarea{font-size:var(--chat-font)}.sticker-img{object-fit:contain;width:140px;height:140px;display:block}.bubble-sticker{padding:2px;box-shadow:none!important;background:0 0!important}.sticker-picker{border:1px solid var(--border);background:var(--surface);border-radius:10px;margin-bottom:6px}.sticker-tabs{border-bottom:1px solid var(--border);gap:6px;padding:6px;display:flex;overflow-x:auto}.sticker-grid{grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:6px;max-height:220px;padding:6px;display:grid;overflow-y:auto}.sticker-grid button{cursor:pointer;background:0 0;border:0;border-radius:8px;padding:4px}.sticker-grid button:hover{background:var(--surface-2)}.sticker-grid img{object-fit:contain;width:64px;height:64px}.note-card{border-bottom:1px solid var(--border);color:inherit;flex-direction:column;gap:4px;padding:12px;text-decoration:none;display:flex}.note-body{white-space:pre-wrap;word-break:break-word;font-size:var(--chat-font)}.note-preview{white-space:pre-wrap;word-break:break-word;-webkit-line-clamp:4;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.comment{border-bottom:1px solid var(--border);gap:8px;padding:8px 12px;display:flex}.tabs{border-bottom:1px solid var(--border);gap:6px;padding:8px 12px;display:flex;overflow-x:auto}.icon-badge{position:relative}.icon-badge .badge{padding:0 5px;font-size:10px;position:absolute;top:-4px;right:-6px}.menu-list{margin:0;padding:0;list-style:none}.menu-list a,.menu-list button{width:100%;font:inherit;color:var(--text);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:8px;align-items:center;gap:10px;padding:12px 8px;text-decoration:none;display:flex}.menu-list a:hover,.menu-list button:hover{background:var(--surface-2)}.qr-box{flex-direction:column;align-items:center;gap:8px;padding:12px;display:flex}.qr-box img{background:#fff;border-radius:8px;width:200px;height:200px;padding:8px}.seg{flex-wrap:wrap;gap:6px;display:flex}.font-preview{background:var(--blue-soft);font-size:var(--chat-font);border-radius:12px;padding:10px 12px}.row{align-items:center;gap:10px;display:flex}
