#social-town [data-town-sect],#social-town .social-connection button{min-width:44px;min-height:44px;flex-shrink:0}
.online-sect{position:absolute;inset:20px;max-width:1120px;max-height:760px;margin:auto;z-index:26;display:flex;flex-direction:column;overflow:hidden;border:1px solid #b7a474;border-radius:10px;background:#18303a;color:#e8e5d0;font-family:"Microsoft YaHei",sans-serif;box-shadow:0 12px 48px #091c23b0}
.online-sect[hidden],.online-sect [hidden]{display:none!important}#social-town .online-sect button,#social-town .online-sect input{min-height:44px;min-width:44px;padding:8px;border:1px solid #83948d;border-radius:5px;background:#25434b;color:#eceddd;font:inherit;touch-action:manipulation}.online-sect button:disabled{opacity:.5}.online-sect button:focus-visible,.online-sect input:focus-visible{outline:2px solid #f4d28c;outline-offset:2px}.online-sect header{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid #667a77;flex:none}.online-sect header div{flex:1}.online-sect h2{margin:4px 0 0;font-size:22px;font-weight:500;letter-spacing:.06em}.online-sect small{color:#b6cac5}.sect-content{flex:1;min-height:0;display:grid;grid-template-columns:280px 1fr;gap:24px;padding:20px}.sect-content aside,.sect-content main{min-height:0;overflow:auto;overscroll-behavior:contain}.sect-content aside canvas{display:block;width:100%;height:180px}.sect-content aside h3,.sect-tabs h3{font-size:16px;font-weight:500;color:#ecd6a0;margin:8px 0}.sect-content p{font-size:13px;line-height:1.7;color:#c5d1c8}.sect-content form label{display:block;font-size:13px}.sect-content input{display:block;width:100%;box-sizing:border-box;margin-top:8px}.sect-content form>button{width:100%}.sect-content progress{display:block;width:100%;height:10px;accent-color:#cfb478;margin:10px 0}.sect-manage{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.sect-tabs{display:flex;align-items:center;gap:10px;position:sticky;top:0;background:#18303a;z-index:1}.sect-tabs h3{flex:1}.sect-member,.sect-recruit{display:flex;align-items:center;gap:12px;border-bottom:1px solid #506c6b;padding:14px 4px}.sect-role{font-size:24px;width:44px;text-align:center}.sect-member>div,.sect-recruit>div{flex:1;min-width:0}.sect-member b,.sect-recruit b{font-size:16px;font-weight:500;overflow-wrap:anywhere}.sect-member small,.sect-recruit small{display:block;font-size:12px;line-height:1.7}.sect-member-actions{display:flex;flex:0 0 auto!important;gap:8px}.sect-empty{margin:24px 0}.sect-pages{display:flex;align-items:center;justify-content:center;gap:12px;margin:12px 0;font-size:13px}.online-sect footer{flex:none;display:flex;align-items:center;gap:12px;border-top:1px solid #667a77;padding:10px 20px}.online-sect footer p{flex:1;font-size:13px;line-height:1.7;margin:0;color:#e7d2a3}.online-sect [data-sect-confirm],.online-sect [data-sect-create],.online-sect [data-sect-claim]{background:#48534c!important;border-color:#d5bb85!important}.sect-busy [data-sect-message]:before{content:'';display:inline-block;width:12px;height:12px;border:2px solid #708d84;border-top-color:#eed49a;border-radius:50%;margin-right:8px;vertical-align:middle;animation:sect-spin .8s linear infinite}@keyframes sect-spin{to{transform:rotate(360deg)}}
@media(max-height:480px) and (orientation:landscape){.online-sect{inset:5px}.online-sect header{padding:5px 10px;gap:8px}.online-sect h2{font-size:17px}.online-sect header small{font-size:10px}.sect-content{grid-template-columns:180px 1fr;padding:7px;gap:12px}.sect-content aside canvas{height:100px}.sect-content p,.sect-content form label{font-size:11px}.sect-member,.sect-recruit{padding:8px 0;gap:6px}.sect-member b,.sect-recruit b{font-size:14px}.sect-member-actions{gap:4px}.sect-member-actions button,.sect-tabs button{font-size:12px!important}.online-sect footer{padding:5px 10px}.online-sect footer p{font-size:11px}.sect-pages{gap:6px}}
@media(orientation:portrait) and (max-width:700px){.online-sect{inset:calc(env(safe-area-inset-top,0px) + 6px) 6px calc(env(safe-area-inset-bottom,0px) + 6px)}.online-sect header{padding:8px;gap:6px}.online-sect h2{font-size:18px}.sect-content{display:flex;flex-direction:column;overflow:auto;padding:10px;gap:12px}.sect-content aside,.sect-content main{flex:none;overflow:visible}.sect-content aside canvas{height:120px}.sect-member{flex-wrap:wrap}.sect-member-actions{margin-left:auto}.online-sect footer{padding:8px;gap:6px}.online-sect footer p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.sect-busy [data-sect-message]:before{animation:none}}