.social-shell{max-width:920px;margin:0 auto;padding:32px 20px 80px}
.social-shell .page-intro{margin-bottom:28px}
.social-shell.research-publication{padding:0}
.social-shell .card{padding:clamp(20px,4vw,36px);margin-bottom:20px}
.social-shell h1{font-size:clamp(2rem,6vw,3.5rem);line-height:1.12}
.social-shell h2{margin-bottom:16px}.social-shell h3{margin:20px 0 8px}
.social-shell p{line-height:1.65;margin:12px 0}.social-shell label{display:block;margin:16px 0 8px}
.social-shell input:not([type=checkbox]),.social-shell textarea,.social-shell select{width:100%;max-width:100%;padding:12px;border:1px solid var(--border);border-radius:3px;background:var(--panel-strong);color:var(--text);font:inherit}
.social-shell input[type=checkbox]{display:inline-block;width:18px;height:18px;flex:none;margin:0 10px 0 0;vertical-align:middle}
.social-shell label:has(>input[type=checkbox]){display:flex;align-items:center;gap:6px;line-height:1.5;min-height:44px}
.social-shell a{color:var(--primary);text-underline-offset:4px}
.social-shell .card>a{display:inline-block;margin:12px 16px 0 0}
.social-shell button,.social-shell .secondary-btn,.social-shell .ghost-btn{width:auto;min-height:44px;margin:8px 8px 8px 0;white-space:normal}
.social-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.social-actions>*{max-width:100%}
.social-avatar{width:64px;height:64px;display:grid;place-items:center;border-radius:50%;background:var(--bg-soft);border:1px solid var(--border);font-size:24px;letter-spacing:.08em}
.social-header{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.social-role{font-size:.7rem;letter-spacing:.12em;border:1px solid currentColor;border-radius:4px;padding:3px 7px}
.social-text{white-space:pre-wrap;overflow-wrap:anywhere}.social-shell a,.social-shell h1,.social-shell h2,.social-shell h3{overflow-wrap:anywhere}
.social-item{padding:20px 0;border-bottom:1px solid var(--border)}
.social-shell dialog{width:min(680px,calc(100% - 24px));max-height:85vh;overflow:auto;margin:auto;padding:24px;border:1px solid var(--border);border-radius:3px;background:var(--panel-strong);color:var(--text)}
.social-shell dialog::backdrop{background:#030a16bb}.social-shell [hidden]{display:none!important}
.social-shell :focus-visible{outline:3px solid var(--primary);outline-offset:4px}
.social-shell button:disabled{opacity:.55;cursor:wait}
.social-note{font-size:.9rem;color:var(--muted)}
.social-shell .page-intro{max-width:680px;padding:12px 0 8px}
.social-shell .page-intro h1{font-size:clamp(2rem,5vw,3rem)}
.social-shell .account-access{border-top:2px solid var(--primary)}
.account-access form{max-width:480px}
.social-shell [role=status]:empty{display:none}
.social-shell #cloudMessage:not(:empty),.social-shell #socialStatus:not(:empty){padding:12px 16px;border-left:2px solid var(--primary);background:var(--bg-soft);border-radius:4px}
.social-shell h2 .social-note{display:inline-block;margin-left:8px;font-weight:400}
.social-section-heading{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.social-section-heading h2{margin:0}
.sync-status{font-size:.85rem;border:1px solid var(--border);border-radius:6px;padding:5px 10px}
.social-shell .account-secondary{padding:24px 4px;border-top:1px solid var(--border);margin:16px 0}
.social-disclosure{margin:16px 0}
.social-shell summary{min-height:44px;cursor:pointer;padding:12px 0;color:var(--text);font-weight:600}
.social-shell summary:focus-visible{outline:3px solid var(--primary);outline-offset:3px}
.social-stats{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;margin-top:20px;color:var(--muted);font-size:.875rem}
.social-shell .social-stats button{background:transparent;box-shadow:none;border:0;border-radius:4px;padding:6px 0;margin:0;font-size:inherit;color:var(--text);min-width:44px}
.social-stats span{flex-basis:100%;padding:4px 0}
.social-header h1,.social-header h2{margin:0 0 6px;line-height:1.15}
.social-header>div:last-child{flex:1;min-width:0}
.social-role{display:inline-block;margin:6px 0 6px 12px;font-weight:700;color:var(--primary)}
.social-shell .social-item h3{margin:0 0 8px;font:28px/1.2 var(--font-reading)}
.social-shell .social-item p{margin:8px 0}
.social-shell[data-social-page=analys]{max-width:780px}
.social-shell #publicAnalysis h1{margin:8px 0 18px}
.social-shell #publicAnalysis>h3{margin-top:32px}
.social-shell #publicAnalysis .social-text{font-size:1.05rem;line-height:1.8}
.username-preview{font-size:1.3rem;font-weight:600;overflow-wrap:anywhere}
#usernameFeedback{min-height:3em}
#accountDanger>summary{font-weight:500}
.social-shell input,.social-shell textarea{scroll-margin:100px}
.social-shell dialog form{margin-top:16px}
.social-shell dialog>button:last-child{margin-bottom:0}
@media(min-width:700px){.social-shell .card{padding:28px 32px}.social-stats span{flex-basis:auto}}
@media(max-width:430px){.social-shell{padding:24px 12px 60px}.social-shell .card{padding:20px}.social-header{gap:12px}}

.social-shell:not([data-social-page=analys]) .card,body.light-theme .social-shell:not([data-social-page=analys]) .card {background:none;border:0;border-top:1px solid var(--border);border-radius:0;padding:28px 0;}
.social-shell .social-header h2 {font:clamp(2rem,5vw,3rem)/1.15 var(--font-reading);}
.social-shell .social-text {font:20px/1.7 var(--font-reading);}
.social-shell .sync-status {font:12px var(--font-ui);border:0;padding:5px 0;}
.social-shell .page-intro h1 {font-family:var(--font-reading);font-weight:400;}
