/* Native system typography and restrained, interruptible movement. */
:root{--interface-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Arabic","Noto Sans Arabic","Segoe UI",sans-serif}
body,html[lang] body,button,input,textarea,select{font-family:var(--interface-font)}
.page-title,.section-title,.post h3,.comment-text,.profile-head,.message,.chat-tabs,.task,.resource-card,.modal,.nav-link{font-family:var(--interface-font);letter-spacing:normal}
body{line-height:1.7;-webkit-font-smoothing:antialiased}.page-title{font-weight:800;letter-spacing:-.025em}.muted,small{font-weight:500}
button,a,input,textarea{ -webkit-tap-highlight-color:transparent}button,.nav-link,.saved-card{transition:background .2s,box-shadow .2s,transform .22s cubic-bezier(.22,1,.36,1)}button:active:not(:disabled),.nav-link:active{transform:scale(.97)}
.modal{animation:sheet-appear .3s cubic-bezier(.2,.9,.25,1)}.modal-backdrop{backdrop-filter:blur(8px)}
.route-enter{animation:route-appear .38s cubic-bezier(.2,.8,.2,1)}.route-enter>.card,.route-enter>.hero,.route-enter>.messenger{animation:route-appear .46s cubic-bezier(.2,.8,.2,1)}
@keyframes route-appear{from{opacity:.2;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes sheet-appear{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
::view-transition-old(root){animation:route-out .16s ease both}::view-transition-new(root){animation:route-appear .3s ease both}@keyframes route-out{to{opacity:0;transform:translateY(-5px)}}
.nav-link{position:relative}.inbox-badge{min-width:21px;height:21px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;border-radius:99px;background:#ef4257;color:white;font:700 11px/1 var(--interface-font);box-shadow:0 2px 6px #ee425731;flex-shrink:0}.inbox-badge[hidden]{display:none}.nav-link>.inbox-badge{margin-inline-start:auto}.gift-header-button{position:relative}.gift-header-button>.inbox-badge{position:absolute;top:-6px;right:-6px;height:18px;min-width:18px;font-size:9px;padding:0 4px}
.app-layout:has(.messenger){grid-template-columns:200px minmax(0,1fr);max-width:1440px}.app-layout:has(.messenger)>.side-rail{display:none}
.messenger-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.messenger-title h1{font-size:32px;line-height:1.3;margin:5px 0}.messenger-title p{color:var(--muted);font-size:12px;margin:4px 0}.messenger-title .eyebrow{font:700 9px var(--interface-font);letter-spacing:2px}
.messenger{display:grid;grid-template-columns:minmax(220px,31%) minmax(0,1fr);height:calc(100dvh - 240px);min-height:480px;max-height:820px;background:color-mix(in srgb,var(--surface) 96%,transparent);border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:0 16px 60px #0a20300b}
.messenger-sidebar{min-width:0;display:flex;flex-direction:column;border-inline-end:1px solid var(--line);background:var(--surface)}.messenger-search{display:flex;align-items:center;gap:7px;padding:17px 13px 10px}.messenger-search>svg{width:17px;color:var(--muted);flex-shrink:0}.messenger-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-size:12px}.messenger-search>.icon-button{min-width:29px;width:29px;height:31px;border:0;border-radius:9px}
.messenger-filters{display:flex;gap:3px;border-radius:11px;padding:3px;margin:0 12px 12px;background:var(--surface-2)}.messenger-filters button{flex:1;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:10px;padding:5px 3px;white-space:nowrap}.messenger-filters button.active{color:var(--text);background:var(--surface);box-shadow:0 1px 6px #0000000b}
#messenger-peers{overflow-y:auto;overscroll-behavior:contain;padding:0 7px 12px}.messenger-peer{display:flex;align-items:center;gap:10px;border:0;background:transparent;text-align:start;color:var(--text);padding:13px 9px;width:100%;border-radius:15px;margin-bottom:3px}.messenger-peer:hover{background:var(--surface-2)}.messenger-peer.selected{background:var(--green-soft)}.messenger-peer-avatar{width:43px;height:43px;border-radius:50%;flex-shrink:0}.messenger-peer-copy{display:grid;flex:1;min-width:0;gap:3px}.messenger-peer-copy>span{display:flex;gap:5px;align-items:center;justify-content:space-between}.messenger-peer-copy b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.messenger-peer-copy time{font-size:8px;color:var(--muted);flex-shrink:0}.messenger-peer-copy small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.messenger-conversation{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;background:radial-gradient(ellipse at 75% 10%,color-mix(in srgb,var(--green-soft) 50%,transparent),transparent 65%),var(--bg)}.messenger-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(20px);flex-shrink:0}.messenger-head>.avatar{width:40px;height:40px;border-radius:50%}.messenger-head>.icon-button:first-child{display:none}.chat-peer-title{flex:1;min-width:0;display:grid;text-align:start;border:0;background:transparent;color:var(--text);padding:0}.chat-peer-title b{font-size:14px}.chat-peer-title small{font-size:10px;color:var(--muted)}
.messenger .message-list{flex:1;min-height:0;max-height:none;padding:22px 18px;display:flex;flex-direction:column;gap:12px;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:auto}.chat-day{display:flex;justify-content:center;margin:5px 0 12px}.chat-day span{background:var(--surface);border:1px solid var(--line);padding:4px 12px;border-radius:99px;color:var(--muted);font-size:9px}
.chat-message-row{display:flex;gap:7px;align-items:flex-end;align-self:flex-start;max-width:90%}.chat-message-row.mine{align-self:flex-end;flex-direction:row-reverse}.chat-message-row>.avatar{width:27px;height:27px;min-width:27px;border-radius:50%;font-size:10px;border:1px solid var(--line);padding:0;margin-bottom:3px}.messenger .message{position:relative;max-width:100%;min-width:70px;align-self:auto;margin:0;padding:11px 13px 6px;border:1px solid var(--line);border-radius:19px 19px 19px 6px;background:var(--surface);color:var(--text);box-shadow:0 3px 12px #132e2105}.messenger .message.me{background:var(--green);color:var(--surface);border-color:transparent;border-radius:19px 19px 6px 19px}.messenger .message p{font:500 14px/1.75 var(--interface-font);white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 3px}.chat-message-meta{display:flex;align-items:center;justify-content:flex-end;gap:5px;opacity:.75;font-size:8px;line-height:1.5}.chat-message-meta .message-menu{position:static;opacity:.65;width:20px;height:17px;min-width:0;border:0;background:none;color:inherit;padding:0}.chat-message-meta .message-menu svg{width:14px;height:14px}.read-check svg{width:14px;height:14px}.read-check.seen{opacity:1}.messenger .message.emoji-only{background:transparent!important;border:0;color:var(--text);box-shadow:none}.messenger .message.emoji-only p img{width:64px;height:64px}.chat-message-arrive{animation:message-appear .32s cubic-bezier(.16,1,.3,1)}@keyframes message-appear{from{opacity:0;transform:translateY(9px) scale(.94)}to{opacity:1;transform:none}}
.messenger-compose{display:flex;align-items:flex-end;padding:12px 14px;border-top:1px solid var(--line);gap:8px;background:color-mix(in srgb,var(--surface) 92%,transparent)}.messenger-compose .emoji-field{flex:1;min-width:0;background:var(--surface-2);border-radius:20px;border:1px solid var(--line)}/* The emoji mirror and native caret must share exactly the same text geometry. */
.messenger-compose textarea,.messenger-compose .emoji-mirror{box-sizing:border-box;font-family:var(--interface-font);font-size:16px;font-weight:400;line-height:24px;letter-spacing:normal;border:0;border-radius:20px;padding:10px 14px;white-space:pre-wrap;overflow-wrap:break-word;word-break:normal;tab-size:8;text-align:start;direction:inherit}
.messenger-compose textarea{display:block;background:transparent;color:transparent;caret-color:var(--text);resize:none;min-height:44px;max-height:120px;scrollbar-width:none}
.messenger-compose textarea::-webkit-scrollbar{display:none}
.messenger-compose .emoji-mirror{color:var(--text)}.messenger-compose>.icon-button{border:0;min-width:34px;width:34px;height:43px;background:transparent}.chat-send{display:grid;place-items:center;width:39px;height:39px;margin-bottom:2px;border:0;border-radius:50%;background:var(--green);color:var(--surface);flex-shrink:0}.chat-send svg{width:21px;height:21px}.messenger .emoji-slot:empty{display:none}.chat-reply-preview{display:flex;align-items:center;gap:10px;padding:8px 15px;background:var(--green-soft);font-size:11px;border-inline-start:3px solid var(--green)}.chat-reply-preview span{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.chat-reply-preview[hidden]{display:none}.chat-typing{display:flex;align-items:center;gap:3px;padding:5px 20px;color:var(--muted);font-size:10px}.chat-typing[hidden]{display:none}.chat-typing i{width:4px;height:4px;border-radius:50%;background:var(--muted);animation:typing-dot 1s infinite alternate}.chat-typing i:nth-child(2){animation-delay:.2s}.chat-typing i:nth-child(3){animation-delay:.4s}.chat-typing span{margin-inline-start:6px}@keyframes typing-dot{to{transform:translateY(-3px);opacity:.4}}
.chat-new-messages{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);z-index:2;display:flex;align-items:center;gap:5px;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:7px 13px;font-size:10px;color:var(--green);box-shadow:var(--shadow)}.chat-new-messages[hidden]{display:none}.messenger-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:9px;padding:35px 20px;color:var(--muted);flex:1}.messenger-empty>svg{width:32px;height:32px;opacity:.65}.messenger-empty h2,.messenger-empty h3{margin:0;color:var(--text)}.messenger-empty p{font-size:12px;margin:0 0 12px}.chat-idle-orbits{display:grid;place-items:center;width:100px;height:100px;border-radius:32px;background:var(--green-soft);color:var(--green);box-shadow:0 0 0 16px color-mix(in srgb,var(--green-soft) 35%,transparent);margin-bottom:25px;transform:rotate(-8deg)}.chat-idle-orbits svg{width:42px;height:42px}.messenger-welcome{text-align:center;padding:50px 25px}.messenger-welcome>span{display:inline-grid;place-items:center;background:var(--green-soft);color:var(--green);width:85px;height:85px;border-radius:28px}.messenger-welcome>span svg{width:40px;height:40px}
.incoming-message{position:fixed;z-index:90;top:88px;left:50%;transform:translateX(-50%);display:flex;align-items:center;width:min(400px,calc(100vw - 28px));padding:9px;border:1px solid var(--line);border-radius:23px;background:color-mix(in srgb,var(--surface) 95%,transparent);box-shadow:0 12px 40px #0002;backdrop-filter:blur(20px);animation:notification-appear .4s cubic-bezier(.16,1,.3,1)}.incoming-message[hidden]{display:none}.incoming-message>button:first-child{flex:1;display:flex;gap:10px;align-items:center;border:0;background:none;text-align:start;color:var(--text);min-width:0}.incoming-message>button>span:nth-child(2){flex:1;display:grid;gap:1px}.incoming-message b{font-size:12px}.incoming-message small{font-size:10px;color:var(--muted)}.incoming-message .avatar{width:39px;height:39px}.incoming-message>.icon-button{min-width:28px;width:28px;height:28px;border:0;background:transparent}@keyframes notification-appear{from{opacity:0;translate:0 -18px;scale:.92}to{opacity:1;translate:0 0;scale:1}}
.chat-settings{display:grid;gap:16px}.chat-settings p,.chat-settings small{color:var(--muted);font-size:12px}.ios-switch-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.ios-switch-row input{appearance:none;position:relative;width:44px;height:27px;border:0;border-radius:30px;background:var(--line);cursor:pointer;flex-shrink:0;transition:background .2s}.ios-switch-row input:before{content:'';position:absolute;left:3px;top:3px;width:21px;height:21px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0002;transition:transform .2s}.ios-switch-row input:checked{background:#32bb6c}.ios-switch-row input:checked:before{transform:translateX(17px)}
.follow-counts button{border:0;background:transparent;color:inherit;padding:3px 6px;font-size:inherit}.follow-counts button:hover{background:var(--green-soft);border-radius:10px}.follow-people{display:grid;gap:5px}.follow-person{display:flex;align-items:center;gap:12px;padding:12px;border-radius:15px}.follow-person:hover{background:var(--surface-2)}.follow-person>span:nth-child(2){flex:1;display:grid}.follow-person small{font-size:11px;color:var(--muted)}.account-caption{color:var(--muted);font-size:12px;margin:10px 0}
.avatar-options{text-align:center;display:grid;gap:12px}.avatar-options-preview{width:110px;height:110px;border-radius:50%;margin:8px auto;font-size:36px}.avatar-options h3,.avatar-options p{margin:0}.avatar-options p{font-size:12px;color:var(--muted)}.danger-text{color:var(--red)}.avatar-editor-modal{width:min(850px,95vw)}.avatar-editor{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.avatar-editor-stage{position:relative;aspect-ratio:1;border-radius:20px;overflow:hidden;background:var(--surface-2)}#avatar-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.avatar-crop-guide{position:absolute;inset:0;border-radius:50%;border:2px solid #fff9;box-shadow:0 0 0 100px #0004;pointer-events:none}.avatar-editor-controls{display:grid;gap:10px}.avatar-editor-controls>label{display:grid;gap:5px;font-size:11px;color:var(--muted)}.avatar-editor-controls input[type=range]{width:100%;accent-color:var(--green)}.avatar-editor-controls .ios-switch-row{display:flex}.avatar-context-preview{display:flex;align-items:center;gap:9px;padding:13px;border:1px solid var(--line);border-radius:15px;background:var(--surface-2)}.avatar-context-preview img{width:42px;height:42px;object-fit:cover;border-radius:50%}.avatar-context-preview img:last-child{border-radius:10px;width:33px;height:33px}.avatar-context-preview>div{display:grid;flex:1;min-width:0}.avatar-context-preview b{font-size:12px}.avatar-context-preview small{font-size:9px;color:var(--muted)}
.gift-shelf{padding:23px;margin:18px 0;background:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--green-soft) 60%,transparent),transparent 60%),var(--surface)}.gift-shelf-head{display:flex;gap:12px;align-items:center;margin-bottom:16px}.gift-shelf-head>div{flex:1}.gift-shelf-head h2{font-size:21px;margin:0}.gift-shelf-head small{font:700 8px var(--interface-font);letter-spacing:1.5px;color:var(--green)}.gift-shelf-head p{font-size:10px;color:var(--muted);margin:3px 0}.gift-shelf-head>b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--green-soft);color:var(--green)}.gift-shelf-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:16px;background:var(--green-soft);color:var(--green)}.gift-list{display:grid;gap:8px}.gift-item{display:flex;gap:12px;align-items:center;width:100%;padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--surface);text-align:start;color:var(--text)}.gift-item>span:nth-child(2){display:grid;flex:1}.gift-item b{font-size:13px}.gift-item small{font-size:10px;color:var(--muted)}.gift-item.sealed>span:first-child{color:var(--green)}.gift-item.opened{opacity:.75}
.gift-arrival{position:fixed;z-index:95;bottom:30px;left:50%;transform:translateX(-50%);display:flex;gap:15px;align-items:center;width:min(420px,calc(100vw - 24px));padding:20px;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(25px);border:1px solid var(--line);border-radius:26px;box-shadow:0 15px 60px #0002;animation:notification-appear .5s cubic-bezier(.16,1,.3,1)}.gift-arrival[hidden]{display:none}.gift-arrival>div{flex:1;display:grid;gap:6px}.gift-arrival b{font-size:14px}.gift-arrival small{font-size:11px;color:var(--muted)}.gift-arrival>div>div{display:flex;gap:7px;margin-top:7px}.gift-arrival button{font-size:11px;padding:7px 13px}.gift-arrival-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:20px;background:var(--green-soft);color:var(--green);transform:rotate(-9deg)}.gift-arrival-icon svg{width:32px;height:32px}.gift-modal{width:min(540px,94vw)}.gift-reveal{text-align:center;padding:20px 8px}.gift-reveal>small{font-size:9px;letter-spacing:2px;color:var(--green)}.gift-reveal h2{font-size:26px;margin:10px 0}.gift-reveal>p{font-size:13px;color:var(--muted);margin:0 auto 24px;max-width:340px}.gift-box-art{position:relative;display:grid;place-items:center;width:160px;height:160px;margin:8px auto 24px}.gift-box-art>span{display:grid;place-items:center;width:125px;height:125px;border-radius:37px;background:linear-gradient(135deg,var(--green-soft),var(--surface-3));border:1px solid var(--line);color:var(--green);transform:rotate(-9deg);box-shadow:0 18px 40px color-mix(in srgb,var(--green) 14%,transparent);animation:gift-wiggle 2.8s ease-in-out infinite}.gift-box-art svg{width:66px;height:66px;stroke-width:1.4}.gift-box-art i{position:absolute;width:8px;height:8px;background:var(--gold);border-radius:2px;top:15%;left:5%;transform:rotate(30deg)}.gift-box-art i:nth-of-type(2){top:75%;left:92%;background:var(--green)}.gift-box-art i:nth-of-type(3){top:10%;left:92%;width:5px;height:5px}.gift-box-art i:nth-of-type(4){top:90%;left:12%;background:var(--green);width:5px;height:5px}.gift-reveal.is-open .gift-box-art>span{animation:gift-open .7s cubic-bezier(.16,1,.3,1) both}.gift-later-button{display:block;border:0;background:transparent;color:var(--muted);margin:10px auto;font-size:12px;padding:8px}.gift-contents{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:start}.gift-contents>div{display:grid;gap:5px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2)}.gift-contents svg{color:var(--green)}.gift-contents b{font-size:12px;overflow-wrap:anywhere}.gift-contents span{font-size:10px;color:var(--muted)}@keyframes gift-wiggle{0%,80%,100%{transform:rotate(-9deg)}86%{transform:rotate(1deg)}93%{transform:rotate(-15deg)}}@keyframes gift-open{from{transform:scale(.7) rotate(-20deg);opacity:.2}to{transform:scale(1) rotate(0);opacity:1}}
@media(max-width:1000px){.app-layout:has(.messenger){grid-template-columns:180px minmax(0,1fr)}.messenger{grid-template-columns:210px minmax(0,1fr)}.messenger-peer{gap:7px;padding-inline:6px}.messenger-peer-avatar{width:35px;height:35px}.messenger-peer-copy time{display:none}}
@media(max-width:720px){.app-layout:has(.messenger){display:block;padding:16px 10px 100px}.messenger-title{padding-inline:6px;margin-bottom:15px}.messenger-title h1{font-size:28px}.messenger{display:block;height:calc(100dvh - 235px);min-height:390px;border-radius:22px}.messenger-sidebar,.messenger-conversation{height:100%}.messenger:not(.conversation-open) .messenger-conversation{display:none}.messenger.conversation-open .messenger-sidebar{display:none}.messenger.conversation-open .messenger-conversation{display:flex}.messenger-head>.icon-button:first-child{display:inline-flex;border:0;min-width:26px;width:26px;height:30px;background:transparent}.messenger-head{padding:11px 12px}.messenger .message-list{padding:16px 12px}.messenger-peer-copy time{display:inline}.messenger-peer-avatar{width:47px;height:47px}.messenger-peer{padding:13px 10px;gap:12px}.messenger-peer-copy b{font-size:15px}.messenger-peer-copy small{font-size:12px}.nav-link>.inbox-badge{position:absolute;top:0;inset-inline-start:55%;margin:0;height:17px;min-width:17px;font-size:9px;padding:0 4px}.incoming-message{top:72px}.gift-arrival{bottom:85px}.avatar-editor{grid-template-columns:1fr;gap:18px}.avatar-editor-stage{width:min(280px,100%);margin:auto}.avatar-editor-controls{gap:8px}.avatar-editor-modal{padding:20px}.header-tools{gap:4px}.gift-header-button{min-width:32px!important;width:32px!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}.route-enter,.route-enter>.card,.route-enter>.hero,.route-enter>.messenger,.modal,.chat-message-arrive,.chat-typing i,.gift-box-art>span,.gift-reveal.is-open .gift-box-art>span,.incoming-message,.gift-arrival{animation:none!important}::view-transition-old(root),::view-transition-new(root){animation:none!important}button,.nav-link,.saved-card,.ios-switch-row input,.ios-switch-row input:before{transition:none!important}}

.chat-load-older{display:block;margin:8px auto 20px;padding:9px 18px;border:1px solid var(--line);border-radius:99px;background:var(--surface);color:var(--green);font-size:12px;font-weight:700}

html[lang] .comments,html[lang] .comments textarea,html[lang] .comments .emoji-mirror{font-family:var(--interface-font)}

.gift-header-button[hidden]{display:none!important}
.messenger-loading{min-height:360px;padding:30px;display:grid;align-content:start;gap:20px}.messenger-loading i{display:block;height:60px;border-radius:20px;background:var(--surface-2)}
@media(max-width:720px){
 .app-layout:has(.messenger){height:calc(100dvh - 144px - env(safe-area-inset-bottom));padding:14px 10px 10px;min-height:300px}
 #main-content:has(.messenger){height:100%;display:flex;flex-direction:column;min-height:0}
 .messenger-title{flex:none}.messenger{flex:1;height:auto;min-height:0}
 body:has(.messenger) .focus-widget{top:106px;bottom:auto;right:auto;left:62px}
 body:has(.messenger) .focus-tab{width:39px;height:39px;padding:6px;justify-content:center;border-radius:13px}
 body:has(.messenger) .focus-tab-time{display:none}
 body:has(.messenger) .focus-panel{top:calc(100% + 10px);bottom:auto;right:auto;left:-48px;max-height:calc(100dvh - 220px)}
}

#main-content :where(h1,h2,h3,h4,p,span,strong,b,small,button,input,textarea,select,time),.companion,.focus-widget .focus-readout strong{font-family:var(--interface-font)}

/* Comment editor: a full-width writing surface with a separate attachment toolbar. */
.comment-editor{display:block!important;padding:16px;background:var(--surface-2);border:1px solid var(--line);border-radius:22px;margin-top:22px;min-width:0}
.comment-editor-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;font-size:13px}.comment-counter{font-size:11px;color:var(--muted);direction:ltr;font-variant-numeric:tabular-nums}
.comment-editor .emoji-field textarea,.comment-editor .emoji-field .emoji-mirror{box-sizing:border-box;font:400 16px/26px var(--interface-font);padding:12px;border:1px solid transparent;border-radius:14px;white-space:pre-wrap;overflow-wrap:break-word;word-break:normal;text-align:start;tab-size:8;min-height:104px}
.comment-editor .emoji-field textarea{display:block;width:100%;background:var(--surface);color:var(--text);caret-color:var(--text);resize:vertical;max-height:300px;scrollbar-width:none}.comment-editor textarea::-webkit-scrollbar{display:none}.comment-editor .emoji-mirror{color:var(--text)}
.comment-editor .emoji-field:focus-within{border-radius:14px;box-shadow:0 0 0 2px color-mix(in srgb,var(--green) 38%,transparent)}
.comment-toolbar{display:flex;align-items:center;gap:6px;margin-top:12px}.comment-toolbar .primary-button{margin-inline-start:auto;display:flex;align-items:center;gap:7px;height:42px;padding:0 17px;border-radius:14px}.comment-toolbar .primary-button svg{width:18px;height:18px}
.comment-tool{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;color:var(--muted);min-height:42px;min-width:42px;justify-content:center;border-radius:12px;cursor:pointer;padding:8px;font-size:12px}.comment-tool:hover{background:var(--surface);color:var(--green)}.comment-tool input{display:none}.comment-tool svg{width:20px;height:20px}
.comment-attachment{display:flex;gap:12px;align-items:center;padding:10px;margin-top:12px;background:var(--surface);border-radius:15px}.comment-attachment img{width:76px;height:76px;object-fit:cover;border-radius:12px}.comment-attachment>div{display:grid;gap:4px;flex:1;min-width:0}.comment-attachment b{font-size:12px;overflow-wrap:anywhere}.comment-attachment small{font-size:11px;color:var(--muted)}.comment-attachment button{border:0;border-radius:50%;width:32px;height:32px;color:var(--red);background:var(--surface-2)}.comment-attachment button svg{width:17px}
.comment-error{font-size:13px;color:#cf3b53;line-height:1.7;margin:12px 0 0}.comment-editor[aria-busy=true]{opacity:.7}.comment-editor [type=submit]:disabled{cursor:wait}
.comment-actions{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.comment-actions button{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;color:var(--muted);font:600 12px var(--interface-font);padding:7px 9px;min-height:34px;border-radius:10px}.comment-actions button:hover{background:var(--surface-2);color:var(--green)}.comment-actions svg{width:16px;height:16px}.comment-actions .comment-love.active{color:#e54670;background:#e5467010}.comment-own-actions{display:inline-flex;margin-inline-start:auto}.comment-image{display:block;width:auto;max-width:100%;max-height:380px;object-fit:contain;border-radius:16px;margin:12px 0;border:1px solid var(--line)}
@media(max-width:600px){.comments{padding:16px 12px}.comment-editor{padding:12px}.comment-actions button{padding:7px}.comment-tool span{display:none}.comment-meta{flex-wrap:wrap}.comment-meta small{width:100%}}

/* Native editable text is the source of truth; never make comment drafts invisible. */
.comment-editor .emoji-field textarea{color:var(--text)!important;-webkit-text-fill-color:var(--text)!important;caret-color:var(--green);opacity:1}
.comment-editor .emoji-field textarea::placeholder{color:var(--muted);-webkit-text-fill-color:var(--muted);opacity:1}
.comment-editor .emoji-mirror{display:none!important}

.comment-editor .comment-attachment[hidden],.comment-editor .comment-error[hidden]{display:none!important}

/* Chat emoji popup stays above the composer, including short mobile screens. */
.messenger-conversation>.emoji-slot:not(:empty){position:absolute;z-index:20;inset-inline-start:12px;bottom:76px;width:min(360px,calc(100% - 24px));max-height:calc(100% - 150px);overflow:auto;box-shadow:0 12px 35px #0002;border-radius:14px}.messenger-conversation>.emoji-slot .emoji-picker{margin-top:0}