/* Friendship.chat: quick entry, clear conversations and a calm reading surface. */
:root{--green:#285ce0;--ink:#172844;--line:#e3e8f1;--paper:#f7f9fd;--muted:#65748b;color-scheme:light}
body{background:#f7f9fd;color:var(--ink)}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #719cff;outline-offset:3px}button{transition:background-color .15s,color .15s}.welcome{background:#f7f9fd}.welcome-story{background:#142443;color:#fff;position:relative;overflow:hidden}.welcome-story:after{content:'';position:absolute;width:430px;height:430px;border:1px solid #ffffff12;border-radius:50%;right:-220px;bottom:-150px;pointer-events:none}.welcome-story .brand,.welcome-story .brand-dot,.welcome-story .story-copy h1{color:#fff}.welcome-story .eyebrow{color:#a7c0f4}.welcome-story .story-copy h1 em{color:#a7c0f4}.welcome-story .story-copy>p,.welcome-story footer{color:#becbe0}.entry-panel{background:#f7f9fd}.entry-card{max-width:410px}.entry-card h2{color:#142443}.input-wrap{border-color:#d8e1f1;border-radius:12px}.primary{background:#285ce0;color:#fff}.primary:hover{background:#204dbe}.join-button{box-shadow:0 5px 14px #285ce022}.bubble-a{background:#fff;color:#233657}.bubble-b{background:#285ce0;color:#fff}.art-orbit{border-color:#ffffff25}.art-note,.art-spark{color:#adc6fb}.app-shell{grid-template-columns:256px minmax(0,1fr) 276px;background:#fff}.sidebar{background:#f5f7fb;border-color:#e3e8f1;padding-top:25px}.sidebar>.brand{margin-bottom:28px;color:#172844}.brand-dot{color:#285ce0}.nav-item.active,.inbox-entry.active{background:#e7efff}.nav-item:hover,.inbox-entry:hover{background:#edf2fa}.room-icon{background:#fff;color:#285ce0}.conversation-search{display:block;margin:0 4px 12px}.conversation-search input{width:100%;min-width:0;border:1px solid #dce4ef;border-radius:9px;padding:10px 11px;background:#fff;color:#253854;font:inherit;font-size:12px}.section-label{color:#67758b;margin-top:25px}.inbox-entry strong{font-size:13px}.inbox-entry small,.nav-item small{color:#69798e}.subtle{color:#5d7090}.sidebar-bottom{border-color:#e3e8f1}.chat-header{height:82px;background:#fff;border-color:#e3e8f1}.room-heading p{color:#687b94}.header-icon{color:#285ce0;border-color:#e1e8f4}.message-area{background:#fff;padding-top:14px}.room-intro{border-color:#e3e8f1;padding-bottom:24px;margin-bottom:28px}.room-intro h2{font-size:29px;color:#162b4e}.room-intro>p{color:#65778e}.intro-spark{color:#285ce0}.room-pills span{color:#3c5f96;border-color:#d9e5fa;background:#f7faff}.starter-button{font-size:12px;font-weight:600;color:#285ce0;background:#edf3ff;border-radius:9px;padding:11px 14px;margin-top:18px}.starter-button:hover{background:#dfeaff}.message-body{color:#34465f;font-size:14px}.message-row.mine .message-body{background:#edf3ff;color:#213d70}.message-meta time{color:#718098}.message-actions button{font-size:11px;color:#5a7195}.message-actions .retry-send{color:#285ce0;font-weight:700}.quote{background:#f4f7fc;border-color:#86a8ee;color:#536a8c}.composer-region{background:#fff;border-top:1px solid #edf0f5}.composer{border-color:#dce4f0;box-shadow:0 4px 20px #14244305}.composer textarea{font-size:14px;color:#243953}.send-button{background:#285ce0;color:#fff}.composer-caption{color:#6a7c94}.members-panel{background:#fafbfe;border-color:#e3e8f1;padding-top:25px}.member-search{border-color:#dce4f0;background:#fff}.member-search input{color:#243953;font-size:12px}.member-entry strong{font-size:12px}.member-entry small{color:#708099}.members-top h2>span{background:#e8effb;color:#496891}.people-filters{display:flex;gap:5px;margin-top:12px}.people-filters button{font-size:11px;padding:8px 11px;border-radius:8px;color:#5c7295}.people-filters button.selected{background:#e7efff;color:#2356c7;font-weight:700}.room-note{background:#f0f5ff;border-color:#dfe9fb;color:#224579}.room-note p{color:#5c7295}.room-note>span{color:#537ed9}.typing-status{color:#285ce0}.receipt{color:#647995}.receipt.read{color:#1267d6}.discovery{background:#f7f9fd}.discovery p,.discovery li{color:#536581}.discovery a{color:#285ce0}.attachment-link{color:#285ce0;border-color:#cedcf5}.error-banner{background:#fff0ed;color:#9d3325}.reply-preview{background:#edf3ff}.request-banner{background:#edf3ff}.empty-state{color:#687c98}.connection{color:#607796}.self-card small,.member-group-label,.members-footer{color:#71829a}dialog{background:#fff;border-color:#e0e7f2;color:#172844}dialog p{color:#61758e}#toast{background:#172b50}.welcome .session-note{color:#62738c}
html[data-theme=dark]{color-scheme:dark;--ink:#e7edf8;--line:#2a3953;--paper:#142037;--muted:#a4b3cb}html[data-theme=dark] body,html[data-theme=dark] .app-shell,html[data-theme=dark] .chat-main,html[data-theme=dark] .message-area,html[data-theme=dark] .chat-header,html[data-theme=dark] .composer-region{background:#101b2e;color:#e7edf8}html[data-theme=dark] .sidebar,html[data-theme=dark] .members-panel{background:#142137;border-color:#2a3953}html[data-theme=dark] .nav-item.active,html[data-theme=dark] .inbox-entry.active,html[data-theme=dark] .people-filters button.selected{background:#243d66;color:#e0eaff}html[data-theme=dark] .nav-item:hover,html[data-theme=dark] .inbox-entry:hover{background:#1d304e}html[data-theme=dark] .sidebar .brand,html[data-theme=dark] .room-heading h1,html[data-theme=dark] .room-intro h2{color:#edf3ff}html[data-theme=dark] .room-icon,html[data-theme=dark] .conversation-search input,html[data-theme=dark] .member-search,html[data-theme=dark] .composer,html[data-theme=dark] dialog{background:#182943;border-color:#344862;color:#e4edfc}html[data-theme=dark] input,html[data-theme=dark] textarea{color:#e4edfc}html[data-theme=dark] .message-body{color:#d3dff1}html[data-theme=dark] .message-row.mine .message-body{background:#234172;color:#edf4ff}html[data-theme=dark] .quote,html[data-theme=dark] .reply-preview,html[data-theme=dark] .request-banner,html[data-theme=dark] .room-note{background:#1c3152;border-color:#344b71;color:#c0d3f3}html[data-theme=dark] .room-heading p,html[data-theme=dark] .room-intro>p,html[data-theme=dark] .room-note p,html[data-theme=dark] .member-entry small,html[data-theme=dark] .inbox-entry small,html[data-theme=dark] .subtle,html[data-theme=dark] dialog p,html[data-theme=dark] .empty-state,html[data-theme=dark] .message-actions button{color:#a7b9d6}html[data-theme=dark] .room-pills span,html[data-theme=dark] .starter-button{background:#1c3152;border-color:#344b71;color:#b6d0ff}html[data-theme=dark] .chat-header,html[data-theme=dark] .room-intro,html[data-theme=dark] .composer-region,html[data-theme=dark] .sidebar-bottom{border-color:#2a3953}html[data-theme=dark] .entry-panel,html[data-theme=dark] .discovery{background:#142137}html[data-theme=dark] .entry-card h2,html[data-theme=dark] .discovery h2,html[data-theme=dark] .discovery h3{color:#edf3ff}html[data-theme=dark] .input-wrap{background:#182943;border-color:#344862}html[data-theme=dark] .muted,html[data-theme=dark] .discovery p,html[data-theme=dark] .discovery li{color:#b2c2da}html[data-theme=dark] .receipt.read{color:#72b1ff}
@media(max-width:1080px){.app-shell{grid-template-columns:228px minmax(0,1fr)}.members-panel.open{top:82px}}@media(max-width:700px){.app-shell{grid-template-columns:minmax(0,1fr)}.chat-header{height:74px}.sidebar.open,.members-panel.open{top:74px}.header-actions{gap:5px}.composer textarea{font-size:16px}.chat-header .room-heading p{max-width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-actions{flex-wrap:wrap}.room-intro h2{font-size:27px}.welcome-story{min-height:290px}.starter-button{font-size:12px}.conversation-search input{font-size:16px}}@media(prefers-reduced-motion:reduce){button{transition:none}}


/* Persistent mobile navigation leaves the composer and safe area visible. */
.mobile-nav,.panel-backdrop{display:none}
@media(max-width:1080px){.panel-backdrop:not([hidden]){display:block;position:fixed;inset:82px 0 0;background:#101b2e55;z-index:3}.members-panel.open{z-index:4}}
@media(min-width:701px) and (max-width:1080px){.panel-backdrop:not([hidden]){left:228px}}
@media(max-width:700px){
 .app-shell{grid-template-rows:minmax(0,1fr) auto}.chat-main{min-height:0}
 .mobile-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);background:#fff;padding:4px 8px max(4px,env(safe-area-inset-bottom));z-index:6}
 .mobile-nav button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:52px;border-radius:10px;font-size:11px;color:#65748b}
 .mobile-nav button>span:first-child{font-size:21px;line-height:24px}.mobile-nav button[aria-pressed=true]{background:#edf3ff;color:#285ce0;font-weight:700}
 .mobile-nav .unread-badge{position:absolute;top:2px;right:8%;font-size:10px;min-width:18px;height:18px}
 .sidebar.open,.members-panel.open{bottom:calc(64px + env(safe-area-inset-bottom));width:min(310px,calc(100vw - 48px))}
 .sidebar.open{padding-top:16px}.sidebar.open>.brand{margin-bottom:14px}.sidebar-bottom{max-height:45%;overflow:auto;flex-shrink:0}
 .panel-backdrop:not([hidden]){inset:74px 0 calc(64px + env(safe-area-inset-bottom))}.composer-region{padding-bottom:10px}
 #toast{bottom:calc(80px + env(safe-area-inset-bottom))}.header-actions #sound-button{display:none}
 html[data-theme=dark] .mobile-nav{background:#142137}html[data-theme=dark] .mobile-nav button{color:#a7b9d6}html[data-theme=dark] .mobile-nav button[aria-pressed=true]{background:#243d66;color:#e0eaff}
}

.account-login{display:block;margin:18px auto 0;font-size:12px;color:var(--green)}.account-form input:not([type=checkbox]){display:block;width:100%;border:1px solid var(--line);border-radius:9px;padding:12px;background:transparent;color:inherit}.account-form .consent{margin-top:18px;align-items:flex-start}.account-form .form-error{overflow-wrap:anywhere}.account-form+.text-button{display:block;margin-top:18px;font-size:12px}
