:root {
  --brand-deep: #143d2b;
  --brand: #1b6542;
  --brand-bright: #2d8a5a;
  --gold: #b9871c;
  --gold-soft: #fff4d5;
  --cream: #fbfaf5;
  --surface-muted: #f3f7f3;
  --shadow: 0 8px 24px #143d2b12;
}

.brand img { display:block; width:8.7rem; height:2rem; }
.authoritative-my-space { display:grid; gap:.8rem; max-width:58rem; margin:0 auto; padding:0; background:transparent; border:0; }
.my-space-profile { overflow:hidden; border:1px solid #e1e9e2; border-radius:1rem; background:var(--cream); box-shadow:var(--shadow); }
.personal-cover { position:relative; min-height:6rem; margin:0; border-radius:0; background:linear-gradient(120deg,var(--brand-deep),var(--brand-bright) 68%,var(--gold)); }
.personal-cover img { display:block; width:100%; height:6rem; object-fit:cover; }
.my-space-header { display:flex; align-items:flex-start; gap:.75rem; margin:0; padding:.7rem .85rem .8rem; }
.my-space-avatar { position:relative; flex:0 0 4rem; width:4rem; height:4rem; margin-top:-1.55rem; overflow:visible; border:3px solid #fff; border-radius:50%; background:var(--brand); color:#fff; box-shadow:0 3px 12px #143d2b25; }
.my-space-avatar img,.my-space-avatar [data-profile-initials] { width:100%; height:100%; border-radius:50%; object-fit:cover; }
.my-space-avatar [data-profile-initials] { display:grid; place-items:center; font-weight:800; }
.my-space-identity { min-width:0; }
.my-space-identity .eyebrow { margin:0 0 .15rem; color:var(--gold); font-size:.68rem; letter-spacing:.09em; }
.my-space-identity h1 { margin:0; font-size:1.25rem; line-height:1.2; overflow-wrap:anywhere; }
.my-space-handle { margin:.16rem 0 0; color:#61736a; font:600 .78rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace; }
.my-space-bio { margin:.35rem 0 0; color:#526258; font-size:.86rem; line-height:1.4; }
.profile-photo-action { display:grid; place-items:center; width:44px; height:44px; min-width:44px; min-height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:#fff; }
.profile-photo-action span[aria-hidden=true] { display:grid; place-items:center; width:1.35rem; height:1.35rem; border:1px solid #ffffffc9; border-radius:50%; background:var(--brand-deep); box-shadow:0 2px 6px #143d2b3d; font-size:.72rem; }
.profile-cover-action { position:absolute; top:.2rem; right:.2rem; }
.profile-avatar-action { position:absolute; right:-.48rem; bottom:-.48rem; }
.my-space-owner-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.4rem; margin:0; padding:0; }
.my-space-owner-actions button { min-height:40px; padding:.35rem .35rem; border:1px solid #dce7de; border-radius:.65rem; background:#fff; color:var(--brand-deep); font-size:.75rem; font-weight:750; }
.my-space-owner-actions .primary-profile-action { border-color:var(--brand); background:var(--brand); color:#fff; }
.messenger-action { position:relative; }
.my-space-composer-compact,.my-space-workspaces { margin:0; padding:.7rem; border:1px solid #dfe9e1; border-radius:.9rem; background:#fff; box-shadow:var(--shadow); }
.composer-prompt { display:flex; align-items:center; gap:.55rem; width:100%; min-height:42px; padding:.55rem .7rem; border:0; border-radius:.65rem; background:var(--surface-muted); color:#637269; text-align:left; }
.composer-prompt span:first-child { color:var(--gold); }
.composer-shortcuts { display:grid; grid-template-columns:1fr 1fr; gap:.35rem; margin-top:.35rem; }
.composer-shortcuts button { min-height:36px; border:0; border-radius:.55rem; background:transparent; color:var(--brand); font-size:.78rem; font-weight:750; }
.my-space-workspaces-heading { display:flex; align-items:center; justify-content:space-between; gap:.65rem; }
.my-space-workspaces-heading h2 { margin:0; font-size:1.05rem; }.my-space-workspaces-heading small { color:#64736a; }
.create-workspace-action { min-height:38px; border-color:var(--gold); background:var(--gold-soft); color:var(--brand-deep); }
.workspace-shortcuts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.45rem; margin-top:.6rem; }
.workspace-shortcut { display:grid; align-content:center; justify-items:start; min-height:4.4rem; padding:.55rem; border:1px solid #d8e5da; border-radius:.75rem; background:linear-gradient(145deg,#f7fbf7,#eaf4eb); color:var(--brand-deep); text-align:left; }
.workspace-shortcut:nth-child(2n) { background:linear-gradient(145deg,#fffaf0,#fff1c9); }.workspace-shortcut>span { color:var(--gold); }.workspace-shortcut small { margin-top:.1rem; color:#68766d; font-size:.68rem; }
.my-space-feed-heading { display:flex; align-items:end; justify-content:space-between; gap:.75rem; }.my-space-feed-heading .eyebrow { margin:0; color:var(--gold); font-size:.68rem; }.my-space-feed-heading h2 { margin:.1rem 0 0; font-size:1.15rem; }.my-space-feed-heading>p { margin:0; color:#68766d; font-size:.75rem; text-align:right; }
.my-space-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; overflow:hidden; margin:0; padding:.2rem; border:1px solid #d9e4da; border-radius:.7rem; background:#edf3ee; }.my-space-tabs button { min-height:34px; border:0; border-radius:.5rem; background:transparent; padding:.3rem; font-size:.76rem; }.my-space-tabs button.is-active { background:var(--brand); color:#fff; }
.social-post { margin-top:.7rem; padding:0; overflow:hidden; border:1px solid #e1e9e2; border-radius:.9rem; background:#fff; box-shadow:var(--shadow); }.social-post>header { padding:.75rem .8rem .3rem; }.my-space-post-avatar { width:2rem; height:2rem; flex-basis:2rem; background:var(--brand); color:#fff; }.post-menu { margin-left:auto; color:#6c786f; }.social-post h3,.social-post>.post-body,.social-post>.show-more { margin-inline:.85rem; }.social-post>.post-body { margin-block:.35rem; font-size:.92rem; line-height:1.52; }.show-more { border:0; background:transparent; color:var(--brand); font-size:.8rem; font-weight:750; }.interaction-summary { padding:.45rem .85rem; font-size:.75rem; }.post-actions button { min-height:40px; font-size:.72rem; }.post-actions button:active,.workspace-shortcut:active,.my-space-owner-actions button:active,.composer-shortcuts button:active { transform:scale(.98); }.post-actions button.is-working { color:var(--brand); }
.post-author-handle { display:none; }.social-post>header { align-items:center; }.social-post>header time { display:block; margin-top:.08rem; color:#718076; font-size:.73rem; }.post-menu-spacer { width:44px; height:44px; }
.simple-social-sheet { padding:.2rem; }.simple-social-sheet h2 { margin:.15rem 0 .65rem; font-size:1.1rem; }.social-composer textarea { box-sizing:border-box; width:100%; min-height:8rem; border:0; border-radius:.8rem; padding:.75rem; background:#f3f7f3; color:var(--ink); font:inherit; resize:vertical; }.social-composer-tools { display:flex; align-items:center; gap:.45rem; margin:.55rem 0; }.social-composer-tools>button { min-height:40px; border:0; border-radius:.6rem; background:#e8f0e9; color:var(--brand); font-weight:750; }.social-composer-tools .expression-picker { margin-left:auto; }.social-composer-tools .expression-picker>span { display:none; }.social-composer-tools .expression-picker button { min-width:34px; min-height:34px; }.social-media-previews { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.45rem; }.social-media-previews figure { position:relative; overflow:hidden; margin:0; border-radius:.75rem; background:#edf3ee; aspect-ratio:1; }.social-media-previews img,.social-media-previews video { width:100%; height:100%; object-fit:cover; }.social-media-previews button { position:absolute; top:.35rem; right:.35rem; display:grid; width:32px; height:32px; place-items:center; border:0; border-radius:50%; background:#183d2ddd; color:#fff; font-size:1.15rem; }.simple-social-sheet [role=status] { min-height:1.2rem; margin:.45rem 0; color:#7d3b2d; font-size:.8rem; }.simple-social-sheet .primary { width:100%; min-height:44px; }
.my-space-private-tools { padding:.2rem .1rem; color:#536259; }.my-space-private-tools summary { min-height:44px; padding:.55rem 0; font-weight:700; }
.comments-sheet { display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:.7rem; min-height:min(42rem,82dvh); }.comments-sheet>header { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding-bottom:.6rem; border-bottom:1px solid #dfe9e1; }.comments-sheet>header .eyebrow,.comments-sheet>header h2 { margin:0; }.comments-sheet>header .eyebrow { color:var(--gold); font-size:.7rem; }.comments-sheet>header button { display:grid; width:44px; height:44px; place-items:center; border:0; border-radius:50%; background:var(--surface-muted); color:var(--brand-deep); font-size:1.35rem; }.comments-list { display:grid; align-content:start; gap:.75rem; overflow:auto; padding-right:.15rem; }.my-space-comment { display:grid; grid-template-columns:2rem minmax(0,1fr); gap:.55rem; }.comment-avatar { display:grid; width:2rem; height:2rem; place-items:center; border-radius:50%; background:var(--brand); color:#fff; font-size:.75rem; font-weight:800; }.my-space-comment strong { font-size:.84rem; }.my-space-comment time { margin-left:.4rem; color:#718076; font-size:.73rem; }.my-space-comment p { margin:.2rem 0; color:#24372c; font-size:.9rem; line-height:1.42; white-space:pre-wrap; }.comment-actions { display:flex; gap:.25rem; }.comment-actions button { min-height:32px; padding:.2rem .45rem; border:0; border-radius:.45rem; background:transparent; color:var(--brand); font-size:.75rem; font-weight:700; }.comment-composer { display:grid; gap:.35rem; padding-top:.65rem; border-top:1px solid #dfe9e1; }.comment-composer textarea { box-sizing:border-box; width:100%; min-height:44px; max-height:8rem; padding:.6rem .7rem; border:1px solid #cfdcd1; border-radius:.7rem; resize:vertical; }.comment-compose-actions { display:flex; align-items:center; gap:.45rem; }.comment-compose-actions .expression-picker { display:flex; min-width:0; flex:1; align-items:center; gap:.2rem; }.comment-compose-actions .expression-picker>span { display:none; }.comment-compose-actions .expression-picker button { min-width:32px; min-height:32px; padding:.15rem; border:0; border-radius:.45rem; background:var(--surface-muted); }.comment-compose-actions .african-expressions { position:relative; }.comment-compose-actions .african-expressions summary { padding:.35rem; color:var(--brand); font-size:.7rem; }.comment-compose-actions .african-expressions[open]>p { display:none; }.comment-compose-actions .african-expressions[open] { position:absolute; bottom:2.2rem; left:0; z-index:2; display:flex; flex-wrap:wrap; gap:.2rem; width:13rem; padding:.35rem; border:1px solid #dfe9e1; border-radius:.65rem; background:#fff; box-shadow:var(--shadow); }.comment-compose-actions .african-expressions[open] span { display:none; }.comment-compose-actions [role=status] { margin:0; color:#a23b30; font-size:.75rem; }.comment-compose-actions .primary { min-height:38px; white-space:nowrap; }
.bottom-nav { box-shadow:0 -5px 20px #143d2b12; }.bottom-nav .create { background:var(--gold); border:3px solid var(--cream); box-shadow:0 3px 10px #b9871c55; }

@media (max-width:47.99rem) {
  /* The cover control is an unobtrusive 32px circle on a phone; the cover image is untouched. */
  .personal-cover>.profile-cover-action { top:.4rem; right:.4rem; width:32px; height:32px; min-width:32px; min-height:32px; }
  .personal-cover>.profile-cover-action span[aria-hidden=true] { width:1rem; height:1rem; }
  .topbar { min-height:3.35rem; padding:.4rem .7rem; grid-template-columns:auto minmax(0,1fr) 40px; }
  .topbar>.brand img { width:7.5rem; height:1.75rem; }.mobile-context { max-width:none; padding:.2rem .35rem; }.mobile-context-copy { font-size:.68rem; }.mobile-context-copy>strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.78rem; }
  .personal-cover,.personal-cover img { min-height:5.35rem; height:5.35rem; }.my-space-header { padding:.6rem .7rem .7rem; }.my-space-avatar { flex-basis:3.65rem; width:3.65rem; height:3.65rem; margin-top:-1.35rem; }.my-space-identity h1 { font-size:1.12rem; }.my-space-bio { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:.82rem; }
  .my-space-owner-actions { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.4rem; }.my-space-owner-actions button { min-height:44px; padding:.45rem .5rem; font-size:.78rem; }
  .workspace-shortcuts { grid-template-columns:repeat(2,minmax(0,1fr)); }.workspace-shortcut { min-height:3.9rem; }.my-space-feed-heading>p { display:none; }.bottom-nav { grid-template-columns:repeat(4,minmax(0,1fr)); }.bottom-nav>a,.bottom-nav>button { font-size:.7rem; }
}
@media (max-width:23rem) { .brand img { width:6.8rem; }.my-space-owner-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }.workspace-shortcuts { gap:.35rem; } }
.notification-action { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.2rem; }.notification-badge { position:absolute; top:-.32rem; right:-.28rem; min-width:1.15rem; padding:.08rem .22rem; border:2px solid #fff; border-radius:999px; background:#a23b30; color:#fff; font-size:.63rem; line-height:1.1; }.social-notifications>header { display:flex; align-items:center; justify-content:space-between; gap:.7rem; }.social-notifications>header h2 { margin:.15rem 0 .7rem; }.social-notifications>header button { min-height:36px; border:0; border-radius:.55rem; background:var(--surface-muted); color:var(--brand); font-weight:750; }.social-notifications .result { display:grid; grid-template-columns:2rem minmax(0,1fr); gap:.55rem; margin:.4rem 0; padding:.65rem; border-radius:.7rem; }.social-notifications .result.is-unread { background:#edf5ee; }.social-notifications .result p,.social-notifications .result small { margin:.12rem 0; }.social-notifications .result small { color:#718076; }
.my-space-comment.is-reply { margin-left:1.1rem; padding-left:.55rem; border-left:2px solid #dfe9e1; }
#panel.comments-open>.dialog-close { display:none; }.comments-sheet { min-height:min(36rem,82dvh); }.comment-composer { display:grid; grid-template-columns:2rem minmax(0,1fr) 40px auto; align-items:end; gap:.4rem; width:100%; padding-top:.55rem; }.comment-input-shell { min-width:0; }.comment-composer textarea { display:block; width:100%; min-width:0; min-height:42px; max-height:8rem; overflow-y:auto; resize:none; }.comment-emoji-picker { position:relative; }.comment-emoji-picker summary { display:grid; width:40px; height:40px; place-items:center; list-style:none; border:1px solid #cfdcd1; border-radius:.65rem; background:var(--surface-muted); cursor:pointer; }.comment-emoji-picker summary::-webkit-details-marker { display:none; }.comment-emoji-picker[open]>div { position:absolute; right:0; bottom:calc(100% + .35rem); z-index:3; display:grid; grid-template-columns:repeat(4,36px); gap:.2rem; padding:.35rem; border:1px solid #dfe9e1; border-radius:.65rem; background:#fff; box-shadow:var(--shadow); }.comment-emoji-picker button { display:grid; width:36px; height:36px; place-items:center; border:0; border-radius:.45rem; background:var(--surface-muted); font-size:1rem; }.comment-send { min-width:0; min-height:40px; padding:.35rem .6rem; border:0; border-radius:.65rem; background:var(--brand); color:#fff; font:750 .78rem/1 inherit; }.comment-reply-context,.comment-composer [role=status] { grid-column:2 / -1; margin:0; font-size:.75rem; }.comment-reply-context { display:flex; align-items:center; gap:.4rem; color:#536259; }.comment-reply-context[hidden] { display:none; }.comment-reply-context button { min-height:30px; border:0; border-radius:.45rem; background:var(--surface-muted); color:var(--brand); font-weight:700; }.comments-sheet .comments-list { min-height:0; }.comments-sheet .comment-composer { position:sticky; bottom:0; background:#fff; }
.comment-actions { display:flex; flex-wrap:wrap; gap:.45rem; }.comment-actions button { min-height:32px; padding:.2rem .35rem; border:0; background:transparent; color:var(--brand); font-weight:700; }.comment-actions [data-comment-like][aria-pressed="true"] { color:#145a32; background:#d9eadc; border-radius:.45rem; }
.post-actions [data-my-space-react][aria-pressed="true"] { color:#145a32; background:#d9eadc; border-color:#145a32; font-weight:800; }