/* The existing champagne controls now form one four-mode selector. */
#studio-console .console-group:has(> #circle-count-row[hidden]),#studio-console .console-group:has(> #sphere-controls[hidden]) { display:none; }
#studio-console #scope-description { color:#a89e8c; font:11px/1.8 var(--font-ui); margin:12px 0 8px; }
#studio-console .view-switch button { display:flex; align-items:center; justify-content:flex-start; gap:11px; min-height:67px; padding:11px 12px; text-align:left; border-radius:10px 10px 4px 10px; position:relative; transition:background .2s,border-color .2s,box-shadow .2s; }
#studio-console .view-switch button[aria-pressed="true"] { background:linear-gradient(125deg,#4a3a21,#29251c); border-color:#bda16b; box-shadow:inset 0 1px #f3dcaa36; }
#studio-console .view-switch strong { display:block; font:500 13px/1.5 var(--font-ui); color:inherit; }
#studio-console .view-switch small { display:block; font:10px/1.6 var(--font-ui); color:#a69d8c; }
.mode-glyph { display:block; flex:0 0 24px; width:24px; height:24px; color:#c3af88; opacity:.72; position:relative; }
[aria-pressed="true"] .mode-glyph { opacity:1; color:#f4d69f; }
.mode-sphere { border:1px solid currentColor; border-radius:50%; }
.mode-sphere:before { content:""; position:absolute; inset:2px 6px; border:1px solid currentColor; border-radius:50%; }
.mode-sphere:after { content:""; position:absolute; inset:8px 0; border-block:1px solid currentColor; border-radius:50%; }
.mode-orbit:before,.mode-orbit:after { content:""; position:absolute; inset:5px -1px; border:1px solid currentColor; border-radius:50%; transform:rotate(-35deg); }
.mode-orbit:after { inset:2px 5px; transform:rotate(-35deg); }
.mode-grid { background:radial-gradient(circle,currentColor 2px,transparent 3px) 0 0/8px 8px; }
.mode-rank { background:linear-gradient(currentColor,currentColor) 0 3px/24px 2px no-repeat,linear-gradient(currentColor,currentColor) 0 11px/18px 2px no-repeat,linear-gradient(currentColor,currentColor) 0 19px/12px 2px no-repeat; }
body[data-relationship-layout="grid"] #studio-console #sphere-controls>div { grid-template-columns:40px 40px 1fr; }
.relationship-grid-labels { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.relationship-grid-label { position:absolute; left:0; top:0; display:block; text-align:center; margin-left:0; font:11px/1.45 var(--font-ui); color:#d9d2c6; }
.relationship-grid-label strong { display:block; transform:translateX(-50%); font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.relationship-grid-label small { display:block; transform:translateX(-50%); color:#a99a7e; font-size:9px; margin-bottom:2px; }
#studio-workspace .relationship-panel { padding:10px 32px 24px; background:transparent; }
#studio-workspace #relationship-list { max-width:820px; margin-inline:auto; }
#studio-workspace #relationship-list button { grid-template-columns:40px 52px minmax(0,1fr) 22px; gap:18px; min-height:84px; margin-block:7px; padding:12px 18px; background:#ffffff03; border:1px solid #dac29915; border-radius:12px 12px 4px 12px; }
#studio-workspace #relationship-list .friend-avatar { width:52px; height:52px; }
#studio-workspace #relationship-list b { font:400 20px/1 "Falao Figures",sans-serif; color:#8e8474; }
#studio-workspace #relationship-list li:nth-child(-n+3) b { color:#e0c48d; }
#studio-workspace #relationship-list li:nth-child(-n+3) button { background:linear-gradient(110deg,#8d6e2520,#17171330); border-color:#d5b77930; }
#studio-workspace #relationship-list strong { font-size:15px; }
#studio-workspace #relationship-list small { line-height:1.7; }
#studio-workspace #relationship-list li { content-visibility:auto; contain-intrinsic-size:auto 91px; }
@media (prefers-reduced-motion:no-preference) {
  #relationship-panel:not([hidden]) #relationship-list li:nth-child(-n+12) { animation:relationship-rank-arrive .58s cubic-bezier(.2,.7,.2,1) both; animation-delay:calc(var(--rank-entry)*28ms); }
  @keyframes relationship-rank-arrive { from { opacity:0; transform:translate3d(0,18px,0); } to { opacity:1; transform:translate3d(0,0,0); } }
}
@media(max-width:760px) {
  #studio-console .view-switch button { min-height:61px; padding:10px 13px; }
  #studio-workspace .relationship-panel { padding:5px 8px 18px; }
  #studio-workspace #relationship-list button { grid-template-columns:26px 42px minmax(0,1fr) 16px; gap:9px; min-height:76px; padding:10px; }
  #studio-workspace #relationship-list .friend-avatar { width:42px; height:42px; }
  #studio-workspace #relationship-list strong { font-size:13px; }
  .relationship-grid-label { font-size:10px; }
}