:root{--green-500: #22c55e;--green-600: #16a34a;--green-700: #15803d;--bg: #ffffff;--bg-outer: #e9efed;--bg-card-page: #f4f7f6;--surface: #ffffff;--surface-2: #f1f5f9;--surface-3: #e2e8f0;--border: #e2e8f0;--border-soft: #eef1f4;--text: #0f172a;--text-2: #334155;--text-3: #526071;--text-4: #94a3b8;--accent-text: #15803d;--accent-soft: #e7f9ee;--danger: #dc2626;--danger-text: #b91c1c;--danger-soft: #fef2f2;--warn-text: #92400e;--warn-soft: #fffbeb;--warn-border: #fde68a;--link: #1d4ed8;--overlay: rgba(15, 23, 42, .45);--shadow: rgba(15, 23, 42, .12);--radius-card: 24px;--radius-input: 14px;--rail-width: 92px;--chat-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160' fill='none' stroke='%2315803d' stroke-opacity='0.09' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 16h26a7 7 0 0 1 7 7v9a7 7 0 0 1-7 7H30l-8 6v-6h-4a7 7 0 0 1-7-7v-9a7 7 0 0 1 7-7z'/%3E%3Cpath d='M27 23v10M27 28l6-5M29 27l5 6'/%3E%3Cpath d='M118 40c-8-6-13-10-13-15a6 6 0 0 1 13-2 6 6 0 0 1 13 2c0 5-5 9-13 15z'/%3E%3Cpath d='M44 100l4 8 9 1.3-6.5 6.3 1.5 9-8-4.2-8 4.2 1.5-9-6.5-6.3 9-1.3z'/%3E%3Cpath d='M140 80v14M133 87h14'/%3E%3Ccircle cx='86' cy='78' r='3'/%3E%3Ccircle cx='100' cy='146' r='2.5'/%3E%3Cpath d='M92 120h22a6 6 0 0 1 6 6v6a6 6 0 0 1-6 6h-14l-6 5v-5h-2a6 6 0 0 1-6-6v-6a6 6 0 0 1 6-6z'/%3E%3C/svg%3E") 0 0 / 160px 160px;--chat-wallpaper: var(--chat-pattern), radial-gradient(circle at 100% 0%, rgba(74, 222, 128, .22), transparent 42%), radial-gradient(circle at 0% 100%, rgba(250, 204, 21, .14), transparent 40%), linear-gradient(160deg, #eef2ef 0%, #e7ede9 100%)}:root[data-theme=dark]{--bg: #0f1412;--bg-outer: #0a0e0c;--bg-card-page: #0c110f;--surface: #161d1a;--surface-2: #1f2824;--surface-3: #2b3631;--border: #2b3631;--border-soft: #202924;--text: #e8edea;--text-2: #c4cdc8;--text-3: #95a39c;--text-4: #66756d;--accent-text: #4ade80;--accent-soft: rgba(34, 197, 94, .16);--danger: #ef4444;--danger-text: #f87171;--danger-soft: rgba(239, 68, 68, .14);--warn-text: #fcd34d;--warn-soft: rgba(245, 158, 11, .12);--warn-border: rgba(245, 158, 11, .35);--link: #93c5fd;--overlay: rgba(0, 0, 0, .6);--shadow: rgba(0, 0, 0, .5);--chat-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160' fill='none' stroke='%234ade80' stroke-opacity='0.06' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 16h26a7 7 0 0 1 7 7v9a7 7 0 0 1-7 7H30l-8 6v-6h-4a7 7 0 0 1-7-7v-9a7 7 0 0 1 7-7z'/%3E%3Cpath d='M27 23v10M27 28l6-5M29 27l5 6'/%3E%3Cpath d='M118 40c-8-6-13-10-13-15a6 6 0 0 1 13-2 6 6 0 0 1 13 2c0 5-5 9-13 15z'/%3E%3Cpath d='M44 100l4 8 9 1.3-6.5 6.3 1.5 9-8-4.2-8 4.2 1.5-9-6.5-6.3 9-1.3z'/%3E%3Cpath d='M140 80v14M133 87h14'/%3E%3Ccircle cx='86' cy='78' r='3'/%3E%3Ccircle cx='100' cy='146' r='2.5'/%3E%3Cpath d='M92 120h22a6 6 0 0 1 6 6v6a6 6 0 0 1-6 6h-14l-6 5v-5h-2a6 6 0 0 1-6-6v-6a6 6 0 0 1 6-6z'/%3E%3C/svg%3E") 0 0 / 160px 160px;--chat-wallpaper: var(--chat-pattern), radial-gradient(circle at 100% 0%, rgba(74, 222, 128, .08), transparent 42%), radial-gradient(circle at 0% 100%, rgba(250, 204, 21, .05), transparent 40%), linear-gradient(160deg, #111815 0%, #0d1311 100%)}[data-group-theme]{--chat-wallpaper: var(--chat-pattern), radial-gradient(circle at 100% 0%, var(--theme-glow), transparent 45%), linear-gradient(160deg, var(--theme-a) 0%, var(--theme-b) 100%)}[data-group-theme=blue]{--theme-a: #e9f1fb;--theme-b: #d9e5f6;--theme-glow: rgba(59, 130, 246, .22)}[data-group-theme=purple]{--theme-a: #f2edfb;--theme-b: #e4daf6;--theme-glow: rgba(139, 92, 246, .22)}[data-group-theme=pink]{--theme-a: #fcedf3;--theme-b: #f5dae6;--theme-glow: rgba(236, 72, 153, .2)}[data-group-theme=orange]{--theme-a: #fdf1e5;--theme-b: #f7e0ca;--theme-glow: rgba(249, 115, 22, .2)}[data-group-theme=yellow]{--theme-a: #fdf8e2;--theme-b: #f4eac2;--theme-glow: rgba(234, 179, 8, .22)}[data-group-theme=teal]{--theme-a: #e6f6f4;--theme-b: #d1ebe7;--theme-glow: rgba(20, 184, 166, .22)}[data-group-theme=gray]{--theme-a: #f2f4f6;--theme-b: #e1e5ea;--theme-glow: rgba(100, 116, 139, .18)}:root[data-theme=dark] [data-group-theme=blue]{--theme-a: #162131;--theme-b: #111a27;--theme-glow: rgba(59, 130, 246, .14)}:root[data-theme=dark] [data-group-theme=purple]{--theme-a: #1d1830;--theme-b: #161227;--theme-glow: rgba(139, 92, 246, .14)}:root[data-theme=dark] [data-group-theme=pink]{--theme-a: #2a1720;--theme-b: #21121a;--theme-glow: rgba(236, 72, 153, .12)}:root[data-theme=dark] [data-group-theme=orange]{--theme-a: #2a1d12;--theme-b: #21170e;--theme-glow: rgba(249, 115, 22, .12)}:root[data-theme=dark] [data-group-theme=yellow]{--theme-a: #28230f;--theme-b: #1f1b0b;--theme-glow: rgba(234, 179, 8, .12)}:root[data-theme=dark] [data-group-theme=teal]{--theme-a: #11241f;--theme-b: #0d1c18;--theme-glow: rgba(20, 184, 166, .14)}:root[data-theme=dark] [data-group-theme=gray]{--theme-a: #1a1f24;--theme-b: #14181c;--theme-glow: rgba(100, 116, 139, .14)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Noto Sans Thai Looped,system-ui,sans-serif;font-size:16px;line-height:1.5;-webkit-text-size-adjust:100%}h1,h2{font-family:Prompt,Noto Sans Thai Looped,sans-serif;font-weight:700}button{cursor:pointer;-webkit-tap-highlight-color:transparent}a{-webkit-tap-highlight-color:transparent}.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}app-root{display:block;max-width:560px;margin:0 auto}@media(min-width:600px){body{background:var(--bg-outer)}app-root{box-shadow:0 0 0 1px var(--border)}app-root:has(>app-login){max-width:none;box-shadow:none}}@media(min-width:600px)and (max-width:959px){app-root{max-width:720px}}@media(min-width:960px){body{background:var(--bg-card-page)}app-root{max-width:none;box-shadow:none}app-root:has(>app-bottom-nav.rail){padding-left:var(--rail-width)}app-root app-bottom-nav:not(.rail){display:none}app-root>:is(app-friend-search,app-scan,app-add-friend,app-join-group,app-legal-page,app-notification-opened,app-push-test){width:100%;max-width:760px;min-height:100dvh;margin-inline:auto;box-shadow:0 0 0 1px var(--border),0 10px 40px -20px var(--shadow)}app-root>app-notification-opened{display:block}app-root>:is(app-bots,app-contacts){width:100%;max-width:1040px;min-height:100dvh;margin-inline:auto;box-shadow:0 0 0 1px var(--border)}app-root:has(app-chat-room),app-root:has(>app-chat-list){max-width:none;display:flex;height:100dvh}app-root:has(>app-chat-list)>app-chat-list{flex:none;width:380px;border-right:1px solid var(--border)}app-root:has(app-chat-room)>app-chat-room{flex:1;min-width:0}app-root:has(>app-chat-list):after{content:"\e40\e25\e37\e2d\e01\e41\e0a\e17\e17\e32\e07\e0b\e49\e32\e22\e40\e1e\e37\e48\e2d\e40\e23\e34\e48\e21\e04\e38\e22";flex:1;display:grid;place-items:center;background:var(--chat-wallpaper);color:var(--text-3);font-size:16px}:root[lang=en] app-root:has(>app-chat-list):after{content:"Pick a chat on the left to start"}}