/* All layout changes are scoped to phones. Branding assets are untouched. */
.mobile-icon{width:22px;height:22px;flex:none;vertical-align:middle}
.mobile-nav[hidden],.mobile-nav:not([hidden]){display:none}
#mobileHeaderActions,.mobile-feed-composer,.mobile-profile-tabs,.mobile-profile-about,.mobile-chat-back,.mobile-inbox-back,.mobile-inbox-name{display:none}
.mobile-thread-options>summary{display:none}
.mobile-thread-options:not([open])>.conversation-actions{display:flex}
.mobile-inbox-heading{display:flex;flex-direction:column;flex:1;min-width:0}
.mobile-inbox-heading>.mobile-inbox-name{display:block;font-size:15px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mobile-inbox-heading>#inboxLiveStatus{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mobile-inbox-heading>#inboxLiveStatus:empty{display:none}
#inboxLiveToolbar>.inbox-chat-close{display:grid;place-items:center;width:44px;min-width:44px;min-height:44px;height:44px;flex:none;padding:0;color:var(--text)}
@media(max-width:720px){
  body.mobile-ui-ready{--mobile-nav-height:calc(68px + env(safe-area-inset-bottom));padding-bottom:var(--mobile-nav-height)}
  body.mobile-ui-ready>header{height:calc(60px + env(safe-area-inset-top));min-height:0;flex-wrap:nowrap;gap:8px;padding:env(safe-area-inset-top) max(10px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));background:var(--bg);backdrop-filter:none}
  body.mobile-ui-ready>header .brand{min-width:0;flex:1;overflow:hidden}
  body.mobile-ui-ready>header .brand img{height:auto;max-height:36px;max-width:100%;width:180px;object-fit:contain;object-position:left center}
  #mobileHeaderActions{display:flex;flex:none;gap:2px}
  #mobileHeaderActions a{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;color:var(--text)}
  #workspaceTools{display:none}
  body.mobile-ui-ready main{padding:12px max(10px,env(safe-area-inset-right)) 14px max(10px,env(safe-area-inset-left))}
  body.mobile-ui-ready #app{display:block;min-width:0}
  body.mobile-ui-ready #app>aside{display:none!important}
  #view{min-width:0;overflow-wrap:anywhere}
  #view .page-head{align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px}
  #view .page-head h2{font-size:24px;line-height:1.25;margin:4px 0}
  #view .card{box-shadow:none}
  #view button,#view .button,#modal button,#modal .button,#modal summary{min-height:44px}
  #view input:not([type=checkbox]):not([type=radio]):not([type=range]),#view select,#view textarea,#modal input,#modal select,#modal textarea{font-size:16px;max-width:100%}
  .mobile-nav:not([hidden]){display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;z-index:80;height:var(--mobile-nav-height,calc(68px + env(safe-area-inset-bottom)));padding:4px max(4px,env(safe-area-inset-right)) calc(4px + env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left));gap:2px;background:var(--bg);backdrop-filter:none;box-shadow:0 -4px 20px #0002}
  .mobile-nav>a,.mobile-nav>button{position:relative;min-width:0;width:100%;height:56px;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:4px 2px;border:0;border-radius:12px;color:var(--muted);font-size:11px;line-height:1.2;white-space:nowrap;overflow-wrap:normal}
  .mobile-nav .mobile-nav-label{max-width:100%;font-size:11px;line-height:1.2;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-nav [aria-current=page]{background:var(--panel2);color:var(--text);box-shadow:inset 0 3px var(--accent)}
  .mobile-nav .mobile-create .mobile-icon{width:48px;height:48px;padding:6px;background:linear-gradient(135deg,var(--primary),var(--accent));border-radius:16px;color:#fff}
  .mobile-nav .mobile-create .mobile-nav-label{display:none}
  .mobile-nav .mobile-count,#mobileHeaderActions .mobile-count{position:absolute;top:1px;right:7px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;background:var(--accent);color:#fff;border-radius:20px;font-size:11px;line-height:1;font-weight:700;border:2px solid var(--bg)}
  .mobile-count[hidden]{display:none!important}
  .mobile-feed-composer{display:flex;align-items:center;gap:10px;min-height:58px;padding:10px 12px;background:var(--panel);border:1px solid var(--line);border-radius:14px;margin-bottom:16px}
  .mobile-feed-composer>span:not(.avatar){flex:1;color:var(--muted);font-size:15px}
  .mobile-feed-composer .avatar{width:34px;height:34px;flex:none}
  .mobile-feed-composer>.mobile-icon{color:var(--text)}
  body[data-mobile-route=feed] #view>.page-head>a{display:none}
  #view .post{padding:14px 12px;margin-bottom:16px;background:var(--panel);border:0;border-radius:16px;overflow:visible}
  #view .post>header{position:static;height:auto;min-height:44px;padding:0;margin:0 0 12px;display:flex;gap:8px;flex-wrap:wrap;background:transparent;backdrop-filter:none;border:0;z-index:auto}
  #view .post>header .userline{flex:1;min-width:0}
  #view .post>header .userline>span{min-width:0;overflow-wrap:anywhere}
  #view .post>header>span.muted{font-size:12px;margin-left:auto}
  #view .post .post-body{font-size:16px;line-height:1.6;margin:10px 0 14px;overflow-wrap:anywhere}
  #view .post .media-grid{display:grid;grid-template-columns:1fr;gap:8px;margin:12px -12px}
  #view .post .media-item{min-width:0;border-radius:0;overflow:hidden}
  #view .post .media-item>img,#view .post .media-item>video{display:block;width:100%;height:auto;max-height:70dvh;object-fit:contain;background:var(--bg)}
  #view .post .media-item>img{aspect-ratio:1;object-fit:contain}
  #view .post .media-caption-box{padding-inline:12px}
  #view .post>.actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;overflow:visible;border-top:1px solid var(--line);padding-top:8px;margin-top:12px}
  #view .post>.actions>button{min-width:0;padding:6px 2px;min-height:44px;background:transparent;color:var(--text);font-size:13px;white-space:normal;border:0;border-radius:9px}
  .mobile-post-options{position:relative;margin-left:auto;flex:none}
  .mobile-post-options>summary,.mobile-thread-options>summary{display:grid;place-items:center;list-style:none;width:44px;height:44px;cursor:pointer;border-radius:10px}
  .mobile-post-options summary::-webkit-details-marker,.mobile-thread-options summary::-webkit-details-marker{display:none}
  .mobile-post-options>div{position:absolute;right:0;top:46px;z-index:30;width:190px;max-width:calc(100vw - 40px);background:var(--panel2);border:1px solid var(--line);box-shadow:0 8px 25px #0006;padding:6px;border-radius:12px}
  .mobile-post-options:not([open])>div{display:none}
  .mobile-post-options .post-owner-actions{display:grid;gap:4px;position:static;margin:0}
  .mobile-post-options button{display:block;width:100%;margin:2px 0;text-align:left;padding:10px}
  #view .comment-form{display:flex;gap:6px;min-width:0}
  #view .comment-form input{flex:1;min-width:0}
  #view .comment-row{min-width:0}
  .mobile-menu-dialog{padding:20px 14px!important;max-height:calc(100dvh - 24px)!important;border-radius:20px;background:var(--bg)}
  .mobile-menu-dialog h2{font-size:24px;margin:0 44px 16px 4px}
  .mobile-menu-dialog>.modal-close{position:absolute;right:10px;top:10px;width:44px;height:44px;font-size:26px}
  .mobile-menu-groups{display:block}
  .mobile-menu-groups section{margin:18px 0;border-top:1px solid var(--line);padding-top:12px}
  .mobile-menu-groups h3{color:var(--muted);font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:0 10px;margin:0 0 6px}
  .mobile-menu-groups a,.mobile-menu-groups>button,.mobile-menu-groups section>button{display:flex;align-items:center;gap:12px;min-height:48px;padding:10px;border:0;background:transparent;border-radius:10px;text-align:left}
  .mobile-menu-groups a>span,.mobile-menu-groups>button>span,.mobile-menu-groups section>button>span{flex:1;min-width:0;overflow-wrap:anywhere}
  .mobile-menu-groups a>.mobile-icon:last-child{width:16px;color:var(--muted)}
  .mobile-menu-groups .mobile-menu-profile{background:var(--panel);padding:14px 10px}
  .mobile-menu-profile .avatar{width:44px;height:44px;flex:none}
  .mobile-menu-profile b,.mobile-menu-profile small{display:block}
  .mobile-menu-profile small{color:var(--muted);margin-top:3px}
  .mobile-menu-groups #mobileSignOut{width:100%;color:var(--text);border-top:1px solid var(--line);border-radius:0}
  #view>.cover{height:130px;border-radius:16px;overflow:hidden}
  #view>.profile-hero{position:relative;padding:0 4px 14px;text-align:left;margin-top:-24px}
  #view>.profile-hero>.avatar,#view>.profile-hero>.profile-avatar-edit{width:76px;height:76px;min-height:0;border:4px solid var(--bg);margin:0 0 8px 8px;border-radius:50%;background:var(--panel)}
  #view>.profile-hero .profile-avatar-edit>.avatar{width:100%;height:100%;margin:0;border:0}
  #view>.profile-hero h2{font-size:25px;line-height:1.2;margin:4px 0 6px}
  #view>.profile-hero>p.muted{margin:0 0 10px;font-size:14px}
  #view>.profile-hero>.mobile-profile-bio,#view>.profile-hero>.mobile-profile-counts{display:none}
  #view>.profile-hero .profile-primary-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}
  #view>.profile-hero .profile-primary-actions [data-profile-galleries]{display:none}
  #view>.profile-hero>.actions{display:flex;flex-wrap:wrap;gap:8px;overflow:visible;margin-top:8px}
  #view>.profile-hero>.actions button{flex:1 1 auto;min-width:100px}
  #view>.profile-hero>.actions .mobile-profile-message{order:-1;flex:1 1 100%}
  #view>.profile-hero>.shop-profile-link{display:inline-flex;align-items:center;margin-top:10px;font-size:14px}
  .mobile-profile-tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin:0 0 18px;padding:0;position:static}
  .mobile-profile-tabs>button{flex:1;min-width:0;background:transparent;color:var(--muted);border-radius:0;border:0;border-bottom:3px solid transparent;min-height:48px;padding:10px 4px}
  .mobile-profile-tabs>button[aria-selected=true]{color:var(--text);border-bottom-color:var(--accent)}
  .mobile-profile-about{display:block;line-height:1.65}
  .mobile-profile-about p{white-space:pre-wrap}
  .mobile-profile-about[hidden],.mobile-profile-tabs[hidden],#profileGalleries[hidden],.profile-wall[hidden]{display:none!important}
  #view .chat{display:block;min-height:0;padding:0;border:0;background:transparent}
  #view .chat-list{border:0;padding:0;max-height:none;overflow:visible}
  #view .conversation-row{display:flex;align-items:center;gap:4px;padding:8px 0;border-bottom:1px solid var(--line)}
  #view .conversation-open{flex:1;min-width:0;text-align:left;min-height:68px;border:0;padding:10px}
  #view .conversation-open small{display:block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--muted);font-size:13px}
  .mobile-thread-options{position:relative;flex:none}
  .mobile-thread-options:not([open])>.conversation-actions{display:none}
  .mobile-thread-options>.conversation-actions{position:absolute;right:0;top:44px;z-index:30;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:8px;width:200px;display:grid;gap:8px}
  #view .chat>.messages{display:none}
  .chat-launcher,.chat-tray{display:none!important}
  .floating-chats{left:0;right:0;top:var(--mobile-vtop,0px);bottom:auto;width:100%;height:var(--mobile-vh,100dvh);max-width:none;display:block;z-index:95;pointer-events:none}
  .floating-chat{display:none;width:100%;height:100%;max-width:none;min-height:0;border:0;border-radius:0;box-shadow:none;background:var(--bg)}
  .floating-chat.chat-active:not(.chat-minimized){display:flex}
  .floating-chat-head{padding:calc(6px + env(safe-area-inset-top)) 10px 6px;gap:6px;background:var(--panel);border-bottom:1px solid var(--line)}
  .floating-chat-head .mobile-chat-back{display:grid;place-items:center;flex:none;width:44px;min-height:44px;border:0;padding:0;color:var(--text)}
  .floating-chat-head [data-chat-minimize]{display:none}
  .floating-chat-head [data-chat-close]{display:grid;place-items:center;flex:none;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;font-size:28px;color:var(--text)}
  .floating-chat-head .chat-identity{color:var(--text)}
  .floating-chat-list{padding:16px 12px;min-height:0;flex:1;overflow-y:auto;overscroll-behavior:contain}
  .floating-chat-list .bubble{font-size:15px;max-width:90%}
  .floating-chat-form{padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--panel);max-height:55%;overflow:auto}
  .floating-chat-form textarea{resize:none;font-size:16px;min-height:48px;max-height:96px}
  .floating-chat-actions{gap:6px;flex-wrap:wrap}
  .floating-chat-actions .chat-attach,.floating-chat-actions .chat-emoji>summary{width:44px;height:44px;display:grid;place-items:center;min-height:44px}
  .floating-chat-actions>button{min-height:44px;padding:10px 18px;margin-left:auto}
  .chat-file-note{font-size:11px;line-height:1.45}
  .chat-message-meta{font-size:12px}
  .chat-reactions{gap:4px;position:relative}
  .chat-reactions details{position:static}
  .chat-reactions button,.chat-reactions summary,.chat-emoji button{min-height:44px;min-width:44px;font-size:14px;padding:8px}
  .chat-delete{font-size:12px!important}
  .chat-reactions details>div{left:0;right:auto;width:100%;min-width:0;max-width:100%}
  .chat-emoji>div{left:0;right:auto;min-width:190px;max-width:240px}
  .mobile-chat-open{overflow:hidden;overscroll-behavior:none}
  .mobile-chat-open>.chat-tray,.mobile-chat-open .mobile-nav,.mobile-chat-open .ios-install-hint{visibility:hidden}
  /* The fixed inbox belongs to main's stacking context; keep it above the site header. */
  body.mobile-inbox-open>main{z-index:94}
  .mobile-inbox-open #view .chat>.messages{display:flex;flex-direction:column;position:fixed;left:0;right:0;top:var(--mobile-vtop,0px);height:var(--mobile-vh,100dvh);width:100%;z-index:94;padding:0;border:0;border-radius:0;background:var(--bg);min-width:0}
  .mobile-floating-open #view .chat>.messages{display:none}
  .mobile-inbox-open #inboxLiveToolbar{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;flex:none;position:relative;z-index:1;margin:0;padding:calc(6px + env(safe-area-inset-top)) 10px 6px;border-bottom:1px solid var(--line);background:var(--panel)}
  .mobile-inbox-back{display:grid;place-items:center;width:44px;min-height:44px;flex:none;padding:0;border:0!important}
  .mobile-inbox-name{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #inboxLiveToolbar>[data-chat-popout]{display:none}
  #inboxLiveStatus{font-size:12px;color:var(--muted)}
  .mobile-inbox-open #messageList{flex:1;min-height:0;height:auto;max-height:none;overflow:auto;padding:14px 12px;overscroll-behavior:contain}
  .mobile-inbox-open #messageForm{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 12px calc(10px + env(safe-area-inset-bottom));margin:0;background:var(--panel);border-top:1px solid var(--line);flex:none;max-height:55%;overflow:auto}
  .mobile-inbox-open #messageForm[hidden]{display:none}
  #messageForm input[name=body]{flex:1 1 calc(100% - 88px);width:auto;min-width:0;margin:0;min-height:48px;font-size:16px}
  #messageForm>button[type=submit]{order:0;min-height:48px;min-width:72px;flex:none}
  #messageForm>.message-file-label{order:1;flex:1 1 100%;margin:0;min-height:44px}
  #messageForm>.message-file-help{order:4;font-size:11px;margin:0;flex-basis:100%}
  #messageForm>.voice-controls{order:2;flex-basis:100%;margin:0}
  #messageForm>.upload-previews{order:3;flex-basis:100%}
  #messageForm .voice-controls{display:flex;flex-wrap:wrap;gap:6px}
  #messageForm .voice-status{font-size:12px}
  .lightbox-dialog .modal-close,.lightbox-safe-close{min-height:44px;min-width:44px}
  .notification-link{gap:8px;padding:14px 12px}
  .notification-link .grow{min-width:0;flex:1 1 180px}
  #toast{z-index:120;bottom:calc(78px + env(safe-area-inset-bottom))}
  .mobile-chat-open #toast{bottom:20px}
  .ios-install-hint{bottom:calc(78px + env(safe-area-inset-bottom))}
  :is(button,a,input,textarea,select,summary):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}
