/* MIJUONE v1.63.4 — Modern Community UI, built on the shared MIJUONE service hero.
   Override ONLY community and profile settings, retaining responsive proportional lanes. */
body .mi-service-hero--community{
  --mi-service-h:274px;
  --mi-service-photo:url('../img/mi-neighborhood-people-v1206.webp');
}
body .mi-service-hero--community .mi-service-hero__copy{width:min(780px,74%)!important;max-width:min(780px,74%)!important}
body .mi-service-hero--community h1{font-size:clamp(30px,2.75vw,44px)!important}
body .mi-service-hero--community .mi-service-hero__inner{min-height:274px!important}
body .mi-service-hero--community .mi-service-hero__float{color:#386a9c}
.page-community{background:linear-gradient(180deg,#f6f9fd 0%,#f4f7fc 48%,#f8fafc 100%)}
.page-community .ms-shell{max-width:1600px;grid-template-columns:minmax(203px,235px) minmax(0,1fr) minmax(230px,268px);gap:18px;margin-top:25px;padding-bottom:28px}
.page-community .ms-shell .mi-proportional-viewport{min-width:0}
.page-community .ms-left,.page-community .ms-center,.page-community .ms-right{gap:14px;min-width:0}
.page-community .ms-panel,.page-community .ms-composer,.page-community .ms-filters,.page-community .ms-thread,.page-community .ms-feed-title{border:1px solid #e3eaf4;border-radius:18px;background:#fff;box-shadow:0 7px 24px rgba(38,67,104,.035)}
.page-community .ms-panel{padding:18px 15px}
.page-community .ms-panel-kicker{font-size:9px;letter-spacing:.16em;color:#6383ad;font-weight:850}
.page-community .ms-panel h2{font-size:16px;margin:7px 0 14px;letter-spacing:-.045em;color:#263d59}
/* Sidebar: familiar, consistent 18px SVGs instead of symbolic unicode characters */
.page-community .ms-menu{padding:15px 11px;gap:2px}
.page-community .ms-menu .ms-panel-kicker{padding:9px 12px 4px}
.page-community .ms-menu h2{margin:0 10px 8px;padding:6px 2px 12px;border-bottom:1px solid #e9eef6;font-size:17px}
.page-community .ms-navitem{min-height:42px;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;color:#627790;font-size:12px;font-weight:700;line-height:1.2;white-space:normal;transition:background .17s ease,color .17s ease}
.page-community .ms-navitem .icon{width:18px;height:18px;min-width:18px;flex-shrink:0;color:#869ab4;stroke-width:1.9;transition:color .17s ease}
.page-community .ms-navitem:hover{background:#f1f6fd;color:#254f89}
.page-community .ms-navitem:hover .icon,.page-community .ms-navitem.is-active .icon{color:#2768b6}
.page-community .ms-navitem.is-active{box-shadow:none;background:linear-gradient(90deg,#eaf3ff,#f3f8ff);color:#185da5;font-weight:850}
.page-community .ms-navitem.is-active::before{content:"";width:3px;height:20px;background:#2878d3;border-radius:5px;position:absolute;left:0}
.page-community .ms-navitem{position:relative}
.page-community .ms-divider{margin:11px 8px;border-color:#e9eef5}
.page-community .ms-local-note{background:linear-gradient(150deg,#eff6ff 0%,#fff 100%)}
/* Feed section title */
.page-community .ms-feed-title{padding:17px 20px;gap:12px}
.page-community .ms-feed-title h2{font-size:20px;margin:5px 0 0;letter-spacing:-.04em}
.page-community .ms-online-count{display:flex;align-items:center;gap:7px;background:#eff6ff;color:#4776a8;padding:8px 11px;font-weight:780;font-size:11px}
.page-community .ms-online-count .icon{width:14px;height:14px}
/* Composer: compact, semantic and visually aligned (no giant textarea void). */
.page-community .ms-avatar-helper{display:none}
.page-community .ms-composer{padding:19px 20px 16px;scroll-margin-top:100px}
.page-community .ms-compose-top{align-items:flex-start;gap:14px}
.page-community .ms-compose-avatar{position:relative;flex:0 0 auto;width:46px;height:46px}
.page-community .ms-avatar{width:45px;height:45px;font-size:17px;border-radius:50%;overflow:hidden;background:linear-gradient(140deg,#285eaa,#76a1e1)}
.page-community .ms-avatar .icon{height:19px;width:19px}
.page-community .ms-avatar img,.page-community .ms-mini-avatar img,.page-community .ms-reply-avatar img,.page-community .ms-comment-author-avatar img,.page-community .ms-comment-preview-avatar img,.page-community .ms-profile-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.page-community .ms-avatar-camera{position:absolute;bottom:-3px;right:-4px;width:22px;height:22px;background:#fff;border:1px solid #d8e5f2;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 3px 8px rgba(27,59,92,.18);cursor:pointer;color:#2767b2}
.page-community .ms-avatar-camera .icon{width:13px;height:13px}
.page-community .ms-avatar-camera input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.page-community .ms-avatar-camera:focus-within{outline:2px solid #539be0;outline-offset:2px}
.page-community .ms-compose-fields{gap:6px}
.page-community .ms-composer-label{display:flex;align-items:center;gap:10px;min-height:20px;font-size:12px}
.page-community .ms-composer-label strong{color:#1d3557;font-size:13px;font-weight:850}
.page-community .ms-composer-label>span{font-size:10px;color:#8ba2bd;background:#f0f5fc;padding:4px 8px;border-radius:20px}
.page-community .ms-compose-fields textarea{padding:6px 0!important;min-height:64px!important;height:64px!important;max-height:190px!important;border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;font-size:14px!important;line-height:1.55!important;resize:vertical!important;outline:none!important;color:#273d59}
.page-community .ms-compose-fields textarea:focus{box-shadow:none!important}
.page-community .ms-compose-fields textarea::placeholder{color:#a0b0c4}
.page-community .ms-compose-title{background:#f5f8fc!important;height:36px!important;width:100%;border:1px solid #edf1f7!important;border-radius:10px!important;padding:9px 12px!important;box-sizing:border-box;font-size:11.5px!important;outline-color:#8db9ec}
.page-community .ms-compose-location{margin:13px 0 10px 60px;gap:7px;align-items:center}
.page-community .ms-compose-location label{display:flex;align-items:center;gap:7px;color:#8090a5;font-size:11px;font-weight:800}
.page-community .ms-compose-location select,.page-community .ms-compose-location input{border:1px solid #e0e9f4!important;background:#f9fbfe!important;border-radius:10px;min-width:0;max-width:160px;height:35px;padding:5px 8px;color:#47617c;font-size:11.5px}
.page-community .ms-interest-composer-v162{margin:10px 0 6px 60px;padding:0!important;background:transparent!important;border:0!important}
.page-community .ms-interest-composer-v162 summary{display:inline-flex;gap:5px;align-items:center;font-size:11px;color:#477ba9;list-style:none;cursor:pointer}
.page-community .ms-interest-composer-v162 summary::before{content:"#";font-size:12px;background:#eef6ff;padding:3px 7px;border-radius:8px}
.page-community .ms-interest-grid-v162{max-height:128px;overflow:auto;scrollbar-width:thin}
.page-community .ms-compose-bottom{padding-top:13px;margin-top:13px;border-color:#e9eef6}
.page-community .ms-compose-tools{gap:10px}
.page-community .ms-upload-control,.page-community .ms-full-editor{display:inline-flex;align-items:center;min-height:34px;padding:7px 9px;background:#f6f9fd;color:#4e6f98!important;border-radius:9px;font-size:11px!important;font-weight:800!important;box-sizing:border-box;gap:5px}
.page-community .ms-upload-control:hover,.page-community .ms-full-editor:hover{background:#eaf4ff;color:#165aa2!important}
.page-community .ms-publish{min-height:39px;border-radius:11px;padding:10px 16px;background:linear-gradient(120deg,#1a5eaf,#2c76cf);box-shadow:0 5px 12px #2b6fbd22;font-size:12px}
/* Streamlined feed tabs: horizontally scrollable instead of overflowing or wrapping into clutter. */
.page-community .ms-filters{display:flex;align-items:center;gap:12px;padding:11px 14px;flex-wrap:nowrap;overflow:visible;min-width:0}
.page-community .ms-filter-row{display:flex;flex:1;min-width:0;flex-wrap:nowrap;align-items:center;gap:3px;overflow-x:auto;scrollbar-width:thin;white-space:nowrap;padding-bottom:3px}
.page-community .ms-filter-row a{position:relative;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;min-height:34px;border-radius:9px;color:#607893;padding:7px 10px;font-weight:750;font-size:11px;line-height:1}
.page-community .ms-filter-row a.active{background:#e8f3ff;color:#1764b8;font-weight:900}
.page-community .ms-feed-search{width:200px;flex:0 0 auto;border-color:#e0e9f4;height:37px}
.page-community .ms-feed-search input{width:95px}
/* Thread cards: text-first and readable, with persistent comment composer */
.page-community .ms-posts{gap:12px}
.page-community .ms-thread{padding:19px 20px 16px;gap:12px;overflow:visible;min-width:0;position:relative;border-radius:18px;transition:border-color .18s,box-shadow .18s}
.page-community .ms-thread:hover{border-color:#cadcf3;box-shadow:0 12px 30px rgba(30,67,103,.058)}
.page-community .ms-thread-rail{width:45px;gap:9px}
.page-community .ms-thread-rail .ms-avatar{width:43px;height:43px;text-decoration:none;color:#fff}
.page-community .ms-connector{background:linear-gradient(#d7e4f5,#f3f7fc);width:2px;min-height:25px}
.page-community .ms-thread-head{gap:9px;align-items:flex-start}
.page-community .ms-thread-identity{min-height:30px;gap:7px}
.page-community .ms-thread-identity strong{font-size:13px;color:#203958;font-weight:850}
.page-community .ms-thread-identity .ms-time{font-size:10.5px}
.page-community .ms-state{background:#eef5fc;color:#5a80ac;font-size:10px;padding:4px 7px;border-radius:7px}
.page-community .ms-topic{border:1px solid #e6edf5;background:#f8fbff;border-radius:7px;font-size:10px;padding:6px 9px}
.page-community .ms-thread-body{padding:11px 0 9px;line-height:1.75}
.page-community .ms-thread-body h3{font-size:15px;font-weight:840;margin:0 0 5px;line-height:1.5}
.page-community .ms-thread-body p{color:#384e69;font-size:13px;line-height:1.74}
.page-community .ms-thread-location{font-size:10px;color:#8a9db3;margin:4px 0 11px}
.page-community .ms-actions{padding:8px 0 10px;border-top:1px solid #edf2f7;border-bottom:0;gap:6px 18px;align-items:center;flex-wrap:wrap}
.page-community .ms-actions form{position:relative;display:flex;align-items:center;gap:4px}
.page-community .ms-actions .ms-action,.page-community .ms-actions button.ms-action-heart{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:#667f9b;border-radius:8px;padding:6px 4px;font-size:11px;font-weight:750;white-space:nowrap;cursor:pointer;min-height:29px}
.page-community .ms-actions .icon{width:17px;height:17px;stroke-width:1.75;flex-shrink:0}
.page-community .ms-actions .ms-action:hover,.page-community .ms-actions .ms-action-comment:hover{background:#f0f6ff;color:#2469b9}
.page-community .ms-action-comment{background:#f0f6ff!important;color:#316aa8!important;padding:6px 10px!important}
.page-community .ms-actions button.ms-action-heart.is-active{color:#d94c71}
.page-community .ms-actions .ms-open-detail{margin-left:auto;font-size:11px;color:#3d7cb8}
.page-community .ms-reaction-options{display:none;position:absolute;bottom:calc(100% + 4px);left:0;border:1px solid #dce6f4;box-shadow:0 10px 22px #28466a12;border-radius:13px;z-index:9;background:#fff;padding:6px}
.page-community .ms-actions form[data-ms-reaction-form]:hover .ms-reaction-options,.page-community .ms-actions form[data-ms-reaction-form]:focus-within .ms-reaction-options{display:flex}
.page-community .ms-trust-action-v163{font-size:10px;gap:6px}
.page-community .ms-thread-preview{padding:2px 0 6px}
.page-community .ms-comment-line{gap:9px;align-items:center;margin:9px 0;line-height:1.5}
.page-community .ms-comment-preview-avatar{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;background:#edf5ff;color:#4674a5;font-size:10px;font-weight:850;overflow:hidden}
.page-community .ms-comment-line strong{font-size:11px}
.page-community .ms-comment-line p{font-size:11.5px;color:#627992}
.page-community .ms-more-replies{margin-top:1px;padding:6px 0;color:#2d71b8;font-weight:850;font-size:11px}
.page-community .ms-thread-expanded{padding:3px 0}
.page-community .ms-thread-expanded .ms-reply{border-color:#eef3f8}
.page-community .ms-reply-avatar{width:30px;height:30px;overflow:hidden}
/* Each post visibly exposes an inline reply form; never bury comments behind a number. */
.page-community .ms-thread-commentbar{border-top:1px solid #edf1f7;padding:12px 0 0;margin-top:5px}
.page-community .ms-thread-commentbar .ms-reply-form{margin:0;padding:0;background:transparent;border:0;border-radius:0;display:flex;align-items:flex-start;gap:10px}
.page-community .ms-comment-author-avatar{width:31px;height:31px;display:grid;place-items:center;flex-shrink:0;border-radius:50%;background:#e9f2ff;color:#4774ae;font-size:12px;font-weight:850;overflow:hidden}
.page-community .ms-quickreply-field{display:flex;min-width:0;flex:1;align-items:center;gap:8px;background:#f6f9fd;border:1px solid #e0eaf4;border-radius:13px;padding:3px 5px 3px 12px;position:relative}
.page-community .ms-quickreply-field:focus-within{background:#fff;border-color:#8cbee9;box-shadow:0 0 0 3px #2880db10}
.page-community .ms-quickreply-field textarea{flex:1;min-width:0;min-height:37px;height:37px;border:0;background:transparent;resize:vertical;max-height:135px;padding:10px 0 4px;font-size:12px;outline:none;line-height:1.45;color:#284666}
.page-community .ms-quickreply-field textarea::placeholder{color:#97a8bc}
.page-community .ms-quickreply-tools{display:flex!important;align-items:center!important;gap:5px!important;margin:0!important;flex-shrink:0}
.page-community .ms-quickreply-tools>span{display:none}
.page-community .ms-quickreply-tools>span:not(:empty){display:inline-block;color:#5b81ae;font-size:10px}
.page-community .ms-quickreply-tools button[data-ms-cancel-reply]{font-size:10px;background:#ebeff5;color:#4b6686;padding:6px}
.page-community .ms-quickreply-tools .ms-reply-submit{border:0;background:#2169b8;color:#fff;font-size:11px;font-weight:800;display:inline-flex;align-items:center;gap:5px;padding:9px 12px;border-radius:9px;white-space:nowrap}
.page-community .ms-quickreply-tools .ms-reply-submit:hover{background:#154d8c}
.page-community .ms-quickreply-tools .icon{width:12px;height:12px}
.page-community .ms-login-comment{display:inline-flex;gap:8px;align-items:center;color:#477bb0;background:#f5f9fe;padding:11px 13px;border:1px solid #e2ebf6;border-radius:11px;font-weight:750;font-size:11px;text-decoration:none}
.page-community .ms-login-comment .icon,.page-community .ms-replies-denied-v163 .icon{height:15px;width:15px;vertical-align:middle}
.page-community .ms-empty{text-align:center}
/* Other user surfaces, author portraits and edit controls */
.page-community .ms-mini-avatar{overflow:hidden}
.page-community .ms-author-avatar img,.page-community .ms-profile-avatar img{object-fit:cover;width:100%;height:100%}
.ms-profile-shell .ms-profile-avatar{overflow:hidden}
.ms-profile-shell .ms-profile-avatar img{width:100%;height:100%;object-fit:cover}
.mc-detail-meta .mc-avatar,.mc-comment-head .mc-avatar{overflow:hidden;display:inline-flex;justify-content:center;align-items:center}
.mc-detail-meta .mc-avatar img,.mc-comment-head .mc-avatar img{width:100%;height:100%;object-fit:cover}
.mi-avatar-photo-v1634{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.mi-avatar-settings-v1634{display:flex;align-items:center;gap:24px;padding:23px 25px;margin:0 0 18px}
.mi-avatar-settings-preview{width:92px;height:92px;flex-shrink:0;background:linear-gradient(150deg,#3c76c0,#9fc4eb);border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:900;font-size:30px;overflow:hidden;box-shadow:0 5px 20px #386aaf25}
.mi-avatar-settings-preview img{width:100%;height:100%;object-fit:cover}
.mi-avatar-settings-copy{flex:1;min-width:0}
.mi-avatar-settings-copy h2{color:#243c5b;margin:4px 0 8px;font-size:20px}
.mi-avatar-settings-copy p{font-size:12px;color:#7d92ad;line-height:1.55;margin:0 0 12px}
.mi-avatar-upload-form{display:flex;align-items:center;flex-wrap:wrap;gap:9px}
.mi-avatar-upload-form label{position:relative;cursor:pointer;overflow:hidden}
.mi-avatar-upload-form label input{position:absolute;opacity:0;width:1px;height:1px}
.mi-avatar-remove-form{margin-top:9px}
/* Breakpoints prioritize reading and preserve legacy proportional lane JS. */
@media (min-width:1024px) and (max-width:1210px){.page-community .ms-shell{grid-template-columns:minmax(183px,205px) minmax(0,1fr) minmax(215px,238px);gap:11px}.page-community .ms-feed-search{width:155px}.page-community .ms-compose-location{margin-left:0}}
@media (max-width:1023px){.page-community .ms-shell{gap:12px}.page-community .ms-filters{flex-wrap:wrap}.page-community .ms-feed-search{width:100%}.page-community .ms-feed-search input{width:auto;flex:1}}
@media (max-width:750px){body .mi-service-hero--community .mi-service-hero__copy{width:100%!important;max-width:100%!important}body .mi-service-hero--community,body .mi-service-hero--community .mi-service-hero__inner{--mi-service-h:265px;min-height:265px!important}.page-community .ms-shell{margin-top:14px}.page-community .ms-composer{padding:15px 13px}.page-community .ms-thread{padding:15px 13px}.page-community .ms-compose-location{margin-left:0;gap:6px}.page-community .ms-compose-location label{font-size:10px}.page-community .ms-compose-location select,.page-community .ms-compose-location input{max-width:115px}.page-community .ms-interest-composer-v162{margin-left:0}.page-community .ms-quickreply-tools .ms-reply-submit{font-size:0;padding:11px}.page-community .ms-quickreply-tools .ms-reply-submit .icon{width:16px;height:16px}.page-community .ms-filter-row{width:100%}.page-community .ms-feed-search{width:100%}.page-community .ms-quickreply-field textarea{font-size:11px}.mi-avatar-settings-v1634{padding:17px;gap:14px}.mi-avatar-settings-preview{width:65px;height:65px;font-size:22px}}
@media (prefers-reduced-motion:reduce){.page-community .ms-thread,.page-community .ms-navitem,.page-community .ms-navitem .icon{transition:none}}
.page-community .ms-compose-tools .icon{width:16px;height:16px;flex-shrink:0}
.page-community .ms-actions .ms-open-detail{display:flex;align-items:center;gap:4px;white-space:nowrap}
.page-community .ms-actions .ms-open-detail .icon{height:13px;width:13px}
/* Restore the existing responsive reading order after the desktop grid override. */
@media (min-width:751px) and (max-width:1023px){
  .page-community .ms-shell{display:grid!important;grid-template-columns:minmax(170px,200px) minmax(0,1fr)!important;gap:12px}
  .page-community .ms-shell>.mi-proportional-viewport[data-mi-lane="right"]{grid-column:1/-1}
  .page-community .ms-right{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
}
@media (max-width:750px){
  .page-community .ms-shell{display:flex!important;flex-direction:column!important;gap:12px!important;width:calc(100% - 24px)!important;max-width:100%!important;box-sizing:border-box}
  .page-community .ms-shell>.mi-proportional-viewport{display:contents!important;width:100%!important;max-width:100%!important}
  .page-community .ms-center{order:1;width:100%!important;min-width:0}
  .page-community .ms-left{display:none;order:2}
  .page-community .ms-right{display:none;order:3}
  .page-community .ms-filters{flex-direction:column;align-items:stretch;gap:8px}
  .page-community .ms-compose-location select,.page-community .ms-compose-location input{max-width:108px}
  .page-community .ms-avatar{width:41px;height:41px}
  .page-community .ms-compose-avatar{width:42px;height:42px}
  .page-community .ms-thread-content{max-width:100%}
  .page-community .ms-composer,.page-community .ms-thread,.page-community .ms-filters,.page-community .ms-feed-title{box-sizing:border-box;max-width:100%}
}
/* Composer options are collapsed by default, like a modern social writing surface. */
.page-community .ms-compose-options{margin:11px 0 0 60px;border:1px solid #e2ebf5;border-radius:11px;background:#f8fbff}
.page-community .ms-compose-options>summary{cursor:pointer;display:flex;align-items:center;gap:7px;list-style:none;min-height:36px;padding:6px 11px;color:#3f729f;font-size:11.5px;font-weight:820;box-sizing:border-box}
.page-community .ms-compose-options>summary::-webkit-details-marker{display:none}
.page-community .ms-compose-options>summary .icon{width:15px;height:15px;flex-shrink:0}
.page-community .ms-compose-options>summary>span{color:#95a8bc;font-size:10px;font-weight:650;margin-left:auto}
.page-community .ms-compose-options>summary>.icon:last-child{color:#7d9bbb;width:14px;height:14px;transition:transform .2s}
.page-community .ms-compose-options[open]>summary>.icon:last-child{transform:rotate(180deg)}
.page-community .ms-compose-options-inner{padding:2px 11px 11px;border-top:1px solid #e5edf6;display:flex;flex-direction:column;gap:9px}
.page-community .ms-compose-options-inner .ms-compose-title{width:100%;box-sizing:border-box;margin:9px 0 0}
.page-community .ms-compose-options-inner .ms-compose-location{margin:0;gap:8px}
.page-community .ms-compose-options-inner .ms-interest-composer-v162{margin:0}
.page-community .ms-compose-options-inner .ms-interest-grid-v162{max-height:116px}
@media(max-width:750px){.page-community .ms-compose-options{margin-left:0}.page-community .ms-compose-options>summary>span{font-size:9px}}
