/* Personalize: the existing SWARM surface, not a new design language.
   Tokens only -- no gradients, no glass, no rounded-card sprawl. */
.personalize-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--s6);padding-top:var(--s5)}
.personalize-menu{display:flex;flex-direction:column;gap:2px;border-right:1px solid var(--line);padding-right:var(--s4);min-width:0}
.personalize-menu .tab{text-align:left;padding:9px 0;border-bottom:0;border-right:2px solid transparent;background:none;border-top:0;border-left:0;color:var(--muted);font-size:13px;width:100%}
.personalize-menu .tab[aria-selected=true]{color:#fff;border-right-color:#ddd}
.personalize-menu .tab:hover{color:#fff}
.personalize-body{min-width:0}
.personalize-section{display:flex;flex-direction:column;gap:var(--s4);max-width:820px}
.personalize-heading h2{margin-bottom:var(--s1)}
.personalize-heading .notice{margin:var(--s2) 0 0}
.personalize-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3) var(--s5)}
.personalize-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.personalize-field>span{font-size:13px;color:var(--secondary)}
.personalize-field select,.personalize-field input,.personalize-vocab{background:var(--surface);color:var(--text);border:1px solid var(--line);padding:7px 9px;border-radius:2px;width:100%}
.personalize-field select:hover,.personalize-field input:hover{border-color:var(--line-strong)}
.personalize-field small{font-size:11px;line-height:1.5}
.personalize-toggles{display:flex;flex-direction:column;gap:var(--s3);border-top:1px solid var(--line);padding-top:var(--s4)}
.personalize-toggle{display:flex;gap:var(--s3);align-items:flex-start;cursor:pointer}
.personalize-toggle input{margin-top:3px;accent-color:#ddd}
.personalize-toggle span{display:flex;flex-direction:column;gap:2px;font-size:14px}
.personalize-toggle small{font-size:11px;line-height:1.5}
.personalize-status{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;border:1px solid var(--line);background:var(--surface);padding:var(--s3) var(--s4)}
.personalize-status strong{font-size:17px;letter-spacing:-.3px}
.personalize-playground{display:flex;flex-direction:column;gap:var(--s2);border-top:1px solid var(--line);padding-top:var(--s4)}
.personalize-playground-row{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap}
.personalize-preview-text{flex:1 1 280px;min-width:0;background:var(--surface);color:var(--text);border:1px solid var(--line);padding:7px 9px;border-radius:2px}
.personalize-playground select{background:var(--surface);color:var(--text);border:1px solid var(--line);padding:7px 9px;border-radius:2px}
.personalize-audio{width:100%;max-width:420px;height:32px}
.personalize-metrics{display:flex;gap:var(--s4);flex-wrap:wrap;align-items:center;min-height:18px}
.personalize-script{display:block;width:100%;white-space:pre-wrap;word-break:break-word}
.personalize-facts{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--s2) var(--s4);margin:0}
.personalize-facts dt{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.personalize-facts dd{margin:0;font-family:var(--mono)}
.personalize-referents{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s2)}
.personalize-referents li{display:flex;justify-content:space-between;gap:var(--s3);border-bottom:1px solid var(--line);padding-bottom:var(--s2)}
.personalize-actions{display:flex;gap:var(--s2);flex-wrap:wrap;border-top:1px solid var(--line);padding-top:var(--s4)}
.badge-muted{color:var(--muted)}
.personalize-room-item{align-items:center}
.personalize-room-item>div:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.personalize-room-meta{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:860px){
  .personalize-layout{grid-template-columns:1fr}
  /* Wrap, don't scroll: a sideways strip hid Integrations off the right edge. */
  .personalize-menu{flex-direction:row;flex-wrap:wrap;gap:0 var(--s4);border-right:0;border-bottom:1px solid var(--line);padding:0 0 var(--s2)}
  .personalize-menu .tab{border-right:0;border-bottom:2px solid transparent;padding:8px 0;width:auto;white-space:nowrap}
  .personalize-menu .tab[aria-selected=true]{border-bottom-color:#ddd;border-right-color:transparent}
  .personalize-grid,.personalize-facts{grid-template-columns:1fr}
}