/* The Circle — social experience */
.social-panel { background:#f5f2ea; transition:transform .55s cubic-bezier(.22,1,.36,1); }
.social-profile-view { background:#f5f2ea; transition:transform .52s cubic-bezier(.22,1,.36,1); padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom); }
.social-hdr { height:64px; padding:0 max(20px,calc((100vw - 940px)/2)); border:0; background:#1e211c; color:#f8f4e9; position:relative; z-index:2; }
.social-back { width:38px;height:38px;border-radius:50%;color:#f8f4e9;border:1px solid rgba(255,255,255,.22); transition:transform .25s, background .25s; }
.social-back:hover { background:rgba(255,255,255,.13);transform:translateX(-3px); }
.social-hdr-title { font-size:24px;letter-spacing:.08em; }
.social-hdr-dot { color:#f16948; }
.social-list-body { padding:0 0 50px; }
.social-hero { min-height:306px;position:relative;overflow:hidden;background:#1e211c;color:#f8f4e9;padding:26px max(24px,calc((100vw - 940px)/2)) 42px;isolation:isolate; }
.social-hero:before { content:'';position:absolute;inset:auto -14% -80px 45%;height:225px;background:#e55939;border-radius:50% 50% 0 0;transform:rotate(-17deg);z-index:-1;opacity:.93; }
.social-hero-top { display:flex;justify-content:space-between;gap:12px;align-items:center; }
.social-kicker,.social-hero-index,.social-section-kicker { font-size:10px;letter-spacing:.18em;font-weight:700; }
.social-kicker { color:#e7c9b9;display:inline-flex;align-items:center;gap:8px; }
.social-live-dot { width:7px;height:7px;background:#f26b4b;border-radius:50%;box-shadow:0 0 0 5px rgba(242,107,75,.14); }
.social-hero-index { color:#aaada4; }
.social-hero-title { font-family:'Bebas Neue',sans-serif;font-size:clamp(70px,13vw,142px);letter-spacing:-.015em;line-height:.77;margin:46px 0 16px;position:relative;z-index:1;animation:social-rise .7s .1s both cubic-bezier(.22,1,.36,1); }
.social-hero-title em { color:#f17454;font-style:normal; }
.social-hero p { max-width:260px;font-size:13px;line-height:1.55;color:#c5c8bb;margin:0;position:relative;z-index:1;animation:social-rise .7s .2s both; }
.social-orbit { position:absolute;right:max(25px,calc((100vw - 800px)/2));top:72px;width:188px;height:188px;border:1px solid rgba(255,255,255,.25);border-radius:50%;display:grid;place-items:center;animation:social-orbit 18s linear infinite; }
.social-orbit:before,.social-orbit-ring { content:'';position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.16);inset:22px; }
.social-orbit:before { inset:-23px; }
.social-orbit span { width:50px;height:50px;border-radius:50%;background:#f3ede0;color:#222;font-family:'Bebas Neue';font-size:24px;display:grid;place-items:center;animation:social-orbit 18s linear infinite reverse; }
.social-orbit i,.social-orbit b { position:absolute;width:23px;height:23px;border-radius:50%;background:#f17354;left:6px;top:24px;border:4px solid #1e211c; }
.social-orbit b { width:18px;height:18px;left:auto;top:auto;right:6px;bottom:23px;background:#eac297; }
.social-list-heading { max-width:940px;margin:0 auto;padding:28px 24px 15px;display:flex;align-items:end;justify-content:space-between; }
.social-section-kicker { color:#b55a42; }
.social-list-heading h2 { margin:4px 0 0;font-family:'Bebas Neue';font-size:39px;font-weight:400;line-height:1;letter-spacing:.015em;color:#22251f; }
.social-list-heading h2 span { vertical-align:top;font:700 12px 'DM Sans',sans-serif;color:#b55a42;margin-left:4px; }
.social-refresh { border:1px solid #d8d2c4;background:#fffaf0;color:#34382e;width:39px;height:39px;border-radius:50%;display:grid;place-items:center;cursor:pointer;transition:transform .4s,background .2s; }
.social-refresh:hover { background:#e9e1d3;transform:rotate(35deg); }
.social-refresh svg { width:18px;height:18px; }
#social-all-list { max-width:940px;margin:auto;padding:0 24px;display:grid;gap:10px; }
.social-user-card { margin:0;width:100%;text-align:left;display:flex;align-items:center;gap:17px;padding:17px 19px;background:#fffdf8;border:1px solid #ded9cd;border-radius:22px;box-shadow:0 8px 25px rgba(30,33,28,.035);color:#252820;font-family:'DM Sans',sans-serif;animation:social-rise .55s both cubic-bezier(.22,1,.36,1);animation-delay:var(--card-delay);transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s,border-color .25s; }
.social-user-card:hover { background:#fffdf8;transform:translateY(-3px);box-shadow:0 15px 38px rgba(30,33,28,.1);border-color:#c8bdb0; }
.social-user-card:active { transform:scale(.985);background:#f7f1e7; }
.friend-card-number { align-self:start;color:#a39e91;font:700 10px 'DM Sans',sans-serif;letter-spacing:.1em;margin-top:5px; }
.friend-avatar { width:58px;height:58px;border-radius:18px;font-size:18px;overflow:hidden;position:relative; }
.friend-avatar img,.social-profile-avatar img { width:100%;height:100%;object-fit:cover;display:block; }
.friend-name { font-size:17px;color:#242720;letter-spacing:-.02em;margin:0 0 3px; }
.friend-stats { color:#777b70;font-size:12px;margin:0; }
.friend-measurements { margin-top:10px;gap:6px; }
.friend-meas-chip { border-radius:30px;background:#f2f1e9;color:#73786d;padding:4px 8px;font-size:10px; }
.friend-meas-chip strong { color:#34382e; }
.friend-pr { margin-top:9px;padding:6px 9px;border-radius:8px;background:#f9ede4;color:#76685d;font-size:11px; }
.friend-pr strong,.friend-pr .ui-icon { color:#b9553e; }
.friend-card-arrow { align-self:center;flex:none;width:36px;height:36px;border-radius:50%;border:1px solid #dfdbd1;display:grid;place-items:center;color:#454940;transition:background .25s,color .25s,transform .3s; }
.friend-card-arrow svg { width:17px;height:17px; }
.social-user-card:hover .friend-card-arrow { background:#e55939;color:white;transform:rotate(-35deg);border-color:#e55939; }
.social-loading,.social-empty { max-width:890px;margin:20px auto;background:#fffdf8;border:1px dashed #d9d2c6;border-radius:22px;padding:36px;color:#777b70; }
.social-empty strong { color:#252820;font-family:'Bebas Neue';font-size:27px;font-weight:400;letter-spacing:.03em; }
.social-profile-hero { position:relative;overflow:hidden;background:#1e211c;color:#f9f4e9;padding:17px max(24px,calc((100vw - 940px)/2)) 25px;flex-shrink:0;min-height:154px; }
.social-profile-hero-orbit { position:absolute;right:-30px;top:-98px;width:260px;height:260px;border:1px solid rgba(255,255,255,.16);border-radius:50%;box-shadow:0 0 0 26px rgba(255,255,255,.035),0 0 0 70px rgba(255,255,255,.025); }
.social-profile-identity { position:relative;display:flex;align-items:center;gap:16px;margin-top:18px;animation:social-rise .6s .12s both; }
.social-profile-avatar { width:68px;height:68px;border-radius:20px;display:grid;place-items:center;overflow:hidden;color:white;font-size:21px;font-weight:700;box-shadow:0 7px 22px rgba(0,0,0,.19); }
.social-profile-name { max-width:70vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:400 37px/1 'Bebas Neue',sans-serif;letter-spacing:.035em; }
.social-profile-caption { color:#b9bdb2;font-size:12px;margin-top:5px; }
.sptab-bar { background:#f5f2ea;border:0;gap:6px;padding:12px max(20px,calc((100vw - 940px)/2));overflow-x:auto;scrollbar-width:none; }
.sptab-bar::-webkit-scrollbar { display:none; }
.sptab { flex:0 0 auto;border:1px solid #d9d3c6;border-radius:100px;padding:10px 17px;background:#fffcf5;color:#777b70;font-size:12px;transition:background .25s,color .25s,transform .25s,border-color .25s; }
.sptab:hover { transform:translateY(-2px);color:#20241e; }
.sptab.active { background:#1e211c;color:#fffaf0;border-color:#1e211c; }
#social-profile-body { padding:12px max(20px,calc((100vw - 940px)/2)) 50px; }
#social-profile-content > div:not([style*="display: none"]) { animation:social-rise .38s both; }
.sp-wcard,.sp-workout { border-radius:20px;background:#fffdf8;border-color:#dfdacd;box-shadow:0 8px 23px rgba(30,33,28,.035);padding:18px; }
.sp-wcard-hdr { border-bottom:1px solid #ece7db;padding-bottom:12px; }
.sp-wnum { font-size:23px; }
.sp-workout { padding:0; }
.sp-workout-name { padding:17px; }
.sp-log-row { background:#fffdf8;border-color:#e3ddd2;border-radius:12px;padding:13px; }
#chat-container { background:#f5f2ea; }
.chat-messages { padding:20px max(20px,calc((100vw - 940px)/2));gap:8px; }
.chat-day-divider { letter-spacing:.14em;color:#8c8d80;margin:14px 0; }
.chat-bubble-row.mine .chat-bubble { background:#242821;border-radius:18px 18px 5px 18px; }
.chat-bubble-row.theirs .chat-bubble { background:#fffdf8;border:1px solid #e3ded2;border-radius:18px 18px 18px 5px; }
.chat-bubble { padding:11px 15px; }
.chat-input-row { background:#f5f2ea;border-top:1px solid #e2dccc;padding:12px max(16px,calc((100vw - 940px)/2)); }
.chat-input { background:#fffdf8;border-color:#dbd4c7; }
.chat-send-btn { background:#e55939; }
.chat-plus-btn { background:#fffdf8;border-color:#dbd4c7; }
.social-strip { transition:transform .3s,box-shadow .3s; }
.social-strip:hover { transform:translateY(-3px); }
@keyframes social-rise { from { opacity:0;transform:translateY(20px); } to { opacity:1;transform:translateY(0); } }
@keyframes social-orbit { to { transform:rotate(360deg); } }
@media (max-width:600px) { .social-hero { min-height:292px; }.social-hero-title { font-size:clamp(72px,18vw,106px);margin-top:47px; }.social-orbit { width:130px;height:130px;right:-35px;top:112px;opacity:.42; }.social-hero p { max-width:215px; }.social-user-card { gap:11px;padding:15px 12px; }.friend-card-number { display:none; }.friend-avatar { width:52px;height:52px; }.friend-card-arrow { width:31px;height:31px; }.social-profile-name { font-size:32px; } }
@media (prefers-reduced-motion:reduce) { .social-panel,.social-profile-view,.social-user-card,.social-profile-identity,.social-hero-title,.social-hero p,.chat-bubble-row.new-msg .chat-bubble,.chat-bubble-row.new-msg .chat-workout-card { animation:none !important;transition:none !important; }.social-orbit { animation:none; }.social-orbit span { animation:none; } }
.social-strip-title .ui-icon { width:20px;height:20px;vertical-align:-.12em;margin-left:5px; }
.social-user-card:focus-visible,.social-back:focus-visible,.sptab:focus-visible,.social-refresh:focus-visible { outline:3px solid #e55939;outline-offset:3px; }
/* Exercise sharing and in-app delivery */
.excard-share-btn { border:1px solid #ded8ca;background:#fffaf0;color:#3c493d;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;cursor:pointer;transition:transform .2s,background .2s; }
.excard-share-btn:hover { background:#ecdfd0;transform:translateY(-2px); }
.excard-share-btn svg { width:17px;height:17px; }
.exercise-sheet-backdrop[hidden],.exercise-notice[hidden] { display:none !important; }
.exercise-sheet-backdrop { position:fixed;inset:0;z-index:510;background:rgba(16,22,17,.62);display:flex;align-items:end;justify-content:center;animation:exercise-fade .22s both; }
.exercise-sheet { background:#f6f3eb;border-radius:28px 28px 0 0;width:min(100%,540px);max-height:min(76vh,710px);padding:22px 20px max(26px,env(safe-area-inset-bottom));display:flex;flex-direction:column;box-shadow:0 -22px 65px rgba(0,0,0,.15);animation:exercise-up .38s cubic-bezier(.22,1,.36,1) both; }
.exercise-sheet-head { display:flex;align-items:start;justify-content:space-between;padding:4px 4px 17px;border-bottom:1px solid #ded9cd; }
.exercise-sheet-head span { font:700 10px 'DM Sans';letter-spacing:.16em;color:#bb624b; }
.exercise-sheet-head h2 { font:400 34px/1 'Bebas Neue';letter-spacing:.025em;margin:8px 0 0;color:#22261f; }
.exercise-sheet-head button,.exercise-notice-dismiss { background:#eae4d9;border:0;border-radius:50%;width:34px;height:34px;font-size:24px;cursor:pointer;color:#30352c; }
.exercise-sheet-list { overflow-y:auto;padding:14px 0;display:grid;gap:9px; }
.exercise-sheet-item { width:100%;display:flex;align-items:center;gap:14px;background:#fffdf8;border:1px solid #ddd7ca;border-radius:17px;padding:11px;text-align:left;color:#23271f;cursor:pointer;font:600 14px 'DM Sans';transition:transform .2s,border-color .2s; }
.exercise-sheet-item:hover { transform:translateX(3px);border-color:#d8694d; }
.exercise-sheet-item img,.exercise-sheet-initial { flex:none;width:48px;height:48px;object-fit:cover;border-radius:13px; }
.exercise-sheet-initial { display:grid;place-items:center;background:#242a22;color:#fff;font:20px 'Bebas Neue'; }
.exercise-sheet-item > span:nth-child(2) { flex:1;min-width:0; }
.exercise-sheet-item strong,.exercise-sheet-item small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.exercise-sheet-item small { color:#858778;margin-top:3px;font-weight:500; }
.exercise-sheet-item svg { width:17px;height:17px;flex:none; }
.exercise-sheet-empty { padding:24px;color:#777c70;text-align:center; }
.chat-exercise-card { min-width:min(238px,72vw);max-width:310px;border-radius:19px;overflow:hidden;background:#fffdf8;border:1px solid #ddd6c8;box-shadow:0 8px 25px rgba(0,0,0,.07); }
.chat-exercise-image { width:100%;height:154px;object-fit:cover;display:block;background:#e9e5da; }
.chat-exercise-placeholder { height:100px;background:#dfe3d6;color:#72806c;display:grid;place-items:center;font:24px 'Bebas Neue';letter-spacing:.1em; }
.chat-exercise-details { padding:15px;display:flex;flex-direction:column;gap:4px; }
.chat-exercise-details small { font-size:10px;font-weight:700;letter-spacing:.14em;color:#c05b43; }
.chat-exercise-details strong { color:#23271f;font-size:17px;line-height:1.2; }
.chat-exercise-details span { color:#777d71;font-size:12px; }
.chat-exercise-add { width:100%;display:flex;align-items:center;justify-content:space-between;background:#233025;color:white;border:0;padding:12px 15px;cursor:pointer;font:700 12px 'DM Sans'; }
.chat-exercise-add svg { width:16px;height:16px; }
.exercise-notice { position:fixed;z-index:600;top:max(12px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(calc(100% - 24px),450px);background:#242a22;color:#fffdf8;border:1px solid #586353;border-radius:19px;padding:12px;display:flex;align-items:center;gap:10px;box-shadow:0 20px 50px rgba(0,0,0,.28);animation:exercise-notice-in .45s cubic-bezier(.22,1,.36,1); }
.exercise-notice-mark { background:#e86142;border-radius:12px;padding:9px;display:grid;place-items:center; }
.exercise-notice-mark svg { width:20px;height:20px; }
.exercise-notice-copy { flex:1;min-width:0;display:flex;flex-direction:column;gap:2px; }
.exercise-notice-copy small { color:#ef9b80;font:700 9px 'DM Sans';letter-spacing:.13em; }
.exercise-notice-copy strong,.exercise-notice-copy span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.exercise-notice-copy strong { font-size:13px; }.exercise-notice-copy span { font-size:11px;color:#c5cec1; }
.exercise-notice-open { border:0;border-radius:9px;background:#f1e7d8;color:#222b21;padding:9px 10px;font:700 11px 'DM Sans';cursor:pointer; }
.exercise-notice-dismiss { width:25px;height:25px;background:none;color:#c4cbbd;font-size:19px; }
@keyframes exercise-fade { from { opacity:0; } }
@keyframes exercise-up { from { transform:translateY(100%); } }
@keyframes exercise-notice-in { from { opacity:0;transform:translateY(-120%); } }
@media (prefers-reduced-motion:reduce) { .exercise-sheet,.exercise-sheet-backdrop,.exercise-notice { animation:none; } }
