/* heyloworld — luminous surfaces, quiet contrast and a stable mobile workspace. */
:root{
 --bg:#f4f6fb;--panel:#fff;--ink:#1c2940;--muted:#596b83;--line:#dee5ef;
 --accent:#3459d5;--soft:#edf1fc;--scene:#dce8fb;--shadow:0 5px 22px #18325207;
 --family:#a05125;--friends:#6750c6;--work:#16766a;--world:#3459d5;--heart:#a23c70;
 --media-mat:#f0f3f7;--on-accent:#fff;--sidebar:228px;
 font-family:'Manrope','Noto Sans Devanagari','Noto Sans Arabic',sans-serif;font-size:15px;
 color-scheme:light;
}
:root[data-space=family]{--bg:#faf7f1;--soft:#f8eddf;--scene:#f4e1c5;--accent:#a05125;--ink:#382c27;--muted:#786255;--line:#e9dfd1}
:root[data-space=friends]{--bg:#f6f5fc;--soft:#efebfb;--scene:#e6ddfc;--accent:#6750c6;--ink:#302b48;--muted:#6d6381;--line:#e4dff1}
:root[data-space=work]{--bg:#f2f7f5;--soft:#e5f2ed;--scene:#d5ebe1;--accent:#16766a;--ink:#233d37;--muted:#5b726b;--line:#d9e6df}
:root[data-space=world]{--bg:#f4f6fb;--soft:#edf1fc;--scene:#dce8fb;--accent:#3459d5;--ink:#1c2940;--muted:#596b83;--line:#dee5ef}
:root[data-space=heart]{--bg:#fbf5f8;--soft:#f8e9f0;--scene:#f5dce8;--accent:#a23c70;--ink:#442d3d;--muted:#7b6273;--line:#eadde5}
:root[data-theme=dark]{--bg:#101725;--panel:#192334;--ink:#edf3fb;--muted:#afbdd0;--line:#334257;--soft:#26354b;--scene:#21354f;--accent:#a8beff;--media-mat:#101a29;--on-accent:#142137;--shadow:0 8px 26px #0002;color-scheme:dark}
:root[data-theme=dark][data-space=family]{--bg:#1b1816;--panel:#28231e;--soft:#382e25;--scene:#413327;--accent:#f1bd88;--line:#483d32;--ink:#faf1e8;--muted:#d0bba7;--media-mat:#1c1916;--on-accent:#322316}
:root[data-theme=dark][data-space=friends]{--bg:#181624;--panel:#242136;--soft:#332c4b;--scene:#3c3158;--accent:#c6b5ff;--line:#443b59;--ink:#f3efff;--muted:#bfb4d7;--media-mat:#191625;--on-accent:#271b44}
:root[data-theme=dark][data-space=work]{--bg:#111d1a;--panel:#1b2b26;--soft:#293c35;--scene:#29473d;--accent:#91d9c7;--line:#354e43;--ink:#edf8f2;--muted:#afc6bb;--media-mat:#12201b;--on-accent:#132e25}
:root[data-theme=dark][data-space=heart]{--bg:#201720;--panel:#2d222c;--soft:#402e3b;--scene:#4c3044;--accent:#f0b4d2;--line:#503c49;--ink:#fcf0f7;--muted:#d2b4c6;--media-mat:#211821;--on-accent:#391c2d}
body{background:var(--bg);color:var(--ink);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button{transition:background-color .16s ease,color .16s ease,border-color .16s ease;cursor:pointer}
button:disabled{cursor:wait}button .icon{flex-shrink:0}
.card{border-color:var(--line);box-shadow:var(--shadow);background:var(--panel)}
.page-heading h1{font-weight:700;letter-spacing:-.045em;line-height:1.15}
.page-heading .eyebrow{letter-spacing:.12em;font-weight:650;color:var(--muted)}
.post-body p{font-size:.98rem;line-height:1.8;letter-spacing:0}
.post-header strong{font-size:.91rem;line-height:1.5}.post-header small{font-size:.74rem;line-height:1.6;color:var(--muted)}
.post{overflow:hidden;border-radius:22px;margin-bottom:24px}
.post-header{padding:22px 24px 0}.post-body{padding:15px 24px 20px}
.post-stats{padding:13px 24px;font-size:.78rem;color:var(--muted)}
.post-actions{gap:8px;padding:8px 14px;border-top:1px solid var(--line)}
.post-actions button{min-height:44px;border-radius:12px;font-size:.82rem;flex:1;justify-content:center}
.post-actions .save-post{flex:0 0 44px}.post-actions button:hover{background:var(--soft)}
.post-actions button.is-liked{color:var(--heart);background:color-mix(in srgb,var(--heart) 8%,var(--panel))}
.post-actions .is-liked .icon{fill:currentColor;animation:like-settle .22s ease-out}
.post-actions .is-saved{color:var(--accent)}.post-actions .is-saved .icon{fill:color-mix(in srgb,var(--accent) 18%,transparent)}
@keyframes like-settle{50%{transform:scale(1.16)}100%{transform:scale(1)}}
.topbar{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 96%,transparent)}
.topbar .search-box{border:1px solid var(--line);background:var(--bg);border-radius:15px;min-width:0}
.top-actions{gap:8px}.top-actions>.language-button,.top-actions>.icon-button[data-action=theme]{display:inline-flex;align-items:center;justify-content:center}
.top-actions>.icon-button[data-action=theme]{width:44px;min-width:44px;height:44px;border:1px solid var(--line);background:var(--soft);color:var(--accent);border-radius:14px}
.top-actions .language-button{min-width:44px;min-height:44px;color:var(--ink)}
.top-actions .inbox-top,.top-actions .mode-top{min-height:44px;border-radius:14px}
.brand-word{letter-spacing:-.055em;font-weight:750}.brand-symbol{filter:drop-shadow(0 3px 6px #2359dd1a)}
.sidebar{border-inline-end:1px solid var(--line)}.sidebar .brand-caption{line-height:1.6;color:var(--muted)}
.space-link{min-height:49px;border-radius:13px;font-size:.88rem}.space-link.selected{box-shadow:none;background:var(--soft);color:var(--accent)}
.space-link.selected::before{border-radius:4px}.sidebar-settings{min-height:43px;font-size:.81rem}
.sidebar .little-promo{display:none}.sidebar-bottom{gap:5px}.account{border-top:1px solid var(--line);padding-top:16px}
.feed-tabs{display:flex;justify-content:center;gap:clamp(10px,2vw,24px);width:100%;margin:0 0 24px;padding:5px 0 13px;overflow-x:auto;scrollbar-width:thin}
.feed-tabs>button:not(.icon-button){padding:12px 19px;min-height:46px;white-space:nowrap;font-size:.85rem;flex:0 1 auto;border-radius:12px}
.stories-bar{gap:19px;padding-block:8px 16px}.story-item>span:last-child{font-size:.76rem;line-height:1.6}
.composer-card{border-radius:20px}.composer-main>button:not(.audience-compact){font-size:.87rem;padding:14px 18px}
.composer-tool{min-height:46px;font-size:.79rem}.composer-tools{gap:10px}
/* Keep the original aspect ratio. Tall, square and panoramic originals all
   fit inside this same viewport budget; only explicit editor crops change them. */
.post .post-media{display:grid;place-items:center;background:var(--media-mat);max-height:none;overflow:hidden}
.post .post-media>button{display:grid;place-items:center;width:100%;height:auto;padding:0;line-height:0;cursor:zoom-in}
.post .post-media img{display:block;width:auto;max-width:100%;height:auto;max-height:min(480px,58svh);aspect-ratio:auto;object-fit:contain;object-position:center;margin:auto}
.post .post-media video{display:block;width:100%;height:auto;max-height:min(480px,58svh);aspect-ratio:auto;object-fit:contain;background:var(--media-mat)}
.post .gallery-strip{display:flex;align-items:stretch;gap:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;max-height:none;background:var(--media-mat);overscroll-behavior-x:contain}
.post .gallery-strip>button,.post .gallery-strip>video{flex:0 0 100%;width:100%;min-width:0;height:min(480px,58svh);scroll-snap-align:center;padding:0;border:0;background:var(--media-mat)}
.post .gallery-strip>button{display:grid;place-items:center;cursor:zoom-in}
.post .gallery-strip img,.post .gallery-strip video{width:100%;height:100%;max-height:min(480px,58svh);aspect-ratio:auto;object-fit:contain}
.media-library{gap:18px}.media-library-item{border-radius:18px;box-shadow:var(--shadow)}
.media-library-item>button{aspect-ratio:4/3;background:var(--media-mat)}
.media-library-item>button img{width:100%;height:100%;object-fit:contain}.media-library-item>video{aspect-ratio:4/3;background:var(--media-mat);object-fit:contain}
.media-library-item .gallery-caption{padding:10px 12px 10px 16px;gap:12px;min-height:57px;align-items:center}
.gallery-caption>span{min-width:0}.gallery-caption time{font-size:.76rem;color:var(--muted);font-variant-numeric:tabular-nums}
.gallery-caption small{display:block;font-size:.82rem;line-height:1.65;margin-top:3px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
:root[data-space=work] .identity-page .identity-cover.has-cover,.identity-page .identity-cover.has-cover{aspect-ratio:851/315;width:100%;height:auto;min-height:0;max-height:none;background:var(--profile-soft)}
.identity-page .cover-panels{padding:0;gap:4px}.identity-page .cover-panels>button{border-radius:0;background:var(--profile-soft)}
.identity-page .identity-cover .cover-panels img{width:100%;height:100%;object-fit:contain;object-position:var(--cover-x,50%) var(--cover-y,50%)}
.identity-page .identity-cover[data-fit=cover] .cover-panels img{object-fit:cover}
.identity-page .cover-edit{font-size:.78rem;background:var(--panel);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow)}
.identity-page .identity-main{position:relative;background:var(--panel)}
:root[data-theme=dark] .identity-page{--profile-ink:var(--ink);--profile-accent:var(--accent);--profile-soft:var(--soft)}
:root[data-theme=dark] .identity-summary h2,:root[data-theme=dark] .identity-role{color:var(--ink)}
:root[data-theme=dark] .button.primary,:root[data-theme=dark] .primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
:root[data-theme=dark] .bubble.sent{background:#38599c;color:#fff;border-color:transparent}
:root[data-theme=dark] .bubble.received{background:var(--soft);color:var(--ink)}
:root[data-theme=dark] .brand-word,:root[data-theme=dark] .brand-word>span{color:var(--ink)}
:root[data-theme=dark] :is(.composer-card,.rail-card,.topic-card,.profile-section,.resume-group,.resume-skills,.message-form,.chat-contacts,.chat-main,.dialog-head,.dialog-body,.inbox-thread,.person-card,.settings-list){background:var(--panel);color:var(--ink);border-color:var(--line)}
:root[data-theme=dark] :is(.family-dashboard,.heart-dashboard,.space-intro,.work-action-tile,.circle-link.selected,.friend-circle-chips>button,.discovery-card,.calendar-day.today){background:var(--soft);color:var(--ink);border-color:var(--line)}
:root[data-theme=dark] :is(input,select,textarea){background:var(--bg);color:var(--ink);border-color:var(--line)}
:root[data-theme=dark] input::placeholder,:root[data-theme=dark] textarea::placeholder{color:var(--muted);opacity:1}
/* Chat keeps one scrolling transcript and a stationary composer. */
.chat-layout{border:1px solid var(--line);border-radius:20px;overflow:hidden;min-height:0}
.chat-main{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--panel)}
.chat-bubbles{flex:1 1 auto;min-height:180px;max-height:50dvh;scrollbar-gutter:stable;overflow-y:auto;overflow-anchor:none}
.chat-heading{flex:none;padding:16px;gap:12px}.chat-heading strong{font-size:1rem}.chat-heading>div{min-width:0}
.chat-contacts>button{border-radius:12px;min-height:55px}.chat-search{flex:none}.message-form{flex:none}
.message-form input[name=body]{min-height:46px;border:1px solid var(--line);border-radius:15px;background:var(--bg);font-size:16px;line-height:1.5}
.message-form button[type=submit]{min-width:46px;min-height:46px;border-radius:15px}
.message-send-status{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 15px;background:var(--soft);color:var(--ink);font-size:.79rem;line-height:1.65;flex:none}
.message-send-status:empty{display:none}.message-send-status.failed{border-inline-start:3px solid #bc4860}
.message-send-status progress{height:5px;width:100%;accent-color:var(--accent);border:0;border-radius:5px}
.message-send-status .text-button{margin-inline-start:auto;min-height:40px;font-weight:700}
.message-preview:empty,#reply-preview:empty{display:none}.message-preview{max-height:220px;overflow:auto}
.voice-note-controls{background:var(--soft);border-radius:12px;margin:6px 10px;font-size:.82rem;flex:none}
.voice-note-controls:has(.fine-print){background:none;margin:0}.voice-note-controls audio{width:min(320px,100%);height:44px}
.bubble{font-size:.94rem;max-width:80%;padding:13px 16px}.bubble .message-meta small{font-size:.73rem;line-height:1.5;font-weight:500}
.bubble.sent .message-meta small{color:#f5f8ff}.bubble .message-meta .receipt{flex-shrink:0}
.bubble:has(.voice-message){width:min(326px,85%);min-width:0}.bubble .voice-message{width:100%}
.bubble.sent{background:#34589a;color:#fff}.bubble.received{border:1px solid var(--line);background:var(--panel)}
.bubble .message-attachment:not(audio){max-height:min(290px,40svh);width:100%;height:auto;object-fit:contain;display:block}
.message-attachment{overflow:visible}.voice-message-tools button,.voice-message-tools a{min-height:40px;font-size:.75rem}
@media(min-width:1600px){.content{max-width:1480px;margin-inline:auto}.two-column{grid-template-columns:minmax(0,760px) minmax(260px,330px);justify-content:center}}
@media(max-width:1100px){.top-actions{gap:5px}.top-actions>.language-button>span{display:none}.topbar{padding-inline:20px}.feed-tabs{gap:10px}}
@media(max-width:760px){
 :root{--sidebar:0px;font-size:15px}.content{padding:22px 14px calc(100px + env(safe-area-inset-bottom))}
 .topbar{display:grid;grid-template-columns:1fr auto;gap:10px 8px;padding:11px 13px;min-height:0;height:auto;position:sticky}
 .topbar .mobile-brand{grid-row:1;grid-column:1;gap:5px}.topbar .mobile-brand .brand-word{display:none}.topbar .mobile-brand .brand-symbol{width:29px;height:34px}
 .topbar .top-actions{grid-row:1;grid-column:2;gap:4px;margin:0}
 .top-actions>.language-button,.top-actions>.icon-button[data-action=theme],.top-actions>.icon-button[data-action=notifications]{display:inline-flex!important;min-width:40px;width:40px;height:44px;min-height:44px;padding:8px}
 .top-actions>.language-button>span{display:none}.top-actions>.icon-button[data-action=theme]{border-radius:12px}
 .top-actions .inbox-top{min-width:42px;width:42px;min-height:44px;padding:8px}.top-actions .inbox-top>span{display:none}
 .top-actions .mode-top{max-width:128px;min-width:48px;min-height:44px;padding:8px 10px;font-size:.77rem;gap:5px}.top-actions .mode-top .icon{width:17px}
 .top-actions .profile-button{display:none}.topbar .search-box{grid-row:2;grid-column:1/-1;height:44px;border-radius:13px}
 .topbar .search-box input{font-size:16px;max-width:none}.topbar .search-box input::placeholder{color:var(--muted);font-size:.86rem}
 .quick-spaces{gap:8px;padding:9px 13px;overflow-x:auto}.quick-spaces button{min-height:44px;padding-inline:11px;font-size:.76rem;flex-shrink:0}
 .page-heading{margin-bottom:22px;gap:14px}.page-heading h1{font-size:2rem}.page-heading .eyebrow{font-size:.68rem;line-height:1.7}
 .heading-actions .button{font-size:.76rem;min-height:44px}.feed-tabs{justify-content:flex-start;gap:12px;margin-bottom:19px;padding-bottom:11px;scroll-padding-inline:14px}
 .feed-tabs>button:not(.icon-button){flex:0 0 auto;font-size:.81rem;padding:12px 17px}
 .stories-bar{gap:15px;padding-block:5px 14px}.story-item>span:last-child{font-size:.73rem}
 .composer-card{padding:16px;border-radius:18px}.composer-main>button:not(.audience-compact){font-size:.84rem;padding:12px}
 .composer-tools{gap:4px}.composer-tool{font-size:.69rem;min-height:48px;padding-inline:7px}
 .post{border-radius:19px;margin-bottom:20px}.post-header{padding:18px 17px 0}.post-header strong{font-size:.87rem}.post-header small{font-size:.7rem}
 .post-body{padding:13px 17px 17px}.post-body p{font-size:.94rem;line-height:1.75}.post-stats{padding:12px 17px;font-size:.77rem}
 .post-actions{padding:7px 9px;gap:4px}.post-actions button{min-height:44px;font-size:.77rem;gap:6px}.post-actions .save-post{flex-basis:40px}
 .post .post-media img,.post .post-media video{max-height:min(410px,53svh)}
 .post .gallery-strip>button,.post .gallery-strip>video{height:min(410px,53svh)}.post .gallery-strip img,.post .gallery-strip video{max-height:min(410px,53svh)}
 .media-library{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.media-library-item{border-radius:14px}.media-library-item .gallery-caption{padding:9px 7px 9px 11px;gap:3px}.gallery-caption time{font-size:.72rem}.gallery-caption small{font-size:.75rem}
 :root[data-space=work] .identity-page .identity-cover.has-cover,.identity-page .identity-cover.has-cover{aspect-ratio:851/315}
 :root[data-space=work] .identity-page .identity-cover.panels-5,.identity-page .identity-cover.panels-5{aspect-ratio:16/9}
 .identity-page .cover-panels{gap:3px}.identity-page .cover-edit{min-height:38px;padding:7px 11px;bottom:8px;inset-inline-end:8px;font-size:.71rem}
 .identity-summary h2{font-size:1.8rem}.identity-page .identity-main{gap:14px}.profile-section{line-height:1.8}
 .messenger-dialog{height:var(--chat-viewport-height,100dvh);max-height:var(--chat-viewport-height,100dvh);top:var(--chat-viewport-top,0px);display:flex;flex-direction:column;margin:0;width:100%;max-width:100%;border:0;border-radius:0;padding:0}
 .messenger-dialog:not([open]){display:none}.messenger-dialog .dialog-head{flex:none;position:static;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top))}
 .messenger-dialog .dialog-body{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;max-height:none;overflow:auto;padding:9px 10px max(8px,env(safe-area-inset-bottom))}
 .messenger-tabs{flex:none;gap:8px;padding-bottom:8px;margin-bottom:7px;flex-wrap:nowrap;overflow-x:auto}
 .messenger-tabs>.chip{min-height:42px;font-size:.75rem;padding-inline:13px;flex:none}
 .messenger-tools{flex-basis:auto;border:0;gap:10px;padding:0;flex:none;margin-inline-start:auto}.messenger-tools .text-button{font-size:.69rem;min-height:42px;max-width:none;white-space:nowrap}.messenger-tools .text-button .icon{display:none}
 .chat-categories{flex:none;padding:0 0 7px;margin-bottom:4px;gap:8px}.chat-categories .chip{min-height:40px;font-size:.72rem;padding-inline:12px}
 .chat-layout{flex:1 1 auto;display:flex;flex-direction:column;min-height:160px;border:0;border-radius:0}
 .chat-contacts{flex:none;display:flex;align-items:center;padding:6px 0;gap:8px;max-height:60px;overflow-x:auto;scrollbar-width:none}
 .chat-contacts>button{flex:none;display:flex;flex-direction:row;gap:7px;min-height:44px;max-width:155px;width:auto;font-size:.76rem;padding:6px 10px;white-space:nowrap}
 .chat-contacts>button .avatar{width:28px;height:28px;flex-shrink:0}
 .chat-main{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.chat-heading{min-height:65px;padding:10px 4px;gap:9px}.chat-heading strong{font-size:.94rem}.chat-heading .presence-text{font-size:.74rem;line-height:1.5}
 .chat-call-actions{gap:6px}.chat-call-actions .icon-button{min-width:44px;width:44px;height:44px}
 .chat-search{padding:5px 8px}.chat-search input{font-size:16px;min-height:34px}
 .chat-bubbles{flex:1 1 auto;height:auto;min-height:70px;max-height:none;padding:14px 9px;border-radius:14px}
 .bubble{max-width:91%;font-size:.93rem;padding:12px 14px}.bubble .message-meta small{font-size:.72rem}
 .bubble:has(.voice-message){width:min(310px,93%);max-width:93%;min-width:0}
 .message-form{padding:9px 0 2px;gap:5px}.message-form input[name=body]{font-size:16px;padding:10px;min-height:44px}
 .message-form .voice-record-button,.message-form .message-file{min-width:40px;width:40px;min-height:44px}.message-form button[type=submit]{min-width:44px;width:44px;min-height:44px}
 .voice-note-controls{margin:5px 0;padding:8px;gap:8px}.voice-note-controls:has(.fine-print){display:none}.message-preview{max-height:28dvh}
 .message-send-status{padding:8px 10px;gap:5px;font-size:.76rem}.voice-note-controls audio{width:min(230px,70%)}
 .mobile-dock{padding-bottom:max(8px,env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--line)}
 .mobile-dock button{min-height:48px;font-size:.65rem;color:var(--muted)}.mobile-dock button.active{color:var(--accent)}
}
@media(max-width:370px){.topbar{padding-inline:9px;gap:8px 4px}.top-actions{gap:2px}.top-actions .mode-top{max-width:98px;font-size:.72rem;padding-inline:7px}.top-actions .mode-top .icon{display:none}.topbar .mobile-brand .brand-symbol{width:25px}.post-actions button{font-size:.72rem}.messenger-tools{gap:8px}.messenger-tools .text-button{font-size:.64rem}.messenger-tabs>.chip{padding-inline:10px}}
@media(max-width:760px) and (max-height:560px){.messenger-dialog .chat-categories,.messenger-dialog .chat-contacts,.messenger-dialog .chat-search,.messenger-dialog .messenger-tabs{display:none}.messenger-dialog .chat-heading{min-height:52px;padding-block:5px}.messenger-dialog .dialog-head{padding-block:5px}}
@media(prefers-reduced-motion:reduce){button{transition:none}.post-actions .is-liked .icon{animation:none}}
@media(max-width:760px){.messenger-dialog[data-compact=true] :is(.chat-categories,.chat-contacts,.chat-search,.messenger-tabs){display:none}.messenger-dialog[data-compact=true] .chat-heading{min-height:52px;padding-block:5px}.messenger-dialog[data-compact=true] .dialog-head{padding-block:5px}}