:root{--color-primary:#2563eb;--color-primary-hover:#1d4ed8;--color-primary-light:#2563eb14;--color-bg:#fff;--color-surface:#f8fafc;--color-surface-hover:#f1f5f9;--color-text-main:#334155;--color-text-heading:#0f172a;--color-text-muted:#64748b;--color-border:#e2e8f0;--color-border-subtle:#f1f5f9;--color-error-bg:#fef2f2;--color-error-text:#991b1b;--color-error-border:#fecaca;--color-success-bg:#f0fdf4;--color-success-text:#166534;--color-success-border:#bbf7d0;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.5rem;--font-size-2xl:2rem;--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--line-height-tight:1.25;--line-height-normal:1.5;--line-height-relaxed:1.625;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--duration-fast:.15s;--duration-normal:.25s}@media (prefers-color-scheme:dark){:root{--color-primary:#3b82f6;--color-primary-hover:#60a5fa;--color-primary-light:#3b82f626;--color-bg:#0f172a;--color-surface:#1e293b;--color-surface-hover:#334155;--color-text-main:#94a3b8;--color-text-heading:#f8fafc;--color-text-muted:#64748b;--color-border:#334155;--color-border-subtle:#1e293b;--color-error-bg:#991b1b33;--color-error-text:#fca5a5;--color-error-border:#7f1d1d;--color-success-bg:#16653433;--color-success-text:#86efac;--color-success-border:#14532d;--shadow-sm:0 1px 2px 0 #0000004d;--shadow-md:0 4px 6px -1px #0006, 0 2px 4px -1px #0003;--shadow-lg:0 10px 15px -3px #00000080, 0 4px 6px -2px #0000004d}}*,:before,:after{box-sizing:border-box}body{font-family:var(--font-sans);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-main);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}#root{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4{font-family:var(--font-sans);font-weight:var(--font-weight-semibold);color:var(--color-text-heading);line-height:var(--line-height-tight);margin:0 0 var(--space-3) 0}h1{font-size:var(--font-size-2xl);letter-spacing:-.025em}h2{font-size:var(--font-size-xl);letter-spacing:-.015em}h3{font-size:var(--font-size-lg)}p{margin:0 0 var(--space-4) 0;line-height:var(--line-height-normal)}code{font-family:var(--font-mono);font-size:var(--font-size-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-heading);padding:2px 6px}.top-nav{padding:var(--space-3) var(--space-6);border-bottom:1px solid var(--color-border);background:var(--color-bg);justify-content:space-between;align-items:center;display:flex}.top-nav .nav-brand{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-heading);letter-spacing:-.01em}.top-nav .nav-links{gap:var(--space-3);align-items:center;display:flex}.top-nav .nav-btn{padding:var(--space-2) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);color:var(--color-text-main);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out)}.top-nav .nav-btn:hover{background:var(--color-surface);color:var(--color-text-heading);transform:translateY(-1px)}.top-nav .nav-btn.active{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.user-status-summary{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-3)}.page-container{padding:var(--space-6) var(--space-5);width:100%;max-width:800px;margin:0 auto}.skeleton-container{gap:var(--space-4);padding:var(--space-6);flex-direction:column;width:100%;max-width:800px;margin:0 auto;display:flex}.skeleton-box{background:linear-gradient(90deg, var(--color-surface) 25%, var(--color-border-subtle) 50%, var(--color-surface) 75%);animation:shimmer 1.5s infinite var(--ease-in-out);border-radius:var(--radius-md);background-size:200% 100%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;padding:var(--space-5);animation:fadeIn var(--duration-fast) var(--ease-out);background-color:#0f172a99;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:100%;max-width:440px;padding:var(--space-6);box-shadow:var(--shadow-lg);max-height:90vh;animation:scaleUp var(--duration-fast) var(--ease-out);position:relative;overflow-y:auto}.modal-close-btn{top:var(--space-3);right:var(--space-4);font-size:var(--font-size-base);color:var(--color-text-muted);cursor:pointer;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);transition:color var(--duration-fast) var(--ease-out), background-color var(--duration-fast) var(--ease-out);background:0 0;border:none;line-height:1;position:absolute}.modal-close-btn:hover{color:var(--color-text-heading);background:var(--color-surface)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.auth-wrapper{justify-content:center;display:flex}.auth-card{width:100%;max-width:440px}.auth-tabs{gap:var(--space-2);margin-bottom:var(--space-5);border-bottom:1px solid var(--color-border);padding-bottom:var(--space-2);display:flex}.auth-tabs button{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;color:var(--color-text-muted);border-radius:var(--radius-sm);transition:background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out);background:0 0;border:none;flex:1}.auth-tabs button:hover{background:var(--color-surface);color:var(--color-text-heading)}.auth-tabs button.active{font-weight:var(--font-weight-semibold);color:var(--color-primary);background:var(--color-primary-light)}.auth-form h2{margin-bottom:var(--space-4);text-align:left}.form-help{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-4)}.form-group{margin-bottom:var(--space-4);text-align:left}.form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin-bottom:var(--space-2);color:var(--color-text-heading);display:block}.form-group input{width:100%;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);color:var(--color-text-heading);transition:border-color var(--duration-fast) var(--ease-out)}.form-group input:focus{border-color:var(--color-primary);outline:none}.alert{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);margin-bottom:var(--space-4);text-align:left}.alert-error{background-color:var(--color-error-bg);color:var(--color-error-text);border:1px solid var(--color-error-border)}.alert-success{background-color:var(--color-success-bg);color:var(--color-success-text);border:1px solid var(--color-success-border)}.btn-primary{width:100%;padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:#fff;background-color:var(--color-primary);border-radius:var(--radius-md);cursor:pointer;justify-content:center;align-items:center;gap:var(--space-2);transition:background-color var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out);border:1px solid #0000;display:inline-flex}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);background:var(--color-bg);color:var(--color-text-main);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;justify-content:center;align-items:center;gap:var(--space-2);transition:background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out);display:inline-flex}.btn-secondary:hover:not(:disabled){background:var(--color-surface);color:var(--color-text-heading);transform:translateY(-1px)}.btn-danger{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);background:var(--color-bg);color:var(--color-error-text);border:1px solid var(--color-error-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out)}.btn-danger:hover{background:var(--color-error-bg)}.spinner{border:2px solid;border-right-color:#0000;border-radius:50%;width:14px;height:14px;animation:.75s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.user-profile-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);text-align:left}.profile-header{margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.profile-header h2{font-size:var(--font-size-lg);margin:0}.profile-details{gap:var(--space-2);font-size:var(--font-size-sm);flex-direction:column;display:flex}.status-badge{border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;display:inline-block}.status-badge.status-active,.status-badge.status-verified{background-color:var(--color-success-bg);color:var(--color-success-text)}.status-badge.status-unverified{background-color:var(--color-surface);color:var(--color-text-muted)}.chat-container{flex-direction:column;min-height:100vh;display:flex}.chat-window{border:1px solid var(--color-border);border-radius:var(--radius-md);height:360px;padding:var(--space-4);gap:var(--space-3);background:var(--color-surface);margin-bottom:var(--space-4);flex-direction:column;display:flex;overflow-y:auto}.message{max-width:80%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:var(--font-size-sm);line-height:var(--line-height-normal);word-wrap:break-word}.message.me{background-color:var(--color-primary);color:#fff;align-self:flex-end}.message.system{background-color:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text-heading);align-self:flex-start}.chat-input-area{gap:var(--space-3);display:flex}.chat-input-area input{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);color:var(--color-text-heading);flex:1}.chat-input-area input:focus{border-color:var(--color-primary);outline:none}