:root{--app-bg:radial-gradient(130% 90% at 50% -10%, #1a1330 0%, #0d0b18 45%, #08070f 100%);--bg-base:#08070f;--purple-300:#c4b5fd;--purple-400:#a78bfa;--purple-500:#8b5cf6;--purple-600:#7c5cf0;--purple-grad:linear-gradient(135deg,#a78bfa 0%,#7c5cf0 100%);--text-1:#fff;--text-2:#9a96ad;--text-3:#6c6880;--green:#22c55e;--red:#f87171;--red-bg:#f8717114;--glass:#ffffff09;--glass-strong:#ffffff0e;--glass-border:#ffffff12;--nav-bg:#0a0912b3;--depth-inset:inset 0 1px 0 #ffffff0f;--depth-drop:0 10px 30px #00000059;--depth-glow:0 0 24px #8b5cf640;--r-card:22px;--r-avatar:20px;--r-tile:16px;--r-pill:999px;--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-7:32px;--s-8:40px;--page-x:20px;--font:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;--fs-logo:34px;--fs-title:30px;--fs-h2:22px;--fs-name:18px;--fs-body:15px;--fs-meta:14px;--fs-small:13px;--fs-label:12px;--fw-black:800;--fw-bold:700;--fw-semi:600;--dur-fast:.14s;--dur-med:.24s;--dur-slow:.42s;--ease-out:cubic-bezier(.22,1,.36,1);--ease-spring:cubic-bezier(.34,1.4,.64,1);--z-nav:50;--z-sheet:60;--z-splash:100}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{-webkit-text-size-adjust:100%}html,body,#root{height:100%;margin:0;padding:0}body{background:var(--app-bg);background-color:var(--bg-base);color:var(--text-1);font-family:var(--font);font-size:var(--fs-body);overscroll-behavior-y:none;background-attachment:fixed;line-height:1.45}button,input,textarea{color:inherit;font-family:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.page{max-width:720px;padding:var(--s-6) var(--page-x) calc(84px + env(safe-area-inset-bottom));min-height:100%;margin:0 auto}.glass-card{background:var(--glass);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(20px);box-shadow:var(--depth-inset), var(--depth-drop);border-radius:var(--r-card)}.section-label{text-transform:uppercase;letter-spacing:1.5px;font-size:var(--fs-label);font-weight:var(--fw-bold);color:var(--text-3);margin:0 0 var(--s-3) var(--s-1)}.pressable{transition:transform var(--dur-fast) var(--ease-out)}.pressable:active{transform:scale(.97)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}.skeleton{background:var(--glass-strong);border-radius:var(--r-tile);position:relative;overflow:hidden}.skeleton:after{content:"";background:linear-gradient(90deg,#0000,#ffffff0d,#0000);animation:1.6s infinite shimmer;position:absolute;inset:0;transform:translate(-100%)}@keyframes shimmer{to{transform:translate(100%)}}.avatar{border-radius:var(--r-avatar);font-weight:var(--fw-bold);color:var(--text-1);-webkit-user-select:none;user-select:none;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.avatar.grad{background:var(--purple-grad)}.avatar-xl{border-radius:32px;width:136px;height:136px;font-size:44px}.avatar-story{border-radius:20px;width:68px;height:68px;font-size:20px}.avatar-list{border-radius:var(--r-avatar);width:56px;height:56px;font-size:var(--fs-body)}.avatar-sm{width:52px;height:52px;font-size:var(--fs-small);border-radius:16px}.avatar-tile{width:48px;height:48px;font-size:var(--fs-small);border-radius:14px}.avatar .online-dot{background:var(--green);border:3px solid var(--bg-base);border-radius:50%;width:14px;height:14px;position:absolute;bottom:-2px;right:-2px}.switch{border-radius:var(--r-pill);background:var(--glass-strong);border:1px solid var(--glass-border);width:46px;height:26px;transition:background var(--dur-med) var(--ease-out);flex-shrink:0;position:relative}.switch.on{background:var(--purple-grad);border-color:#0000}.switch .knob{width:20px;height:20px;transition:transform var(--dur-med) var(--ease-spring);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;box-shadow:0 2px 6px #0000004d}.switch.on .knob{transform:translate(20px)}.divider-v{background:var(--glass-border);align-self:stretch;width:1px}.divider-h{background:var(--glass-border);border:none;height:1px;margin:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:var(--glass-strong);border-radius:8px}::-webkit-scrollbar-track{background:0 0}:focus-visible{outline:2px solid var(--purple-400);outline-offset:2px}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.reveal-item{opacity:0;animation:fadeUp var(--dur-med) var(--ease-out) forwards;animation-delay:calc(var(--i,0) * 40ms)}@keyframes bubbleIn{0%{opacity:0;transform:translateY(14px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.bubble-in{animation:bubbleIn var(--dur-slow) var(--ease-spring)}@keyframes shakeX{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(7px)}60%{transform:translate(-5px)}80%{transform:translate(3px)}}.shake{animation:.3s shakeX}@keyframes typingDot{0%,60%,to{opacity:.4;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}.typing-dot{animation:1.2s ease-in-out infinite typingDot}.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}@keyframes stepEnter{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}@keyframes stepExit{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-24px)}}.step-enter{animation:stepEnter var(--dur-med) var(--ease-out)}.step-exit{animation:stepExit var(--dur-med) var(--ease-out)}@keyframes splashFadeOut{0%{opacity:1}to{opacity:0}}.splash-fade-out{animation:.3s forwards splashFadeOut}@keyframes popIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.pop-in{animation:popIn var(--dur-fast) var(--ease-spring)}@keyframes ringPulse{0%,to{box-shadow:0 0 #8b5cf659}50%{box-shadow:0 0 0 6px #8b5cf600}}.pulse{animation:1.6s infinite ringPulse}@keyframes sheetUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.sheet-up{animation:sheetUp var(--dur-med) var(--ease-out)}@keyframes accordionOpen{0%{opacity:0;max-height:0}to{opacity:1;max-height:480px}}.accordion-open{animation:accordionOpen var(--dur-med) var(--ease-out);overflow:hidden}
