/* m.css — мобильная версия. Структура и поведение зафиксированы, цвета/иконки — дизайнер (см. docs/90-DESIGN-BRIEF.md) */
html,body{margin:0;padding:0;background:#f2f2f2;font-family:Arial,Helvetica,sans-serif;font-size:15px;color:#222;-webkit-text-size-adjust:100%}
body.m{padding-top:calc(50px + env(safe-area-inset-top));padding-bottom:calc(56px + env(safe-area-inset-bottom))}
#mhead{position:fixed;top:0;left:0;right:0;height:50px;padding-top:env(safe-area-inset-top);background:#f28c1e;display:flex;align-items:center;z-index:50}
.mh-logo{flex:1;display:flex;align-items:center;padding-left:14px;height:50px}.logo-mark{width:30px;height:30px;background:#fff;border-radius:50%;display:inline-block}
.mh-bell,.mh-cam,.mh-menu,.mh-login{position:relative;width:50px;height:50px;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none}
.ico-bell,.ico-cam,.ico-dots{width:24px;height:24px;background:#fff;opacity:.9;border-radius:4px}.ico-dots{width:6px;background:#fff;box-shadow:0 -9px 0 #fff,0 9px 0 #fff;height:6px;border-radius:50%}
.mh-cnt{position:absolute;top:6px;right:6px;background:#3c9c1a;color:#fff;font-size:11px;padding:1px 5px;border-radius:9px;border:1px solid #fff}
.mmenu{position:fixed;top:calc(50px + env(safe-area-inset-top));right:8px;background:#333;color:#fff;border-radius:6px;z-index:60;min-width:180px;box-shadow:0 4px 16px rgba(0,0,0,.4)}.mmenu a{display:block;padding:12px 16px;color:#fff;text-decoration:none;border-bottom:1px solid #444}
#mpage{padding:10px}#mbar{position:fixed;bottom:0;left:0;right:0;height:56px;padding-bottom:env(safe-area-inset-bottom);background:#3b3b3b;display:flex;z-index:50}
.mb-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#ccc;text-decoration:none;font-size:10px;position:relative}.mb-item.active{color:#fff;background:#4a4a4a}
.mb-ico{width:22px;height:22px;background:#ccc;border-radius:4px;margin-bottom:2px}.mb-item.active .mb-ico{background:#f28c1e}.mb-cnt{position:absolute;top:6px;right:18%;background:#3c9c1a;color:#fff;font-size:10px;padding:0 4px;border-radius:8px}
/* главная-плитка */
.m-prof{display:flex;align-items:center;background:#fff;padding:12px;border-radius:6px;margin-bottom:10px}.m-prof img{width:64px;height:64px;border-radius:6px;margin-right:12px}.m-prof-name{font-size:20px;font-weight:bold}.m-prof-badge{color:#f28c1e;font-size:14px}
.m-share{display:flex;margin-bottom:12px}.m-share textarea{flex:1;border:2px solid #8cc63f;border-radius:6px 0 0 6px;padding:10px;font-size:16px;resize:none}.m-share button{width:56px;border:0;background:#8cc63f;color:#fff;font-size:28px;border-radius:0 6px 6px 0}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.tile{background:#fff;border-radius:6px;padding:14px 4px;text-align:center;text-decoration:none;color:#444;font-size:14px;position:relative;min-height:84px}
.tile-ico{width:40px;height:40px;background:#f28c1e;border-radius:8px;margin:0 auto 6px auto;opacity:.85}.tile-n{display:block;color:#888;font-size:13px}.tile-new{position:absolute;top:8px;right:8px;background:#3c9c1a;color:#fff;font-size:10px;padding:1px 6px;border-radius:8px}
.m-search{display:flex;margin-bottom:12px}.m-search input{flex:1;padding:12px;font-size:16px;border:1px solid #ccc;border-radius:6px 0 0 6px}.m-search button{width:56px;border:0;background:#f28c1e;color:#fff;border-radius:0 6px 6px 0}
.m-list{background:#fff;border-radius:6px}.m-list a,.m-list .m-row{display:block;padding:14px 12px;border-bottom:1px solid #eee;color:#333;text-decoration:none;font-size:16px}.m-list a:last-child{border-bottom:0}.m-list .sub{color:#888;font-size:13px;display:block}
/* адаптация десктопных шаблонов внутри мобильного макета */
#mpage table{width:100%!important}#mpage td{display:block;width:auto!important}#mpage .col-right,#mpage .gside,#mpage .pv-tagged-col{display:none}#mpage .inp,#mpage textarea.inp{width:100%;box-sizing:border-box;font-size:16px;padding:10px}
#mpage .btn{padding:10px 16px;font-size:15px;border-radius:4px}#mpage .tabs{height:auto;overflow-x:auto;white-space:nowrap;display:flex}#mpage .tab{float:none;padding:8px 10px;flex:none}
#mpage .urow{display:flex;align-items:flex-start}#mpage .urow .ava img{width:64px;height:64px}#mpage .urow-info{flex:1;width:auto;float:none}#mpage .urow-actions{width:auto;float:none;font-size:13px}#mpage .pthumb{width:31%;margin:1%}#mpage .pthumb img{width:100%}
#mpage .pviewer-overlay{width:100%;left:0!important}#mpage .pv-stage img{max-width:100%}#mpage .msg-list{height:auto;max-height:60vh}#mpage .msg-input{width:100%;float:none}#mpage .msg-send{float:none;width:100%;margin-top:6px;height:auto}
#mpage .gcard{width:30%;margin:1.5%}#mpage .app-card{width:47%;margin:1.5%}#mpage .app-card img{width:100%;height:auto}#mpage .fi-ava,#mpage .cmt-ava{float:left}#mpage .form label{font-size:13px}
.m-inv{background:#fff;border-radius:6px;padding:12px;margin-bottom:10px}.m-inv h2{margin:0 0 8px 0;border:0;font-size:18px}.m-inv-user{display:flex;align-items:center;margin-bottom:8px}.m-inv-user img{width:50px;height:50px;margin-right:10px;border-radius:4px}.m-inv-mutual{font-size:13px;color:#555;margin:6px 0}.m-inv-act{margin-top:10px}.m-inv-act .btn{margin-right:8px}
.m-online-tabs{display:flex;gap:6px;overflow-x:auto;margin-bottom:10px}.m-online-tabs a{flex:none;padding:8px 12px;background:#fff;border-radius:16px;text-decoration:none;color:#333;font-size:14px}.m-online-tabs a.cur{background:#f28c1e;color:#fff}
.m-hol{background:#fff;border-radius:6px;padding:12px;margin-bottom:8px;display:flex;align-items:center}.m-hol img{width:44px;height:44px;border-radius:4px;margin-right:10px}.m-hol .btn{margin-left:auto}
.m-set-id{color:#888;font-size:13px;padding:12px}
.ad{background:#fff;border-radius:6px;padding:10px;margin:10px 0}.ad-f3 .ad-img{width:100%;height:auto;border-radius:4px}.ad-title{font-size:16px}
/* иконки в тексте (мобильная): дизайнер оформляет .ico-* картинками; здесь — текстовый запас, чтобы без темы ничего не пропало */
.ico{display:inline-block;width:18px;height:18px;vertical-align:middle;margin-right:6px}
.ico-search:before{content:"\1F50D"}.ico-msg:before{content:"\2709"}.ico-gift:before{content:"\1F381"}.ico-warn:before{content:"\26A0"}.ico-cake:before{content:"\1F382"}.ico-coins:before{content:"\1F4B0"}.ico-invisible:before{content:"\1F441"}.ico-badge:before{content:"\2749"}.ico-refresh:before{content:"\21BB"}.ico-settings:before{content:"\2699"}.ico-desktop:before{content:"\1F4BB"}.ico-close:before{content:"\2715"}
/* десктопные шаблоны внутри мобильного макета: встроенная ширина полей (style="width:400px") не должна раздвигать страницу; широкие таблицы прокручиваются внутри себя */
#mpage .inp,#mpage input[type=text],#mpage input[type=password],#mpage textarea,#mpage select{max-width:100%;box-sizing:border-box}
#mpage table.list{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
#mpage img{max-width:100%;height:auto}
/* длинная надпись на кнопке-input (админка: действия с пользователем) не должна раздвигать страницу — переносим */
body.m input.btn,body.m button.btn,body.m input[type=submit]{max-width:100%;white-space:normal;height:auto;min-height:36px;word-wrap:break-word}
body.m form{max-width:100%}
/* действия в строках людей (в друзьях, написать…): спрайт иконок из десктопного base.css на мобильной ложился на текст — убрать */
#mpage .uact .act,#mpage .pactions .act,#mpage .urow-actions .act{background-image:none}
/* ---- слипания на мобильной (автопоиск sticking_all.py, 360px): #mpage — сильнее правил темы ---- */
#mpage .urow-info .online-m,#mpage .urow-info .online-d{margin-left:6px}
#mpage .fi-photos{gap:6px}
#mpage .fi-photo-meta,#mpage .fi-photos .small,#mpage .fi-photo .small,#mpage .pthumb-info{margin-top:5px}
#mpage .fi-photos + .small,#mpage .fi-photos + .dim,#mpage .fi-post .fi-photos{margin-bottom:6px}
#mpage .fi-status{margin-bottom:6px}
#mpage .fi-grpcard img{margin-top:5px;margin-bottom:5px}
#mpage .m-prof-name{margin-bottom:4px}
#mpage .m-prof-orgs{margin-top:4px}
#mpage .gcard-title{margin-bottom:4px}
#mpage .frow{margin-bottom:12px}
#mpage .frow .inp-year{margin-bottom:5px}
#mpage input.btn + input.btn,#mpage .inp + input.btn,#mpage .inp-year + input.btn{margin-left:6px}
#mpage .usub{margin-bottom:4px}
#mpage ul li{margin-bottom:5px}
#mpage .uact .act + .act,#mpage .urow-actions .act + .act{margin-left:10px}
#mpage .fi-photo-more{margin-bottom:5px}