:root{color:#f5f6ff;font-synthesis:none;text-rendering:optimizelegibility;--accent:#7c5cff;--accent-rgb:124, 92, 255;--bg:#080a12;--panel:#111422f0;--panel-strong:#151827;--panel-soft:#1f2338b8;--text:#f5f6ff;--muted:#979db5;--line:#ffffff13;--danger:#ff647c;--success:#4ed59b;background:#080a12;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}:root[data-theme=light]{color:#17182a;--bg:#eef0f8;--panel:#fffffff2;--panel-strong:#fff;--panel-soft:#e6e8f3cc;--text:#17182a;--muted:#676d83;--line:#16182a1a;background:#eef0f8}@media (prefers-color-scheme:light){:root[data-theme=system]{color:#17182a;--bg:#eef0f8;--panel:#fffffff2;--panel-strong:#fff;--panel-soft:#e6e8f3cc;--text:#17182a;--muted:#676d83;--line:#16182a1a;background:#eef0f8}}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0}body{background:var(--bg);min-height:100vh;color:var(--text);overflow:hidden}button,input,textarea,select{font:inherit}button{color:inherit}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}:root[data-background=midnight] body{background:radial-gradient(circle at 70% -10%,#4a46aa52,#0000 36%),#080a12}:root[data-background=aurora] body{background:radial-gradient(circle at 10% 0,#00d3b240,#0000 35%),radial-gradient(circle at 90% 10%,#7c5cff4d,#0000 40%),#071019}:root[data-background=sunset] body{background:radial-gradient(circle at 70% 0,#ff6a6d47,#0000 40%),radial-gradient(circle at 10% 100%,#854cff38,#0000 35%),#120b16}:root[data-background=forest] body{background:radial-gradient(circle at 70% 0,#35be8538,#0000 40%),#07110f}:root[data-background=plain] body{background:var(--bg)}h1,h2,h3,h4,p{margin-top:0}h1,h2,h3{font-family:Space Grotesk,Inter,sans-serif}button{border:0}.loading-screen{background:radial-gradient(circle at center, #7c5cff2e, transparent 28%), var(--bg);min-height:100vh;color:var(--muted);place-items:center;display:grid}.eyebrow{color:var(--muted);letter-spacing:.16em;margin:0 0 6px;font-size:11px;font-weight:800;line-height:1}.brand-mark{background:linear-gradient(145deg, color-mix(in srgb, var(--accent) 92%, white 8%), color-mix(in srgb, var(--accent) 64%, #151327 36%));color:#fff;width:46px;height:46px;box-shadow:0 10px 28px color-mix(in srgb, var(--accent) 30%, transparent);cursor:pointer;border-radius:15px;place-items:center;font:800 22px/1 Space Grotesk,sans-serif;display:grid}.brand-mark.large{border-radius:22px;width:68px;height:68px;font-size:32px}.button{cursor:pointer;border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;min-height:42px;padding:0 17px;font-weight:700;transition:transform .18s,filter .18s,background .18s;display:inline-flex}.button:hover:not(:disabled){filter:brightness(1.06);text-decoration:none;transform:translateY(-1px)}.button:disabled{opacity:.55;cursor:not-allowed}.button.primary{background:var(--accent);color:#fff;box-shadow:0 10px 24px color-mix(in srgb, var(--accent) 22%, transparent)}.button.secondary{background:var(--panel-soft);border-color:var(--line);color:var(--text)}.button.danger{color:#ff8094;background:#ff647c1a;border-color:#ff647c40}.button.full{width:100%}.button.small{min-height:34px;padding:0 12px;font-size:13px}input,textarea,select{border:1px solid var(--line);background:color-mix(in srgb, var(--panel-strong) 82%, transparent);width:100%;color:var(--text);border-radius:12px;outline:none;padding:12px 13px;transition:border .18s,box-shadow .18s}input:focus,textarea:focus,select:focus{border-color:color-mix(in srgb, var(--accent) 65%, white 10%);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent)}textarea{resize:vertical}label{color:var(--muted);gap:7px;font-size:12px;font-weight:700;display:grid}.error-text{color:#ff7f93}.success-text{color:var(--success)}.muted{color:var(--muted)}.pad{padding:10px 12px;font-size:13px}.break-text{overflow-wrap:anywhere}.auth-page{background:radial-gradient(circle at 10% 20%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 34%), radial-gradient(circle at 90% 80%, #33cdbb1f, transparent 28%);grid-template-columns:minmax(360px,1.05fr) minmax(420px,.95fr);min-height:100vh;display:grid;overflow:auto}.auth-brand{flex-direction:column;justify-content:center;padding:clamp(48px,8vw,120px);display:flex;position:relative;overflow:hidden}.auth-brand:after{content:"";border:1px solid color-mix(in srgb, var(--accent) 28%, transparent);width:420px;height:420px;box-shadow:0 0 80px color-mix(in srgb, var(--accent) 10%, transparent) inset;border-radius:50%;position:absolute;bottom:-180px;left:-170px}.auth-brand .eyebrow{color:color-mix(in srgb, var(--accent) 70%, white 30%);margin-top:34px}.auth-brand h1{letter-spacing:-.055em;max-width:700px;margin:10px 0 22px;font-size:clamp(42px,5.3vw,78px);line-height:.98}.auth-brand>p:not(.eyebrow){max-width:570px;color:var(--muted);font-size:17px;line-height:1.7}.feature-pills{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.feature-pills span{border:1px solid var(--line);color:#c9cce0;background:#ffffff09;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:700}.auth-card-wrap{border-left:1px solid var(--line);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#05070d57;place-items:center;padding:40px;display:grid}.auth-card{border:1px solid var(--line);background:color-mix(in srgb, var(--panel) 90%, transparent);border-radius:24px;width:min(100%,460px);padding:34px;box-shadow:0 32px 80px #00000047}.auth-heading h2{margin-bottom:8px;font-size:30px}.auth-heading p{color:var(--muted);margin-bottom:26px;line-height:1.55}.auth-card form{gap:16px;display:grid}.form-alert{background:#ffffff09;border-radius:10px;margin:0;padding:11px 12px;font-size:12px;line-height:1.5}.auth-links{color:var(--muted);gap:10px;margin-top:21px;font-size:13px;display:grid}.status-panel{gap:18px;display:grid}.app-shell{grid-template-columns:72px 292px minmax(0,1fr);gap:10px;height:100vh;padding:10px;display:grid;overflow:hidden}.rail,.sidebar,.main-panel{border:1px solid var(--line);background:var(--panel);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:0 24px 70px #0000002e}.rail{border-radius:20px;flex-direction:column;align-items:center;padding:12px;display:flex}.rail-spacer{flex:1}.avatar-button{cursor:pointer;background:0 0;border-radius:50%;padding:0}.avatar{background:linear-gradient(145deg, color-mix(in srgb, var(--accent) 78%, #fff 4%), color-mix(in srgb, var(--accent) 34%, #141727 66%));color:#fff;-webkit-user-select:none;user-select:none;border-radius:38%;flex:none;place-items:center;font-weight:800;display:inline-grid;box-shadow:inset 0 0 0 1px #ffffff1f}.sidebar{border-radius:20px;flex-direction:column;min-width:0;display:flex;overflow:hidden}.sidebar-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:76px;padding:17px 18px;display:flex}.sidebar-header h1{margin:0;font-size:21px}.connection-dot{background:#6e7284;border-radius:50%;width:10px;height:10px;box-shadow:0 0 0 4px #6e72841a}.connection-dot.online{background:var(--success);box-shadow:0 0 0 4px #4ed59b1f}.nav-button{color:var(--muted);cursor:pointer;text-align:left;background:0 0;border-radius:12px;justify-content:space-between;margin:12px 12px 8px;padding:12px 13px;font-weight:700;display:flex}.nav-button:hover,.nav-button.active{background:color-mix(in srgb, var(--accent) 10%, var(--panel-soft));color:var(--text)}.nav-button strong{color:#fff;background:var(--accent);border-radius:999px;place-items:center;min-width:19px;height:19px;font-size:10px;display:grid}.sidebar-label{color:var(--muted);letter-spacing:.1em;justify-content:space-between;padding:15px 17px 8px;font-size:10px;font-weight:800;display:flex}.conversation-list{scrollbar-width:thin;flex:1;min-height:0;padding:0 8px 12px;overflow-y:auto}.conversation-item{text-align:left;cursor:pointer;width:100%;color:var(--muted);background:0 0;border-radius:13px;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:3px;padding:10px;display:grid}.conversation-item:hover,.conversation-item.active{background:var(--panel-soft);color:var(--text)}.conversation-copy{gap:3px;min-width:0;display:grid}.conversation-copy strong,.conversation-copy small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.conversation-copy strong{color:var(--text);font-size:13px}.conversation-copy small{color:var(--muted);font-size:11px}.conversation-item time{color:var(--muted);font-size:9px}.account-bar{border-top:1px solid var(--line);background:#00000014;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 12px;display:grid}.account-bar span{min-width:0;display:grid}.account-bar strong,.account-bar small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.account-bar strong{font-size:12px}.account-bar small{color:var(--muted);font-size:10px}.account-bar button{cursor:pointer;width:32px;height:32px;color:var(--muted);background:0 0;border-radius:10px}.account-bar button:hover{background:var(--panel-soft);color:var(--text)}.main-panel{border-radius:20px;min-width:0;position:relative;overflow:hidden}.global-notice{z-index:20;color:#ffc4ce;cursor:pointer;background:#301620;border:1px solid #ff647c4d;border-radius:12px;max-width:600px;padding:11px 14px;position:absolute;top:16px;left:50%;transform:translate(-50%);box-shadow:0 12px 36px #00000040}.global-notice span{margin-left:12px}.content-page{height:100%;padding:clamp(22px,4vw,52px);overflow-y:auto}.content-header{justify-content:space-between;align-items:center;margin-bottom:28px;display:flex}.content-header h2{letter-spacing:-.035em;margin:0;font-size:clamp(28px,3vw,42px)}.count-pill{background:var(--panel-soft);color:var(--muted);border-radius:999px;padding:8px 11px;font-size:11px;font-weight:700}.add-friend-card{border:1px solid color-mix(in srgb, var(--accent) 22%, var(--line));background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 9%, transparent), #ffffff05);border-radius:18px;grid-template-columns:minmax(180px,.6fr) minmax(280px,1fr);align-items:center;gap:20px 28px;margin-bottom:30px;padding:22px;display:grid}.add-friend-card h3{margin-bottom:6px}.add-friend-card p{color:var(--muted);margin:0;font-size:13px}.add-friend-card form{grid-template-columns:minmax(0,1fr) auto;gap:10px;display:grid}.add-friend-card>.error-text,.add-friend-card>.success-text{grid-column:1/-1}.friend-section{margin-top:26px}.friend-section>h3{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:8px;margin-bottom:10px;font:800 11px/1 Inter,sans-serif;display:flex}.friend-section>h3 span{background:var(--panel-soft);border-radius:999px;place-items:center;min-width:20px;height:20px;padding:0 5px;font-size:9px;display:grid}.friend-list{border-top:1px solid var(--line)}.friend-row{border-bottom:1px solid var(--line);grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:13px;min-height:68px;display:grid}.friend-copy{gap:3px;display:grid}.friend-copy strong{font-size:14px}.friend-copy span{color:var(--muted);font-size:11px}.friend-actions{align-items:center;gap:8px;display:flex}.round-action{background:var(--panel-soft);width:34px;height:34px;color:var(--muted);cursor:pointer;border-radius:11px;font-weight:800}.round-action:hover{color:var(--text);background:color-mix(in srgb, var(--accent) 14%, var(--panel-soft))}.round-action.accept{color:var(--success)}.empty-state{text-align:center;color:var(--muted);place-items:center;padding:50px 20px;display:grid}.empty-state>div{background:var(--panel-soft);width:54px;height:54px;color:var(--accent);border-radius:18px;place-items:center;margin-bottom:14px;font-size:24px;display:grid}.empty-state h4{color:var(--text);margin-bottom:8px}.empty-state p{max-width:380px;font-size:13px;line-height:1.6}.welcome-panel{text-align:center;place-content:center;justify-items:center;height:100%;padding:30px;display:grid}.welcome-orb{border:1px solid color-mix(in srgb, var(--accent) 34%, transparent);background:color-mix(in srgb, var(--accent) 14%, transparent);width:96px;height:96px;color:var(--accent);box-shadow:0 0 70px color-mix(in srgb, var(--accent) 15%, transparent);border-radius:34px;place-items:center;margin-bottom:28px;font:800 38px/1 Space Grotesk,sans-serif;display:grid}.welcome-panel h2{margin:6px 0 10px;font-size:38px}.welcome-panel>p:last-child{color:var(--muted)}.chat-page{grid-template-rows:76px minmax(0,1fr) auto;height:100%;display:grid}.chat-header{border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--panel) 88%, transparent);align-items:center;gap:12px;padding:13px 20px;display:flex}.chat-header>div{gap:3px;min-width:0;display:grid}.chat-header strong{font-size:14px}.chat-header span{color:var(--muted);font-size:10px}.profile-chip{background:var(--panel-soft);color:var(--muted);cursor:default;border-radius:10px;margin-left:auto;padding:8px 11px}.mobile-back{background:var(--panel-soft);border-radius:10px;width:34px;height:34px;font-size:24px;display:none}.message-feed{scrollbar-width:thin;min-height:0;padding:26px 24px 18px;overflow-y:auto}.conversation-intro{padding:46px 10px 32px}.conversation-intro h2{margin:18px 0 8px;font-size:30px}.conversation-intro p{color:var(--muted)}.message{border-radius:10px;grid-template-columns:40px minmax(0,1fr);gap:12px;margin:0 -10px;padding:8px 10px;display:grid}.message:hover{background:#ffffff06}.message.grouped{padding-top:2px;padding-bottom:2px}.message.grouped:before{content:""}.message-body{min-width:0}.message-meta{align-items:baseline;gap:8px;margin-bottom:3px;display:flex}.message-meta strong{font-size:13px}.message-meta time{color:var(--muted);font-size:9px}.message-body p{color:color-mix(in srgb, var(--text) 91%, var(--muted));white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-size:14px;line-height:1.55}:root[data-compact=true] .message{padding-top:3px;padding-bottom:3px}:root[data-compact=true] .message-body p{line-height:1.35}.composer{background:linear-gradient(transparent, color-mix(in srgb, var(--panel) 90%, transparent) 28%);padding:10px 18px 18px}.composer>div{border:1px solid var(--line);background:var(--panel-strong);border-radius:16px;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:9px;padding:8px;display:grid}.composer textarea{min-height:38px;max-height:140px;box-shadow:none;resize:none;background:0 0;border:0;padding:9px 7px;line-height:1.4}.attach-button{background:var(--panel-soft);width:38px;height:38px;color:var(--muted);border-radius:11px;font-size:20px}.send-button{background:var(--accent);color:#fff;cursor:pointer;border-radius:11px;min-height:38px;padding:0 14px;font-weight:800}.send-button:disabled{opacity:.45;cursor:not-allowed}.composer-error{color:var(--danger);margin:0 0 6px 8px;font-size:11px}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#020308b3;justify-content:flex-end;padding:10px;display:flex;position:fixed;inset:0}.settings-panel{border:1px solid var(--line);background:var(--panel-strong);border-radius:20px;width:min(560px,100%);height:100%;overflow-y:auto;box-shadow:-24px 0 80px #0000004d}.settings-panel>header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:22px 24px;display:flex}.settings-panel>header h2{margin:0}.settings-panel>header button{background:var(--panel-soft);cursor:pointer;border-radius:11px;width:36px;height:36px}.settings-panel form{padding:22px}.profile-preview{border:1px solid var(--line);background:#0000001f;border-radius:18px;min-height:200px;margin-bottom:24px;padding:80px 20px 20px;position:relative;overflow:hidden}.preview-banner{background:linear-gradient(120deg, var(--accent), color-mix(in srgb, var(--accent) 25%, #00c5b0 75%));height:105px;position:absolute;inset:0 0 auto}.profile-preview>.avatar{border:5px solid var(--panel-strong);position:relative}.profile-preview>div:last-child{margin-top:10px;display:grid}.profile-preview strong{font-size:20px}.profile-preview span,.profile-preview p{color:var(--muted);font-size:12px}.profile-preview p{margin:10px 0 0;line-height:1.5}.settings-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.full-field{grid-column:1/-1}.toggle-row{border:1px solid var(--line);border-radius:12px;flex-direction:row;justify-content:space-between;align-items:center;min-height:68px;padding:12px;display:flex}.toggle-row input{width:20px;height:20px;accent-color:var(--accent)}.settings-message{background:var(--panel-soft);color:var(--muted);border-radius:10px;margin:18px 0 0;padding:11px;font-size:12px}.settings-actions{border-top:1px solid var(--line);justify-content:space-between;gap:12px;margin-top:22px;padding-top:22px;display:flex}@media (width<=980px){.app-shell{grid-template-columns:64px 250px minmax(0,1fr);gap:7px;padding:7px}.rail{border-radius:16px;padding:8px}.sidebar,.main-panel{border-radius:16px}.add-friend-card{grid-template-columns:1fr}}@media (width<=760px){body{overflow:hidden}.auth-page{grid-template-columns:1fr}.auth-brand{min-height:42vh;padding:42px 24px}.auth-brand h1{font-size:44px}.auth-brand>p:not(.eyebrow),.feature-pills{display:none}.auth-card-wrap{border-left:0;border-top:1px solid var(--line);padding:20px}.auth-card{padding:25px}.app-shell{grid-template-columns:56px minmax(0,1fr);gap:5px;padding:5px}.rail{grid-column:1}.sidebar{grid-column:2}.main-panel{grid-column:2;display:none}.app-shell.chat-open .sidebar{display:none}.app-shell.chat-open .main-panel,.mobile-back{display:block}.content-page{padding:24px 18px}.add-friend-card form{grid-template-columns:1fr}.friend-row{grid-template-columns:40px minmax(0,1fr) auto}.friend-row .avatar{width:40px!important;height:40px!important}.friend-actions .button.small{width:34px;padding:0;font-size:0}.friend-actions .button.small:after{content:">";font-size:15px}.message-feed{padding:20px 14px}.composer{padding:8px 10px 12px}.profile-chip{display:none}.settings-grid{grid-template-columns:1fr}.full-field{grid-column:auto}}@media (width<=430px){.auth-brand{min-height:34vh}.auth-brand h1{font-size:34px}.auth-card-wrap{padding:10px}.auth-card{border-radius:18px;padding:22px}.app-shell{grid-template-columns:50px minmax(0,1fr)}.rail{padding:5px}.brand-mark{border-radius:13px;width:40px;height:40px}.avatar-button .avatar{width:38px!important;height:38px!important}.sidebar-header{height:68px}.content-header{align-items:flex-end}.friend-actions{gap:4px}.round-action{width:31px;height:31px}.send-button{width:40px;padding:0;font-size:0}.send-button:after{content:">";font-size:17px}}
