/* Small, honest product experiences. Keep the approved white/purple/mint direction. */
.experience-sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.campaign-demo-controls{display:flex;align-items:center;gap:14px;margin-bottom:14px;font-size:10px;color:#776884}
.campaign-demo-controls .sample-segments button{display:flex;align-items:center;gap:5px;min-height:30px}
.campaign-demo-controls .icon{width:13px;height:13px}
.campaign-demo-controls>.sample-link{margin-left:auto}
.sample-link:disabled{color:#8a8093;cursor:default;opacity:.7}
.campaign-demo-card{border-radius:9px;background:white;border:1px solid #e9e2f0;margin-bottom:10px;overflow:hidden}
.campaign-demo-card .deal-card{margin:0;border:0;border-radius:0;box-shadow:none;width:100%}
.campaign-demo-card.featured-campaign{border-color:#b49eec;box-shadow:0 3px 14px #6948a00b}
.campaign-demo-card:focus-within{outline:2px solid var(--purple);outline-offset:2px}
.campaign-move{display:flex;align-items:center;justify-content:center;gap:5px;border:0;border-top:1px solid #e4d9f6;background:#f2ecff;color:#5b37a5;font-size:10px;font-weight:600;min-height:32px;padding:7px;width:100%;cursor:pointer}
.campaign-move:hover{background:#e8ddff}
.campaign-move .icon,.campaign-moved .icon{width:12px;height:12px;flex-shrink:0}
.campaign-moved{display:flex;align-items:center;gap:5px;font-size:9px;color:#286e52;background:#edfaf3;padding:9px;line-height:1.6}
.campaign-demo-feedback{min-height:36px;padding:11px 2px 0;font-size:11px;color:#715d83;line-height:1.6}
.campaign-demo-list{background:#fff;border:1px solid #e5deef;border-radius:8px;overflow:hidden}
.campaign-demo-list table{border-collapse:collapse;width:100%;text-align:left;font-size:12px}
.campaign-demo-list th{font-size:10px;font-weight:600;color:#66507c;background:#f1ecfb;padding:11px 14px}
.campaign-demo-list td{padding:11px 14px;border-bottom:1px solid #eee8f4;vertical-align:middle;color:#5a4670}
.campaign-demo-list tr:last-child td{border:0}
.campaign-demo-list td:last-child,.campaign-demo-list th:last-child{text-align:right}
.campaign-demo-list td>small{display:block;font-size:10px;color:#7a6b89;margin:3px 0}
.campaign-record-link{border:0;background:none;color:#4e306a;font-weight:600;padding:0;cursor:pointer;text-align:left}
.campaign-record-link:hover{text-decoration:underline}
.campaign-demo-list .campaign-move{border:1px solid #e4d9f6;border-radius:5px;width:auto;min-height:27px;margin-top:6px}
.campaign-demo-list .campaign-moved{background:none;padding:3px 0}
.stage-label{padding:5px 8px;font-size:10px;border-radius:5px;background:#f2edf9;white-space:nowrap}
.stage-label.stage-1{background:#eae1ff;color:#5a36a2}.stage-label.stage-2{background:#def4e8;color:#24714f}

.automation-story{background:linear-gradient(135deg,#f9f6ff 0%,#fff 53%,#edfbf4 100%);border-block:1px solid #f1edf7;margin:25px 0 0;padding:80px 0}
.automation-layout{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:75px}
.automation-copy h2{font-size:42px;letter-spacing:-1.8px;line-height:1.15;margin-top:19px}
.automation-copy>p{font-size:15px;color:#6b5b78;line-height:1.8}
.recipe-picker{display:grid;gap:9px;margin-top:27px}
.recipe-picker>button{display:flex;gap:12px;align-items:center;text-align:left;width:100%;border:1px solid transparent;border-radius:10px;padding:12px;background:transparent;color:#6a527d;cursor:pointer;font-size:13px;font-weight:500;transition:background .2s,border-color .2s,transform .2s}
.recipe-picker>button:hover{background:#f1ebfa;transform:translateX(3px)}
.recipe-picker>button[aria-pressed=true]{background:#fff;border-color:#d7c8f0;color:#56319d;box-shadow:0 5px 18px #603a8708}
.recipe-icon{width:35px;height:35px;display:grid;place-items:center;border-radius:9px;background:#eee6fc;flex-shrink:0}
.recipe-picker>button[aria-pressed=true] .recipe-icon{background:var(--purple);color:white}
.recipe-picker>button>.icon{margin-left:auto;width:16px;height:16px}
.automation-human{display:flex;gap:11px;align-items:center;margin-top:25px;max-width:380px}
.automation-portrait{height:59px;width:59px;border-radius:50%;background:#e5f6ec;overflow:hidden;flex-shrink:0;position:relative}
.automation-portrait img{position:absolute;width:115px;height:115px;max-width:none;top:-6px;left:-28px}
.automation-human b{display:block;font-size:12px;color:#5b436c;font-weight:600}
.automation-human small{display:block;font-size:11px;line-height:1.7;color:#7c6889;margin-top:5px}
.automation-lab{border:1px solid #ddcfee;background:#ffffffed;border-radius:17px;box-shadow:0 20px 65px #52327c0d;position:relative;padding:22px;min-width:0}
.lab-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:18px;border-bottom:1px solid #eee7f5;color:#573e6b;font-size:12px;font-weight:600}
.lab-heading>span:first-child{display:flex;align-items:center;gap:7px}
.lab-heading .icon{color:#7951c1;width:16px;height:16px}
.lab-badge{font-size:9px;font-weight:500;padding:5px 7px;background:#f0eafa;color:#78608f;border-radius:5px;white-space:nowrap}
.lab-scenario{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;color:#78668a;padding:17px 0 5px}
.rule-flow{padding:0;list-style:none;display:grid;gap:16px;margin:18px 0 17px}
.rule-flow>li{position:relative;display:flex;align-items:center;gap:13px;background:#faf8fd;border:1px solid #e9e1f2;border-radius:10px;min-height:82px;padding:14px;transition:background .25s,border-color .25s,box-shadow .25s}
.rule-flow>li:not(:last-child)::after{content:"";position:absolute;left:33px;top:100%;height:18px;border-left:2px dashed #d2c2e7}
.flow-node{height:36px;width:36px;border-radius:9px;background:#eee6fb;color:#7952ac;display:grid;place-items:center;flex-shrink:0}
.flow-node .icon{width:18px;height:18px}
.rule-flow>li>div{flex:1;min-width:0}
.rule-flow small{display:block;font-size:8px;letter-spacing:1.4px;font-weight:650;color:#806596;margin-bottom:5px}
.rule-flow b{display:block;font-size:13px;font-weight:600;color:#543969}
.rule-flow p{font-size:11px;line-height:1.65;color:#7a6689;margin:5px 0 0}
.flow-check{display:grid;place-items:center;opacity:0;width:20px;height:20px;color:#25865c;flex-shrink:0}
.flow-check .icon{width:15px;height:15px}
.rule-flow .running{border-color:#a98be4;background:#f1eafe;box-shadow:0 0 0 3px #8c5ad515}
.rule-flow .running .flow-node{background:#7b54c4;color:#fff;animation:rule-pulse .6s ease infinite alternate}
.rule-flow .complete{border-color:#bce5cf;background:#f4fbf7}
.rule-flow .complete .flow-node{background:#dbf2e5;color:#267950}
.rule-flow .complete .flow-check{opacity:1}
.rule-flow .skipped{border-style:dashed;background:#f9f8fb}
.rule-flow .skipped .flow-node{background:#eeeaf3;color:#9988a7}
.recipe-note{font-size:11px;color:#766581;line-height:1.7;min-height:36px;margin:0 0 17px}
.lab-actions{display:flex;align-items:center;gap:18px}
.lab-actions>.button{font-size:12px;min-height:40px;padding:10px 15px}
.lab-actions>.button:disabled{opacity:.75;cursor:wait}
.automation-result{display:flex;align-items:center;gap:12px;background:#f7f4fc;border:1px dashed #e2d7ef;border-radius:10px;padding:14px;margin-top:17px;min-height:86px;color:#766286}
.result-icon{height:31px;width:31px;flex-shrink:0;display:grid;place-items:center;background:white;border-radius:8px;color:#8d70b3}
.result-icon .icon{width:17px;height:17px}
.automation-result b{display:block;font-size:12px;line-height:1.6;color:#6d527f}
.automation-result small{display:block;font-size:10px;line-height:1.6;margin-top:4px}
.automation-result span>small:first-child{letter-spacing:1.3px;font-size:8px;margin:0 0 4px}
.result-success{background:#eefbf3;border-style:solid;border-color:#bfe8cf;animation:result-appear .4s ease both}
.result-success b,.result-success .result-icon{color:#26794d}
.result-success small{color:#5a816b}
.result-skipped{animation:result-appear .4s ease both}
.lab-disclaimer{display:flex;align-items:center;justify-content:center;gap:5px;font-size:9px;color:#7d6a8a;line-height:1.6;margin:15px 0 0;text-align:center}
.lab-disclaimer .icon{width:12px;height:12px;flex-shrink:0}
@keyframes rule-pulse{to{transform:scale(1.07)}}
@keyframes result-appear{from{transform:translateY(5px);opacity:.2}to{transform:translateY(0);opacity:1}}

.connection-prompt{text-align:center;font-size:12px;color:#8c749b;margin:28px 0 0}
.connection-orbit.interactive-orbit{margin-top:23px}
.interactive-orbit .tool-chip{font-family:inherit;text-align:left;cursor:pointer;position:relative;transition:border-color .2s,background .2s,transform .2s;color:#665073}
.interactive-orbit .tool-chip:hover{transform:translateY(-2px);border-color:#c5ace9}
.interactive-orbit .tool-chip[aria-pressed=true]{background:#f1ebff;border-color:#b395e8;color:#613d9b;box-shadow:0 5px 20px #7652a40c}
.tool-chip .connection-chip-arrow{width:13px;height:13px;margin-left:auto;opacity:.35;flex-shrink:0}
.tool-chip[aria-pressed=true] .connection-chip-arrow{opacity:1}
.interactive-orbit .connection-line::after{animation:none;opacity:0}
.interactive-orbit.connection-selected .connection-line::after{animation:context-travel 1s ease both}
.interactive-orbit[data-side=right] .connection-line::after{animation-name:context-travel-reverse}
.interactive-orbit .connection-center{transition:box-shadow .3s}
.interactive-orbit.connection-selected .connection-center{box-shadow:0 0 0 10px #eae0fb55,0 12px 35px #75539412}
.connection-detail-card{display:grid;grid-template-columns:1.2fr 1fr;gap:26px;max-width:940px;margin:30px auto 0;background:linear-gradient(115deg,#fbf9ff,#f5fcf8);border:1px solid #e3d9ef;border-radius:15px;padding:26px;min-height:224px}
.connection-story{display:flex;align-items:flex-start;gap:15px}
.connection-story-icon{height:39px;width:39px;display:grid;place-items:center;flex-shrink:0;background:#eee5fc;border-radius:11px;color:#7951ae}
.connection-story-icon .icon{width:20px;height:20px}
.connection-detail-label{display:block;font-size:10px;letter-spacing:.7px;color:#7c6291;margin-bottom:9px}
.connection-story h3{font-size:19px;line-height:1.3;letter-spacing:-.5px;color:#4f3462;margin:0 0 10px}
.connection-detail-card p{font-size:12px;line-height:1.8;color:#796485;margin:0}
.connection-requirements{border-left:1px solid #e2dbed;padding-left:26px}
.connection-requirements>span{display:flex;align-items:center;gap:6px;font-size:9px;color:#46765e;font-weight:600;letter-spacing:1px;margin-bottom:11px}
.connection-requirements>span .icon{width:13px;height:13px}
.connection-requirements>div{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px}
.connection-requirements .sample-link{font-size:11px;text-align:left;line-height:1.5}
.connection-requirements .sample-link .icon{height:13px;width:13px}
@keyframes context-travel{0%{left:0;opacity:0}20%{opacity:1}100%{left:50%;opacity:0}}
@keyframes context-travel-reverse{0%{left:calc(100% - 46px);opacity:0}20%{opacity:1}100%{left:50%;opacity:0}}
@media(max-width:1150px){.automation-layout{gap:35px;grid-template-columns:.8fr 1.2fr}.automation-copy h2{font-size:36px}.recipe-picker>button{font-size:12px;padding:10px}.automation-lab{padding:18px}.lab-heading{font-size:11px}}
@media(max-width:760px){
 .campaign-demo-controls{gap:8px;flex-wrap:wrap}.campaign-demo-controls>span{display:none}.campaign-demo-feedback{font-size:10px}
 .playable-board{grid-template-columns:repeat(2,minmax(0,1fr))}.playable-board .pipeline-column:nth-child(3){display:block;grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:7px}.playable-board .pipeline-column:nth-child(3)>.column-label{grid-column:1/-1}.playable-board .pipeline-column:nth-child(3) .campaign-demo-card{margin:0}
 .playable-board .column-label{flex-wrap:wrap;row-gap:4px}.playable-board .column-label>small{font-size:9px}.playable-board .column-label>span{font-size:10px}.campaign-move{font-size:10px;min-height:36px}.campaign-moved{font-size:9px;flex-wrap:wrap;padding:6px}
 .campaign-demo-list td,.campaign-demo-list th{padding:10px 8px}.campaign-demo-list{font-size:10px}.campaign-demo-list table{font-size:11px}.campaign-demo-list .stage-label{font-size:9px;padding:4px}
 .automation-story{padding:50px 0}.automation-layout{grid-template-columns:1fr;gap:25px}.automation-copy h2{font-size:33px}.automation-copy>p{font-size:14px}
 .recipe-picker{gap:7px;margin-top:21px}.recipe-picker>button{font-size:13px;padding:10px}.automation-human{margin-top:18px}.automation-portrait{height:49px;width:49px}.automation-portrait img{left:-33px}
 .automation-lab{padding:17px}.lab-heading{font-size:11px;gap:8px}.lab-badge{font-size:8px}.rule-flow>li{padding:12px;gap:10px}.rule-flow>li:not(:last-child)::after{left:30px}.rule-flow b{font-size:12px}.rule-flow p{font-size:11px}.flow-check{width:15px}.lab-scenario{font-size:10px}.lab-scenario .sample-segments button{font-size:10px;padding:7px 9px}
 .recipe-note{min-height:0;font-size:11px}.automation-result{min-height:91px}.lab-disclaimer{font-size:9px}
 .connection-detail-card{grid-template-columns:1fr;gap:19px;padding:21px;min-height:0}.connection-requirements{border-left:0;padding-left:0;border-top:1px solid #e2dbed;padding-top:18px}.connection-story{gap:11px}.connection-story h3{font-size:18px}.connection-detail-card p{font-size:12px}
}
@media(max-width:470px){
 .playable-board .deal-card-top b{font-size:9px}.playable-board .deal-card-top small{font-size:8px}.playable-board .deal-value{font-size:17px}.playable-board .deal-footer{font-size:8px}.playable-board .mini-tag{font-size:8px}.playable-board .deal-card-top{flex-wrap:wrap;gap:7px}.playable-board .company-mark{height:23px;width:23px}.playable-board .column-label{min-height:40px}
 .interactive-orbit .tool-chip{text-align:center;font-size:10px;min-height:96px;line-height:1.5;padding:10px 7px}.tool-chip .connection-chip-arrow{display:none}
 .interactive-orbit.connection-selected .connection-line::after{animation:context-down 1s ease both;width:3px;height:25px}
 .interactive-orbit[data-side=right] .connection-line::after{animation-name:context-up}
 .connection-detail-card{padding:18px}.connection-story{display:block}.connection-story-icon{margin-bottom:13px}
 @keyframes context-down{0%{top:0;opacity:0}20%{opacity:1}100%{top:50%;opacity:0}}
 @keyframes context-up{0%{top:100%;opacity:0}20%{opacity:1}100%{top:50%;opacity:0}}
}