
/* Support-circle editor. Scoped; no global styles touched.
   Class names avoid the global wildcard traps (-card / tag / badge / avatar / -input / stat-). */
#page-profile .support-person .sp-actions button{ cursor:pointer; }
#page-profile .support-person .sp-actions button:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }

#spModal{position:fixed;inset:0;z-index:100005;background:rgba(28,32,26,.62);display:none;
  align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(3px)}
#spModal.on{display:flex}
#spModal .spm-box{background:#FFFDFA;border-radius:24px;max-width:560px;width:100%;max-height:92vh;
  overflow-y:auto;padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.35);
  font-family:'Nunito',system-ui,sans-serif;color:#33402f}
#spModal h3{font-family:'Playfair Display',serif;font-size:1.5rem;color:#243447;margin:0 0 4px}
#spModal .spm-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}
#spModal .spm-sub{color:#78766c !important;-webkit-text-fill-color:#78766c !important;font-size:.9rem;margin:0}
#spModal .spm-x{background:none;border:1px solid #EAE2D4;border-radius:10px;cursor:pointer;padding:9px 12px;
  color:#78766c;min-height:42px;font:inherit}
#spModal .spm-x:hover{background:#FBF6EC}
#spModal .spm-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
#spModal .spm-f{display:block}
#spModal .spm-full{grid-column:1/-1}
#spModal .spm-f label{display:block;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:#78766c !important;-webkit-text-fill-color:#78766c !important;margin-bottom:5px}
#spModal .spm-f input,#spModal .spm-f select{width:100%;border:1.5px solid #EAE2D4;border-radius:11px;
  padding:10px 12px;font:inherit;font-size:.94rem;color:#243447;background:#fff;min-height:44px}
#spModal .spm-f input:focus,#spModal .spm-f select:focus{border-color:#7d9e77;outline:none}
#spModal .spm-hint{font-size:.78rem;color:#a09a8c !important;-webkit-text-fill-color:#a09a8c !important;margin:4px 0 0}
#spModal .spm-faces{display:flex;flex-wrap:wrap;gap:7px}
#spModal .spm-face{width:44px;height:44px;border-radius:12px;border:2px solid #EAE2D4;background:#fff;
  font-size:1.2rem;cursor:pointer;display:grid;place-items:center;padding:0}
#spModal .spm-face[aria-pressed="true"]{border-color:#5E7E57;background:#EAF1E4}
#spModal .spm-face:focus-visible{outline:3px solid #CF9E3F;outline-offset:2px}
#spModal .spm-note{display:flex;gap:9px;background:#FBF6EC;border-radius:14px;padding:13px 16px;
  font-size:.84rem;color:#78766c !important;-webkit-text-fill-color:#78766c !important;margin-top:14px}
#spModal .spm-note b{color:#243447 !important;-webkit-text-fill-color:#243447 !important}
#spModal .spm-act{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
#spModal .spm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;
  font:inherit;font-weight:800;font-size:.94rem;padding:12px 22px;cursor:pointer;border:2px solid transparent;
  line-height:1;min-height:46px}
#spModal .spm-btn--save{background:#5E7E57;color:#fff !important;-webkit-text-fill-color:#fff !important}
#spModal .spm-btn--save:hover{background:#4d6a47}
#spModal .spm-btn--ghost{background:#fff;color:#5E7E57;border-color:#EAE2D4}
#spModal .spm-btn--ghost:hover{border-color:#7d9e77}
#spModal .spm-btn--del{background:#fff;color:#C6764F;border-color:#F0DACE;margin-left:auto}
#spModal .spm-btn--del:hover{border-color:#C6764F}
#spModal .spm-err{color:#C6764F !important;-webkit-text-fill-color:#C6764F !important;font-size:.85rem;
  font-weight:700;margin:10px 0 0;display:none}
#spModal .spm-err.on{display:block}
@media (max-width:560px){
  #spModal .spm-box{padding:18px;border-radius:20px}
  #spModal .spm-grid{grid-template-columns:1fr}
  #spModal .spm-btn{width:100%}
  #spModal .spm-btn--del{margin-left:0}
}
@media (prefers-reduced-motion:reduce){#spModal *{transition:none !important}}
