:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #07111f;
  color: #f6f8fb;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; background: radial-gradient(circle at 75% 5%, #173255 0, transparent 30%), #07111f; }
button, input, textarea { font: inherit; }
button { color: inherit; cursor: pointer; }
.shell { width: min(100%, 560px); min-height: 100svh; margin: auto; padding: max(18px, env(safe-area-inset-top)) 20px max(20px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; }
.topbar { display: flex; align-items: center; justify-content: space-between; }
.brand { display: flex; gap: 11px; align-items: center; }
.brand img { border-radius: 13px; box-shadow: 0 8px 28px #35d2ba25; }
.brand strong, .brand span { display: block; }
.brand strong { font-size: 16px; letter-spacing: .01em; }
.brand span { color: #8191a8; font-size: 11px; margin-top: 2px; }
.status { padding: 7px 10px; border: 1px solid #26364b; border-radius: 99px; color: #94a3b8; font-size: 11px; background: #0c1929cc; }
.status i { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: #64748b; }
.status.ready { color: #9df3d7; border-color: #1d5f53; }
.status.ready i { background: #39e3b3; box-shadow: 0 0 10px #39e3b3; }
.hero { text-align: center; margin: auto 0 24px; padding-top: 46px; }
.orb { width: 96px; height: 96px; margin: 0 auto 28px; display: grid; place-items: center; border-radius: 31px; transform: rotate(8deg); background: linear-gradient(145deg, #38e0bb, #1677e8); box-shadow: 0 24px 80px #178ee94d, inset 0 1px #ffffff80; }
.orb span { transform: rotate(-8deg); font-size: 42px; font-weight: 800; color: #051424; }
.eyebrow { margin: 0 0 11px; color: #42dbbb; font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(38px, 10vw, 58px); line-height: .98; letter-spacing: -.055em; }
h1 em { color: #94a3b8; font-style: normal; font-weight: 500; }
.sub { max-width: 380px; margin: 20px auto 0; color: #8392a8; font-size: 14px; line-height: 1.6; }
.actions { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 15px; scrollbar-width: none; }
.actions::-webkit-scrollbar { display: none; }
.chip { flex: 0 0 auto; padding: 9px 15px; border-radius: 99px; border: 1px solid #26384f; background: #0c1929; font-size: 12px; }
.chip:hover { border-color: #3bcfb3; background: #102538; }
.composer { display: flex; align-items: flex-end; gap: 10px; padding: 9px 9px 9px 17px; border: 1px solid #2b3b50; border-radius: 22px; background: #0c1929e6; box-shadow: 0 18px 50px #0006; }
.composer textarea { flex: 1; max-height: 120px; resize: none; border: 0; outline: 0; padding: 11px 0 8px; color: #eef4fb; background: transparent; font-size: 16px; }
.composer textarea::placeholder { color: #65758b; }
.send { width: 42px; height: 42px; border: 0; border-radius: 14px; background: #3cddb8; color: #062017; font-size: 24px; font-weight: 800; }
.setup { margin-top: 15px; padding: 18px; border: 1px solid #26384f; border-radius: 19px; background: #0a1726; }
.setup > div p { margin: 5px 0 16px; color: #7f8fa5; font-size: 12px; line-height: 1.5; }
.setup label span { display: block; margin-bottom: 7px; color: #9aa8ba; font-size: 11px; }
.setup input { width: 100%; border: 1px solid #2b3d52; border-radius: 12px; outline: 0; padding: 12px; color: white; background: #07111f; }
.setup input:focus { border-color: #3cddb8; }
.primary { width: 100%; margin-top: 10px; padding: 12px; border: 0; border-radius: 12px; background: #1c8e7d; font-weight: 700; }
footer { min-height: 44px; display: flex; align-items: end; justify-content: space-between; padding-top: 13px; color: #53647a; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
footer button { border: 0; padding: 0; color: #46d9bb; background: transparent; text-transform: uppercase; letter-spacing: .1em; font-size: 10px; }
@media (display-mode: standalone) { #install { display: none !important; } }