/* Shared interaction layer. Use the existing Inter / graphite / cyan tokens. */
:root{--control-height:38px;--focus-ring:var(--primary-hover)}
:is(button,a,input,select,textarea,summary,[role="button"]):focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
.content:focus-visible,.modal:focus-visible{outline:none}
button:disabled{cursor:not-allowed;opacity:.55}
button[aria-busy="true"]{cursor:wait}
button svg{flex:none}
.btn{min-height:var(--control-height);justify-content:center;line-height:1.35}
.btn-sm{min-height:32px}
.icon-btn{width:38px;height:38px;flex:none}
.mini-btn{width:auto;min-width:32px;min-height:32px;padding:5px 7px}
.input,.login-input,.crm-select-trigger{min-height:var(--control-height);line-height:1.4}
.input:disabled,.login-input:disabled{opacity:.6;cursor:not-allowed}
input[type="date"],input[type="time"]{min-width:0}
input[type="checkbox"],input[type="radio"]{accent-color:var(--primary-hover)}
.field>label,.field-lbl{color:var(--ink-muted);font-weight:500;line-height:1.4}
.field>label[for]{cursor:pointer}
.field .hint{line-height:1.5;color:var(--ink-subtle)}
.field strong{font-size:13px}
.crm-select-value{min-width:0;overflow-wrap:anywhere}
.crm-select-option:focus-visible{outline:2px solid var(--primary-hover);outline-offset:-2px}
.tb-search{min-height:38px}
.tb-search input{min-width:0}
.tb-search:focus-within,.crm-search:focus-within{border-color:var(--primary-focus);box-shadow:0 0 0 2px var(--primary-soft)}
.tb-me{text-align:left;min-height:38px}
.tb-me .nm,.sb-me .nm{overflow-wrap:anywhere}
.sb-me>div{min-width:0}
.sb-label{color:var(--ink-subtle);letter-spacing:0;font-size:11.5px}
.nav-item{text-align:left;min-height:42px;line-height:1.35}
.nav-item.active{background:var(--primary-soft);color:var(--primary-hover)}
.nav-item.active .ic{color:var(--primary-hover)}
.nav-item .nbadge{flex:none}
.sb-mobile-head{display:none}
.sb-widget[role="button"]{cursor:pointer;transition:border-color .15s}
.sb-widget[role="button"]:hover{border-color:var(--line-3)}
.page-hd h2,.prospect-head h2{font-size:22px;line-height:1.25;letter-spacing:-.025em}
.page-hd>div,.panel,.sales-panel,.territory-panel,.prof-card,.tcard{min-width:0}
.page-hd .sub{max-width:76ch;line-height:1.5}
.page-next{line-height:1.5}
.panel-hd{flex-wrap:wrap}
.panel-hd h3{line-height:1.4}
.panel-hd .sub{line-height:1.5;color:var(--ink-subtle)}
.kpi:hover{transform:none;box-shadow:none}
.kpi .kv,.kpi .kt,.tstat b{overflow-wrap:anywhere}
.empty{color:var(--ink-subtle);line-height:1.6}
.empty b{font-size:14px;color:var(--ink)}
.empty p{max-width:60ch;margin:4px auto 16px;color:var(--ink-subtle)}
.app-state{max-width:600px;margin:32px auto;padding:28px}
.app-state h2{font-size:20px;line-height:1.35}
.app-state p{margin:10px 0 20px;color:var(--ink-subtle);line-height:1.6;overflow-wrap:anywhere}
.sales-error:empty,.sales-note:empty{display:none}
.vt th{font-weight:500;color:var(--ink-muted);font-size:12px;background:var(--s2)}
.vt th,.vt td{line-height:1.5}
.vt td{overflow-wrap:anywhere}
.tbl-wrap,.sales-table-wrap{max-width:100%;overscroll-behavior-x:contain}
.row-act{flex-wrap:wrap;gap:6px}
.bc-name,.cc-name,.tname,.modal h3{overflow-wrap:anywhere}
.modal{max-height:calc(100dvh - 48px);margin:24px auto;overscroll-behavior:contain}
.modal h3{padding-right:36px;line-height:1.35}
.modal .m-sub{line-height:1.5;padding-right:20px}
.modal-close{width:34px;height:34px;color:var(--ink-muted)}
.m-acts .btn-danger{margin-right:auto}
.modal .m-acts{position:sticky;bottom:-24px;background:var(--s1);margin-inline:-24px;margin-bottom:-24px;padding:14px 24px;z-index:3}
.modal .form-grid{align-items:start}
#toastRoot{width:min(560px,calc(100vw - 24px));pointer-events:none}
.toast{max-width:100%;color:var(--ink);line-height:1.5;pointer-events:auto}
.toast>span{min-width:0;overflow-wrap:anywhere}
.toast>svg{flex:none;align-self:flex-start;margin-top:3px}
.toast.err{color:var(--ink);border-color:var(--red)}
.toast.err>svg{color:var(--red)}
.toast.ok{color:var(--ink);border-color:var(--green)}
.toast.ok>svg{color:var(--green)}
@media(max-width:900px){
  :root{--control-height:44px}
  .content{padding-top:20px}
  .has-global-search .content{padding-top:76px}
  .sb-mobile-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);flex:none}
  .sb-mobile-head strong{font-size:14px;font-weight:600}
  .sb-scroll{padding-top:12px}
  .sidebar{width:min(300px,calc(100vw - 32px));right:-320px}
  .nav-item{min-height:46px}
  .icon-btn{width:40px;height:40px}
  .main-wrap:not(.has-global-search) .tb-search{display:none}
  .page-hd h2,.prospect-head h2{font-size:20px}
  .modal{margin:12px auto;max-height:calc(100dvh - 24px)}
  .modal .m-acts{bottom:-24px;background:var(--s1);gap:8px}
  .modal .m-acts .btn{flex:1 1 auto;white-space:normal}
  .modal .m-acts .btn-danger{flex-basis:100%;margin-right:0}
  .app-state{margin-top:16px;padding:20px}
}
@media(max-width:560px){
  .topbar .brand-mark{width:108px}
  .topbar{gap:7px}
  .topbar .tb-right{gap:7px}
  .tb-me{padding:3px;border-radius:9px}
  .team-grid{grid-template-columns:minmax(0,1fr)}
  .rop-banner{align-items:flex-start}
  .rop-banner>div{min-width:0}
  .tcard .tacts>.btn{flex:1 1 auto;white-space:normal}
  .board-tools{width:100%}
  .crm-search{width:100%;flex:1 1 100%}
  .board-tools .field{min-width:0;flex:1}
  .page-hd .btn{white-space:normal}
  .nextcall-row{flex-wrap:wrap}
  .nextcall-row .nc-main{flex-basis:calc(100% - 76px)}
  .nextcall-row .row-act{width:100%;justify-content:flex-end}
  .toast{flex-wrap:wrap;padding:12px;font-size:12.5px}
  .toast>span{flex:1}
  .toast-action{margin-left:auto;min-height:36px}
}
@media(pointer:coarse){.mini-btn,.icon-btn,.modal-close,.crm-select-option{min-height:44px;min-width:44px}.btn-sm{min-height:40px}}