[data-screen=contacts] .wrap{flex:1 1;display:flex;flex-direction:column;gap:16px;min-height:0;min-width:0}[data-screen=contacts] .filters{height:36px;display:flex;align-items:center;gap:12px;flex:none}[data-screen=contacts] .seg{display:flex;background:var(--well2);border:1px solid var(--line);border-radius:18px;padding:3px;gap:2px}[data-screen=contacts] .seg span{height:28px;padding:0 12px;border-radius:14px;display:flex;align-items:center;gap:6px;font-size:.8125rem;font-weight:700;color:var(--ink3);white-space:nowrap}[data-screen=contacts] .seg span i{font-style:normal;font-weight:600;opacity:1}[data-screen=contacts] .seg span.on{background:var(--seg-on);color:var(--seg-ink);box-shadow:var(--seg-shadow)}[data-screen=contacts] .seg span.on i{opacity:1}[data-screen=contacts] .tf{display:flex;align-items:center;gap:8px}[data-screen=contacts] .tf .lb{gap:6px;color:var(--ink3);margin-right:2px}[data-screen=contacts] .tf .lb,[data-screen=contacts] .tf .t{display:flex;align-items:center;font-size:.8125rem;font-weight:700}[data-screen=contacts] .tf .t{height:28px;padding:0 12px;border-radius:14px;background:var(--glass);border:1px solid var(--line);color:var(--ink2);white-space:nowrap;box-sizing:border-box}[data-screen=contacts] .tf .t.more{color:var(--ink3);background:transparent}[data-screen=contacts] .ctl{height:36px;border-radius:18px;background:var(--glass);border:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:0 14px;box-sizing:border-box;font-size:.8125rem;font-weight:700;color:var(--ink2);white-space:nowrap}[data-screen=contacts] .ctl.s{margin-left:auto;width:280px;gap:10px;font-size:.875rem;font-weight:400;color:var(--ink3)}[data-screen=contacts] .body{flex:1 1;display:grid;grid-template-columns:minmax(0,1fr) 360px;grid-gap:20px;gap:20px;min-height:0}[data-screen=contacts] .body>.card{display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden}[data-screen=contacts] .panel{flex:1 1 auto;min-height:0;min-width:0;display:flex;flex-direction:column}[data-screen=contacts] .muted{margin-left:auto;color:var(--ink3);font-size:.8125rem;font-weight:600}[data-screen=contacts] .th,[data-screen=contacts] .tr{display:grid;grid-template-columns:172px 100px 84px 92px 148px minmax(0,1fr);grid-gap:10px;gap:10px;align-items:center;padding:0 12px}[data-screen=contacts] .th{height:30px;margin-top:12px;color:var(--ink3);font-size:.75rem;font-weight:700;letter-spacing:.3px;text-transform:uppercase;border-bottom:1px solid var(--line);flex:none}[data-screen=contacts] .list{flex:1 1 auto;min-height:0;min-width:0;overflow:auto;display:flex;flex-direction:column}[data-screen=contacts] .tr{min-height:48px;flex:0 0 auto;box-sizing:border-box;border-top:1px solid var(--line);color:var(--ink)}[data-screen=contacts] .tr:first-child{border-top-color:transparent}[data-screen=contacts] .tr.sel{border-radius:12px;border-top-color:transparent;background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent-line)}[data-screen=contacts] .tr.sel+.tr{border-top-color:transparent}[data-screen=contacts] .cl{display:flex;align-items:center;gap:10px;min-width:0}[data-screen=contacts] .cl .av{width:30px;height:30px;border-radius:50%;background:var(--glass2);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.75rem;flex:none}[data-screen=contacts] .cl .nm{font-weight:700;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-screen=contacts] .cl .ct{color:var(--ink3);font-size:.75rem;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-screen=contacts] .ph{color:var(--ink2);font-size:.8125rem;font-weight:600;white-space:nowrap;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}[data-screen=contacts] .lc .d{font-size:.8125rem;font-weight:700;color:var(--ink2);display:flex;align-items:center;gap:8px;white-space:nowrap}[data-screen=contacts] .lc .t{color:var(--ink3);font-size:.75rem;margin-top:2px;white-space:nowrap}[data-screen=contacts] .tgs{display:flex;gap:4px;min-width:0;overflow:hidden}[data-screen=contacts] .tg{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:10px;font-size:.75rem;font-weight:700;background:rgb(var(--fg)/.08);color:var(--ink2);white-space:nowrap;flex:none}[data-screen=contacts] .tg.l{background:rgb(var(--accent-rgb)/.16);color:var(--blue-ink)}[data-screen=contacts] .nd{color:var(--ink2);font-size:.8125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-screen=contacts] .foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;align-items:center;gap:12px;color:var(--ink3);font-size:.8125rem;font-weight:600;flex:none}[data-screen=contacts] .foot .link{margin-left:auto}[data-screen=contacts] .drawer{gap:12px}[data-screen=contacts] .body>.drawer{overflow:auto}[data-screen=contacts] .dhead{display:flex;flex-wrap:wrap;align-items:center;gap:12px;flex:none}[data-screen=contacts] .dhead>div:nth-child(2){flex:1 1 140px;min-width:0}[data-screen=contacts] .dhead .tag{flex:none}[data-screen=contacts] .dhead .av{width:44px;height:44px;border-radius:50%;background:var(--glass2);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;flex:none}[data-screen=contacts] .dhead .nm{font-size:17px;font-weight:600;white-space:normal;overflow-wrap:anywhere}[data-screen=contacts] .dhead .mt{color:var(--ink3);font-size:.8125rem;margin-top:2px;white-space:normal;overflow-wrap:anywhere}[data-screen=contacts] .box{background:var(--well);border-radius:14px;padding:12px 14px;flex:none}[data-screen=contacts] .lbl{color:var(--ink3);font-size:.75rem;font-weight:700;letter-spacing:.3px}[data-screen=contacts] .kv{display:grid;grid-template-columns:72px minmax(0,1fr);grid-gap:8px 10px;gap:8px 10px;align-items:center;font-size:.8125rem}[data-screen=contacts] .kv .k{color:var(--ink3);font-weight:700;font-size:.75rem;white-space:nowrap}[data-screen=contacts] .kv .v{color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}[data-screen=contacts] .calls{flex:0 0 auto;min-height:0;min-width:0}[data-screen=contacts] .calls .call{padding:10px 0}[data-screen=contacts] .calls .call>div:nth-child(2){flex:1 1;min-width:0}[data-screen=contacts] .calls .nm{font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-screen=contacts] .calls .mt{white-space:nowrap}[data-screen=contacts] .notes{flex:1 0 auto;min-height:0;min-width:0;display:flex;flex-direction:column}[data-screen=contacts] .notes p{margin:6px 0 0;font-size:.8125rem;line-height:1.45;color:var(--ink)}[data-screen=contacts] .fu{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:.8125rem;font-weight:700;color:var(--ink);white-space:normal}[data-screen=contacts] .fu b{width:7px;height:7px;border-radius:50%;background:var(--amber);display:inline-block;flex:none}[data-screen=contacts] .fu .link{margin-left:auto}[data-screen=contacts] .acts{padding:4px 14px;margin-top:auto}[data-screen=contacts] .act{display:flex;align-items:center;gap:10px;height:38px;border-top:1px solid var(--line);font-size:.8125rem;font-weight:700;color:var(--ink)}[data-screen=contacts] .act:first-child{border-top:0}[data-screen=contacts] .act svg{color:var(--blue)}[data-screen=contacts] .act .rt{margin-left:auto;color:var(--ink3);font-size:.75rem;font-weight:600}@media (min-height:901px){@container app-content (width >= 900px){[data-screen=contacts] .tr{flex:1 1 auto}[data-screen=contacts] .calls{flex:1 1 auto;display:flex;flex-direction:column}[data-screen=contacts] .calls>.row{flex:none}[data-screen=contacts] .calls>div:last-child{flex:1 1 auto;min-height:0;min-width:0;overflow:auto;display:flex;flex-direction:column}[data-screen=contacts] .calls .call{flex:1 0 auto}[data-screen=contacts] .notes p{flex:1 1 auto;min-height:0;overflow:auto}}}@container app-content (width < 1280px){[data-screen=contacts] .body{grid-template-columns:minmax(0,1fr) 324px;gap:16px}[data-screen=contacts] .th,[data-screen=contacts] .tr{grid-template-columns:158px 96px 78px 90px 124px minmax(0,1fr)}[data-screen=contacts] .ctl.s{width:236px}[data-screen=contacts] .tf .t:nth-child(6){display:none}}@container app-content (width < 1120px){[data-screen=contacts] .filters{height:auto;flex-wrap:wrap;row-gap:8px}[data-screen=contacts] .ctl{min-width:0;overflow:hidden}[data-screen=contacts] .ctl.s{width:auto;flex:1 1 180px;min-width:140px;white-space:nowrap}[data-screen=contacts] .th>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-screen=contacts] .fu{flex-wrap:wrap;white-space:normal;row-gap:4px}[data-screen=contacts] .body{grid-template-columns:minmax(0,1fr) 300px}[data-screen=contacts] .th span:nth-child(n+5),[data-screen=contacts] .tr .nd,[data-screen=contacts] .tr .tgs{display:none}[data-screen=contacts] .th,[data-screen=contacts] .tr{grid-template-columns:minmax(0,1fr) 112px 80px 92px}[data-screen=contacts] .ctl.s{width:200px}[data-screen=contacts] .tf .t:nth-child(n+5):not(.more){display:none}}@container app-content (width < 900px){[data-screen=contacts] .wrap{flex:none;min-height:auto}[data-screen=contacts] .filters{height:auto;gap:10px}[data-screen=contacts] .tf{display:none}[data-screen=contacts] .ctl.s{width:auto;flex:1 1 200px;min-width:0;max-width:360px}[data-screen=contacts] .body{grid-template-columns:minmax(0,1fr);gap:16px;flex:none;min-height:auto}[data-screen=contacts] .body>.card{overflow:visible;min-height:auto}[data-screen=contacts] .panel{min-height:auto}[data-screen=contacts] .list{flex:0 0 auto;min-height:auto;overflow:visible;display:block}[data-screen=contacts] .tr{flex:0 0 auto}[data-screen=contacts] .calls{flex:0 0 auto;min-height:auto;display:block}[data-screen=contacts] .notes,[data-screen=contacts] .notes p{flex:0 0 auto;min-height:auto;overflow:visible}[data-screen=contacts] .th span:nth-child(6),[data-screen=contacts] .tr .nd{display:block}[data-screen=contacts] .th,[data-screen=contacts] .tr{grid-template-columns:minmax(0,1.5fr) 112px 82px 92px minmax(0,1.6fr)}[data-screen=contacts] .body>.drawer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;grid-gap:12px;gap:12px}[data-screen=contacts] .drawer .dhead{grid-column:1/-1}[data-screen=contacts] .drawer .acts{margin-top:0}}@container app-content (width < 680px){[data-screen=contacts] .filters{flex-wrap:wrap;row-gap:8px}[data-screen=contacts] .seg{padding:4px;border-radius:22px;flex-wrap:wrap;max-width:100%;box-sizing:border-box}[data-screen=contacts] .seg span{height:36px;border-radius:18px;padding:0 14px}[data-screen=contacts] .ctl.s{flex:1 1 100%;max-width:none;margin-left:0;width:auto;height:36px}[data-screen=contacts] .panel>.row{flex-wrap:wrap;row-gap:2px}[data-screen=contacts] .th{display:none}[data-screen=contacts] .tr{grid-template-columns:minmax(0,1fr) auto;height:auto;min-height:56px;padding:10px;gap:4px 10px;border-radius:12px;align-items:start}[data-screen=contacts] .tr>.cl{grid-column:1;grid-row:1;align-items:center}[data-screen=contacts] .tr>span:nth-child(4){grid-column:2;grid-row:1;justify-self:end;align-self:center}[data-screen=contacts] .tr>.ph{grid-column:1;grid-row:2;align-self:center}[data-screen=contacts] .tr>.lc{grid-column:2;grid-row:2;justify-self:end}[data-screen=contacts] .tr>.nd{grid-column:1/-1;grid-row:3}[data-screen=contacts] .tr .lc .d{justify-content:flex-end}[data-screen=contacts] .tr .lc .t{text-align:right}[data-screen=contacts] .body>.drawer{grid-template-columns:minmax(0,1fr)}[data-screen=contacts] .act{height:44px}}@container app-content (width < 480px){[data-screen=contacts] .card.pad{padding:16px 14px}[data-screen=contacts] .seg{width:100%}[data-screen=contacts] .seg span{flex:1 1;min-width:0;justify-content:center;padding:0 8px}[data-screen=contacts] .seg span i{display:none}[data-screen=contacts] .muted{margin-left:0;flex:1 1 100%}[data-screen=contacts] .tr{padding:10px 8px}[data-screen=contacts] .cl .av{width:28px;height:28px}[data-screen=contacts] .foot{flex-wrap:wrap;row-gap:4px}[data-screen=contacts] .dhead .mt,[data-screen=contacts] .dhead .nm{white-space:normal}[data-screen=contacts] .kv{grid-template-columns:62px minmax(0,1fr)}[data-screen=contacts] .kv .v{white-space:normal;overflow-wrap:anywhere}[data-screen=contacts] .calls .mt{white-space:normal}[data-screen=contacts] .fu{flex-wrap:wrap;white-space:normal;row-gap:4px}}[data-screen=contacts] .ctl input{flex:1 1;min-width:0;padding:0;border:0;background:none;font:inherit;font-size:inherit;color:var(--ink)}[data-screen=contacts] .ctl input::placeholder{color:var(--ink3)}[data-screen=contacts] .ctl input:focus{outline:none}[data-screen=contacts] .ctl:focus-within{border-color:var(--accent-line)}[data-screen=contacts] .seg button{height:28px;padding:0 12px;border:0;border-radius:14px;display:flex;align-items:center;font:inherit;font-size:.8125rem;font-weight:700;color:var(--ink3);background:transparent;cursor:pointer;white-space:nowrap}[data-screen=contacts] .seg button.on{background:var(--seg-on);color:var(--seg-ink);box-shadow:var(--seg-shadow)}[data-screen=contacts] .seg button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}[data-screen=contacts] .seg button i{font-style:normal;font-weight:600;margin-left:6px}[data-screen=contacts] .foot button.link{margin-left:auto;padding:0;border:0;background:none;font:inherit;font-size:.875rem;font-weight:700;cursor:pointer}[data-screen=contacts] .acts .act:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}[data-screen=contacts] .dhead h3.nm{margin:0}[data-screen=contacts] .dhead h3.nm button{padding:0;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer;overflow-wrap:anywhere}@container app-content (width < 680px){[data-screen=contacts] .seg button{height:36px;border-radius:18px;padding:0 14px}}@container app-content (width < 480px){[data-screen=contacts] .seg button{flex:1 1;min-width:0;justify-content:center;padding:0 8px}[data-screen=contacts] .seg button i{display:none}}