@import"https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg: #0A0A0C;--surface: #111317;--surface-raised: #16191F;--border: rgba(255, 255, 255, .06);--border-hover: rgba(255, 255, 255, .12);--primary: #7DF9FF;--primary-dim: rgba(125, 249, 255, .1);--primary-glow: rgba(125, 249, 255, .25);--success: #4DFFB4;--danger: #FF3B55;--warning: #FFB547;--text-primary: #F5F7FA;--text-secondary: rgba(245, 247, 250, .65);--text-muted: rgba(245, 247, 250, .4);--font-ui: "Inter Tight", system-ui, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: clamp(.6875rem, .65rem + .2vw, .75rem);--text-sm: clamp(.75rem, .7rem + .25vw, .875rem);--text-base: clamp(.8125rem, .78rem + .2vw, .9375rem);--text-md: clamp(.875rem, .82rem + .3vw, 1rem);--text-lg: clamp(1rem, .9rem + .5vw, 1.25rem);--text-xl: clamp(1.125rem, 1rem + .75vw, 1.5rem);--text-2xl: clamp(1.375rem, 1.1rem + 1.5vw, 2rem);--text-hero: clamp(1.75rem, 1.2rem + 2.5vw, 3rem);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--transition: .15s cubic-bezier(.16, 1, .3, 1);--transition-slow: .3s cubic-bezier(.16, 1, .3, 1);--shadow-sm: 0 1px 3px rgba(0,0,0,.4);--shadow-md: 0 4px 16px rgba(0,0,0,.5);--shadow-lg: 0 12px 40px rgba(0,0,0,.6);--shadow-glow: 0 0 20px rgba(125, 249, 255, .15);--topbar-height: 52px;--rail-width: 220px;--rail-collapsed: 60px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;scroll-behavior:smooth;scroll-padding-top:var(--topbar-height)}body{background:var(--bg);color:var(--text-primary);font-family:var(--font-ui);font-size:var(--text-base);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100dvh}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit}h1,h2,h3,h4,h5,h6{text-wrap:balance;line-height:1.15}p,li{text-wrap:pretty}:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:var(--radius-sm)}::-moz-selection{background:#7df9ff33;color:var(--text-primary)}::selection{background:#7df9ff33;color:var(--text-primary)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#fff3}.mono{font-family:var(--font-mono)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-accent{color:var(--primary)}.text-success{color:var(--success)}.text-danger{color:var(--danger)}.text-warning{color:var(--warning)}.surface{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md)}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;background:var(--danger);color:#fff;font-size:10px;font-weight:700;border-radius:var(--radius-full);font-family:var(--font-mono);line-height:1}.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;background:var(--primary-dim);color:var(--primary);border:1px solid rgba(125,249,255,.2);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;font-family:var(--font-mono)}.chip.success{background:#4dffb41a;color:var(--success);border-color:#4dffb433}.chip.danger{background:#ff3b551a;color:var(--danger);border-color:#ff3b5533}.chip.warning{background:#ffb5471a;color:var(--warning);border-color:#ffb54733}.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 16px;border-radius:var(--radius-sm);font-family:var(--font-ui);font-size:var(--text-sm);font-weight:600;cursor:pointer;border:none;transition:all var(--transition);outline:none;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none}.btn:focus-visible{outline:2px solid var(--primary);outline-offset:3px}.btn-primary{background:var(--primary);color:#0a0a0c}.btn-primary:hover{filter:brightness(1.1)}.btn-primary:active{transform:scale(.97)}.btn-ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border)}.btn-ghost:hover{background:var(--surface-raised);color:var(--text-primary);border-color:var(--border-hover)}.btn-ghost:active{transform:scale(.97)}.btn-danger{background:#ff3b551f;color:var(--danger);border:1px solid rgba(255,59,85,.2)}.btn-danger:hover{background:#ff3b5538}.btn-danger:active{transform:scale(.97)}.btn-success{background:#4dffb41f;color:var(--success);border:1px solid rgba(77,255,180,.2)}.btn-success:hover{background:#4dffb438}.btn-success:active{transform:scale(.97)}.btn-sm{padding:4px 10px;font-size:var(--text-xs)}.btn-lg{padding:10px 24px;font-size:var(--text-md);border-radius:var(--radius-md)}.divider{width:100%;height:1px;background:var(--border);border:none}.input{width:100%;padding:8px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--text-base);font-family:var(--font-ui);transition:border-color var(--transition);outline:none}.input::-moz-placeholder{color:var(--text-muted)}.input::placeholder{color:var(--text-muted)}.input:hover{border-color:var(--border-hover)}.input:focus{border-color:#7df9ff66;box-shadow:0 0 0 3px #7df9ff14}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,var(--surface-raised) 25%,rgba(255,255,255,.05) 50%,var(--surface-raised) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite;border-radius:var(--radius-sm)}.skeleton-text{height:1em;margin-bottom:var(--space-2)}.skeleton-heading{height:1.4em;width:40%;margin-bottom:var(--space-3)}.skeleton-avatar{width:36px;height:36px;border-radius:var(--radius-full)}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text-primary);font-family:var(--font-ui);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}input,textarea,select,button{font-family:var(--font-ui);font-size:14px}*:focus-visible{outline:2px solid var(--primary);outline-offset:2px}h1,h2,h3,h4,h5,h6{font-family:var(--font-ui);font-weight:700;color:var(--text-primary);line-height:1.2}button,a,input,textarea{transition:all var(--transition)}.feed-layout{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:12px;padding-bottom:40px}.post-box{background:#111317cc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;transition:border-color var(--transition),box-shadow var(--transition)}.post-box:focus-within{border-color:#7df9ff4d;box-shadow:0 0 0 3px var(--primary-dim)}.post-box textarea{width:100%;background:transparent;border:none;outline:none;color:var(--text-primary);font-size:14px;resize:none;min-height:72px}.post-box textarea::-moz-placeholder{color:var(--text-muted)}.post-box textarea::placeholder{color:var(--text-muted)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;gap:12px;text-align:center}.empty-state-icon{width:48px;height:48px;opacity:.3;color:var(--text-secondary)}.empty-state-title{font-size:16px;font-weight:600;color:var(--text-secondary)}.empty-state-desc{font-size:13px;color:var(--text-muted);max-width:280px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.animate-fade{animation:fadeIn .2s ease}.animate-slide{animation:slideUp .25s ease}.animate-pulse{animation:pulse 1.5s ease infinite}
