.ccf{container-type:inline-size;position:relative;aspect-ratio:1376 / 768;border-radius:var(--r);overflow:hidden;background:var(--surface);border:1px solid var(--line);box-shadow:var(--raise);font-family:inherit}.ccf__photo{position:absolute;inset:0}.ccf__phone{position:absolute;right:5cqw;bottom:3.5cqw;width:25cqw;height:48cqw;border-radius:3.6cqw;background:var(--surface);border:.55cqw solid var(--ink);box-shadow:0 2.6cqw 3cqw -1.2cqw #1a17148c;overflow:hidden}.ccf__notch{position:absolute;z-index:3;left:50%;top:1.2cqw;width:7cqw;height:1cqw;margin-left:-3.5cqw;border-radius:1cqw;background:var(--ink)}.ccf__scr{position:absolute;inset:0;padding:4cqw 2.2cqw 2.2cqw;opacity:0}.ccf__list{opacity:1}.ccf__cam{background:#14110e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2cqw}.ccf__find{position:relative;width:14cqw;height:14cqw;padding:1.6cqw;background:#fff;border-radius:1cqw}.ccf__code svg{display:block;width:100%;height:100%}.ccf__beam{position:absolute;left:.6cqw;right:.6cqw;top:0;height:.5cqw;border-radius:1cqw;background:var(--accent);box-shadow:0 0 1.4cqw var(--accent);opacity:0}.ccf__c{position:absolute;width:3cqw;height:3cqw;border:.45cqw solid var(--accent)}.ccf__c--tl{left:-.9cqw;top:-.9cqw;border-right:0;border-bottom:0}.ccf__c--tr{right:-.9cqw;top:-.9cqw;border-left:0;border-bottom:0}.ccf__c--bl{left:-.9cqw;bottom:-.9cqw;border-right:0;border-top:0}.ccf__c--br{right:-.9cqw;bottom:-.9cqw;border-left:0;border-top:0}.ccf__hint{font-size:1.7cqw;font-weight:600;color:#fffc}.ccf__tick{position:absolute;left:50%;top:50%;width:6cqw;height:6cqw;margin:-3cqw 0 0 -3cqw;display:grid;place-items:center;border-radius:50%;background:var(--success-on);color:#fff;transform:scale(0)}.ccf__tick svg{width:3.2cqw;height:3.2cqw}.ccf__eye{margin:0;font-size:1.5cqw;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text)}.ccf__t{margin:.4cqw 0 0;font-family:var(--font-display);font-size:2.2cqw;font-weight:800;letter-spacing:-.02em;color:var(--ink);white-space:nowrap}.ccf__lab{margin:3cqw 0 .8cqw;font-size:1.6cqw;font-weight:700;color:var(--muted)}.ccf__in{display:block;height:5cqw;padding:0 1.6cqw;line-height:4.6cqw;border:.2cqw solid var(--line-2);border-radius:1.2cqw;background:var(--paper);font-size:2cqw;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden}.ccf__typed{display:inline-block;clip-path:inset(0 0 0 0)}.ccf__btn{display:block;margin-top:1.6cqw;padding:1.4cqw 0;border-radius:99cqw;background:var(--accent);color:var(--accent-ink);font-size:1.9cqw;font-weight:800;text-align:center}.ccf__row{display:flex;align-items:center;justify-content:space-between;gap:1cqw;margin-top:1.4cqw;padding:1.4cqw 1.3cqw;border:.2cqw solid var(--line);border-radius:1.2cqw;background:var(--surface)}.ccf__row b{font-size:1.65cqw;white-space:nowrap;font-weight:600;color:var(--ink)}.ccf__add,.ccf__sent{flex:none;font-size:1.5cqw;font-weight:800;white-space:nowrap}.ccf__add{padding:.4cqw 1.3cqw;border-radius:99cqw;background:var(--accent);color:var(--accent-ink)}.ccf__sent{display:inline-flex;align-items:center;gap:.5cqw;color:var(--success-on)}.ccf__sent svg{width:1.6cqw;height:1.6cqw}.ccf__row--1 .ccf__add,.ccf__row--2 .ccf__add,.ccf__row--3 .ccf__sent{display:none}.ccf__shop{position:absolute;left:3cqw;bottom:3cqw;width:27cqw;padding:1.6cqw 2cqw;border-radius:2cqw;background:var(--surface);border:1px solid var(--line);box-shadow:0 2cqw 3cqw -1cqw #1a171473}.ccf__shop-k{margin:0;font-size:1.25cqw;white-space:nowrap;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}.ccf__shop-row{display:flex;align-items:center;justify-content:space-between;gap:1cqw;margin:1.2cqw 0 0;padding-top:1.2cqw;border-top:1px solid var(--line)}.ccf__shop-row b{font-size:1.8cqw;white-space:nowrap;font-weight:700;color:var(--ink)}.ccf__shop-row span{font-size:1.4cqw;font-weight:700;color:var(--success-on);white-space:nowrap}.ccf.is-live .ccf__phone{animation:ccf-phone 9s ease-in-out infinite}.ccf.is-live .ccf__cam{animation:ccf-cam 9s linear infinite}.ccf.is-live .ccf__beam{animation:ccf-beam 9s linear infinite}.ccf.is-live .ccf__tick{animation:ccf-tick 9s cubic-bezier(.2,1.4,.4,1) infinite}.ccf.is-live .ccf__name{animation:ccf-name 9s linear infinite}.ccf.is-live .ccf__typed{animation:ccf-typed 9s steps(11,end) infinite}.ccf.is-live .ccf__btn{animation:ccf-press 9s ease-out infinite}.ccf.is-live .ccf__list{animation:ccf-list 9s linear infinite}.ccf.is-live .ccf__row--1 .ccf__add,.ccf.is-live .ccf__row--2 .ccf__add{display:inline-block;animation:ccf-add1 9s linear infinite}.ccf.is-live .ccf__row--2 .ccf__add{animation-name:ccf-add2}.ccf.is-live .ccf__row--1 .ccf__sent{animation:ccf-sent1 9s linear infinite}.ccf.is-live .ccf__row--2 .ccf__sent{animation:ccf-sent2 9s linear infinite}.ccf.is-live .ccf__shop{animation:ccf-shop 9s cubic-bezier(.2,1,.3,1) infinite}@keyframes ccf-phone{0%,3%{transform:translate(60%,90%) rotate(10deg);opacity:0}4%{opacity:1}12%,to{transform:none;opacity:1}}@keyframes ccf-cam{0%,26%{opacity:1}29%,to{opacity:0}}@keyframes ccf-beam{0%,13%{opacity:0;transform:translateY(0)}14%{opacity:1}19%{transform:translateY(13cqw)}24%{transform:translateY(0);opacity:1}25%,to{opacity:0}}@keyframes ccf-tick{0%,24%{transform:scale(0)}26%,28%{transform:scale(1)}30%,to{transform:scale(0)}}@keyframes ccf-name{0%,28%{opacity:0}30%,43%{opacity:1}45%,to{opacity:0}}@keyframes ccf-typed{0%,30%{clip-path:inset(0 100% 0 0)}40%,to{clip-path:inset(0 0 0 0)}}@keyframes ccf-press{0%,41%{transform:none}42%{transform:scale(.94)}44%,to{transform:none}}@keyframes ccf-list{0%,44%{opacity:0}46%,to{opacity:1}}@keyframes ccf-add1{0%,53%{opacity:1}54%,to{opacity:0}}@keyframes ccf-add2{0%,61%{opacity:1}62%,to{opacity:0}}@keyframes ccf-sent1{0%,53%{opacity:0;transform:translate(1cqw)}55%,to{opacity:1;transform:none}}@keyframes ccf-sent2{0%,61%{opacity:0;transform:translate(1cqw)}63%,to{opacity:1;transform:none}}@keyframes ccf-shop{0%,67%{transform:translate(-120%);opacity:0}68%{opacity:1}74%,to{transform:none;opacity:1}}.ccf.is-live .ccf__row--1,.ccf.is-live .ccf__row--2{position:relative}.ccf.is-live .ccf__row--1 .ccf__sent,.ccf.is-live .ccf__row--2 .ccf__sent{position:absolute;right:1.5cqw;top:50%;transform:translateY(-50%)}.ccf.is-live .ccf__row--1 .ccf__sent{animation-name:ccf-sent1b}.ccf.is-live .ccf__row--2 .ccf__sent{animation-name:ccf-sent2b}@keyframes ccf-sent1b{0%,53%{opacity:0}55%,to{opacity:1}}@keyframes ccf-sent2b{0%,61%{opacity:0}63%,to{opacity:1}}@media(prefers-reduced-motion:reduce){.ccf.is-live *{animation:none!important}}