@font-face{font-family:"PJS";src:url(fonts/pjs-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"PJS";src:url(fonts/pjs-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"PJS";src:url(fonts/pjs-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"PJS";src:url(fonts/pjs-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"PJS";src:url(fonts/pjs-800.woff2) format("woff2");font-weight:800;font-display:swap}

:root{
  color-scheme:light only;
  --g:#135333;--g2:#0D3F26;--g3:#1C6B44;--gs:#E6F1EA;--gt:#F1F7F3;
  --gold:#A79421;--golds:#F5EFD3;
  --ink:#0F2219;--ink2:#34483D;--mute:#6A7C72;--line:#E1E8E4;--line2:#EDF2EF;
  --bg:#F3F6F4;--card:#FFFFFF;
  --r:18px;--r2:14px;--r3:12px;
  --sh:0 1px 2px rgba(15,34,25,.04),0 4px 14px rgba(15,34,25,.05);
  --sh2:0 12px 40px rgba(15,34,25,.16);
  --sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);
  --font:"PJS","Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans Arabic",Tahoma,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;text-size-adjust:100%}
html{forced-color-adjust:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
a{color:var(--g)}
svg.i{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.hide{display:none!important}

/* ---------- shell ---------- */
.top{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line);padding:calc(var(--sat) + 10px) 16px 10px;display:flex;align-items:center;gap:12px;min-height:60px}
.brand{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.mark{width:36px;height:36px;border-radius:11px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;flex:none;box-shadow:0 2px 6px rgba(19,83,51,.08)}
.mark svg{width:23px;height:20px;display:block;transform:translate(0,-1px)}
.brand b{display:block;font-size:16px;font-weight:800;letter-spacing:-.01em;line-height:1.1}
.brand small{display:block;font-size:11.5px;color:var(--mute);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;border-radius:99px;font-size:12.5px;font-weight:700;background:var(--line2);color:var(--ink2);white-space:nowrap;flex:none}
.live i{width:8px;height:8px;border-radius:50%;background:#9AA8A0;display:block}
.live.on{background:var(--gs);color:var(--g)}
.live.on i{background:#1FA45F;box-shadow:0 0 0 0 rgba(31,164,95,.55);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(31,164,95,.5)}70%{box-shadow:0 0 0 8px rgba(31,164,95,0)}100%{box-shadow:0 0 0 0 rgba(31,164,95,0)}}

main{padding:16px 16px calc(96px + var(--sab));max-width:1180px;margin:0 auto}
.nav{position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);padding:6px 4px calc(6px + var(--sab))}
.nav a{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;min-height:58px;padding-top:2px;text-align:center;line-height:1.15;border-radius:14px;color:var(--mute);text-decoration:none;font-size:11px;font-weight:600;position:relative}
.nav a .ic{width:46px;height:28px;border-radius:99px;display:grid;place-items:center;transition:background .2s}
.nav a.on{color:var(--g)}
.nav a.on .ic{background:var(--gs)}
.nav .badge{position:absolute;top:3px;left:calc(50% + 8px);min-width:18px;height:18px;border-radius:9px;background:#D92D20;color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;padding:0 5px;border:2px solid #fff}
.side{display:none}

@media (min-width:980px){
  .nav{display:none}
  .top{padding-left:276px}
  .side{display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;width:252px;background:#fff;border-right:1px solid var(--line);padding:18px 14px;z-index:35;gap:4px}
  .side .brand{padding:4px 8px 18px;flex:none}
  .side a{display:flex;align-items:center;gap:12px;height:46px;padding:0 14px;border-radius:13px;color:var(--ink2);text-decoration:none;font-weight:600;font-size:14.5px;position:relative}
  .side a:hover{background:var(--gt)}
  .side a.on{background:var(--gs);color:var(--g)}
  .side .badge{margin-left:auto;min-width:20px;height:20px;border-radius:10px;background:#D92D20;color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;padding:0 6px}
  .side .foot{margin-top:auto;padding:12px;border-radius:14px;background:var(--gt);font-size:12px;color:var(--mute);line-height:1.5}
  .top .brand{visibility:hidden}
  main{padding:24px 28px 48px 280px;max-width:none}
  main>.wrap{max-width:1080px;margin:0 auto}
}

/* ---------- type ---------- */
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:4px 2px 14px}
.ph h1{font-size:23px;line-height:1.15;margin:0;font-weight:800;letter-spacing:-.02em}
.ph p{margin:4px 0 0;color:var(--mute);font-size:13.5px}
h2.sec{font-size:15.5px;margin:0 0 12px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.muted{color:var(--mute)}
.small{font-size:12.5px}

/* ---------- cards ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:16px}
.card+.card,.stack>*+*{margin-top:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (min-width:720px){.grid3d{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cols{display:grid;grid-template-columns:1.25fr 1fr;gap:14px;align-items:start}.cols>.card+.card{margin-top:0}}
@media (min-width:980px){.kpis{grid-template-columns:repeat(4,1fr)!important}}

/* hero */
.hero{border-radius:22px;padding:18px;color:#fff;background:radial-gradient(120% 140% at 100% 0%,#2B7A51 0%,rgba(43,122,81,0) 55%),linear-gradient(150deg,#145837 0%,#0E4229 100%);box-shadow:0 14px 34px rgba(19,83,51,.24);position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;right:-30px;bottom:-40px;width:200px;height:170px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1880.84 1592.37'%3E%3Cpath d='M6.38 1521.16L919 21.02A43.77 43.77 0 0 1 994.17 21.66L1874.85 1526.53A43.75 43.75 0 0 1 1836.23 1592.37L1619.05 1588.1A43.54 43.54 0 0 1 1582.5 1566.84L984.85 563.12A43.4 43.4 0 0 0 910.41 562.89L304.29 1566.45A44.15 44.15 0 0 1 266.5 1587.77L43.83 1587.77A43.83 43.83 0 0 1 6.38 1521.16Z' fill='%23ffffff' fill-opacity='.06'/%3E%3Cpath d='M963.12 1511.78L1592.11 482.24A50.79 50.79 0 0 1 1636.49 457.94L1830.36 461.9A50.58 50.58 0 0 1 1872.78 538.37L1260.12 1566.06A50.6 50.6 0 0 1 1216.18 1590.75L1005.82 1588.76A50.6 50.6 0 0 1 963.12 1511.78Z' fill='%23A79421' fill-opacity='.22'/%3E%3C/svg%3E") no-repeat center/contain;pointer-events:none}
.hero .row1{display:flex;align-items:center;gap:14px;position:relative;z-index:1}
.ring{width:76px;height:76px;flex:none;position:relative}
.ring svg{width:76px;height:76px;transform:rotate(-90deg)}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:18px;font-weight:800}
.hero .t{min-width:0;flex:1}
.hero .eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#CFE6D9;opacity:.95}
.hero h3{margin:3px 0 4px;font-size:19px;font-weight:800;line-height:1.2;letter-spacing:-.01em;overflow-wrap:anywhere}
.hero .sub{font-size:12.5px;color:#D7EADF;line-height:1.45}
.hero .acts{display:flex;gap:10px;margin-top:16px;position:relative;z-index:1}
.hero .btn{flex:1}
.btn-gold{background:linear-gradient(180deg,#B8A42C,#A08E1E);color:#fff;box-shadow:0 6px 16px rgba(120,100,10,.35)}
.btn-glass{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.22)}
.today{display:grid;grid-template-columns:repeat(3,1fr);margin-top:14px;border-top:1px solid rgba(255,255,255,.16);padding-top:12px;position:relative;z-index:1}
.today div{text-align:center}
.today div+div{border-left:1px solid rgba(255,255,255,.14)}
.today b{display:block;font-size:18px;font-weight:800}
.today span{font-size:11.5px;color:#CFE6D9}

/* kpi */
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:var(--sh);display:flex;flex-direction:column;gap:8px;min-height:104px;text-align:left}
.kpi .h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.kpi .h span{font-size:12.5px;color:var(--mute);font-weight:600}
.kpi .dot{width:32px;height:32px;border-radius:10px;display:grid;place-items:center}
.kpi .dot svg{width:17px;height:17px}
.kpi b{font-size:25px;font-weight:800;letter-spacing:-.02em;line-height:1}
.kpi em{font-style:normal;font-size:12px;color:var(--mute);font-weight:600}
.kpi em.up{color:var(--g)}

/* funnel */
.fun{display:flex;flex-direction:column;gap:11px}
.fun .r{display:grid;grid-template-columns:86px 1fr 64px;align-items:center;gap:10px;font-size:13px}
.fun .r span{color:var(--ink2);font-weight:600}
.fun .bar{height:12px;border-radius:99px;background:var(--line2);overflow:hidden}
.fun .bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#1C6B44,#135333);min-width:4px;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.fun .r:nth-child(4) .bar i{background:linear-gradient(90deg,#BFAE3C,#A79421)}
.fun .r b{text-align:right;font-weight:800;font-size:13px}
.fun .r b small{color:var(--mute);font-weight:600;margin-left:3px}

/* chart */
.chart{height:150px;display:flex;align-items:flex-end;gap:5px;padding-top:6px}
.chart .c{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end;min-width:0}
.chart .bars{width:100%;display:flex;align-items:flex-end;justify-content:center;gap:2px;height:100%}
.chart .bars i{display:block;width:42%;max-width:12px;border-radius:4px 4px 2px 2px;background:#CFE3D7;min-height:2px}
.chart .bars i.o{background:var(--gold);opacity:.75}
.chart .c span{font-size:9.5px;color:var(--mute);white-space:nowrap}
.legend{display:flex;gap:14px;font-size:12px;color:var(--mute);margin-top:10px;flex-wrap:wrap}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}

/* checklist */
.check{display:flex;flex-direction:column;gap:2px}
.check a{display:flex;align-items:center;gap:12px;padding:11px 4px;text-decoration:none;color:var(--ink);border-radius:12px}
.check a+a{border-top:1px solid var(--line2)}
.check .n{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--line);font-size:13px;font-weight:800;color:var(--mute);flex:none}
.check a.ok .n{background:var(--g);border-color:var(--g);color:#fff}
.check a.ok .n svg{width:16px;height:16px;stroke-width:3}
.check .tx{flex:1;min-width:0}
.check .tx b{display:block;font-size:14px;font-weight:700}
.check .tx span{display:block;font-size:12.5px;color:var(--mute)}
.check a.ok .tx b{color:var(--mute);text-decoration:line-through;text-decoration-color:#B9C6BF}
.chev{color:#A7B5AD}

/* activity */
.feed{display:flex;flex-direction:column}
.feed .e{display:flex;gap:12px;padding:10px 0;align-items:flex-start}
.feed .e+.e{border-top:1px solid var(--line2)}
.feed .ei{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;flex:none}
.feed .ei svg{width:16px;height:16px}
.feed .et{flex:1;min-width:0;font-size:13.5px;line-height:1.4}
.feed .et b{font-weight:700}
.feed .et span{display:block;color:var(--mute);font-size:12px;margin-top:1px}

/* status colours */
.s-new{--sc:#5F7067;--sb:#EEF2F0}
.s-active{--sc:#2457C5;--sb:#E9F0FD}
.s-opened{--sc:#946300;--sb:#FBF1D6}
.s-clicked{--sc:#0B7570;--sb:#DFF3F1}
.s-replied{--sc:#135333;--sb:#DDEFE4}
.s-bounced{--sc:#B42318;--sb:#FDE9E7}
.s-optout{--sc:#575C68;--sb:#ECEDF1}
.s-done{--sc:#5F7067;--sb:#EFF2F0}
.s-paused{--sc:#8A5300;--sb:#FDEFD9}
.s-error{--sc:#B42318;--sb:#FDE9E7}
.s-auto{--sc:#6B4FB8;--sb:#EFEAFB}
.pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:99px;font-size:11.5px;font-weight:700;color:var(--sc);background:var(--sb);white-space:nowrap}
.pill:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sc)}
.ei.s{color:var(--sc);background:var(--sb)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 18px;border-radius:14px;font-weight:700;font-size:15px;white-space:nowrap;transition:transform .12s,box-shadow .2s,background .2s;user-select:none;-webkit-user-select:none}
.btn:active{transform:scale(.98)}
.btn svg{width:18px;height:18px}
.btn-p{background:var(--g);color:#fff;box-shadow:0 6px 16px rgba(19,83,51,.22)}
.btn-p:hover{background:var(--g3)}
.btn-s{background:var(--gs);color:var(--g)}
.btn-o{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn-d{background:#FDE9E7;color:#B42318}
.btn-sm{height:38px;padding:0 14px;font-size:13.5px;border-radius:12px}
.btn-w{width:100%}
.btn[disabled]{opacity:.55;pointer-events:none}
.iconbtn{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);color:var(--ink2);flex:none}
.iconbtn svg{width:19px;height:19px}
.fab{position:fixed;right:16px;bottom:calc(84px + var(--sab));z-index:38;height:54px;padding:0 20px 0 16px;border-radius:18px;background:var(--g);color:#fff;font-weight:700;display:flex;align-items:center;gap:8px;box-shadow:0 12px 28px rgba(19,83,51,.32)}
@media (min-width:980px){.fab{bottom:28px;right:32px}}

/* forms */
.field{display:flex;flex-direction:column;gap:6px}
.field+.field{margin-top:14px}
.field label{font-size:13px;font-weight:700;color:var(--ink2)}
.field .hint{font-size:12px;color:var(--mute);line-height:1.45}
.in,select.in,textarea.in{width:100%;min-height:48px;border:1px solid var(--line);border-radius:13px;background:#fff;padding:12px 14px;font-size:16px;outline:none;transition:border .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
textarea.in{resize:vertical;line-height:1.55;min-height:150px}
select.in{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236A7C72' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;padding-right:40px}
.in:focus{border-color:var(--g);box-shadow:0 0 0 4px rgba(19,83,51,.1)}
.row{display:flex;gap:10px;align-items:center}
.row>.grow{flex:1;min-width:0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.two .field+.field{margin-top:0}
.search{position:relative}
.search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--mute);width:18px;height:18px}
.search .in{padding-left:42px;border-radius:14px}

/* switch */
.sw{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0}
.sw+.sw{border-top:1px solid var(--line2)}
.sw .tx b{display:block;font-size:14px;font-weight:700}
.sw .tx span{display:block;font-size:12.5px;color:var(--mute);margin-top:1px}
.tg{position:relative;width:50px;height:30px;flex:none}
.tg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;z-index:1}
.tg i{position:absolute;inset:0;border-radius:99px;background:#CDD6D1;transition:background .2s}
.tg i:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.18);transition:transform .2s cubic-bezier(.3,.7,.3,1)}
.tg input:checked+i{background:var(--g)}
.tg input:checked+i:after{transform:translateX(20px)}

/* chips and segments */
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 1px 4px;margin:12px -16px 4px;padding-left:16px;padding-right:16px;scroll-padding:16px}
.chips::-webkit-scrollbar{display:none}
@media (min-width:980px){.chips{margin-left:0;margin-right:0;padding-left:1px;flex-wrap:wrap}}
.chip{height:36px;padding:0 14px;border-radius:99px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:600;color:var(--ink2);white-space:nowrap;display:inline-flex;align-items:center;gap:7px;flex:none}
.chip em{font-style:normal;font-size:11.5px;color:var(--mute);font-weight:700}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.chip.on em{color:#B8C7BF}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:#E7EDEA;border-radius:14px;padding:4px;gap:4px}
.seg button{height:40px;border-radius:11px;font-size:13.5px;font-weight:700;color:var(--ink2);display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
.seg button.on{background:#fff;color:var(--g);box-shadow:0 1px 3px rgba(15,34,25,.12)}
.seg button i{width:7px;height:7px;border-radius:50%;background:#B9C5BE;display:block}
.seg button i.ok{background:#1FA45F}
.tags{display:flex;gap:8px;flex-wrap:wrap}
.tagb{height:38px;padding:0 13px;border-radius:12px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:700;color:var(--ink2);display:inline-flex;align-items:center;gap:7px}
.tagb .d{width:9px;height:9px;border-radius:50%}
.tagb.on{border-color:currentColor;box-shadow:0 0 0 1px currentColor inset}

/* company list */
.list{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.co{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 14px;box-shadow:var(--sh);text-align:left;width:100%;position:relative}
.co:active{background:var(--gt)}
.av{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-weight:800;font-size:15px;flex:none;letter-spacing:.01em}
.co .tx{flex:1;min-width:0}
.co .tx b{display:block;font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.co .tx span{display:block;font-size:12.5px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.co .rt{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex:none}
.trk{display:flex;gap:3px}
.trk i{width:14px;height:5px;border-radius:3px;background:var(--line);display:block}
.trk i.on{background:var(--g)}
.trk i.off{background:transparent;border:1px dashed #CBD5CF;height:5px}
.list.wide{padding-bottom:64px}
@media (min-width:980px){.list.wide{padding-bottom:0}}
.co .un{position:absolute;top:10px;left:10px;width:10px;height:10px;border-radius:50%;background:#D92D20;border:2px solid #fff}
@media (min-width:980px){.list.wide{display:grid;grid-template-columns:1fr 1fr;gap:10px}}

/* sequence editor */
.seq{display:flex;flex-direction:column;gap:0;margin-bottom:14px}
.seqi{display:flex;gap:12px;align-items:stretch}
.seqi .rail{display:flex;flex-direction:column;align-items:center;width:30px;flex:none}
.seqi .rail b{width:30px;height:30px;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center;font-size:12.5px;font-weight:800}
.seqi.off .rail b{background:#C9D3CD}
.seqi .rail i{flex:1;width:2px;background:var(--line);margin:4px 0}
.seqi .body{flex:1;padding:4px 0 16px;min-width:0}
.seqi .body b{font-size:14px;font-weight:700;display:block}
.seqi .body span{font-size:12.5px;color:var(--mute)}
.merge{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.merge button{height:30px;padding:0 10px;border-radius:9px;background:var(--golds);color:#7A6B10;font-size:12px;font-weight:700}
.stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:13px;overflow:hidden;height:46px;background:#fff;width:max-content}
.stepper button{width:46px;height:46px;display:grid;place-items:center;color:var(--g);font-size:20px;font-weight:700}
.stepper span{min-width:128px;text-align:center;font-weight:700;font-size:14px;border-left:1px solid var(--line);border-right:1px solid var(--line);height:100%;display:grid;place-items:center}
.attach{display:flex;align-items:center;gap:12px;border:1px dashed #C6D2CB;border-radius:14px;padding:12px 14px;background:var(--gt)}
.attach .tx{flex:1;min-width:0;font-size:13.5px}
.attach .tx b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.savebar{position:sticky;bottom:calc(76px + var(--sab));z-index:20;margin-top:14px;display:flex;gap:10px;padding:10px;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:18px;box-shadow:var(--sh2)}
.savebar .btn{flex:1}
@media (min-width:980px){.savebar{bottom:18px}}

/* sheet */
.scrim{position:fixed;inset:0;background:rgba(10,24,17,.42);z-index:60;opacity:0;transition:opacity .22s}
.scrim.on{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:61;background:#fff;border-radius:24px 24px 0 0;max-height:92vh;max-height:92dvh;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.85,.25,1);box-shadow:var(--sh2)}
.sheet.on{transform:none}
.sheet .grab{width:42px;height:5px;border-radius:3px;background:#D5DDD8;margin:9px auto 2px;flex:none}
.sheet .sh{display:flex;align-items:center;gap:12px;padding:8px 16px 12px;border-bottom:1px solid var(--line2);flex:none}
.sheet .sh .tx{flex:1;min-width:0}
.sheet .sh b{display:block;font-size:17px;font-weight:800;line-height:1.2;overflow-wrap:anywhere}
.sheet .sh .tx span{display:block;font-size:12.5px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet .sb{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px 16px calc(20px + var(--sab));flex:1;overscroll-behavior:contain}
@media (min-width:980px){
  .sheet{left:auto;top:0;width:520px;max-height:none;border-radius:24px 0 0 24px;transform:translateX(100%)}
  .sheet .grab{display:none}
  .sheet .sh{padding-top:18px}
}
.acts4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.acts4 button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:72px;border-radius:14px;background:var(--gt);color:var(--g);font-size:11.5px;font-weight:700;text-align:center;padding:0 4px;line-height:1.15}
.acts4 button svg{width:20px;height:20px}
.acts4 button.dn{background:#FDF0EE;color:#B42318}
.stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.stats div{padding:12px 6px;text-align:center}
.stats div+div{border-left:1px solid var(--line)}
.stats b{display:block;font-size:17px;font-weight:800}
.stats span{font-size:11.5px;color:var(--mute);font-weight:600}
.kv{display:flex;flex-direction:column}
.kv div{display:flex;justify-content:space-between;gap:14px;padding:10px 0;font-size:13.5px}
.kv div+div{border-top:1px solid var(--line2)}
.kv span{color:var(--mute)}
.kv b{font-weight:700;text-align:right;overflow-wrap:anywhere}
.tl{position:relative;padding-left:4px}
.tl .e{display:flex;gap:12px;position:relative;padding-bottom:14px}
.tl .e:before{content:"";position:absolute;left:15px;top:32px;bottom:2px;width:2px;background:var(--line2)}
.tl .e:last-child:before{display:none}
.tl .ei{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none}
.tl .ei svg{width:15px;height:15px}
.tl .et{font-size:13.5px;padding-top:5px;min-width:0}
.tl .et span{display:block;font-size:12px;color:var(--mute)}
.bubble{background:var(--gt);border:1px solid #D6E7DD;border-radius:16px 16px 16px 4px;padding:13px 14px;font-size:14px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.bubble.auto{background:#F6F4FC;border-color:#E3DCF5}
.bubble .bh{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--mute);margin-bottom:6px;white-space:normal}
.bubble .bh b{color:var(--ink2)}

/* preview */
.mailprev{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.mailprev .mh{padding:14px 16px;border-bottom:1px solid var(--line2);background:#FAFCFB}
.mailprev .mh .sj{font-size:16.5px;font-weight:800;line-height:1.3;margin-bottom:10px;overflow-wrap:anywhere}
.mailprev .mh .fr{display:flex;align-items:center;gap:10px;font-size:13px}
.mailprev .mh .fr .av{width:36px;height:36px;border-radius:50%;font-size:13px}
.mailprev .mh .fr div span{color:var(--mute);display:block;font-size:12px;overflow-wrap:anywhere}
.mailprev .mb{padding:16px}
.mailprev .att{margin:0 16px 16px;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:8px 12px;font-size:12.5px;font-weight:600}

/* table preview for import */
.imp{border:1px solid var(--line);border-radius:14px;overflow:hidden}
.imp .r{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 12px;font-size:12.5px;align-items:center}
.imp .r+.r{border-top:1px solid var(--line2)}
.imp .r.bad{background:#FFF6F5}
.imp .r b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp .r span{color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.drop{border:2px dashed #C6D2CB;border-radius:18px;padding:26px 16px;text-align:center;background:var(--gt);display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;width:100%}
.drop .ic{width:52px;height:52px;border-radius:16px;background:#fff;display:grid;place-items:center;color:var(--g);box-shadow:var(--sh)}
.drop b{font-size:15px}
.drop span{font-size:12.5px;color:var(--mute)}
.note{display:flex;gap:10px;align-items:flex-start;background:var(--golds);border-radius:14px;padding:12px 14px;font-size:13px;color:#5E5310;line-height:1.5}
.note svg{width:18px;height:18px;flex:none;margin-top:1px}
.note.g{background:var(--gs);color:var(--g2)}
.note.r{background:#FDE9E7;color:#8F1D14}
.res{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;font-size:13.5px;font-weight:600;margin-top:8px}
.res.ok{background:var(--gs);color:var(--g)}
.res.no{background:#FDE9E7;color:#B42318}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;background:#F4F7F5;border:1px solid var(--line);border-radius:12px;padding:10px 12px;word-break:break-all;line-height:1.5}

/* empty */
.empty{text-align:center;padding:38px 20px;color:var(--mute)}
.empty .ic{width:64px;height:64px;border-radius:20px;background:var(--gs);color:var(--g);display:grid;place-items:center;margin:0 auto 14px}
.empty .ic svg{width:28px;height:28px}
.empty b{display:block;color:var(--ink);font-size:16px;margin-bottom:6px}
.empty p{margin:0 auto 18px;max-width:320px;font-size:13.5px;line-height:1.5}

/* replies list */
.rp{display:flex;gap:12px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 14px;box-shadow:var(--sh);width:100%;text-align:left;position:relative}
.rp .tx{flex:1;min-width:0}
.rp .tp{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.rp .tp b{font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp .tp time{font-size:11.5px;color:var(--mute);flex:none}
.rp .who{font-size:12.5px;color:var(--ink2);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp .sn{font-size:13px;color:var(--mute);margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.45}
.rp .ft{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.rp.new{border-color:#BFDCCB;background:#FBFEFC}
.rp.new:after{content:"";position:absolute;top:16px;right:14px;width:9px;height:9px;border-radius:50%;background:#1FA45F}
.rp.new .tp time{margin-right:16px}

/* login */
.login{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 18px;background:radial-gradient(90% 60% at 50% 0%,#E2EFE7 0%,rgba(226,239,231,0) 70%),var(--bg)}
.login .box{width:100%;max-width:400px;background:#fff;border:1px solid var(--line);border-radius:26px;padding:30px 22px 24px;box-shadow:0 20px 50px rgba(19,83,51,.1);text-align:center}
.login .lm{width:74px;height:74px;border-radius:22px;margin:0 auto 16px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);box-shadow:0 8px 20px rgba(19,83,51,.12)}
.login .lm svg{width:46px;height:39px;transform:translate(0,-2px)}
.login h1{font-size:23px;margin:0;font-weight:800;letter-spacing:-.02em}
.login p{color:var(--mute);margin:6px 0 22px;font-size:14px}
.login .field{text-align:left}
.login .btn{margin-top:16px}
.login .tg2{font-size:12px;color:var(--mute);margin-top:18px;letter-spacing:.02em}

/* toast */
#toast{position:fixed;left:50%;bottom:calc(92px + var(--sab));transform:translate(-50%,20px);background:#10241A;color:#fff;padding:12px 18px;border-radius:14px;font-size:14px;font-weight:600;z-index:90;opacity:0;pointer-events:none;transition:all .25s;max-width:calc(100% - 32px);text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.2)}
#toast.on{opacity:1;transform:translate(-50%,0)}
#toast.err{background:#B42318}
@media (min-width:980px){#toast{bottom:30px}}
.spin{width:18px;height:18px;border-radius:50%;border:2.5px solid currentColor;border-right-color:transparent;animation:sp .7s linear infinite;display:inline-block}
@keyframes sp{to{transform:rotate(360deg)}}
.skel{background:linear-gradient(90deg,#EBF0ED 0%,#F5F8F6 50%,#EBF0ED 100%);background-size:200% 100%;animation:sk 1.2s infinite;border-radius:16px}
@keyframes sk{to{background-position:-200% 0}}
.fade{animation:fd .28s ease both}
@keyframes fd{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* live outreach board */
.board{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.stg{border:1px solid var(--line);border-radius:16px;padding:10px;background:#fff;min-width:0}
.stg .sh2{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.stg .sh2 .si{width:28px;height:28px;border-radius:10px;display:grid;place-items:center;flex:none}
.stg .sh2 .si svg{width:16px;height:16px}
.stg .sh2 b{font-size:13px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:800;flex:1}
.stg .sh2 em{font-style:normal;font-weight:800;font-size:13.5px;min-width:28px;height:26px;border-radius:9px;display:grid;place-items:center;padding:0 8px}
.stg .bub{display:flex;flex-wrap:wrap;gap:5px}
.stg .bub button{width:32px;height:32px;border-radius:10px;font-size:11px;font-weight:800;display:grid;place-items:center;animation:pop .45s cubic-bezier(.3,1.5,.5,1) both}
.stg .bub .more{background:var(--line2);color:var(--mute);font-size:12px;width:auto;padding:0 10px}
.stg .none{font-size:12.5px;color:var(--mute)}
@keyframes pop{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}
.flow{display:flex;align-items:center;justify-content:center;color:#B9C6BF;height:4px}
@media (min-width:980px){.board{grid-template-columns:repeat(6,1fr)}.flow{display:none}}
.btn-launch{height:56px;font-size:16.5px;border-radius:16px}
.launch{text-align:center;padding:6px 4px 4px}
.launch .rk{width:84px;height:84px;border-radius:26px;margin:0 auto 14px;display:grid;place-items:center;background:linear-gradient(150deg,#145837,#0E4229);box-shadow:0 14px 30px rgba(19,83,51,.3)}
.launch .rk svg{width:40px;height:40px;stroke:#E4CF5A}
.launch h3{font-size:21px;margin:0 0 6px;font-weight:800}
.launch p{color:var(--mute);font-size:14px;margin:0 0 16px;line-height:1.5}
.lsum{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.lsum div{background:var(--gt);border-radius:14px;padding:12px 6px}
.lsum b{display:block;font-size:20px;font-weight:800;color:var(--g)}
.lsum span{font-size:11.5px;color:var(--mute);font-weight:600}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:95;overflow:hidden}
.confetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:2px;animation:fall 2.4s ease-in forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(540deg);opacity:.2}}

@media (min-width:980px){.hero .acts{justify-content:flex-start}.hero .acts .btn:first-child{flex:0 0 300px}}

.dlg{position:fixed;inset:0;z-index:85;background:rgba(10,24,17,.45);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .2s}
.dlg.on{opacity:1}
.dlg-b{background:#fff;border-radius:22px;padding:22px 18px 16px;width:100%;max-width:380px;box-shadow:var(--sh2);text-align:center;transform:scale(.96);transition:transform .2s}
.dlg.on .dlg-b{transform:none}
.dlg-b b{display:block;font-size:18px;font-weight:800;margin-bottom:8px}
.dlg-b p{margin:0 0 16px;color:var(--mute);font-size:14px;line-height:1.5}
.dlg-b .in{margin-bottom:14px;text-align:center;letter-spacing:.1em;font-weight:700}

.nav a>span:not(.ic):not(.badge){max-width:100%;padding:0 2px}

/* lists and per list launch */
.gear{display:grid;margin-left:4px}
@media (min-width:980px){.gear{display:none}}
.top .live{margin-left:auto}
.lists{display:grid;grid-template-columns:1fr;gap:10px;margin-top:12px}
@media (min-width:720px){.lists{grid-template-columns:1fr 1fr}}
.lists .card+.card{margin-top:0}
.lc{cursor:pointer;padding:14px}
.lc .lh{display:flex;align-items:center;gap:12px}
.lc .lic{width:42px;height:42px;border-radius:13px;background:var(--gs);color:var(--g);display:grid;place-items:center;flex:none}
.lc .lt{flex:1;min-width:0}
.lc .lt b{display:block;font-size:15.5px;font-weight:800}
.lc .lt span{display:block;font-size:12.5px;color:var(--mute);margin-top:1px}
.lc .lf{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line2)}
.lc .lf .btn{min-width:118px}
.launchbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;padding:12px 14px}
.launchbar .lb-t{display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}
.launchbar .lb-t>span:last-child{font-size:13px;color:var(--ink2);font-weight:600}
.launchbar .btn{flex:none;min-width:120px}
.btn-gold.btn-sm,.launchbar .btn-gold{box-shadow:0 4px 12px rgba(120,100,10,.25)}
.seg.big button{height:46px;font-size:14px}
.seg.big button svg{width:17px;height:17px}
.s-grp{--sc:#135333;--sb:#F1F7F3}
.s-grp:before{display:none}

/* designed letter card */
.designed{display:flex;gap:12px;align-items:flex-start;border:1px solid #CFE3D7;background:linear-gradient(160deg,#FBFEFC,#EEF6F1);border-radius:16px;padding:14px}
.designed .dz-ic{width:42px;height:42px;border-radius:13px;background:var(--g);color:#fff;display:grid;place-items:center;flex:none}
.designed .dz-tx{min-width:0;flex:1}
.designed .dz-tx b{display:block;font-size:15px;font-weight:800;color:var(--g)}
.designed .dz-tx>span{display:block;font-size:13px;color:var(--ink2);margin-top:3px;line-height:1.45}
.dz-fields{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.dz-fields span{height:28px;padding:0 10px;border-radius:9px;background:var(--golds);color:#6F6210;font-size:12px;font-weight:700;display:inline-flex;align-items:center}
.mailprev .mb table{max-width:100%!important}
.mailprev .mb{overflow-x:auto}