:root{
  color-scheme:dark;
  --bg:#101113;--panel:#191b1f;--panel2:#202329;--panel3:#25282e;
  --line:#30343b;--text:#f1f1ef;--muted:#a1a5ad;
  --gold:#c6a15b;--gold2:#e2c17c;--goldGlow:rgba(198,161,91,.24);
  --green:#42c58a;--red:#e15b64;--radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(ellipse at 50% -20%,rgba(198,161,91,.07),transparent 42%),var(--bg);color:var(--text);font:15px/1.5 Inter,system-ui,-apple-system,Segoe UI,sans-serif}
a{color:var(--gold2);text-decoration:none}
a:hover{color:#fff}
button,input,textarea,select{font:inherit}
button{background:#292c32;border:1px solid #444954;color:var(--text);padding:10px 15px;border-radius:10px;font-weight:650;cursor:pointer;transition:border-color .18s,background .18s,transform .18s}
button:hover{border-color:var(--gold);transform:translateY(-1px)}
button:disabled{opacity:.45;cursor:not-allowed;transform:none}
button.primary,.primary{background:linear-gradient(135deg,#b48b45,#e2c17c);border:0;color:#191713;box-shadow:0 4px 18px rgba(198,161,91,.18)}
input,textarea,select{display:block;width:100%;min-width:0;margin-top:6px;background:#111317;border:1px solid var(--line);border-radius:10px;padding:11px 13px;color:var(--text);outline:none}
input:focus,textarea:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(198,161,91,.12)}
textarea{resize:vertical;line-height:1.55}
input[type=checkbox],input[type=radio]{display:inline-block;width:auto;margin:0;accent-color:var(--gold)}
input[type=file]{font-size:12px;color:var(--muted)}
label{display:block;color:#c9cbd0;font-size:13px;margin:12px 0}
.muted,.small{color:var(--muted)}.small{font-size:12px}
.eyebrow{color:var(--gold2);font-size:10px;letter-spacing:.18em;font-weight:800;margin:0 0 6px;text-transform:uppercase}
h1,h2,h3,p{overflow-wrap:anywhere}
h1{font-size:27px;line-height:1.2;margin:0 0 8px;letter-spacing:-.025em}
h2{font-size:18px;margin:0 0 14px}
h3{font-size:16px;margin:12px 0 8px}
.brand{font-weight:850;letter-spacing:.08em;color:var(--gold2);font-size:25px}
.brand-lockup{display:flex;align-items:center;gap:10px;letter-spacing:.01em;text-transform:none}
.brand-lockup img{width:42px;height:42px;filter:drop-shadow(0 0 8px rgba(226,193,124,.42))}
.brand-lockup span{font-size:25px;font-weight:800;letter-spacing:.03em;background:linear-gradient(110deg,#fff6dc,var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
.brand small{display:block;font-size:10px;color:var(--muted);letter-spacing:.18em}
/* Authentication and installer retain the existing dark/gold palette. */
.auth,.installer{width:min(560px,calc(100% - 32px));margin:6vh auto;padding:28px;background:rgba(25,27,31,.94);border:1px solid var(--line);border-radius:22px;box-shadow:0 16px 60px rgba(0,0,0,.28)}
.auth h1,.installer h1{font-size:30px;line-height:1.2;margin:18px 0 8px}
.auth .panel,.installer .panel{margin:18px 0}
.installer{width:min(780px,calc(100% - 24px));margin:4vh auto}
.installer form{margin-top:20px}.installer .primary{width:100%;margin-top:14px}.installer .grid label{margin:0}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.optional{font-size:11px;color:var(--muted);font-weight:400}
.panel{background:linear-gradient(145deg,rgba(28,30,35,.96),rgba(22,24,28,.96));border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin:18px 0;box-shadow:0 10px 36px rgba(0,0,0,.12)}
.panel h2,form h2{margin:0 0 14px;font-size:17px}
.alert,.success{padding:12px 14px;border-radius:11px;margin:14px 0;background:#462323;color:#ffb8b8;border:1px solid rgba(225,91,100,.25)}
.success{background:#183d2d;color:#b5f1cc;border-color:rgba(66,197,138,.25)}
/* Top bar and four primary destinations. */
.topbar{height:72px;position:relative;z-index:20;border-bottom:1px solid rgba(198,161,91,.22);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 26px;background:rgba(18,19,22,.94);backdrop-filter:blur(18px)}
.topbar:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.35}
.userline{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;white-space:nowrap}.userline form{margin:0}.userline button{padding:6px 10px;font-size:12px}
.layout{display:grid;grid-template-columns:248px minmax(0,1fr);height:calc(100vh - 72px);min-height:0}
.sidebar{background:linear-gradient(180deg,#151619,#131417);border-right:1px solid var(--line);padding:22px 15px 18px;overflow:auto;display:flex;flex-direction:column;gap:22px}
.primary-nav{display:grid;gap:7px}
.nav-item{display:flex;align-items:center;gap:13px;min-height:48px;padding:10px 13px;border:1px solid transparent;border-radius:13px;color:#d7d8db;font-weight:600;transition:.18s}
.nav-item:hover{background:#202227;border-color:#34363b;color:#fff}
.nav-item.active{color:#fff;background:linear-gradient(110deg,rgba(198,161,91,.22),rgba(198,161,91,.05));border-color:rgba(198,161,91,.58);box-shadow:0 0 0 1px rgba(198,161,91,.08),0 0 18px rgba(198,161,91,.11)}
.nav-item em{font-style:normal;font-size:11px;margin-left:auto;background:#be4b4b;color:white;border-radius:20px;min-width:20px;text-align:center;padding:2px 6px}
.nav-icon{font-size:22px;color:var(--gold2);width:25px;text-align:center;line-height:1}
.sidebar-section{padding-top:15px;border-top:1px solid rgba(255,255,255,.06)}
.section-heading{display:flex;justify-content:space-between;align-items:center;color:#d3d2ce;font-size:13px;font-weight:750;padding:0 8px 9px}
.section-heading span,.section-heading a{font-size:11px;color:var(--muted);font-weight:500}
.story-create-link{display:block;text-align:center;border:1px dashed rgba(198,161,91,.45);border-radius:12px;padding:10px;color:var(--gold2);background:rgba(198,161,91,.055)}
.community{display:block;padding:9px 11px;border-radius:9px;color:var(--text);margin:3px 0;font-size:13px}
.community.active,.community:hover{background:#2b2923;color:var(--gold2)}
.create{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}.create button{width:100%;margin-top:8px}
.sidebar-bottom{margin-top:auto;display:flex;flex-wrap:wrap;gap:7px 14px;padding:14px 8px 0;border-top:1px solid rgba(255,255,255,.06);font-size:11px;color:var(--muted)}
.sidebar-bottom a{color:var(--muted)}.sidebar-bottom a:hover{color:var(--gold2)}.sidebar-bottom span{flex-basis:100%;opacity:.68;margin-top:5px}
/* Common page canvas. The home feed expands to the available width; there is no global right rail. */
.chat{display:flex;flex-direction:column;min-width:0;min-height:0;padding:24px;overflow:auto}
.circle-main{align-items:stretch;padding:30px clamp(18px,3.2vw,54px) 45px;scrollbar-color:#48413a transparent}
.circle-main>.page-heading,.circle-main>.stories-strip,.circle-main>.composer-card,.circle-main>.feed-heading,.circle-main>.feed-post,.circle-main>.empty-feed,.circle-main>.community-discovery{width:min(100%,1120px);margin-left:auto;margin-right:auto}
.page-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:17px!important}
.page-heading h1{font-size:31px;margin:0}
.stories-strip{padding:14px 0 16px;margin-bottom:12px!important;border-bottom:1px solid rgba(255,255,255,.06)}
.stories-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.stories-head h2{margin:0;font-size:15px}
.stories-row{display:flex;gap:14px;overflow:auto;padding:3px 2px 8px;scrollbar-width:thin}
.story-card{flex:0 0 88px;display:flex;align-items:center;flex-direction:column;gap:5px;color:var(--text);font-size:11px;text-align:center;min-width:0}
.story-card strong{font-size:11px;font-weight:650;max-width:86px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.story-card small{font-size:10px;color:var(--muted)}
.story-ring{width:68px;height:68px;border-radius:50%;padding:3px;border:2px solid var(--gold2);box-shadow:0 0 13px rgba(198,161,91,.25);background:#24211c;display:grid;place-items:center;overflow:hidden}
.story-ring img{width:100%;height:100%;object-fit:cover;border-radius:50%}.story-ring span{font-size:24px;color:var(--gold2)}
.story-add{border:1px dashed rgba(198,161,91,.42);border-radius:14px;padding:7px 5px 6px;background:rgba(198,161,91,.035)}
.story-add form{margin:0;width:100%}.story-add-button{display:flex;align-items:center;gap:6px;flex-direction:column;margin:0;cursor:pointer;font-size:11px}.story-add-button>span{width:55px;height:55px;border-radius:50%;border:1px solid var(--gold);display:grid;place-items:center;font-size:27px;color:var(--gold2)}.story-add-button input{display:none}.small-button{font-size:10px;padding:4px 8px;margin-top:5px}
.composer-card{background:linear-gradient(145deg,#1c1e23,#17191d);border:1px solid rgba(198,161,91,.42);border-radius:17px;padding:17px 18px;margin-top:12px!important;margin-bottom:20px!important;box-shadow:0 0 18px rgba(198,161,91,.07)}
.composer-card form{margin:0}.composer-card input[name=title]{font-weight:650}.composer-card textarea{min-height:78px}
.composer-intro{display:flex;align-items:center;gap:11px;margin-bottom:8px}.composer-intro>div:last-child{display:grid}.composer-intro strong{font-size:13px}.current-user-avatar,.post-avatar,.conversation-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:radial-gradient(circle at 32% 22%,#665233,#292117 70%);border:1px solid var(--gold);color:#f4d99e;font-weight:800;font-size:17px}
.composer-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}.composer-actions .primary{margin-left:auto}.file-pill{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:30px;padding:7px 12px;margin:0;color:var(--gold2);cursor:pointer}.file-pill input{display:none}.composer-actions .small{font-size:10px}
.feed-heading{display:flex;justify-content:space-between;align-items:center;margin:9px auto 10px!important}.feed-heading h2{margin:0;font-size:17px}
.feed-post{background:linear-gradient(145deg,rgba(26,28,33,.98),rgba(19,21,25,.98));border:1px solid var(--gold);border-radius:17px;padding:18px;margin:12px auto 17px!important;box-shadow:0 0 0 1px rgba(198,161,91,.18),0 0 19px rgba(198,161,91,.14),0 12px 35px rgba(0,0,0,.2);overflow:hidden}
.post-head{display:flex;align-items:center;gap:11px;margin-bottom:12px}.post-author{display:flex;flex-direction:column;min-width:0;gap:2px}.post-author strong{font-size:13px}.post-author span{font-size:11px;color:var(--muted)}.post-owned{margin-left:auto;color:var(--muted);font-size:10px}
.feed-post h3{font-size:18px;margin:12px 0 6px}.post-body{white-space:normal;color:#d7d8dc;margin:0 0 14px;line-height:1.65}
.post-media{width:100%;max-height:440px;overflow:hidden;border-radius:12px;border:1px solid rgba(198,161,91,.62);background:#08090b;box-shadow:0 0 14px rgba(198,161,91,.14)}
.post-media img,.post-media video{display:block;width:100%;max-height:440px;object-fit:cover}.post-actions{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:11px;padding-top:12px;margin-top:13px;border-top:1px solid rgba(255,255,255,.06)}
.empty-feed{background:linear-gradient(145deg,#1c1e23,#15171b);border:1px solid rgba(198,161,91,.36);border-radius:20px;padding:38px 20px;text-align:center;margin:20px auto!important}.empty-feed h2{margin:12px 0 6px}.empty-orbit{width:60px;height:60px;margin:0 auto;border:2px solid var(--gold2);box-shadow:0 0 18px var(--goldGlow);border-radius:50%;display:grid;place-items:center;color:var(--gold2);font-size:28px;font-weight:800}.button-link{display:inline-block;margin-top:12px;background:linear-gradient(135deg,#b48b45,#e2c17c);color:#171614;padding:10px 16px;border-radius:10px;font-weight:700}
.community-discovery{margin:20px auto!important}.community-discovery h2{font-size:15px}.community-chips{display:flex;flex-wrap:wrap;gap:9px}.community-chips a{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:10px 13px;border:1px solid var(--line);border-radius:12px;background:#191b20;color:var(--text);font-size:12px}.community-chips span{color:var(--gold2);font-size:10px}
/* Profile: a personal identity page rather than a copy of another network. */
.profile-hero{width:min(100%,980px);margin:0 auto 24px;border:1px solid color-mix(in srgb,var(--profile-accent,#C6A15B) 55%,transparent);border-radius:20px;overflow:hidden;background:#191b20;box-shadow:0 0 24px rgba(198,161,91,.10)}
.profile-cover{height:175px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 65% 45%,color-mix(in srgb,var(--profile-accent,#C6A15B) 28%,transparent),transparent 27%),linear-gradient(120deg,#17191e,#28231b 55%,#111317)}
.profile-cover:before,.profile-cover:after{content:"";position:absolute;border:1px solid rgba(226,193,124,.35);border-radius:50%;width:260px;height:260px;right:12%;top:-155px;box-shadow:0 0 35px rgba(198,161,91,.12)}.profile-cover:after{width:340px;height:340px;right:8%;top:-195px}
.profile-cover>span{position:absolute;left:22px;bottom:18px;font-size:10px;letter-spacing:.22em;color:var(--profile-accent,var(--gold2));font-weight:800}
.profile-cover-orbit{position:absolute;right:22%;bottom:-46px;width:160px;height:160px;border:1px solid rgba(226,193,124,.28);border-radius:50%;box-shadow:0 0 40px rgba(198,161,91,.12)}
.profile-identity{display:flex;align-items:center;gap:17px;padding:0 24px 22px;flex-wrap:wrap}
.profile-avatar-large{width:100px;height:100px;border-radius:50%;margin-top:-46px;position:relative;z-index:1;border:4px solid #191b20;background:#2b261d;box-shadow:0 0 0 1px var(--gold),0 0 18px rgba(198,161,91,.26);display:grid;place-items:center;font-size:34px;color:var(--gold2);overflow:hidden}
.profile-avatar-large img{width:100%;height:100%;object-fit:cover}.profile-name{padding-top:8px;min-width:220px}.profile-name h1{font-size:25px;margin:0 0 4px}.profile-name span{color:var(--muted);font-size:12px}.profile-stats{display:flex;gap:24px;margin-left:auto;padding-top:18px}.profile-stats div{display:grid;text-align:center}.profile-stats strong{font-size:20px;color:var(--gold2)}.profile-stats span{font-size:10px;color:var(--muted)}
.profile-edit-heading{width:min(100%,980px);margin:0 auto 15px;display:flex;justify-content:space-between;align-items:center;gap:12px}.profile-edit-heading h2{margin:0}.profile-edit-heading p{font-size:12px;margin:3px 0 0}.subtle-link{font-size:12px;color:var(--gold2);border:1px solid rgba(198,161,91,.3);padding:8px 12px;border-radius:10px;white-space:nowrap}
/* Messenger */
.messenger-heading{width:min(100%,1000px);margin:0 auto 16px;display:flex;justify-content:space-between;gap:15px;align-items:center}.messenger-heading h1{font-size:29px}.favorite-shortcut{border:1px solid rgba(198,161,91,.48);border-radius:11px;padding:10px 14px;background:rgba(198,161,91,.07);white-space:nowrap}
.messenger-tabs{width:min(100%,1000px);margin:0 auto;display:flex;gap:8px;padding:5px;border-radius:12px;background:#17191d;border:1px solid var(--line)}.messenger-tabs a{padding:8px 15px;border-radius:9px;color:var(--muted);font-size:12px}.messenger-tabs a.active{background:rgba(198,161,91,.17);color:var(--gold2)}
.messenger-list{width:min(100%,1000px);margin:15px auto}.messenger-list-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.messenger-list-head h2{margin:0}.messenger-list-head a{font-size:11px}
.conversation-row{display:flex;align-items:center;gap:12px;border-top:1px solid rgba(255,255,255,.055);padding:12px 2px}.conversation-avatar{width:42px;height:42px;font-size:20px}.conversation-link{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1;color:var(--text)}.conversation-link strong{font-size:13px}.conversation-link span{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-tools{display:flex;align-items:center;gap:8px}.conversation-tools small{font-size:10px;color:var(--muted)}.conversation-tools form{margin:0}.conversation-tools button{padding:6px 9px}
.dialog-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-title form{margin:0}.dialog-title h2{margin:0}.dialog-title button{color:var(--gold2)}
/* Group room: first local sidebar = News/Chat; right rail = voice and member panels. */
.group-hero{width:100%;margin:0 auto 17px;border:1px solid rgba(198,161,91,.42);border-radius:16px;overflow:hidden;background:#191b20;box-shadow:0 0 18px rgba(198,161,91,.09)}
.group-cover{height:165px;background:radial-gradient(ellipse at 72% 20%,color-mix(in srgb,var(--group-accent,#C6A15B) 28%,transparent),transparent 35%),linear-gradient(115deg,#191b20,#28231b 58%,#121316);background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:16px 20px}.group-cover span{font-size:10px;letter-spacing:.2em;color:var(--gold2);font-weight:800;text-shadow:0 1px 7px #000}
.group-title-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:14px 18px}.group-title-row h1{font-size:22px;margin:0 0 4px}.group-title-row .muted{font-size:11px}
.group-layout{display:grid;grid-template-columns:126px minmax(0,1fr) 276px;gap:15px;align-items:start;min-height:0}
.group-subnav{position:sticky;top:12px;display:grid;gap:8px;padding:8px;background:#17191d;border:1px solid var(--line);border-radius:13px}
.group-subnav a{display:flex;align-items:center;gap:7px;padding:11px 10px;border-radius:9px;color:var(--muted);font-size:12px;font-weight:700}.group-subnav a.active{color:var(--gold2);background:rgba(198,161,91,.16);box-shadow:inset 0 -2px var(--gold)}
.group-main{min-width:0}.group-main>.composer-card{width:100%;margin:0 0 14px!important}.group-main>.feed-post{width:100%;margin:0 0 15px!important}
.group-right{display:grid;gap:13px;min-width:0}.group-right-card{background:linear-gradient(145deg,#1b1d22,#15171b);border:1px solid var(--line);border-radius:15px;padding:14px;min-width:0}.group-right-title{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.06);padding-bottom:10px;margin-bottom:10px}.group-right-title strong{font-size:13px}.voice-channel-preview{display:flex;align-items:center;gap:10px;padding:11px 8px;border-radius:10px;background:rgba(198,161,91,.07)}.voice-channel-preview>span{font-size:22px;color:var(--gold2)}.voice-channel-preview div{display:grid}.voice-channel-preview strong{font-size:12px}.voice-channel-preview small{font-size:10px;color:var(--muted)}.group-voice-join{width:100%;margin:10px 0}.call-controls.compact{display:flex;flex-wrap:wrap}.call-controls.compact button{flex:1 1 70px;padding:7px;font-size:10px}
.member-status-heading{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:12px 0 6px}.member-row{display:flex;align-items:center;gap:8px;padding:5px 2px;color:#dedfe2;font-size:11px}.member-row:hover{color:var(--gold2)}.member-row.offline{opacity:.45}.online-dot,.offline-dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex:0 0 8px}.offline-dot{background:#68707a}
/* Existing Discord-style chat controls and messages. */
.chathead{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:16px;gap:12px}.chathead h1{font-size:21px;margin:0}.call{background:#253a30;border-color:#416d55}.call-controls{display:flex;gap:8px;flex-wrap:wrap}.video-grid{display:flex;flex-wrap:wrap;gap:10px;padding:12px 0}.video-grid video{width:min(320px,100%);aspect-ratio:16/9;background:#08090b;border:1px solid var(--line);border-radius:12px;object-fit:cover}.video-grid:empty{display:none}
.messages{flex:1;overflow:auto;padding:18px 0;min-height:180px}.message{padding:10px 12px;border-bottom:1px solid #25282d}.message strong{color:var(--gold2)}.message time{font-size:11px;color:var(--muted);margin-left:8px}.message-tools{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.message-tools form{display:inline}.message-tools button{font-size:11px;padding:5px 8px}.pinned{color:var(--gold2)}.composer{display:flex;gap:10px;border-top:1px solid var(--line);padding-top:14px;flex-wrap:wrap}.composer input{margin:0}.composer input[name=body]{flex:1;min-width:160px}.composer input[type=file]{max-width:240px}.composer button{white-space:nowrap}.channel-nav{display:flex;gap:8px;overflow:auto;padding:8px 0;border-bottom:1px solid var(--line)}.channel-link{white-space:nowrap;padding:7px 10px;border-radius:8px;background:#1a1c20;color:var(--muted);font-size:13px}.channel-link.active{background:#302a1e;color:var(--gold2)}
.feature-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.feature-row:last-child{border-bottom:0}.feature-row form{margin:0}.feature-row button{min-width:100px}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.stat{background:#111317;border:1px solid var(--line);border-radius:10px;padding:14px;display:flex;flex-direction:column}.stat strong{font-size:25px;color:var(--gold2)}.stat span{font-size:12px;color:var(--muted)}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:4px}.checks label{display:flex;align-items:center;gap:7px}.checks input{width:auto;margin:0}.check-row{display:flex;align-items:center;gap:10px;margin:10px 0}.check-row input{width:auto}.optional{font-size:11px;color:var(--muted);font-weight:400}
/* Presence and account security modules. */
.presence-select-label{display:inline-flex;align-items:center;gap:6px;margin:0 8px;vertical-align:middle}.presence-select-label select{max-width:145px;padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:inherit}.presence-list{display:grid;gap:7px;padding:4px 2px 10px}.presence-person{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px}.presence-dot{width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:#737b89}.presence-dot.status-online{background:#28b879}.presence-dot.status-idle{background:#e4ad42}.presence-dot.status-dnd{background:#e15b64}.presence-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.presence-state{margin-left:auto;color:var(--muted);font-size:11px;white-space:nowrap}.push-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px}.push-controls .small{flex-basis:100%}
.avatar{width:88px;height:88px;object-fit:cover;border-radius:50%;border:2px solid var(--gold);display:block;margin:10px 0}.join-form{display:flex;align-items:center;gap:6px;margin:6px 0}.join-form span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:13px;color:var(--muted)}.join-form button{padding:6px 9px;font-size:12px}
.reply-preview{border-left:2px solid var(--gold);padding:4px 8px;margin:6px 0;opacity:.85}.reply-notice{margin:8px 0;padding:6px 8px;background:rgba(198,161,91,.08);border-radius:6px}.message>button{margin:5px 5px 0 0}.read-receipt{display:inline-block;margin-left:4px;font-size:.78rem;opacity:.8}.messages+.small[aria-live="polite"]{min-height:1.25rem;padding:0 10px}.pinned{color:var(--gold2)}
.voice-audio{display:block;width:min(100%,360px);margin:8px 0}.message-image-link{display:inline-block;max-width:min(100%,520px);margin-top:8px;border-radius:12px;overflow:hidden;border:1px solid var(--line)}.message-image-preview{display:block;max-width:100%;max-height:360px;width:auto;height:auto;object-fit:contain;background:rgba(0,0,0,.08)}.message-video-preview{display:block;width:min(100%,560px);max-height:360px;background:#000;border-radius:10px;margin-top:8px}.message-target-highlight{outline:2px solid var(--gold);outline-offset:3px;background:rgba(198,161,91,.10);transition:background .25s ease}
.voice-moderation{padding:12px}.empty{margin:auto;text-align:center}.data-table{width:100%;border-collapse:collapse}.data-table td,.data-table th{padding:9px;border-bottom:1px solid var(--line);text-align:left}.optional{font-size:11px}.small.muted{font-size:12px}
/* Tablet and mobile: the four core actions remain easy to reach. */
@media(max-width:1120px){.group-layout{grid-template-columns:110px minmax(0,1fr) 240px;gap:10px}.circle-main{padding-left:20px;padding-right:20px}}
@media(max-width:900px){.layout{grid-template-columns:210px minmax(0,1fr)}.group-layout{grid-template-columns:105px minmax(0,1fr)}.group-right{grid-column:2;grid-template-columns:1fr 1fr}.group-main{grid-column:2}.group-subnav{grid-row:1 / span 2}.profile-stats{margin-left:0}.userline{gap:7px}}
@media(max-width:680px){
 .topbar{height:62px;padding:0 13px}.brand-lockup img{width:35px;height:35px}.brand-lockup span{font-size:21px}.userline{font-size:11px;gap:5px}.userline .presence-select-label{margin:0}.userline .presence-select-label .small{display:none}.userline select{max-width:85px!important}.layout{display:flex;flex-direction:column;height:calc(100dvh - 62px);min-height:0}.sidebar{order:0;flex:0 0 auto;overflow:visible;padding:8px 8px 7px;border-right:0;border-bottom:1px solid var(--line);background:#151619}.primary-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.nav-item{flex-direction:column;justify-content:center;gap:3px;min-height:58px;padding:6px 3px;font-size:10px;text-align:center}.nav-icon{font-size:20px;width:auto}.nav-item em{position:absolute;transform:translate(25px,-17px);margin:0;font-size:9px;min-width:16px}.story-shortcut,.sidebar-section:not(.story-shortcut),.sidebar-bottom{display:none}.chat{padding:13px;overflow:auto;min-height:0;flex:1}.circle-main{padding:17px 12px 34px}.page-heading h1{font-size:25px}.stories-strip{padding-top:2px}.stories-row{gap:10px}.story-card{flex-basis:76px}.story-ring{width:60px;height:60px}.composer-card{padding:13px}.composer-actions .primary{width:100%;margin-left:0}.composer-actions .small{flex-basis:100%}.feed-post{padding:13px;border-radius:14px}.feed-post h3{font-size:16px}.post-media img,.post-media video{max-height:300px;object-fit:contain}.profile-cover{height:125px}.profile-identity{padding:0 14px 16px;gap:12px}.profile-avatar-large{width:78px;height:78px;margin-top:-36px}.profile-name{min-width:150px}.profile-name h1{font-size:20px}.profile-stats{flex-basis:100%;justify-content:flex-start;padding-top:2px;gap:20px}.profile-edit-heading{align-items:flex-start;flex-direction:column}.messenger-heading{align-items:flex-start;flex-direction:column}.messenger-heading h1{font-size:24px}.messenger-list{padding:14px}.conversation-tools small{display:none}.conversation-row{gap:8px}.group-cover{height:118px}.group-title-row{align-items:flex-start;padding:12px}.group-title-row h1{font-size:19px}.group-layout{grid-template-columns:1fr;gap:12px}.group-subnav{position:static;display:flex;grid-row:auto;grid-column:auto}.group-subnav a{flex:1;justify-content:center}.group-main{grid-column:auto}.group-right{grid-column:auto;grid-template-columns:1fr}.group-right-card{padding:12px}.chathead{flex-direction:column;align-items:flex-start}.composer{display:grid;grid-template-columns:1fr 1fr;gap:8px}.composer input[name=body]{grid-column:1/-1;width:100%;min-width:0}.composer input[type=file]{grid-column:1/-1;width:100%;max-width:none}.composer button{min-height:42px}.voice-audio{width:100%}.grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.checks{grid-template-columns:1fr}.auth,.installer{padding:20px 14px;margin:3vh auto}.auth h1,.installer h1{font-size:25px}.call-controls{gap:6px}.call-controls button{flex:1 1 42%;font-size:12px;padding:8px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Circle 4.0.0 additions */
.profile-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}.profile-actions form{margin:0}.active-meetings{width:min(100%,1000px);margin:15px auto}.meeting-row{display:flex;align-items:center;gap:12px;padding:11px 5px;border-top:1px solid rgba(255,255,255,.06);color:var(--text)}.meeting-row>span{font-size:23px;color:var(--gold2)}.meeting-row div{display:grid;flex:1;min-width:0}.meeting-row strong{font-size:13px}.meeting-row small{font-size:10px;color:var(--muted)}.meeting-row b{font-size:11px;color:var(--gold2)}.create-meeting-panel{width:min(100%,1000px);margin:15px auto}.meeting-friends{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px 12px;max-height:180px;overflow:auto;margin:8px 0}.friend-check{display:flex;align-items:center;gap:8px;padding:5px 2px;margin:0;font-size:12px}.friend-check input{width:auto}.voice-channel-list{display:grid;gap:5px}.voice-channel-preview{border:1px solid transparent;color:var(--text)}.voice-channel-preview.active{border-color:rgba(198,161,91,.55);background:rgba(198,161,91,.12)}.temp-voice-create{border-top:1px solid rgba(255,255,255,.07);margin-top:13px;padding-top:7px}.temp-voice-create label{font-size:11px}.temp-voice-create input{padding:8px 9px}.temp-voice-create button{width:100%;font-size:11px;padding:8px}
@media(max-width:680px){.meeting-friends{grid-template-columns:1fr}.meeting-row{gap:8px}.meeting-row b{font-size:10px}}
.create-home-group{display:flex;gap:8px;align-items:center;margin-top:13px}.create-home-group input{max-width:360px;margin:0}.create-home-group button{white-space:nowrap}
@media(max-width:680px){.create-home-group{display:grid;grid-template-columns:1fr}.create-home-group input{max-width:none}}
.profile-bio{padding:0 24px 18px;color:#d3d4d8;font-size:13px;line-height:1.6}.public-profile-actions{width:min(100%,980px);margin:0 auto 12px}.public-profile-feed-heading{width:min(100%,980px);margin:16px auto 10px!important}.public-profile-hero{width:min(100%,980px)}
@media(max-width:680px){.profile-bio{padding:0 14px 16px}.public-profile-actions{gap:7px}}


/* Circle 4.2.0 — restrained surfaces, outline-only states, and compact navigation. */
:root{--goldGlow:rgba(198,161,91,.10)}
body{background:var(--bg)}
.topbar{background:var(--bg);backdrop-filter:none;border-bottom:1px solid var(--line)}
.topbar:after{display:none}
.brand-lockup span{background:none;color:var(--gold2);-webkit-text-fill-color:currentColor;font-weight:750;letter-spacing:.02em}
.button.primary,button.primary,.primary{background:transparent!important;color:var(--gold2)!important;border:1px solid var(--gold)!important;box-shadow:none!important}
button{background:transparent;border-color:var(--line);border-radius:9px}
button:hover{background:transparent;border-color:var(--gold);box-shadow:0 0 9px rgba(198,161,91,.10)}
.panel,.composer-card,.group-right-card,.group-subnav{background:var(--panel);box-shadow:none;border-color:var(--line);border-radius:12px}
.nav-item{border-radius:9px;background:transparent}
.nav-item:hover{background:transparent;border-color:var(--gold);box-shadow:0 0 8px rgba(198,161,91,.10)}
.nav-item.active,.channel-link.active,.group-subnav a.active,.voice-channel-preview.active{background:transparent!important;color:var(--gold2)!important;border:1px solid var(--gold)!important;box-shadow:0 0 0 1px rgba(198,161,91,.12),0 0 10px rgba(198,161,91,.12)!important;animation:circleGoldOutline 2.8s ease-in-out infinite}
@keyframes circleGoldOutline{0%,100%{box-shadow:0 0 0 1px rgba(198,161,91,.10),0 0 5px rgba(198,161,91,.08)}50%{box-shadow:0 0 0 1px rgba(226,193,124,.30),0 0 13px rgba(198,161,91,.20)}}
.feed-post{background:var(--panel);border:1px solid var(--gold);border-radius:12px;box-shadow:0 0 7px rgba(198,161,91,.08);padding:18px}
.composer-card{border-color:var(--line)}
.group-cover{background-color:var(--panel);background-image:none}
.group-right-card{background:var(--panel)}
.voice-channel-preview{background:transparent;border:1px solid transparent}
.voice-channel-preview.active{background:transparent!important}
.header-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.icon-control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border:1px solid var(--line);border-radius:9px;color:var(--gold2);background:transparent;font-size:18px;line-height:1}
.icon-control:hover,.icon-control[aria-pressed="true"]{border-color:var(--gold);background:transparent;box-shadow:0 0 8px rgba(198,161,91,.10)}
.notification-control i{position:absolute;right:-5px;top:-5px;min-width:16px;height:16px;padding:0 4px;border:1px solid var(--gold);border-radius:9px;background:var(--bg);font-size:10px;font-style:normal;text-align:center;line-height:14px}
.layout{grid-template-columns:248px minmax(0,1fr);transition:grid-template-columns .22s ease}
.layout>.sidebar{min-width:0;transition:padding .22s ease}
body.sidebar-collapsed .layout{grid-template-columns:72px minmax(0,1fr)}
body.sidebar-collapsed .sidebar{padding-left:10px;padding-right:10px;overflow-x:hidden}
body.sidebar-collapsed .primary-nav .nav-item{justify-content:center;padding:9px 5px;gap:0}
body.sidebar-collapsed .primary-nav .nav-item>span:not(.nav-icon){display:none}
body.sidebar-collapsed .nav-icon{width:auto}
body.sidebar-collapsed .nav-item em{position:absolute;margin-left:28px;margin-top:-23px}
body.sidebar-collapsed .sidebar-section,body.sidebar-collapsed .sidebar-bottom{display:none}
body.sidebar-collapsed .sidebar .primary-nav{gap:9px}
/* Home remains a single feed column; the only right rail is inside community pages. */
.circle-main>.page-heading,.circle-main>.stories-strip,.circle-main>.composer-card,.circle-main>.feed-heading,.circle-main>.feed-post,.circle-main>.empty-feed,.circle-main>.community-discovery{width:min(100%,1040px)}
.circle-main{padding-left:clamp(16px,3vw,48px);padding-right:clamp(16px,3vw,48px)}
[data-theme="light"]{color-scheme:light;--bg:#f4f1e9;--panel:#fffdf8;--panel2:#f1ede4;--panel3:#e9e3d7;--line:#d7cdbb;--text:#25231f;--muted:#746d61;--gold:#a77b31;--gold2:#8b6425;--goldGlow:rgba(167,123,49,.10)}
[data-theme="light"] body{background:var(--bg);color:var(--text)}
[data-theme="light"] .topbar,[data-theme="light"] .sidebar{background:var(--bg)}
[data-theme="light"] .panel,[data-theme="light"] .composer-card,[data-theme="light"] .feed-post,[data-theme="light"] .group-right-card{background:var(--panel);color:var(--text)}
[data-theme="light"] input,[data-theme="light"] textarea,[data-theme="light"] select{background:#fff;color:#25231f}
[data-theme="light"] .nav-item,[data-theme="light"] .message,[data-theme="light"] .post-body{color:var(--text)}
@media(max-width:680px){
 .header-actions{gap:5px}.icon-control{width:34px;height:34px}.userline{margin-left:4px}
 body.sidebar-collapsed .layout{display:flex;flex-direction:column}
 body.sidebar-collapsed .sidebar{width:100%;padding:8px;overflow:visible}
 body.sidebar-collapsed .primary-nav .nav-item>span:not(.nav-icon){display:none}
 body.sidebar-collapsed .primary-nav{grid-template-columns:repeat(4,minmax(0,1fr))}
 body.sidebar-collapsed .sidebar-section,body.sidebar-collapsed .sidebar-bottom{display:none}
}
@media(prefers-reduced-motion:reduce){.nav-item.active,.channel-link.active,.group-subnav a.active,.voice-channel-preview.active{animation:none}}

.brand-tagline{display:block;margin-left:1px;font-size:10px;line-height:1.1;letter-spacing:.02em;color:var(--muted);font-weight:500;white-space:nowrap}
@media(max-width:680px){.brand-tagline{display:none}}

@media(max-width:680px){.user-name{display:none}.userline{gap:4px}.userline .presence-select-label{display:none}.userline button{padding:5px 7px;font-size:11px}.topbar{gap:8px}}
/* Idle controls keep a quiet gold contour; selected controls animate the same contour. */
button,.icon-control,.nav-item,.channel-link,.group-subnav a,.voice-channel-preview{border-color:rgba(198,161,91,.42)}
button,.icon-control,.nav-item,.channel-link,.group-subnav a,.voice-channel-preview{box-shadow:0 0 5px rgba(198,161,91,.045)}

/* Circle 4.2.0 — quiet social interactions */
.social-interactions{border-top:1px solid var(--line);margin-top:12px;padding-top:10px;color:var(--muted)}
.social-interaction-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.social-interaction-row form{margin:0}
.reaction-button,.social-comment-form button{background:transparent;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:7px 12px;cursor:pointer}
.reaction-button.is-active{border-color:var(--gold);box-shadow:0 0 8px rgba(198,161,91,.16);color:var(--gold)}
.comment-count{font-size:12px}.social-comment-list{padding:5px 0 0}.social-comment-list p{font-size:13px;margin:7px 0;color:var(--text)}
.social-comment-list strong{color:var(--gold);margin-right:5px}.social-comment-form{display:flex;gap:8px;margin-top:8px}.social-comment-form input{flex:1;min-width:0;background:transparent;border:1px solid var(--line);border-radius:999px;padding:9px 13px;color:var(--text)}
.social-comment-form button{white-space:nowrap}.social-comment-form button:hover,.reaction-button:hover{border-color:var(--gold)}

/* Circle 4.2.0 visual direction: Minimal Gold + restrained glass + editorial media. */
.story-view-trigger{appearance:none;border:0;background:transparent;padding:0;color:inherit;box-shadow:none;}
.story-view-trigger:hover{background:transparent;transform:translateY(-2px);}
.story-viewer[hidden]{display:none!important}
.story-viewer{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;gap:clamp(10px,4vw,54px);padding:24px;background:rgba(7,8,10,.94);backdrop-filter:blur(18px);}
.story-viewer-card{position:relative;width:min(440px,calc(100vw - 100px));height:min( min(82dvh,760px), calc(100dvh - 48px));min-height:360px;overflow:hidden;border:1px solid rgba(226,193,124,.5);border-radius:22px;background:linear-gradient(155deg,rgba(34,35,39,.94),rgba(15,16,18,.96));box-shadow:0 24px 90px rgba(0,0,0,.55),0 0 32px rgba(198,161,91,.12);display:flex;flex-direction:column;}
.story-viewer-progress{height:3px;background:rgba(255,255,255,.15);margin:12px 14px 7px;border-radius:5px;overflow:hidden;flex:0 0 auto}.story-viewer-progress span{display:block;height:100%;width:0;background:var(--gold2)}
.story-viewer-author{padding:5px 16px 10px;color:var(--gold2);font-weight:700;flex:0 0 auto}
.story-viewer-media{flex:1;min-height:0;display:grid;place-items:center;background:#08090b;overflow:hidden}.story-viewer-media img,.story-viewer-media video{width:100%;height:100%;object-fit:contain}.story-viewer-card>p{padding:10px 16px;margin:0;max-height:90px;overflow:auto;color:#e9e4d9;flex:0 0 auto}
.story-viewer-close,.story-viewer-nav{border:1px solid rgba(226,193,124,.42);background:rgba(28,29,33,.68);backdrop-filter:blur(14px);color:var(--gold2);box-shadow:0 8px 30px rgba(0,0,0,.3)}.story-viewer-close{position:absolute;right:22px;top:18px;z-index:2;font-size:28px;line-height:1;padding:7px 13px}.story-viewer-nav{font-size:32px;width:48px;height:58px;padding:0}.story-viewer-open{overflow:hidden}
.invite-create-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.invite-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-top:1px solid var(--line)}.invite-row>div{display:grid;gap:3px}.invite-row form{margin:0}.invite-row .small-button{margin:0}
/* Glass is intentionally limited to communication surfaces. */
.messenger-list,.conversation-tools,.call-controls,.voice-moderation,.call-panel{background:rgba(32,35,41,.62);border:1px solid rgba(226,193,124,.18);backdrop-filter:blur(16px);box-shadow:inset 0 1px rgba(255,255,255,.025)}
.message{background:rgba(35,37,42,.58);border:1px solid rgba(226,193,124,.10);backdrop-filter:blur(10px)}
/* Editorial treatment for photo and video stories and feed posts. */
.feed-post{overflow:hidden;border:1px solid rgba(226,193,124,.38);background:linear-gradient(160deg,#1b1c20 0%,#151619 75%);box-shadow:0 14px 38px rgba(0,0,0,.18)}
.feed-post h3{font-family:Georgia,'Times New Roman',serif;font-weight:600;letter-spacing:-.015em;font-size:clamp(19px,2vw,24px)}
.post-media{margin:12px -2px 16px;overflow:hidden;border-radius:12px;background:#0c0d0f}.post-media img,.post-media video{display:block;width:100%;max-height:620px;object-fit:cover}.post-media img{cursor:zoom-in}
@media(max-width:640px){.story-viewer{padding:0;gap:0}.story-viewer-card{width:100vw;height:100dvh;max-height:none;min-height:0;border-radius:0;border:0}.story-viewer-close{right:12px;top:12px}.story-viewer-nav{position:absolute;bottom:18px;z-index:2;width:42px;height:46px}.story-viewer-nav.prev{left:12px}.story-viewer-nav.next{right:12px}.invite-create-grid{grid-template-columns:1fr}}
.notification-filters{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 18px}.notification-filters a{border:1px solid rgba(226,193,124,.28);border-radius:999px;padding:7px 13px;color:var(--muted);font-size:12px}.notification-filters a.active{border-color:var(--gold2);color:var(--gold2);box-shadow:0 0 14px rgba(198,161,91,.12)}.notification-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 15px;margin:8px 0;border:1px solid var(--line);border-radius:12px;background:rgba(28,30,34,.55)}.notification-row.unread{border-color:rgba(226,193,124,.5);box-shadow:inset 3px 0 var(--gold)}.notification-row>div{display:grid;gap:3px}.notification-row span,.notification-row time{font-size:12px;color:var(--muted)}.notification-row>a{white-space:nowrap;font-size:12px}.single-post{width:min(100%,900px);margin:12px auto}
@media(max-width:600px){.notification-row{align-items:flex-start;flex-direction:column}.notification-filters{gap:5px}.notification-filters a{padding:6px 10px}}

/* 4.2.2 — LiveKit participant presence and active-speaker states */
.call-participants{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0;padding:10px;border:1px solid rgba(226,193,124,.16);border-radius:13px;background:rgba(24,26,31,.46);backdrop-filter:blur(14px)}
.call-participant{display:flex;align-items:center;gap:9px;min-width:180px;max-width:100%;padding:8px 11px;border:1px solid rgba(226,193,124,.16);border-radius:11px;background:rgba(255,255,255,.018);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.call-participant-avatar{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:rgba(198,161,91,.12);color:var(--gold2);font-weight:700}
.call-participant-info{display:grid;min-width:0;gap:2px}.call-participant-info strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.call-participant-info small{font-size:10px;color:var(--muted)}
.call-speaking-indicator{width:8px;height:8px;margin-left:auto;border-radius:50%;background:rgba(255,255,255,.2);flex:0 0 auto}
.call-participant.is-speaking{border-color:rgba(226,193,124,.72);background:rgba(198,161,91,.075);box-shadow:0 0 0 1px rgba(198,161,91,.12),0 0 14px rgba(198,161,91,.12)}
.call-participant.is-speaking .call-speaking-indicator{background:var(--gold2);box-shadow:0 0 10px rgba(226,193,124,.7);animation:circleSpeakerPulse 1.1s ease-in-out infinite alternate}
@keyframes circleSpeakerPulse{from{transform:scale(.82);opacity:.65}to{transform:scale(1.18);opacity:1}}
@media(prefers-reduced-motion:reduce){.call-participant.is-speaking .call-speaking-indicator{animation:none}}
@media(max-width:640px){.call-participant{flex:1 1 100%;min-width:0}.call-participants{padding:8px}}

/* 4.2.3 call device and per-participant audio controls */
.call-device-controls{display:flex;flex-wrap:wrap;gap:9px;margin:9px 0;padding:10px 12px;border:1px solid rgba(226,193,124,.18);border-radius:12px;background:rgba(32,35,41,.48);backdrop-filter:blur(14px)}.call-device-controls label{display:grid;gap:4px;min-width:min(220px,100%);flex:1;font-size:11px;color:var(--muted)}.call-device-controls select{width:100%;min-width:0;padding:8px 10px;border:1px solid rgba(226,193,124,.25);border-radius:8px;background:#191b20;color:var(--text)}.call-volume-control{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--muted);min-width:85px}.call-volume-control input{width:76px;accent-color:var(--gold)}.call-connection-quality{padding:2px 3px 8px}

/* Circle 4.2.4: restrained personal and community accent customization */
.profile-cover,.group-cover{background-repeat:no-repeat;background-size:cover;background-position:center}.profile-cover-orbit{border-color:color-mix(in srgb,var(--profile-accent,#C6A15B) 55%,transparent)}.group-cover span{color:var(--group-accent,#C6A15B)}.profile-hero .profile-stats strong{color:var(--profile-accent,#C6A15B)}

/* Circle 4.6.24: legacy profile-specific publication variants removed. All posts use .feed-post. */

/* Circle 4.2.6 — Discord-inspired community avatar rail. */
.layout{grid-template-columns:76px 248px minmax(0,1fr)}
.community-rail{min-width:0;display:flex;flex-direction:column;align-items:center;gap:10px;padding:14px 9px;overflow-y:auto;overflow-x:hidden;background:linear-gradient(180deg,#111216,#151619 55%,#111216);border-right:1px solid rgba(198,161,91,.18);scrollbar-width:thin}
.rail-home,.community-rail-item,.community-rail-add{width:50px;height:50px;flex:0 0 50px;display:grid;place-items:center;position:relative;border-radius:17px;border:1px solid rgba(198,161,91,.23);background:linear-gradient(145deg,#202228,#17191e);color:var(--gold2);overflow:hidden;transition:border-radius .18s,border-color .18s,box-shadow .18s,transform .18s}
.rail-home{border-radius:16px;background:rgba(198,161,91,.09)}
.rail-home img{width:34px;height:34px;object-fit:contain}
.rail-divider{width:34px;height:1px;flex:0 0 1px;margin:1px 0 3px;background:linear-gradient(90deg,transparent,rgba(198,161,91,.62),transparent)}
.community-rail-item{font-size:19px;font-weight:800;color:#ead4a6}
.community-rail-item img{width:100%;height:100%;object-fit:cover}
.community-rail-item .community-rail-avatar>span{width:100%;height:100%;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,rgba(226,193,124,.26),transparent 65%),linear-gradient(145deg,#29251e,#17191d)}
.community-rail-item:before{content:"";position:absolute;left:-5px;top:50%;width:3px;height:0;border-radius:0 4px 4px 0;background:var(--gold2);box-shadow:0 0 10px rgba(226,193,124,.65);transform:translateY(-50%);transition:height .18s}
.community-rail-item:hover,.community-rail-item.active,.rail-home:hover,.community-rail-add:hover{border-color:rgba(226,193,124,.9);border-radius:14px;box-shadow:0 0 0 1px rgba(198,161,91,.13),0 0 18px rgba(198,161,91,.14);transform:translateY(-1px)}
.community-rail-item.active:before{height:26px}
.community-rail-add{border-style:dashed;background:rgba(198,161,91,.035);font-size:25px;font-weight:400;color:var(--gold2)}
.community-avatar-preview{width:52px;height:52px;object-fit:cover;border-radius:12px;border:1px solid var(--line);vertical-align:middle}
body.sidebar-collapsed .layout{grid-template-columns:76px 72px minmax(0,1fr)}
body.sidebar-collapsed .community-rail{padding-left:9px;padding-right:9px}
@media(max-width:900px){.layout{grid-template-columns:66px 210px minmax(0,1fr)}body.sidebar-collapsed .layout{grid-template-columns:66px 66px minmax(0,1fr)}}
@media(max-width:680px){
 .layout{display:flex;flex-direction:column;height:calc(100dvh - 62px)}
 .community-rail{order:0;flex:0 0 auto;flex-direction:row;justify-content:flex-start;gap:9px;padding:8px 11px;border-right:0;border-bottom:1px solid var(--line);overflow-x:auto;overflow-y:hidden}
 .rail-home,.community-rail-item,.community-rail-add{width:42px;height:42px;flex-basis:42px;border-radius:13px}
 .rail-home img{width:29px;height:29px}
 .rail-divider{width:1px;height:28px;flex-basis:1px;margin:0 2px;background:linear-gradient(180deg,transparent,rgba(198,161,91,.62),transparent)}
 .community-rail-item.active:before{left:50%;top:auto;bottom:-5px;width:22px;height:3px;transform:translateX(-50%)}
 .sidebar{order:1}
 .chat{order:2;flex:1;min-height:0}
 body.sidebar-collapsed .layout{display:flex;flex-direction:column}
 body.sidebar-collapsed .community-rail{width:100%;padding:8px 11px;overflow-x:auto}
}

/* Circle 4.2.7 — named community list + editorial community header */
.sidebar-community-list{display:grid;gap:10px}
.sidebar-community-list .section-heading{padding-bottom:5px}
.sidebar-community-items{display:grid;gap:5px;max-height:36vh;overflow:auto;padding:1px 2px 3px;scrollbar-width:thin;scrollbar-color:rgba(198,161,91,.35) transparent}
.sidebar-community-item{display:flex;align-items:center;gap:10px;min-width:0;padding:7px 9px;border:1px solid transparent;border-radius:12px;color:var(--text);background:rgba(255,255,255,.012);transition:background .18s,border-color .18s,box-shadow .18s}
.sidebar-community-item:hover,.sidebar-community-item.active{background:linear-gradient(100deg,rgba(198,161,91,.12),rgba(198,161,91,.035));border-color:rgba(198,161,91,.58);box-shadow:inset 0 0 0 1px rgba(198,161,91,.055),0 0 13px rgba(198,161,91,.07)}
.sidebar-community-avatar{position:relative;width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(198,161,91,.45);border-radius:12px;background:linear-gradient(145deg,#29251e,#17191d);color:var(--gold2);font-size:15px;font-weight:800}
.sidebar-community-avatar img{width:100%;height:100%;object-fit:cover}
.sidebar-community-avatar>span{display:grid;place-items:center;width:100%;height:100%;background:radial-gradient(circle at 30% 25%,rgba(226,193,124,.25),transparent 68%),linear-gradient(145deg,#29251e,#17191d)}
.sidebar-community-meta{display:flex;flex:1;min-width:0;flex-direction:column;gap:2px}
.sidebar-community-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700}
.sidebar-community-meta small{font-size:10px;color:var(--muted)}
.sidebar-community-item>i{width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:transparent}
.sidebar-community-item.active>i{background:var(--gold2);box-shadow:0 0 9px rgba(226,193,124,.65)}
.sidebar-create-community{display:grid;gap:7px;margin:3px 0 0;padding:9px;border:1px dashed rgba(198,161,91,.22);border-radius:12px;background:rgba(198,161,91,.025)}
.sidebar-create-community input{min-width:0;padding:8px 10px;font-size:11px}
.sidebar-create-community button{width:100%;padding:8px 10px;font-size:11px}

.group-hero{overflow:hidden;border-color:color-mix(in srgb,var(--group-accent,#C6A15B) 52%,transparent);box-shadow:0 8px 28px rgba(0,0,0,.15),0 0 22px color-mix(in srgb,var(--group-accent,#C6A15B) 9%,transparent)}
.group-cover{height:174px;position:relative;isolation:isolate;align-items:flex-end;padding:16px 20px;background-color:#191b20;background-image:radial-gradient(ellipse at 76% 18%,color-mix(in srgb,var(--group-accent,#C6A15B) 26%,transparent),transparent 38%),linear-gradient(120deg,#17191e,#28231b 58%,#111317);background-size:cover;background-position:center}
.group-cover:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(8,9,12,.50),rgba(8,9,12,.10) 60%,rgba(8,9,12,.24)),linear-gradient(0deg,rgba(8,9,12,.54),transparent 58%)}
.group-cover span{font-size:9px;letter-spacing:.24em;color:var(--group-accent,var(--gold2));text-shadow:0 1px 8px #000}
.group-cover-glow{position:absolute;right:15%;top:-110px;width:250px;height:250px;border:1px solid color-mix(in srgb,var(--group-accent,#C6A15B) 38%,transparent);border-radius:50%;box-shadow:0 0 44px color-mix(in srgb,var(--group-accent,#C6A15B) 13%,transparent);pointer-events:none}
.group-title-row{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:15px;padding:0 18px 18px;margin-top:-42px}
.group-identity{display:flex;align-items:flex-end;gap:14px;min-width:0;flex:1}
.group-avatar-large{width:84px;height:84px;flex:0 0 84px;display:grid;place-items:center;overflow:hidden;border:3px solid #191b20;border-radius:21px;background:linear-gradient(145deg,#2c281f,#15171b);box-shadow:0 0 0 1px var(--group-accent,var(--gold)),0 8px 22px rgba(0,0,0,.34);color:var(--group-accent,var(--gold2));font-size:31px;font-weight:800}
.group-avatar-large img{width:100%;height:100%;object-fit:cover}
.group-heading-info{min-width:0;padding:0 0 3px}
.group-heading-info .eyebrow{margin:0 0 3px;font-size:9px;letter-spacing:.18em}
.group-title-row h1{font-size:23px;line-height:1.2;margin:0 0 5px;overflow-wrap:anywhere}
.group-description{max-width:720px;margin:0 0 8px;color:var(--muted);font-size:11px;line-height:1.5}
.group-stats{display:flex;align-items:center;flex-wrap:wrap;gap:7px 13px;color:var(--muted);font-size:10px}
.group-stats>span{display:inline-flex;align-items:center;gap:5px}
.group-stats strong{color:var(--text);font-weight:750}
.group-stats i{width:6px;height:6px;border-radius:50%;background:#65c783;box-shadow:0 0 8px rgba(101,199,131,.55)}
.group-hero-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;padding-bottom:3px}
.group-member-badge{display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border:1px solid color-mix(in srgb,var(--group-accent,#C6A15B) 68%,transparent);border-radius:10px;background:color-mix(in srgb,var(--group-accent,#C6A15B) 8%,transparent);color:var(--group-accent,var(--gold2));font-size:10px;font-weight:700;white-space:nowrap}
.group-hero-actions .subtle-link{font-size:10px;padding:8px 10px}
.group-about-card>p{margin:0 0 14px;color:var(--muted);font-size:12px;line-height:1.65;overflow-wrap:anywhere}
.group-about-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 13px}
.group-about-stats>div{display:flex;flex-direction:column;gap:1px;padding:9px 10px;border:1px solid rgba(198,161,91,.15);border-radius:10px;background:rgba(198,161,91,.035)}
.group-about-stats strong{font-size:17px;color:var(--gold2);line-height:1.25}
.group-about-stats small{font-size:10px;color:var(--muted)}
.group-about-link{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:10px;border-top:1px solid rgba(255,255,255,.07);font-size:11px;color:var(--gold2)}
.group-about-link span{font-size:16px}
[data-theme="light"] .sidebar-community-item{background:rgba(0,0,0,.018)}
[data-theme="light"] .group-about-stats>div{background:rgba(167,123,49,.04)}
@media(max-width:900px){.sidebar-community-items{max-height:30vh}.group-title-row{gap:10px}.group-hero-actions{max-width:190px}}
@media(max-width:680px){.sidebar-community-list{display:none}.group-cover{height:125px}.group-title-row{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:0 12px 13px;margin-top:-34px}.group-identity{align-items:flex-end;gap:10px}.group-avatar-large{width:66px;height:66px;flex-basis:66px;border-radius:17px}.group-heading-info .eyebrow{font-size:8px}.group-title-row h1{font-size:19px}.group-description{font-size:10px;margin-bottom:6px}.group-stats{gap:5px 9px;font-size:9px}.group-hero-actions{max-width:none;justify-content:flex-start;padding-left:76px;padding-bottom:0}.group-member-badge,.group-hero-actions .subtle-link{font-size:9px;padding:7px 9px}.group-cover-glow{right:3%;width:180px;height:180px}}


/* Circle 4.2.8 — community activity and mobile-first navigation */
.mobile-bottom-nav{display:none}
.community-rail-unread{position:absolute;right:-3px;top:-4px;z-index:2;min-width:17px;height:17px;padding:0 4px;display:grid;place-items:center;border:2px solid #151619;border-radius:20px;background:#b94d52;color:#fff;font:700 9px/1 system-ui;font-style:normal;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.community-unread-badge{min-width:19px;height:19px;padding:0 5px;display:inline-grid;place-items:center;border-radius:20px;background:#a8464c;color:#fff;font-size:9px;line-height:1;font-weight:800}
.notification-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 15px;margin:8px 0;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.018)}
.notification-row.unread{border-color:rgba(198,161,91,.35);background:linear-gradient(100deg,rgba(198,161,91,.075),rgba(255,255,255,.012))}
.notification-copy{display:grid;gap:2px;min-width:0}.notification-copy strong{font-size:13px}.notification-copy span{font-size:12px;color:var(--muted)}.notification-copy time{font-size:10px;color:var(--muted)}
.notification-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;flex:0 0 auto}.notification-actions form{margin:0}.notification-open,.notification-mark-read{font-size:11px;padding:7px 10px;border:1px solid rgba(198,161,91,.35);border-radius:9px;background:rgba(198,161,91,.045);color:var(--gold2);white-space:nowrap}.notification-mark-read{cursor:pointer}.notification-open:hover,.notification-mark-read:hover{border-color:var(--gold2);background:rgba(198,161,91,.12);color:#fff}
.notification-empty{padding:18px;border:1px dashed var(--line);border-radius:12px;text-align:center}
@media(max-width:680px){
 .sidebar{display:none!important}
 .layout{height:calc(100dvh - 62px - 60px - env(safe-area-inset-bottom));}
 .chat{padding-bottom:24px}
 .circle-main{padding-bottom:30px}
 .mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:45;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;min-height:60px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));border-top:1px solid rgba(198,161,91,.28);background:rgba(17,18,21,.96);backdrop-filter:blur(18px);box-shadow:0 -10px 30px rgba(0,0,0,.24)}
 .mobile-bottom-nav a{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;min-width:0;border:1px solid transparent;border-radius:11px;color:var(--muted);padding:3px 2px}
 .mobile-bottom-nav a>span{position:relative;font-size:19px;line-height:1.2;color:var(--gold2)}.mobile-bottom-nav small{font-size:9px;line-height:1.2;white-space:nowrap}
 .mobile-bottom-nav a.active{border-color:rgba(198,161,91,.48);background:linear-gradient(135deg,rgba(198,161,91,.17),rgba(198,161,91,.035));color:var(--text);box-shadow:0 0 13px rgba(198,161,91,.09)}
 .mobile-bottom-nav a>span>i{position:absolute;top:-8px;right:-13px;min-width:15px;padding:1px 4px;border-radius:20px;background:#b94d52;color:#fff;font-size:8px;font-style:normal;text-align:center}
 .notification-row{align-items:flex-start;flex-direction:column}.notification-actions{width:100%;justify-content:flex-start}
 .notification-filters{display:flex;overflow-x:auto;white-space:nowrap;padding-bottom:5px;scrollbar-width:thin}
}
[data-theme="light"] .mobile-bottom-nav{background:rgba(246,245,241,.97);border-top-color:rgba(167,123,49,.28)}
[data-theme="light"] .community-rail-unread{border-color:#f4f1e9}
@media(prefers-reduced-motion:reduce){.mobile-bottom-nav a,.notification-open,.notification-mark-read{transition:none!important}}
@media(min-width:681px){.community-rail-unread{right:0;top:0}}
@media(max-width:680px){.community-rail-unread{right:0;top:0}}


/* Circle 4.3.0 — compact centered workspaces, consistent people surfaces and responsive messaging. */
.circle-main{align-items:center;min-width:0;overflow-x:hidden}
.circle-main>*{width:min(100%,1180px);max-width:1180px;min-width:0;box-sizing:border-box;margin-left:auto;margin-right:auto}
.circle-main>.group-hero,.circle-main>.group-layout{width:min(100%,1320px);max-width:1320px}
.circle-main>.messenger-heading,.circle-main>.friends-heading,.circle-main>.notifications-heading{margin-bottom:14px!important}
.friends-workspace,.notifications-workspace{display:grid;grid-template-columns:minmax(340px,390px) minmax(0,1fr);gap:18px;align-items:start;width:100%;min-width:0}
.friends-tools-column,.friends-content-column,.notifications-sidebar,.notifications-content{min-width:0}
.friends-tools-column,.notifications-sidebar{display:grid;gap:12px;align-content:start}
.friends-tools-column .panel{margin:0;padding:15px}
.friends-search-panel form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.friends-search-panel form input{min-width:0;margin:0}
.friends-search-submit{padding:9px 13px;white-space:nowrap}
.friend-section-label{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin:14px 0 7px}
.friend-mini-row,.friend-request-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid rgba(255,255,255,.055);min-width:0}
.friend-mini-copy{display:grid;gap:2px;min-width:0;flex:1}.friend-mini-copy a{display:grid;min-width:0;color:var(--text)}.friend-mini-copy strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friend-mini-copy small{font-size:10px;color:var(--muted)}
.friend-avatar{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(198,161,91,.6);border-radius:50%;background:radial-gradient(circle at 30% 20%,#4a4030,#1b1d22 70%);color:var(--gold2);font-size:17px;font-weight:800}
.friend-avatar img,.message-avatar img,.notification-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.friend-avatar-sm{width:34px;height:34px;flex-basis:34px;font-size:13px}.friend-avatar-xs{width:28px;height:28px;flex-basis:28px;font-size:11px}
.friend-request-actions,.friend-card-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}.friend-request-actions form,.friend-card-actions form{margin:0}
.friend-icon-action{display:grid;place-items:center;width:34px;height:34px;min-width:34px;padding:0;border-radius:10px;font-size:15px;line-height:1;background:rgba(198,161,91,.055)}
.friend-icon-action.is-accept{border-color:rgba(66,197,138,.4);color:#78dca9}.friend-icon-action.is-decline{border-color:rgba(225,91,100,.38);color:#f08b91}
.friends-list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:3px 2px 12px;border-bottom:1px solid var(--line);margin-bottom:12px}.friends-list-toolbar h2{font-size:17px;margin:0}.friends-list-toolbar p{margin:3px 0 0}
.friends-grid{display:grid;grid-template-columns:1fr;gap:10px;max-width:760px}
.friend-card{display:flex;align-items:center;gap:11px;min-width:0;padding:13px;border:1px solid rgba(198,161,91,.2);border-radius:15px;background:linear-gradient(145deg,rgba(30,32,37,.94),rgba(21,23,27,.94));box-shadow:0 7px 22px rgba(0,0,0,.12)}
.friend-card-main{display:grid;gap:2px;flex:1;min-width:0}.friend-card-name{font-size:13px;font-weight:750;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friend-card-handle{font-size:10px;color:var(--muted)}.friend-presence{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friend-presence i{width:6px;height:6px;border-radius:50%;background:#7c828b;flex:0 0 auto}.friend-presence.is-online i{background:var(--green);box-shadow:0 0 8px rgba(66,197,138,.5)}
.friend-card-actions .compact-action-menu summary{width:32px;height:32px}
.friends-content-column{min-width:0;max-width:780px}
.friend-request-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px}
.friend-request-row>.friend-avatar{grid-column:1;grid-row:1;width:34px;height:34px;min-width:34px;flex-basis:34px}
.friend-request-row>.friend-mini-copy{grid-column:2;grid-row:1;min-width:0}
.friend-request-row>.friend-mini-copy strong{display:block;white-space:normal;overflow-wrap:anywhere;line-height:1.25}
.friend-request-row>.friend-mini-copy small{display:block;white-space:normal;line-height:1.35}
.friend-request-row>.friend-request-actions{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:6px;flex-wrap:nowrap}
.friend-request-row>.friend-request-actions .friend-icon-action{width:38px;height:38px;min-width:38px}
@media(max-width:980px){.friends-workspace{grid-template-columns:minmax(300px,360px) minmax(0,1fr)}.friends-grid{max-width:none}}
@media(max-width:560px){.friend-request-row{grid-template-columns:34px minmax(0,1fr);align-items:start}.friend-request-row>.friend-request-actions{grid-column:1 / span 2;grid-row:2;justify-self:start;padding-left:44px}}

.messenger-workspace{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:14px;align-items:stretch;width:100%;min-width:0;height:min(72vh,780px);min-height:510px}
.dm-sidebar,.dm-conversation-area{min-width:0;min-height:0;border:1px solid rgba(198,161,91,.22);border-radius:17px;background:linear-gradient(155deg,rgba(29,31,36,.96),rgba(19,21,25,.97));box-shadow:0 12px 34px rgba(0,0,0,.14);overflow:hidden}
.dm-sidebar{display:flex;flex-direction:column;padding:13px;gap:10px}
.dm-sidebar-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.dm-sidebar-heading h2{font-size:16px;margin:0}.dm-sidebar-heading small,.dm-sidebar-heading .small{font-size:10px}.dm-new-chat{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(198,161,91,.4);border-radius:10px;color:var(--gold2);font-size:21px}
.dm-search{display:flex;align-items:center;gap:8px;margin:0;padding:0 10px;border:1px solid var(--line);border-radius:11px;background:rgba(0,0,0,.12)}.dm-search>span{font-size:19px;color:var(--gold2)}.dm-search input{padding:8px 0;margin:0;border:0;background:transparent;box-shadow:none}
.dm-list-tabs{display:flex;gap:5px;flex-wrap:wrap}.dm-list-tabs a{padding:6px 10px;border:1px solid transparent;border-radius:9px;color:var(--muted);font-size:10px}.dm-list-tabs a.active{border-color:rgba(198,161,91,.38);background:rgba(198,161,91,.07);color:var(--gold2)}
.dm-conversation-list{display:grid;align-content:start;gap:5px;overflow:auto;min-height:0;flex:1;padding-right:2px}
.conversation-row{display:flex;align-items:center;gap:9px;min-width:0;padding:9px;border:1px solid transparent;border-radius:12px;background:rgba(255,255,255,.018)}.conversation-row.active{border-color:rgba(198,161,91,.52);background:rgba(198,161,91,.075);box-shadow:inset 3px 0 var(--gold)}.conversation-row[hidden]{display:none!important}
.conversation-avatar{width:42px;height:42px;flex:0 0 42px;border-radius:50%;overflow:hidden}.conversation-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.conversation-link{display:grid;gap:2px;flex:1;min-width:0;color:var(--text)}.conversation-link strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation-link span{font-size:10px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation-link small{font-size:9px;color:var(--muted)}
.conversation-menu summary{width:28px;height:28px;font-size:12px}
.dm-list-empty{display:grid;justify-items:center;gap:5px;padding:26px 12px;text-align:center;color:var(--muted)}.dm-list-empty>span{font-size:25px;color:var(--gold2)}.dm-list-empty strong{font-size:13px;color:var(--text)}.dm-list-empty small{font-size:10px;line-height:1.5}.dm-list-empty a{font-size:11px}
.group-call-picker{border:1px solid rgba(198,161,91,.25);border-radius:12px;background:rgba(198,161,91,.035);min-width:0}.group-call-picker>summary{display:flex;align-items:center;gap:9px;list-style:none;cursor:pointer;padding:10px}.group-call-picker>summary::-webkit-details-marker{display:none}.group-call-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(198,161,91,.10);color:var(--gold2)}.group-call-picker>summary>span:nth-child(2){display:grid;gap:1px;flex:1;min-width:0}.group-call-picker>summary strong{font-size:11px}.group-call-picker>summary small{font-size:9px;color:var(--muted)}.group-call-picker>summary>i{font-style:normal;color:var(--gold2)}.group-call-form{padding:0 10px 10px;display:grid;gap:8px}.group-call-title{font-size:10px;color:var(--muted)}.group-call-title input{font-size:11px;padding:8px}.group-call-members{display:grid;gap:4px;max-height:180px;overflow:auto}.group-call-member{display:flex;align-items:center;gap:8px;padding:6px 7px;border-radius:9px;background:rgba(255,255,255,.025);cursor:pointer}.group-call-member>span:nth-child(2){display:grid;gap:0;flex:1;min-width:0}.group-call-member strong{font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-call-member small{font-size:9px;color:var(--muted)}.group-call-member input{margin:0;flex:0 0 auto}.group-call-form>button{font-size:10px;padding:9px}.group-call-form>p{margin:0;font-size:9px;line-height:1.4}
.dm-active-meetings{display:grid;gap:5px;max-height:130px;overflow:auto}.dm-active-meetings h3{font-size:10px;color:var(--muted);margin:2px 0}.dm-active-meetings>a{display:flex;align-items:center;gap:8px;padding:7px;border:1px solid var(--line);border-radius:9px;color:var(--text)}.dm-active-meetings>a>span:nth-child(2){display:grid;flex:1;min-width:0}.dm-active-meetings strong{font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dm-active-meetings small{font-size:9px;color:var(--muted)}
.dm-conversation-area{display:flex;flex-direction:column;position:relative}
.dm-welcome{display:grid;place-content:center;justify-items:center;gap:9px;flex:1;min-height:0;padding:30px;text-align:center}.dm-welcome-icon{display:grid;place-items:center;width:64px;height:64px;border:1px solid rgba(198,161,91,.45);border-radius:20px;background:rgba(198,161,91,.06);color:var(--gold2);font-size:29px}.dm-welcome h2{font-size:18px;margin:0}.dm-welcome p{max-width:340px;margin:0;color:var(--muted);font-size:12px}
.dm-chat-header{display:flex;align-items:center;gap:11px;min-height:70px;padding:12px 15px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.018)}.dm-peer-info{display:grid;gap:2px;flex:1;min-width:0}.dm-peer-info strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dm-peer-info small{font-size:10px;color:var(--muted)}.dm-chat-header-actions{display:flex;align-items:center;gap:8px;min-width:0}.dm-private-call{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.dm-private-call #callButton{padding:8px 11px;font-size:10px;white-space:nowrap}.dm-private-call button:not(#callButton){padding:7px 9px;font-size:9px;min-height:32px}
.dm-mobile-back{display:none;font-size:10px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;white-space:nowrap}
.dm-messages{display:flex;flex:1;flex-direction:column;gap:8px;min-height:0;overflow:auto;padding:15px;background:radial-gradient(ellipse at 50% 0,rgba(198,161,91,.035),transparent 55%)}
.message-card{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr) auto;grid-template-areas:'head head more' 'reply reply reply' 'body body body' 'attach attach attach' 'meta meta meta' 'reactions reactions reactions';gap:6px 9px;max-width:100%;padding:10px 11px;border-radius:13px;background:rgba(255,255,255,.025);border:1px solid rgba(198,161,91,.12);backdrop-filter:blur(10px);overflow-wrap:anywhere}
.message-header{grid-area:head;display:flex;align-items:center;gap:8px;min-width:0}.message-avatar{display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;overflow:hidden;border:1px solid rgba(198,161,91,.48);border-radius:50%;background:#29251f;color:var(--gold2);font-size:12px;font-weight:800}.message-author-meta{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;min-width:0}.message-author-meta strong{font-size:11px}.message-author-meta time,.message-edited{font-size:9px;color:var(--muted)}.message-edited{font-style:italic}
.message-body{grid-area:body;font-size:12px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--text)}.message-reply-context{grid-area:reply;margin:0;padding:7px 9px;border-left:2px solid var(--gold);border-radius:0 8px 8px 0;background:rgba(198,161,91,.055);font-size:10px}.message-image-link,.message-card>.voice-audio,.message-card>.message-video-preview,.message-card>a:not(.message-image-link){grid-area:attach;max-width:min(100%,460px)}.message-image-preview{display:block;max-width:min(100%,360px);max-height:280px;object-fit:contain;border-radius:10px;border:1px solid var(--line)}
.message-more-menu{grid-area:more;align-self:start}.compact-action-menu{position:relative;flex:0 0 auto}.compact-action-menu>summary{list-style:none;display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid rgba(198,161,91,.28);border-radius:9px;background:rgba(198,161,91,.035);color:var(--muted);font-weight:800;cursor:pointer}.compact-action-menu>summary::-webkit-details-marker{display:none}.compact-action-menu[open]>summary{color:var(--gold2);border-color:var(--gold2)}.compact-action-popover{position:absolute;right:0;top:calc(100% + 5px);z-index:30;min-width:160px;display:grid;gap:3px;padding:5px;border:1px solid rgba(198,161,91,.38);border-radius:11px;background:#1b1d22;box-shadow:0 12px 30px rgba(0,0,0,.42)}.compact-action-popover button,.compact-action-popover a{display:block;width:100%;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--text);text-align:left;font-size:10px;text-decoration:none;box-shadow:none}.compact-action-popover button:hover,.compact-action-popover a:hover{background:rgba(198,161,91,.09);color:var(--gold2);transform:none}.compact-action-popover form{margin:0}.message-reactions{grid-area:reactions;display:flex;flex-wrap:wrap;gap:5px}.message-reaction-form{margin:0}.message-reaction-form button{padding:4px 7px;border:1px solid rgba(198,161,91,.17);border-radius:20px;background:rgba(198,161,91,.035);font-size:10px;box-shadow:none}.message-reaction-form button:hover{transform:none;background:rgba(198,161,91,.11)}
.dm-composer{display:flex;align-items:center;gap:8px;margin:0;padding:12px 13px;border-top:1px solid var(--line);background:rgba(255,255,255,.018)}.dm-composer #dmComposer{flex:1;min-width:0;margin:0;padding:10px 13px}.dm-attach-button{display:grid;place-items:center;width:37px;height:37px;flex:0 0 37px;margin:0;border:1px solid var(--line);border-radius:10px;color:var(--gold2);font-size:20px;cursor:pointer}.dm-attach-button input{display:none}.dm-send-button{padding:9px 13px;white-space:nowrap;font-size:11px}.dm-voice-record{width:37px;height:37px;padding:0;flex:0 0 37px;font-size:15px}.dm-send-feedback{min-height:18px;padding:0 14px;color:#e99b91;font-size:10px}
.notifications-workspace{grid-template-columns:minmax(240px,290px) minmax(0,1fr);align-items:start}.notification-tool-panel{padding:14px;border:1px solid rgba(198,161,91,.19);border-radius:15px;background:linear-gradient(145deg,rgba(30,32,37,.94),rgba(20,22,26,.95));min-width:0}.notification-tool-panel h2{font-size:12px;margin:0 0 10px}.notification-side-filters{display:grid;gap:4px}.notification-side-filters a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border:1px solid transparent;border-radius:9px;color:var(--muted);font-size:11px}.notification-side-filters a.active{border-color:rgba(198,161,91,.4);background:rgba(198,161,91,.075);color:var(--gold2)}.notification-side-filters b{font-size:9px;background:#a8434a;color:white;padding:2px 6px;border-radius:20px}.notification-preferences-form{display:grid;gap:8px}.notification-preferences-form .check-row{display:flex;align-items:center;gap:7px;font-size:10px}.notification-preferences-form button{font-size:10px;padding:8px 10px}.notification-bulk-form{margin:0}.notification-bulk-form button{width:100%;padding:9px 10px;font-size:10px}.push-controls{display:grid;gap:6px;margin-top:9px}.push-controls button{font-size:9px;padding:7px 8px}
.notifications-feed-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 10px;padding:3px 2px 12px;border-bottom:1px solid var(--line)}.notifications-feed-heading h2{font-size:17px;margin:0}.notifications-feed-heading p{margin:3px 0 0}.notification-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:start;gap:12px;padding:15px;margin:9px 0;border:1px solid rgba(198,161,91,.15);border-radius:14px;background:linear-gradient(140deg,rgba(31,33,38,.92),rgba(21,23,27,.92));min-width:0}.notification-row.unread{border-color:rgba(198,161,91,.52);background:linear-gradient(110deg,rgba(198,161,91,.085),rgba(255,255,255,.012));box-shadow:inset 3px 0 var(--gold)}.notification-avatar{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(198,161,91,.5);border-radius:50%;background:#26231e;color:var(--gold2);font-weight:800}.notification-avatar.system-avatar{font-size:19px}.notification-copy{display:grid;gap:4px;min-width:0}.notification-copy strong{font-size:13px}.notification-copy span{font-size:12px;color:var(--text)}.notification-copy small{font-size:10px;color:var(--muted);line-height:1.45}.notification-copy time{font-size:9px;color:var(--muted)}.notification-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}.notification-actions form{margin:0}.notification-open,.notification-mark-read{font-size:10px;padding:7px 9px;border:1px solid rgba(198,161,91,.32);border-radius:8px;background:rgba(198,161,91,.045);color:var(--gold2);white-space:nowrap}
@media(max-width:980px){.friends-grid{grid-template-columns:1fr}.messenger-workspace{grid-template-columns:minmax(240px,285px) minmax(0,1fr)}}
@media(max-width:680px){
 .circle-main{padding:16px 10px calc(82px + env(safe-area-inset-bottom));overflow-x:hidden}
 .circle-main>*{width:100%;max-width:100%}.circle-main>.group-hero,.circle-main>.group-layout{width:100%;max-width:100%}
 .friends-workspace,.notifications-workspace{grid-template-columns:minmax(0,1fr);gap:12px}.friends-tools-column{grid-template-columns:1fr}.friends-grid{grid-template-columns:minmax(0,1fr)}
 .friend-card{padding:10px;gap:9px}.friend-card .friend-avatar{width:42px;height:42px;flex-basis:42px}.friend-card-name{font-size:12px}.friend-card-actions{gap:4px}
 .messenger-workspace{height:calc(100dvh - 62px - 60px - env(safe-area-inset-bottom) - 32px);min-height:430px;grid-template-columns:minmax(0,1fr);gap:0}
 .dm-sidebar,.dm-conversation-area{grid-column:1;grid-row:1;min-height:0;height:100%}.messenger-workspace.has-active-conversation .dm-sidebar{display:none}.messenger-workspace.no-active-conversation .dm-conversation-area{display:none}
 .dm-mobile-back{display:inline-flex;align-items:center}.dm-chat-header{gap:7px;padding:9px}.dm-peer-avatar{width:35px;height:35px;flex-basis:35px}.dm-peer-info strong{font-size:11px}.dm-private-call #callButton{font-size:9px;padding:7px 8px}.dm-private-call button:not(#callButton){display:none}.dm-chat-header-actions>.compact-action-menu summary{width:28px;height:28px}
 .dm-messages{padding:9px;gap:7px}.message-card{padding:8px;gap:5px 7px}.message-body{font-size:11px}.message-avatar{width:29px;height:29px;flex-basis:29px}.message-author-meta strong{font-size:10px}.message-author-meta time{font-size:8px}.dm-composer{gap:5px;padding:8px}.dm-composer #dmComposer{font-size:12px;padding:9px}.dm-attach-button,.dm-voice-record{width:33px;height:33px;flex-basis:33px}.dm-send-button{padding:8px 9px;font-size:9px}
 .notifications-sidebar{grid-template-columns:1fr}.notification-side-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.notification-row{grid-template-columns:36px minmax(0,1fr);gap:9px;padding:11px}.notification-avatar{width:36px;height:36px;flex-basis:36px}.notification-actions{grid-column:2;justify-content:flex-start}.notification-copy strong{font-size:12px}.notification-copy span{font-size:11px}
 .friends-heading,.messenger-heading,.notifications-heading{align-items:flex-start}.dm-sidebar{padding:10px}.group-call-members{max-height:150px}
}
@media(max-width:380px){.dm-mobile-back{font-size:9px;padding:5px 6px}.dm-chat-header{gap:5px}.dm-peer-info{min-width:70px}.dm-private-call #callButton{max-width:105px;overflow:hidden;text-overflow:ellipsis}.dm-send-button{padding:7px}.friend-card-actions .compact-action-menu summary{width:28px;height:28px}}
[data-theme="light"] .dm-sidebar,[data-theme="light"] .dm-conversation-area,[data-theme="light"] .notification-tool-panel,[data-theme="light"] .notification-row,[data-theme="light"] .friend-card{background:var(--panel)}
[data-theme="light"] .compact-action-popover{background:#fffdf8;border-color:var(--line)}

.presence-person{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 0}.presence-avatar{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(198,161,91,.35);border-radius:50%;background:#26231e;color:var(--gold2);font-size:10px;font-weight:800}.presence-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.member-row{display:flex;align-items:center;gap:8px;min-width:0}.member-avatar{width:27px;height:27px;flex:0 0 27px;display:grid;place-items:center;overflow:hidden;border-radius:50%;border:1px solid rgba(198,161,91,.38);background:#26231e;color:var(--gold2);font-size:10px;font-weight:800}.member-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.member-row .online-dot,.member-row .offline-dot{margin-left:0;flex:0 0 6px}


/* Circle 4.4.0 — consistent workspaces, clean feed cards and compact interaction controls. */
.circle-main{width:100%;max-width:1400px;min-width:0;margin-inline:auto;padding-left:clamp(14px,2.2vw,34px);padding-right:clamp(14px,2.2vw,34px);}
.circle-main>*{width:min(100%,1220px);max-width:1220px;min-width:0;margin-left:auto;margin-right:auto;}
.circle-main>.group-hero,.circle-main>.group-layout{width:min(100%,1320px);max-width:1320px;}
.circle-main>.friends-workspace,.circle-main>.messenger-workspace,.circle-main>.notifications-workspace{width:min(100%,1260px);max-width:1260px;}
.circle-main .panel,.circle-main .feed-post,.circle-main .friend-card,.circle-main .notification-row{min-width:0;}

/* Feed: use a predictable media window without cropping the source photo/video. */
.feed-post{display:flex;flex-direction:column;gap:0;width:100%;padding:clamp(14px,1.6vw,22px);border-radius:16px;overflow:visible;}
.post-head{display:flex;align-items:center;gap:11px;min-width:0;}
.post-avatar{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;overflow:hidden;border-radius:50%;border:1px solid rgba(198,161,91,.62);background:#29251f;color:var(--gold2);font-weight:800;}
.post-avatar img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit;}
.post-author{display:grid;gap:2px;min-width:0;}
.post-author strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.post-author span{font-size:10px;color:var(--muted);}
.post-owned{margin-left:auto;align-self:center;padding:5px 9px;border:1px solid rgba(198,161,91,.24);border-radius:20px;color:var(--muted);font-size:10px;white-space:nowrap;}
.post-media{display:grid;place-items:center;width:100%;min-width:0;min-height:180px;max-height:480px;aspect-ratio:16/9;margin:14px 0 15px;overflow:hidden;border:1px solid rgba(198,161,91,.38);border-radius:13px;background:#090a0c;}
.post-media>a{display:grid;place-items:center;width:100%;height:100%;min-width:0;min-height:0;}
.post-media img,.post-media video{display:block;width:100%;height:100%;max-width:100%;max-height:480px;object-fit:contain;background:#090a0c;}
.post-media img{cursor:zoom-in;}
.feed-post h3{margin:3px 0 7px;line-height:1.3;}
.post-body{margin:0 0 12px;line-height:1.65;overflow-wrap:anywhere;}
.post-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding-top:10px;margin:8px 0 0;border-top:1px solid rgba(255,255,255,.065);}
.social-interactions{width:100%;margin-top:12px;padding-top:11px;border-top:1px solid var(--line);}
.social-interaction-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.social-interaction-row form{margin:0;flex:0 0 auto;}
.reaction-button{min-height:36px;padding:7px 12px;font-size:11px;}
.comment-count{font-size:11px;color:var(--muted);}
.social-comment-list{display:grid;gap:6px;margin-top:10px;max-width:100%;}
.social-comment-list p{margin:0;padding:8px 10px;border:1px solid rgba(255,255,255,.055);border-radius:10px;background:rgba(255,255,255,.018);font-size:12px;line-height:1.5;overflow-wrap:anywhere;}
.social-comment-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;margin:11px 0 0;padding:0;}
.social-comment-form input{display:block;width:100%;min-width:0;height:42px;margin:0;padding:9px 13px;border:1px solid var(--line);border-radius:11px;background:rgba(0,0,0,.12);font-size:12px;}
.social-comment-form button{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:88px;min-height:42px;margin:0;padding:8px 13px;border-radius:10px;font-size:11px;white-space:nowrap;}
.post-pin-form{display:flex;justify-content:flex-end;margin:8px 0 0;}
.post-pin-form button{padding:6px 10px;font-size:10px;}

/* Friends: compact action area; the username remains the visual anchor. */
.friends-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.friend-card{min-height:82px;padding:12px 14px;gap:12px;}
.friend-card-main{flex:1 1 auto;}
.friend-card-actions{flex:0 0 auto;gap:6px;}
.friend-card-actions form{display:flex;margin:0;}
.friend-card-actions .friend-icon-action{width:36px;height:36px;min-width:36px;font-size:16px;}
.friend-card-actions .compact-action-menu>summary{width:32px;height:32px;}
.friend-card-name{font-size:13px;line-height:1.35;}

/* Messages: keep the two-pane layout, but prevent controls from pushing or overlapping content. */
.messenger-workspace{grid-template-columns:minmax(270px,320px) minmax(0,1fr);gap:14px;min-width:0;}
.dm-sidebar,.dm-conversation-area{min-width:0;}
.conversation-row{position:relative;}
.conversation-link{padding-right:3px;}
.dm-chat-header{min-width:0;flex-wrap:wrap;}
.dm-peer-info{flex:1 1 120px;}
.dm-chat-header-actions{flex:0 1 auto;justify-content:flex-end;}
.dm-private-call{max-width:100%;}
.dm-private-call button{width:auto;min-width:0;}
.dm-composer{min-width:0;flex-wrap:nowrap;}
.dm-composer #dmComposer{width:auto;flex:1 1 auto;min-width:0;}
.dm-composer .dm-send-button{width:auto;flex:0 0 auto;}
.dm-send-feedback{min-height:18px;overflow-wrap:anywhere;}

/* Notifications: more substantial cards and consistent alignment. */
.notifications-workspace{grid-template-columns:minmax(250px,290px) minmax(0,1fr);gap:18px;width:100%;min-width:0;}
.notifications-sidebar{min-width:0;}
.notification-tool-panel{padding:15px;}
.notifications-content{min-width:0;}
.notification-row{grid-template-columns:46px minmax(0,1fr) auto;gap:13px;min-height:94px;padding:16px 17px;margin:10px 0;}
.notification-avatar{width:46px;height:46px;flex-basis:46px;}
.notification-copy{align-content:center;gap:5px;}
.notification-copy strong{font-size:13px;}
.notification-copy span{font-size:12px;line-height:1.45;}
.notification-copy small{font-size:11px;line-height:1.5;}
.notification-copy time{font-size:10px;margin-top:2px;}
.notification-actions{align-self:center;}
.notification-open,.notification-mark-read{padding:8px 10px;font-size:10px;}

/* Compact action menus must float above cards and never inherit full-width button rules. */
.compact-action-menu{z-index:5;}
.compact-action-menu[open]{z-index:50;}
.compact-action-popover{max-width:min(240px,calc(100vw - 32px));}
.compact-action-popover button,.compact-action-popover a{width:100%;min-height:34px;padding:8px 10px;font-size:11px;}
.message-more-menu>summary{width:30px;height:30px;}
.menu-action-form button{width:100%;min-height:34px;}

/* Every workspace respects viewport width, including narrow phones. */
@media(max-width:980px){
 .friends-grid{grid-template-columns:minmax(0,1fr);}
 .messenger-workspace{grid-template-columns:minmax(245px,285px) minmax(0,1fr);}
}
@media(max-width:680px){
 .circle-main{width:100%;max-width:100%;padding:15px 11px calc(88px + env(safe-area-inset-bottom));overflow-x:hidden;}
 .circle-main>*{width:100%;max-width:100%;}
 .feed-post{padding:12px;border-radius:13px;}
 .post-media{min-height:150px;max-height:320px;margin:11px 0 12px;aspect-ratio:16/9;}
 .post-media img,.post-media video{max-height:320px;}
 .post-owned{font-size:9px;padding:4px 7px;}
 .social-comment-form{grid-template-columns:minmax(0,1fr) auto;gap:6px;}
 .social-comment-form input{height:40px;padding:8px 10px;font-size:11px;}
 .social-comment-form button{min-width:78px;min-height:40px;padding:7px 9px;font-size:10px;}
 .friends-workspace,.notifications-workspace{grid-template-columns:minmax(0,1fr);gap:12px;}
 .friend-card{padding:10px;gap:9px;}
 .friend-card .friend-avatar{width:42px;height:42px;flex-basis:42px;}
 .messenger-workspace{height:calc(100dvh - 62px - 60px - env(safe-area-inset-bottom) - 32px);min-height:430px;grid-template-columns:minmax(0,1fr);gap:0;}
 .dm-sidebar,.dm-conversation-area{grid-column:1;grid-row:1;min-height:0;height:100%;}
 .dm-composer{gap:5px;padding:8px;}
 .dm-composer #dmComposer{width:auto;}
 .notifications-workspace{grid-template-columns:minmax(0,1fr);}
 .notifications-sidebar{grid-template-columns:minmax(0,1fr);}
 .notification-row{grid-template-columns:38px minmax(0,1fr);gap:9px;padding:12px;min-height:0;}
 .notification-avatar{width:38px;height:38px;flex-basis:38px;}
 .notification-actions{grid-column:2;justify-content:flex-start;}
}
@media(max-width:390px){
 .circle-main{padding-left:9px;padding-right:9px;}
 .friend-card{gap:7px;padding:9px;}
 .friend-card .friend-avatar{width:38px;height:38px;flex-basis:38px;}
 .friend-card-name{font-size:12px;}
 .friend-card-actions .friend-icon-action{width:32px;height:32px;min-width:32px;}
 .dm-chat-header{gap:5px;padding:8px;}
 .dm-mobile-back{font-size:9px;padding:5px 6px;}
 .dm-peer-info{min-width:70px;}
 .dm-private-call #callButton{max-width:112px;overflow:hidden;text-overflow:ellipsis;font-size:9px;padding:6px 7px;}
 .dm-attach-button,.dm-voice-record{width:31px;height:31px;flex-basis:31px;}
 .dm-send-button{padding:7px 8px;font-size:9px;}
}


/* Circle 4.4.0 final presentation layer: balanced cards, predictable widths and compact controls. */
*{box-sizing:border-box}
.circle-main{width:100%;max-width:1440px;min-width:0;margin-inline:auto;overflow-x:clip;align-items:center}
.circle-main>*{width:min(100%,1180px);max-width:1180px;min-width:0;margin-inline:auto;box-sizing:border-box}
.circle-main>.group-hero,.circle-main>.group-layout{width:min(100%,1320px);max-width:1320px}
.circle-main>.friends-workspace,.circle-main>.messenger-workspace,.circle-main>.notifications-workspace{width:min(100%,1280px);max-width:1280px}
.circle-main>.page-heading,.circle-main>.messenger-heading,.circle-main>.feed-heading{width:min(100%,1180px);max-width:1180px}
.circle-main .panel,.circle-main .feed-post,.circle-main .friend-card,.circle-main .notification-row{min-width:0;max-width:100%}

/* Friends: identity first, action second. */
.friends-workspace{grid-template-columns:minmax(245px,290px) minmax(0,1fr);gap:18px;align-items:start}
.friends-tools-column .panel,.friends-content-column{border-radius:16px}
.friends-content-column{min-width:0}
.friends-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr));gap:12px}
.friend-card{display:flex;align-items:center;min-height:84px;padding:12px 14px;gap:12px;border-radius:14px}
.friend-card-main{display:grid;gap:3px;flex:1 1 auto;min-width:0}
.friend-card-name{font-size:13px;font-weight:750;line-height:1.35;text-decoration:none}
.friend-card-handle,.friend-presence{font-size:10px}
.friend-card-actions{display:flex;align-items:center;gap:5px;flex:0 0 auto}
.friend-card-actions form{margin:0;display:flex}
.friend-card-actions .friend-icon-action{width:34px;height:34px;min-width:34px;padding:0;border-radius:9px;font-size:15px}
.friend-card-actions .compact-action-menu>summary{width:31px;height:31px;min-width:31px}
.friend-request-row,.friend-mini-row{gap:9px;min-width:0}
.friend-request-actions{display:flex;gap:5px}

/* Messenger: left dialog rail + right conversation. Actions stay in small menus. */
.messenger-heading{width:min(100%,1280px);margin-inline:auto}
.messenger-workspace{width:100%;max-width:1280px;grid-template-columns:minmax(260px,310px) minmax(0,1fr);gap:14px;height:min(76vh,820px);min-height:560px}
.dm-sidebar,.dm-conversation-area{min-width:0;min-height:0;max-width:100%;border-radius:16px}
.dm-conversation-area{display:flex;flex-direction:column}
.dm-chat-header{flex:0 0 auto;min-width:0;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.dm-peer-info{min-width:0;flex:1}
.dm-chat-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
.dm-private-call{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.dm-private-call button{width:auto;min-width:0;min-height:31px;padding:6px 9px;font-size:10px}
.dm-messages{flex:1 1 auto;min-height:0;overflow:auto;padding:16px;gap:10px}
.dm-composer{flex:0 0 auto;display:flex;align-items:center;gap:7px;min-width:0;margin:0;padding:11px;border-top:1px solid var(--line);background:rgba(12,13,15,.45)}
.dm-composer #dmComposer{flex:1 1 auto;width:auto;min-width:0;margin:0}
.dm-composer .dm-send-button{flex:0 0 auto;width:auto;min-width:86px;min-height:40px;padding:8px 12px}
.dm-composer .dm-attach-button,.dm-composer .dm-voice-record{flex:0 0 38px;width:38px;height:38px}
.dm-send-feedback{flex:0 0 auto;min-height:17px;padding:0 12px;color:var(--muted);font-size:10px}
.conversation-row{position:relative;align-items:center;min-width:0}
.conversation-link{flex:1 1 auto;min-width:0;padding:0}
.conversation-menu>summary,.message-more-menu>summary{display:grid;place-items:center;width:30px;height:30px;min-width:30px;padding:0;border-radius:8px;font-size:12px}

/* Notification workspace: tools/filter rail on the left; full event stream on the right. */
.notifications-workspace{display:grid;grid-template-columns:minmax(250px,290px) minmax(0,1fr);gap:18px;align-items:start;width:100%;min-width:0}
.notifications-sidebar{display:grid;gap:12px;align-content:start;min-width:0}
.notification-tool-panel{padding:15px;border-radius:14px}
.notification-tool-panel h2{font-size:12px;margin:0 0 10px}
.notification-side-filters{display:grid;gap:5px}
.notification-side-filters a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:37px;padding:8px 10px;border-radius:9px;font-size:11px}
.notification-preferences-form{display:grid;gap:8px}
.notification-preferences-form .check-row{display:flex;align-items:center;gap:8px;font-size:10px}
.notification-preferences-form button,.push-controls button,.notification-bulk-form button{width:auto;min-height:34px;padding:8px 11px;font-size:10px}
.notification-bulk-form{margin:0}
.notifications-content{min-width:0}
.notifications-feed-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;padding:4px 2px 12px;border-bottom:1px solid var(--line)}
.notifications-feed-heading h2{font-size:17px;margin:0}
.notification-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:13px;min-height:100px;margin:0 0 10px;padding:16px;border:1px solid rgba(198,161,91,.17);border-radius:14px;background:linear-gradient(145deg,rgba(29,31,36,.94),rgba(19,21,25,.96));}
.notification-row.unread{border-color:rgba(198,161,91,.52);background:linear-gradient(110deg,rgba(198,161,91,.09),rgba(255,255,255,.012));box-shadow:inset 3px 0 var(--gold)}
.notification-avatar{width:46px;height:46px;flex:0 0 46px;border-radius:50%;overflow:hidden}
.notification-copy{display:grid;gap:5px;min-width:0}
.notification-copy strong{font-size:13px}
.notification-copy span{font-size:12px;line-height:1.4}
.notification-copy small{font-size:11px;line-height:1.5;color:var(--muted)}
.notification-copy time{font-size:10px;color:var(--muted)}
.notification-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.notification-actions form{margin:0}
.notification-open,.notification-mark-read{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:7px 10px;font-size:10px;white-space:nowrap}

/* Feed post cards: media must not crop, and comments/buttons remain inside the card. */
.feed-post{display:flex;flex-direction:column;gap:0;width:100%;min-width:0;padding:clamp(14px,1.6vw,22px);border-radius:16px;overflow:visible}
.post-head{display:flex;align-items:center;gap:11px;min-width:0}
.post-avatar{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;overflow:hidden;border-radius:50%;border:1px solid rgba(198,161,91,.62);background:#29251f;color:var(--gold2);font-weight:800}
.post-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.post-author{display:grid;gap:2px;min-width:0}
.post-author strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.post-author span{font-size:10px;color:var(--muted)}
.post-owned{margin-left:auto;padding:5px 9px;border:1px solid rgba(198,161,91,.24);border-radius:20px;color:var(--muted);font-size:10px;white-space:nowrap}
.post-media{display:grid;place-items:center;width:100%;min-width:0;height:auto;min-height:0;max-height:440px;aspect-ratio:16/9;margin:14px 0 15px;overflow:hidden;border:1px solid rgba(198,161,91,.38);border-radius:13px;background:#090a0c}
.post-media>a{display:grid;place-items:center;width:100%;height:100%;min-width:0;min-height:0}
.post-media img,.post-media video{display:block;width:100%;height:100%;max-width:100%;max-height:440px;object-fit:contain;background:#090a0c}
.post-body{margin:0 0 12px;line-height:1.65;overflow-wrap:anywhere}
.post-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding-top:10px;margin:8px 0 0;border-top:1px solid rgba(255,255,255,.065)}
.social-interactions{width:100%;min-width:0;margin-top:12px;padding-top:11px;border-top:1px solid var(--line)}
.social-interaction-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.social-interaction-row form{margin:0;flex:0 0 auto}
.reaction-button{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 12px;font-size:11px}
.comment-count{font-size:11px;color:var(--muted)}
.social-comment-list{display:grid;gap:8px;width:100%;margin-top:11px}
.post-comment-row{display:flex;align-items:flex-start;gap:9px;min-width:0;padding:9px 10px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(255,255,255,.018)}
.post-comment-avatar{display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;overflow:hidden;border:1px solid rgba(198,161,91,.35);border-radius:50%;background:#29251f;color:var(--gold2);font-size:11px;font-weight:700}
.post-comment-avatar img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}
.post-comment-copy{display:grid;gap:3px;min-width:0;flex:1}
.post-comment-copy strong{font-size:11px}
.post-comment-copy p{margin:0;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.social-comment-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;margin:12px 0 0;padding:0}
.social-comment-form input{width:100%;min-width:0;height:42px;margin:0;padding:9px 13px;border:1px solid var(--line);border-radius:11px;background:rgba(0,0,0,.12);font-size:12px}
.social-comment-form button{display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:88px;min-height:42px;margin:0;padding:8px 13px;border-radius:10px;font-size:11px;white-space:nowrap}
.comment-feedback{margin-top:6px;color:#e8a0a0}
.post-pin-form{display:flex;justify-content:flex-end;margin:8px 0 0}
.post-pin-form button{width:auto;min-height:30px;padding:6px 10px;font-size:10px}

/* Menus and buttons never stretch across the full content column. */
.compact-action-menu{position:relative;z-index:5;flex:0 0 auto}
.compact-action-menu[open]{z-index:60}
.compact-action-popover{z-index:70;max-width:min(240px,calc(100vw - 32px));box-shadow:0 14px 34px rgba(0,0,0,.42)}
.compact-action-popover button,.compact-action-popover a{display:flex;align-items:center;width:100%;min-height:34px;margin:0;padding:8px 10px;font-size:11px;text-align:left}
.compact-action-popover form{display:block;margin:0}
.menu-action-form{display:block;margin:0}

@media(max-width:980px){
 .friends-workspace{grid-template-columns:minmax(220px,270px) minmax(0,1fr)}
 .friends-grid{grid-template-columns:minmax(0,1fr)}
 .messenger-workspace{grid-template-columns:minmax(245px,285px) minmax(0,1fr)}
 .notifications-workspace{grid-template-columns:minmax(230px,260px) minmax(0,1fr)}
}
@media(max-width:680px){
 .circle-main{width:100%;max-width:100%;padding:15px 11px calc(88px + env(safe-area-inset-bottom));overflow-x:clip}
 .circle-main>*{width:100%;max-width:100%;min-width:0}
 .feed-post{padding:12px;border-radius:13px}
 .post-media{min-height:0;max-height:300px;margin:11px 0 12px;aspect-ratio:16/9}
 .post-media img,.post-media video{max-height:300px}
 .post-owned{font-size:9px;padding:4px 7px}
 .friends-workspace,.notifications-workspace{grid-template-columns:minmax(0,1fr);gap:12px}
 .friends-grid{grid-template-columns:minmax(0,1fr)}
 .friend-card{padding:10px;gap:9px}
 .friend-card .friend-avatar{width:42px;height:42px;flex-basis:42px}
 .messenger-workspace{height:calc(100dvh - 62px - 60px - env(safe-area-inset-bottom) - 32px);min-height:430px;grid-template-columns:minmax(0,1fr);gap:0}
 .dm-sidebar,.dm-conversation-area{grid-column:1;grid-row:1;min-height:0;height:100%}
 .messenger-workspace.has-active-conversation .dm-sidebar{display:none}
 .messenger-workspace.no-active-conversation .dm-conversation-area{display:none}
 .dm-composer{gap:5px;padding:8px}
 .dm-composer #dmComposer{width:auto;min-width:0;font-size:12px;padding:9px}
 .dm-composer .dm-send-button{min-width:66px;padding:7px 8px;font-size:10px}
 .notifications-sidebar{grid-template-columns:minmax(0,1fr)}
 .notification-row{grid-template-columns:38px minmax(0,1fr);gap:9px;min-height:0;padding:12px}
 .notification-avatar{width:38px;height:38px;flex-basis:38px}
 .notification-actions{grid-column:2;justify-content:flex-start}
 .notification-filters{display:flex;overflow-x:auto;white-space:nowrap}
 .social-comment-form{grid-template-columns:minmax(0,1fr) auto;gap:6px}
 .social-comment-form input{height:40px;padding:8px 10px;font-size:11px}
 .social-comment-form button{min-width:76px;min-height:40px;padding:7px 9px;font-size:10px}
}

/* Consistent user identity: topbar, composer and community member directory. */
.topbar-avatar{display:inline-flex;width:30px;height:30px;flex:0 0 30px;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(198,161,91,.62);border-radius:50%;background:#29251f;color:var(--gold2);font-size:11px;font-weight:800}
.topbar-avatar img,.current-user-avatar img,.community-member-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.current-user-avatar{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(198,161,91,.55);border-radius:50%}
.community-member-identity{display:flex;align-items:center;gap:10px;min-width:0}
.community-member-identity>span:last-child{display:grid;gap:2px;min-width:0}
.community-member-avatar{display:inline-flex;width:36px;height:36px;flex:0 0 36px;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(198,161,91,.42);border-radius:50%;background:#29251f;color:var(--gold2);font-size:12px;font-weight:800}


/* Circle 4.4.1 — production hotfixes from acircle.ru QA screenshots. */
/* Accessible labels must not occupy a grid cell in compact forms. */
.sr-only:not(:focus):not(:active){
 position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
 overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}
.friends-search-panel{min-width:0}
.friends-search-panel form{
 display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;min-width:0;margin:0;
}
.friends-search-panel form input[type="hidden"]{display:none}
.friends-search-panel form input[name="q"]{
 grid-column:1;grid-row:1;width:100%;min-width:0;height:42px;margin:0;padding:9px 11px;font-size:12px;
}
.friends-search-panel form .friend-search-submit{
 grid-column:2;grid-row:1;justify-self:start;align-self:stretch;width:auto;min-width:62px;min-height:42px;margin:0;padding:8px 12px;font-size:11px;white-space:nowrap;
}
@media(max-width:380px){
 .friends-tools-column .panel{padding:12px}
 .friends-search-panel form{grid-template-columns:minmax(0,1fr) auto;gap:6px}
 .friends-search-panel form input[name="q"]{font-size:11px;padding-inline:9px}
 .friends-search-panel form .friend-search-submit{min-width:56px;padding-inline:9px}
}

/* Profile identity is now a stable overlap, not a negative-flow margin. */
.profile-hero{position:relative;overflow:visible;border-radius:20px}
.profile-cover{border-radius:19px 19px 0 0}
.profile-identity{
 position:relative;display:grid;grid-template-columns:100px minmax(0,1fr) auto;align-items:center;gap:17px;
 min-height:126px;padding:16px 24px 22px;flex-wrap:initial;
}
.profile-avatar-large{
 position:absolute;left:24px;top:-52px;width:100px;height:100px;margin:0;z-index:3;flex:none;
}
.profile-name{grid-column:2;grid-row:1;min-width:0;padding:0;align-self:center}
.profile-name .eyebrow{margin-bottom:5px}
.profile-name h1{overflow-wrap:anywhere}
.profile-stats{grid-column:3;grid-row:1;display:flex;align-self:center;gap:22px;margin:0;padding:0}
.profile-stats div{min-width:54px}
@media(max-width:680px){
 .profile-hero{overflow:visible}
 .profile-cover{height:125px;border-radius:19px 19px 0 0}
 .profile-identity{
  grid-template-columns:78px minmax(0,1fr);grid-template-rows:auto auto;gap:10px 12px;
  min-height:138px;padding:14px 14px 17px;
 }
 .profile-avatar-large{left:14px;top:-39px;width:78px;height:78px}
 .profile-name{grid-column:2;grid-row:1;min-width:0;padding:0;align-self:center}
 .profile-name h1{font-size:19px}
 .profile-name span{display:block;overflow-wrap:anywhere}
 .profile-stats{grid-column:2;grid-row:2;justify-content:flex-start;gap:18px;margin:0;padding:0}
 .profile-stats strong{font-size:17px}
}
@media(max-width:380px){
 .profile-identity{grid-template-columns:70px minmax(0,1fr);gap:8px 10px;padding-inline:11px}
 .profile-avatar-large{left:11px;width:70px;height:70px;top:-35px}
 .profile-name h1{font-size:17px}
 .profile-stats{gap:14px}
}

/* Circle 4.4.2 — clearer hierarchy, independent unread counters and in-app media. */
.layout{grid-template-columns:86px 236px minmax(0,1fr)!important;}
.layout>.sidebar.circle-sidebar{grid-column:1;grid-row:1;min-width:0;width:auto;padding:18px 9px 14px;gap:14px;border-right:1px solid rgba(198,161,91,.18);border-bottom:0;}
.layout>.community-rail{grid-column:2;grid-row:1;min-width:0;width:auto;display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:15px 12px;background:linear-gradient(180deg,#151619,#131417);border-right:1px solid rgba(198,161,91,.18);overflow:hidden;}
.layout>.circle-main{grid-column:3;grid-row:1;min-width:0;width:100%;}
.primary-nav{display:grid;gap:9px;}
.primary-nav .nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:72px;padding:10px 5px;border:1px solid transparent;border-radius:13px;text-align:center;font-size:11px;font-weight:700;}
.primary-nav .nav-icon{width:auto;font-size:23px;line-height:1.1;}
.primary-nav .nav-item em{position:absolute;margin:0;transform:translate(25px,-19px);}
.primary-nav .nav-item.active{border-color:rgba(198,161,91,.65)!important;background:linear-gradient(145deg,rgba(198,161,91,.12),transparent)!important;box-shadow:inset 3px 0 var(--gold2),0 0 12px rgba(198,161,91,.07)!important;}
.community-rail-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 3px 8px;border-bottom:1px solid rgba(255,255,255,.07);}
.community-rail-heading>strong{font-size:13px;letter-spacing:.01em;}
.community-rail-heading .community-rail-add{position:static;width:32px;height:32px;min-width:32px;flex:0 0 32px;border:1px solid rgba(198,161,91,.45);border-radius:10px;font-size:20px;line-height:1;}
.community-rail-list{display:grid;gap:6px;min-height:0;overflow:auto;padding:1px 2px 3px;scrollbar-width:thin;scrollbar-color:rgba(198,161,91,.32) transparent;}
.community-rail-item{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:10px;min-width:0;min-height:60px;padding:7px 9px;border:1px solid transparent;border-radius:12px;color:var(--text);background:rgba(255,255,255,.012);transition:background .18s,border-color .18s,box-shadow .18s;}
.community-rail-item:before{content:"";position:absolute;left:-1px;top:50%;width:3px;height:0;border-radius:0 4px 4px 0;background:var(--gold2);transform:translateY(-50%);transition:height .18s;}
.community-rail-item:hover,.community-rail-item.active{background:linear-gradient(100deg,rgba(198,161,91,.13),rgba(198,161,91,.035));border-color:rgba(198,161,91,.58);box-shadow:0 0 12px rgba(198,161,91,.07);}
.community-rail-item.active:before{height:30px;}
.community-rail-avatar{display:grid;place-items:center;width:42px;height:42px;overflow:hidden;border:1px solid rgba(198,161,91,.45);border-radius:50%;background:linear-gradient(145deg,#29251e,#17191d);color:var(--gold2);font-size:15px;font-weight:800;}
.community-rail-avatar img{width:100%;height:100%;object-fit:cover;}
.community-rail-avatar>span{display:grid;place-items:center;width:100%;height:100%;background:radial-gradient(circle at 30% 25%,rgba(226,193,124,.25),transparent 68%),linear-gradient(145deg,#29251e,#17191d);}
.community-rail-meta{display:grid;gap:3px;min-width:0;}
.community-rail-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;}
.community-rail-meta small{font-size:10px;color:var(--muted);}
.community-rail-item>.community-rail-unread{position:static;align-self:start;min-width:17px;height:17px;border:0;padding:0 4px;}
.community-rail-create{display:grid;gap:7px;margin:3px 0 0;padding:9px;border:1px dashed rgba(198,161,91,.22);border-radius:12px;background:rgba(198,161,91,.025);}
.community-rail-create input{width:100%;min-width:0;padding:8px 9px;font-size:11px;}
.community-rail-create button{width:100%;min-height:35px;padding:7px 9px;font-size:10px;}
.sidebar-bottom{justify-content:center;flex-direction:column;gap:8px;margin-top:auto;padding:12px 4px 0;font-size:10px;}
.sidebar-bottom span{display:none;}
body.sidebar-collapsed .layout{grid-template-columns:70px 236px minmax(0,1fr)!important;}
body.sidebar-collapsed .layout>.sidebar.circle-sidebar{padding-inline:6px;}
body.sidebar-collapsed .primary-nav .nav-item>span:not(.nav-icon){display:none;}
body.sidebar-collapsed .primary-nav .nav-item{min-height:54px;}
body.sidebar-collapsed .layout>.community-rail{display:flex!important;}

/* Each interaction is a compact control; no enclosing button-group frame. */
.social-interactions{border-top:1px solid var(--line);}
.social-interaction-row{gap:9px;}
.social-interaction-row form{display:flex;align-items:center;}
.reaction-button,.comment-count{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:35px;margin:0;padding:7px 11px;border:1px solid rgba(198,161,91,.3);border-radius:999px;background:rgba(255,255,255,.018);color:var(--text);font-size:11px;line-height:1.2;text-decoration:none;white-space:nowrap;}
.reaction-button:hover,.comment-count:hover{border-color:var(--gold);background:rgba(198,161,91,.06);box-shadow:0 0 8px rgba(198,161,91,.08);}
.reaction-button .interaction-label,.comment-count .interaction-label{font-weight:650;}
.reaction-button .interaction-total,.comment-count .interaction-total{min-width:1ch;color:var(--gold2);font-weight:800;font-variant-numeric:tabular-nums;}
.reaction-button.is-active{border-color:var(--gold);color:var(--gold2);background:rgba(198,161,91,.06);}
.comment-count{color:var(--muted);}
.social-comment-form{scroll-margin-top:90px;}

/* Voice controls have no outer frame. Only individual actions are outlined. */
.call-controls,.dm-private-call,.dm-chat-header-actions .call-controls{border:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;padding:0!important;margin:0!important;}
.call-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.call-controls button,.dm-private-call button{width:auto;min-width:0;min-height:32px;padding:7px 10px;border:1px solid rgba(198,161,91,.38);border-radius:9px;background:transparent;box-shadow:none;font-size:10px;}
.call-controls button:hover,.dm-private-call button:hover{border-color:var(--gold);background:rgba(198,161,91,.06);}

/* Image attachments fit their actual intrinsic dimensions and open in a site lightbox. */
.message-image-open{display:inline-flex!important;align-items:center;justify-content:flex-start;width:fit-content!important;max-width:min(100%,420px);height:auto!important;min-height:0!important;margin:7px 0 0!important;padding:0!important;overflow:hidden;border:0!important;border-radius:11px!important;background:transparent!important;box-shadow:none!important;line-height:0;cursor:zoom-in;}
.message-image-open:hover{border:0!important;box-shadow:0 0 0 1px rgba(198,161,91,.5)!important;}
.message-image-preview{display:block;width:auto;max-width:min(100%,420px);height:auto;max-height:320px;object-fit:contain;border:1px solid rgba(198,161,91,.24);border-radius:10px;background:rgba(0,0,0,.12);}
.message-image-open:not(.is-loaded) .message-image-preview{min-width:92px;min-height:72px;background:linear-gradient(110deg,rgba(198,161,91,.06),rgba(255,255,255,.04),rgba(198,161,91,.06));}
.message-image-open.is-error{padding:10px!important;color:#e3a19a;line-height:1.4;}
.circle-media-viewer[hidden]{display:none!important;}
.circle-media-viewer{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:28px;background:rgba(5,6,8,.92);backdrop-filter:blur(14px);}
.circle-media-viewer-image{display:block;max-width:min(94vw,1500px);max-height:90dvh;width:auto;height:auto;object-fit:contain;border:1px solid rgba(198,161,91,.35);border-radius:12px;box-shadow:0 24px 90px rgba(0,0,0,.55);}
.circle-media-viewer-close{position:fixed;top:18px;right:20px;z-index:1;width:42px;height:42px;display:grid;place-items:center;padding:0;border:1px solid rgba(198,161,91,.58);border-radius:50%;background:#17191d;color:var(--gold2);font-size:27px;line-height:1;}
body.media-viewer-open{overflow:hidden;}
.dm-upload-progress{display:grid;gap:6px;padding:7px 13px 10px;border-top:1px solid rgba(255,255,255,.055);background:rgba(12,13,15,.28);}
.dm-upload-progress[hidden]{display:none!important;}
.dm-upload-progress-head{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:var(--muted);}
.dm-upload-progress-head strong{color:var(--text);font-weight:650;}
.dm-upload-progress progress{display:block;width:100%;height:7px;overflow:hidden;border:0;border-radius:99px;background:rgba(255,255,255,.09);accent-color:var(--gold2);}
.dm-upload-progress progress::-webkit-progress-bar{border-radius:99px;background:rgba(255,255,255,.09);}
.dm-upload-progress progress::-webkit-progress-value{border-radius:99px;background:linear-gradient(90deg,#9c7437,#e2c17c);transition:width .12s linear;}
.dm-upload-progress progress::-moz-progress-bar{border-radius:99px;background:linear-gradient(90deg,#9c7437,#e2c17c);}
.notification-control svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.notification-control{font-size:0;}

@media(max-width:1100px){
 .layout{grid-template-columns:78px 210px minmax(0,1fr)!important;}
 .layout>.sidebar.circle-sidebar{padding-inline:7px;}
 .primary-nav .nav-item{min-height:64px;font-size:10px;}
 .community-rail-item{grid-template-columns:38px minmax(0,1fr) auto;gap:8px;padding:7px;}
 .community-rail-avatar{width:38px;height:38px;}
 .community-rail-meta strong{font-size:11px;}
 .community-rail-meta small{font-size:9px;}
}
@media(max-width:680px){
 .layout{display:flex!important;flex-direction:column;height:calc(100dvh - 62px);min-height:0;}
 .layout>.sidebar.circle-sidebar{display:none!important;}
 .layout>.community-rail{order:0;display:flex!important;flex:0 0 auto;width:100%;max-height:94px;min-height:72px;padding:7px 10px;gap:6px;border-right:0;border-bottom:1px solid var(--line);overflow:hidden;}
 .community-rail-heading{flex:0 0 auto;padding:0 2px 3px;border:0;}
 .community-rail-heading>strong{font-size:10px;}
 .community-rail-heading .community-rail-add{width:23px;height:23px;min-width:23px;flex-basis:23px;font-size:16px;}
 .community-rail-list{display:flex;gap:7px;overflow-x:auto;overflow-y:hidden;padding:0 0 3px;}
 .community-rail-item{grid-template-columns:30px minmax(0,1fr);flex:0 0 148px;min-height:42px;padding:5px 7px;gap:7px;border-radius:10px;}
 .community-rail-avatar{width:30px;height:30px;}
 .community-rail-meta strong{font-size:10px;}
 .community-rail-meta small{font-size:8px;}
 .community-rail-item>.community-rail-unread{position:absolute;right:3px;top:2px;min-width:14px;height:14px;font-size:8px;}
 .community-rail-create{display:none;}
 .layout>.circle-main{order:1;grid-column:auto;grid-row:auto;flex:1 1 auto;width:100%;min-height:0;overflow:auto;}
 .circle-media-viewer{padding:12px;}
 .circle-media-viewer-image{max-width:96vw;max-height:88dvh;}
 .circle-media-viewer-close{top:10px;right:10px;width:38px;height:38px;}
 .dm-upload-progress{padding:7px 9px 9px;}
 .call-controls,.dm-private-call{flex-wrap:wrap;gap:4px;}
 .call-controls button,.dm-private-call button{padding:6px 8px;font-size:9px;}
}

/* Circle 4.4.2 polish: media keeps its own dimensions; actions no longer collide. */
/* Message attachments share one grid area but lay out as separate, intrinsic-size items. */
.message-attachments{grid-area:attach;display:flex;align-items:flex-start;align-content:flex-start;flex-wrap:wrap;gap:8px;min-width:0;max-width:100%;}
.message-image-open{grid-area:auto;flex:0 1 auto;align-self:flex-start;}
.message-attachments>.voice-audio{grid-area:auto;flex:0 1 360px;width:min(100%,360px);max-width:100%;margin:0;}
.message-attachments>.message-video-preview{grid-area:auto;flex:0 1 auto;width:min(100%,520px);height:auto;max-width:100%;max-height:320px;margin:0;}
.message-attachments>a{grid-area:auto;display:inline-flex;align-items:center;max-width:100%;overflow-wrap:anywhere;}
.message-card>.message-image-open,.message-card>.voice-audio,.message-card>.message-video-preview,.message-card>a{grid-area:attach;}
.message-image-preview{width:auto!important;height:auto!important;max-width:min(100%,420px)!important;max-height:320px!important;object-fit:contain!important;}

/* Publication media follows the uploaded image ratio instead of a fixed 16:9 frame. */
.post-media{display:block;width:fit-content;max-width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:auto;margin:14px 0 15px;padding:0;overflow:visible;border:0;border-radius:0;background:transparent;}
.post-media>a,.post-media>.post-media-trigger{display:block;width:fit-content;max-width:100%;height:auto;min-width:0;min-height:0;margin:0;padding:0;overflow:hidden;border:0;border-radius:12px;background:transparent;box-shadow:none;line-height:0;}
.post-media>.post-media-trigger:hover{border:0;box-shadow:0 0 0 1px rgba(198,161,91,.52);}
.post-media img,.post-media video{display:block;width:auto;height:auto;max-width:100%;max-height:min(62vh,520px);object-fit:contain;background:transparent;border:1px solid rgba(198,161,91,.28);border-radius:12px;}
.post-media-trigger{cursor:zoom-in;}

/* Separate button outlines; no framed strip behind a row of controls. */
.dm-chat-header-actions,.dm-chat-header-actions .call-controls,.call-controls,.dm-private-call{min-width:0;max-width:100%;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;}
.dm-chat-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap;}
.dm-private-call button,.call-controls button{flex:0 1 auto;min-width:0;max-width:100%;white-space:nowrap;}

/* Counters stay readable and visually balanced. */
.social-interaction-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.reaction-button,.comment-count{gap:7px;padding-inline:12px;}
.reaction-button .interaction-total,.comment-count .interaction-total{margin-left:1px;}

@media(max-width:680px){
 .post-media{width:100%;max-width:100%;margin:10px 0 12px;}
 .post-media img,.post-media video{max-width:100%;max-height:52vh;}
 .message-attachments{gap:6px;}
 .message-image-preview{max-width:min(100%,320px)!important;max-height:260px!important;}
 .dm-chat-header-actions{justify-content:flex-start;}
 .dm-private-call{flex-wrap:wrap;}
 .dm-private-call button,.call-controls button{min-height:30px;padding:6px 8px;font-size:9px;}
}


/* Circle 4.4.3 — friends icon alignment, audio-only voice bubbles and comment controls. */
.primary-nav .nav-item{position:relative;box-sizing:border-box;width:100%;min-width:0;overflow:visible;}
.primary-nav .nav-icon{display:grid;place-items:center;min-width:25px;min-height:25px;}
.nav-icon-svg{display:block;width:22px;height:22px;flex:0 0 22px;}
.mobile-bottom-nav a>span:has(.nav-icon-svg){display:grid;place-items:center;min-width:25px;min-height:24px;}
.mobile-bottom-nav .nav-icon-svg{width:20px;height:20px;}
.primary-nav .nav-item>span:not(.nav-icon){max-width:100%;white-space:normal;line-height:1.25;overflow-wrap:anywhere;}
.dm-read-receipt{display:inline-flex;align-items:center;justify-content:flex-end;align-self:flex-end;min-width:28px;margin:2px 5px 0 auto;color:#9ca3ad;font-size:14px;font-weight:800;letter-spacing:-3px;line-height:1;}
.dm-read-receipt.is-read{color:var(--gold2);}
.voice-message-player{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:4px 10px;width:min(100%,390px);padding:9px 11px;border:1px solid rgba(198,161,91,.25);border-radius:13px;background:rgba(198,161,91,.045);}
.voice-message-label{grid-column:1/-1;font-size:11px;font-weight:700;color:var(--gold2);}
.voice-message-player .voice-audio{display:block;width:100%;max-width:100%;min-width:0;height:38px;margin:0;accent-color:var(--gold2);}
.voice-message-state{grid-column:1/-1;font-size:10px;}
.post-comment-content{display:grid;gap:6px;min-width:0;flex:1;}
.post-comment-time{display:block;margin-top:3px;color:var(--muted);font-size:10px;}
.post-comment-actions{display:flex;align-items:center;flex-wrap:wrap;gap:6px;}
.comment-action-form{display:inline-flex;margin:0;}
.comment-action-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:27px;padding:4px 8px;border:1px solid rgba(198,161,91,.25);border-radius:999px;background:transparent;color:var(--muted);font-size:10px;line-height:1.2;white-space:nowrap;box-shadow:none;}
.comment-action-button:hover,.comment-action-button.is-active{border-color:var(--gold);color:var(--gold2);background:rgba(198,161,91,.06);}
.comment-action-count{font-variant-numeric:tabular-nums;font-weight:750;color:var(--gold2);}
.comment-action-feedback{flex-basis:100%;}
@media(max-width:680px){
 .primary-nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
 .primary-nav .nav-item{min-height:62px;padding:7px 3px;gap:4px;}
 .primary-nav .nav-item>span:not(.nav-icon){font-size:10px;line-height:1.15;}
 .primary-nav .nav-icon-svg{width:21px;height:21px;}
 .voice-message-player{width:100%;}
 .post-comment-actions{gap:5px;}
 .comment-action-button{min-height:30px;font-size:10px;}
}


/* 4.4.3 follow-up polish: consistent icon geometry and message read states. */
.nav-icon{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;line-height:1;}
.nav-icon-svg{width:23px;height:23px;display:block;flex:0 0 auto;}
.primary-nav .nav-item{min-width:0;}
.primary-nav .nav-item>span:not(.nav-icon){min-width:0;}
.mobile-bottom-nav a>span{position:relative;display:grid;place-items:center;min-width:26px;min-height:25px;}
.mobile-bottom-nav .nav-icon-svg{width:21px;height:21px;}
.channel-read-receipt{display:inline-flex;align-self:flex-end;margin:3px 5px 0 auto;color:var(--gold2);font-size:13px;font-weight:800;letter-spacing:-3px;line-height:1;}
.voice-message-player.has-audio-error{border-color:rgba(225,91,100,.42);background:rgba(225,91,100,.05);}
.voice-message-player.has-audio-error .voice-message-state{color:#ef9a9e;}
@media(max-width:680px){
 .nav-icon{width:26px;height:26px;flex-basis:26px;}
 .nav-icon-svg{width:22px;height:22px;}
 .mobile-bottom-nav .nav-icon-svg{width:20px;height:20px;}
 .primary-nav .nav-item{align-items:center;justify-content:center;}
}

/* Circle 4.4.5 — spacious left navigation and editorial story previews. */
@media (min-width:681px) {
  .layout { grid-template-columns:110px 250px minmax(0,1fr)!important; }
  .layout>.sidebar.circle-sidebar { padding:18px 10px 14px; }
  .primary-nav { gap:10px; }
  .primary-nav .nav-item { min-height:76px; padding:11px 5px; gap:7px; }
  .primary-nav .nav-icon { width:34px; height:34px; flex:0 0 34px; }
  .primary-nav .nav-icon-svg { width:28px; height:28px; flex:0 0 28px; }
  .primary-nav .nav-item>span:not(.nav-icon) { width:100%; max-width:100%; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:clip; overflow-wrap:normal; word-break:normal; font-size:11.5px; line-height:1.2; letter-spacing:-.015em; }
  body.sidebar-collapsed .layout { grid-template-columns:72px 250px minmax(0,1fr)!important; }
}
@media (min-width:681px) and (max-width:1100px) {
  .layout { grid-template-columns:100px 220px minmax(0,1fr)!important; }
  .primary-nav .nav-item>span:not(.nav-icon) { font-size:10.5px; }
  .layout>.community-rail { padding-inline:9px; }
}
@media (max-width:680px) {
  .primary-nav .nav-item>span:not(.nav-icon) { white-space:nowrap; word-break:normal; overflow-wrap:normal; }
}

.story-preview-card { position:relative; flex:0 0 112px; width:112px; height:156px; min-height:156px; display:block; padding:0; overflow:hidden; border:1px solid rgba(198,161,91,.42); border-radius:15px; background:#191a1d; color:var(--text); text-align:left; box-shadow:0 5px 18px rgba(0,0,0,.18); }
.story-preview-card:hover { border-color:var(--gold2); box-shadow:0 8px 25px rgba(0,0,0,.28),0 0 14px rgba(198,161,91,.13); transform:translateY(-2px); }
.story-preview-card .story-preview-media { position:absolute; inset:0; z-index:0; display:block; width:100%; height:100%; object-fit:cover; border:0; border-radius:0; }
.story-preview-card .story-preview-video { display:grid; place-items:center; background:radial-gradient(circle at 70% 25%,rgba(198,161,91,.24),transparent 45%),linear-gradient(145deg,#343139,#121316 68%); }
.story-preview-video>span { display:grid; place-items:center; width:36px; height:36px; border:1px solid rgba(226,193,124,.55); border-radius:50%; color:var(--gold2); background:rgba(0,0,0,.35); }
.story-preview-shade { position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(5,6,8,.08) 15%,rgba(5,6,8,.05) 42%,rgba(5,6,8,.86) 100%); pointer-events:none; }
.story-preview-avatar { position:absolute; z-index:2; left:9px; top:9px; display:grid; place-items:center; width:30px; height:30px; overflow:hidden; border:2px solid var(--gold2); border-radius:50%; background:#1c1d20; color:var(--gold2); font-size:11px; font-weight:800; box-shadow:0 2px 9px rgba(0,0,0,.4); }
.story-preview-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.story-preview-card>strong { position:absolute; z-index:2; left:9px; right:7px; bottom:25px; max-width:none; color:#fff; font-size:11px; font-weight:750; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 1px 4px rgba(0,0,0,.65); }
.story-preview-card>small { position:absolute; z-index:2; left:9px; bottom:8px; color:rgba(255,255,255,.76); font-size:9px; }
.story-add { flex:0 0 112px; width:112px; min-height:156px; padding:8px; justify-content:center; border:1px dashed rgba(198,161,91,.5); border-radius:15px; background:linear-gradient(155deg,rgba(198,161,91,.07),rgba(24,25,29,.86)); }
.story-add form { display:flex; width:100%; height:100%; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.story-add-button { display:flex; flex-direction:column; align-items:center; gap:8px; color:var(--text); }
.story-add-button>span { display:grid; place-items:center; width:44px; height:44px; border:1px solid rgba(198,161,91,.65); border-radius:50%; color:var(--gold2); font-size:25px; }
.story-add-button>strong { font-size:10px; text-align:center; }
.story-add .story-caption-input { display:none; }
.story-add form>button { width:100%; min-height:27px; padding:4px 6px; font-size:9px; }

/* Read receipts sit beside message timestamps, as in familiar chat applications. */
.message-author-meta { gap:7px; }
.dm-read-receipt,.channel-read-receipt { display:inline-flex; align-items:center; justify-content:center; align-self:auto; flex:0 0 auto; min-width:0; margin:0 0 0 2px; padding:0; color:#9aa1aa; font-size:12px; font-weight:800; letter-spacing:-2.2px; line-height:1; }
.dm-read-receipt.is-read,.channel-read-receipt { color:var(--gold2); }


/* 4.4.5 final navigation/read-receipt polish. */
@media (min-width: 681px) {
  .layout { grid-template-columns: 130px 250px minmax(0,1fr) !important; }
  .layout > .sidebar.circle-sidebar { padding-inline: 10px; }
  .primary-nav { gap: 9px; }
  .primary-nav .nav-item { min-height: 76px; gap: 7px; padding: 10px 4px; }
  .primary-nav .nav-icon { width: 36px; height: 36px; flex: 0 0 36px; }
  .primary-nav .nav-icon-svg { width: 29px; height: 29px; flex: 0 0 29px; }
  .primary-nav .nav-item > span:not(.nav-icon) {
    display: block; width: 100%; min-width: 0; max-width: 100%;
    white-space: nowrap; overflow: visible; text-overflow: clip;
    font-size: 12px; font-weight: 650; line-height: 1.15;
    letter-spacing: -.02em; text-align: center;
  }
  body.sidebar-collapsed .layout { grid-template-columns: 72px 250px minmax(0,1fr) !important; }
  body.sidebar-collapsed .primary-nav .nav-item > span:not(.nav-icon) { display: none; }
}
@media (min-width: 681px) and (max-width: 1100px) {
  .layout { grid-template-columns: 122px 220px minmax(0,1fr) !important; }
  .primary-nav .nav-item > span:not(.nav-icon) { font-size: 11px; }
  body.sidebar-collapsed .layout { grid-template-columns: 70px 220px minmax(0,1fr) !important; }
}
@media (max-width: 680px) {
  .primary-nav .nav-item > span:not(.nav-icon) { white-space: nowrap; font-size: 10.5px; }
}
.message-meta-footer { display:flex; align-items:center; justify-content:flex-end; gap:7px; min-height:16px; margin-top:5px; padding-inline:2px; color:var(--muted); font-size:10px; line-height:1; }
.message-meta-footer time { color:var(--muted); font-size:10px; white-space:nowrap; }
.message-meta-footer .message-edited { color:var(--muted); font-size:9px; }
.message-meta-footer .dm-read-receipt,
.message-meta-footer .channel-read-receipt { margin:0; font-size:13px; }
@media(max-width:680px){ .message-meta-footer{margin-top:4px;} }


/* Circle 4.4.8 — layout containment, stable message metadata and audio player. */
.circle-main{min-width:0;width:100%;max-width:100%;overflow-x:hidden}
.circle-main>.page-heading,.circle-main>.stories-strip,.circle-main>.composer-card,
.circle-main>.feed-heading,.circle-main>.feed-post,.circle-main>.empty-feed,
.circle-main>.community-discovery{box-sizing:border-box;width:min(100%,1040px);max-width:100%;min-width:0}
.feed-post,.composer-card,.stories-strip,.feed-heading{min-width:0;max-width:100%}
.feed-post>*{max-width:100%;min-width:0}
.feed-post h3,.feed-post .post-body,.feed-post .post-author,.feed-post .post-actions{max-width:100%;overflow-wrap:anywhere;word-break:normal}
.post-body{white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal}
.post-media{width:100%;max-width:100%;min-width:0}
.post-media img,.post-media video{max-width:100%;height:auto;object-fit:contain}
.message-card{min-width:0;width:100%;max-width:min(100%,760px)}
.message-body,.message-reply-context,.message-attachments{min-width:0;max-width:100%;overflow-wrap:anywhere}
.message-attachments{grid-area:attach;width:100%}
.voice-message-player{display:grid;gap:5px;width:min(100%,420px);max-width:100%;min-width:0;padding:9px 10px;border:1px solid rgba(226,193,124,.18);border-radius:11px;background:rgba(198,161,91,.045)}
.voice-message-label{font-size:11px;color:var(--gold2);font-weight:650}
.voice-audio{display:block;width:100%;max-width:100%;min-width:0;height:38px;margin:2px 0}
.voice-message-state{font-size:10px;line-height:1.35;overflow-wrap:anywhere}
.message-meta-footer{grid-area:meta;display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px;min-width:0;max-width:100%;margin-top:2px;padding:2px 1px 0}
.message-meta-footer .message-time{display:inline-block;white-space:nowrap;font-variant-numeric:tabular-nums;font-size:10px;line-height:1.3}
.message-meta-footer .message-edited{white-space:nowrap}
@media(max-width:680px){
 .circle-main>.page-heading,.circle-main>.stories-strip,.circle-main>.composer-card,.circle-main>.feed-heading,.circle-main>.feed-post,.circle-main>.empty-feed,.circle-main>.community-discovery{width:100%;max-width:100%}
 .feed-post{padding:12px}
 .feed-post .post-body{font-size:13px;line-height:1.55}
 .message-card{width:100%;max-width:100%}
 .message-meta-footer{gap:5px}
 .message-meta-footer .message-time{font-size:9px}
 .voice-message-player{width:100%}
}
.voice-message-download{width:max-content;max-width:100%;font-size:10px;color:var(--gold2);text-decoration:underline;overflow-wrap:anywhere}

/* Circle 4.5.0 — message alignment, rail identity, controls and voice UX */
.dm-messages .dm-message-card{width:fit-content;min-width:min(250px,100%);max-width:min(78%,680px);flex:0 0 auto;align-self:flex-start}
.dm-messages .dm-message-card.dm-own{align-self:flex-end;background:linear-gradient(145deg,rgba(198,161,91,.13),rgba(198,161,91,.045));border-color:rgba(198,161,91,.33)}
.dm-messages .dm-message-card.dm-other{align-self:flex-start}
.dm-messages .dm-message-card .message-attachments{min-width:0}
.community-rail-list .community-rail-item{display:grid;width:100%;height:auto;min-height:60px;grid-template-columns:42px minmax(0,1fr) auto;place-items:stretch;overflow:visible}
.community-rail-item .community-rail-avatar{width:42px;height:42px;display:grid;place-items:center;overflow:hidden;border-radius:13px;background:linear-gradient(145deg,#352c20,#17191d)}
.community-rail-item .community-rail-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.community-rail-item .community-rail-avatar>span{display:grid;place-items:center;width:100%;height:100%;font-size:18px}
.community-rail-item .community-rail-meta{display:flex;width:auto;height:auto;min-width:0;flex-direction:column;justify-content:center;align-items:flex-start;background:none;text-align:left}
.community-rail-item .community-rail-meta strong{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:12px;font-weight:700}
.community-rail-item .community-rail-meta small{color:var(--muted);font-size:10px}
.topbar .userline{display:flex;align-items:center;gap:9px;min-width:0;white-space:normal}
.topbar .header-identity{display:flex;align-items:center;gap:8px;min-width:0;color:var(--text);text-decoration:none}
.topbar .header-identity .user-name{max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar .presence-select-label{display:flex;align-items:center;gap:6px;margin:0;padding:4px 7px;border:1px solid rgba(198,161,91,.17);border-radius:10px;background:rgba(255,255,255,.025)}
.topbar .presence-select-label select{width:auto;max-width:145px;min-width:95px;margin:0;border:0;background:transparent;color:var(--text);font-size:12px}
.topbar .header-logout{margin:0}.topbar .header-logout button{padding:7px 11px;border-radius:9px}
.dm-voice-record{position:relative;display:inline-grid;place-items:center;overflow:hidden;white-space:nowrap;line-height:1;min-width:38px;max-width:38px;font-size:15px!important}
.dm-voice-record[aria-label="Остановить запись"]{background:rgba(198,70,70,.14);color:#ffb0a8;border-color:rgba(255,110,110,.4)}
.voice-message-player{grid-template-columns:minmax(0,1fr);width:min(100%,400px)}
.voice-message-player .voice-play-button{display:inline-flex;align-items:center;justify-content:center;justify-self:start;min-height:32px;padding:6px 13px;border:1px solid rgba(198,161,91,.4);border-radius:9px;color:var(--gold2);background:rgba(198,161,91,.11);font-size:12px;font-weight:700;cursor:pointer}
.voice-message-player .voice-audio{grid-column:1;display:block!important;visibility:visible!important;opacity:1!important;min-height:42px}
.voice-message-player .voice-message-state{grid-column:1}
@media(max-width:680px){.dm-messages .dm-message-card{max-width:92%;min-width:min(180px,100%)}.topbar .userline{gap:4px}.topbar .header-identity .user-name{display:none}.topbar .presence-select-label{padding:3px}.topbar .presence-select-label select{min-width:75px;max-width:90px}.community-rail-list .community-rail-item{width:150px;min-height:45px;grid-template-columns:32px minmax(0,1fr)}.community-rail-item .community-rail-avatar{width:32px;height:32px}.community-rail-item .community-rail-meta strong{font-size:10px}}

/* Circle 4.5.1 — one native audio control and readable dark status menu */
.voice-message-player .voice-audio{display:block!important;width:100%;height:44px;min-height:44px;grid-column:1;visibility:visible!important;opacity:1!important}
.topbar .presence-select-label select{color-scheme:dark;background-color:#202126;color:#f4f0e9;border:1px solid rgba(198,161,91,.23);border-radius:8px;padding:6px 25px 6px 9px;cursor:pointer;outline-offset:2px}
.topbar .presence-select-label select option{background-color:#202126;color:#f4f0e9}
.topbar .presence-select-label select:focus-visible{outline:2px solid #c6a15b}
.topbar .presence-select-label select:disabled{opacity:.55}

/* Circle 4.5.2: compact threaded comment replies */
.comment-reply-button{cursor:pointer;white-space:nowrap}.comment-reply-reference{font-size:12px;color:var(--muted,#a6a9b0);border-left:2px solid #b08c52;padding:4px 9px;margin:5px 0;overflow-wrap:anywhere}.comment-reply-notice{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-basis:100%;width:100%;font-size:12px;color:#d6bd8c;padding:5px 8px;border-radius:7px;background:rgba(176,140,82,.09)}.comment-reply-cancel{font-size:12px;padding:3px 7px;white-space:nowrap}

/* Circle 4.5.3 — unified messenger, accessible controls and reply composer */
.community-discovery[hidden]{display:none!important}
.circle-main:has(.messenger-workspace){width:100%;max-width:none!important;min-width:0}
.circle-main>.messenger-workspace{width:100%;max-width:none!important;margin:0!important}
.messenger-workspace{width:100%;max-width:none!important;grid-template-columns:minmax(265px,300px) minmax(0,1fr);gap:10px;height:calc(100dvh - 112px);min-height:560px}
.dm-sidebar,.dm-conversation-area{min-width:0}
.dm-list-tabs{gap:8px;margin:12px 0}
.dm-list-tabs a{display:inline-flex;align-items:center;justify-content:center;min-height:37px;padding:9px 14px;font-size:13px;font-weight:600;line-height:1.1;border:1px solid rgba(198,161,91,.18)}
.dm-chat-header{min-width:0;gap:10px}
.dm-chat-header-actions{min-width:0;flex:0 1 auto;display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.dm-chat-header-actions .dm-private-call{display:flex;flex-wrap:wrap;gap:6px;max-width:100%;min-width:0}
.dm-chat-header-actions .dm-private-call button{min-width:0;max-width:100%;white-space:nowrap;font-size:11px;line-height:1.25;padding:8px 10px}
.dm-chat-header-actions #callButton{font-size:11px!important;min-width:0;overflow:hidden;text-overflow:ellipsis}
.social-comment-form{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important}
.social-comment-form .comment-reply-notice{order:0;flex-basis:auto!important;width:100%;min-width:0}
.social-comment-form textarea[name=body]{order:1;width:100%;min-width:0;min-height:96px;resize:vertical;background:var(--input-bg,#131519);color:var(--text,#eee);border:1px solid var(--line,#34383e);border-radius:10px;padding:12px;font:inherit;line-height:1.5}
.social-comment-form .social-comment-submit{order:2;width:100%;min-height:40px}
.comment-reply-notice span{overflow-wrap:anywhere;min-width:0}
.composer .voice-discard{flex:0 0 auto;white-space:nowrap;font-size:11px;padding:7px 9px;border-color:rgba(198,161,91,.35)}
.composer .voice-discard[hidden]{display:none!important}
.composer #voiceRecordButton,.composer #dmVoiceRecordButton{flex:0 0 auto;min-width:38px;width:38px;max-width:38px;padding:7px!important;white-space:nowrap;overflow:hidden;text-align:center}
.composer #voiceRecordStatus,.composer #dmVoiceRecordStatus{flex-basis:100%;overflow-wrap:anywhere}
@media(max-width:900px){.messenger-workspace{grid-template-columns:minmax(220px,260px) minmax(0,1fr)}.dm-chat-header-actions .dm-private-call button:not(#callButton){display:none}}
@media(max-width:700px){.messenger-workspace{grid-template-columns:minmax(0,1fr);gap:0;height:calc(100dvh - 155px);min-height:420px}.dm-chat-header-actions{flex-wrap:nowrap}.dm-list-tabs a{font-size:12px;padding:9px 12px}}

/* Circle 4.5.4: fluid conversation bubbles and accessible text composer */
.comment-count.comment-count-static{cursor:default;color:var(--muted);background:transparent;border-color:transparent;box-shadow:none;pointer-events:none;user-select:text;padding:7px 3px}
.comment-count.comment-count-static:hover{background:transparent;border-color:transparent;box-shadow:none}
.dm-messages{padding:18px clamp(16px,3.5vw,64px)!important;gap:15px!important;align-items:stretch}
.dm-messages .dm-message-card{box-sizing:border-box;width:max-content;min-width:min(34%,320px);max-width:86%;margin:0;flex:0 0 auto;align-self:flex-start;padding:15px 17px;border-radius:17px}
.dm-messages .dm-message-card.dm-own{align-self:flex-end}
.dm-messages .dm-message-card.dm-other{align-self:flex-start}
.dm-messages .dm-message-card .message-body{font-size:17px!important;line-height:1.55!important;font-weight:450;letter-spacing:.01em;overflow-wrap:anywhere;word-break:normal;white-space:pre-wrap}
.dm-messages .dm-message-card .message-author-meta strong{font-size:12px!important;font-weight:700}
.dm-messages .dm-message-card .message-avatar{width:31px;height:31px;flex:0 0 31px}
.dm-messages .dm-message-card .message-meta-footer .message-time{font-size:10px}
.dm-composer{align-items:flex-end!important;gap:10px!important;padding:14px 17px!important;flex-wrap:wrap!important}
.dm-composer #dmComposer{box-sizing:border-box;display:block;flex:1 1 calc(100% - 200px)!important;min-width:min(260px,100%);width:auto;max-width:100%;height:auto;min-height:96px;max-height:220px;resize:vertical;overflow-y:auto;padding:14px 16px!important;font-size:16px!important;line-height:1.5!important;border-radius:13px}
.dm-composer .dm-attach-button,.dm-composer .dm-voice-record{height:43px!important;width:43px!important;flex:0 0 43px!important;align-self:flex-end}
.dm-composer .dm-send-button{min-height:43px!important;font-size:13px!important;align-self:flex-end}
.dm-composer #dmVoiceRecordButton{font-size:21px!important;border-radius:12px!important}
.dm-composer #dmVoiceRecordStatus{width:100%;font-size:12px;flex:1 1 100%;order:10}
@media(max-width:800px){.dm-messages{padding:13px 14px!important}.dm-messages .dm-message-card{min-width:min(40%,250px);max-width:92%;padding:12px 13px}.dm-messages .dm-message-card .message-body{font-size:15px!important}.dm-composer{gap:7px!important;padding:10px!important}.dm-composer #dmComposer{flex-basis:100%!important;min-height:82px;order:-1}.dm-composer .dm-send-button{margin-left:auto}}

.dm-composer{align-items:stretch}
.dm-send-stack{display:flex;flex-direction:column;gap:10px;align-self:stretch;justify-content:flex-end}
.dm-send-stack .btn,.dm-send-stack .dm-voice-record{width:56px;min-width:56px;min-height:56px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:20px}
.dm-send-stack .btn{width:110px;font-size:14px}
.dm-send-stack .dm-voice-record{font-size:22px;border-radius:14px}
#dmComposer{min-height:136px;font-size:17px;line-height:1.55}

/* Circle 4.5.5 */
.upload-card{position:relative;display:flex;flex-direction:column;gap:8px;max-width:320px;width:min(320px,100%);padding:12px;border:1px solid rgba(198,161,91,.18);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02))}
.upload-card-overlay{position:absolute;inset:10px 10px auto auto;z-index:2;font-size:12px;color:#f0d28e}
.upload-card .upload-progress-file{padding-right:52px;font-size:13px;line-height:1.4;word-break:break-word}
.upload-card .upload-progress-bar{height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.upload-card .upload-progress-bar i{display:block;height:100%;background:linear-gradient(90deg,#b7892d,#f0d28e)}
.upload-card.is-ready .upload-progress-bar,.upload-card.is-ready .upload-card-overlay{display:none}
.message-link{color:#f0d28e;text-decoration:none;border-bottom:1px dashed rgba(240,210,142,.4)}
.message-link:hover{text-decoration:underline}
.chat-invite-card{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;padding:12px;border:1px solid rgba(198,161,91,.2);border-radius:12px;background:rgba(198,161,91,.06)}
.chat-invite-card .invite-title{font-weight:700;font-size:13px;margin-bottom:3px}
.chat-invite-card .invite-code{font-size:12px;color:var(--muted,#aaa)}
@media(max-width:760px){.dm-send-stack .btn{width:96px}.dm-send-stack .btn,.dm-send-stack .dm-voice-record{min-height:48px}}

/* Circle 4.5.6: fixed selectors matching actual markup; upload preview only shows progress during transfer. */
.dm-composer{display:grid!important;grid-template-columns:44px minmax(0,1fr) 110px!important;align-items:stretch!important;gap:10px!important;flex-wrap:nowrap!important}
.dm-composer>.dm-attach-button{grid-column:1;grid-row:1;align-self:center!important;width:44px!important;height:44px!important;min-width:44px!important}
.dm-composer>#dmComposer{grid-column:2;grid-row:1;min-width:0!important;max-width:100%!important;width:100%!important;flex:none!important;min-height:125px!important}
.dm-composer>.dm-send-stack{grid-column:3;grid-row:1;display:flex!important;flex-direction:column!important;gap:10px;justify-content:flex-end;align-items:stretch;min-width:0}
.dm-composer .dm-send-stack>#dmVoiceRecordButton{width:100%!important;height:48px!important;max-width:none!important;flex:none!important;align-self:stretch!important;font-size:22px!important}
.dm-composer .dm-send-stack>.dm-send-button{width:100%!important;min-width:0!important;min-height:48px!important;max-width:100%!important;align-self:stretch!important;flex:none!important;font-size:12px!important;margin:0!important}
.dm-composer>#dmVoiceRecordStatus{grid-column:1/-1;grid-row:2;min-width:0;overflow-wrap:anywhere}
.dm-composer .voice-discard{max-width:100%;font-size:11px!important;white-space:normal}
.dm-upload-progress{display:flex!important;padding:9px 14px!important;background:transparent!important;max-width:100%!important;border:0!important}
.dm-upload-progress[hidden]{display:none!important}
.dm-upload-file-card{position:relative;display:flex;flex-direction:column;gap:7px;width:min(275px,100%);max-width:100%;min-height:54px;border:1px solid rgba(202,161,87,.28);border-radius:12px;padding:12px;background:rgba(255,255,255,.035)}
.dm-upload-filename{font-size:12px;font-weight:600;overflow-wrap:anywhere;padding-right:35px}
.dm-upload-percent{position:absolute;right:10px;top:10px;color:#e8c67d;font-size:11px}
.dm-upload-progress progress{width:100%!important;height:5px!important}
.dm-upload-file-card progress[hidden],.dm-upload-percent[hidden]{display:none!important}
.message-body .chat-message-link{color:#e7bf73;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.chat-invite-card{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px;border:1px solid rgba(202,161,87,.32);border-radius:12px;background:rgba(202,161,87,.055);max-width:360px;margin:10px 0 0}
.chat-invite-text{display:flex;flex-direction:column;gap:4px;flex:1 1 160px}
.chat-invite-text strong{font-size:13px}.chat-invite-text span{font-size:11px;color:#b4ada2}
.chat-invite-join-form{flex:0 0 auto}.chat-invite-join-form button{font-size:12px;padding:9px 12px}
@media(max-width:660px){.dm-composer{grid-template-columns:39px minmax(0,1fr) 85px!important;gap:6px!important;padding:9px!important}.dm-composer>#dmComposer{min-height:95px!important}.dm-composer .dm-send-stack>.dm-send-button{font-size:11px!important}}

/* Circle 4.5.7: message content separated from metadata and media */
.dm-messages .dm-message-card, .messages .channel-message-card{
 background:transparent!important;border:0!important;box-shadow:none!important;
 backdrop-filter:none!important;padding:6px 2px!important;min-width:0!important;
 display:grid;overflow:visible!important;gap:6px 8px!important;
}
.dm-messages .dm-message-card .message-body,.messages .channel-message-card .message-body{
 grid-area:body;width:fit-content;max-width:100%;min-width:0;box-sizing:border-box;
 padding:12px 15px;border:1px solid rgba(198,161,91,.22);border-radius:15px;
 background:rgba(198,161,91,.075);overflow-wrap:anywhere;white-space:pre-wrap;
}
.dm-messages .dm-message-card .message-body:empty,.messages .channel-message-card .message-body:empty{display:none!important}
.dm-messages .dm-message-card .message-header,.messages .channel-message-card .message-header{display:flex;gap:10px;align-items:center}
.dm-messages .dm-message-card .message-avatar,.messages .channel-message-card .message-avatar{width:38px!important;height:38px!important;flex:0 0 38px!important}
.dm-messages .dm-message-card .message-author-meta strong,.messages .channel-message-card .message-author-meta strong{font-size:15px!important;line-height:1.3}
.dm-messages .dm-message-card.dm-own .message-header{flex-direction:row-reverse;text-align:right;justify-content:flex-start}
.dm-messages .dm-message-card.dm-own .message-body{justify-self:end}
.dm-messages .dm-message-card.dm-own .message-meta-footer{justify-content:flex-end}
.dm-messages .dm-message-card .message-attachments{display:flex;flex-direction:column;gap:8px;max-width:100%;min-width:0}
.dm-messages .dm-message-card.voice-only .message-attachments,.messages .channel-message-card.voice-only .message-attachments{grid-area:attach}
.dm-messages .dm-message-card.voice-only .voice-message-player,.messages .channel-message-card.voice-only .voice-message-player{width:min(380px,100%)}
.dm-attachment-previews{display:flex;gap:10px;flex-wrap:wrap;padding:10px 14px;max-width:100%;}
.dm-attachment-previews:empty{display:none}
.dm-attachment-card{position:relative;width:126px;min-height:125px;max-width:100%;display:flex;flex-direction:column;gap:7px;padding:8px;border:1px solid rgba(198,161,91,.24);border-radius:13px;background:rgba(255,255,255,.035)}
.dm-attachment-thumb{display:grid;place-items:center;width:100%;height:76px;background:rgba(0,0,0,.15);border-radius:8px;overflow:hidden;font-size:24px;color:var(--gold2)}
.dm-attachment-thumb img,.dm-attachment-thumb video{width:100%;height:100%;object-fit:contain}
.dm-attachment-name{font-size:11px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;max-height:3.75em}
.dm-attachment-remove{position:absolute;top:3px;right:3px;display:grid;place-items:center;min-width:26px;min-height:26px;padding:0!important;border-radius:7px;background:#211d1b;color:#fff;font-size:18px;cursor:pointer;border:1px solid rgba(255,255,255,.25)}
.dm-attachment-percent{position:absolute;inset:0;display:grid;place-items:center;background:rgba(10,11,14,.7);font-size:19px;font-weight:700;color:#f1d28a;border-radius:13px;pointer-events:none}
.dm-attachment-percent[hidden]{display:none!important}
/* Hide verbose recorder telemetry, but preserve screen-reader error messages. */
#dmVoiceRecordStatus,#voiceRecordStatus{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.dm-composer .voice-discard{align-self:center!important}
@media(max-width:640px){.dm-attachment-card{width:108px}.dm-messages .dm-message-card .message-avatar{width:33px!important;height:33px!important;flex-basis:33px!important}.dm-messages .dm-message-card .message-author-meta strong{font-size:14px!important}}

/* Circle 4.5.8: one recorder slot, two side-by-side controls only while recording */
.voice-record-controls{display:flex;align-items:stretch;justify-content:center;gap:6px;min-width:0;max-width:100%;width:100%;}
.voice-record-controls>.voice-record-delete{min-width:34px;flex:1 1 34px;display:inline-grid;place-items:center;border:1px solid rgba(227,104,104,.45);border-radius:10px;color:#f2b0a7;background:rgba(172,50,52,.12);font-size:17px;cursor:pointer;}
.voice-record-controls>.voice-record-delete[hidden]{display:none!important;}
.voice-record-controls>#dmVoiceRecordButton,.voice-record-controls>#voiceRecordButton{width:100%!important;max-width:100%!important;min-width:0!important;flex:1 1 0!important;align-self:stretch!important;line-height:1;font-size:19px!important;}
.voice-record-controls.is-recording>#dmVoiceRecordButton,.voice-record-controls.is-recording>#voiceRecordButton{width:50%!important;}
.dm-composer .dm-send-stack>.voice-record-controls{min-height:48px;height:48px;max-width:100%;}
.dm-composer .dm-send-stack>.voice-record-controls #dmVoiceRecordButton{height:48px!important;max-height:48px!important;}
.dm-attach-button .dm-attach-icon{display:block;flex:none;pointer-events:none;stroke:currentColor;}
/* Show the full native audio player and seek bar even before the first play */
.message-attachments .voice-message-player,.dm-messages .dm-message-card.voice-only .voice-message-player,.messages .channel-message-card.voice-only .voice-message-player{width:min(100%,480px)!important;max-width:480px!important;min-width:0!important;}
.voice-message-player{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:7px!important;}
.voice-message-player .voice-audio{display:block!important;flex:none!important;width:100%!important;max-width:100%!important;min-width:0!important;height:54px!important;min-height:54px!important;visibility:visible!important;opacity:1!important;}
.voice-message-player .voice-message-label,.voice-message-player .voice-message-state{display:block;max-width:100%;}
@media(max-width:600px){.message-attachments .voice-message-player,.dm-messages .dm-message-card.voice-only .voice-message-player{width:100%!important}.voice-record-controls{gap:4px}.voice-record-controls>.voice-record-delete{min-width:30px;}}

/* Circle 4.5.9: recorder aligned to top of text-entry field, equal pause/delete buttons */
.dm-composer>.dm-send-stack{justify-content:space-between!important;align-self:stretch!important;align-items:stretch!important;min-height:125px!important;gap:10px!important}
.dm-composer>.dm-send-stack>.voice-record-controls{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;align-items:stretch!important;gap:7px!important;max-width:none!important;height:48px!important;min-height:48px!important;margin:0!important}
.dm-composer>.dm-send-stack>.voice-record-controls:not(.is-recording){grid-template-columns:minmax(0,1fr)!important}
.dm-composer .voice-record-controls>#dmVoiceRecordButton,.dm-composer .voice-record-controls>.voice-record-delete{display:grid!important;place-items:center!important;box-sizing:border-box!important;width:100%!important;min-width:0!important;max-width:none!important;height:48px!important;min-height:48px!important;max-height:48px!important;flex:none!important;margin:0!important;padding:0!important;border:1px solid rgba(202,161,87,.45)!important;border-radius:11px!important;font-size:19px!important;line-height:1!important;color:var(--gold2)!important;background:rgba(202,161,87,.065)!important}
.dm-composer .voice-record-controls>.voice-record-delete{color:#efacaa!important;border-color:rgba(220,99,99,.42)!important;background:rgba(200,67,70,.075)!important}
.dm-composer .voice-record-controls>.voice-record-delete[hidden]{display:none!important}
.dm-composer .voice-record-controls.is-recording>#dmVoiceRecordButton{width:100%!important}
.dm-composer>.dm-send-stack>.dm-send-button{margin-top:auto!important}
.dm-composer>.dm-attach-button{align-self:start!important;margin-top:0!important}
@media(max-width:660px){.dm-composer>.dm-send-stack{min-height:95px!important}.dm-composer>.dm-send-stack>.voice-record-controls{height:42px!important;min-height:42px!important}.dm-composer .voice-record-controls>#dmVoiceRecordButton,.dm-composer .voice-record-controls>.voice-record-delete{height:42px!important;min-height:42px!important;max-height:42px!important}}
/* Custom Circle audio: controls are always visible even when metadata has not loaded */
.message-attachments .circle-audio-player,.dm-messages .dm-message-card.voice-only .circle-audio-player,.messages .channel-message-card.voice-only .circle-audio-player{width:min(100%,440px)!important;min-width:0!important;max-width:440px!important;display:flex!important;flex-direction:column!important;gap:12px!important;box-sizing:border-box!important;padding:13px 15px!important;border:1px solid rgba(202,161,87,.28)!important;border-radius:15px!important;background:rgba(198,161,91,.065)!important}
.circle-audio-player .voice-message-label{font-size:13px!important;line-height:1.3!important;font-weight:650!important;color:var(--gold2)!important}
.circle-audio-player .circle-audio-controls{display:grid!important;grid-template-columns:37px auto minmax(70px,1fr) auto 36px;gap:9px;align-items:center;min-width:0;width:100%}
.circle-audio-player button.circle-audio-play,.circle-audio-player button.circle-audio-mute{box-sizing:border-box;width:36px;height:36px;min-height:36px;padding:0;display:grid;place-items:center;white-space:nowrap;border:1px solid rgba(202,161,87,.32);border-radius:10px;background:rgba(202,161,87,.10);color:var(--gold2);font-family:inherit;font-size:17px;font-weight:700;line-height:1;cursor:pointer}
.circle-audio-player button.circle-audio-play:hover,.circle-audio-player button.circle-audio-mute:hover{background:rgba(202,161,87,.20)}
.circle-audio-player .circle-audio-time{font-size:12px;font-variant-numeric:tabular-nums;color:#d4d0cb;white-space:nowrap}
.circle-audio-player .circle-audio-seek{box-sizing:border-box;display:block!important;min-width:0!important;width:100%!important;height:6px!important;margin:0!important;padding:0!important;border:0!important;border-radius:999px;background:linear-gradient(to right,#dbb568 var(--audio-progress,0%),rgba(255,255,255,.22) var(--audio-progress,0%))!important;appearance:none;-webkit-appearance:none;cursor:pointer}
.circle-audio-player .circle-audio-seek::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:13px;height:13px;border:2px solid #18191b;border-radius:50%;background:#e6c482;box-shadow:0 0 0 1px rgba(202,161,87,.4)}
.circle-audio-player .circle-audio-seek::-moz-range-thumb{width:11px;height:11px;border:2px solid #18191b;border-radius:50%;background:#e6c482}
.circle-audio-player audio.voice-audio{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important}
.circle-audio-player .voice-message-state[hidden],.circle-audio-player .voice-message-download[hidden]{display:none!important}
.circle-audio-player .voice-message-state{font-size:11px!important}
@media(max-width:540px){.circle-audio-player .circle-audio-controls{grid-template-columns:33px auto minmax(45px,1fr) auto 32px;gap:5px}.circle-audio-player button.circle-audio-play,.circle-audio-player button.circle-audio-mute{width:32px;height:32px;min-height:32px}.circle-audio-player .circle-audio-time{font-size:11px}}
/* Invitation already has its own visual boundary; message body should not wrap it */
.dm-messages .dm-message-card .message-body.has-invite-card,.messages .channel-message-card .message-body.has-invite-card{border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;}

/* Circle 4.5.10: volume slider replaces mute button */
.circle-audio-player .circle-audio-controls{grid-template-columns:37px auto minmax(65px,1fr) auto minmax(56px,90px)!important;gap:9px!important}
.circle-audio-player .circle-audio-volume{display:block!important;box-sizing:border-box!important;min-width:0!important;width:100%!important;height:6px!important;margin:0!important;padding:0!important;border:0!important;border-radius:999px!important;appearance:none!important;-webkit-appearance:none!important;background:linear-gradient(to right,#dbb568 var(--volume-progress,100%),rgba(255,255,255,.22) var(--volume-progress,100%))!important;cursor:pointer!important;accent-color:#dbb568}
.circle-audio-player .circle-audio-volume::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:13px;height:13px;border:2px solid #18191b;border-radius:50%;background:#e6c482;box-shadow:0 0 0 1px rgba(202,161,87,.4)}
.circle-audio-player .circle-audio-volume::-moz-range-thumb{width:11px;height:11px;border:2px solid #18191b;border-radius:50%;background:#e6c482}
@media(max-width:540px){.circle-audio-player .circle-audio-controls{grid-template-columns:33px auto minmax(38px,1fr) auto minmax(45px,58px)!important;gap:5px!important}}

/* Circle 4.5.11: full-width readable call controls, with no empty participant placeholder */
.call-participants:empty{display:none!important;padding:0!important;margin:0!important;border:0!important;box-shadow:none!important;background:none!important}
.dm-chat-header{flex-wrap:wrap!important;row-gap:9px!important}
.dm-chat-header-actions{flex:0 1 auto!important;min-width:0!important;max-width:100%!important;gap:8px!important}
.dm-chat-header-actions .dm-private-call{display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:8px!important;max-width:100%!important;overflow:visible!important}
.dm-chat-header-actions .dm-private-call button,
.dm-chat-header-actions .dm-private-call #callButton,
.call-controls button{flex:0 0 auto!important;min-width:max-content!important;max-width:none!important;min-height:42px!important;padding:10px 15px!important;white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important;font-size:12px!important;font-weight:600!important;line-height:1.3!important}
.dm-chat-header-actions .dm-private-call #callButton{min-width:155px!important}
.dm-chat-header-actions .dm-private-call #micButton{min-width:100px!important}
.dm-chat-header-actions .dm-private-call #videoButton{min-width:86px!important}
.dm-chat-header-actions .dm-private-call #screenButton{min-width:81px!important}
@media(max-width:900px){
  .dm-chat-header-actions .dm-private-call button:not(#callButton){display:inline-flex!important}
  .dm-chat-header-actions{flex-basis:100%!important;justify-content:flex-start!important}
}
@media(max-width:540px){
  .dm-chat-header-actions .dm-private-call button,
  .dm-chat-header-actions .dm-private-call #callButton{min-height:40px!important;padding:9px 12px!important;font-size:12px!important}
  .dm-chat-header-actions .dm-private-call #callButton{min-width:140px!important}
  .dm-chat-header-actions .dm-private-call #micButton{min-width:95px!important}
}

/* Circle 4.5.12 — active DM call and incoming-call overlay */
.circle-incoming-call[hidden],.dm-call-panel[hidden]{display:none!important}
.circle-incoming-call{position:fixed;right:20px;bottom:20px;z-index:99990;width:min(410px,calc(100vw - 30px));display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:16px;border:1px solid rgba(212,172,92,.75);border-radius:16px;background:linear-gradient(140deg,#232428,#15171b);box-shadow:0 22px 75px #000b,0 0 28px #b88c3522;color:#f7f0df}
.circle-incoming-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;border:1px solid #be9b61}
.circle-incoming-copy{display:grid;flex:1;min-width:130px;gap:5px}.circle-incoming-copy span{color:#c5c4c1}
.circle-incoming-actions{display:flex;gap:7px;width:100%}.circle-incoming-actions button{flex:1;min-height:40px;border-radius:9px;background:#24262a;color:#f0d7a5;border:1px solid #a88b51;font-weight:650}.circle-answer-call{background:#59451e!important}
.dm-conversation-area.call-is-active{display:grid!important;grid-template-columns:minmax(220px,38%) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;align-content:stretch}
.dm-conversation-area.call-is-active .dm-chat-header{grid-column:1/-1;grid-row:1}
.dm-conversation-area.call-is-active .dm-call-panel{grid-column:1;grid-row:2;display:flex;flex-direction:column;min-height:0;overflow:auto;border-right:1px solid rgba(199,161,91,.25);background:rgba(18,19,22,.64)}
.dm-conversation-area.call-is-active #dmMessages{grid-column:2;grid-row:2;min-height:0}
.dm-conversation-area.call-is-active #callStatus{grid-column:1/-1;grid-row:3;padding-inline:12px}
.dm-conversation-area.call-is-active .dm-composer{grid-column:2;grid-row:4}
.dm-conversation-area.call-is-active #dmTypingIndicator{grid-column:2;grid-row:3}
.dm-call-panel .call-participants{display:flex;align-content:start;gap:10px;flex-direction:column;margin:10px;flex-shrink:0}
.dm-call-panel .call-participant{width:100%;max-width:none;box-sizing:border-box}
.call-participant-avatar{width:40px;height:40px;flex-basis:40px;overflow:visible;position:relative;transition:box-shadow .2s ease!important}
.call-participant-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.call-participant.is-speaking{border-color:rgba(226,193,124,.16)!important;background:rgba(255,255,255,.018)!important;box-shadow:none!important;transform:none!important}
.call-participant.is-speaking .call-participant-avatar{box-shadow:0 0 0 3px #d6ac5b,0 0 20px #d6ac5b88!important}
.call-device-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border:none!important;background:transparent!important;padding:8px 12px!important}
.call-device-controls label{flex:1 1 150px;min-width:min(150px,100%);font-size:12px;color:#d6be89}
.call-device-controls select{min-height:42px!important;background:#202126!important;color:#f4ead3!important;border:1px solid #877048!important;border-radius:10px!important;padding:9px 11px!important;color-scheme:dark;font-size:12px}
.call-device-controls select option{background:#202126;color:#f4ead3}
.call-connection-quality{font-size:12px;color:#d6be89;padding:6px 12px}
@media(max-width:850px){.dm-conversation-area.call-is-active{grid-template-columns:1fr;grid-template-rows:auto minmax(160px,34vh) minmax(180px,1fr) auto auto}.dm-conversation-area.call-is-active .dm-call-panel{grid-column:1;grid-row:2;border-right:0;border-bottom:1px solid #98783e33}.dm-conversation-area.call-is-active #dmMessages{grid-column:1;grid-row:3}.dm-conversation-area.call-is-active .dm-composer{grid-column:1;grid-row:5}.dm-conversation-area.call-is-active #callStatus,.dm-conversation-area.call-is-active #dmTypingIndicator{grid-column:1;grid-row:4}}

/* A full-width control bar above both panes, including device choices. */
.dm-conversation-area.call-is-active{grid-template-rows:auto auto minmax(0,1fr) auto auto!important}
.dm-conversation-area.call-is-active .dm-chat-header{grid-row:1!important}
.dm-conversation-area.call-is-active .dm-call-toolbar{grid-column:1/-1;grid-row:2;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid rgba(198,161,91,.25);background:#1e2024}
.dm-conversation-area.call-is-active .dm-call-toolbar .dm-private-call{flex:0 1 auto}
.dm-conversation-area.call-is-active .dm-call-toolbar .call-device-controls{flex:1 1 300px;margin:0}
.dm-conversation-area.call-is-active .dm-call-panel{grid-row:3!important}
.dm-conversation-area.call-is-active #dmMessages{grid-row:3!important}
.dm-conversation-area.call-is-active #callStatus{grid-row:4!important;grid-column:1!important}
.dm-conversation-area.call-is-active #dmTypingIndicator{grid-row:4!important;grid-column:2!important}
.dm-conversation-area.call-is-active .dm-composer{grid-row:5!important}
@media(max-width:850px){.dm-conversation-area.call-is-active{grid-template-rows:auto auto minmax(150px,28vh) minmax(180px,1fr) auto auto!important}.dm-conversation-area.call-is-active .dm-call-panel{grid-row:3!important}.dm-conversation-area.call-is-active #dmMessages{grid-row:4!important}.dm-conversation-area.call-is-active #callStatus{grid-row:5!important}.dm-conversation-area.call-is-active #dmTypingIndicator{grid-row:5!important}.dm-conversation-area.call-is-active .dm-composer{grid-row:6!important}}

.circle-call-popout{font-size:12px!important;min-width:max-content!important;border:1px solid rgba(198,161,91,.35)!important;background:rgba(198,161,91,.06)!important}
body:has([data-conversation]) .circle-incoming-call{z-index:99990}
body:has(.dm-conversation-area.call-is-active) .dm-call-toolbar{position:relative;z-index:2}

/* Circle 4.5.13 - independent call workspace on DM page */
.dm-private-call #micButton,.dm-private-call #videoButton,.dm-private-call #screenButton{display:none}
.dm-conversation-area.call-is-active .dm-private-call #micButton,.dm-conversation-area.call-is-active .dm-private-call #videoButton,.dm-conversation-area.call-is-active .dm-private-call #screenButton{display:inline-flex}
.dm-conversation-area.call-is-active{display:flex!important;flex-direction:column;min-height:0}
.dm-conversation-area.call-is-active .dm-chat-header{display:none!important}
.dm-conversation-area.call-is-active>.dm-call-panel,.dm-conversation-area.call-is-active>#dmMessages,.dm-conversation-area.call-is-active>.dm-composer,.dm-conversation-area.call-is-active>#dmTypingIndicator,.dm-conversation-area.call-is-active>#callStatus{display:none!important}
.circle-call-workspace{min-width:0;min-height:0;display:flex;flex:1 1 auto;flex-direction:column;background:#16181d;overflow:hidden}
.circle-call-workspace-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:12px;border-bottom:1px solid #bb914a55;background:#1d1f24}
.circle-call-workspace-toolbar .dm-private-call{display:flex!important;gap:8px;flex-wrap:wrap}
.circle-call-workspace-toolbar .dm-private-call button{display:inline-flex!important;min-height:40px;white-space:nowrap;max-width:none!important}
.circle-call-workspace-columns{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,1fr);flex:1 1 auto;min-height:0;overflow:hidden}
.circle-call-chat-frame{width:100%;height:100%;border:0;background:#191b1f;min-height:0}
.circle-call-workspace-columns>.dm-call-panel{grid-column:2!important;grid-row:1!important;display:flex!important;position:relative!important;min-height:0;flex-direction:column;overflow:auto;border:0;border-left:1px solid #bb914a44}
.circle-call-workspace-columns .dm-call-visual{min-height:0;display:flex;flex-direction:column}
.circle-call-workspace-columns .call-participants{margin:8px;padding:8px}
.circle-device-choices{display:flex;gap:8px;padding:0!important;margin:0!important;flex-wrap:wrap}
.circle-device-picker{position:relative;min-width:135px}
.circle-device-picker-toggle{min-height:40px;box-sizing:border-box;list-style:none;display:flex;align-items:center;justify-content:center;white-space:nowrap;padding:9px 12px;border:1px solid #ad874e;border-radius:10px;background:#26262a;color:#efcf91;cursor:pointer;font-size:12px;font-weight:600}
.circle-device-picker-toggle::-webkit-details-marker{display:none}
.circle-device-picker[open] .circle-device-picker-toggle{box-shadow:0 0 0 1px #d7ac5b66}
.circle-device-picker-menu{position:absolute;top:calc(100% + 5px);left:0;z-index:110;min-width:220px;max-width:min(350px,90vw);max-height:240px;overflow:auto;padding:6px;border:1px solid #987747;border-radius:12px;background:#24252a;box-shadow:0 15px 36px #000b}
.circle-device-option{width:100%;display:block;text-align:left;border:0;border-radius:7px;padding:10px 12px;background:transparent;color:#eee;white-space:normal;overflow-wrap:anywhere;cursor:pointer}
.circle-device-option:hover,.circle-device-option[aria-pressed=true]{background:#b48c4533;color:#f4d18d}
.call-participant-avatar{display:block;flex-shrink:0;width:44px;height:44px;overflow:hidden!important;align-self:center;border-radius:50%;background:#302921}
.call-participant-avatar img{display:block;width:100%;height:100%;object-fit:cover;max-height:100%;max-width:100%}
.call-participant-avatar .call-avatar-video{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.call-participant.is-speaking .call-participant-avatar{box-shadow:0 0 0 2px #d6ac5b,0 0 15px #d6ac5b88!important}
.circle-screen-tile{display:flex;flex-direction:column;min-width:0;gap:5px;text-align:left;background:#151619;border:1px solid #ad874e55;color:#eac991;border-radius:11px;padding:7px;cursor:pointer}
.circle-screen-tile video{width:100%;max-height:220px;object-fit:contain;border-radius:7px;background:#050506}
.circle-screen-tile span{font-size:12px;padding:2px 4px}
.circle-call-media-modal{width:min(1100px,94vw);max-width:none;max-height:94vh;background:#17191d;border:1px solid #b68d4a;border-radius:14px;color:#f1e9da;padding:12px;box-shadow:0 25px 80px #000c}
.circle-call-media-modal::backdrop{background:#000c}
.circle-media-modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.circle-media-modal-head>div{display:flex;gap:8px}
.circle-media-modal-head button{border:1px solid #9b7a48;border-radius:8px;background:#24262a;color:#f1d19e;padding:9px}
.circle-media-modal-content{display:grid;place-items:center;min-height:100px}
.circle-media-modal-content video{max-width:100%;max-height:78vh;object-fit:contain}
/* Embedded DM is a normal same-origin page in a call iframe, with only the active chat visible */
body.circle-chat-embedded .sidebar,body.circle-chat-embedded .site-header,body.circle-chat-embedded .topbar,body.circle-chat-embedded .dm-sidebar,body.circle-chat-embedded .mobile-bottom-nav{display:none!important}
body.circle-chat-embedded .dm-workspace,body.circle-chat-embedded .messenger-workspace{width:100%!important;max-width:none!important;height:100dvh!important;min-height:0!important;display:block!important;margin:0!important;padding:0!important}
body.circle-chat-embedded .dm-conversation-area{height:100dvh!important;min-height:0!important;width:100%!important}
body.circle-chat-embedded .dm-private-call{display:none!important}
body.circle-chat-embedded .circle-main,body.circle-chat-embedded main{margin:0!important;padding:0!important;max-width:none!important;width:100%!important}
@media(max-width:870px){.circle-call-workspace-columns{grid-template-columns:1fr;grid-template-rows:minmax(180px,1fr) minmax(170px,42%)}.circle-call-chat-frame{grid-column:1;grid-row:1}.circle-call-workspace-columns>.dm-call-panel{grid-column:1!important;grid-row:2!important;border-left:0;border-top:1px solid #a5854c55}}

/* Embedded chat occupies its full same-origin frame without the site chrome. */
body.circle-chat-embedded>.topbar,body.circle-chat-embedded .layout>.community-rail,body.circle-chat-embedded .layout>.sidebar{display:none!important}
body.circle-chat-embedded .layout{display:block!important;grid-template-columns:1fr!important;height:100dvh!important;width:100%!important;min-height:0!important}
body.circle-chat-embedded .layout>.circle-main{display:block!important;grid-column:1!important;width:100%!important;height:100dvh!important;overflow:hidden!important}
body.circle-chat-embedded .dm-conversation-area{border-radius:0!important}
body.circle-chat-embedded .dm-welcome{min-height:100%!important}
.circle-call-workspace-toolbar #callStatus{flex:1 1 100%;min-width:0;font-size:12px;color:#d6b983}

/* 4.5.14: Never embed Circle in an iframe. The application explicitly forbids
   framing using X-Frame-Options and CSP frame-ancestors. Use its live DM DOM. */
.circle-call-chat-live{display:flex;flex-direction:column;min-width:0;min-height:0;width:100%;height:100%;overflow:hidden;background:#17191d;grid-column:1;grid-row:1}
.circle-call-chat-heading{display:flex;align-items:center;min-height:45px;padding:10px 15px;flex:0 0 auto;border-bottom:1px solid rgba(198,161,91,.2);font-weight:600;color:#e8ce94;font-size:13px}
.circle-call-chat-live>#dmMessages{display:flex!important;flex-direction:column;flex:1 1 auto;min-height:0;overflow-y:auto;width:100%;margin:0!important;padding:14px!important;grid-row:auto!important;grid-column:auto!important}
.circle-call-chat-live>#dmTypingIndicator{display:block!important;flex:0 0 auto;min-height:0;grid-row:auto!important;grid-column:auto!important;padding:0 12px}
.circle-call-chat-live>.dm-composer{display:flex!important;flex:0 0 auto;grid-row:auto!important;grid-column:auto!important;width:100%;min-width:0}
.circle-call-chat-live>#dmUploadProgress,.circle-call-chat-live>.dm-send-feedback{display:block!important;flex:0 0 auto}
.circle-call-workspace-columns>.circle-call-chat-live{min-width:0}
@media(max-width:870px){.circle-call-chat-live{grid-row:1;grid-column:1}}


/* Circle 4.5.15 — balanced call layout */
.circle-call-workspace{display:flex;flex:1 1 auto;min-height:0;height:100%;background:#15181d;overflow:hidden}
.circle-call-workspace-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;flex:1 1 auto;min-height:0;overflow:hidden}
.circle-call-workspace-columns>.circle-call-chat-live{border-right:1px solid rgba(187,145,74,.28)}
.circle-call-workspace-columns>.dm-call-panel{grid-column:2!important;grid-row:1!important;display:grid!important;grid-template-rows:auto minmax(0,1fr)!important;min-width:0;min-height:0;overflow:hidden!important;border-left:0!important;background:#171a20}
.dm-call-panel-head{display:flex;align-items:flex-start;align-content:flex-start;flex-wrap:wrap;gap:10px;padding:12px;border-bottom:1px solid rgba(187,145,74,.28);background:#1c2026}
.dm-call-panel-head .dm-private-call,.dm-call-panel-head .circle-device-choices{display:flex!important;align-items:center;gap:8px;flex-wrap:wrap;max-width:100%}
.dm-call-panel-head .dm-private-call button,.dm-call-panel-head .circle-device-picker-toggle{min-height:42px!important;padding:10px 14px!important;font-size:12px!important;white-space:nowrap}
.dm-call-panel-head .dm-private-call #callButton{min-width:156px!important}
.dm-call-panel-head #callConnectionQuality{margin-left:auto;align-self:center;padding:10px 0;font-size:13px;color:#e8ca8b}
.dm-call-panel-head #callStatus{flex:1 1 100%;font-size:12px;color:#d5b774}
.circle-call-workspace-columns .dm-call-visual{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;height:100%;padding:0}
.circle-call-workspace-columns .video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;align-content:start;padding:14px;min-height:0}
.circle-call-workspace-columns .dm-call-visual.has-video .video-grid{flex:1 1 auto;overflow:auto}
.circle-call-workspace-columns .call-participants{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-auto-rows:minmax(120px,1fr);gap:12px;margin:0!important;padding:14px!important;border:0!important;background:transparent!important;flex:1 1 auto;align-content:stretch;overflow:auto}
.circle-call-workspace-columns .dm-call-visual.has-video .call-participants{flex:0 0 auto;grid-auto-rows:auto}
.circle-call-workspace-columns .call-participant{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;min-width:0;min-height:110px;padding:14px;border:1px solid rgba(226,193,124,.14);border-radius:14px;background:rgba(255,255,255,.018)}
.circle-call-workspace-columns .call-participant-avatar{width:58px;height:58px;flex-basis:58px}
.circle-call-workspace-columns .call-participant-info strong{font-size:14px}
.circle-call-workspace-columns .call-participant-info small{font-size:11px}
.circle-call-workspace-columns .call-volume-control{display:flex;align-items:center;gap:8px;justify-self:end}
.circle-call-workspace-columns .call-volume-control input{width:90px}
.circle-call-chat-live>#dmMessages{padding:16px 18px!important}
.circle-call-chat-live>.dm-composer{padding:12px!important;border-top:1px solid rgba(187,145,74,.18)}
@media(max-width:980px){
  .circle-call-workspace-columns{grid-template-columns:1fr!important;grid-template-rows:minmax(270px,1fr) minmax(300px,1fr)!important}
  .circle-call-workspace-columns>.circle-call-chat-live{grid-row:2;grid-column:1;border-right:0;border-top:1px solid rgba(187,145,74,.28)}
  .circle-call-workspace-columns>.dm-call-panel{grid-column:1!important;grid-row:1!important}
  .dm-call-panel-head #callConnectionQuality{margin-left:0}
}

/* Circle 4.5.16 — consistent Discord-style call grid and live conversation */
.dm-conversation-area.call-is-active{height:100%!important;min-height:0!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
.dm-conversation-area.call-is-active #circleCallWorkspace{width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important;flex:1 1 0!important;overflow:hidden!important}
#circleCallWorkspace .circle-call-workspace-columns{height:100%!important;min-height:0!important;max-height:100%!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important;align-items:stretch!important}
#circleCallWorkspace .circle-call-chat-live{display:flex!important;flex-direction:column!important;min-width:0!important;min-height:0!important;height:100%!important;max-height:100%!important;overflow:hidden!important}
#circleCallWorkspace .circle-call-chat-live>#dmMessages{flex:1 1 0!important;min-height:0!important;height:0!important;max-height:none!important;overflow-y:auto!important}
#circleCallWorkspace .circle-call-chat-live>.dm-composer{flex:0 0 auto!important;max-height:45%;overflow-y:auto!important}
#circleCallWorkspace .circle-call-chat-live>.dm-send-feedback,#circleCallWorkspace .circle-call-chat-live>#dmUploadProgress{max-height:18%;overflow-y:auto}
#circleCallWorkspace .dm-call-panel{height:100%!important;max-height:100%!important;min-height:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
#circleCallWorkspace .dm-call-panel-head{flex:0 0 auto!important;display:flex!important;align-items:center!important;gap:9px!important;padding:12px!important;min-width:0;position:relative;z-index:3}
#circleCallWorkspace .dm-call-panel-head .dm-private-call{display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:8px!important;min-width:0}
#circleCallWorkspace .dm-call-panel-head .dm-private-call button{width:auto!important;max-width:100%!important;min-width:max-content!important;overflow:visible!important;text-overflow:clip!important;font-size:12px!important;line-height:1.25!important;padding:10px 13px!important}
#circleCallWorkspace .dm-call-panel-head .circle-device-choices{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important}
#circleCallWorkspace .dm-call-panel-head .circle-device-picker{min-width:unset!important}
#circleCallWorkspace .dm-call-panel-head .circle-device-picker-toggle{min-width:126px!important;max-width:100%!important;min-height:42px!important}
#circleCallWorkspace .dm-call-panel-head #callConnectionQuality{margin-left:0!important;white-space:nowrap!important;padding:8px 4px!important}
#circleCallWorkspace .dm-call-visual{flex:1 1 0!important;min-height:0!important;height:100%!important;max-height:100%!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;padding:12px!important;gap:12px!important;background:#111317}
#circleCallWorkspace .dm-call-visual .video-grid:empty{display:none!important}
#circleCallWorkspace .dm-call-visual .video-grid{order:0;flex:0 0 auto;min-height:0;max-height:60%;padding:0!important;gap:10px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr))}
#circleCallWorkspace .dm-call-visual .video-grid:has(.circle-screen-tile){flex:1 1 62%;max-height:none;overflow:auto;grid-template-columns:minmax(0,1fr)}
#circleCallWorkspace .dm-call-visual .circle-screen-tile{display:flex;flex-direction:column;align-items:stretch;justify-content:center;min-width:0;min-height:220px;height:100%;padding:10px!important;gap:10px;background:#090a0c;border:1px solid rgba(198,161,91,.24);border-radius:14px;text-align:left;overflow:hidden}
#circleCallWorkspace .dm-call-visual .circle-screen-tile video{display:block;width:100%!important;height:100%!important;min-height:0;max-height:none!important;object-fit:contain!important;aspect-ratio:16/9;background:#050506;border:0;border-radius:9px}
#circleCallWorkspace .dm-call-visual .circle-screen-tile span{flex:0 0 auto;align-self:flex-start;padding:5px 8px}
#circleCallWorkspace .dm-call-visual .call-participants{order:1;flex:1 1 0!important;min-height:0!important;max-height:100%;width:100%;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))!important;grid-auto-rows:minmax(0,1fr)!important;align-content:stretch!important;align-items:stretch!important;justify-items:stretch!important;gap:12px!important;overflow:auto!important;padding:0!important;margin:0!important;border:0!important;background:none!important}
#circleCallWorkspace .dm-call-visual.has-screen .call-participants{flex:0 0 auto!important;max-height:32%!important;grid-auto-rows:minmax(105px,auto)!important}
#circleCallWorkspace .dm-call-visual .call-participant{display:flex!important;flex-direction:column!important;gap:10px;align-items:center!important;justify-content:center!important;text-align:center;min-height:0!important;height:100%!important;padding:16px!important;overflow:hidden;border-radius:16px;background:#1b1d23!important;box-sizing:border-box}
#circleCallWorkspace .dm-call-visual .call-participant-avatar{width:clamp(60px,8vw,96px)!important;height:clamp(60px,8vw,96px)!important;flex:0 0 auto!important}
#circleCallWorkspace .dm-call-visual .call-participant-info{display:flex;flex-direction:column;align-items:center;gap:4px}
#circleCallWorkspace .dm-call-visual .call-participant-info strong{font-size:14px}
#circleCallWorkspace .dm-call-visual .call-volume-control{justify-self:center!important;display:flex;align-items:center;gap:8px}
#circleCallWorkspace .dm-call-visual .call-participant.is-speaking{border-color:rgba(226,193,124,.16)!important;box-shadow:none!important;transform:none!important}
@media(max-width:980px){
 #circleCallWorkspace .circle-call-workspace-columns{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(220px,45%) minmax(0,55%)!important}
 #circleCallWorkspace .dm-call-panel{grid-column:1!important;grid-row:1!important}
 #circleCallWorkspace .circle-call-chat-live{grid-column:1!important;grid-row:2!important}
 #circleCallWorkspace .dm-call-visual .call-participants{grid-auto-rows:minmax(110px,1fr)!important}
}
@media(max-width:560px){
 #circleCallWorkspace .dm-call-panel-head .dm-private-call button{font-size:11px!important;padding:8px 10px!important}
 #circleCallWorkspace .dm-call-visual .call-participants{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))!important}
 #circleCallWorkspace .dm-call-visual .call-participant-avatar{width:54px!important;height:54px!important}
}


/* Circle 4.5.17: unify split-call layout, eliminate legacy grid/flex collision.
   These selectors intentionally win over old multi-release component overrides. */
#circleCallWorkspace, #circleCallWorkspace * {box-sizing:border-box}
.dm-conversation-area.call-is-active {min-width:0!important;width:100%!important;overflow:hidden!important;}
#circleCallWorkspace {width:100%!important;min-width:0!important;min-height:0!important;flex:1 1 0%!important;overflow:hidden!important;}
#circleCallWorkspace>.circle-call-workspace-columns {
 display:grid!important;min-width:0!important;min-height:0!important;height:100%!important;width:100%!important;
 grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important;
 gap:0!important;overflow:hidden!important;
}
#circleCallWorkspace #circleCallChat {
 display:grid!important;grid-template-rows:auto minmax(0,1fr) auto auto auto auto!important;
 min-width:0!important;min-height:0!important;max-width:100%!important;height:100%!important;
 grid-column:1!important;grid-row:1!important;overflow:hidden!important;
}
#circleCallWorkspace #circleCallChat>.circle-call-chat-heading {grid-row:1!important;min-width:0}
#circleCallWorkspace #circleCallChat>#dmMessages {
 display:flex!important;flex-direction:column!important;
 grid-row:2!important;min-width:0!important;min-height:0!important;height:auto!important;
 max-width:100%!important;width:100%!important;overflow-y:auto!important;overflow-x:hidden!important;
}
#circleCallWorkspace #circleCallChat>#dmTypingIndicator {grid-row:3!important;min-width:0!important}
#circleCallWorkspace #circleCallChat>.dm-composer {
 display:grid!important;grid-template-columns:44px minmax(0,1fr) 108px!important;
 grid-template-rows:auto auto!important;grid-row:4!important;grid-column:1!important;
 gap:9px!important;align-items:stretch!important;flex:none!important;
 min-width:0!important;max-width:100%!important;width:100%!important;
 margin:0!important;padding:12px!important;overflow:visible!important;
 max-height:none!important;
}
#circleCallWorkspace #circleCallChat>.dm-composer>.dm-attach-button {
 grid-column:1!important;grid-row:1!important;width:44px!important;min-width:44px!important;align-self:center!important;
}
#circleCallWorkspace #circleCallChat>.dm-composer>#dmComposer {
 display:block!important;grid-column:2!important;grid-row:1!important;
 width:100%!important;min-width:0!important;max-width:100%!important;
 height:auto;min-height:116px!important;max-height:220px!important;
 resize:vertical!important;overflow-y:auto!important;padding:12px!important;
}
#circleCallWorkspace #circleCallChat>.dm-composer>.dm-send-stack {
 grid-column:3!important;grid-row:1!important;min-width:0!important;max-width:100%!important;width:100%!important;
 display:flex!important;flex-direction:column!important;align-self:stretch!important;justify-content:space-between!important;
}
#circleCallWorkspace #circleCallChat>.dm-composer>.dm-send-stack>.dm-send-button{width:100%!important;min-width:0!important;max-width:100%!important;padding:8px!important;white-space:nowrap!important}
#circleCallWorkspace #circleCallChat>.dm-composer>#dmVoiceRecordStatus{grid-column:1/-1!important;grid-row:2!important;min-width:0!important}
#circleCallWorkspace #circleCallChat>#dmUploadProgress,
#circleCallWorkspace #circleCallChat>.dm-send-feedback{grid-row:6!important;min-width:0!important;max-width:100%!important;overflow-x:hidden!important}
/* The call half is a true two-row region: fixed controls above, media beneath. */
#circleCallWorkspace .circle-call-workspace-columns>#dmCallPanel {
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;
 grid-template-rows:max-content minmax(0,1fr)!important;grid-column:2!important;grid-row:1!important;
 width:100%!important;min-width:0!important;max-width:100%!important;
 height:100%!important;min-height:0!important;overflow:hidden!important;
}
#circleCallWorkspace #dmCallPanelHead{
 display:flex!important;flex-wrap:wrap!important;order:0!important;grid-column:1!important;grid-row:1!important;
 position:relative!important;z-index:3;min-width:0!important;
 width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;
 padding:12px!important;margin:0!important;gap:8px!important;align-content:start!important;align-items:center!important;
 border-bottom:1px solid rgba(198,161,91,.27)!important;overflow:visible!important;
}
#circleCallWorkspace #dmCallPanelHead>.dm-private-call {display:flex!important;flex-wrap:wrap!important;gap:7px!important;min-width:0!important;max-width:100%!important}
#circleCallWorkspace #dmCallPanelHead .dm-private-call button,
#circleCallWorkspace #dmCallPanelHead .circle-device-picker-toggle{
 min-width:0!important;max-width:100%!important;min-height:38px!important;padding:8px 11px!important;
 font-size:11px!important;line-height:1.3!important;overflow:visible!important;white-space:nowrap!important;
}
#circleCallWorkspace #dmCallPanelHead #callButton{min-width:124px!important}
#circleCallWorkspace #dmCallPanelHead .circle-device-picker{min-width:0!important}
#circleCallWorkspace #dmCallPanelHead .circle-device-choices{display:flex!important;min-width:0!important;gap:7px!important;flex-wrap:wrap!important}
#circleCallWorkspace #dmCallPanelHead #callConnectionQuality{margin-left:0!important;align-self:center!important;padding:5px!important;white-space:nowrap!important}
#circleCallWorkspace #dmCallPanelHead #callStatus:empty{display:none!important}
#circleCallWorkspace #dmCallPanel>.dm-call-visual{
 display:flex!important;flex-direction:column!important;order:1!important;grid-column:1!important;grid-row:2!important;
 min-width:0!important;min-height:0!important;height:100%!important;max-height:100%!important;
 margin:0!important;padding:12px!important;overflow:auto!important;
}
#circleCallWorkspace .dm-call-visual .call-participants{min-width:0!important}
#circleCallWorkspace .dm-call-visual .video-grid{min-width:0!important;max-width:100%!important}
#circleCallWorkspace #dmCallPanel .call-participant{min-width:0!important}
@media(max-width:980px){
 #circleCallWorkspace>.circle-call-workspace-columns{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(220px,44%) minmax(220px,56%)!important}
 #circleCallWorkspace .circle-call-workspace-columns>#dmCallPanel{grid-column:1!important;grid-row:1!important}
 #circleCallWorkspace #circleCallChat{grid-column:1!important;grid-row:2!important}
}
@media(max-width:540px){
 #circleCallWorkspace #circleCallChat>.dm-composer{grid-template-columns:40px minmax(0,1fr) 88px!important;gap:6px!important;padding:8px!important}
 #circleCallWorkspace #circleCallChat>.dm-composer>.dm-attach-button{width:40px!important;min-width:40px!important}
 #circleCallWorkspace #dmCallPanelHead{padding:8px!important;gap:5px!important}
 #circleCallWorkspace #dmCallPanelHead .dm-private-call button,
 #circleCallWorkspace #dmCallPanelHead .circle-device-picker-toggle{padding:7px 8px!important;font-size:10px!important}
}

/* Circle 4.5.18: only the entry point remains inside Messenger. */
.circle-open-call{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 17px;border:1px solid rgba(218,177,102,.55);border-radius:11px;background:rgba(210,168,93,.08);color:#f2d49b;text-decoration:none;font-size:13px;font-weight:700;white-space:nowrap}.circle-open-call:hover{background:rgba(210,168,93,.16);border-color:#e2b866}

/* Circle 4.5.23: private conversation polish */
.dm-messages .dm-message-card{position:relative!important;box-sizing:border-box!important;max-width:min(75%,740px)!important;min-width:0!important;width:fit-content!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;display:flex!important;flex-direction:column!important;gap:5px!important;align-self:flex-start!important}
.dm-messages .dm-message-card.dm-own{align-self:flex-end!important;margin-right:clamp(28px,6vw,120px)!important}
.dm-messages .dm-message-card.dm-other{margin-left:clamp(4px,1vw,18px)!important}
.dm-messages .dm-message-card .message-header{display:flex!important;align-items:center;gap:9px;min-width:0!important;margin-bottom:2px}
.dm-messages .dm-message-card.dm-own .message-header{justify-content:flex-start!important;flex-direction:row-reverse!important}
.dm-messages .dm-message-card .message-body{display:block!important;align-self:flex-start!important;width:fit-content!important;min-width:0!important;max-width:100%!important;padding:10px 14px!important;background:#222326!important;border:1px solid rgba(198,161,91,.2)!important;border-radius:13px!important;box-shadow:none!important;overflow-wrap:anywhere!important}
.dm-messages .dm-message-card.dm-own .message-body{align-self:flex-end!important;background:rgba(198,161,91,.09)!important;border-color:rgba(198,161,91,.33)!important}
.dm-messages .dm-message-card .message-body:empty{display:none!important}
.dm-messages .dm-message-card .message-attachments{max-width:100%!important}
.dm-messages .dm-message-card .message-meta-footer{display:flex!important;align-self:flex-start!important;justify-content:flex-start!important;margin:0!important;padding:0 3px!important;font-size:11px!important}
.dm-messages .dm-message-card.dm-own .message-meta-footer{align-self:flex-end!important;justify-content:flex-end!important}
.dm-messages .dm-message-card .dm-message-actions{position:absolute;top:42px;left:calc(100% + 6px);display:flex;align-items:center;gap:4px;z-index:2}
.dm-messages .dm-message-card.dm-own .dm-message-actions{left:auto;right:calc(100% + 6px)}
.dm-messages .dm-message-actions button{display:inline-grid;place-items:center;width:30px;height:30px;min-width:30px;padding:0!important;background:#191b20;border:1px solid #54442a;border-radius:9px;color:#e5bd74;cursor:pointer;font-size:18px;line-height:1}
.dm-messages .dm-message-actions .dm-message-secondary-action{opacity:0;visibility:hidden}
.dm-messages .dm-message-card:hover .dm-message-secondary-action,.dm-messages .dm-message-card:focus-within .dm-message-secondary-action{opacity:1;visibility:visible}
.dm-messages .dm-reply-link{display:flex!important;flex-direction:column;align-self:flex-start;max-width:100%;padding:8px 11px;background:rgba(198,161,91,.065);border:0;border-left:3px solid #bf9656;border-radius:6px;color:#d4c6ab;text-align:left;cursor:pointer;overflow-wrap:anywhere}
.dm-messages .dm-own .dm-reply-link{align-self:flex-end}
.dm-reply-link strong{font-size:12px;color:#e2be78}.dm-reply-link span{font-size:12px;line-height:1.4;color:#c4bdaf}
.dm-jump-highlight .message-body{outline:2px solid #e0b86d!important;outline-offset:3px}
.dm-messages .message-profile-link,.dm-peer-profile-link{color:inherit;text-decoration:none;display:inline-flex;align-items:center}
.dm-messages .message-profile-link:hover,.dm-peer-profile-link:hover{color:#e2bd77}
#dmTypingIndicator:not(:empty){font-size:15px!important;font-weight:600!important;color:#deb977!important;line-height:1.5!important;letter-spacing:.01em;padding:9px 14px!important}
@media(max-width:680px){.dm-messages .dm-message-card{max-width:calc(100% - 36px)!important}.dm-messages .dm-message-card.dm-own{margin-right:14px!important}.dm-messages .dm-message-card .dm-message-actions{left:calc(100% + 3px)}.dm-messages .dm-message-card.dm-own .dm-message-actions{right:calc(100% + 3px);left:auto}.dm-messages .dm-message-actions button{width:26px;height:26px;min-width:26px}}

/* Circle 4.5.24: DM avatar, nickname, bubble, and small reply arrow travel together. */
.dm-messages .dm-message-card{
 display:flex!important;
 flex-direction:column!important;
 align-items:stretch!important;
 width:max-content!important;
 max-width:min(82%,850px)!important;
 min-width:0!important;
 gap:4px!important;
}
.dm-messages .dm-message-card .message-header{
 display:flex!important;
 flex-direction:row!important;
 justify-content:flex-start!important;
 align-items:center!important;
 width:auto!important;
 min-width:0!important;
 margin:0 36px 0 45px!important;
 padding:0!important;
 text-align:left!important;
}
.dm-messages .dm-message-card.dm-own .message-header{
 flex-direction:row!important;
 justify-content:flex-start!important;
 text-align:left!important;
}
.dm-messages .dm-message-card .dm-message-line{
 display:flex!important;
 flex-direction:row!important;
 align-items:flex-start!important;
 gap:8px!important;
 width:max-content!important;
 max-width:100%!important;
 min-width:0!important;
}
.dm-messages .dm-message-card .dm-message-line>.message-avatar-link{
 display:block!important;
 flex:0 0 38px!important;
 width:38px!important;
 height:38px!important;
 margin:0!important;
}
.dm-messages .dm-message-card .dm-message-payload{
 display:flex!important;
 flex-direction:column!important;
 align-items:flex-start!important;
 gap:5px!important;
 flex:0 1 auto!important;
 min-width:0!important;
 max-width:calc(100% - 84px)!important;
}
.dm-messages .dm-message-card .dm-message-payload>.message-body,
.dm-messages .dm-message-card .dm-message-payload>.message-attachments,
.dm-messages .dm-message-card .dm-message-payload>.message-reply-context,
.dm-messages .dm-message-card .dm-message-payload>.dm-reply-link{
 align-self:flex-start!important;
 max-width:100%!important;
 min-width:0!important;
}
.dm-messages .dm-message-card .dm-message-payload>.message-meta-footer{
 align-self:flex-start!important;
 justify-content:flex-start!important;
 margin:0!important;
 padding:1px 2px!important;
}
.dm-messages .dm-message-card .dm-message-line>.dm-message-actions{
 position:static!important;
 inset:auto!important;
 display:flex!important;
 flex:0 0 26px!important;
 flex-direction:column!important;
 align-items:center!important;
 gap:4px!important;
 margin:3px 0 0!important;
 padding:0!important;
 z-index:2;
}
.dm-messages .dm-message-card .dm-message-actions button{
 width:25px!important;
 height:25px!important;
 min-width:25px!important;
 min-height:25px!important;
 padding:0!important;
 border-radius:7px!important;
 font-size:14px!important;
 line-height:1!important;
}
.dm-messages .dm-message-card.dm-own .dm-message-payload>.message-body,
.dm-messages .dm-message-card.dm-own .dm-message-payload>.message-meta-footer,
.dm-messages .dm-message-card.dm-own .dm-message-payload>.message-attachments{
 align-self:flex-start!important;
}
@media(max-width:680px){
 .dm-messages .dm-message-card{max-width:calc(100% - 12px)!important}
 .dm-messages .dm-message-card .message-header{margin-left:36px!important}
 .dm-messages .dm-message-card .dm-message-line{gap:5px!important}
 .dm-messages .dm-message-card .dm-message-line>.message-avatar-link{width:31px!important;height:31px!important;flex-basis:31px!important}
 .dm-messages .dm-message-card .dm-message-payload{max-width:calc(100% - 65px)!important}
 .dm-messages .dm-message-card .dm-message-actions button{width:23px!important;height:23px!important;min-width:23px!important;min-height:23px!important;font-size:13px!important}
}

/* Circle 4.5.25: align sender name with message body; avatar sits slightly lower. */
.dm-messages .dm-message-card .dm-message-line > .message-avatar-link{
  margin-top:12px!important;
  align-self:flex-start!important;
}
.dm-messages .dm-message-card .message-header,
.dm-messages .dm-message-card.dm-own .message-header{
  margin-left:58px!important;
}
@media(max-width:680px){
  .dm-messages .dm-message-card .dm-message-line > .message-avatar-link{
    margin-top:9px!important;
  }
  .dm-messages .dm-message-card .message-header,
  .dm-messages .dm-message-card.dm-own .message-header{
    margin-left:45px!important;
  }
}

/* Circle 4.5.26 — Voice channels and friend-aware presence */
.circle-voice-room-list{display:flex;flex-direction:column;gap:9px;overflow:visible}
.circle-voice-room{position:relative;min-width:0;padding:12px;background:#1d1e22;border:1px solid rgba(198,161,91,.19);border-radius:12px}
.circle-voice-room-heading{display:flex;align-items:center;gap:9px;min-width:0;color:#f0d39b}
.circle-voice-room-heading strong{flex:1;min-width:0;overflow-wrap:anywhere;font-size:13px}
.circle-voice-room-symbol{color:#c6a15b}.circle-voice-room-lock{font-size:13px}
.circle-voice-room-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:11px}
.circle-voice-members{display:flex;align-items:center;gap:6px;min-width:0;position:relative;cursor:default;outline-offset:3px}
.circle-voice-avatars{display:flex;align-items:center;gap:0}
.circle-voice-avatars img,.circle-voice-avatar-fallback{display:grid;place-items:center;object-fit:cover;width:28px;height:28px;border-radius:50%;border:2px solid #1d1e22;margin-left:-5px;background:#3b3224;color:#e9ce98;font-size:12px}
.circle-voice-avatars img:first-child,.circle-voice-avatar-fallback:first-child{margin-left:0}
.circle-voice-empty{font-size:11px;color:#a5a6ac}
.circle-voice-remaining{font-size:13px;font-weight:700;color:#e7c788;font-variant-numeric:tabular-nums}
.circle-voice-open{padding:7px 11px;border:1px solid #9c793c;border-radius:8px;color:#f1d69f;text-decoration:none;font-size:12px;white-space:nowrap}
.circle-voice-open:hover{background:rgba(198,161,91,.12)}
.circle-voice-friend-popover{display:none;position:absolute;z-index:100;top:calc(100% + 8px);left:0;min-width:200px;max-width:300px;padding:12px;border:1px solid #8c754b;border-radius:10px;background:#24262b;box-shadow:0 12px 30px #000a;color:#e9e7e1;font-size:12px;line-height:1.5}
.circle-voice-members:hover .circle-voice-friend-popover,.circle-voice-members:focus .circle-voice-friend-popover,.circle-voice-members:focus-within .circle-voice-friend-popover{display:flex;flex-direction:column;gap:5px}
.circle-voice-friend-popover strong{color:#e6c887}.circle-voice-friend-popover a{color:#f0d49b;text-decoration:none}
.circle-voice-lock-form{margin-top:8px}.circle-voice-lock-form button{background:none;border:0;padding:0;color:#aaa;font-size:11px;cursor:pointer}

/* Circle 4.5.27 — voice channel moderation actions */
.circle-voice-admin-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px}
.circle-voice-admin-actions form{display:inline-flex;margin:0;max-width:100%}
.circle-voice-delete-button{min-height:32px;padding:7px 11px;border:1px solid rgba(215,110,110,.42);border-radius:9px;background:rgba(172,68,68,.08);color:#e7b4b4;font:inherit;font-size:12px;cursor:pointer}
.circle-voice-delete-button:hover,.circle-voice-delete-button:focus-visible{border-color:#e2a3a3;background:rgba(172,68,68,.18);outline-offset:2px}
.circle-voice-deleted-notice{margin:10px 0;padding:9px 12px;border:1px solid rgba(198,161,91,.3);border-radius:10px;background:rgba(198,161,91,.06);color:#f0d28e;font-size:13px}

/* Circle 4.5.28: a reply action hugs the real content (including media). */
.dm-messages .dm-message-card .dm-message-line{gap:5px!important;width:fit-content!important;max-width:100%!important}
.dm-messages .dm-message-card .dm-message-payload{width:fit-content!important;max-width:calc(100% - 75px)!important;flex:0 1 auto!important;gap:3px!important}
.dm-messages .dm-message-card .dm-message-payload>.message-attachments{width:fit-content!important;max-width:100%!important;align-self:flex-start!important}
.dm-messages .dm-message-card .dm-message-payload>.message-attachments img{max-width:100%!important}
.dm-messages .dm-message-card .dm-message-line>.dm-message-actions{margin:3px 0 0!important;gap:3px!important;flex:0 0 24px!important}
.dm-messages .dm-message-card .dm-message-actions .dm-reply-action{width:23px!important;height:23px!important;min-width:23px!important;min-height:23px!important;font-size:13px!important}
.dm-messages .dm-jump-highlight .message-body,.dm-messages .dm-jump-highlight .message-attachments,.dm-messages .dm-jump-highlight .dm-reply-link{box-shadow:0 0 0 2px rgba(238,189,91,.85),0 0 22px rgba(218,168,75,.22)!important;background-color:rgba(198,161,91,.16)!important;transition:box-shadow .9s ease,background-color .9s ease}
.dm-messages .dm-jump-highlight.dm-jump-fading .message-body,.dm-messages .dm-jump-highlight.dm-jump-fading .message-attachments,.dm-messages .dm-jump-highlight.dm-jump-fading .dm-reply-link{box-shadow:0 0 0 0 transparent!important;background-color:transparent!important}
.dm-messages .dm-jump-highlight .message-body{outline:none!important}
.reply-notice{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;margin:8px 0;background:rgba(198,161,91,.08);border-left:2px solid var(--gold);border-radius:8px;color:#e3c88f;font-size:13px}
.reply-notice-label{min-width:0;overflow-wrap:anywhere}
.reply-notice-cancel{flex:0 0 auto}
.reply-notice:empty{display:none!important}
.circle-message-editor{box-sizing:border-box;width:min(530px,calc(100vw - 28px));max-width:none;border:1px solid rgba(198,161,91,.55);border-radius:15px;background:#1b1d22;color:#eee;padding:24px;box-shadow:0 25px 85px #000b}
.circle-message-editor::backdrop{background:rgba(0,0,0,.77);backdrop-filter:blur(3px)}
.circle-message-editor h3{margin:0 0 16px;color:#e5c17d;font-size:19px}
.circle-message-editor-form{display:flex;flex-direction:column;gap:12px}
.circle-message-editor-form textarea{box-sizing:border-box;width:100%;min-height:145px;max-height:55dvh;padding:12px;resize:vertical;font:inherit;color:#f2eee5;background:#131519;border:1px solid #4c4335;border-radius:10px;line-height:1.5}
.circle-message-editor-form textarea:focus{outline:2px solid rgba(198,161,91,.5);outline-offset:2px}
.circle-editor-feedback{min-height:1em;color:#efb7a7;font-size:12px;margin:0}
.circle-editor-buttons{display:flex;justify-content:flex-end;gap:9px}
.circle-editor-buttons button{min-height:39px;padding:8px 15px}
@media(max-width:680px){.dm-messages .dm-message-card .dm-message-payload{max-width:calc(100% - 62px)!important}.dm-messages .dm-message-card .dm-message-line>.dm-message-actions{flex-basis:23px!important}}

/* Circle 4.5.29 — compact trash action beside the join button */
.circle-voice-room-controls{display:inline-flex;align-items:center;justify-content:flex-end;gap:6px;flex:0 0 auto;max-width:100%}
.circle-voice-room-controls .circle-voice-delete-form{display:inline-flex!important;align-items:center;margin:0!important}
.circle-voice-room-controls .circle-voice-delete-button{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;
 padding:0!important;border:1px solid rgba(198,161,91,.25)!important;
 border-radius:8px!important;color:#c4c3c0!important;background:rgba(255,255,255,.025)!important;
 cursor:pointer;
}
.circle-voice-room-controls .circle-voice-delete-button:hover,
.circle-voice-room-controls .circle-voice-delete-button:focus-visible{
 border-color:#cf8080!important;background:rgba(160,55,55,.14)!important;color:#f0b5b5!important;
}
.circle-voice-room-controls .circle-voice-delete-button svg{display:block;width:16px;height:16px}
.circle-voice-room-bottom{gap:8px;min-width:0}
.circle-voice-room-bottom>.circle-voice-members{min-width:0}
.circle-voice-admin-actions{margin-top:5px}
@media(max-width:480px){
 .circle-voice-room-controls{gap:4px}
 .circle-voice-open{padding:7px 8px}
}

/* Circle 4.5.30: typing state occupies its own row above the composer.
   Older layout overrides allowed the text to overlap the composer border. */
.dm-conversation-area>#dmTypingIndicator,
#circleCallWorkspace #circleCallChat>#dmTypingIndicator{
  box-sizing:border-box!important;
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  flex:0 0 auto!important;
  flex-shrink:0!important;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  border:0!important;
  overflow-wrap:anywhere!important;
  background:#181a1e!important;
  line-height:1.5!important;
}
.dm-conversation-area>#dmTypingIndicator:empty,
#circleCallWorkspace #circleCallChat>#dmTypingIndicator:empty{
  display:none!important;
  padding:0!important;
}
.dm-conversation-area>#dmTypingIndicator:not(:empty),
#circleCallWorkspace #circleCallChat>#dmTypingIndicator:not(:empty){
  padding:9px 16px 11px!important;
  font-size:15px!important;
  font-weight:600!important;
  color:#deb977!important;
  margin-bottom:0!important;
}
.dm-conversation-area>#dmTypingIndicator + .dm-composer,
#circleCallWorkspace #circleCallChat>#dmTypingIndicator + .dm-composer{
  position:relative!important;
  z-index:0!important;
  flex-shrink:0!important;
  margin-top:0!important;
}

/* Circle 4.5.32 — message actions alongside author name; flyout toward chat center. */
.dm-messages .dm-message-card{overflow:visible!important}
.dm-messages .dm-message-card>.message-header{
  display:flex!important;
  flex-direction:row!important;
  justify-content:flex-start!important;
  align-items:center!important;
  gap:8px!important;
  overflow:visible!important;
  position:relative!important;
  width:max-content!important;
  max-width:calc(100% - 4px)!important;
}
.dm-messages .dm-message-card.dm-own>.message-header{flex-direction:row!important;justify-content:flex-start!important}
.dm-messages .dm-message-card>.message-header .message-author-meta{flex:0 1 auto;min-width:0}
.dm-messages .dm-message-card>.message-header>.dm-header-actions{
  position:relative!important;
  top:auto!important;right:auto!important;left:auto!important;
  margin:0!important;padding:0!important;
  display:inline-flex!important;flex-direction:row!important;align-items:center!important;
  gap:5px!important;flex:0 0 auto!important;visibility:visible!important;opacity:1!important;
}
.dm-messages .dm-message-card>.message-header>.dm-header-actions>button,
.dm-messages .dm-message-card>.message-header>.dm-header-actions>details>summary{
  box-sizing:border-box!important;
  display:grid!important;place-items:center!important;
  width:26px!important;height:26px!important;min-width:26px!important;min-height:26px!important;
  padding:0!important;margin:0!important;border-radius:8px!important;
  font-size:14px!important;line-height:1!important;
  background:#1c1e23!important;border:1px solid rgba(198,161,91,.35)!important;
  color:#e5bd74!important;cursor:pointer;
}
.dm-messages .dm-message-card>.message-header>.dm-header-actions>details{
  position:relative!important;flex:0 0 auto!important;overflow:visible!important;
}
.dm-messages .dm-message-card>.message-header>.dm-header-actions>details>summary{list-style:none!important;font-size:18px!important}
.dm-messages .dm-message-card>.message-header>.dm-header-actions>details>summary::-webkit-details-marker{display:none!important}
.dm-messages .dm-message-card .dm-message-action-popover{
  position:absolute!important;
  z-index:100!important;
  top:0!important;
  right:calc(100% + 8px)!important;
  left:auto!important;
  display:grid!important;
  gap:3px!important;
  width:max-content!important;
  min-width:158px!important;
  max-width:min(225px,calc(100vw - 32px))!important;
  padding:6px!important;
  border:1px solid rgba(198,161,91,.4)!important;
  border-radius:11px!important;
  background:#22242a!important;
  box-shadow:0 14px 36px #0009!important;
}
.dm-messages .dm-message-card .dm-message-action-menu:not([open]) .dm-message-action-popover{display:none!important}
.dm-messages .dm-message-card .dm-message-action-popover button{
  display:block!important;width:100%!important;height:auto!important;min-height:36px!important;
  padding:9px 12px!important;text-align:left!important;white-space:nowrap!important;
  border:0!important;border-radius:7px!important;background:transparent!important;
  font-size:12px!important;line-height:1.35!important;color:#f0e9df!important;
}
.dm-messages .dm-message-card .dm-message-action-popover button:hover{background:rgba(198,161,91,.14)!important;color:#f2d39b!important}
/* The sender's controls open toward the center (left from right-aligned messages). */
.dm-messages .dm-message-card.dm-other .dm-message-action-popover{right:auto!important;left:calc(100% + 8px)!important}
@media(max-width:680px){
 .dm-messages .dm-message-card>.message-header>.dm-header-actions>button,
 .dm-messages .dm-message-card>.message-header>.dm-header-actions>details>summary{
  width:26px!important;height:26px!important;min-width:26px!important;min-height:26px!important
 }
 .dm-messages .dm-message-card .dm-message-action-popover{right:calc(100% + 5px)!important}
}

/* Circle 4.5.34: prevent narrow vertical message bubbles.
   Prior versions combined shrink-to-fit, max-content, and percentages that
   depended on the same parent's intrinsic width. */
.dm-messages .dm-message-card{
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  width:fit-content!important;
  min-width:min(172px,100%)!important;
  max-width:min(80%,850px)!important;
  flex:0 0 auto!important;
}
.dm-messages .dm-message-card.dm-own{
  align-self:flex-end!important;
}
.dm-messages .dm-message-card.dm-other{
  align-self:flex-start!important;
}
.dm-messages .dm-message-card>.message-header{
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
.dm-messages .dm-message-card .dm-message-line{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:start!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
.dm-messages .dm-message-card .dm-message-line>.message-avatar-link{
  grid-column:1;
  width:38px!important;
  min-width:38px!important;
  height:38px!important;
}
.dm-messages .dm-message-card .dm-message-payload{
  grid-column:2;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  flex:initial!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.dm-messages .dm-message-card .dm-message-payload>.message-body{
  box-sizing:border-box!important;
  width:auto!important;
  min-width:min(105px,100%)!important;
  max-width:100%!important;
  align-self:flex-start!important;
  white-space:pre-wrap!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  line-height:1.5!important;
}
.dm-messages .dm-message-card .dm-message-payload>.message-attachments,
.dm-messages .dm-message-card .dm-message-payload>.message-reply-context,
.dm-messages .dm-message-card .dm-message-payload>.dm-reply-link{
  box-sizing:border-box!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
}
.dm-messages .dm-message-card .dm-message-payload>.message-meta-footer{
  align-self:flex-start!important;
  margin-top:2px!important;
}
.dm-messages .dm-message-card .dm-message-line>.dm-message-actions{
  display:none!important; /* Actions were moved to the username in 4.5.32. */
}
@media(max-width:680px){
  .dm-messages .dm-message-card{
    min-width:min(155px,100%)!important;
    max-width:calc(100% - 12px)!important;
  }
  .dm-messages .dm-message-card .dm-message-line{
    grid-template-columns:31px minmax(0,1fr)!important;
    gap:6px!important;
  }
  .dm-messages .dm-message-card .dm-message-line>.message-avatar-link{
    width:31px!important;
    min-width:31px!important;
    height:31px!important;
  }
  .dm-messages .dm-message-card .dm-message-payload>.message-body{
    min-width:min(96px,100%)!important;
  }
}

/* Circle 4.5.35 — consistent, contemporary vector icons. */
.circle-open-call{display:inline-flex;align-items:center;gap:9px;justify-content:center}
.circle-open-call .circle-call-icon{flex:0 0 18px;display:block;stroke:#e9c684}
.circle-open-call span{white-space:nowrap}
.dm-voice-record svg.circle-voice-record-icon,
.voice-record-controls button svg{display:block;margin:auto;width:21px;height:21px;pointer-events:none}
.dm-voice-record svg,.voice-record-controls svg{color:inherit}
.dm-message-action-popover button[hidden]{display:none!important}

/* Circle 4.5.36 — group call icon and strictly round avatar thumbnails. */
.group-call-icon,.active-group-call-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 34px;width:34px;height:34px;min-width:34px;min-height:34px;border-radius:10px;background:rgba(198,161,91,.10);color:var(--gold2)}
.circle-group-call-svg{display:block;flex:0 0 auto;width:20px;height:20px}
.group-call-member{min-width:0;align-items:center}
.group-call-member .friend-avatar,
.group-call-member .friend-avatar-xs{
  display:grid!important;place-items:center!important;
  box-sizing:border-box!important;
  width:30px!important;height:30px!important;
  min-width:30px!important;min-height:30px!important;
  max-width:30px!important;max-height:30px!important;
  flex:0 0 30px!important;aspect-ratio:1 / 1!important;
  border-radius:50%!important;overflow:hidden!important;
  padding:0!important;line-height:1!important;
}
.group-call-member .friend-avatar img,
.group-call-member .friend-avatar-xs img{
  display:block!important;width:100%!important;height:100%!important;
  min-width:100%!important;min-height:100%!important;
  max-width:100%!important;max-height:100%!important;
  aspect-ratio:1 / 1!important;
  object-fit:cover!important;object-position:center!important;
  border-radius:50%!important;
}
.group-call-member>span:nth-child(2){min-width:0}

/* Circle 4.5.37: vertically center each DM sender avatar against the content block.
   Keep the name above and the message footer attached to the content. */
.dm-messages .dm-message-card .dm-message-line{
  align-items:center!important;
}
.dm-messages .dm-message-card .dm-message-line > .message-avatar-link{
  align-self:center!important;
  margin-top:0!important;
  margin-bottom:0!important;
  transform:none!important;
}
@media(max-width:680px){
  .dm-messages .dm-message-card .dm-message-line > .message-avatar-link{
    align-self:center!important;
    margin-top:0!important;
  }
}

/* Circle 4.5.38: avatar positioned at the username line, not midway down a tall message.
   Leave the message payload, its spacing, and controls untouched. */
.dm-messages .dm-message-card{
  position:relative!important;
}
.dm-messages .dm-message-card .dm-message-line > .message-avatar-link{
  position:absolute!important;
  top:0!important;
  left:0!important;
  align-self:auto!important;
  margin:0!important;
  transform:none!important;
  z-index:1;
}

/* Circle 4.6.0 — profile avatar aligned with the name and status information. */
.profile-hero .profile-identity{
 grid-template-columns:100px minmax(0,1fr) auto;
 align-items:center;
}
.profile-hero .profile-identity>.profile-avatar-large{
 position:relative!important;
 grid-column:1;
 grid-row:1;
 left:auto!important;
 top:auto!important;
 margin:0!important;
 justify-self:center;
 align-self:center;
}
.profile-hero .profile-identity>.profile-name{
 grid-column:2;
 grid-row:1;
 align-self:center;
}
.profile-hero .profile-identity>.profile-stats{
 grid-column:3;
 grid-row:1;
 align-self:center;
 align-items:center;
}
.profile-hero .profile-message-quick{display:inline-flex!important;align-items:center;justify-content:center;margin:0}
.profile-hero .profile-message-icon{
 display:inline-flex;align-items:center;justify-content:center;
 width:42px;height:42px;min-width:42px;padding:0;
 background:rgba(198,161,91,.07);border:1px solid rgba(198,161,91,.45);
 border-radius:12px;color:#ebca84;cursor:pointer;
 transition:background .18s,border-color .18s;
}
.profile-hero .profile-message-icon:hover,.profile-hero .profile-message-icon:focus-visible{
 background:rgba(198,161,91,.16);border-color:#dbb56d;outline-offset:3px;
}
.profile-hero .profile-message-icon svg{width:21px;height:21px}
@media(max-width:680px){
 .profile-hero .profile-identity{grid-template-columns:78px minmax(0,1fr);grid-template-rows:auto auto}
 .profile-hero .profile-identity>.profile-stats{grid-column:2;grid-row:2;gap:14px;flex-wrap:wrap}
 .profile-hero .profile-identity>.profile-avatar-large{width:78px;height:78px}
 .profile-hero .profile-message-icon{width:38px;height:38px;min-width:38px}
}
@media(max-width:380px){
 .profile-hero .profile-identity{grid-template-columns:70px minmax(0,1fr)}
 .profile-hero .profile-identity>.profile-avatar-large{width:70px;height:70px}
}

/* Circle 4.6.1: shared golden profile theme, consistent feed width, icon actions. */
.profile-hero, .public-profile-hero,
.circle-main>.profile-hero, .circle-main>.public-profile-hero,
.circle-main>.public-profile-feed-heading,
.circle-main>.public-profile-actions,
.circle-main>.feed-post.circle-unified-post{
 width:min(100%,1040px)!important;
 max-width:1040px!important;
 margin-left:auto!important;
 margin-right:auto!important;
 box-sizing:border-box!important;
}
.profile-hero{--profile-accent:#C6A15B!important;border-color:rgba(198,161,91,.52)!important;}
.profile-hero .profile-cover{--profile-accent:#C6A15B!important;}
.profile-hero .profile-stats strong{color:#C6A15B!important;}
.profile-hero .profile-edit-icon{display:inline-flex;flex:0 0 42px;margin:0;text-decoration:none;}
@media(max-width:680px){
 .profile-hero .profile-edit-icon{flex-basis:38px;}
 .profile-hero .profile-stats{gap:12px;}
}


/* Circle 4.6.2: profile header cleanup, unified identity information column. */
.profile-hero .profile-cover{
  background-color:#17191e;
  background-image:linear-gradient(115deg,#17191e 5%,#25231f 55%,#15171b 100%);
}
/* The inline cover upload continues to override the default gradient. */
.profile-hero .profile-cover::before,
.profile-hero .profile-cover::after,
.profile-hero .profile-cover-orbit,
.profile-hero .profile-cover>span{display:none!important;content:none!important;}
.profile-hero .profile-identity{
  align-items:center;
  grid-template-columns:100px minmax(0,1fr) auto;
  gap:18px;
  padding-top:20px;
  padding-bottom:22px;
}
.profile-hero .profile-identity>.profile-name{
  min-width:0;
  align-self:center;
}
.profile-hero .profile-name .profile-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px 12px;
  margin-top:9px;
  line-height:1.4;
}
.profile-hero .profile-name .profile-meta>.profile-handle{
  display:inline;
  color:#e7c47d;
  font-size:16px;
  font-weight:650;
  letter-spacing:.015em;
  overflow-wrap:anywhere;
}
.profile-hero .profile-name .profile-meta>.profile-meta-divider{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#c6a15b;
  font-size:13px;
  line-height:1;
  opacity:.85;
}
.profile-hero .profile-name .profile-meta>.profile-status{
  display:inline;
  color:#e2dfd9;
  font-size:15px;
  font-weight:500;
  overflow-wrap:anywhere;
}
.profile-hero .profile-name>.profile-bio{
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
  margin-top:17px;
  padding:13px 16px 14px;
  color:#ddd9d1;
  background:linear-gradient(130deg,rgba(198,161,91,.10),rgba(198,161,91,.035));
  border:1px solid rgba(198,161,91,.25);
  border-left:3px solid #c6a15b;
  border-radius:12px;
  line-height:1.55;
  overflow-wrap:anywhere;
}
.profile-hero .profile-name .profile-bio-title{
  display:block;
  margin:0 0 6px;
  color:#e5c47e;
  font-size:11px;
  font-weight:750;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.profile-hero .profile-name .profile-bio p{margin:0;font-size:13px;line-height:1.6}
@media(max-width:680px){
  .profile-hero .profile-identity{
    grid-template-columns:78px minmax(0,1fr);
    gap:10px 12px;
    align-items:start;
    padding-top:16px;
  }
  .profile-hero .profile-identity>.profile-name{grid-column:2;grid-row:1;align-self:center}
  .profile-hero .profile-identity>.profile-stats{grid-column:2;grid-row:2}
  .profile-hero .profile-name .profile-meta{gap:6px 9px;margin-top:7px}
  .profile-hero .profile-name .profile-meta>.profile-handle{font-size:15px}
  .profile-hero .profile-name .profile-meta>.profile-status{font-size:14px}
  .profile-hero .profile-name>.profile-bio{padding:11px 12px;margin-top:13px}
}
@media(max-width:380px){
  .profile-hero .profile-identity{grid-template-columns:70px minmax(0,1fr)}
}

/* Circle 4.6.3: stable DM lanes. Every message owns a full-width row;
   the avatar/bubble group is anchored to one side independently of content width. */
#dmMessages.dm-messages{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  min-width:0!important;
  overflow-x:hidden!important;
}
#dmMessages.dm-messages > .dm-message-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  flex:0 0 auto!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  gap:4px!important;
  background:transparent!important;
  border:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own{
  align-items:flex-end!important;
  align-self:stretch!important;
  margin:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other{
  align-items:flex-start!important;
  align-self:stretch!important;
  margin:0!important;
}
#dmMessages.dm-messages > .dm-message-card > .message-header{
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:auto!important;
  max-width:calc(100% - 45px)!important;
  min-width:0!important;
  margin:0 0 0 45px!important;
  padding:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own > .message-header{
  align-self:flex-end!important;
  margin:0 0 0 45px!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other > .message-header{
  align-self:flex-start!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own > .dm-message-line{
  justify-content:flex-end!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .message-avatar-link{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  grid-column:auto!important;
  flex:0 0 38px!important;
  width:38px!important;
  min-width:38px!important;
  height:38px!important;
  align-self:flex-start!important;
  margin:-34px 0 0!important;
  transform:none!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .dm-message-payload{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  flex:0 1 auto!important;
  width:max-content!important;
  min-width:0!important;
  max-width:min(calc(100% - 46px),720px)!important;
  gap:4px!important;
  box-sizing:border-box!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-body,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-attachments,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .dm-reply-link,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-reply-context{
  align-self:flex-start!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-body{
  min-width:0!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  white-space:pre-wrap!important;
}
#dmMessages.dm-messages > .dm-message-card .message-attachments img,
#dmMessages.dm-messages > .dm-message-card .message-attachments video{
  display:block;
  max-width:100%!important;
  height:auto;
}
#dmMessages.dm-messages > .dm-message-card .message-meta-footer{
  align-self:flex-start!important;
  justify-content:flex-start!important;
}
@media(max-width:680px){
  #dmMessages.dm-messages > .dm-message-card > .message-header{
    max-width:calc(100% - 37px)!important;
    margin-left:37px!important;
  }
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line{gap:6px!important}
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line > .message-avatar-link{
    flex-basis:31px!important;width:31px!important;min-width:31px!important;height:31px!important;
    margin-top:-32px!important;
  }
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line > .dm-message-payload{
    max-width:calc(100% - 37px)!important;
  }
}

/* 4.6.3: author and bubble share the same payload; avatar aligns with author. */
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header{
  display:flex!important;align-items:center!important;justify-content:flex-start!important;
  flex-direction:row!important;align-self:flex-start!important;
  width:auto!important;max-width:100%!important;min-width:0!important;
  margin:0 0 3px!important;padding:0!important;box-sizing:border-box!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-line > .message-avatar-link{
  margin:0!important;top:auto!important;left:auto!important;
}
@media(max-width:680px){
  #dmMessages.dm-messages > .dm-message-card .dm-message-line > .message-avatar-link{
    margin:0!important;
  }
}


/* Circle 4.6.4: message layout uses one stable row and one header inside the payload.
   Legacy rules targeted a direct header child and must not control this DOM. */
#dmMessages.dm-messages > .dm-message-card{
  display:flex!important; flex-direction:column!important;
  align-items:stretch!important; align-self:stretch!important;
  width:100%!important; min-width:0!important; max-width:100%!important;
  margin:0!important; padding:0!important;
  overflow:visible!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line{
  display:flex!important; flex-direction:row!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  align-self:stretch!important;
  box-sizing:border-box!important;
  width:100%!important; min-width:0!important; max-width:100%!important;
  gap:8px!important; margin:0!important; padding:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own > .dm-message-line{
  justify-content:flex-end!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .message-avatar-link{
  position:relative!important; left:auto!important; top:auto!important;
  transform:none!important; margin:0!important;
  flex:0 0 38px!important; width:38px!important; min-width:38px!important;
  height:38px!important; aspect-ratio:1/1!important;
  align-self:flex-start!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .message-avatar-link .message-avatar{
  display:block!important; width:100%!important; height:100%!important;
  min-width:0!important; aspect-ratio:1/1!important; border-radius:50%!important;
  object-fit:cover!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .dm-message-payload{
  box-sizing:border-box!important;
  display:flex!important; flex-direction:column!important;
  align-items:flex-start!important; gap:4px!important;
  flex:0 1 auto!important; width:max-content!important;
  min-width:0!important; max-width:min(calc(100% - 46px),720px)!important;
  margin:0!important; padding:0!important; overflow:visible!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own > .dm-message-line > .dm-message-payload{
  align-items:flex-end!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header{
  position:relative!important;
  display:flex!important; flex-direction:row!important;
  align-items:center!important; justify-content:flex-start!important;
  align-self:flex-start!important; gap:8px!important;
  box-sizing:border-box!important; width:max-content!important;
  max-width:100%!important; min-width:0!important;
  margin:0 0 3px!important; padding:0!important;
  overflow:visible!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header > .dm-header-actions{
  position:relative!important; display:inline-flex!important;
  flex-direction:row!important; align-items:center!important;
  flex:0 0 auto!important; gap:5px!important;
  left:auto!important; right:auto!important; top:auto!important;
  margin:0!important; padding:0!important;
  opacity:1!important; visibility:visible!important;
  z-index:2!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header > .dm-header-actions > button,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header > .dm-header-actions > details > summary{
  display:grid!important; place-items:center!important;
  box-sizing:border-box!important;
  width:26px!important; height:26px!important;
  min-width:26px!important; min-height:26px!important;
  padding:0!important; margin:0!important;
  border:1px solid rgba(198,161,91,.35)!important;
  border-radius:8px!important; background:#1c1e23!important;
  color:#e5bd74!important; font-size:14px!important; line-height:1!important;
  cursor:pointer!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header > .dm-header-actions > details{
  position:relative!important; display:block!important;
  flex:0 0 auto!important; overflow:visible!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header > .dm-header-actions > details > summary{
  list-style:none!important; font-size:18px!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header > .dm-header-actions > details > summary::-webkit-details-marker{display:none!important}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header .dm-message-action-popover{
  position:absolute!important; top:0!important;
  right:calc(100% + 8px)!important; left:auto!important;
  width:max-content!important; min-width:158px!important;
  z-index:100!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-header .dm-message-action-popover{
  left:calc(100% + 8px)!important; right:auto!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-body,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-attachments,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-reply-context,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .dm-reply-link,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-meta-footer{
  box-sizing:border-box!important; width:fit-content!important;
  max-width:100%!important; min-width:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-body,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-attachments,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-reply-context,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .dm-reply-link,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-meta-footer{
  align-self:flex-end!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-body,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-attachments,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-reply-context,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .dm-reply-link,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-meta-footer{
  align-self:flex-start!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-attachments{
  align-items:flex-end!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-body{
  overflow-wrap:break-word!important; word-break:normal!important;
  white-space:pre-wrap!important; min-width:min(110px,100%)!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-attachments img,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-attachments video{
  display:block!important; height:auto!important; max-width:100%!important;
}
@media(max-width:680px){
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line{gap:6px!important;}
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line > .message-avatar-link{
    flex-basis:31px!important; width:31px!important; min-width:31px!important; height:31px!important;
  }
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line > .dm-message-payload{
    max-width:calc(100% - 37px)!important;
  }
}


/* Circle 4.6.5 — stable per-side message lane.
   Previously the avatar, nickname and bubble shared a max-content flex line,
   so their x position depended on the image width. Give every message the
   same lane width: the avatar/name starts at one anchor, media/text at the
   other anchor. Never use content width to position a whole message. */
#dmMessages.dm-messages{display:flex!important;flex-direction:column!important;align-items:stretch!important;min-width:0!important}
#dmMessages.dm-messages > .dm-message-card{
  box-sizing:border-box!important;display:flex!important;flex-direction:column!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  margin:0!important;padding:0!important;align-self:stretch!important;
  align-items:stretch!important;flex:0 0 auto!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line{
  box-sizing:border-box!important;display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  column-gap:8px!important;align-items:start!important;
  width:min(100%,720px)!important;max-width:100%!important;
  min-width:0!important;flex:none!important;margin:0!important;
  padding:0!important;justify-content:initial!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own > .dm-message-line{
  margin-left:auto!important;margin-right:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other > .dm-message-line{
  margin-left:0!important;margin-right:auto!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .message-avatar-link{
  grid-column:1!important;grid-row:1!important;
  position:relative!important;inset:auto!important;transform:none!important;
  display:block!important;box-sizing:border-box!important;
  width:38px!important;height:38px!important;min-width:38px!important;
  max-width:38px!important;flex:none!important;align-self:start!important;
  margin:0!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .dm-message-payload{
  grid-column:2!important;grid-row:1!important;
  box-sizing:border-box!important;display:flex!important;flex-direction:column!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  flex:none!important;margin:0!important;padding:0!important;gap:4px!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own > .dm-message-line > .dm-message-payload{
  align-items:flex-end!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other > .dm-message-line > .dm-message-payload{
  align-items:flex-start!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header{
  align-self:flex-start!important;width:max-content!important;max-width:100%!important;
  min-width:0!important;margin:0 0 3px!important;
  flex-direction:row!important;justify-content:flex-start!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-body,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-attachments,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-reply-context,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .dm-reply-link,
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-meta-footer{
  box-sizing:border-box!important;width:fit-content!important;max-width:100%!important;
  min-width:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-body,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-attachments,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-reply-context,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .dm-reply-link,
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-meta-footer{
  align-self:flex-end!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-body,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-attachments,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-reply-context,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .dm-reply-link,
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-meta-footer{
  align-self:flex-start!important;
}
/* Make media honor the fixed edge of the lane; avoid intrinsic-width flex shrinking. */
#dmMessages.dm-messages > .dm-message-card .message-attachments{
  display:flex!important;flex-direction:column!important;min-width:0!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own .message-attachments{align-items:flex-end!important}
#dmMessages.dm-messages > .dm-message-card.dm-other .message-attachments{align-items:flex-start!important}
#dmMessages.dm-messages > .dm-message-card .message-attachments .message-image-open{
  box-sizing:border-box!important;display:block!important;max-width:100%!important;
  width:fit-content!important;margin:0!important;padding:0!important;
}
#dmMessages.dm-messages > .dm-message-card .message-attachments img,
#dmMessages.dm-messages > .dm-message-card .message-attachments video{
  box-sizing:border-box!important;display:block!important;max-width:100%!important;height:auto!important;
}
@media(max-width:680px){
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line{
    grid-template-columns:31px minmax(0,1fr)!important;
    column-gap:6px!important;width:100%!important;
  }
  #dmMessages.dm-messages > .dm-message-card > .dm-message-line > .message-avatar-link{
    width:31px!important;height:31px!important;min-width:31px!important;max-width:31px!important;
  }
}

/* Circle 4.6.6: name, avatar and actions share the SAME edge as message media. */
#dmMessages.dm-messages > .dm-message-card > .dm-message-line{
 display:block!important;grid-template-columns:none!important;width:min(100%,720px)!important;
}
#dmMessages.dm-messages > .dm-message-card > .dm-message-line > .dm-message-payload{
 display:flex!important;flex-direction:column!important;width:100%!important;
 max-width:100%!important;min-width:0!important;
}
#dmMessages.dm-messages > .dm-message-card .dm-message-payload > .message-header{
 display:flex!important;flex-direction:row!important;align-items:center!important;
 gap:8px!important;width:max-content!important;max-width:100%!important;
 margin-bottom:4px!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-own .dm-message-payload > .message-header{
 align-self:flex-end!important;justify-content:flex-end!important;text-align:left!important;
}
#dmMessages.dm-messages > .dm-message-card.dm-other .dm-message-payload > .message-header{
 align-self:flex-start!important;justify-content:flex-start!important;text-align:left!important;
}
#dmMessages.dm-messages > .dm-message-card .message-header > .message-avatar-link{
 display:inline-flex!important;flex:0 0 38px!important;width:38px!important;height:38px!important;
 min-width:38px!important;max-width:38px!important;margin:0!important;
 position:static!important;transform:none!important;align-items:center!important;justify-content:center!important;
}
#dmMessages.dm-messages > .dm-message-card .message-header > .message-avatar-link > .message-avatar{
 display:block!important;box-sizing:border-box!important;width:38px!important;height:38px!important;
 min-width:38px!important;max-width:38px!important;aspect-ratio:1!important;border-radius:50%!important;
 object-fit:cover!important;overflow:hidden!important;
}
#dmMessages.dm-messages > .dm-message-card .message-header > .dm-header-actions{
 display:inline-flex!important;position:relative!important;align-items:center!important;
}
/* Scroll-to-latest appears inside the conversation area without affecting message layout. */
.dm-conversation-area > .dm-jump-latest{
 position:absolute;z-index:35;left:50%;right:auto;bottom:120px;transform:translateX(-50%);
 display:flex;gap:7px;align-items:center;justify-content:center;
 color:#ebca84;background:#242322;border:1px solid rgba(198,161,91,.55);
 border-radius:999px;padding:10px 15px;box-shadow:0 6px 22px #0009;
 font-size:12px;font-weight:600;line-height:1.2;cursor:pointer;
}
.dm-conversation-area > .dm-jump-latest:hover{background:#302b24;border-color:#ebca84}
.dm-conversation-area > .dm-jump-latest[hidden]{display:none!important}
@media(max-width:680px){
 #dmMessages.dm-messages > .dm-message-card .message-header > .message-avatar-link,
 #dmMessages.dm-messages > .dm-message-card .message-header > .message-avatar-link > .message-avatar{
  width:31px!important;height:31px!important;min-width:31px!important;max-width:31px!important;flex-basis:31px!important;
 }
 .dm-conversation-area > .dm-jump-latest{left:50%;right:auto;bottom:150px;transform:translateX(-50%);padding:9px 12px}
}


/* Circle 4.6.8: the jump control is a normal layout row, never an overlay on
   the text composer, regardless of its changing height or mobile keyboard. */
.dm-conversation-area > #dmJumpLatest.dm-jump-latest{
  position:relative!important;
  inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  transform:none!important;
  box-sizing:border-box!important;
  flex:0 0 auto!important;
  align-self:center!important;
  margin:10px auto 12px!important;
  width:max-content!important;
  max-width:calc(100% - 24px)!important;
  z-index:5!important;
  white-space:nowrap!important;
}
.dm-conversation-area > #dmJumpLatest.dm-jump-latest[hidden]{display:none!important}
/* Disable browser scroll anchoring fighting the initial jump after image layout. */
#dmMessages.dm-messages{overflow-anchor:none}
@media(max-width:680px){
  .dm-conversation-area > #dmJumpLatest.dm-jump-latest{
    margin:9px auto 12px!important;
    padding:9px 13px!important;
  }
}


/* Circle 4.6.9: 3-column user profile. The center preserves the existing
   1040px maximum post width; the side tracks share unused space evenly. */
.circle-main:has(>.circle-profile-columns){max-width:none!important;min-width:0;width:100%!important;}
.circle-main>.circle-profile-columns{
  width:100%!important;max-width:none!important;margin:0 auto!important;
  display:grid;grid-template-columns:minmax(185px,1fr) minmax(0,1040px) minmax(185px,1fr);
  column-gap:clamp(13px,1.35vw,24px);align-items:start;box-sizing:border-box;
}
.circle-profile-columns>*{min-width:0}
.circle-profile-left,.circle-profile-right{display:flex;flex-direction:column;gap:17px;min-width:0}
.circle-profile-center{display:flex;flex-direction:column;gap:0;min-width:0;width:100%;max-width:1040px}
.circle-profile-center>.feed-post,.circle-profile-center>.empty-feed,
.circle-profile-center>.public-profile-feed-heading{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important}
.circle-profile-left>.profile-hero,.circle-profile-left>.public-profile-actions{
 width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;box-sizing:border-box!important;
}
.circle-profile-left>.public-profile-actions{margin-top:0!important}
.circle-profile-left .profile-cover{height:116px}
.circle-profile-left .profile-identity{
 display:flex!important;flex-wrap:wrap;align-items:center;gap:11px;
 padding:13px!important;min-height:auto;grid-template-columns:none!important;
}
.circle-profile-left .profile-identity>.profile-avatar-large{
 position:static!important;width:68px!important;height:68px!important;
 flex:0 0 68px;margin:0!important;align-self:center!important;
}
.circle-profile-left .profile-identity>.profile-name{
 flex:1 1 110px;min-width:0!important;padding:0!important;grid-column:auto!important;grid-row:auto!important;
}
.circle-profile-left .profile-name h1{font-size:clamp(16px,1.15vw,22px);line-height:1.3}
.circle-profile-left .profile-name .eyebrow{font-size:9px}
.circle-profile-left .profile-name .profile-meta{display:flex;gap:5px 8px;flex-wrap:wrap}
.circle-profile-left .profile-name .profile-meta>.profile-handle{font-size:13px}
.circle-profile-left .profile-name .profile-meta>.profile-status{font-size:12px}
.circle-profile-left .profile-identity>.profile-stats{
 flex:1 0 100%!important;display:flex;gap:14px;align-items:center;justify-content:flex-start;
 border-top:1px solid rgba(198,161,91,.15);padding:12px 0 0!important;margin:0!important;
 grid-column:auto!important;grid-row:auto!important;flex-wrap:wrap;
}
.circle-profile-left .profile-stats strong{font-size:16px}
.circle-profile-left .profile-message-icon{width:38px;height:38px;min-width:38px}
.circle-profile-about,.circle-profile-friends,.circle-profile-achievements{
 padding:17px;border:1px solid rgba(198,161,91,.26);border-radius:17px;
 background:linear-gradient(135deg,rgba(34,34,36,.93),rgba(22,23,27,.98));
 box-sizing:border-box;min-width:0;overflow:hidden;
}
.circle-profile-about h2,.circle-profile-friends h2,.circle-profile-achievements h2{
 margin:0 0 13px;color:#e9c987;font-size:15px;font-weight:700;
}
.circle-profile-about p{margin:0;color:#dedbd5;line-height:1.7;font-size:13px;overflow-wrap:anywhere}
.circle-profile-friend-category{padding:13px 0 0;border-top:1px solid rgba(198,161,91,.14)}
.circle-profile-friend-category+.circle-profile-friend-category{margin-top:13px}
.circle-profile-friend-category h3{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;margin:0 0 12px;color:#e6e1d6}
.circle-profile-friend-category h3 span{color:#c6a15b;font-variant-numeric:tabular-nums}
.circle-profile-friend-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:13px 8px}
.circle-profile-friend{display:flex;position:relative;align-items:center;flex-direction:column;gap:6px;min-width:0;text-decoration:none!important;color:#ddd9d1!important}
.circle-profile-friend:hover{color:#efd295!important}
.circle-profile-friend-avatar,.circle-profile-friend-avatar img{
 display:inline-flex!important;align-items:center;justify-content:center;width:48px!important;height:48px!important;
 flex:0 0 48px!important;max-width:48px!important;max-height:48px!important;
 border-radius:50%!important;object-fit:cover!important;aspect-ratio:1/1;overflow:hidden;
}
.circle-profile-friend-avatar{border:1px solid rgba(198,161,91,.5);background:#28251e}
.circle-profile-friend>span:not(.circle-profile-friend-avatar){font-size:11px;line-height:1.3;text-align:center;max-width:100%;overflow-wrap:anywhere}
.circle-profile-online-dot{position:absolute;left:calc(50% + 13px);top:33px;width:10px;height:10px;border-radius:50%;background:#5ecc8e;border:2px solid #1e2025}
.circle-profile-no-status,.circle-profile-friends-empty{font-size:12px;margin:0;line-height:1.6}
.circle-profile-achievements{text-align:left}
.circle-profile-achievements-placeholder{display:flex;justify-content:center;align-items:center;font-size:35px;color:#c6a15b;background:rgba(198,161,91,.08);border-radius:12px;min-height:85px;margin:8px 0 11px}
.circle-profile-achievements p{font-size:12px;line-height:1.5;margin:0}
@media(max-width:1590px){
 .circle-main>.circle-profile-columns{grid-template-columns:minmax(190px,1fr) minmax(0,1040px) minmax(190px,1fr);gap:14px}
}
@media(max-width:1160px){
 .circle-main>.circle-profile-columns{grid-template-columns:minmax(190px,250px) minmax(0,1fr);gap:16px}
 .circle-profile-right{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
}
@media(max-width:740px){
 .circle-main>.circle-profile-columns{grid-template-columns:minmax(0,1fr);gap:16px}
 .circle-profile-left,.circle-profile-center,.circle-profile-right{grid-column:1;}
 .circle-profile-right{display:flex;flex-direction:column}
 .circle-profile-left .profile-identity{display:flex!important}
 .circle-profile-left .profile-identity>.profile-stats{grid-column:auto!important;grid-row:auto!important}
 .circle-profile-friend-grid{grid-template-columns:repeat(auto-fill,minmax(66px,1fr))}
}

/* Circle 4.6.10: profile post tabs and photo-only border */
.circle-profile-center>.circle-profile-post-tabs{display:grid;grid-template-columns:1fr 1fr;gap:0;width:100%;max-width:100%;box-sizing:border-box;background:#1b1c20;border:1px solid rgba(198,161,91,.26);border-radius:14px;overflow:hidden;margin:0 0 15px}
.circle-profile-post-tabs a{display:flex;align-items:center;justify-content:center;min-height:52px;padding:12px 8px;text-align:center;text-decoration:none;color:#aeb0b5;font-weight:650;font-size:clamp(12px,1vw,15px);transition:background .2s,color .2s}
.circle-profile-post-tabs a+a{border-left:1px solid rgba(198,161,91,.17)}
.circle-profile-post-tabs a.is-active{background:rgba(198,161,91,.13);color:#e3c47b;box-shadow:inset 0 -2px 0 #c6a15b}
.circle-profile-post-tabs a:hover{color:#f5d79c;background:rgba(198,161,91,.09)}
.circle-post-repost-label{font-size:12px;color:#dfc38b;padding-bottom:12px;border-bottom:1px solid rgba(198,161,91,.16);margin-bottom:13px}
.circle-post-original-link{display:inline-block;margin-bottom:12px;font-size:12px;color:#d6b474;text-decoration:none}
.circle-post-original-link:hover{text-decoration:underline}
.circle-post-repost-form{display:inline-flex;margin:7px 0 2px}
.circle-post-repost-button{background:rgba(198,161,91,.07);border:1px solid rgba(198,161,91,.28);color:#d9c18c;border-radius:9px;padding:8px 12px;cursor:pointer}
.circle-post-repost-button.is-active{background:rgba(198,161,91,.16);border-color:#c6a15b}
.circle-post-repost-button:hover{background:rgba(198,161,91,.2)}
/* The image itself carries the frame; no full-width surrounding media canvas. */
.feed-post .post-media,.single-post .post-media{display:flex!important;align-items:flex-start!important;justify-content:flex-start!important;width:fit-content!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:auto!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;overflow:visible!important;box-shadow:none!important}
.feed-post .post-media>.post-media-trigger,.feed-post .post-media>a,.single-post .post-media>.post-media-trigger{display:inline-block!important;width:fit-content!important;max-width:100%!important;min-height:0!important;height:auto!important;padding:0!important;margin:0!important;line-height:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
.feed-post .post-media img,.feed-post .post-media video,.single-post .post-media img,.single-post .post-media video{display:block!important;width:auto!important;max-width:100%!important;height:auto!important;max-height:520px!important;aspect-ratio:auto!important;object-fit:contain!important;background:transparent!important;border:1px solid rgba(198,161,91,.38)!important;border-radius:11px!important;box-sizing:border-box!important}
@media(max-width:650px){.circle-profile-post-tabs a{min-height:44px}.feed-post .post-media img,.feed-post .post-media video{max-height:360px!important}}

/* Circle 4.6.11 — aligned actions, a distinct three-diamond link motif, and centered post media. */
.social-interactions .social-interaction-row{display:flex!important;align-items:center!important;flex-wrap:wrap;gap:12px!important;}
.social-interactions .circle-post-repost-form{display:inline-flex!important;align-items:center;margin:0!important;}
.social-interactions .circle-post-repost-button{min-height:36px;display:inline-flex;align-items:center;gap:6px;}
.social-interactions .circle-action-divider{display:inline-flex;align-items:center;justify-content:center;gap:4px;flex:0 0 auto;width:28px;height:28px;opacity:.85;pointer-events:none;}
.social-interactions .circle-action-divider i{display:block;width:5px;height:5px;transform:rotate(45deg);border:1px solid rgba(210,174,105,.72);background:rgba(198,161,91,.12);}
.social-interactions .circle-action-divider i:nth-child(2){width:7px;height:7px;border-color:#d6b46d;background:rgba(198,161,91,.30);}
.feed-post>.post-head,.single-post>.post-head{position:relative;min-width:0;padding-right:44px;}
.feed-post>.post-head>.circle-pin-icon-form,.single-post>.post-head>.circle-pin-icon-form{position:absolute;top:0;right:0;margin:0!important;display:flex;justify-content:center;align-items:center;}
.feed-post .circle-pin-icon,.single-post .circle-pin-icon{display:grid;place-items:center;width:32px;height:32px;min-height:0;padding:5px;color:#bd9a5a;background:rgba(198,161,91,.06);border:1px solid rgba(198,161,91,.25);border-radius:9px;cursor:pointer;}
.feed-post .circle-pin-icon svg,.single-post .circle-pin-icon svg{width:18px;height:18px;}
.feed-post .circle-pin-icon.is-pinned,.single-post .circle-pin-icon.is-pinned{color:#f1cd7e;background:rgba(198,161,91,.18);}
.feed-post .circle-pin-icon:hover,.single-post .circle-pin-icon:hover{border-color:#d4b06b;}
.feed-post>.post-media,.single-post>.post-media{display:flex!important;justify-content:center!important;align-items:center!important;width:100%!important;max-width:100%!important;margin-left:auto!important;margin-right:auto!important;}
.feed-post .post-media>.post-media-trigger,.single-post .post-media>.post-media-trigger{margin-inline:auto!important;}
.feed-post .post-media>video,.single-post .post-media>video{margin-inline:auto!important;}
.feed-post>h3,.single-post>h3{text-align:center!important;}
#circleProfilePostPanel[aria-busy="true"]{opacity:.68;transition:opacity .12s;}
@media(max-width:480px){.social-interactions .social-interaction-row{gap:7px!important}.social-interactions .circle-action-divider{width:16px;gap:2px}.social-interactions .circle-action-divider i{width:3px;height:3px}.social-interactions .circle-action-divider i:nth-child(2){width:5px;height:5px}}

/* Circle 4.6.12 — unified icon-only post actions; active state colors the icon only. */
.social-interactions .social-interaction-row{align-items:center!important;gap:10px!important;}
.social-interactions .social-interaction-row form{margin:0!important;}
.social-interactions .circle-modern-action,
.social-interactions a.circle-modern-action{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;
 min-height:38px!important;min-width:42px!important;padding:6px 8px!important;
 background:transparent!important;border:0!important;border-radius:8px!important;
 box-shadow:none!important;text-decoration:none!important;color:#aeb2bc!important;
 font-size:12px!important;font-weight:600!important;line-height:1!important;
 cursor:pointer;outline-offset:2px;transition:color .16s ease!important;
}
.social-interactions .circle-modern-action:hover,
.social-interactions .circle-modern-action:focus-visible{color:#dfc387!important;background:transparent!important;border:0!important;box-shadow:none!important;}
.social-interactions .circle-modern-action.is-active{color:#d8ae61!important;background:transparent!important;border:0!important;box-shadow:none!important;}
.social-interactions .circle-modern-action .circle-action-svg{display:block;flex:0 0 21px;width:21px;height:21px;stroke:currentColor;}
.social-interactions .circle-modern-action.is-active .circle-action-svg{stroke-width:2.2px;}
.social-interactions .circle-modern-action .interaction-total{color:#aeb2bc!important;min-width:1ch;font-variant-numeric:tabular-nums;font-weight:650;}
.social-interactions .circle-modern-action.is-active .interaction-total{color:#aeb2bc!important;}
.social-interactions .comment-count.circle-modern-action{pointer-events:auto!important;user-select:auto!important;}
.social-interactions .comment-count.circle-modern-action:hover{color:#dfc387!important;}
@media(max-width:480px){.social-interactions .social-interaction-row{gap:5px!important}.social-interactions .circle-modern-action{min-width:36px!important;padding:6px 4px!important}}


/* Circle 4.6.14 — single interaction style, icon-based state, larger readable comments. */
:root{--circle-action-size:24px;--circle-action-muted:#aeb2bc;--circle-action-active:#d8ae61}
.social-interactions .circle-modern-action,
.social-interactions a.circle-modern-action{
 min-height:44px!important;min-width:48px!important;padding:8px 10px!important;
 border:0!important;background:transparent!important;box-shadow:none!important;
 color:var(--circle-action-muted)!important;border-radius:10px!important;
}
.social-interactions .circle-modern-action .circle-action-svg{
 width:var(--circle-action-size)!important;height:var(--circle-action-size)!important;
 flex:0 0 var(--circle-action-size)!important;stroke:currentColor!important;
}
.social-interactions .circle-modern-action.is-active .circle-action-svg{stroke:var(--circle-action-active)!important}
.social-interactions .circle-modern-action:hover .circle-action-svg{stroke:#eac887!important}
.social-interactions .circle-modern-action .interaction-total{font-size:13px!important;font-weight:650!important}
/* Comment row: larger avatar, text, spacing and controls; replies follow the same system. */
.social-comment-list{gap:12px!important;margin-top:15px!important}
.post-comment-row{
 display:flex!important;align-items:flex-start!important;gap:12px!important;
 padding:14px 15px!important;border-radius:14px!important;
 background:rgba(255,255,255,.023)!important;border-color:rgba(198,161,91,.14)!important;
}
.post-comment-avatar{width:38px!important;height:38px!important;flex:0 0 38px!important;font-size:14px!important}
.post-comment-copy,.post-comment-content{gap:7px!important;min-width:0!important}
.post-comment-copy strong{font-size:14px!important;line-height:1.35!important}
.post-comment-copy p{font-size:14px!important;line-height:1.65!important;margin:0!important;overflow-wrap:break-word!important}
.post-comment-time{font-size:11px!important;margin-top:4px!important}
.comment-reply-reference{font-size:13px!important;line-height:1.5!important}
.post-comment-actions{gap:10px!important;min-height:38px!important}
.post-comment-actions .comment-action-form{margin:0!important}
.post-comment-actions .comment-action-button{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
 min-height:38px!important;min-width:40px!important;padding:6px 8px!important;
 border:0!important;background:transparent!important;box-shadow:none!important;
 border-radius:9px!important;color:var(--circle-action-muted)!important;
 font-size:13px!important;font-weight:600!important;cursor:pointer;
 transition:color .16s ease!important;
}
.post-comment-actions .comment-action-button:hover,
.post-comment-actions .comment-action-button:focus-visible{
 border:0!important;background:transparent!important;box-shadow:none!important;color:#eac887!important;
}
.post-comment-actions .comment-action-button.is-active{
 border:0!important;background:transparent!important;box-shadow:none!important;
 color:var(--circle-action-muted)!important;
}
.post-comment-actions .comment-action-button .circle-action-svg{
 width:22px!important;height:22px!important;flex:0 0 22px!important;stroke:currentColor!important;
}
.post-comment-actions .comment-action-button.is-active .circle-action-svg{stroke:var(--circle-action-active)!important;stroke-width:2.1!important}
.post-comment-actions .comment-action-count{color:var(--circle-action-muted)!important;font-size:12px!important;font-weight:650!important}
.social-comment-form textarea[name=body]{font-size:14px!important;line-height:1.6!important}
/* Community message reaction chips: larger tap targets, no full-button active fill. */
.message-reactions{gap:8px!important;align-items:center!important}
.message-reaction-form button{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 min-height:36px!important;min-width:40px!important;padding:6px 9px!important;
 font-size:14px!important;line-height:1.25!important;
 background:transparent!important;border:1px solid transparent!important;box-shadow:none!important;
 color:var(--circle-action-muted)!important;border-radius:9px!important;
}
.message-reaction-form button:hover,.message-reaction-form button:focus-visible{
 color:#eac887!important;border-color:transparent!important;background:transparent!important;
}
.message-reaction-form button.is-active{color:var(--circle-action-active)!important;background:transparent!important;border-color:transparent!important}
@media(max-width:600px){
 .social-interactions .circle-modern-action{min-width:42px!important;padding:7px 6px!important}
 .social-interactions .circle-modern-action .circle-action-svg{width:23px!important;height:23px!important;flex-basis:23px!important}
 .post-comment-row{padding:12px!important;gap:10px!important}
 .post-comment-avatar{width:34px!important;height:34px!important;flex-basis:34px!important}
 .post-comment-copy p{font-size:13.5px!important}
}

/* Circle 4.6.15 — consistent outlined SVG community message reactions. */
.message-reactions{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important}
.message-reaction-form{display:inline-flex!important;margin:0!important;padding:0!important}
.message-reaction-form .circle-channel-reaction{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;
 min-width:41px!important;min-height:40px!important;padding:7px 8px!important;
 color:var(--circle-action-muted,#b5a792)!important;background:transparent!important;
 border:0!important;outline:0!important;box-shadow:none!important;border-radius:9px!important;
 transition:color .15s ease!important;cursor:pointer!important;
}
.message-reaction-form .circle-channel-reaction .circle-action-svg{
 width:23px!important;height:23px!important;flex:0 0 23px!important;
 fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;
}
.message-reaction-form .circle-channel-reaction.is-active{color:var(--circle-action-active,#d8ae61)!important}
.message-reaction-form .circle-channel-reaction:hover,
.message-reaction-form .circle-channel-reaction:focus-visible{color:#eed49a!important;background:transparent!important;border:0!important;box-shadow:none!important}
.message-reaction-form .circle-channel-reaction:focus-visible{outline:2px solid #c6a15b!important;outline-offset:2px!important}
.message-reaction-form .circle-channel-reaction-count{font-size:12px!important;font-weight:650!important;color:var(--circle-action-muted,#b5a792)!important;line-height:1!important}
.message-reaction-form .circle-channel-reaction-count[hidden]{display:none!important}
.message-reactions .channel-reaction-feedback{font-size:12px;color:#ffb9a8}

/* Circle 4.6.16 — short post descriptions are centred; longer ones justified. */
.feed-post .post-body{
  text-align:center;
  text-align-last:center;
  hyphens:auto;
}
.feed-post .post-body.circle-body-multiline{
  text-align:justify;
  text-align-last:left;
  hyphens:auto;
}


/* Circle 4.6.17 — comment counter is deliberately inert and pushed to the far right. */
.social-interactions .social-interaction-row{display:flex!important;align-items:center!important;flex-wrap:nowrap!important;width:100%!important}
.social-interactions .circle-comment-display{order:10!important;margin-left:auto!important;cursor:default!important;pointer-events:none!important;user-select:none!important;color:#aeb2bc!important;background:transparent!important;border:0!important;box-shadow:none!important;transition:none!important}
.social-interactions .circle-comment-display:hover,.social-interactions .circle-comment-display:focus,.social-interactions .circle-comment-display:active{color:#aeb2bc!important;background:transparent!important;border:0!important;box-shadow:none!important;outline:0!important}
.social-interactions .circle-comment-display .circle-action-svg{stroke:#aeb2bc!important}
.social-interactions .social-interaction-row>.circle-action-divider:first-of-type{display:none!important}
.feed-post>.post-head{display:flex;align-items:center;gap:9px;position:relative}
.circle-post-edit-menu{margin-left:auto;position:relative;z-index:10;flex-shrink:0}
.circle-post-edit-trigger{width:34px;height:34px;padding:7px;border:1px solid rgba(198,161,91,.28);background:transparent;border-radius:9px;color:#c6a15b;display:inline-grid;place-items:center;cursor:pointer}
.circle-post-edit-trigger:hover{color:#f0d394;border-color:#c6a15b}
.circle-post-edit-trigger svg{width:20px;height:20px}
.circle-post-edit-dropdown{position:absolute;right:0;top:calc(100% + 6px);width:230px;max-width:min(230px,80vw);padding:7px;border:1px solid rgba(198,161,91,.38);background:#1b1c20;border-radius:12px;box-shadow:0 14px 38px rgba(0,0,0,.65);z-index:70}
.circle-post-edit-dropdown[hidden]{display:none!important}
.circle-post-edit-dropdown button{width:100%;padding:10px 12px;border:0;border-radius:8px;background:transparent;color:#e6e0d4;text-align:left;cursor:pointer;font-size:13px}
.circle-post-edit-dropdown button:hover{background:rgba(198,161,91,.1);color:#f3d08f}
.circle-editor-backdrop{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.78);display:flex;align-items:center;justify-content:center;padding:18px;overflow-y:auto}
.circle-editor-dialog{width:min(100%,550px);max-height:calc(100dvh - 36px);overflow:auto;background:#1c1d20;color:#eee;border:1px solid rgba(198,161,91,.38);box-shadow:0 22px 70px rgba(0,0,0,.7);border-radius:16px;padding:22px}
.circle-editor-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.circle-editor-head h2{font-size:19px;color:#e8c786;margin:0}
.circle-editor-close{font-size:27px;line-height:1;background:transparent;border:0;color:#c6a15b;cursor:pointer}
.circle-editor-label{display:flex;flex-direction:column;gap:10px;color:#d9c59a;font-weight:650;font-size:14px}
.circle-editor-label input:not([type=file]),.circle-editor-label textarea{width:100%;box-sizing:border-box;border:1px solid rgba(198,161,91,.3);border-radius:10px;background:#121316;color:#f4f0e7;padding:12px;font:inherit;resize:vertical}
.circle-editor-label input[type=file]{max-width:100%;padding:12px;border:1px dashed rgba(198,161,91,.38);border-radius:9px;color:#e2d1ab;background:#151619}
.circle-editor-media-preview{min-height:100px;display:grid;place-items:center;margin-bottom:17px;border:1px solid rgba(198,161,91,.2);border-radius:10px;padding:8px;background:#141517}
.circle-editor-media-preview img{display:block;max-width:100%;max-height:260px;object-fit:contain}
.circle-editor-remove-label{display:flex;align-items:center;gap:9px;margin-top:16px;font-size:13px;color:#cfbb93}
.circle-editor-help,.circle-editor-status{font-size:12px;color:#b8af9d}
.circle-editor-status{min-height:18px}
.circle-editor-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.circle-editor-footer button{min-height:39px;border:1px solid rgba(198,161,91,.35);border-radius:9px;padding:9px 16px;color:#e1c58f;background:transparent;cursor:pointer}
.circle-editor-footer .circle-editor-save{background:#c6a15b;color:#171717;font-weight:750}
.circle-editor-footer button:disabled{opacity:.5;cursor:wait}

/* Circle 4.6.18 — edit and pin controls form a single aligned toolbar. */
.feed-post > .post-head,
.single-post > .post-head{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  padding-right:0!important;
}
.feed-post > .post-head > .post-author,
.single-post > .post-head > .post-author{min-width:0;flex:1 1 auto;}
.feed-post > .post-head > .circle-post-edit-menu,
.single-post > .post-head > .circle-post-edit-menu{
  position:relative!important;
  order:10;
  margin:0!important;
  flex:0 0 36px!important;
  width:36px!important;
  height:36px!important;
  align-self:center!important;
  z-index:12;
}
.feed-post > .post-head > .circle-post-edit-menu > .circle-post-edit-trigger,
.single-post > .post-head > .circle-post-edit-menu > .circle-post-edit-trigger{
  box-sizing:border-box!important;
  display:grid!important;
  place-items:center!important;
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  padding:7px!important;
  margin:0!important;
  border-radius:9px!important;
  line-height:1!important;
}
.feed-post > .post-head > .circle-pin-icon-form,
.single-post > .post-head > .circle-pin-icon-form{
  position:static!important;
  inset:auto!important;
  order:11;
  flex:0 0 36px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:center!important;
  width:36px!important;
  height:36px!important;
  margin:0!important;
  padding:0!important;
}
.feed-post > .post-head > .circle-pin-icon-form > .circle-pin-icon,
.single-post > .post-head > .circle-pin-icon-form > .circle-pin-icon{
  box-sizing:border-box!important;
  display:grid!important;
  place-items:center!important;
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  padding:7px!important;
  margin:0!important;
  border-radius:9px!important;
  line-height:1!important;
}
.feed-post > .post-head > .circle-pin-icon-form svg,
.single-post > .post-head > .circle-pin-icon-form svg,
.feed-post > .post-head > .circle-post-edit-menu > .circle-post-edit-trigger svg,
.single-post > .post-head > .circle-post-edit-menu > .circle-post-edit-trigger svg{
  display:block!important;
  width:20px!important;
  height:20px!important;
  flex:0 0 20px!important;
}
/* The comment counter is a decorative indicator, not an interactive control. */
.social-interactions .social-interaction-row > .circle-comment-display,
.social-interactions .social-interaction-row > .circle-comment-display:hover,
.social-interactions .social-interaction-row > .circle-comment-display:focus,
.social-interactions .social-interaction-row > .circle-comment-display:active{
  color:#d8ae61!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  outline:none!important;
  cursor:default!important;
  pointer-events:none!important;
  user-select:none!important;
  transition:none!important;
}
.social-interactions .circle-comment-display .circle-action-svg,
.social-interactions .circle-comment-display:hover .circle-action-svg,
.social-interactions .circle-comment-display:active .circle-action-svg{
  color:#d8ae61!important;
  stroke:#d8ae61!important;
  fill:none!important;
  transition:none!important;
}
.social-interactions .circle-comment-display .interaction-total,
.social-interactions .circle-comment-display:hover .interaction-total{
  color:#d8ae61!important;
  transition:none!important;
}

/* Circle 4.6.19 — compact Discord-like status in top-right profile */
.topbar .header-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.topbar .header-actions .header-logout{margin:0;display:flex;align-items:center}
.topbar .header-actions .header-logout-button{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;min-width:38px;padding:0;border-radius:9px}
.topbar .header-actions .header-logout-button svg{display:block;width:19px;height:19px}
.topbar .userline{margin-left:10px;flex:0 0 auto}
.topbar .header-profile-wrap{display:flex;align-items:center;position:relative;gap:0;min-width:0}
.topbar .header-profile-wrap .header-identity{display:flex;align-items:center;gap:8px;padding:4px 4px 4px 0}
.topbar .header-avatar-wrap{position:relative;display:inline-flex;flex:0 0 30px;width:30px;height:30px}
.topbar .header-avatar-wrap .topbar-avatar{width:30px;height:30px;flex:0 0 30px}
.topbar .header-presence{position:absolute;left:18px;bottom:0;z-index:65}
.topbar .header-presence-trigger{display:flex;align-items:center;justify-content:center;width:20px;height:20px;min-width:20px;min-height:20px;border:2px solid var(--bg);border-radius:50%;padding:0;background:var(--bg);cursor:pointer;box-shadow:none!important}
.topbar .header-presence-trigger:hover,.topbar .header-presence-trigger:focus-visible{border-color:var(--bg);background:var(--bg);outline:2px solid var(--gold);outline-offset:2px}
.topbar .presence-indicator{display:block;flex:none;width:11px;height:11px;border-radius:50%;background:#80848e;border:1px solid rgba(255,255,255,.15)}
.topbar .header-presence-trigger .presence-indicator{width:12px;height:12px}
.topbar .presence-indicator.status-online{background:#3ba55c}
.topbar .presence-indicator.status-idle{background:#faa81a}
.topbar .presence-indicator.status-dnd{background:#ed4245;position:relative}
.topbar .presence-indicator.status-dnd::after{content:none}
.topbar .header-presence-menu{position:absolute;top:calc(100% + 7px);right:auto;left:-20px;z-index:210;min-width:205px;display:flex;flex-direction:column;gap:2px;padding:7px;border:1px solid rgba(198,161,91,.32);border-radius:12px;background:#24252a;box-shadow:0 12px 30px rgba(0,0,0,.5);color:#f5efe5}
.topbar .header-presence-menu[hidden]{display:none!important}
.topbar .header-presence-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;font-size:12px;text-align:left;color:inherit;border:0;border-radius:8px;background:transparent;box-shadow:none;cursor:pointer}
.topbar .header-presence-menu button:hover,.topbar .header-presence-menu button:focus-visible{background:rgba(198,161,91,.12);color:#f5efe5;outline:none}
.topbar .header-presence-menu button[aria-checked="true"]{color:#ebc682}
@media(max-width:680px){
 .topbar .header-actions{gap:5px}
 .topbar .header-actions .header-logout-button{width:34px;height:34px;min-width:34px}
 .topbar .userline{margin-left:2px}
 .topbar .header-presence-menu{left:auto;right:-8px;top:26px}
}

/* Circle 4.6.20 — swap profile and toolbar positions, keep readable display name. */
.topbar>.brand{order:0;flex:0 0 auto}
.topbar>.userline{
  order:1;
  margin-left:auto!important;
  margin-right:0!important;
  flex:0 1 auto;
  min-width:0;
}
.topbar>.header-actions{
  order:2;
  flex:0 0 auto;
  margin-left:12px!important;
  margin-right:0!important;
}
.topbar .header-profile-wrap .header-identity{
  gap:10px;
  padding:0;
  min-height:38px;
}
.topbar .header-avatar-wrap,
.topbar .header-avatar-wrap .topbar-avatar{
  box-sizing:border-box;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  flex:0 0 38px!important;
  aspect-ratio:1/1;
  border-radius:50%;
}
.topbar .header-avatar-wrap .topbar-avatar img{
  width:100%;height:100%;object-fit:cover;border-radius:50%;
}
.topbar .header-identity .user-name{
  display:block!important;
  color:var(--gold2);
  font-size:15px;
  font-weight:750;
  line-height:1.25;
  letter-spacing:.01em;
  max-width:clamp(95px,13vw,230px);
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.topbar .header-presence{left:26px;bottom:-1px}
.topbar .header-presence-menu{left:auto;right:-24px;top:calc(100% + 8px)}
@media(max-width:680px){
  .topbar{padding-inline:10px;gap:7px}
  .topbar>.userline{margin-left:auto!important}
  .topbar>.header-actions{margin-left:5px!important;gap:4px}
  .topbar .header-identity .user-name{display:block!important;font-size:13px;max-width:clamp(60px,18vw,105px)}
  .topbar .header-profile-wrap .header-identity{gap:6px}
  .topbar .header-presence-menu{left:0;right:auto;top:calc(100% + 9px)}
}
@media(max-width:400px){
  .topbar .header-identity .user-name{max-width:60px;font-size:12px}
  .topbar>.header-actions{gap:2px}
  .topbar .icon-control{width:32px;height:32px;min-width:32px}
  .topbar .header-actions .header-logout-button{width:32px;height:32px;min-width:32px}
}

/* Circle 4.6.21 — single status badge shared by profiles, friends and chats. */
.circle-status-avatar{position:relative!important;isolation:isolate;overflow:visible!important}
.circle-user-status{
 position:absolute;right:-3px;bottom:-3px;width:14px;height:14px;
 display:block;box-sizing:border-box;flex:none;border:3px solid var(--panel,#1c1d21);
 border-radius:50%;background:#747b84;z-index:5;pointer-events:none
}
.circle-user-status.status-online{background:#3ba55c}
.circle-user-status.status-idle{background:#faa81a}
.circle-user-status.status-dnd{background:#ed4245}
.circle-user-status.status-dnd::after{content:none}
.circle-user-status.status-offline{background:#737982}
.profile-avatar-large .circle-user-status{width:19px;height:19px;right:0;bottom:0;border-width:4px}
.circle-profile-friend-avatar .circle-user-status{width:13px;height:13px}
/* The previous always-green badge is obsolete. */
.circle-profile-online-dot{display:none!important}

/* Circle 4.6.22 — live settings and exact left-column preview */
.circle-main:has(>.circle-profile-editor-heading),.circle-main:has(>.circle-profile-editor){max-width:none!important;width:100%;min-width:0}
.circle-profile-editor-heading{width:100%!important;max-width:1480px!important;margin:0 auto 20px!important}
.circle-profile-editor{width:min(100%,1480px);margin:0 auto;display:grid;grid-template-columns:minmax(280px,390px) minmax(0,1fr);gap:clamp(16px,2vw,30px);align-items:start}
.circle-profile-editor>*{min-width:0}
.circle-preview-sticky{position:sticky;top:16px}
.circle-preview-label{font-size:12px;letter-spacing:.06em;color:#e6cb91;font-weight:750;margin-bottom:13px;display:flex;align-items:center;gap:10px}
.circle-preview-live-dot{width:8px;height:8px;background:#b99c61;box-shadow:0 0 0 4px rgba(198,161,91,.12);border-radius:50%}
.circle-profile-editor .circle-profile-left{width:100%}
.circle-profile-editor .circle-preview-real .profile-hero{width:100%!important;max-width:none!important;margin:0!important}
.circle-profile-editor .circle-preview-real .profile-cover{height:116px!important;min-height:116px;background-position:center;background-size:cover}
.circle-profile-editor .circle-preview-real .profile-identity{display:flex!important;flex-wrap:wrap;align-items:center;gap:11px;padding:13px!important;min-height:auto;grid-template-columns:none!important}
.circle-profile-editor .circle-preview-real .profile-identity>.profile-avatar-large{position:static!important;width:68px!important;height:68px!important;flex:0 0 68px;margin:0!important;align-self:center!important;left:auto!important;top:auto!important}
.circle-profile-editor .circle-preview-real .profile-identity>.profile-name{flex:1 1 110px!important;min-width:0!important;padding:0!important;grid-column:auto!important;grid-row:auto!important}
.circle-profile-editor .circle-preview-real .profile-name h1{font-size:clamp(16px,1.2vw,22px);line-height:1.3}
.circle-profile-editor .circle-preview-real .profile-meta{display:flex;gap:5px 8px;flex-wrap:wrap}
.circle-profile-editor .circle-preview-real .profile-handle{font-size:13px!important}
.circle-profile-editor .circle-preview-real .profile-status{font-size:12px!important;overflow-wrap:anywhere}
.circle-profile-editor .circle-preview-real .profile-identity>.profile-stats{flex:1 0 100%!important;display:flex;gap:14px;align-items:center;justify-content:flex-start;border-top:1px solid rgba(198,161,91,.15);padding:12px 0 0!important;margin:0!important;grid-column:auto!important;grid-row:auto!important;flex-wrap:wrap}
.circle-profile-editor .circle-preview-real .profile-stats strong{font-size:16px}
.circle-profile-editor .circle-preview-real .circle-preview-edit{width:38px;height:38px;min-width:38px;display:inline-flex;align-items:center;justify-content:center;color:#d4b678}
.circle-profile-editor .circle-preview-real .circle-profile-about{margin-top:17px}
.circle-preview-hint{margin:12px 3px 0;font-size:12px;color:#918d85;line-height:1.55}
.circle-profile-settings{display:grid;gap:16px;width:100%;margin:0;min-width:0}
.circle-setting-card{background:linear-gradient(135deg,rgba(34,34,37,.97),rgba(20,21,25,.99));border:1px solid rgba(198,161,91,.24);border-radius:17px;padding:clamp(16px,2vw,24px);min-width:0;display:flex;flex-direction:column;gap:12px}
.circle-setting-title{display:flex;gap:13px;align-items:flex-start;margin-bottom:4px}
.circle-setting-icon{font-size:19px;width:37px;height:37px;flex:0 0 37px;display:grid;place-items:center;border:1px solid rgba(198,161,91,.35);background:rgba(198,161,91,.07);border-radius:11px;color:#e7c27a}
.circle-setting-title h3{font-size:16px;line-height:1.4;color:#e9d3a3;margin:1px 0 4px;font-weight:750}
.circle-setting-title p{font-size:12px;color:#999794;margin:0;line-height:1.5}
.circle-setting-label{font-size:12px;color:#cac4b5;margin:0}
.circle-setting-card>input,.circle-setting-card>textarea,.circle-setting-card>select{box-sizing:border-box;width:100%;max-width:100%;margin:0}
.circle-image-editor{display:flex;flex-direction:column;gap:12px;min-width:0}
.circle-crop-viewport{position:relative;overflow:hidden;margin:0 auto;background:#151619;border:1px solid rgba(198,161,91,.34);touch-action:none;cursor:grab;user-select:none;max-width:100%;box-sizing:border-box}
.circle-crop-viewport.is-dragging{cursor:grabbing}
.circle-crop-viewport canvas{width:100%;height:100%;display:block;object-fit:fill}
.circle-crop-avatar{height:220px;width:220px;max-width:100%;border-radius:50%}
.circle-crop-avatar .circle-crop-guideline{position:absolute;inset:0;border:1px solid rgba(255,255,255,.18);border-radius:50%;pointer-events:none}
.circle-crop-cover{width:100%;aspect-ratio:3/1;border-radius:12px}
.circle-crop-help{margin:0;font-size:12px;color:#99938b;text-align:center}
.circle-crop-controls{display:flex;gap:10px 20px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.circle-crop-controls>label{font-size:12px;color:#d5c8a9;display:flex;align-items:center;gap:11px;margin:0}
.circle-crop-zoom{width:155px;max-width:100%;accent-color:#c6a15b}
.circle-crop-presets{display:flex;gap:6px;flex-wrap:wrap}
.circle-crop-presets button{border-radius:9px;font-size:12px;padding:7px 10px;border:1px solid rgba(198,161,91,.27);background:rgba(198,161,91,.04);color:#e2ceb1;cursor:pointer}
.circle-crop-presets button:hover,.circle-crop-presets button:focus-visible{border-color:#c6a15b;color:#f3d598;background:rgba(198,161,91,.1)}
.circle-profile-save{position:sticky;bottom:0;z-index:4;border:1px solid rgba(198,161,91,.35);border-radius:14px;background:#191a1eeF;backdrop-filter:blur(14px);display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 17px}
.circle-profile-save .primary{white-space:nowrap}
.circle-profile-save .circle-edit-error{color:#ff9b9b}
#profilePreviewBio{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:950px){.circle-profile-editor{grid-template-columns:minmax(235px,340px) minmax(0,1fr)}}
@media(max-width:720px){.circle-profile-editor{grid-template-columns:minmax(0,1fr)}.circle-preview-sticky{position:static}.circle-profile-editor .circle-preview-real{max-width:420px}.circle-profile-save{flex-wrap:wrap}.circle-profile-save .primary{width:100%}.circle-profile-editor-heading{flex-direction:column;align-items:start}}


/* Circle 4.6.23 — aligned profile editor with tiled settings. */
.circle-main:has(>.circle-profile-editor){max-width:none!important;width:100%;min-width:0}
.circle-profile-editor{
  width:min(100%,1580px)!important;
  display:grid!important;
  grid-template-columns:minmax(270px,350px) minmax(0,1fr)!important;
  gap:clamp(14px,1.8vw,26px)!important;
  align-items:start!important;
  margin:0 auto!important;
}
.circle-profile-preview-col,.circle-profile-settings{min-width:0!important;margin-top:0!important;align-self:start!important}
.circle-preview-sticky{top:12px!important}
.circle-preview-label{height:31px;box-sizing:border-box;margin:0 0 10px!important}
.circle-profile-settings{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:stretch!important;
  align-content:start!important;
  gap:clamp(12px,1.5vw,20px)!important;
}
.circle-profile-settings>.circle-setting-card{min-width:0!important;height:100%;box-sizing:border-box;margin:0!important}
.circle-profile-settings>.circle-profile-save{grid-column:1/-1;align-self:end}
/* The portrait should be clipped inside its own circle. Status marker stays outside. */
.circle-profile-editor .circle-preview-real .profile-identity>.profile-avatar-large{
  position:relative!important;
  width:68px!important;height:68px!important;min-width:68px!important;
  max-width:68px!important;min-height:68px!important;
  flex:0 0 68px!important;box-sizing:border-box!important;
  display:block!important;overflow:visible!important;
  border-radius:50%!important;
}
.circle-profile-editor #profilePreviewAvatar>img{
  display:block!important;position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;max-width:100%!important;
  max-height:100%!important;min-width:0!important;min-height:0!important;
  border-radius:50%!important;object-fit:cover!important;object-position:center!important;
  aspect-ratio:1/1!important;
}
.circle-profile-editor #profilePreviewAvatar>.circle-user-status{z-index:6!important}
.circle-profile-editor .circle-crop-avatar{aspect-ratio:1/1!important}
@media(max-width:1130px){
  .circle-profile-editor{grid-template-columns:minmax(240px,320px) minmax(0,1fr)!important}
  .circle-profile-settings{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .circle-setting-card{padding:15px!important}
}
@media(max-width:900px){
  .circle-profile-editor{grid-template-columns:minmax(0,1fr)!important}
  .circle-preview-sticky{position:static!important}
  .circle-profile-preview-col{max-width:440px;width:100%}
}
@media(max-width:590px){
  .circle-profile-settings{grid-template-columns:minmax(0,1fr)!important}
  .circle-profile-editor{gap:17px!important}
  .circle-profile-preview-col{max-width:100%}
}

/* Circle 4.6.25 — DND uses the same simple round status marker as other states. */
.topbar .presence-indicator.status-dnd::before,.topbar .presence-indicator.status-dnd::after,.circle-user-status.status-dnd::before,.circle-user-status.status-dnd::after{content:none!important;display:none!important}

/* Circle 4.6.26 — unified administration and community settings */
.circle-main:has(>.circle-admin-settings),.circle-main:has(>.circle-community-editor){width:100%;max-width:none!important;min-width:0}
.circle-settings-heading{margin-bottom:20px;padding:3px 2px 0}
.circle-settings-heading h1{margin:0 0 6px;color:#ebcf95;font-size:clamp(22px,2.4vw,30px)}
.circle-settings-heading p{margin:0;color:#a6a8ae;font-size:13px}
.circle-admin-cards,.circle-community-management-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;align-items:start}
.circle-admin-cards>.panel,.circle-community-management-grid>.panel{min-width:0;margin:0!important;box-sizing:border-box;border:1px solid rgba(198,161,91,.22);border-radius:17px;background:linear-gradient(140deg,#242427,#17181c);padding:clamp(16px,2vw,24px)}
.circle-admin-cards>.panel h2,.circle-community-management-grid>.panel h2{font-size:18px;color:#e9c784;margin:0 0 15px}
.circle-admin-cards input:not([type=checkbox]),.circle-admin-cards textarea,.circle-admin-cards select,.circle-community-management-grid input:not([type=checkbox]),.circle-community-management-grid textarea,.circle-community-management-grid select{max-width:100%;box-sizing:border-box}
.circle-admin-cards .feature-row,.circle-community-management-grid .feature-row{min-width:0;flex-wrap:wrap}
.circle-admin-cards .message,.circle-community-management-grid .message{overflow-wrap:anywhere}
.circle-community-editor{display:grid;grid-template-columns:minmax(270px,355px) minmax(0,1fr);gap:18px;align-items:start;margin-bottom:20px}
.circle-community-preview-col,.circle-community-settings-col{min-width:0}
.circle-community-preview-col .circle-preview-sticky{position:sticky;top:74px}
.circle-community-preview-card{overflow:hidden;border-radius:16px;background:#191a1e;border:1px solid rgba(198,161,91,.3)}
.circle-community-preview-cover{height:145px;background-color:#24221e;background-size:cover;background-position:center;border-bottom:1px solid rgba(198,161,91,.22)}
.circle-community-preview-identity{display:flex;align-items:center;gap:12px;padding:0 16px 19px;min-width:0}
.circle-community-preview-avatar{position:relative;flex:0 0 76px;width:76px;height:76px;margin-top:-19px;display:grid;place-items:center;overflow:hidden;border-radius:50%;border:3px solid var(--group-accent,#C6A15B);background:#191a1e;color:#e8cb94;font-weight:700;font-size:25px}
.circle-community-preview-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.circle-community-preview-text{min-width:0;flex:1}
.circle-community-preview-text h2{font-size:20px;line-height:1.2;color:#ebca84;margin:0 0 7px;overflow-wrap:anywhere}
.circle-community-preview-text p{font-size:12px;color:#9b9da7;margin:0}
.circle-community-preview-about{margin-top:16px}
.circle-community-preview-about p{overflow-wrap:anywhere;white-space:pre-wrap}
.circle-community-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:stretch}
.circle-community-settings-grid>.circle-setting-card{min-width:0;margin:0!important;height:100%;box-sizing:border-box}
.circle-community-settings-grid>.circle-profile-save{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.circle-community-settings-grid input:not([type=checkbox]):not([type=range]),.circle-community-settings-grid textarea,.circle-community-settings-grid select{width:100%;min-width:0;max-width:100%;box-sizing:border-box}
.circle-community-settings-grid .circle-crop-viewport{touch-action:none;cursor:grab}
.circle-community-settings-grid .circle-crop-viewport.is-dragging{cursor:grabbing}
.circle-community-settings-grid .circle-crop-viewport.circle-crop-disabled{pointer-events:none;opacity:.65}
.circle-community-settings-grid .check-row{display:flex;align-items:center;gap:8px}
.circle-community-management-grid{margin-top:18px}
@media(max-width:1200px){.circle-community-editor{grid-template-columns:minmax(245px,300px) minmax(0,1fr)}.circle-community-settings-grid{gap:12px}}
@media(max-width:960px){.circle-community-settings-grid{grid-template-columns:minmax(0,1fr)}.circle-community-editor{grid-template-columns:minmax(240px,320px) minmax(0,1fr)}.circle-admin-cards,.circle-community-management-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:720px){.circle-community-editor{grid-template-columns:minmax(0,1fr)}.circle-community-preview-col .circle-preview-sticky{position:static}.circle-community-settings-grid{grid-template-columns:minmax(0,1fr)}.circle-community-preview-card{max-width:480px}}
.circle-admin-cards>.panel pre,.circle-admin-cards>.panel code,.circle-community-management-grid>.panel pre,.circle-community-management-grid>.panel code{max-width:100%;overflow-wrap:anywhere;white-space:pre-wrap}
.circle-admin-cards>.panel form,.circle-community-management-grid>.panel form{max-width:100%;min-width:0}
.circle-admin-cards>.panel input[type=file],.circle-community-settings-grid input[type=file]{width:100%;min-width:0}
.circle-community-settings-grid .circle-setting-card>label{font-size:13px;color:#d9c9ac}
@media(max-width:700px){.circle-admin-cards,.circle-community-management-grid{grid-template-columns:minmax(0,1fr)}.circle-admin-cards>.panel,.circle-community-management-grid>.panel{padding:14px}}

/* Circle 4.6.27: independent masonry columns in administration.
   Unlike grid rows, column layout does not reserve vertical space equal
   to the tallest panel of the row. Cards remain intact, with natural heights. */
.circle-admin-settings .circle-admin-cards {
  display: block !important;
  columns: 2 !important;
  column-gap: 17px !important;
  column-fill: balance !important;
  align-items: initial !important;
}
.circle-admin-settings .circle-admin-cards > .panel {
  display: flow-root;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  break-inside: avoid !important;
  page-break-inside: avoid !important;
  -webkit-column-break-inside: avoid !important;
  margin: 0 0 17px !important;
  height: auto !important;
  min-height: 0 !important;
}
@media (max-width: 960px) {
  .circle-admin-settings .circle-admin-cards {
    columns: 1 !important;
    column-gap: 0 !important;
  }
  .circle-admin-settings .circle-admin-cards > .panel {
    margin-bottom: 14px !important;
  }
}

/* Circle 4.7.0: home with voice-activity rail; no page-title block. */
.circle-home-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(245px,290px);gap:22px;align-items:start;width:min(100%,1510px);margin:0 auto;min-width:0}
.circle-home-feed{min-width:0;display:flex;flex-direction:column;gap:0}
.circle-home-feed>.stories-strip,.circle-home-feed>.composer-card,.circle-home-feed>.feed-heading,.circle-home-feed>.feed-post,.circle-home-feed>.empty-feed,.circle-home-feed>.community-discovery{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box}
.circle-home-feed .stories-strip{padding:0 0 18px;margin:0 0 6px!important}
.circle-home-feed .stories-row{gap:14px;padding:5px 3px 12px}
.circle-home-feed .story-card.story-preview-card,.circle-home-feed .story-card.story-add{flex:0 0 142px;width:142px;height:198px;min-height:198px;border-radius:17px}
.circle-home-feed .story-preview-avatar{width:35px;height:35px}
.circle-home-feed .story-preview-card>strong{font-size:13px;bottom:29px}
.circle-home-feed .story-preview-card>small{font-size:11px;bottom:10px}
.circle-home-feed .story-add{display:flex;align-items:center;justify-content:center}
.circle-home-feed .circle-story-add-trigger{display:grid;place-items:center;width:76px;height:76px;padding:0;border:1px solid rgba(216,174,97,.7);border-radius:50%;color:var(--gold2);background:rgba(198,161,91,.07);cursor:pointer}
.circle-home-feed .circle-story-add-trigger span{font-size:45px;line-height:1}
.circle-home-voice{min-width:0;position:sticky;top:14px;align-self:start}
.circle-home-voice-card{padding:18px;background:var(--panel);border:1px solid rgba(198,161,91,.28);border-radius:15px}
.circle-home-voice-title{display:flex;gap:10px;align-items:center;color:var(--gold2);padding-bottom:12px;border-bottom:1px solid var(--line)}
.circle-home-voice-title h2{font-size:15px;margin:0;line-height:1.35}
.circle-voice-feed{padding-top:10px}.circle-voice-group{padding:12px 0}.circle-voice-group+.circle-voice-group{border-top:1px solid rgba(198,161,91,.24)}
.circle-voice-group-name{font-size:14px;font-weight:750;color:var(--text);margin:0 0 7px}
.circle-voice-channel{padding:7px 0 8px 10px;margin-left:3px;border-left:1px solid rgba(198,161,91,.18)}
.circle-voice-channel+.circle-voice-channel{margin-top:3px}
.circle-voice-channel-name{font-size:12px;color:var(--gold2);font-weight:650;display:flex;align-items:center;gap:6px}
.circle-voice-friends{display:flex;flex-wrap:wrap;gap:7px;margin-top:7px}
.circle-voice-friend{display:inline-flex;align-items:center;gap:5px;color:var(--text);font-size:12px;min-width:0}
.circle-voice-friend img{width:25px;height:25px;min-width:25px;aspect-ratio:1;border-radius:50%;object-fit:cover;border:1px solid var(--gold)}
.circle-voice-friend-name{max-width:118px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.circle-voice-join{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:6px 9px;margin-top:9px;border:1px solid rgba(198,161,91,.43);border-radius:9px;color:var(--gold2);font-size:12px;text-decoration:none}
.circle-voice-join:hover{border-color:var(--gold)}
.circle-story-editor[hidden]{display:none!important}.circle-story-editor{position:fixed;inset:0;z-index:1050;display:grid;place-items:center;padding:16px;background:rgba(7,8,10,.88);backdrop-filter:blur(12px)}
.circle-story-editor-panel{width:min(480px,100%);max-height:94dvh;overflow:auto;background:var(--panel);border:1px solid rgba(198,161,91,.52);border-radius:16px;padding:20px;box-shadow:0 20px 90px rgba(0,0,0,.55)}
.circle-story-editor-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.circle-story-editor-head h2{font-size:20px;margin:0;color:var(--gold2)}
.circle-story-close{font-size:23px;padding:3px 12px}
.circle-story-editor form{display:grid;gap:12px}.circle-story-file{display:block;padding:10px;text-align:center;border:1px dashed rgba(198,161,91,.56);border-radius:10px;color:var(--gold2);cursor:pointer}
.circle-story-file input{display:block;width:100%;margin-top:8px;font-size:12px}
.circle-story-canvas{height:min(50dvh,400px);min-height:220px;position:relative;overflow:hidden;display:grid;place-items:center;background:#0e0f12;border:1px solid var(--line);border-radius:12px;touch-action:none;user-select:none;cursor:grab}
.circle-story-canvas img,.circle-story-canvas video{position:absolute;max-width:none;max-height:none;object-fit:contain}.circle-story-canvas video{max-width:100%;max-height:100%;width:auto;height:auto}
.circle-story-canvas p{text-align:center;padding:16px;color:var(--muted)}
.circle-story-scale-label,.circle-story-caption-label{display:grid;gap:7px;color:var(--muted);font-size:13px}.circle-story-scale-label input{width:100%}
.circle-story-editor-foot{display:flex;justify-content:flex-end;gap:10px}
@media(max-width:1120px){.circle-home-grid{grid-template-columns:minmax(0,1fr) 250px;gap:15px}}
@media(max-width:920px){.circle-home-grid{grid-template-columns:minmax(0,1fr)}.circle-home-voice{position:static}.circle-home-feed .story-card.story-preview-card,.circle-home-feed .story-card.story-add{flex-basis:128px;width:128px;height:180px;min-height:180px}}
@media(max-width:680px){.circle-home-grid{width:100%}.circle-home-feed .story-card.story-preview-card,.circle-home-feed .story-card.story-add{flex-basis:115px;width:115px;height:162px;min-height:162px}.circle-story-editor-panel{padding:14px}}

.circle-story-canvas{width:min(100%,248px);height:auto;aspect-ratio:9/16;max-height:52dvh;min-height:0;margin-inline:auto}

/* Circle 4.7.1 — unified stories header across both home columns. */
.circle-main:has(>.circle-home-grid){width:100%!important;max-width:none!important;min-width:0}
.circle-main>.circle-home-grid{width:100%!important;max-width:1540px;margin-inline:auto;display:grid!important;grid-template-columns:minmax(0,1.65fr) minmax(320px,1fr)!important;gap:20px 24px;align-items:start}
.circle-home-grid>.circle-home-stories{grid-column:1/-1;grid-row:1;min-width:0;width:100%;box-sizing:border-box;padding:0 0 10px;margin:0!important;overflow:hidden}
.circle-home-grid>.circle-home-alert{grid-column:1/-1}
.circle-home-grid>.circle-home-feed{grid-column:1;grid-row:2;min-width:0}
.circle-home-grid>.circle-home-voice{grid-column:2;grid-row:2;position:sticky;top:16px;min-width:0;width:100%;align-self:start}
.circle-home-grid>.circle-home-stories .stories-row{display:flex;overflow-x:auto;gap:17px;max-width:100%;padding:6px 4px 16px}
.circle-home-grid>.circle-home-stories .story-card.story-preview-card,.circle-home-grid>.circle-home-stories .story-card.story-add{flex:0 0 158px;width:158px;height:215px;min-height:215px;border-radius:16px}
.circle-home-grid>.circle-home-voice .circle-home-voice-card{width:100%;box-sizing:border-box;min-height:165px;padding:19px}
/* The story viewer/editor are kept in the feed DOM, but overlays remain fixed. */
.circle-profile-center>.circle-profile-post-tabs:has(.circle-new-post-trigger){grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.circle-profile-post-tabs .circle-new-post-trigger{display:flex;align-items:center;justify-content:center;min-height:52px;padding:10px 16px;border:0;border-left:1px solid rgba(198,161,91,.16);border-right:1px solid rgba(198,161,91,.16);border-radius:0!important;background:transparent!important;color:#e4c17e;font:inherit;font-weight:700;white-space:nowrap;cursor:pointer;box-shadow:none!important}
.circle-profile-post-tabs .circle-new-post-trigger:hover,.circle-profile-post-tabs .circle-new-post-trigger:focus-visible{background:rgba(198,161,91,.09)!important;color:#ffdd95}
.circle-profile-post-tabs:has(.circle-new-post-trigger) a+a{border-left:0!important}
.circle-post-editor[hidden],.circle-post-editor-media[hidden]{display:none!important}
.circle-post-editor{position:fixed;inset:0;z-index:1150;display:grid;place-items:center;padding:16px;background:rgba(4,5,8,.84);backdrop-filter:blur(10px)}
.circle-post-editor-panel{width:min(650px,100%);max-height:min(94dvh,900px);overflow-y:auto;background:#1c1d21;border:1px solid rgba(198,161,91,.5);border-radius:18px;padding:24px;box-shadow:0 25px 70px #0009}
.circle-post-editor-head{display:flex;align-items:start;justify-content:space-between;gap:16px;margin-bottom:22px}.circle-post-editor-head small{font-size:10px;letter-spacing:2px;color:#b69a65}.circle-post-editor-head h2{margin:5px 0 0;color:#e9cb89;font-size:24px}.circle-post-editor-close{font-size:24px;line-height:1;width:38px;height:38px;padding:0}
.circle-post-editor form{display:grid;gap:16px}.circle-post-editor-field{display:grid;gap:8px;min-width:0}.circle-post-editor-field label{font-size:14px;color:#e1c18c;font-weight:700}.circle-post-editor-field input,.circle-post-editor-field textarea{width:100%;box-sizing:border-box}.circle-post-editor-field small{font-size:12px;color:var(--muted)}
.circle-post-editor-media{display:flex;align-items:center;justify-content:center;padding:12px;min-height:100px;max-height:260px;overflow:hidden;border:1px solid rgba(198,161,91,.25);border-radius:12px;background:#101114}.circle-post-editor-media img,.circle-post-editor-media video{max-width:100%;max-height:240px;object-fit:contain;border-radius:9px}
.circle-post-editor-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px}.circle-post-editor-status{color:#f0b9b2;font-size:13px}.circle-post-editor-status:empty{display:none}
@media(max-width:970px){.circle-main>.circle-home-grid{grid-template-columns:minmax(0,1fr) minmax(240px,.65fr)!important;gap:14px}}
@media(max-width:740px){.circle-main>.circle-home-grid{grid-template-columns:minmax(0,1fr)!important}.circle-home-grid>.circle-home-stories{grid-row:1;grid-column:1}.circle-home-grid>.circle-home-feed{grid-row:2;grid-column:1}.circle-home-grid>.circle-home-voice{grid-row:3;grid-column:1;position:static}.circle-home-grid>.circle-home-stories .story-card.story-preview-card,.circle-home-grid>.circle-home-stories .story-card.story-add{flex-basis:135px;width:135px;height:185px;min-height:185px}}
@media(max-width:580px){.circle-profile-post-tabs .circle-new-post-trigger{font-size:12px;padding:8px 5px;white-space:normal;line-height:1.2;text-align:center}.circle-profile-center>.circle-profile-post-tabs:has(.circle-new-post-trigger){grid-template-columns:1fr 1fr 1fr}.circle-post-editor-panel{padding:15px}}
body.circle-post-editor-open{overflow:hidden}

/* Circle 4.7.2: aligned homepage rows, circular story entry, equal action buttons. */
.circle-main>.circle-home-grid{grid-template-rows:auto auto!important;align-content:start!important}
.circle-home-grid>.circle-home-stories{grid-row:1!important;grid-column:1/-1!important;align-self:start!important;margin:0!important;padding:0 0 10px!important}
.circle-home-grid>.circle-home-feed,.circle-home-grid>.circle-home-voice{grid-row:2!important;margin-top:0!important;padding-top:0!important;align-self:start!important}
.circle-home-grid>.circle-home-stories .story-add.circle-story-add-trigger{box-sizing:border-box!important;display:grid!important;place-items:center!important;flex:0 0 92px!important;align-self:center!important;width:92px!important;min-width:92px!important;height:92px!important;min-height:92px!important;aspect-ratio:1!important;margin:0 16px!important;padding:0!important;border-radius:50%!important;border:1px solid rgba(198,161,91,.75)!important;background:rgba(198,161,91,.08)!important;box-shadow:none!important;line-height:1!important}
.circle-home-grid>.circle-home-stories .story-add.circle-story-add-trigger>span{display:block!important;position:static!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;border:none!important;background:none!important;font-size:48px!important;font-weight:300!important;line-height:1!important;transform:none!important}
.circle-profile-center>.circle-profile-post-tabs:has(.circle-new-post-trigger){grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;border:0!important;background:transparent!important;overflow:visible!important}
.circle-profile-post-tabs:has(.circle-new-post-trigger)>a,.circle-profile-post-tabs:has(.circle-new-post-trigger)>.circle-new-post-trigger{box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;min-width:0!important;width:100%!important;min-height:56px!important;height:100%!important;padding:10px 8px!important;border:1px solid rgba(198,161,91,.28)!important;border-radius:11px!important;background:#1b1c20!important;box-shadow:none!important;white-space:normal!important;font-size:clamp(11px,1vw,14px)!important;line-height:1.3!important}
.circle-profile-post-tabs:has(.circle-new-post-trigger)>a.is-active{background:rgba(198,161,91,.13)!important;border-color:rgba(198,161,91,.6)!important;color:var(--gold2)!important}
.circle-profile-post-tabs:has(.circle-new-post-trigger)>.circle-new-post-trigger:hover{background:rgba(198,161,91,.12)!important}
/* Header controls are a single 36px row, irrespective of other card content. */
.feed-post>.post-head>.circle-post-controls,.single-post>.post-head>.circle-post-controls{display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;margin-left:auto!important;flex:0 0 auto!important;order:10!important;height:36px!important}
.feed-post>.post-head>.circle-post-controls>.circle-post-edit-menu,.single-post>.post-head>.circle-post-controls>.circle-post-edit-menu{position:relative!important;width:36px!important;height:36px!important;margin:0!important;flex:0 0 36px!important;z-index:15}
.feed-post>.post-head>.circle-post-controls .circle-post-edit-trigger,.single-post>.post-head>.circle-post-controls .circle-post-edit-trigger,.feed-post>.post-head>.circle-post-controls .circle-post-delete-trigger,.single-post>.post-head>.circle-post-controls .circle-post-delete-trigger{display:grid!important;place-items:center!important;box-sizing:border-box!important;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;margin:0!important;padding:7px!important;border:1px solid rgba(198,161,91,.28)!important;border-radius:9px!important;background:transparent!important;color:#c6a15b!important;cursor:pointer!important}
.circle-post-controls .circle-post-delete-form{display:block!important;margin:0!important;padding:0!important;width:36px!important;height:36px!important;flex:0 0 36px!important}
.circle-post-controls .circle-post-delete-trigger:hover{color:#e49e9e!important;border-color:#ba6262!important}
.circle-post-controls svg{display:block!important;width:20px!important;height:20px!important}
.feed-post>.post-head>.circle-post-controls+.circle-pin-icon-form,.single-post>.post-head>.circle-post-controls+.circle-pin-icon-form{order:11!important;margin-left:0!important}
@media(max-width:740px){.circle-home-grid>.circle-home-feed{grid-row:2!important;grid-column:1!important}.circle-home-grid>.circle-home-voice{grid-row:3!important;grid-column:1!important}.circle-home-grid>.circle-home-stories .story-add.circle-story-add-trigger{width:76px!important;min-width:76px!important;flex-basis:76px!important;height:76px!important;min-height:76px!important}}

/* Circle 4.7.3 — real alignment of first post and voice card.
   Legacy .feed-post margin:12px auto 17px!important was shifting the feed. */
.circle-home-grid > .circle-home-feed > .feed-post{
  margin-top:0!important;
}
.circle-home-grid > .circle-home-feed > .feed-post:first-of-type{
  margin-top:0!important;
}
/* Both columns start at their shared grid row; keep sticky scroll behavior. */
.circle-home-grid > .circle-home-voice > .circle-home-voice-card{
  margin-top:0!important;
}

/* Circle 4.7.4: glyph-independent optical centering of story create plus. */
.circle-home-grid>.circle-home-stories .story-add.circle-story-add-trigger{
 display:flex!important;align-items:center!important;justify-content:center!important;
 text-align:center!important;text-indent:0!important;vertical-align:middle!important;
 line-height:normal!important;
}
.circle-home-grid>.circle-home-stories .story-add.circle-story-add-trigger>.circle-story-plus-icon{
 display:block!important;position:static!important;box-sizing:border-box!important;
 width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;
 margin:0!important;padding:0!important;flex:0 0 34px!important;
 transform:none!important;overflow:visible;pointer-events:none;
}
.circle-home-grid>.circle-home-stories .story-add.circle-story-add-trigger:hover>.circle-story-plus-icon,
.circle-home-grid>.circle-home-stories .story-add.circle-story-add-trigger:focus-visible>.circle-story-plus-icon{
 transform:none!important;
}

/* Circle 4.7.5: wider community rail and full dedicated creation screen */
@media(min-width:901px){
 .layout{grid-template-columns:86px 300px minmax(0,1fr)!important}
 body.sidebar-collapsed .layout{grid-template-columns:72px 300px minmax(0,1fr)!important}
 .layout>.community-rail{padding-inline:16px;gap:14px}
 .community-rail-meta strong{font-size:14px!important}
 .community-rail-meta small{font-size:11px!important}
}
.community-rail-heading .community-rail-add{display:flex;align-items:center;justify-content:center;padding:0;flex-shrink:0}
.community-rail-heading .community-rail-add svg{display:block;flex:none}
.circle-community-create-page{width:100%;max-width:1500px;margin:0 auto;padding-top:0;min-width:0}
.circle-community-create-page .circle-community-editor{margin-top:0}
.circle-community-create-page .circle-community-preview-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.community-create-link{display:inline-flex;align-items:center;color:var(--gold2);padding:10px 14px;border:1px solid rgba(198,161,91,.35);border-radius:10px;text-decoration:none}
@media(max-width:900px){.layout>.community-rail{padding-inline:10px}}


/* Circle 4.7.7: widen the PRIMARY navigation, not the groups rail.
   Group rail restored to 4.7.5 width (300px on desktop).
   The collapsed navigation remains icon-only and does not waste horizontal space. */
@media (min-width:901px){
  .layout{grid-template-columns:146px 300px minmax(0,1fr)!important}
  body.sidebar-collapsed .layout{grid-template-columns:72px 300px minmax(0,1fr)!important}
  .layout>.sidebar.circle-sidebar{padding-inline:12px!important}
  .primary-nav .nav-item>span:not(.nav-icon){font-size:12.5px!important;overflow:visible!important;text-overflow:clip!important}
  .layout>.community-rail{min-width:0;overflow:hidden}
  .layout>.circle-main{min-width:0;max-width:100%;overflow-x:hidden}
}
@media (min-width:681px) and (max-width:900px){
  .layout{grid-template-columns:126px 210px minmax(0,1fr)!important}
  body.sidebar-collapsed .layout{grid-template-columns:70px 210px minmax(0,1fr)!important}
  .layout>.sidebar.circle-sidebar{padding-inline:9px!important}
  .primary-nav .nav-item>span:not(.nav-icon){font-size:11.5px!important}
  .layout>.community-rail{min-width:0;overflow:hidden}
  .layout>.circle-main{min-width:0;max-width:100%;overflow-x:hidden}
}
@media (min-width:681px){
  body.sidebar-collapsed .layout>.sidebar.circle-sidebar{padding-inline:6px!important}
  body.sidebar-collapsed .primary-nav .nav-item>span:not(.nav-icon){display:none!important}
  .community-rail-heading .community-rail-add{width:36px;height:36px;min-width:36px;flex:0 0 36px;border-radius:11px}
  .community-rail-heading .community-rail-add svg{width:21px;height:21px}
}

/* Circle 4.8.0 — dedicated authentication flow and onboarding. */
body:has(> .circle-auth-shell){min-height:100dvh;background:#0d0f12;overflow-x:hidden}
.circle-auth-shell{position:relative;isolation:isolate;min-height:100dvh;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:24px clamp(16px,4vw,70px);overflow:hidden}
.circle-auth-shell *{box-sizing:border-box}
.circle-auth-motion{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 20% 55%,rgba(198,161,91,.12),transparent 48%),radial-gradient(ellipse at 85% 10%,rgba(95,77,42,.08),transparent 45%),#0d0f12}
.circle-auth-motion span{position:absolute;border:1px solid rgba(198,161,91,.2);border-radius:50%;animation:circle-auth-drift 24s ease-in-out infinite alternate;will-change:transform;box-shadow:0 0 65px rgba(198,161,91,.025)}
.circle-auth-motion span:nth-child(1){width:560px;height:560px;left:-110px;top:13%;animation-duration:28s}
.circle-auth-motion span:nth-child(2){width:350px;height:350px;left:16%;top:38%;animation-duration:32s;animation-delay:-13s}
.circle-auth-motion span:nth-child(3){width:850px;height:850px;left:-310px;top:-310px;animation-duration:42s;animation-delay:-8s}
.circle-auth-motion span:nth-child(4){width:200px;height:200px;left:51%;top:10%;animation-duration:35s;animation-delay:-20s}
.circle-auth-motion span:nth-child(5){width:90px;height:90px;left:62%;top:75%;animation-duration:28s;animation-delay:-7s}
@keyframes circle-auth-drift{from{transform:translate3d(0,0,0) rotate(0)}to{transform:translate3d(34px,-44px,0) rotate(18deg)}}
.circle-auth-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,470px);gap:clamp(30px,7vw,150px);width:min(1440px,100%);align-items:center}
.circle-auth-panel-wrap{grid-column:2;min-width:0;width:100%;display:flex;flex-direction:column;align-items:stretch;gap:18px}
.circle-auth-content{min-height:430px;display:flex;align-items:center;justify-content:center;position:relative}
.circle-auth-orbit{position:relative;width:min(40vw,340px);height:min(40vw,340px);border-radius:50%;border:1px solid rgba(198,161,91,.13);box-shadow:0 0 0 35px rgba(198,161,91,.012),0 0 0 85px rgba(198,161,91,.01)}
.circle-auth-orbit i{position:absolute;width:8px;height:8px;background:#c6a15b;border-radius:50%;box-shadow:0 0 15px #c6a15b}
.circle-auth-orbit i:nth-child(1){left:14%;top:15%}.circle-auth-orbit i:nth-child(2){right:5%;top:42%}.circle-auth-orbit i:nth-child(3){left:42%;bottom:0}
.circle-auth-brand{display:flex;justify-content:center;align-items:center;gap:16px;color:#ecc77c;text-decoration:none;margin-bottom:8px}
.circle-auth-brand img{width:65px;height:65px;filter:drop-shadow(0 0 15px rgba(198,161,91,.3))}
.circle-auth-brand strong{font-size:36px;letter-spacing:.035em;font-weight:800;line-height:1.1}
.circle-auth-panel{background:rgba(24,26,30,.94);border:1px solid rgba(198,161,91,.34);border-radius:19px;padding:clamp(22px,3vw,35px);box-shadow:0 20px 65px rgba(0,0,0,.36);display:grid;gap:18px}
.circle-auth-panel h1{font-size:23px;margin:0;color:#e9c57e}
.circle-auth-panel form{display:grid;gap:18px}
.circle-auth-panel label,.circle-auth-register label{display:grid;gap:6px;color:#d4d3d0;font-size:13px;font-weight:600}
.circle-auth-panel input,.circle-auth-register input:not([type=range]),.circle-auth-register textarea,.circle-auth-register select{width:100%;min-width:0;max-width:100%;background:#111316;color:var(--text);border:1px solid #37383d;border-radius:10px;padding:12px 13px;font:inherit}
.circle-auth-panel input:focus-visible,.circle-auth-register input:focus-visible,.circle-auth-register textarea:focus-visible{outline:2px solid rgba(198,161,91,.8);outline-offset:1px}
.circle-auth-actions{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:9px}
.circle-auth-actions a{font-size:12px;color:#e2be75;text-decoration:none;text-align:center;white-space:normal}
.circle-auth-actions a:hover{text-decoration:underline}
.circle-auth-actions .primary{min-width:96px;min-height:43px}
.circle-auth-link{color:#e4be77;text-decoration:none;display:inline-flex;align-self:start;align-items:center;padding:9px 0;background:transparent;border:0;font:inherit;cursor:pointer;font-size:13px}
.circle-auth-link:hover{text-decoration:underline}
.circle-auth-panel button[type=submit]:not(.circle-auth-link){min-height:44px}
/* Registration expands into a full-page profile onboarding workspace. */
.circle-auth-shell:has(.circle-auth-register){align-items:flex-start;overflow:visible;padding-block:35px 70px}
.circle-auth-shell:has(.circle-auth-register) .circle-auth-layout{grid-template-columns:1fr;gap:0;width:min(1420px,100%)}
.circle-auth-shell:has(.circle-auth-register) .circle-auth-content{display:none}
.circle-auth-shell:has(.circle-auth-register) .circle-auth-panel-wrap{grid-column:1;width:100%}
.circle-auth-register{background:rgba(15,16,19,.89);border:1px solid rgba(198,161,91,.21);border-radius:20px;padding:clamp(15px,2vw,26px);min-width:0}
.circle-auth-register>h1{font-size:24px;color:#e9c57e;margin:0 0 4px}
.circle-auth-register>.muted{margin:0 0 23px}
.circle-auth-register-grid{display:grid;grid-template-columns:minmax(245px,330px) minmax(0,1fr);align-items:start;gap:16px;min-width:0}
.circle-auth-preview{min-width:0;display:grid;gap:15px;position:sticky;top:16px}
.circle-auth-preview-card,.circle-auth-preview-about{border-radius:17px;border:1px solid rgba(198,161,91,.26);background:#191b1f;overflow:hidden}
.circle-auth-preview-cover{height:128px;background:linear-gradient(120deg,#231d17,#363024,#181a1f);background-size:cover;background-position:center}
.circle-auth-preview-identity{display:flex;align-items:center;gap:14px;padding:15px}
.circle-auth-preview-avatar{flex:0 0 76px;width:76px;height:76px;display:flex;align-items:center;justify-content:center;border:2px solid #c6a15b;border-radius:50%;background:#27221c;color:#e5c680;font-size:30px;position:relative;overflow:hidden}
.circle-auth-preview-avatar img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;border-radius:50%}
.circle-auth-preview-identity strong{display:block;font-size:17px;color:#e9c47b;overflow-wrap:anywhere}
.circle-auth-preview-identity small{display:block;color:#a8a8af}
.circle-auth-preview-identity span{display:block;font-size:13px;color:#c4b9a5}
.circle-auth-preview-about{padding:16px}.circle-auth-preview-about strong{color:#e8c47c}.circle-auth-preview-about p{overflow-wrap:anywhere;white-space:pre-wrap;margin-bottom:0}
.circle-auth-register-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.circle-auth-register-cards .circle-setting-card{min-height:0;gap:12px}
.circle-auth-register-cards .circle-setting-card h3{margin:0;color:#e6c27b;font-size:16px}
.circle-auth-register-cards .circle-crop-viewport{max-width:100%}
.circle-auth-register-cards .circle-crop-avatar{width:min(210px,100%);height:auto;aspect-ratio:1}
.circle-auth-register-cards .circle-crop-cover{width:100%;height:auto;aspect-ratio:3}
.circle-auth-register-cards .circle-crop-controls label{width:100%}
.circle-auth-register-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:22px}
.circle-auth-register-footer>div{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
@media(max-width:900px){.circle-auth-layout{grid-template-columns:minmax(0,1fr);max-width:500px}.circle-auth-panel-wrap{grid-column:1}.circle-auth-content{display:none}.circle-auth-register-grid{grid-template-columns:1fr}.circle-auth-preview{position:static}.circle-auth-register-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.circle-auth-shell{padding:22px 12px 40px;min-height:100dvh}.circle-auth-panel{padding:19px 16px}.circle-auth-brand img{width:49px;height:49px}.circle-auth-brand strong{font-size:30px}.circle-auth-actions{gap:6px}.circle-auth-actions a{font-size:11px}.circle-auth-actions .primary{min-width:76px;padding-inline:9px}.circle-auth-register-cards{grid-template-columns:1fr}.circle-auth-register-footer>div{width:100%;justify-content:space-between}.circle-auth-register-grid{gap:12px}.circle-auth-register{padding:14px}}
@media(prefers-reduced-motion:reduce){.circle-auth-motion span{animation:none!important}}

/* Circle 4.8.1 — gap-free independent registration cards, animated identity backdrop. */
body:has(> .circle-auth-shell){background-color:#0d0f12}
.circle-auth-shell .circle-auth-motion{
  background-color:#0d0f12!important;
  background-image:linear-gradient(90deg,rgba(9,11,14,.55),rgba(9,11,14,.35) 48%,rgba(9,11,14,.76)),url('/assets/auth-network.gif')!important;
  background-position:center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  position:fixed;inset:0;
}
.circle-auth-shell .circle-auth-motion span{display:none!important}
.circle-auth-shell:has(.circle-auth-register) .circle-auth-motion{
  background-image:linear-gradient(90deg,rgba(9,11,14,.83),rgba(9,11,14,.75)),url('/assets/auth-network.gif')!important;
}
.circle-auth-register-cards{
  display:block!important;
  columns:2;
  column-gap:16px;
  width:100%;
}
.circle-auth-register-cards>.circle-setting-card{
  display:flex!important;
  width:100%;
  height:auto!important;
  margin:0 0 16px!important;
  break-inside:avoid;
  -webkit-column-break-inside:avoid;
  page-break-inside:avoid;
  vertical-align:top;
}
@media(max-width:640px){
  .circle-auth-register-cards{columns:1;column-gap:0}
  .circle-auth-register-cards>.circle-setting-card{margin-bottom:12px!important}
}
@media(prefers-reduced-motion:reduce){
 .circle-auth-shell .circle-auth-motion{background-image:linear-gradient(120deg,#111316,#1b1a18 50%,#0d0f12)!important}
}

/* Circle 4.8.2 — efficient hardware-decodable video instead of animated GIF. */
.circle-auth-shell .circle-auth-motion{
 background-color:#0d0f12!important;
 background-image:linear-gradient(90deg,rgba(9,11,14,.53),rgba(9,11,14,.39) 48%,rgba(9,11,14,.81)),url('/assets/auth-network-poster.jpg')!important;
 background-size:cover!important;
 background-position:center!important;
 overflow:hidden;
}
.circle-auth-shell .circle-auth-motion .circle-auth-video{
 display:block;position:absolute;inset:0;width:100%;height:100%;
 object-fit:cover;object-position:center;pointer-events:none;
}
.circle-auth-shell .circle-auth-motion::after{
 content:"";position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(90deg,rgba(9,11,14,.53),rgba(9,11,14,.39) 48%,rgba(9,11,14,.81));
}
.circle-auth-shell:has(.circle-auth-register) .circle-auth-motion{
 background-image:linear-gradient(90deg,rgba(9,11,14,.85),rgba(9,11,14,.78)),url('/assets/auth-network-poster.jpg')!important;
}
.circle-auth-shell:has(.circle-auth-register) .circle-auth-motion::after{
 background:linear-gradient(90deg,rgba(9,11,14,.85),rgba(9,11,14,.78));
}
@media(prefers-reduced-motion:reduce){
 .circle-auth-shell .circle-auth-motion .circle-auth-video{display:none!important}
 .circle-auth-shell .circle-auth-motion{background-image:linear-gradient(120deg,#111316,#1b1a18 50%,#0d0f12)!important}
}

/* Circle 4.8.3 — crisp high-resolution video background on desktop.
   Mobile keeps the original lightweight clip. */
.circle-auth-shell .circle-auth-motion{
 background-image:linear-gradient(90deg,rgba(9,11,14,.53),rgba(9,11,14,.39) 48%,rgba(9,11,14,.81)),url('/assets/auth-network-hd-poster.jpg')!important;
}
.circle-auth-shell:has(.circle-auth-register) .circle-auth-motion{
 background-image:linear-gradient(90deg,rgba(9,11,14,.85),rgba(9,11,14,.78)),url('/assets/auth-network-hd-poster.jpg')!important;
}
@media(max-width:900px){
 .circle-auth-shell .circle-auth-motion{background-image:linear-gradient(90deg,rgba(9,11,14,.53),rgba(9,11,14,.39) 48%,rgba(9,11,14,.81)),url('/assets/auth-network-poster.jpg')!important}
 .circle-auth-shell:has(.circle-auth-register) .circle-auth-motion{background-image:linear-gradient(90deg,rgba(9,11,14,.85),rgba(9,11,14,.78)),url('/assets/auth-network-poster.jpg')!important}
}
@media(prefers-reduced-motion:reduce){
 .circle-auth-shell .circle-auth-motion,
 .circle-auth-shell:has(.circle-auth-register) .circle-auth-motion{background-image:linear-gradient(120deg,#111316,#1b1a18 50%,#0d0f12)!important}
}

/* Circle 4.9.0 — achievements: Relic medals + Prestige typography + Ascension rarity. */
.circle-profile-achievements .circle-achievements-mini{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:12px 0}
.circle-achievements-open{display:inline-flex;margin-top:10px;color:#d8b673;font-size:13px;text-decoration:none}
.circle-achievements-open:hover{text-decoration:underline}
.circle-achievements-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 20px;flex-wrap:wrap}
.circle-achievements-header a{color:#d8b673;text-decoration:none}
.circle-achievements-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:14px;align-items:stretch;padding-bottom:28px}
.circle-medal{--medal-color:#afb4bd;--medal-fade:rgba(175,180,189,.15);display:flex;align-items:center;gap:15px;min-width:0;position:relative;background:linear-gradient(145deg,#25262b,#191b1f);border:1px solid var(--medal-fade);border-radius:15px;padding:17px 13px;box-sizing:border-box;overflow:hidden}
.circle-medal-rare{--medal-color:#69b8e7;--medal-fade:rgba(105,184,231,.25)}
.circle-medal-epic{--medal-color:#b68bf1;--medal-fade:rgba(182,139,241,.28)}
.circle-medal-legendary{--medal-color:#eac36f;--medal-fade:rgba(234,195,111,.31)}
.circle-medal-exclusive{--medal-color:#eee0bc;--medal-fade:rgba(238,224,188,.38)}
.circle-medal.is-locked{filter:saturate(.48);opacity:.74}
.circle-medal-emblem{width:74px;height:74px;flex:0 0 74px;border-radius:50%;border:2px solid var(--medal-color);display:grid;place-items:center;box-shadow:inset 0 0 0 3px #202126,inset 0 0 0 5px var(--medal-fade);background:#121416;color:var(--medal-color);position:relative}
.circle-medal-core{border:1px solid var(--medal-fade);width:54px;height:54px;border-radius:50%;display:grid;place-items:center}
.circle-medal-core svg{width:31px;height:31px;display:block}
.circle-medal-epic .circle-medal-core{border-radius:15px;transform:rotate(45deg)}
.circle-medal-epic .circle-medal-core svg{transform:rotate(-45deg)}
.circle-medal-legendary .circle-medal-emblem{border-style:double;border-width:4px}
.circle-medal-exclusive .circle-medal-emblem{border-style:double;border-width:5px}
.circle-medal-info{min-width:0;display:flex;flex-direction:column;gap:4px;align-items:start;overflow-wrap:anywhere}
.circle-medal-info strong{font-size:15px;line-height:1.25;color:#f4f1ea}
.circle-medal-rarity{font-size:11px!important;color:var(--medal-color);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.circle-medal-info p{font-size:13px;line-height:1.45;margin:4px 0;color:#bfc0c5}
.circle-medal-info small{color:#a9aab0;font-size:11px}
.circle-medal-info progress{width:100%;height:6px;accent-color:var(--medal-color);margin-top:5px}
.circle-medal.is-compact{padding:9px 7px;gap:8px;border-radius:11px;min-width:0}
.circle-medal.is-compact .circle-medal-emblem{width:43px;height:43px;flex-basis:43px;border-width:1px}
.circle-medal.is-compact .circle-medal-core{width:33px;height:33px}
.circle-medal.is-compact .circle-medal-core svg{width:19px;height:19px}
.circle-medal.is-compact .circle-medal-info strong{font-size:11px}
.circle-medal.is-compact .circle-medal-rarity{font-size:9px!important;letter-spacing:0}
.circle-admin-achievements form{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:12px 0}
.circle-admin-achievements form label{flex:1 1 145px;min-width:0}
@media(prefers-reduced-motion:no-preference){
 .circle-medal-epic.is-earned .circle-medal-emblem{animation:circle-medal-pulse 4.5s ease-in-out infinite}
 .circle-medal-legendary.is-earned .circle-medal-emblem{animation:circle-medal-shine 5.2s ease-in-out infinite}
 .circle-medal-exclusive.is-earned .circle-medal-emblem{animation:circle-medal-shine 6s ease-in-out infinite}
}
@keyframes circle-medal-pulse{0%,100%{box-shadow:inset 0 0 0 3px #202126,0 0 4px var(--medal-fade)}50%{box-shadow:inset 0 0 0 3px #202126,0 0 15px var(--medal-fade)}}
@keyframes circle-medal-shine{0%,100%{box-shadow:inset 0 0 0 3px #202126,0 0 5px var(--medal-fade)}50%{box-shadow:inset 0 0 0 3px #202126,0 0 20px var(--medal-fade)}}
@media(max-width:720px){.circle-achievements-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}.circle-profile-achievements .circle-achievements-mini{grid-template-columns:repeat(2,minmax(0,1fr))}.circle-medal{padding:12px 10px}.circle-medal-emblem{width:60px;height:60px;flex-basis:60px}.circle-medal-core{width:46px;height:46px}}
@media(max-width:380px){.circle-profile-achievements .circle-achievements-mini{grid-template-columns:1fr}}


/* Circle 4.9.11: consistent, legible real display names. Maintain text ellipsis
   inside narrow columns while keeping verified mark on the same line. */
.circle-profile-left .profile-name h1,
.profile-hero .profile-name h1{font-size:clamp(20px,1.65vw,26px)!important;line-height:1.24!important;font-weight:800!important;letter-spacing:-.015em!important;margin:3px 0 7px!important;min-width:0}
.circle-profile-left .profile-name h1 .circle-identity-inline,
.profile-hero .profile-name h1 .circle-identity-inline{font-size:inherit!important;font-weight:inherit!important;max-width:100%!important;}
.feed-post .post-author>strong,.single-post .post-author>strong,.post-author>strong{font-size:15px!important;line-height:1.4!important;font-weight:750!important}
.post-comment-copy>strong{font-size:14px!important;line-height:1.4!important}
.friend-card-name,.member-row>.circle-identity-inline,.community-member-identity .circle-identity-inline{font-size:14px!important;line-height:1.35!important;font-weight:700!important}
.dm-peer-info strong,.dm-conversation-list .conversation-link>strong{font-size:14px!important;line-height:1.4!important;font-weight:750!important}
.circle-profile-friend>.circle-identity-inline{font-size:12px!important;line-height:1.3!important;font-weight:650!important}
/* Compact single-row metadata (dates, muted handles) stay secondary. */
@media(max-width:680px){
 .circle-profile-left .profile-name h1,.profile-hero .profile-name h1{font-size:clamp(18px,5vw,22px)!important}
 .friend-card-name,.member-row>.circle-identity-inline{font-size:13px!important}
 .dm-peer-info strong,.dm-conversation-list .conversation-link>strong{font-size:13px!important}
 .post-author>strong{font-size:14px!important}
 .circle-profile-friend>.circle-identity-inline{font-size:11.5px!important}
}


/* Circle 4.9.12 — authoritative post author typography. Older generic rules
   (.post-author span) used to shrink nested identity labels to 10px. Target the
   name specifically, for home feed, profile posts, community posts, permalink. */
.feed-post .post-head .post-author,
.single-post .post-head .post-author{min-width:0!important;flex:1 1 auto;}
.feed-post .post-head .post-author > strong,
.feed-post .post-head .post-author > a > strong,
.single-post .post-head .post-author > strong,
.single-post .post-head .post-author > a > strong{
  display:block!important;min-width:0!important;max-width:100%!important;
  font-size:17px!important;line-height:1.3!important;font-weight:800!important;
  letter-spacing:-.015em!important;color:#f2e5c8!important;
}
.feed-post .post-head .post-author .circle-identity-inline,
.single-post .post-head .post-author .circle-identity-inline{
  font-size:inherit!important;line-height:inherit!important;font-weight:inherit!important;
  color:inherit!important;max-width:100%!important;
}
.feed-post .post-head .post-author .circle-identity-inline > .circle-identity-label,
.single-post .post-head .post-author .circle-identity-inline > .circle-identity-label{
  font-size:17px!important;line-height:1.3!important;font-weight:800!important;
  letter-spacing:-.015em!important;color:#f2e5c8!important;
}
.feed-post .post-head .post-author > span,
.single-post .post-head .post-author > span{
  font-size:11px!important;line-height:1.4!important;font-weight:450!important;
  color:var(--muted)!important;letter-spacing:0!important;
}
.feed-post .post-head .post-author > a{min-width:0;max-width:100%;display:block;}
@media(max-width:680px){
 .feed-post .post-head .post-author > strong,
 .feed-post .post-head .post-author > a > strong,
 .single-post .post-head .post-author > strong,
 .single-post .post-head .post-author > a > strong,
 .feed-post .post-head .post-author .circle-identity-inline > .circle-identity-label,
 .single-post .post-head .post-author .circle-identity-inline > .circle-identity-label{font-size:16px!important;}
}


/* 4.9.18 — unified compact, scrollable, newest-first comment timeline */
.social-interactions .circle-comment-panel{margin-top:14px;min-width:0;width:100%;border:1px solid rgba(198,161,91,.22);border-radius:15px;background:#15171bb8;overflow:hidden}
.circle-comment-panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid rgba(198,161,91,.16)}
.circle-comment-panel-head strong{color:#e7ca91;font-size:13px;font-weight:700}.circle-comment-panel-count{color:#f7d9a0;margin-left:5px;font-variant-numeric:tabular-nums}
.circle-comment-panel-hint{font-size:11px;color:#a6a5a8}
.social-interactions .circle-comment-panel .social-comment-list{display:flex!important;flex-direction:column!important;gap:7px!important;max-height:390px!important;min-height:0!important;margin:0!important;padding:9px!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#896c3d #1b1d21}
.circle-comment-panel .post-comment-row{flex:0 0 auto;gap:9px!important;padding:9px 10px!important;border-radius:10px!important;min-width:0}
.circle-comment-panel .post-comment-avatar{width:32px!important;height:32px!important;flex:0 0 32px!important}
.circle-comment-panel .post-comment-copy,.circle-comment-panel .post-comment-content{gap:4px!important}
.circle-comment-panel .post-comment-copy strong{font-size:13px!important;line-height:1.4!important}
.circle-comment-panel .post-comment-copy p{font-size:13px!important;line-height:1.5!important;padding:5px 8px!important}
.circle-comment-panel .post-comment-actions{min-height:0!important;gap:5px!important}
.circle-comment-panel .post-comment-actions .comment-action-button{min-height:30px!important;min-width:30px!important;padding:4px 6px!important}
.circle-comment-panel .post-comment-time{font-size:10px!important}
.circle-comment-more{min-height:22px;text-align:center;font-size:11px;color:#9e9a93;padding:3px 9px}
@media(max-width:600px){.social-interactions .circle-comment-panel .social-comment-list{max-height:320px!important;padding:7px!important}.circle-comment-panel-head{padding:10px 11px}.circle-comment-panel .post-comment-row{padding:8px!important}.circle-comment-panel .post-comment-avatar{width:28px!important;height:28px!important;flex:0 0 28px!important}.circle-comment-panel-hint{font-size:10px}}


/* 4.9.19 — text-first comments and responsive quoted replies */
.social-interactions .social-interaction-row .circle-comment-display{display:none!important}
.circle-comment-panel .post-comment-row{background:transparent!important;border:0!important;box-shadow:none!important;padding:12px 10px!important;border-bottom:1px solid rgba(201,176,128,.12)!important;border-radius:0!important}
.circle-comment-panel .post-comment-row:last-child{border-bottom:0!important}
.circle-comment-panel .post-comment-copy{min-width:0!important}
.circle-comment-panel .post-comment-copy strong{font-size:14px!important;font-weight:700!important;color:#e9d2a9!important}
.circle-comment-panel .post-comment-copy p{padding:0!important;margin:5px 0 0!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;font-size:16px!important;line-height:1.6!important;color:#e8e5df!important;letter-spacing:.005em;white-space:pre-wrap;overflow-wrap:break-word!important}
.circle-comment-panel .comment-reply-reference{display:flex!important;flex-direction:column!important;gap:2px!important;min-width:0!important;max-width:100%;padding:5px 0 5px 11px!important;margin:5px 0 3px!important;background:transparent!important;border:0!important;border-left:2px solid #cfae76!important;border-radius:0!important;text-decoration:none!important;font-size:12px!important;line-height:1.45!important;cursor:pointer}
.comment-reply-reference-name{font-weight:700!important;color:#e0bd82!important;font-size:12px!important}
.comment-reply-reference-text{min-width:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#aeb0b6!important;overflow-wrap:anywhere}
.circle-comment-panel .comment-reply-reference:hover .comment-reply-reference-name{color:#f7d8a2!important}
.social-comment-form .comment-reply-notice{display:flex!important;align-items:center!important;gap:10px!important;border:0!important;border-left:3px solid #cfad74!important;border-radius:5px!important;background:rgba(207,173,116,.06)!important;padding:9px 11px!important}
.comment-reply-summary{display:flex!important;flex-direction:column!important;gap:3px;flex:1;min-width:0;overflow:hidden}
.comment-reply-summary strong{font-size:13px!important;color:#e8c787!important;line-height:1.35!important}
.comment-reply-summary>span{font-size:12px!important;color:#aeb0b6!important;line-height:1.4!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.comment-reply-cancel{flex:0 0 auto}
.circle-comment-panel .post-comment-actions .comment-delete-button{color:#b7aca4!important;opacity:.75}
.circle-comment-panel .post-comment-actions .comment-delete-button:hover,.circle-comment-panel .post-comment-actions .comment-delete-button:focus-visible{color:#f0aa91!important;opacity:1}
.comment-delete-feedback{font-size:12px;color:#f3aaa0;max-width:200px;overflow-wrap:break-word}
.circle-comment-highlight{outline:1px solid rgba(224,189,130,.7)!important;outline-offset:-1px;transition:outline-color .5s}
@media(max-width:600px){.circle-comment-panel .post-comment-copy p{font-size:15px!important;line-height:1.55!important}.circle-comment-panel .post-comment-row{padding:10px 4px!important}.circle-comment-panel .comment-reply-reference{padding-left:9px!important}.comment-reply-summary>span{-webkit-line-clamp:1}}
@media(prefers-reduced-motion:reduce){.circle-comment-highlight{transition:none!important}}

/* Circle 4.9.22 — moderation audit remains readable on all widths. */
.circle-moderation-log-list{display:grid;gap:10px;max-height:540px;overflow:auto;overscroll-behavior:contain}
.circle-moderation-log-item{padding:12px 14px;border:1px solid rgba(212,187,130,.24);border-radius:12px;background:rgba(255,255,255,.025);min-width:0;overflow-wrap:anywhere}
.circle-moderation-log-head{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap;color:#e8cd94}
.circle-moderation-log-head time{font-size:12px;color:#a7a5a0}
.circle-moderation-log-item p{font-size:14px;line-height:1.55;margin:7px 0 0;white-space:normal}
@media(max-width:600px){.circle-moderation-log-item{padding:10px}.circle-moderation-log-list{max-height:420px}}

.circle-role-permissions{margin:18px 0;padding:14px;border:1px solid rgba(212,187,130,.22);border-radius:14px}
.circle-role-permission-item{display:grid;gap:9px;min-width:0;padding:12px 0;border-top:1px solid rgba(212,187,130,.14)}
.circle-role-permission-item label{display:flex;align-items:center;gap:9px;line-height:1.4;font-size:13px}
.circle-role-permission-item input[type=checkbox]{accent-color:#d4bb82;flex:none}
.circle-role-permission-item button{justify-self:start}

/* Circle 4.9.23: separated community banner and editorial information card. */
.group-hero{background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;display:flex;flex-direction:column;gap:16px;margin-bottom:24px!important}
.group-hero>.group-cover{height:clamp(235px,25vw,330px)!important;min-height:235px!important;border:1px solid color-mix(in srgb,var(--group-accent,#c6a15b) 46%,transparent);border-radius:20px;overflow:hidden!important;isolation:isolate;padding:25px 28px!important;box-shadow:0 16px 38px #0005}
.group-hero>.group-title-row{position:relative!important;margin:0!important;padding:22px 24px!important;min-height:155px;display:flex;align-items:center!important;gap:18px;flex-wrap:wrap;border:1px solid color-mix(in srgb,var(--group-accent,#c6a15b) 42%,transparent);background:linear-gradient(115deg,#1e2025,#17191e 72%);border-radius:18px;box-shadow:0 10px 24px #0003}
.group-hero .group-identity{align-items:center;gap:18px;min-width:200px}
.group-hero .group-avatar-large{flex:0 0 94px;width:94px;height:94px;border-radius:23px}
.group-hero .group-heading-info{flex:1;min-width:0}
.group-hero .group-title-row h1{font-size:clamp(23px,2.3vw,32px)!important;line-height:1.25;letter-spacing:-.025em;overflow-wrap:normal;word-break:normal}
.group-hero .group-description{font-size:clamp(14px,1.12vw,16px)!important;line-height:1.6!important;max-width:740px;margin:8px 0 12px;overflow-wrap:break-word}
.group-hero .group-stats{font-size:12px;gap:8px 14px}
.group-hero .group-hero-actions{max-width:none!important;flex:0 1 auto;display:flex;align-items:center;justify-content:flex-end;padding:0!important;gap:10px}
.group-hero .group-hero-actions .subtle-link,.group-hero .group-member-badge,.group-hero .circle-news-new-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;font-size:13px!important;font-weight:700;line-height:1.35;border-radius:12px;padding:11px 16px!important;text-decoration:none;white-space:normal;text-align:center}
.group-hero .circle-news-new-btn{background:linear-gradient(115deg,#d5b777,#efd19b);border:1px solid #d5b777;color:#151515;box-shadow:0 3px 14px #d5b77736}
.group-hero .circle-news-new-btn:hover{filter:brightness(1.1)}
.circle-community-identity{display:inline-flex!important;align-items:center!important;gap:6px!important;max-width:100%;min-width:0;vertical-align:middle!important;flex-wrap:nowrap}
.circle-community-identity .circle-identity-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.circle-community-verified{display:inline-block!important;flex:0 0 18px!important;width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important;color:#d4bb82!important;vertical-align:middle!important;transform:none!important;position:static!important;filter:drop-shadow(0 0 3px #d4bb824d)}
.group-hero h1 .circle-community-verified{width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;flex-basis:22px!important}
.post-head .circle-community-post-avatar{width:42px;height:42px;display:inline-grid;place-items:center;overflow:hidden;border-radius:50%;border:1px solid #d4bb82;color:#d4bb82;background:#222}
.circle-community-post-avatar img{height:100%;width:100%;object-fit:cover}
.circle-news-editor-page{max-width:900px;margin:0 auto;padding:12px 0 36px}
.circle-news-back{display:inline-block;margin-bottom:18px;color:var(--gold2);text-decoration:none}
.circle-news-editor-card{padding:clamp(22px,4vw,42px);border:1px solid #9a7b46aa;border-radius:20px;background:linear-gradient(145deg,#22232a,#17181c 75%);box-shadow:0 20px 60px #0004}
.circle-news-editor-card h1{font-size:clamp(25px,3vw,36px);margin:7px 0}
.circle-news-editor-card form{display:flex;flex-direction:column;gap:18px;margin-top:25px}
.circle-news-editor-card form>label{display:flex;flex-direction:column;gap:9px;font-size:14px;font-weight:650;color:#ead3a9}
.circle-news-editor-card input[name=title],.circle-news-editor-card textarea{width:100%;font-size:16px;line-height:1.6;padding:14px;background:#141518;border:1px solid #756443;border-radius:12px;color:var(--text);box-sizing:border-box}
.circle-news-identity{display:flex;gap:17px;flex-wrap:wrap;padding:16px;border:1px solid #73603e;border-radius:12px}
.circle-news-identity legend{font-size:14px;color:#ead3a9;font-weight:700;padding:0 8px}
.circle-news-identity label{display:inline-flex;gap:9px;align-items:center;font-size:14px}
.circle-news-editor-hint{color:#d4bb82;font-size:13px}
.circle-news-editor-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px}
.circle-news-editor-actions button{min-height:46px;padding:12px 22px}
@media(max-width:900px){.group-hero>.group-title-row{align-items:flex-start!important}.group-hero .group-hero-actions{width:100%;justify-content:flex-start!important}}
@media(max-width:680px){.group-hero{gap:12px;margin-bottom:18px!important}.group-hero>.group-cover{height:210px!important;min-height:210px!important;padding:17px!important;border-radius:15px}.group-hero>.group-title-row{padding:16px!important;margin:0!important;gap:15px;border-radius:14px}.group-hero .group-identity{align-items:center;gap:12px;min-width:0}.group-hero .group-avatar-large{width:70px;height:70px;flex:0 0 70px}.group-hero .group-title-row h1{font-size:23px!important}.group-hero .group-description{font-size:14px!important}.group-hero .group-hero-actions{padding:0!important;gap:8px}.group-hero .group-hero-actions .subtle-link,.group-hero .group-member-badge,.group-hero .circle-news-new-btn{min-height:42px;font-size:12px!important;padding:10px 13px!important}.circle-news-editor-card{padding:18px}.circle-news-editor-actions{justify-content:stretch}.circle-news-editor-actions>*{flex:1;text-align:center}}
@media(max-width:350px){.group-hero .group-identity{flex-wrap:wrap}.group-hero .group-avatar-large{height:60px;width:60px;flex-basis:60px}.group-hero>.group-cover{min-height:190px!important;height:190px!important}}

/* Group heading may wrap naturally; the verified seal stays centered beside the name block. */
.group-hero h1 .circle-community-identity .circle-identity-label{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:break-word!important;word-break:normal!important}
.group-hero h1 .circle-community-identity{max-width:100%;min-width:0;align-items:center}

/* Circle 4.9.24: unified layout for group conversations and verified headers */
.circle-community-identity{display:inline-flex!important;align-items:center!important;gap:7px!important;vertical-align:middle!important;max-width:100%;min-width:0;line-height:1.24!important;flex-wrap:nowrap!important}
.circle-community-identity>.circle-identity-label{line-height:inherit!important;min-width:0;overflow-wrap:normal!important;word-break:normal!important}
.circle-community-identity>.circle-community-verified{position:relative!important;top:0!important;left:0!important;margin:0!important;transform:none!important;align-self:center!important;flex-shrink:0!important;vertical-align:middle!important}
.circle-comments-toggle{display:flex!important;align-items:center;gap:10px;padding:12px 14px;background:rgba(212,187,130,.07);border:1px solid rgba(212,187,130,.2);border-radius:12px;color:#e8dbc2;font-weight:600;font-size:14px}.circle-comments-toggle input{width:18px;height:18px;accent-color:#d4bb82;flex:0 0 auto}
.circle-comment-closed{padding:12px;color:#b6aaa0;font-size:13px;border-top:1px solid #34312c}
.circle-group-leave{display:inline-flex;margin:0}.circle-group-leave button{min-height:44px;border:1px solid #8a5b51!important;color:#e1afa4!important;background:transparent!important;border-radius:12px;padding:0 14px;font-size:13px;font-weight:700}
.group-subnav a,.channel-link{min-height:44px!important;border-radius:12px!important;display:flex!important;align-items:center!important;justify-content:center;gap:8px;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease!important}
.group-subnav a:hover,.channel-link:hover{transform:translateY(-2px);background:rgba(212,187,130,.09)!important;color:#f4d99f!important;box-shadow:0 5px 14px rgba(0,0,0,.15)}
.channel-nav{display:flex;gap:9px;flex-wrap:wrap;padding:12px 4px;border-bottom:0!important}.channel-link{flex:0 1 auto;min-width:90px;padding:10px 15px!important;border:1px solid #453e31!important;background:#1c1e22!important;font-weight:700!important;white-space:nowrap}.channel-link.active{border-color:#d4bb82!important;background:#2d291f!important}
.circle-group-chat-shell{background:linear-gradient(155deg,#1b1d20,#131416);border:1px solid #454039;border-radius:17px;display:flex;flex-direction:column;min-width:0;overflow:hidden;padding:12px;gap:9px}.circle-group-chat-caption{display:flex;align-items:center;gap:8px;color:#e7d2a8;font-size:14px;border-bottom:1px solid #38342f;padding:5px 4px 13px}.circle-group-chat-caption span:last-child{font-size:11px;color:#908e8a;margin-left:auto}.circle-group-chat-indicator{width:8px;height:8px;border-radius:50%;background:#d4bb82;box-shadow:0 0 9px #d4bb8288;flex-shrink:0}
.circle-group-chat-shell #messages{min-height:200px;max-height:clamp(340px,58vh,760px);overflow:auto;overscroll-behavior:contain;padding:8px 3px;scrollbar-width:thin;scrollbar-color:#806940 transparent}
.circle-channel-composer{display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px auto!important;align-items:center;gap:9px!important;padding:12px 4px 3px!important;border-top:1px solid #3b3429!important;min-width:0}.circle-channel-composer textarea{grid-column:2!important;grid-row:1!important;width:100%!important;min-width:0!important;resize:vertical;min-height:48px;max-height:140px;border:1px solid #4b4338!important;border-radius:12px;background:#202125!important;color:#f2e9d7;padding:12px!important;font:inherit!important;line-height:1.4!important}
.circle-channel-attach,.circle-channel-voice{grid-row:1;display:flex;align-items:center;justify-content:center;width:44px!important;height:46px!important;min-width:44px!important;border-radius:12px!important;border:1px solid #66543b!important;background:#29261f!important;color:#d4bb82!important;cursor:pointer;transition:transform .2s ease,border-color .2s ease}.circle-channel-attach{grid-column:1!important;position:relative;overflow:hidden;font-size:25px}.circle-channel-attach input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;max-width:none!important}.circle-channel-voice{grid-column:3!important}.circle-channel-attach:hover,.circle-channel-voice:hover{transform:translateY(-2px);border-color:#e6c487!important}.circle-channel-send{grid-row:1!important;grid-column:4!important;min-height:46px!important;padding:0 15px!important;border-radius:12px!important}.circle-channel-composer #voiceRecordStatus{grid-column:1/-1;font-size:12px}.circle-group-chat-shell+.channel-attachment-previews{margin-top:8px}
@media(max-width:700px){.channel-nav{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;padding:10px 0}.channel-link{scroll-snap-align:start;min-height:43px!important}.circle-group-chat-shell{padding:9px}.circle-group-chat-caption span:last-child{display:none}.circle-channel-composer{grid-template-columns:42px minmax(0,1fr) 42px!important;gap:6px!important}.circle-channel-attach,.circle-channel-voice{width:42px!important;min-width:42px!important}.circle-channel-send{grid-column:1/-1!important;grid-row:2!important;width:100%;min-height:42px!important}.circle-group-chat-shell #messages{max-height:52vh}}
@media(prefers-reduced-motion:reduce){.group-subnav a,.channel-link,.circle-channel-attach,.circle-channel-voice{transition:none!important;animation:none!important}.group-subnav a:hover,.channel-link:hover{transform:none!important}}


/* Circle 4.9.25: channel selector lives under the Chat action; chat scrolls internally. */
.group-layout{min-width:0!important}
.group-subnav{align-self:start!important;min-width:0!important;display:flex!important;flex-direction:column!important;gap:9px!important;overflow:visible!important}
.group-subnav>a{flex:0 0 auto!important}
.circle-chat-menu{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:4px;border-radius:13px;border:1px solid #5d4a2e;background:#191a1d;padding:4px}
.circle-chat-menu-main{min-width:0;display:flex;align-items:center;gap:9px;color:#d8d1c3!important;padding:10px 12px;border-radius:10px;text-decoration:none;font-weight:700;white-space:nowrap;transition:background .2s,color .2s}
.circle-chat-menu-main.active,.circle-chat-menu-main:hover{background:#30291f!important;color:#ebca8a!important}
.circle-chat-menu-toggle{width:42px;min-width:42px!important;height:42px;min-height:42px!important;display:grid;place-items:center;padding:0!important;border:1px solid #675337;border-radius:10px;background:#25231f;color:#edca8d;cursor:pointer}
.circle-chat-menu-toggle[aria-expanded=true] svg{transform:rotate(180deg)}
.circle-chat-menu-toggle svg{transition:transform .2s ease}
.circle-chat-menu-list{grid-column:1/-1;min-width:0;padding:6px 3px 3px;display:grid;gap:5px;max-height:260px;overflow:auto;scrollbar-width:thin}
.circle-chat-menu-list[hidden]{display:none!important}
.circle-chat-menu-title{font-size:11px;color:#aa9d83;padding:2px 9px 6px}
.circle-chat-menu-list .channel-link{min-width:0!important;min-height:40px!important;width:100%;justify-content:flex-start!important;padding:9px 11px!important;font-size:13px!important;white-space:normal!important;overflow-wrap:anywhere;text-align:left}
/* Hard height limit: growing message history is the responsibility of #messages alone. */
.circle-group-chat-shell{height:clamp(480px,69vh,700px)!important;min-height:0!important;max-height:700px!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
.circle-group-chat-shell #messages{flex:1 1 0!important;min-height:0!important;max-height:none!important;height:auto!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain}
.circle-group-chat-shell .circle-group-chat-caption,.circle-group-chat-shell #typingIndicator,.circle-group-chat-shell .circle-channel-composer{flex:0 0 auto!important}
.circle-channel-composer{min-height:0!important}
.circle-channel-composer .circle-channel-send{height:42px!important;min-height:42px!important;max-height:42px!important;min-width:42px!important;width:auto!important;padding:0 11px!important;display:inline-flex!important;align-items:center!important;justify-content:center;gap:7px;font-size:12px!important;grid-column:4!important;grid-row:1!important}
.circle-channel-send svg{flex:none;display:block}
.circle-channel-composer .voice-record-controls{width:auto!important;min-width:0!important;max-width:100%!important;height:42px;gap:5px;align-items:center!important}
.circle-channel-composer .voice-record-controls #voiceRecordButton{width:42px!important;min-width:42px!important;max-width:42px!important;height:42px!important;flex:none!important;padding:0!important}
.circle-channel-composer .voice-record-controls .voice-record-delete{width:42px!important;min-width:42px!important;max-width:42px!important;height:42px!important;flex:none!important;padding:0!important;display:grid;place-items:center}
.circle-channel-composer .voice-record-controls .voice-record-delete[hidden]{display:none!important}
.circle-channel-attach,.circle-channel-voice{height:42px!important;min-height:42px!important}
.circle-community-danger-zone{margin:18px 0;padding:20px;border:1px solid #9e5252;border-radius:15px;background:#24191a}
.circle-community-danger-zone h3{color:#f6b2a9;margin:0 0 8px}
.circle-community-danger-zone p{font-size:13px;color:#c9a9a5;line-height:1.5}
.circle-community-delete-form{display:grid;gap:12px;max-width:520px}
.circle-community-delete-form label{font-size:13px;color:#ebd1cb}
.circle-community-delete-form input{width:100%;margin-top:7px;padding:11px 12px}
.circle-community-delete-form .circle-danger-delete{width:fit-content;min-height:42px;padding:10px 16px;background:#762a30!important;border:1px solid #d17b7b!important;color:white!important}
.circle-community-delete-form .circle-danger-delete:disabled{opacity:.45!important;cursor:not-allowed!important}
@media(max-width:800px){
 .group-subnav{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;grid-column:1/-1!important}
 .group-subnav>a,.group-subnav>.circle-chat-menu{flex:1 1 150px!important;min-width:0}
 .circle-group-chat-shell{height:clamp(400px,62dvh,610px)!important;max-height:610px!important}
 .circle-channel-composer{grid-template-columns:40px minmax(0,1fr) 40px 42px!important;gap:5px!important}
 .circle-channel-composer .circle-channel-send{grid-column:4!important;grid-row:1!important;width:42px!important;height:42px!important;padding:0!important}
 .circle-channel-send .circle-send-label{display:none}
 .circle-channel-composer .voice-record-controls{width:42px!important}
 .circle-channel-composer .voice-record-controls.is-recording{width:88px!important;position:relative;z-index:2;background:#1b1c20;border-radius:12px}
 .circle-channel-composer .voice-record-controls .voice-record-delete{width:40px!important;min-width:40px!important}
}
@media(prefers-reduced-motion:reduce){.circle-chat-menu-toggle svg,.circle-chat-menu-main{transition:none!important}}

/* Active group recorder gets enough grid space for both controls; no overlay on Send. */
.circle-channel-composer:has(.voice-record-controls.is-recording){grid-template-columns:42px minmax(0,1fr) 90px 42px!important}
.circle-channel-composer .voice-record-controls.is-recording{width:90px!important;max-width:90px!important;min-width:90px!important;display:flex!important;gap:6px!important;position:static!important}
.circle-channel-composer .voice-record-controls.is-recording #voiceRecordButton,
.circle-channel-composer .voice-record-controls.is-recording .voice-record-delete{width:42px!important;min-width:42px!important;max-width:42px!important;flex:0 0 42px!important}
@media(max-width:800px){.circle-channel-composer .voice-record-controls.is-recording{width:90px!important;min-width:90px!important;max-width:90px!important;position:static!important}}


/* Circle 4.9.26 — wider channel navigation and stable voice composer geometry. */
@media(min-width:901px){
 .group-layout{grid-template-columns:194px minmax(0,1fr) 252px!important;gap:14px!important}
 .group-subnav{min-width:0!important}
}
@media(min-width:901px) and (max-width:1250px){
 .group-layout{grid-template-columns:184px minmax(0,1fr)!important}
 .group-right{grid-column:2!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .group-main{grid-column:2!important}
 .group-subnav{grid-row:1 / span 2!important}
}
.circle-chat-menu{grid-template-columns:minmax(0,1fr) 42px!important;min-width:0!important}
.circle-chat-menu-main{padding-inline:9px!important;font-size:13px!important;overflow:hidden;text-overflow:ellipsis}
.circle-chat-menu-list{max-width:100%!important;overflow-x:hidden!important}
.circle-chat-menu-list .channel-link{font-size:13px!important;line-height:1.35!important;overflow-wrap:break-word!important;word-break:normal!important;hyphens:auto}
/* Explicitly remove the obsolete heading on cached templates. */
.circle-chat-menu-title{display:none!important}
/* The recorder is a single grid item. Its internal pause and cancel buttons
   take up reserved width rather than covering the Send button. */
.circle-channel-composer{box-sizing:border-box!important;display:grid!important;
 grid-template-columns:42px minmax(0,1fr) 42px 44px!important;
 align-items:center!important;gap:7px!important;min-width:0!important}
.circle-channel-composer:has(.voice-record-controls.is-recording){
 grid-template-columns:42px minmax(0,1fr) 90px 44px!important}
.circle-channel-composer .circle-channel-attach{grid-column:1!important;grid-row:1!important;width:42px!important;min-width:0!important}
.circle-channel-composer textarea{grid-column:2!important;grid-row:1!important;min-width:0!important;box-sizing:border-box!important}
.circle-channel-composer .voice-record-controls,
.circle-channel-composer .voice-record-controls.is-recording{
 grid-column:3!important;grid-row:1!important;justify-self:stretch!important;
 box-sizing:border-box!important;display:flex!important;align-items:center!important;
 width:100%!important;max-width:100%!important;min-width:0!important;
 height:42px!important;gap:6px!important;margin:0!important;padding:0!important;
 position:static!important;overflow:visible!important;background:transparent!important}
.circle-channel-composer .voice-record-controls #voiceRecordButton,
.circle-channel-composer .voice-record-controls .voice-record-delete{
 flex:1 1 0!important;width:auto!important;min-width:0!important;max-width:none!important;
 height:42px!important;min-height:42px!important;max-height:42px!important;
 margin:0!important;padding:0!important;box-sizing:border-box!important;display:grid!important;place-items:center!important}
.circle-channel-composer .voice-record-controls .voice-record-delete[hidden]{display:none!important}
.circle-channel-composer .circle-channel-send{
 grid-column:4!important;grid-row:1!important;width:44px!important;min-width:44px!important;
 max-width:44px!important;height:42px!important;min-height:42px!important;
 padding:0!important;overflow:hidden!important;display:grid!important;place-items:center!important;
 font-size:0!important;box-sizing:border-box!important;white-space:nowrap!important}
.circle-channel-composer .circle-channel-send svg{height:20px!important;width:20px!important;display:block!important}
.circle-channel-composer .circle-send-label{position:absolute!important;width:1px!important;height:1px!important;
 overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.circle-channel-composer #voiceRecordStatus{grid-column:1 / -1!important;min-width:0!important;overflow-wrap:anywhere}
@media(max-width:800px){
 .group-layout{grid-template-columns:minmax(0,1fr)!important}
 .group-subnav{grid-column:1!important;grid-row:auto!important}
 .circle-channel-composer{gap:5px!important}
 .circle-channel-composer:has(.voice-record-controls.is-recording){
  grid-template-columns:40px minmax(0,1fr) 90px 42px!important}
 .circle-channel-composer .circle-channel-send{width:42px!important;min-width:42px!important;max-width:42px!important}
}
@media(max-width:350px){
 .circle-channel-composer,.circle-channel-composer:has(.voice-record-controls.is-recording){column-gap:4px!important}
 .circle-group-chat-shell{padding-inline:6px!important}
}

/* Circle 4.9.27 — channel editor; no change to the group's chat viewport. */
.circle-channel-settings{scroll-margin-top:18px}
.circle-channel-settings-row{border:1px solid #524734;background:#1a1b1e;border-radius:13px;padding:12px;margin:10px 0;display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}
.circle-channel-settings-name{font-size:15px;font-weight:700;color:#dec18a;min-width:0;overflow-wrap:anywhere}
.circle-channel-settings-name a{color:inherit;text-decoration:none}
.circle-channel-settings-name a:hover{text-decoration:underline}
.circle-channel-settings-actions{display:flex;align-items:end;gap:9px;flex-wrap:wrap;min-width:0}
.circle-channel-rename{display:flex;align-items:end;gap:8px;flex-wrap:wrap;margin:0}
.circle-channel-rename label{font-size:12px;color:#c0b7a7;margin:0}
.circle-channel-rename input{min-width:140px;max-width:240px;margin:5px 0 0}
.circle-channel-delete{margin:0}
.circle-channel-delete-button{border:1px solid #8c4b4b!important;background:#382326!important;color:#f6b1a9!important;min-height:40px;border-radius:9px}
.circle-channel-create{border-top:1px solid #4b4030;margin-top:14px;padding-top:15px}
@media(max-width:700px){.circle-channel-settings-row{align-items:stretch;flex-direction:column}.circle-channel-settings-actions{width:100%;align-items:stretch}.circle-channel-rename{flex:1 1 100%}.circle-channel-rename label{flex:1}.circle-channel-rename input{width:100%;max-width:none}}


/* Circle 4.9.28 — unified community editor and dashboard. */
.circle-community-editor,.group-hero,.circle-community-preview-card{--group-accent:#C6A15B!important}
.circle-group-admin-head{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin:0 0 18px;padding:0 2px}
.circle-group-admin-head h1{font-size:clamp(23px,3vw,32px);line-height:1.18;margin:4px 0 7px;color:#eed6ac}
.circle-group-admin-head p{color:#aaa49b;margin:0;line-height:1.5}
.circle-admin-back{display:inline-flex;padding:12px 16px;border:1px solid #705b37;border-radius:12px;color:#e4c48d;text-decoration:none;min-height:44px;align-items:center}
.circle-editor-section-heading{margin:26px 0 15px}.circle-editor-section-heading h2{font-size:20px;color:#e8d2ac;margin:0 0 5px}.circle-editor-section-heading p{color:#aaa49b;margin:0;font-size:13px}
.circle-stats-dashboard{min-width:0;margin:12px 0 24px;color:#e9e4d9}
.circle-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.circle-stat-card,.circle-chart-card{min-width:0;background:linear-gradient(145deg,#1d1d1e 0%,#141516 94%);border:1px solid #3f3528;border-radius:16px;box-shadow:inset 0 1px #ffffff09;box-sizing:border-box}
.circle-stat-card{padding:19px 18px 17px;min-height:144px}
.circle-stat-label{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#a9a095;font-size:12px;letter-spacing:.055em;text-transform:uppercase}
.circle-stat-glyph{font-size:21px;color:#d2ac6c}
.circle-stat-card>strong{display:block;font-size:clamp(26px,3vw,37px);font-variant-numeric:tabular-nums;line-height:1.25;margin:14px 0;color:#f1e5d0;letter-spacing:-.035em}
.circle-stat-foot{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:11px;color:#9c988f}
.circle-stat-change{background:#2a2920;border:1px solid #52432a;border-radius:7px;color:#daba7c;padding:3px 7px;font-size:11px;font-weight:750}
.circle-stats-charts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.circle-chart-card{padding:19px 18px 15px}.circle-chart-card header{display:flex;align-items:start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.circle-chart-card h2{font-size:16px;color:#e8dcc9;margin:0 0 5px}.circle-chart-card header p{font-size:12px;color:#99938a;margin:0}
.circle-chart-legend{display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:#aca69b;font-size:11px}.circle-chart-legend span{display:flex;gap:5px;align-items:center}
.circle-chart-legend i{width:7px;height:7px;display:inline-block;border-radius:50%}.circle-legend-gold{background:#dec07e}.circle-legend-teal{background:#72ab9e}
.circle-chart-canvas-wrap{height:205px;min-height:205px;position:relative}.circle-group-stat-chart{width:100%;height:100%;display:block}
.circle-community-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px!important}
.circle-community-management-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.circle-community-management-grid>.panel{min-width:0;margin:0!important}
.circle-channel-settings-row{display:grid!important;grid-template-columns:minmax(140px,.75fr) minmax(0,2fr);align-items:center!important;gap:16px;min-height:100px}
.circle-channel-settings-name{min-width:0;font-size:15px;overflow-wrap:normal!important;word-break:normal!important}
.circle-channel-settings-name a{overflow-wrap:anywhere;word-break:normal}
.circle-channel-settings-actions{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:end!important;gap:10px;width:100%;flex-wrap:nowrap!important;min-width:0}
.circle-channel-rename{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:end;min-width:0;width:100%}
.circle-channel-rename label{display:block;min-width:0;flex:none!important}
.circle-channel-rename input{display:block;min-width:0!important;width:100%!important;max-width:none!important;box-sizing:border-box!important}
.circle-channel-rename button,.circle-channel-delete-button{min-height:43px;white-space:nowrap;padding:0 13px}
.circle-channel-delete{align-self:end}
@media(max-width:1280px){.circle-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.circle-community-management-grid{grid-template-columns:1fr}}
@media(max-width:1020px){.circle-stats-charts{grid-template-columns:minmax(0,1fr)}.circle-channel-settings-row{grid-template-columns:minmax(0,1fr)}.circle-community-settings-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.circle-stat-card{padding:13px 12px;min-height:128px}.circle-stats-grid{gap:9px}.circle-stat-card>strong{font-size:27px}.circle-stat-foot{font-size:10px}.circle-chart-card{padding:13px}.circle-chart-canvas-wrap{height:180px;min-height:180px}.circle-channel-settings-actions{grid-template-columns:minmax(0,1fr)}.circle-channel-rename{grid-template-columns:minmax(0,1fr) auto}.circle-channel-delete{justify-self:end}}
@media(max-width:360px){.circle-channel-rename{grid-template-columns:minmax(0,1fr)}.circle-channel-rename button{justify-self:stretch}}


/* Circle 4.9.30 — natural, width-filling community covers, no repeat/tiling. */
.group-cover,.circle-community-preview-cover{position:relative;overflow:hidden;background-repeat:no-repeat!important;background-size:cover!important;background-position:center}
.group-cover>.circle-banner-media,.circle-community-preview-cover>.circle-banner-media,
.circle-crop-viewport>.circle-banner-media{
 position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;
 object-fit:cover;object-position:var(--circle-banner-x,50%) var(--circle-banner-y,50%);
 transform:scale(var(--circle-banner-scale,1));
 transform-origin:var(--circle-banner-x,50%) var(--circle-banner-y,50%);
 pointer-events:none;user-select:none;
}
.group-cover>.circle-banner-media{z-index:-2}
.group-cover::after{pointer-events:none}
.circle-community-preview-cover>.circle-banner-media{z-index:0}
.circle-community-preview-cover::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(10,11,14,.40),rgba(10,11,14,.12))}
.circle-crop-viewport>.circle-banner-edit-image{z-index:1}
.circle-crop-viewport>canvas[hidden]{display:none}
/* Consistent text-only group labels, with gold active navigation indicator. */
.sidebar-community-meta strong,.sidebar-community-meta .circle-identity-label,
.sidebar-community-item .circle-identity-label{background:none!important;box-shadow:none!important;border:0!important;padding:0!important;border-radius:0!important;color:var(--text)!important;font-weight:650!important;font-size:12px!important;line-height:1.35!important}
.sidebar-community-item,.sidebar-community-item:hover,.sidebar-community-item.active{background:transparent!important;box-shadow:none!important}
.sidebar-community-item.active{border-color:rgba(198,161,91,.45)!important}
.sidebar-community-item.active .circle-identity-label{color:#e2c17c!important}
/* Remove the decorative sparkle from the official group cover. */
.circle-official-group-hero .group-cover::after{content:""!important;font-size:0!important;transform:none!important;right:auto!important;top:0!important;inset:0!important;background:linear-gradient(90deg,rgba(8,9,12,.25),transparent 60%)!important}

/* Group names: restore normal inline identity content, suppress old rail label backgrounds. */
.community-rail-meta strong,.community-rail-meta .circle-community-identity,.community-rail-meta .circle-identity-label{background:none!important;box-shadow:none!important;border:none!important;padding:0!important;border-radius:0!important}
.community-rail-meta strong{display:block!important;max-width:100%;font-size:13px!important;font-weight:650!important;line-height:1.4;color:var(--text)!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.community-rail-meta .circle-community-identity{display:inline-flex!important;width:auto!important;height:auto!important;max-width:100%;min-width:0;align-items:center!important;justify-content:flex-start!important}
.community-rail-meta .circle-identity-label{display:inline!important;width:auto!important;height:auto!important;font-size:inherit!important;color:inherit!important;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.community-rail-item,.community-rail-item:hover,.community-rail-item.active{background:transparent!important;box-shadow:none!important}
.community-rail-item.active{border-color:rgba(198,161,91,.43)!important}
.community-rail-item.active .circle-identity-label{color:#e4c581!important}

/* Circle 4.9.32 — plain group banners, clickable post identities, attachments drop target. */
.group-cover-glow{display:none!important}
.circle-post-author-avatar-link,.circle-post-author-name-link{display:inline-flex;align-items:center;min-width:0;color:inherit;text-decoration:none}
.circle-post-author-avatar-link:hover,.circle-post-author-name-link:hover{color:var(--gold2,#d1ae70)}
.member-row{cursor:default;text-decoration:none}
.circle-drop-active{outline:2px dashed var(--gold2,#d1ae70)!important;outline-offset:2px;background:rgba(198,161,91,.08)!important}
.circle-paste-feedback{display:block;font-size:12px;color:var(--gold2,#d1ae70)}
.circle-login-card form{display:grid;gap:12px;max-width:460px}

/* Circle 4.9.33 — readable search results and unified post typography. */
.friends-search-panel .friend-search-results{min-width:0;overflow:visible}
.friends-search-panel .friend-mini-row{display:grid!important;grid-template-columns:34px minmax(0,1fr) 38px;align-items:center;column-gap:10px;row-gap:6px;min-width:0;width:100%;box-sizing:border-box}
.friends-search-panel .friend-mini-row>.friend-mini-copy{min-width:0;max-width:100%;overflow:visible}
.friends-search-panel .friend-mini-copy>a{min-width:0;display:block;white-space:normal;overflow-wrap:anywhere}
.friends-search-panel .friend-mini-copy strong{display:block!important;min-width:0;max-width:100%;font-size:13px;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.35}
.friends-search-panel .friend-mini-copy .circle-identity-inline{display:inline-flex!important;flex-wrap:wrap;align-items:center;gap:4px;min-width:0;max-width:100%;white-space:normal!important;vertical-align:middle}
.friends-search-panel .friend-mini-copy .circle-identity-label{display:inline;min-width:0;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word;text-overflow:clip!important}
.friends-search-panel .friend-mini-copy small{display:block;overflow-wrap:anywhere;white-space:normal}
.friends-search-panel .friend-mini-row>form{grid-column:3;grid-row:1;min-width:0;justify-self:end;margin:0}
.friends-search-panel .friend-mini-row>form .friend-icon-action{width:36px;min-width:36px;max-width:36px;flex:none}
.friends-search-panel .friend-mini-row>.friend-avatar{grid-column:1;grid-row:1}
.friends-search-panel .friend-mini-row>.friend-mini-copy{grid-column:2;grid-row:1}
@media(max-width:420px){.friends-search-panel .friend-mini-row{grid-template-columns:32px minmax(0,1fr) 36px;column-gap:7px}.friends-search-panel .friend-mini-row>.friend-avatar{width:32px;height:32px;min-width:32px}}
.feed-post>.post-body,.single-post>.post-body{line-height:1.7;letter-spacing:.006em;color:var(--text);white-space:normal;overflow-wrap:anywhere}
.feed-post>.post-body strong,.single-post>.post-body strong{font-weight:750;color:var(--gold2,#d6bd87)}
.feed-post>.post-body em,.single-post>.post-body em{font-style:italic;color:inherit}
.circle-text-format-tools{display:flex;align-items:center;gap:7px;padding:5px 0;flex-wrap:wrap}
.circle-text-format-tools button{height:33px;min-width:38px;padding:5px 10px;border-radius:8px;border:1px solid rgba(198,161,91,.35);background:rgba(198,161,91,.07);color:#e1c996;font-weight:750;cursor:pointer}
.circle-text-format-tools button:hover,.circle-text-format-tools button:focus-visible{background:rgba(198,161,91,.19);outline:1px solid rgba(198,161,91,.4)}
.circle-format-help{margin:-4px 0 3px;color:var(--muted);font-size:12px;line-height:1.5}
.circle-editor-toggle-label{display:flex;gap:10px;align-items:center;font-size:14px;color:#d9c59a}
.circle-editor-toggle-label input{width:18px;height:18px;accent-color:#c6a15b}

/* 4.9.45: avatar/name link available only for accepted friendships in friends search */
.friends-search-panel .friend-search-avatar-link {grid-column:1;grid-row:1;display:inline-flex;width:max-content;max-width:100%;border-radius:50%;text-decoration:none}
.friends-search-panel .friend-mini-row>.friend-search-avatar-link>.friend-avatar {width:34px;height:34px;min-width:34px}
.friends-search-panel .friend-mini-row>.friend-search-state {grid-column:3;grid-row:1;justify-self:end;display:inline-flex;width:36px;height:36px;align-items:center;justify-content:center;color:var(--muted);border:1px solid rgba(215,181,109,.22);border-radius:10px}
.friend-mini-copy .friend-search-nonlink {display:grid;gap:2px;min-width:0;cursor:default;color:var(--text)}
.friend-mini-copy .friend-search-nonlink strong {min-width:0;overflow-wrap:anywhere;white-space:normal}
.friend-mini-copy .friend-search-nonlink small {font-size:10px;color:var(--muted)}
@media(max-width:420px){.friends-search-panel .friend-mini-row>.friend-search-avatar-link>.friend-avatar{width:32px;height:32px;min-width:32px}}


/* Circle 4.9.46 — search results have one predictable layout, no overlays. */
.friends-search-panel .friend-search-results { min-width:0; max-width:100%; container-type:inline-size; }
.friends-search-panel .friend-search-result-card {
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) 38px !important;
  grid-template-rows:auto !important;
  align-items:center !important;
  gap:8px !important;
  width:100%; min-width:0; max-width:100%; box-sizing:border-box;
  position:relative; padding:10px 0;
}
.friends-search-panel .friend-search-result-card > .friend-avatar,
.friends-search-panel .friend-search-result-card > .friend-search-avatar-link {
  grid-column:1; grid-row:1; min-width:0; width:34px; height:34px;
  margin:0; align-self:center;
}
.friends-search-panel .friend-search-result-card > .friend-search-avatar-link > .friend-avatar {width:34px;height:34px;min-width:34px}
.friends-search-panel .friend-search-result-card > .friend-mini-copy {
  grid-column:2; grid-row:1; align-self:center; width:100%;
  min-width:0; max-width:100%; overflow-wrap:anywhere; overflow:visible;
}
.friends-search-panel .friend-search-result-card .friend-mini-copy > a,
.friends-search-panel .friend-search-result-card .friend-mini-copy > .friend-search-nonlink {display:block;min-width:0;max-width:100%}
.friends-search-panel .friend-search-result-card .circle-identity-inline {
  display:inline-flex !important; align-items:center; flex-wrap:wrap !important;
  min-width:0;max-width:100%;gap:4px;white-space:normal !important;
}
.friends-search-panel .friend-search-result-card .circle-identity-label {
  display:inline !important;white-space:normal !important;overflow-wrap:anywhere !important;
  word-break:break-word !important; overflow:visible !important; text-overflow:clip !important;
}
.friends-search-panel .friend-search-result-card .friend-mini-copy strong {
  display:block; min-width:0; max-width:100%; overflow:visible !important;
  white-space:normal !important; overflow-wrap:anywhere; line-height:1.45;
}
.friends-search-panel .friend-search-result-card > form,
.friends-search-panel .friend-search-result-card > .friend-search-state {
  grid-column:3;grid-row:1; justify-self:end;align-self:center;
  width:38px;min-width:38px; max-width:38px; margin:0;box-sizing:border-box;
}
.friends-search-panel .friend-search-result-card > form {display:flex;justify-content:center}
.friends-search-panel .friend-search-result-card > form > .friend-icon-action {
  width:38px;min-width:38px;max-width:38px;height:38px;position:static;
}
/* The search column is only ~270px on desktop: give names the complete first row
   when the available card area is cramped. Container queries work regardless of viewport width. */
@container (max-width:270px) {
  .friends-search-panel .friend-search-result-card {
    grid-template-columns:34px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
  }
  .friends-search-panel .friend-search-result-card > .friend-mini-copy {grid-column:2;grid-row:1}
  .friends-search-panel .friend-search-result-card > form,
  .friends-search-panel .friend-search-result-card > .friend-search-state {
    grid-column:2;grid-row:2;justify-self:end;align-self:start;
  }
}
@media(max-width:420px) {
  .friends-search-panel .friend-search-result-card {gap:7px !important;}
}


/* Circle 4.9.56 — final Friends layout, placed after all historical rules.
   The previously appended rules were overridden by the 4.4.0 and 4.9.46 layers. */
@media (min-width: 981px) {
  .circle-main > .friends-workspace {
    display: grid;
    width: min(100%, 1280px);
    max-width: 1280px;
    grid-template-columns: minmax(390px, 1.05fr) minmax(320px, .95fr);
    gap: clamp(14px, 1.6vw, 22px);
    align-items: start;
  }
  .circle-main > .friends-workspace > .friends-tools-column,
  .circle-main > .friends-workspace > .friends-content-column {
    min-width: 0;
    max-width: none;
    width: 100%;
  }
  .friends-content-column > .friends-grid { grid-template-columns: minmax(0, 1fr); max-width: none; }
}
@media (min-width: 721px) and (max-width: 980px) {
  /* Laptop window with the persistent Circle left navigation: never make tools 270px. */
  .circle-main > .friends-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }
  .circle-main > .friends-workspace > .friends-tools-column,
  .circle-main > .friends-workspace > .friends-content-column {width:100%;max-width:none;min-width:0;}
  .friends-content-column > .friends-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));max-width:none;}
}
/* Keep actions separate from long names; allow both requests and search results to wrap. */
.friends-tools-column .friend-request-row {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 88px;
  gap: 10px;
  align-items: center;
  min-width: 0;
}
.friends-tools-column .friend-request-row > .friend-avatar {
  width: 38px; height: 38px; min-width: 38px; grid-column:1; grid-row:1;
}
.friends-tools-column .friend-request-row > .friend-mini-copy {
  grid-column: 2; grid-row:1; min-width:0; overflow-wrap:anywhere;
}
.friends-tools-column .friend-request-row .friend-search-nonlink,
.friends-tools-column .friend-request-row .friend-mini-copy strong {
  display:block;min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;overflow:visible;text-overflow:clip;
}
.friends-tools-column .friend-request-row > .friend-request-actions {
  grid-column:3;grid-row:1;display:flex;justify-content:flex-end;
  width:88px;min-width:88px;max-width:88px;flex-wrap:nowrap;margin:0;
}
.friends-tools-column .friend-request-row > .friend-request-actions form{display:flex;flex:0 0 38px;margin:0}
.friends-tools-column .friend-request-row > .friend-request-actions button {width:38px;height:38px;min-width:38px}
.friends-tools-column .friends-search-panel .friend-search-result-card {
  grid-template-columns:38px minmax(0,1fr) 40px !important;
  gap:10px !important;
}
.friends-tools-column .friends-search-panel .friend-search-result-card > .friend-avatar,
.friends-tools-column .friends-search-panel .friend-search-result-card > .friend-search-avatar-link,
.friends-tools-column .friends-search-panel .friend-search-result-card > .friend-search-avatar-link .friend-avatar {
  width:38px;height:38px;min-width:38px;
}
.friends-tools-column .friends-search-panel .friend-search-result-card > form,
.friends-tools-column .friends-search-panel .friend-search-result-card > .friend-search-state {
  grid-column:3;grid-row:1;justify-self:end;width:40px;min-width:40px;
}
@media (max-width: 720px) {
  .circle-main > .friends-workspace {display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
  .friends-tools-column, .friends-content-column {width:100%;max-width:none;min-width:0}
}
@media (max-width: 380px) {
  .friends-tools-column .friend-request-row {grid-template-columns:38px minmax(0,1fr)}
  .friends-tools-column .friend-request-row > .friend-request-actions {
    grid-column:2;grid-row:2;justify-content:flex-start;width:auto;min-width:0;max-width:none;
  }
  .friends-tools-column .friends-search-panel .friend-search-result-card {grid-template-columns:34px minmax(0,1fr) 40px !important;gap:7px !important}
}


/* Circle 4.9.57 — final overrides for friends page */
.friends-workspace-flat{margin-top:6px;align-items:start}
.friends-workspace-flat .friends-tools-column,
.friends-workspace-flat .friends-content-column{align-self:start}
.friends-workspace-flat .friends-list-toolbar,
.friends-workspace-flat .panel{margin-top:0}
.friends-workspace-flat .friends-tools-column .panel:first-child,
.friends-workspace-flat .friends-content-column .friends-list-toolbar:first-child{margin-top:0}
.friends-tools-column .friend-request-row{grid-template-columns:48px minmax(0,1fr) 88px;column-gap:12px;align-items:center}
.friends-tools-column .friend-request-row > .friend-avatar{width:48px;height:48px;min-width:48px;flex-basis:48px}
.friends-tools-column .friend-request-row > .friend-mini-copy small{margin-top:3px;color:var(--muted)}
.friends-tools-column .friend-request-row > .friend-request-actions{align-self:center}
@media(max-width:720px){.friends-workspace-flat{margin-top:0}}
@media(max-width:420px){.friends-tools-column .friend-request-row{grid-template-columns:42px minmax(0,1fr)}.friends-tools-column .friend-request-row>.friend-avatar{width:42px;height:42px;min-width:42px;flex-basis:42px}}

/* Circle 4.9.58 — align the first left panel with the first friend card. */
@media (min-width:981px) {
  .circle-main > .friends-workspace-flat > .friends-tools-column {
    padding-top: 63px; /* equal to the "Мои друзья" toolbar + its bottom gap */
    box-sizing: border-box;
  }
}
@media (max-width:980px) {
  .circle-main > .friends-workspace-flat > .friends-tools-column {padding-top:0}
}

/* Circle 4.9.62: no animated or anchoring-based repositioning in the DM pane. */
#dmMessages.dm-messages{scroll-behavior:auto!important;overflow-anchor:none!important}

/* Circle 5.1 shared auth treatment */
.circle-remember-choice{display:flex!important;align-items:center;gap:10px;color:var(--text,#e6e2db);font-size:13px;margin:10px 0 14px}.circle-remember-choice input{width:18px;height:18px;accent-color:#c6a15b;flex:0 0 auto}