/* Upchatty Kit (2026-10-01) — one look for Upchatty Messenger + Upchatty Meet.
   Dark = "Night Deck", light = "Day Deck". Tokens keep the old variable names so every page themes by variables alone.
   Loaded by index.html and meet.html; bump ?v= on every change (Hostinger caches css/js for days). */
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600;700&display=swap');

html[data-theme="dark"], html:not([data-theme]) {
  color-scheme: dark;
  --bg:#050816; --bg2:#080d20; --bg3:#0c1330;
  --card:#0b1226; --card2:#101a38; --card3:#16224a;
  --border:#24346a; --border2:#172349;
  --text:#e8eeff; --muted:#93a4d3; --muted2:#5d6c9c;
  --blue:#5b8cff; --blue-l:#8fb2ff; --blue-d:#2f5fe6; --blue-bg:rgba(91,140,255,.14);
  --green:#2ee6a6; --green-bg:rgba(46,230,166,.13);
  --red:#ff5470; --red-bg:rgba(255,84,112,.14);
  --yellow:#ffb84d; --yellow-bg:rgba(255,184,77,.14);
  --purple:#a98bff; --purple-bg:rgba(169,139,255,.15);
  --cyan:#37e0ff; --cyan-bg:rgba(55,224,255,.12);
  --on-accent:#fff;
  --glass:rgba(11,18,38,.72); --glass-line:rgba(120,150,255,.22);
  --stage:#02040c; --shadow:0 18px 50px rgba(0,0,0,.55);
  --glow:0 0 0 1px rgba(91,140,255,.35), 0 0 22px rgba(91,140,255,.28);
  --grid-line:rgba(91,140,255,.07);
  --sky-a:rgba(59,110,255,.22); --sky-b:rgba(169,139,255,.16); --sky-c:rgba(55,224,255,.10);
  --sky-img:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1600 1000%22 preserveAspectRatio=%22xMidYMid slice%22%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%22420%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%22640%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%22860%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%221080%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%221300%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%22380%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%22600%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%22820%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%221040%22 fill=%22none%22 stroke=%22rgba%28120%2C160%2C255%2C.13%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Cpath d=%22M139 789L244 910%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M370 709L481 901%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M409 442L625 690%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M707 426L895 751%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1006 470L1508 195%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1495 436L1288 297%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1578 688L1261 560%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1330 844L972 602%22 stroke=%22rgba%28169%2C139%2C255%2C.22%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Ccircle cx=%22139%22 cy=%22789%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22139%22 cy=%22789%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22244%22 cy=%22910%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22244%22 cy=%22910%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22161%22 cy=%22545%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22161%22 cy=%22545%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22370%22 cy=%22709%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22370%22 cy=%22709%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22481%22 cy=%22901%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22481%22 cy=%22901%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%2259%22 cy=%22279%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%2259%22 cy=%22279%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22409%22 cy=%22442%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22409%22 cy=%22442%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22625%22 cy=%22690%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22625%22 cy=%22690%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22353%22 cy=%22149%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22353%22 cy=%22149%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22707%22 cy=%22426%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22707%22 cy=%22426%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22895%22 cy=%22751%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22895%22 cy=%22751%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22680%22 cy=%2296%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22680%22 cy=%2296%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221006%22 cy=%22470%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221006%22 cy=%22470%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221508%22 cy=%22195%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221508%22 cy=%22195%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221398%22 cy=%2281%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221398%22 cy=%2281%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221495%22 cy=%22436%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221495%22 cy=%22436%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221288%22 cy=%22297%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221288%22 cy=%22297%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221156%22 cy=%2285%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221156%22 cy=%2285%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221578%22 cy=%22688%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221578%22 cy=%22688%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221261%22 cy=%22560%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221261%22 cy=%22560%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221025%22 cy=%22315%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221025%22 cy=%22315%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221330%22 cy=%22844%22 r=%225%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%221330%22 cy=%22844%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22972%22 cy=%22602%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22972%22 cy=%22602%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22743%22 cy=%22236%22 r=%223.5%22 fill=%22rgba%2855%2C224%2C255%2C.42%29%22/%3E%3Ccircle cx=%22743%22 cy=%22236%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2855%2C224%2C255%2C.42%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3C/svg%3E");
}
html[data-theme="light"] {
  color-scheme: light;
  --bg:#eef2fb; --bg2:#f6f8fe; --bg3:#e6ecf9;
  --card:#ffffff; --card2:#f3f6fd; --card3:#e8eefb;
  --border:#c3cfec; --border2:#dbe3f5;
  --text:#0c1533; --muted:#52608a; --muted2:#8390b3;
  --blue:#2f63f0; --blue-l:#2552d0; --blue-d:#1f47c2; --blue-bg:rgba(47,99,240,.10);
  --green:#0a9a6b; --green-bg:rgba(10,154,107,.11);
  --red:#dc2550; --red-bg:rgba(220,37,80,.09);
  --yellow:#b86c00; --yellow-bg:rgba(184,108,0,.11);
  --purple:#6d45e0; --purple-bg:rgba(109,69,224,.10);
  --cyan:#0786a8; --cyan-bg:rgba(7,134,168,.10);
  --on-accent:#fff;
  --glass:rgba(255,255,255,.82); --glass-line:rgba(47,99,240,.20);
  --stage:#dfe6f6; --shadow:0 16px 40px rgba(28,45,100,.16);
  --glow:0 0 0 1px rgba(47,99,240,.35), 0 0 18px rgba(47,99,240,.18);
  --grid-line:rgba(47,99,240,.06);
  --sky-a:rgba(47,99,240,.15); --sky-b:rgba(109,69,224,.11); --sky-c:rgba(7,134,168,.09);
  --sky-img:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1600 1000%22 preserveAspectRatio=%22xMidYMid slice%22%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%22420%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%22640%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%22860%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%221080%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Ccircle cx=%22-120%22 cy=%221120%22 r=%221300%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%22380%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%22600%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%22820%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22/%3E%3Ccircle cx=%221720%22 cy=%22-120%22 r=%221040%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.11%29%22 stroke-width=%221.4%22 stroke-dasharray='3 9'/%3E%3Cpath d=%22M139 789L244 910%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M370 709L481 901%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M409 442L625 690%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M707 426L895 751%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1006 470L1508 195%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1495 436L1288 297%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1578 688L1261 560%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Cpath d=%22M1330 844L972 602%22 stroke=%22rgba%28109%2C69%2C224%2C.18%29%22 stroke-width=%221%22 stroke-dasharray=%222 7%22/%3E%3Ccircle cx=%22139%22 cy=%22789%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22139%22 cy=%22789%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22244%22 cy=%22910%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22244%22 cy=%22910%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22161%22 cy=%22545%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22161%22 cy=%22545%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22370%22 cy=%22709%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22370%22 cy=%22709%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22481%22 cy=%22901%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22481%22 cy=%22901%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%2259%22 cy=%22279%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%2259%22 cy=%22279%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22409%22 cy=%22442%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22409%22 cy=%22442%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22625%22 cy=%22690%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22625%22 cy=%22690%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22353%22 cy=%22149%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22353%22 cy=%22149%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22707%22 cy=%22426%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22707%22 cy=%22426%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22895%22 cy=%22751%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22895%22 cy=%22751%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22680%22 cy=%2296%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22680%22 cy=%2296%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221006%22 cy=%22470%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221006%22 cy=%22470%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221508%22 cy=%22195%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221508%22 cy=%22195%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221398%22 cy=%2281%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221398%22 cy=%2281%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221495%22 cy=%22436%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221495%22 cy=%22436%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221288%22 cy=%22297%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221288%22 cy=%22297%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221156%22 cy=%2285%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221156%22 cy=%2285%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221578%22 cy=%22688%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221578%22 cy=%22688%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221261%22 cy=%22560%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221261%22 cy=%22560%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221025%22 cy=%22315%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221025%22 cy=%22315%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%221330%22 cy=%22844%22 r=%225%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%221330%22 cy=%22844%22 r=%2215%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22972%22 cy=%22602%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22972%22 cy=%22602%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3Ccircle cx=%22743%22 cy=%22236%22 r=%223.5%22 fill=%22rgba%2847%2C99%2C240%2C.30%29%22/%3E%3Ccircle cx=%22743%22 cy=%22236%22 r=%2211%22 fill=%22none%22 stroke=%22rgba%2847%2C99%2C240%2C.30%29%22 stroke-width=%221%22 opacity=%22.45%22/%3E%3C/svg%3E");
}
:root { --uc-display:'Chakra Petch', ui-sans-serif, -apple-system, 'Segoe UI', sans-serif;
        --uc-body:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', Roboto, sans-serif; }

/* icons: every icon is paired with a word. <svg class="ic"><use href="#i-mic"/></svg> */
.ic { width:1.25em; height:1.25em; flex:none; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.22em }
.ic.lg { width:26px; height:26px } .ic.sm { width:16px; height:16px }

/* brand lockup: mark + Upchatty + product word */
.uc-lockup { display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--text); min-width:0 }
.uc-lockup img { width:38px; height:38px; flex:none; filter:drop-shadow(0 6px 12px rgba(59,91,255,.35)) }
.uc-lockup .w { display:flex; flex-direction:column; line-height:1.05; min-width:0 }
.uc-lockup .w b { font-family:var(--uc-display); font-weight:700; -webkit-text-fill-color:currentColor; font-size:19px; letter-spacing:.01em; white-space:nowrap }
.uc-lockup .w b i { font-style:normal; -webkit-text-fill-color:transparent; background:linear-gradient(90deg,var(--blue),var(--cyan)); -webkit-background-clip:text; background-clip:text; color:transparent }
.uc-lockup .w span { font-weight:500; font-family:var(--uc-body); -webkit-text-fill-color:currentColor; font-size:11px; color:var(--muted); letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.uc-lockup.sm img { width:28px; height:28px } .uc-lockup.sm .w b { font-size:15px } .uc-lockup.sm .w span { display:none }

.uc-theme-btn { display:inline-flex; align-items:center; gap:7px; min-height:40px; padding:0 12px; border-radius:999px; border:1.5px solid var(--border);
  background:var(--card2); color:var(--muted); font:600 12px var(--uc-display); letter-spacing:.03em; cursor:pointer }
.uc-theme-btn:hover { color:var(--text); border-color:var(--blue) }
html[data-theme="light"] .uc-theme-btn .i-dark, html[data-theme="dark"] .uc-theme-btn .i-light, html:not([data-theme]) .uc-theme-btn .i-light { display:none }

:focus-visible { outline:2px solid var(--cyan); outline-offset:2px }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important } }

/* page backdrop "signal orbits": glow from three corners + orbit lines with people-nodes (replaces the square grid, 2026-10-01) */
body.uc-sky { background:
    radial-gradient(1100px 620px at 8% -10%, var(--sky-a), transparent 62%),
    radial-gradient(900px 600px at 100% 0%, var(--sky-b), transparent 60%),
    radial-gradient(1000px 640px at 55% 120%, var(--sky-c), transparent 62%), var(--bg); background-attachment:fixed }
body.uc-sky::before { content:""; position:fixed; inset:0; background:var(--sky-img) center/cover no-repeat; pointer-events:none; z-index:0 }