:root{--h:151;--s:30%;--page:#eaece6;--surface:#fcfcf8;--panel:#f0f2e9;--card:#fff;--ink:#283d39;--muted:#5f7368;--line:#d7dfd1;--subtle:#edf1e8;--selected:#e2eddf;--accent:hsl(var(--h) var(--s) 31%);--solid:hsl(var(--h) var(--s) 31%);--error:#a53e30;color-scheme:light}
:root[data-theme=ocean]{--h:208;--s:52%}:root[data-theme=lavender]{--h:267;--s:35%}:root[data-theme=rose]{--h:335;--s:42%}:root[data-theme=sunset]{--h:25;--s:65%}
:root:not([data-theme=forest]){--page:hsl(var(--h) 23% 91%);--panel:hsl(var(--h) 30% 95%);--subtle:hsl(var(--h) 30% 94%);--selected:hsl(var(--h) 35% 89%);--line:hsl(var(--h) 20% 83%)}
:root[data-mode=dark]{--page:hsl(var(--h) 16% 8%);--surface:hsl(var(--h) 14% 12%);--panel:hsl(var(--h) 14% 15%);--card:hsl(var(--h) 12% 19%);--ink:#edf2ee;--muted:#b5c4bb;--line:hsl(var(--h) 12% 30%);--subtle:hsl(var(--h) 13% 21%);--selected:hsl(var(--h) 20% 27%);--accent:hsl(var(--h) 43% 72%);--error:#ffaaa0;color-scheme:dark}
body{background:var(--page);color:var(--ink)}.shell,.chat,.login-panel{background:var(--surface)}.sidebar{background:var(--panel);border-color:var(--line)}.brand,.brand-dot,.header-title h2,.empty-state h3,dialog{color:var(--ink)}.sidebar-intro p,.eyebrow,.family-list small,.sidebar-footer>span,.header-title p,.connection,.login-panel>p,.invite-card p,.login-note,.message-author,.message-meta,.compose-footer,.attachment-menu p,.media-types,.media-types>span,dialog p,dialog dd,dialog ol,.conversation-choice small,.selected-attachment span{color:var(--muted)}
.chat-header,.composer,.invite-card,.attachment-menu,.conversation-choice,.photo-viewer{background:var(--card);border-color:var(--line)}.sidebar-footer,.date-label::before,.date-label::after,.privacy-note{border-color:var(--line)}.date-label{color:var(--muted)}.date-label::before,.date-label::after{background:var(--line)}.room-avatar,.invite-icon,.welcome-art>span,.selected-attachment{background:var(--subtle);color:var(--accent);border-color:var(--line)}.orbit{border-color:var(--surface)}
.bubble{background:var(--subtle);color:var(--ink);border-color:var(--line)}.own .bubble,.primary,.send-button{background:var(--solid);border-color:var(--solid);color:white}.secondary,.icon-button:hover{background:var(--subtle);color:var(--accent)}.icon-button,.attach-button,.text-button,.read-receipt{color:var(--accent)}.composer textarea{color:var(--ink)}.composer textarea::placeholder{color:var(--muted)}.compose-area{background:var(--surface)}.composer:focus-within{border-color:var(--accent)}.jump-latest{background:var(--card);color:var(--ink);border-color:var(--line)}.conversation-choice{color:var(--ink)}.conversation-choice[aria-current=true]{background:var(--selected);border-color:var(--accent)}.unread-count{background:var(--solid);color:#fff}.notice{color:var(--accent)}.error,.retry{color:var(--error)!important}dialog{background:var(--surface);border-color:var(--line)}dialog::backdrop{background:#08151088}.photo-thumb{background:var(--subtle)}#new-chat-form input,#new-chat-form select{background:var(--card);color:var(--ink);border-color:var(--line)}#new-chat-form fieldset{border-color:var(--line)}
.avatar{padding:0;overflow:hidden;background:var(--subtle)!important}.avatar img{display:block;width:100%;height:100%;object-fit:cover}.chat-header .icon-button{flex-shrink:0}
details{border:1px solid var(--line);border-radius:12px;margin:10px 0;background:var(--card);padding:0 15px}summary{cursor:pointer;min-height:48px;padding:14px 0;font-size:14px;font-weight:650;color:var(--ink)}summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}details[open]{padding-bottom:12px}details[open]>summary{border-bottom:1px solid var(--line);margin-bottom:10px}details details{background:var(--surface)}details p:last-child{margin-bottom:6px}#room-details{max-width:540px}
#user-settings{max-width:660px;padding:28px}.settings-intro{margin-top:-12px}.setting-section{border-top:1px solid var(--line);padding:19px 0 9px}.setting-section h3{margin:0 0 17px;font-size:17px}.setting-section label,.theme-fieldset legend{display:block;font-size:13px;font-weight:650;margin:10px 0}.setting-section select{font:inherit;width:100%;padding:12px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:10px}.setting-hint{font-size:12px!important;line-height:1.6!important}.theme-fieldset{padding:0;border:0;margin:17px 0 0}.theme-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.theme-choice{display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--card);border:2px solid var(--line);border-radius:12px;padding:10px 2px;color:var(--ink);font-size:12px}.theme-choice[aria-pressed=true],.animal-choice[aria-pressed=true]{border-color:var(--accent);background:var(--selected)}.theme-swatch{height:25px;width:25px;border-radius:50%;box-shadow:inset 0 0 0 1px #0001}.theme-swatch.forest{background:#3c7656}.theme-swatch.ocean{background:#3376ad}.theme-swatch.lavender{background:#8564b4}.theme-swatch.rose{background:#b75f86}.theme-swatch.sunset{background:#c88445}
.profile-current{display:flex;align-items:center;gap:14px;margin-bottom:18px}.profile-current>img{width:64px;height:64px;object-fit:cover;border-radius:20px}.profile-current p{margin:4px 0;font-size:12px}.animal-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:16px 0}.animal-choice{min-width:0;position:relative;padding:5px 3px 7px;border:2px solid var(--line);border-radius:13px;background:var(--card);color:var(--ink);font-size:11px}.animal-choice img{display:block;width:100%;aspect-ratio:1;border-radius:9px;margin-bottom:5px}.animal-choice[aria-pressed=true]::after{content:'✓';position:absolute;right:1px;top:1px;border-radius:50%;background:var(--solid);color:#fff;width:17px;height:17px;line-height:17px}.upload-avatar-label{display:inline-block!important;cursor:pointer}.upload-avatar-label:has(+input:focus-visible){outline:3px solid var(--accent)}#avatar-upload-preview{padding:15px;background:var(--subtle);border-radius:14px}#avatar-preview{display:block;width:128px;height:128px;object-fit:cover;border-radius:24px;margin:0 auto 15px}#avatar-upload-preview>div{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.notification-row{display:flex;align-items:center;justify-content:space-between;gap:15px}.notification-row p{font-size:12px;margin:5px 0}.notification-toggle{min-width:70px;min-height:44px;border-radius:24px;border:2px solid var(--line);background:var(--subtle);color:var(--ink);font-weight:700}.notification-toggle[aria-checked=true]{background:var(--solid);border-color:var(--solid);color:white}#settings-status:empty{display:none}#settings-status{color:var(--accent);font-size:13px}#notification-status{font-size:13px}
@media(max-width:600px){#user-settings{padding:22px 16px}.theme-choices{gap:5px}.theme-choice{font-size:10px;padding:10px 0}.animal-grid{gap:5px}.animal-choice{font-size:9px;padding:3px 2px 6px;border-radius:10px}.animal-choice img{border-radius:7px}.chat-header{gap:5px}.header-title h2{max-width:42vw}.chat-header .icon-button{width:32px}#room-details{padding:25px 20px}}
