/* Approved Collar landing: card A and illustrative activity. */
#collar-flow .cf-brand-dot{color:var(--cf-lime)}
#collar-flow .cf-wordmark{display:inline-block;white-space:nowrap}
#collar-flow .cf-header-emblem{position:relative;display:block;width:58px;height:34px;flex-shrink:0;isolation:isolate}
#collar-flow .cf-header-emblem img,#collar-flow .cf-header-emblem video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
#collar-flow .cf-header-emblem video{opacity:0;mask:url('assets/collar-infinity-chrome.png') center/contain no-repeat;-webkit-mask:url('assets/collar-infinity-chrome.png') center/contain no-repeat}
#collar-flow .cf-header-emblem.is-playing video{opacity:1}
#collar-flow .cf-header-emblem img{opacity:1}
#collar-flow .cf-header-emblem video{transition:opacity .2s ease}
#collar-flow .cf-hero-art{height:640px;isolation:isolate;background:radial-gradient(ellipse at 50% 55%,#d4ff700b 0,transparent 63%)}
#collar-flow .cf-device{top:34px;transform:translateX(-50%) rotateZ(-2deg)}
#collar-flow .cf-device-screen{overflow:hidden}
#collar-flow .cf-notice-layer{position:absolute;inset:0;pointer-events:none;z-index:5}
#collar-flow .cf-live-notice{position:absolute;display:flex;align-items:center;gap:11px;min-height:70px;width:254px;padding:13px 15px;background:#252f28f5;color:#f5f7ee;border:1px solid #d4ff7038;border-radius:19px;box-shadow:0 18px 48px #0005;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);text-align:left;pointer-events:auto;cursor:pointer;animation:cf-notice-in .65s cubic-bezier(.16,1,.3,1) both;transition:opacity .4s,filter .4s,box-shadow .3s}
#collar-flow .cf-live-notice strong{display:block;font-size:14px;font-weight:500;letter-spacing:-.25px;line-height:1.35}
#collar-flow .cf-live-notice small{display:block;margin-top:4px;font-size:11px;line-height:1.4;color:#b9c4b7}
#collar-flow .cf-notice-icon{display:grid;place-items:center;width:35px;height:35px;flex-shrink:0;border-radius:50%;background:#d4ff70;color:#243317;font-size:22px}
#collar-flow .cf-live-notice[data-kind=out] .cf-notice-icon{background:#dce4d4}
#collar-flow .cf-live-notice[data-kind=swap] .cf-notice-icon{background:#c4cae0}
#collar-flow .cf-live-notice[data-slot=top-left]{top:22px;left:-15px}
#collar-flow .cf-live-notice[data-slot=right]{top:316px;right:-34px}
#collar-flow .cf-live-notice[data-slot=bottom-left]{top:432px;left:-23px}
#collar-flow .cf-live-notice.is-previous{opacity:.62;filter:saturate(.55)}
#collar-flow .cf-live-notice.is-selected{opacity:1;filter:none;border-color:#d4ff70;box-shadow:0 0 0 3px #d4ff7020,0 18px 48px #0005}
#collar-flow .cf-live-notice:focus-visible,#collar-flow .cf-demo-progress button:focus-visible{outline:2px solid #d4ff70;outline-offset:5px}
#collar-flow .cf-demo-progress{position:absolute;left:0;right:0;bottom:2px;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;font-size:11px;color:#a9b6a4}
#collar-flow .cf-step-dots{display:flex;gap:5px}
#collar-flow .cf-step-dots i{width:4px;height:4px;border-radius:50%;background:#4a5744;transition:background .3s}
#collar-flow .cf-step-dots i.is-done{background:#d4ff70}
#collar-flow .cf-demo-progress button{border:0;border-bottom:1px solid #546344;background:transparent;color:#d4ff70;font-size:12px;min-height:44px;padding:8px 0;cursor:pointer}
#collar-flow .cf-ledger-empty{font-size:13px;line-height:1.65;color:#86917f;margin:20px 0;text-align:center}
#collar-flow .cf-transaction{transition:background .25s,box-shadow .25s;border-radius:10px;padding-left:5px;padding-right:5px}
#collar-flow .cf-transaction.is-highlighted{background:#e6f3d4;box-shadow:inset 3px 0 #93ba4d}
#collar-flow .cf-transaction.is-entering{animation:cf-ledger-in .5s ease both}
#collar-flow .cf-trans-copy{min-width:0}
#collar-flow .cf-trans-copy small{font-size:10px}
#collar-flow .cf-trans-amount{font-size:11px;white-space:nowrap}
#collar-flow .cf-transaction .cf-trans-icon{font-size:17px;width:29px;height:29px;flex-shrink:0}
#collar-flow #cf-hero-balance.is-changing{animation:cf-balance-change .6s ease both}
#collar-flow .cf-other-asset{font-size:10px;color:#53694a;background:#e8eedd;border-radius:7px;padding:5px 8px;margin-top:5px}
#collar-flow .cf-other-asset[hidden]{display:none}
#collar-flow .cf-card-lockup{display:flex;align-items:center;gap:8px}
#collar-flow .cf-card-logo{display:block;width:46px;height:27px;object-fit:contain}
#collar-flow .cf-card-top{align-items:center}
#collar-flow .cf-card-wordmark{font-size:28px;letter-spacing:-1.5px}
#collar-flow .cf-bank-card .cf-card-face{overflow:hidden;background:radial-gradient(ellipse at 25% -15%,#f0ffb7 0,transparent 55%),linear-gradient(125deg,#d9ff87,#c7ed72 50%,#a5cd51);box-shadow:inset 0 1px 1px #fff9,inset 0 -1px 1px #65843350;isolation:isolate}
#collar-flow .cf-card-face:not(.cf-card-back):before{content:'';position:absolute;inset:-50%;pointer-events:none;background:linear-gradient(112deg,transparent 44%,#ffffff35 48%,transparent 53%);transform:translateX(-50%);transition:transform 1.3s cubic-bezier(.2,.65,.2,1);z-index:-1}
#collar-flow .cf-card-stage:hover .cf-card-face:before{transform:translateX(40%)}
#collar-flow .cf-card-contactless{position:absolute;left:26px;top:89px;color:#32432180}
#collar-flow .cf-card-contactless svg{width:24px;height:24px}
#collar-flow .cf-story-mini-card>img{width:38px;height:23px;right:14px;top:19px}
@keyframes cf-notice-in{from{opacity:0;transform:translateY(16px) scale(.94);filter:blur(4px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes cf-ledger-in{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}
@keyframes cf-balance-change{0%{color:#26391b;transform:translateY(0)}35%{color:#638c27;transform:translateY(-2px)}100%{color:inherit;transform:translateY(0)}}
@media(max-width:620px){
 #collar-flow .cf-header-emblem{width:48px;height:29px}
 #collar-flow .cf-nav .cf-brand{gap:7px}
 #collar-flow .cf-hero-art{height:607px;margin-top:24px}
 #collar-flow .cf-device{top:28px;width:264px}
 #collar-flow .cf-live-notice{width:218px;min-height:63px;padding:11px 12px;gap:9px;border-radius:16px}
 #collar-flow .cf-live-notice strong{font-size:12px}
 #collar-flow .cf-live-notice small{font-size:10px}
 #collar-flow .cf-notice-icon{width:30px;height:30px;font-size:20px}
 #collar-flow .cf-live-notice[data-slot=top-left]{top:10px;left:-4px}
 #collar-flow .cf-live-notice[data-slot=right]{top:311px;right:-5px}
 #collar-flow .cf-live-notice[data-slot=bottom-left]{top:419px;left:-5px}
 #collar-flow .cf-demo-progress{bottom:0;gap:9px}
 #collar-flow .cf-card-wordmark{font-size:26px}
 #collar-flow .cf-card-lockup{gap:6px}
 #collar-flow .cf-card-logo{width:43px;height:25px}
 #collar-flow .cf-card-kind{font-size:9px;letter-spacing:1px}
 #collar-flow .cf-card-contactless{left:23px;top:80px}
}
@media(max-width:350px){#collar-flow .cf-device{width:246px}#collar-flow .cf-live-notice{width:206px}#collar-flow .cf-hero-art{height:592px}#collar-flow .cf-card-wordmark{font-size:23px}#collar-flow .cf-card-logo{width:35px;height:22px}#collar-flow .cf-card-contactless{top:70px}}
@media(prefers-reduced-motion:reduce){#collar-flow .cf-header-emblem video{display:none!important}#collar-flow .cf-header-emblem img{opacity:1!important}#collar-flow .cf-live-notice,#collar-flow .cf-transaction,#collar-flow #cf-hero-balance{animation:none!important;transition:none!important}#collar-flow .cf-device{transform:translateX(-50%)}#collar-flow .cf-card-face:before{display:none}}