/* Sales demo shell — the Sales Flow screens running live inside one product shell. */
.sf-app{position:fixed;inset:0;display:flex;flex-direction:column;background:#f6fafd;color:#050301;font-family:'PP Telegraf',sans-serif;overflow:hidden}
.sf-top{height:52px;flex:none;background:#fff;border-bottom:1px solid #e5ebf1;display:flex;align-items:center;gap:12px;padding:0 18px}
.sf-top__logo{font-weight:700;font-size:14px;letter-spacing:.02em}
.sf-top__logo b{color:#3a8518}
.sf-top__brand{font-size:11px;font-weight:600;color:#636c79;border:1px solid #e5ebf1;border-radius:900px;padding:3px 10px}
.sf-crumb{display:flex;align-items:center;gap:9px;font-size:12px;color:#636c79;min-width:0}
.sf-crumb b{font-weight:600;color:#050301;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-crumb button{display:flex;align-items:center;gap:6px;background:none;border:none;font:inherit;font-size:12px;font-weight:600;color:#3a8518;cursor:pointer;padding:0}
.sf-crumb button:hover{color:#2b6418}
.sf-crumb .sl{color:#ced6de}
.sf-top__sp{flex:1}
.sf-top__user{width:30px;height:30px;border-radius:900px;background:#f0f0f0;color:#000;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
.sf-body{flex:1;min-height:0;display:flex}
.sf-nav{width:56px;flex:none;background:#fff;border-right:1px solid #e5ebf1;display:flex;flex-direction:column;align-items:center;padding:12px 0;gap:6px}
.sf-nav__b{position:relative;width:38px;height:38px;border-radius:10px;border:none;background:transparent;color:#636c79;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px}
.sf-nav__b:hover{background:#eef2f6}
.sf-nav__b.on{background:#050301;color:#fff}
.sf-nav__b em{position:absolute;left:44px;top:50%;transform:translateY(-50%);background:#050301;color:#fff;font-style:normal;font-size:11px;font-weight:600;letter-spacing:.01em;padding:4px 9px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;z-index:70}
.sf-nav__b:hover em{opacity:1}
.sf-page{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden;position:relative;background:#f6fafd}
.sf-work{flex:1;min-height:0;display:flex;overflow:hidden}
.sf-skip{position:absolute;right:18px;bottom:16px;z-index:20;background:#fff;border:1px solid #e5ebf1;border-radius:900px;font:inherit;font-size:12px;font-weight:600;color:#636c79;padding:7px 14px;cursor:pointer;display:flex;align-items:center;box-shadow:0 4px 14px rgba(5,3,1,.08)}
.sf-skip:hover{color:#050301;background:#eef2f6}

/* publish confirmation */
.sf-veil{position:fixed;inset:0;z-index:80;background:rgba(5,12,20,.34);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:28px;animation:sfveil .22s ease both}
@keyframes sfveil{from{opacity:0}to{opacity:1}}
.sf-dlg{width:492px;max-width:100%;background:#fff;border-radius:20px;box-shadow:0 30px 74px rgba(4,12,21,.26);overflow:hidden;display:flex;flex-direction:column;animation:sfdlg .38s cubic-bezier(.2,.9,.25,1) both}
@keyframes sfdlg{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.sf-dlg.is-busy{animation:sfdlg-out .5s ease both}
@keyframes sfdlg-out{to{transform:scale(.99);opacity:.92}}
.sf-dlg__hd{padding:26px 28px 22px;background:#fff;border-bottom:1px solid #edf1f5;display:flex;flex-direction:column;gap:7px}
.sf-dlg__k{font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#3a8518}
.sf-dlg__t{font-size:22px;line-height:1.22;font-weight:700;letter-spacing:-.026em;text-wrap:pretty}
.sf-dlg__s{font-size:13px;line-height:1.6;color:#636c79;text-wrap:pretty;max-width:42ch}
.sf-dlg__grid{padding:20px 28px 4px;display:grid;grid-template-columns:1fr;gap:16px}
.sf-fact{display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto;column-gap:11px;align-items:center}
.sf-fact__i{grid-row:1 / span 2;width:28px;height:28px;border-radius:900px;background:#f2f9ec;color:#3a8518;display:flex;align-items:center;justify-content:center;font-size:15px}
.sf-fact b{font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#9aa4af}
.sf-fact>span:last-child{font-size:13px;line-height:1.4;letter-spacing:-.01em;font-weight:500;text-wrap:pretty}
.sf-dlg__ft{padding:22px 28px 24px;display:flex;align-items:center;justify-content:flex-end;gap:10px}
.sf-dlg__ghost{height:40px;padding:0 16px;white-space:nowrap;border:1px solid #e5ebf1;border-radius:900px;background:#fff;font:inherit;font-size:13px;font-weight:600;color:#636c79;cursor:pointer;transition:background .14s,color .14s}
.sf-dlg__ghost:hover:not(:disabled){background:#eef2f6;color:#050301}
.sf-dlg__go{height:40px;padding:0 20px;border:none;border-radius:900px;background:#3a8518;color:#fff;font:inherit;font-size:13px;font-weight:600;display:flex;align-items:center;gap:9px;cursor:pointer;transition:background .14s,transform .14s;box-shadow:0 6px 16px rgba(58,133,24,.26)}
.sf-dlg__go:hover:not(:disabled){background:#2b6418;transform:translateY(-1px)}
.sf-dlg__go i{transition:transform .16s}
.sf-dlg__go:hover:not(:disabled) i{transform:translateX(3px)}
.sf-dlg__go:disabled,.sf-dlg__ghost:disabled{cursor:default}
.sf-dlg__go:disabled{opacity:.9;box-shadow:none}
.sf-spin{display:inline-block;width:13px;height:13px;border-radius:900px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;animation:sfspin .7s linear infinite}
@keyframes sfspin{to{transform:rotate(360deg)}}

/* published — the confirmation moment */
.sf-land{position:fixed;inset:0;z-index:95;display:flex;align-items:center;justify-content:center;padding:32px;background:radial-gradient(120% 90% at 50% 0%,#eef7e8 0%,#f6fafd 58%,#f1f6fa 100%);animation:sfland-in .45s cubic-bezier(.2,.8,.3,1) both;overflow:hidden}
@keyframes sfland-in{from{opacity:0}to{opacity:1}}
.sf-land__motes{position:absolute;inset:0;pointer-events:none}
.sf-land__motes span{position:absolute;bottom:-16px;left:calc(8% + var(--i) * 10.2%);width:7px;height:7px;border-radius:2px;background:#a5cf8e;opacity:0;animation:sfmote 4.6s cubic-bezier(.35,.1,.4,1) infinite;animation-delay:calc(var(--i) * .42s)}
.sf-land__motes span:nth-child(3n){background:#cfe4f2;border-radius:900px;width:5px;height:5px}
.sf-land__motes span:nth-child(4n){background:#f2dfa8;width:6px;height:6px}
@keyframes sfmote{0%{opacity:0;transform:translateY(0) rotate(0)}12%{opacity:.85}100%{opacity:0;transform:translateY(-78vh) rotate(220deg)}}
.sf-land__card{position:relative;width:520px;max-width:100%;background:#fff;border:1px solid #e5ebf1;border-radius:22px;padding:34px 34px 28px;box-shadow:0 34px 80px rgba(4,12,21,.14);display:flex;flex-direction:column;gap:10px;animation:sfland-card .55s cubic-bezier(.2,.9,.25,1) both}
@keyframes sfland-card{from{opacity:0;transform:translateY(16px) scale(.975)}to{opacity:1;transform:none}}
.sf-land__seal{width:52px;height:52px;border-radius:900px;background:#eef7e8;display:flex;align-items:center;justify-content:center;margin-bottom:4px;animation:sfseal .5s cubic-bezier(.2,1.5,.4,1) .1s both}
@keyframes sfseal{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}
.sf-land__seal svg{width:30px;height:30px;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sf-land__ring{stroke:#c5e2b1;stroke-width:2}
.sf-land__tick{stroke:#3a8518;stroke-width:3.2;stroke-dasharray:30;stroke-dashoffset:30;animation:sftick .5s cubic-bezier(.5,0,.3,1) .34s forwards}
@keyframes sftick{to{stroke-dashoffset:0}}
.sf-land__kicker{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:#3a8518;animation:sfrise .5s ease .3s both}
.sf-land__h{margin:0;font-size:26px;line-height:1.2;font-weight:700;letter-spacing:-.026em;text-wrap:pretty;animation:sfrise .5s ease .38s both}
.sf-land__sub{font-size:13.5px;line-height:1.6;color:#636c79;text-wrap:pretty;max-width:44ch;animation:sfrise .5s ease .46s both}
@keyframes sfrise{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.sf-land__steps{position:relative;margin-top:16px;display:flex;flex-direction:column;gap:14px}
.sf-land__thread{position:absolute;left:15px;top:14px;bottom:14px;width:2px;background:linear-gradient(#c5e2b1,#dfe7ee);transform-origin:top;animation:sfthread .7s cubic-bezier(.4,0,.2,1) .55s both}
@keyframes sfthread{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.sf-land__step{display:flex;align-items:center;gap:13px;font-size:13px;animation:sfrise .45s ease var(--d) both}
.sf-land__dot{position:relative;z-index:1;flex:none;width:32px;height:32px;border-radius:900px;background:#fff;border:1.5px solid #e5ebf1;display:flex;align-items:center;justify-content:center;color:#3a8518;font-size:16px}
.sf-land__step:first-of-type .sf-land__dot{background:#3a8518;border-color:#3a8518;color:#fff}
.sf-land__step b{flex:none;font-weight:600;letter-spacing:-.01em}
.sf-land__step>span:last-child{flex:1;min-width:0;color:#636c79;font-size:12.5px}
.sf-land__step>span:last-child::before{content:"·";margin-right:7px;color:#ced6de}
.sf-land__go{align-self:flex-end;margin-top:22px;height:40px;padding:0 18px;border:none;border-radius:900px;background:#3a8518;color:#fff;font:inherit;font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px;cursor:pointer;animation:sfrise .5s ease 1.05s both;transition:transform .15s,background .15s}
.sf-land__go:hover{background:#2d6812;transform:translateY(-1px)}

.sf-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:90;background:#050301;color:#fff;border-radius:900px;padding:11px 20px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:10px;box-shadow:0 14px 34px rgba(5,3,1,.28);animation:sfup .3s ease both}
.sf-toast i{color:#a5cf8e;font-size:16px}
@keyframes sfup{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
.sf-crumb__edit{font:inherit;font-size:12px;font-weight:600;color:#050301;background:none;border:1px solid transparent;border-radius:6px;padding:3px 6px;margin:-3px -6px;max-width:340px;min-width:0}
.sf-crumb__edit:hover{border-color:#e5ebf1;background:#f6fafd}
.sf-crumb__edit:focus{outline:none;border-color:#3a8518;background:#fff}
.sf-crumb__status{font-size:15px;color:#3a8518}


/* ---- the publish gate carries four facts, each with a derivation ----
   Adding the sub-line makes the value span no longer :last-child, which would
   silently drop the rule above it, so the value is re-selected by type here.
   The icon spans every row so it stays centred against the taller fact. */
.sf-fact{grid-template-rows:auto auto auto}
.sf-fact__i{grid-row:1 / -1}
.sf-fact>span:nth-of-type(2){font-size:13px;line-height:1.4;letter-spacing:-.01em;font-weight:500;text-wrap:pretty}
.sf-fact__s{grid-column:2;font-style:normal;font-size:11px;color:#9aa4af;line-height:1.35;margin-top:3px;text-wrap:pretty}


/* ---- who is speaking: one soft chip, not three coloured rings ----
   The persona colours still identify the specialist, but at a tint rather
   than a saturated ring, so a log of twenty steps reads as one surface. */
.at-who{width:19px;height:19px;border-radius:900px;background:#f1f4f7;color:#8f9aa7;display:flex;align-items:center;justify-content:center;font-size:11.5px;flex:none}
.l2-stephd.live .at-who{background:#eef2f6;color:#636c79}

/* ---- the context gate ---- */
.at-gate{border:1px solid #e5ebf1;border-radius:11px;padding:12px 13px;background:#fff;display:flex;flex-direction:column;gap:7px;margin:2px 0 4px}
.at-gate__t{font-size:12.5px;line-height:1.45;text-wrap:pretty}
.at-gate__d{font-size:11.5px;color:#9aa4af;line-height:1.4;text-wrap:pretty}
.at-gate__go{align-self:flex-start;font:inherit;font-size:12px;font-weight:600;padding:6px 12px;border-radius:900px;border:none;background:#3a8518;color:#fff;cursor:pointer;display:flex;align-items:center;gap:5px}
.at-gate__go i{font-size:13px}
.at-gate.is-done{background:#fbfcfd;border-color:#eef2f6}
.at-gate__ok{display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:#3d6b24}

/* ---- the follow-up card: Origami's suggested-actions shape ----
   Bordered, headed, one icon-led row per question. Deliberately NOT
   collapsible: these three are always asked, so a chevron would let a study
   field without them. */
.at-card{background:#fff}
.at-card__h{display:flex;align-items:center;gap:7px;padding:9px 12px;border-bottom:1px solid #eef2f6;background:#fbfcfd}
.at-card__h i{font-size:14px;color:#3a8518}
.at-card__h b{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#636c79;flex:1}
.at-row:first-of-type{border-top:none}
.at-row.is-done .at-row__i{background:#f1f4f7;color:#a8b2bd}
.at-row__l{font-size:12.5px;font-weight:600;line-height:1.35;color:#050301;text-wrap:pretty}
.at-row__h{font-size:11px;color:#9aa4af;line-height:1.35;margin-top:-2px;text-wrap:pretty}

/* ---- tappable answers ---- */
/* dashed = inferred: the pattern is solid, the instance is a guess */


/* ---- the dock: what you have to answer, pinned above the composer ----
   Origami puts the actionable card here rather than inline in the log. Inline
   it scrolls away from the composer, which is exactly where the hands already
   are, and it competes for attention with the reasoning above it. */
.at-dock{flex:none;border-top:1px solid #e5ebf1;background:#fbfcfd;padding:10px 12px 0}
.at-dock .at-card{border:1px solid #dfe5ec;border-radius:11px;background:#fff;box-shadow:0 1px 2px rgba(5,3,1,.05);overflow:hidden}

/* answered items collapse into the log as a one-line record */
.at-rec{display:flex;align-items:baseline;gap:6px;font-size:11.5px;font-weight:600;color:#3d6b24;background:#eef6e8;border-radius:8px;padding:6px 9px;margin:2px 0}
.at-rec i{font-size:12px;position:relative;top:1px;flex:none}
.at-rec--card{font-weight:500}
.at-rec--card span{color:#3d6b24;line-height:1.4;text-wrap:pretty}

/* rows read as a list, one per line, not a wrapped field of pills */
.at-row:first-of-type{border-top:none}
.at-row.is-done .at-row__i{background:#f1f4f7;color:#b3bcc6}

/* the free-text escape, on every question */
.at-opt--free i{font-size:12px}
.at-free input{flex:1;min-width:0;font:inherit;font-size:12px;padding:6px 9px;border:1px solid #3a8518;border-radius:8px;outline:none;color:#050301}
.at-free button:disabled{background:#ced6de;cursor:default}


/* ---- one question at a time ---- */
.at-q__l{font-size:13px;font-weight:600;line-height:1.35;color:#050301;text-wrap:pretty}
.at-q__h{display:flex;align-items:flex-start;gap:7px;font-size:11.5px;font-weight:500;color:#3d6b24;line-height:1.4;margin-top:6px;padding:7px 9px;background:#f2f9ee;border:1px solid #daebd1;border-radius:8px;text-wrap:pretty}

/* Options as a list: one per line, scannable straight down. Pills reflowed by
   label length, so the eye had to hunt for the option it wanted. */
.at-list{display:flex;flex-direction:column;gap:4px}
.at-li{display:flex;align-items:center;gap:9px;width:100%;text-align:left;font:inherit;font-size:12.5px;color:#373534;background:#fff;border:1px solid #e5ebf1;border-radius:9px;padding:8px 10px;cursor:pointer;transition:border-color .12s,background .12s}
.at-li:hover{border-color:#a5cf8e;background:#fbfdf9}
.at-li__t{flex:1;min-width:0;line-height:1.35}
.at-li.on{border-color:#3a8518;background:#f2f9ee;color:#050301;font-weight:600}
.at-li__tag{flex:none;font-size:9.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#3d6b24;background:#daebd1;border-radius:900px;padding:2px 6px}
.at-li.on .at-li__tag{color:#3d6b24;background:#daebd1}
.at-li--free{color:#8f9aa7}
.at-free input{flex:1;min-width:0;font:inherit;font-size:12.5px;padding:8px 10px;border:1px solid #3a8518;border-radius:9px;outline:none;color:#050301}
.at-free button:disabled{background:#ced6de;cursor:default}


/* ============================================================
   The follow-up card is the only thing being asked of the user, so it is
   lifted above the transcript rather than sitting level with it: a light
   travelling the border draws the eye, and the log behind it steps back.
   ============================================================ */

/* the transcript recedes while an answer is outstanding */
.i3-log.is-muted{opacity:.42;filter:saturate(.55);transition:opacity .35s ease,filter .35s ease}
.i3-log{transition:opacity .35s ease,filter .35s ease}

@property --at-a { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.at-dock{flex:none;border-top:1px solid #e5ebf1;background:#fbfcfd;padding:11px 12px 0}
.at-card.is-live{position:relative;background:#fff;border:none;border-radius:12px;box-shadow:0 3px 14px rgba(5,3,1,.07)}
/* the light: a conic sweep behind the card, masked to a 1.5px rim */
.at-card.is-live::before{
  content:"";position:absolute;inset:-1.5px;border-radius:13.5px;z-index:0;
  background:conic-gradient(from var(--at-a),rgba(58,133,24,0) 0 58%,rgba(165,207,142,.85) 76%,#3a8518 88%,rgba(58,133,24,0) 100%);
  animation:at-orbit 2.9s linear infinite;
}
.at-card.is-live::after{content:"";position:absolute;inset:0;border-radius:12px;background:#fff;z-index:0}
.at-card.is-live>*{position:relative;z-index:1}
@keyframes at-orbit{to{--at-a:360deg}}
@media (prefers-reduced-motion:reduce){
  .at-card.is-live::before{animation:none;background:#3a8518}
  .i3-log{transition:none}
}

.at-card__h{display:flex;align-items:center;gap:7px;padding:9px 12px;border-bottom:1px solid #eef2f6;background:transparent;border-radius:12px 12px 0 0}

/* one question */
.at-q{padding:11px 12px 10px}
.at-q__l{font-size:13px;font-weight:600;line-height:1.4;color:#050301;text-wrap:pretty}
.at-q__h{display:flex;align-items:flex-start;gap:7px;font-size:11.5px;font-weight:500;color:#3d6b24;line-height:1.4;margin-top:6px;padding:7px 9px;background:#f2f9ee;border:1px solid #daebd1;border-radius:8px;text-wrap:pretty}
.at-q__mark{flex:none;width:14.4px;height:14.4px;margin-top:1px;display:flex;align-items:center;justify-content:center}
.at-q__mark img{width:100%;height:100%;object-fit:contain}
.at-list{display:flex;flex-direction:column;gap:3px;margin-top:9px}

/* numbered rows, one per line */
.at-li{display:flex;align-items:center;gap:9px;width:100%;text-align:left;font:inherit;font-size:12.5px;color:#373534;background:#fff;border:1px solid transparent;border-radius:9px;padding:8px 9px;cursor:pointer;transition:background .12s,border-color .12s}
.at-li:hover{background:#f4f7fa}
.at-li__n{flex:none;width:19px;height:19px;border-radius:900px;background:#f1f4f7;color:#8f9aa7;font-size:10.5px;font-weight:600;display:flex;align-items:center;justify-content:center}
.at-li__t{flex:1;min-width:0;line-height:1.4}
.at-li__tag{flex:none;font-size:9.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#3d6b24;background:#daebd1;border-radius:900px;padding:2px 6px}
.at-li.on{background:#f2f9ee;border-color:#a5cf8e;font-weight:600;color:#050301}
.at-li.on .at-li__n{background:#3a8518;color:#fff}
.at-li.on .at-li__tag{color:#3d6b24;background:#daebd1}

/* the recommended answer leads, so the easy path is the obvious one */
.at-li--primary{background:#f2f9ee;border-color:#c8e2ba;font-weight:600;color:#050301}
.at-li--primary .at-li__n{background:#3a8518;color:#fff}
.at-li--primary:hover{background:#e6f2de;border-color:#82bc62}
.at-li--primary.on{border-color:#3a8518}

/* the custom answer, field already open */
.at-li--free{cursor:text}
.at-li--free:hover{background:#f4f7fa}
.at-li--free input{flex:1;min-width:0;font:inherit;font-size:12.5px;color:#050301;background:none;border:none;outline:none;padding:0}
.at-li--free input::placeholder{color:#b3bcc6}
.at-li__go{flex:none;width:22px;height:22px;border-radius:900px;border:none;background:#3a8518;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px}

/* One tab per question, wrapping rather than scrolling: the whole set has to
   be visible at a glance, because the count is how the user knows what they
   are in for. Answered tabs carry a check, so the strip doubles as progress
   and the card header does not have to say it twice. */
.at-tabs{display:flex;flex-wrap:nowrap;gap:6px;padding:9px 11px 0}
.at-tab{flex:none;display:flex;align-items:center;justify-content:center;font:inherit;color:#8f9aa7;background:#f6f8fa;border:1px solid transparent;border-radius:900px;width:26px;height:26px;padding:0;cursor:pointer;transition:background .12s,color .12s,border-color .12s}
.at-tab:hover{background:#eef2f6;color:#636c79}
.at-tab__n{flex:none;width:15px;height:15px;border-radius:900px;background:#e5ebf1;color:#8f9aa7;font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center}
.at-tab i{flex:none;width:15px;height:15px;border-radius:900px;background:#daebd1;color:#3d6b24;font-size:10px;display:flex;align-items:center;justify-content:center}
.at-tab.is-done{color:#3d6b24;background:#f2f9ee}
.at-tab.on{background:#050301;border-color:#050301;color:#fff}
.at-tab.on .at-tab__n{background:rgba(255,255,255,.18);color:#fff}
.at-tab.on i{background:rgba(255,255,255,.18);color:#fff}

/* one submit for the whole set */
.at-nav{display:flex;align-items:center;padding:9px 11px 11px;background:transparent;border-radius:0 0 12px 12px}
.at-sub{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;font:inherit;font-size:12.5px;font-weight:700;color:#fff;background:#3a8518;border:none;border-radius:9px;padding:9px 12px;cursor:pointer;transition:background .12s}
.at-sub:hover:not(:disabled){background:#317114}
.at-sub i{font-size:14px}
.at-sub:disabled{background:#f1f4f7;color:#a8b2bd;cursor:default;font-weight:600}