/* Keep the document stationary; scroll only the timeline or the active page. */
html,body{height:100%;min-height:0}body{overscroll-behavior:none}#app{min-height:0}
#shell.render-workspace>#chat-area{min-width:0;min-height:0}
#shell.render-workspace.chat-open>#chat-area{display:flex;flex-direction:column;overflow:hidden}
#shell.render-workspace.chat-open .chat-head,#shell.render-workspace.chat-open .composer-shell{flex:0 0 auto}
#shell.render-workspace.chat-open .messages-wrap{flex:1 1 0%;min-height:0;height:0;overflow:hidden;display:flex;flex-direction:column}
#shell.render-workspace.chat-open .chat-timeline{flex:1 1 0%;min-height:0;height:0;overflow-y:auto}
#chat-area>.panel-page{min-height:0;overflow-y:auto;overscroll-behavior:contain}
@media(max-width:850px){html,body{overflow:hidden;width:100%}#app{position:fixed;left:0;right:0;top:var(--r9-viewport-top,0px);height:var(--rodnie-visible-height,100dvh);overflow:hidden}#shell.app-shell.render-workspace{height:100%;min-height:0;max-height:100%;padding:0;gap:0}#shell.app-shell.render-workspace>.people-list{height:100%;min-height:0;max-height:100%}#shell.app-shell.render-workspace.chat-open:not(.mode-open){height:100%;grid-template-rows:minmax(0,1fr)}#shell.app-shell.render-workspace.chat-open:not(.mode-open)>#chat-area{height:100%;min-height:0;max-height:100%;padding:0;grid-area:1/1}#shell.app-shell.render-workspace.mode-open>#chat-area{min-height:0;height:100%;overflow:hidden}#shell.render-workspace.chat-open .composer-shell{margin:0;padding:6px 8px calc(6px + env(safe-area-inset-bottom))}}
#shell #list-filters{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-width:100%;min-width:0;scrollbar-width:thin;gap:6px;overscroll-behavior-x:contain;scroll-padding-inline:10px}#shell #list-filters>.chip{flex:0 0 auto;white-space:nowrap}
.r9-folder-row{display:flex;flex-wrap:wrap;align-items:center;gap:7px;border-bottom:1px solid var(--line);padding:12px 0}.r9-folder-row b{margin-right:auto}.r9-folder-chats{max-height:45dvh;overflow:auto;display:grid;gap:8px}.r9-folder-chats label{display:flex;align-items:center;gap:9px;padding:7px}
#chat-person{cursor:pointer}.r9-full-profile .ux-profile-cover{min-height:150px}.r9-profile-avatar{padding:0;background:transparent;border:0;border-radius:50%;color:inherit;display:block}.r9-avatar-view>img{display:block;max-width:100%;max-height:70dvh;margin:auto;object-fit:contain;border-radius:12px}.r9-avatar-view nav{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:14px}.r9-avatar-empty{text-align:center;padding:20px}.r9-avatar-empty .avatar{width:120px;height:120px;font-size:44px;margin:auto}
.avatar[data-avatar-tone]{background:linear-gradient(145deg,var(--avatar-a,#496c95),var(--avatar-b,#2d4566));color:#fff}.avatar-fallback svg{display:block;width:65%;height:65%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
#shell.render-workspace #timeline{padding-left:48px;padding-right:36px}#shell.render-workspace #timeline .message{padding-right:12px;max-width:calc(100% - 12px);touch-action:pan-y}
#shell.render-workspace #timeline .message>.msg-trigger{display:grid!important;place-items:center;position:absolute;top:50%;right:-30px;left:auto;transform:translateY(-50%);width:28px;height:36px;min-height:36px;padding:0;font-size:25px;line-height:1;background:var(--r9-surface,var(--glass));color:var(--r9-surface-text,var(--text));border:1px solid var(--line);border-radius:12px;opacity:0;pointer-events:none;transition:opacity .12s}
#shell.render-workspace #timeline .message.own>.msg-trigger{right:auto;left:-30px}
#shell.render-workspace #timeline .message:is(:hover,:focus-within,.r9-actions-visible)>.msg-trigger{opacity:1;pointer-events:auto}
#shell.render-workspace #timeline .message.r9-swiping{transform:translateX(var(--r9-swipe,0px));transition:none}
#shell.render-workspace #timeline .message.r9-swiping::after{content:attr(data-swipe-hint);position:absolute;top:45%;right:calc(100% + 10px);white-space:nowrap;border-radius:14px;padding:5px 8px;font-size:11px;color:var(--r9-surface-text,var(--text));background:var(--r9-surface,var(--glass))}
#shell.render-workspace #timeline .message.r9-swiping[data-swipe-direction=left]::after{right:auto;left:calc(100% + 10px)}
#shell #timeline .r9-text-collapsed{max-height:var(--r9-text-limit,8.4em);overflow:hidden}#shell #timeline .r9-text-toggle{display:block;width:max-content;padding:4px 0 0;border:0;background:none;color:inherit;text-decoration:underline;font:inherit;font-size:.88em;min-height:30px}
#shell.render-workspace #timeline .message:has(.ux-sticker-message){background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important;padding:0!important}#shell #timeline .message:has(.ux-sticker-message) .bubble-body{background:transparent}#shell #timeline .message:has(.ux-sticker-message) .msg-meta{width:max-content;margin:4px 0 0 auto;padding:3px 7px;border-radius:10px;background:var(--r9-surface,var(--glass));color:var(--r9-surface-text,var(--text))}#shell #timeline .ux-sticker-message{background:transparent!important;border:0!important;padding:0;box-shadow:none;width:min(55vw,220px)}#shell #timeline .ux-sticker-message :is(img,video,.art-sticker-svg){width:100%;height:auto;max-height:250px;object-fit:contain}#shell #timeline .message-avatar>.avatar{width:100%;height:100%;font-size:11px}
.family-chat-fold{width:min(340px,67vw);max-width:100%;border-radius:12px;overflow:hidden}.family-chat-fold>summary{display:flex;align-items:center;justify-content:space-between;gap:9px;cursor:pointer;list-style:none;padding:10px;background:var(--r9-surface,var(--glass));color:var(--r9-surface-text,var(--text));border:1px solid var(--line);border-radius:11px}.family-chat-fold>summary::-webkit-details-marker{display:none}.family-chat-fold>summary::after{content:'⌄';flex:none}.family-chat-fold[open]>summary::after{content:'⌃'}.family-chat-fold>summary small{display:block;font-size:11px;font-weight:400}.family-chat-fold>summary time{font-size:10px;max-width:85px;text-align:right}.family-chat-fold .family-card{width:100%;max-width:100%;min-width:0;box-sizing:border-box;border:0}.family-success{color:#42c788}.family-expired{color:#f16677}
.r9-recording{position:fixed;z-index:2200;left:50%;bottom:calc(90px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(380px,calc(100vw - 24px));padding:14px;border-radius:20px;border:1px solid #9aabc566;background:var(--r9-surface,#142036);color:var(--r9-surface-text,#fff);box-shadow:0 10px 60px #0007}.r9-recording-preview{width:min(230px,55vw);aspect-ratio:1;margin:0 auto 10px;border-radius:50%;overflow:hidden;background:#05070c}.r9-recording-preview video{width:100%;height:100%;object-fit:cover;display:block}.r9-recording-preview video.front{transform:scaleX(-1)}.r9-recording-status{display:flex;align-items:center;justify-content:center;gap:8px}.r9-recording-status i{width:9px;height:9px;background:#ff4c69;border-radius:50%}.r9-recording-status strong{font-variant-numeric:tabular-nums}.r9-recording p{text-align:center;font-size:12px;margin:8px}.r9-recording-actions{display:flex;gap:7px;justify-content:center}.r9-recording-actions button{border:1px solid var(--line);padding:8px;border-radius:10px;background:transparent;color:inherit;min-height:40px}.r9-recording.cancelled{border-color:#ff687d}.r9-camera-facing{font-size:24px}
.r9-palette-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:9px;padding:0;border:0}.r9-palette-grid legend{margin-bottom:8px}.r9-palette-grid label{border:1px solid var(--line);border-radius:12px;display:grid;padding:8px;gap:6px;position:relative;font-size:12px}.r9-palette-grid label:has(:checked){outline:2px solid var(--r9-accent,#9caaff);outline-offset:1px}.r9-palette-sample{height:32px;border-radius:7px}.r9-palette-grid input{position:absolute;opacity:0}.r9-color{display:flex;align-items:center;gap:8px;padding:8px 0}.r9-color input[type=color]{margin-left:auto;min-width:44px;width:44px;padding:2px}.r9-appearance-sample{background:var(--r9-surface);color:var(--r9-surface-text);padding:15px;border:1px solid var(--line);border-radius:14px}.r9-bubble-sample{display:block;width:max-content;max-width:100%;padding:9px;border-radius:12px;background:var(--r9-bubble);color:var(--r9-bubble-text);margin:9px 0}
.r9-content-image{margin:0}.r9-content-image img{display:block;max-width:100%;width:100%;height:auto;max-height:65dvh;object-fit:contain;border-radius:10px}.r9-content-image figcaption{font-size:.85rem;margin-top:6px;white-space:pre-wrap}.r9-section-blocks{margin:10px 0;flex:0 0 auto}.r9-section-blocks .studio-page{padding:12px}
:root[data-palette]{--text:var(--r9-surface-text)!important;--glass:var(--r9-surface)!important;--muted:color-mix(in srgb,var(--r9-surface-text) 75%,var(--r9-surface))!important;--studio-muted:var(--muted)!important;--render-panel:var(--r9-surface)!important;--studio-surface:var(--r9-surface)!important;--studio-panel:var(--r9-surface)!important;--studio-ink:var(--r9-surface-text)!important;--studio-text:var(--r9-surface-text)!important;--studio-border:var(--r9-line)!important;--studio-line:var(--r9-line)!important;--bubble-out:var(--r9-bubble)!important;--studio-selected:color-mix(in srgb,var(--r9-accent) 20%,var(--r9-surface))!important;--studio-active:color-mix(in srgb,var(--r9-accent) 20%,var(--r9-surface))!important;--studio-accent:var(--r9-accent)!important}
:root[data-palette] :is(.ux-dialog,.dialog,.sheet,.ux-settings-content,.ux-setting-block,.studio-page,.rodnie-studio,.r9-folder-row){background-color:var(--r9-surface)!important;color:var(--r9-surface-text)!important}
:root[data-palette] :is(.ux-dialog,.dialog,.sheet,.ux-settings-content,.rodnie-studio) :is(input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea){background-color:var(--r9-surface)!important;color:var(--r9-surface-text)!important;border-color:var(--r9-line)!important}
:root[data-palette] :is(.primary-btn,.send-btn){background:var(--r9-accent)!important;color:var(--r9-accent-text)!important;border-color:var(--r9-accent)!important}:root[data-palette] .secondary-btn{background:var(--r9-surface)!important;color:var(--r9-surface-text)!important;border-color:var(--r9-line)!important}
:root[data-palette] #shell.render-workspace :is(.chat-head,.composer-shell,.composer,.mobile-nav,.list-head,.ux-topbar,#list-filters){background:var(--r9-surface)!important;color:var(--r9-surface-text)!important}:root[data-palette] #shell .composer textarea{background:transparent!important;color:var(--r9-surface-text)!important}:root[data-palette] #shell #timeline .message.own{background:var(--r9-bubble)!important;color:var(--r9-bubble-text)!important}:root[data-palette] #shell #timeline .message.peer{background:var(--r9-surface)!important;color:var(--r9-surface-text)!important}:root[data-palette] :is(.main-menu-nav,.ux-settings-nav,.r9-recording,.rodnie-store) :is(p,small,span,b,h2,h3,label){color:inherit}:root[data-palette] #shell #timeline .message:has(.ux-sticker-message){background:transparent!important;border:0!important}
@media(prefers-reduced-motion:reduce){#timeline .message>.msg-trigger{transition:none}}
@media(max-width:850px){#app,#shell.app-shell.render-workspace,#shell.app-shell.render-workspace>#chat-area{overflow:clip}}

.avatar[data-avatar-tone="0"]{--avatar-a:#496c95;--avatar-b:color-mix(in srgb,#496c95 65%,#000)}.avatar[data-avatar-tone="1"]{--avatar-a:#657091;--avatar-b:color-mix(in srgb,#657091 65%,#000)}.avatar[data-avatar-tone="2"]{--avatar-a:#45837d;--avatar-b:color-mix(in srgb,#45837d 65%,#000)}.avatar[data-avatar-tone="3"]{--avatar-a:#797294;--avatar-b:color-mix(in srgb,#797294 65%,#000)}.avatar[data-avatar-tone="4"]{--avatar-a:#967364;--avatar-b:color-mix(in srgb,#967364 65%,#000)}.avatar[data-avatar-tone="5"]{--avatar-a:#4c7f9d;--avatar-b:color-mix(in srgb,#4c7f9d 65%,#000)}.avatar[data-avatar-tone="6"]{--avatar-a:#85784a;--avatar-b:color-mix(in srgb,#85784a 65%,#000)}.avatar[data-avatar-tone="7"]{--avatar-a:#658669;--avatar-b:color-mix(in srgb,#658669 65%,#000)}.avatar[data-avatar-tone="8"]{--avatar-a:#926d83;--avatar-b:color-mix(in srgb,#926d83 65%,#000)}.avatar[data-avatar-tone="9"]{--avatar-a:#666a79;--avatar-b:color-mix(in srgb,#666a79 65%,#000)}.avatar[data-avatar-tone="10"]{--avatar-a:#4c8493;--avatar-b:color-mix(in srgb,#4c8493 65%,#000)}.avatar[data-avatar-tone="11"]{--avatar-a:#787d59;--avatar-b:color-mix(in srgb,#787d59 65%,#000)}.avatar[data-avatar-tone="12"]{--avatar-a:#7a70a4;--avatar-b:color-mix(in srgb,#7a70a4 65%,#000)}.avatar[data-avatar-tone="13"]{--avatar-a:#9a6b71;--avatar-b:color-mix(in srgb,#9a6b71 65%,#000)}.avatar[data-avatar-tone="14"]{--avatar-a:#5a7196;--avatar-b:color-mix(in srgb,#5a7196 65%,#000)}.avatar[data-avatar-tone="15"]{--avatar-a:#6c858a;--avatar-b:color-mix(in srgb,#6c858a 65%,#000)}
/* Use the selected palette for navigation and selection as well as forms. */
:root[data-palette] #shell.render-workspace :is(.people-list,.rail,.ux-chat-details,.ux-detail-card){background:var(--r9-surface)!important;color:var(--r9-surface-text)!important}
:root[data-palette] :is(.main-menu-nav,.ux-settings-nav) button{background:var(--r9-surface)!important;color:var(--r9-surface-text)!important;border-color:var(--r9-line)!important}
:root[data-palette] #shell .chip{background:var(--r9-surface)!important;color:var(--r9-surface-text)!important;border-color:var(--r9-line)!important}
:root[data-palette] #shell .chip.on{background:var(--r9-accent)!important;color:var(--r9-accent-text)!important;border-color:var(--r9-accent)!important}
:root[data-palette] #shell :is(.rail,.mobile-nav) button{color:var(--r9-surface-text)!important}
:root[data-palette] #shell :is(.rail,.mobile-nav) button.active,:root[data-palette] .ux-settings-nav button.active,:root[data-palette] #shell .chat-row.selected{background:color-mix(in srgb,var(--r9-accent) 22%,var(--r9-surface))!important;color:var(--r9-surface-text)!important;border-color:var(--r9-accent)!important}
:root[data-palette] #shell .mobile-nav button.active::after{background:var(--r9-accent)!important}

:root[data-palette] #shell #timeline .message.rodnie-circle-only,:root[data-palette] #shell #timeline .message:has(>.bubble-body>video.video-note){background:transparent!important;background-image:none!important;box-shadow:none!important;border:0!important;padding:0!important}
:root[data-palette] #shell #timeline .message.rodnie-circle-only .msg-meta{background:var(--r9-surface)!important;color:var(--r9-surface-text)!important}