.demo-outer{display:flex;align-items:center;justify-content:center;gap:clamp(12px,3vw,32px);margin-top:clamp(32px,4vw,48px)}.demo-frame{position:relative;padding:26px;background:linear-gradient(145deg,#ffe87c,#deb030 8%,#b07018 20%,#784208 34%,#542e04 44%,#86500e,#be7418,#deb030 80%,#ffe87c,#be7418);border-radius:3px;box-shadow:inset 0 7px 16px #fff0828c,inset 7px 0 10px #fff08242,inset 0 -7px 16px #230e00bf,inset -7px 0 10px #230e0070,0 0 0 2px #2e1402,0 0 0 4px #b07018,0 0 0 6px #2e1402,0 38px 90px #0000009e;flex-shrink:0;align-self:center;width:clamp(250px,34vw,300px)}.demo-frame:before{content:"";position:absolute;inset:13px;border-radius:2px;border:5px dotted rgba(80,42,4,.72);pointer-events:none;z-index:10}.demo-frame:after{content:"";position:absolute;inset:8px;border-top:1.5px solid rgba(255,238,140,.42);border-left:1.5px solid rgba(255,238,140,.22);border-bottom:1.5px solid rgba(25,10,0,.55);border-right:1.5px solid rgba(25,10,0,.32);border-radius:3px;pointer-events:none;z-index:10}.demo-device{position:relative;width:100%;aspect-ratio:9/16;background:#0a0806;border-radius:6px;overflow:hidden}.demo-screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .38s,transform .38s;transform:scale(.96)}.demo-screen.ds-active{opacity:1;pointer-events:auto;transform:scale(1)}.demo-ph-bg{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px}.demo-ph-label-sm{font-size:11px;color:#ffffff61;font-family:Poppins,sans-serif;text-align:center;line-height:1.6;letter-spacing:.03em}.demo-screen-footer{position:absolute;bottom:0;left:0;right:0;padding:14px 16px;display:flex;justify-content:center}.demo-screen-footer-row{gap:10px}.demo-action-btn{background:linear-gradient(135deg,#dda844,#b07828);border:none;border-radius:50px;color:#1a1000;font-family:Poppins,sans-serif;font-weight:700;font-size:13px;padding:10px 22px;cursor:pointer;letter-spacing:.03em;transition:opacity .2s,transform .15s;white-space:nowrap}.demo-action-btn:hover{opacity:.88;transform:scale(.97)}.demo-btn-sec{background:#ffffff1a!important;color:#ffffffbf!important;border:1px solid rgba(255,255,255,.15);font-weight:600!important}.demo-event-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding-bottom:60px}.demo-event-name{font-family:Great Vibes,cursive;font-size:clamp(22px,4vw,30px);color:#da4;text-shadow:0 1px 16px rgba(0,0,0,.95),0 0 40px rgba(221,170,68,.3);letter-spacing:.5px;text-align:center}.demo-event-date{font-family:Poppins,sans-serif;font-size:10px;color:#ffffffd9;letter-spacing:.15em;text-transform:uppercase;text-align:center}.demo-event-hint{font-size:9px;color:#da49;font-family:Poppins,sans-serif;letter-spacing:.05em;margin-top:10px;text-align:center;padding:0 20px;line-height:1.5}.demo-cd-num{font-family:Poppins,sans-serif;font-size:clamp(68px,11vw,94px);font-weight:900;color:#fff;text-shadow:0 0 40px rgba(255,255,255,.25);line-height:1;transition:opacity .18s,transform .18s;z-index:1}.demo-cd-lbl{font-family:Great Vibes,cursive;font-size:clamp(19px,3vw,25px);color:#ddaa44e6;margin-top:6px;z-index:1}.demo-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;transition:opacity .06s;z-index:5}.demo-compliment-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px}.demo-compliment-emoji{font-size:42px;animation:demoPulse 1.6s ease-in-out infinite}.demo-compliment-text{font-family:Great Vibes,cursive;font-size:clamp(30px,5vw,42px);color:#da4;text-shadow:0 1px 20px rgba(221,170,68,.4);text-align:center}.demo-compliment-sub{font-size:10px;color:#ffffff59;font-family:Poppins,sans-serif;letter-spacing:.08em;text-align:center;margin-top:4px}.demo-sign-wrap{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:0 22px 64px}.demo-sign-instruction{font-size:11px;color:#ffffff73;font-family:Poppins,sans-serif;letter-spacing:.07em}.demo-sign-area{width:100%;background:#ffffff08;border:1px solid rgba(221,170,68,.22);border-radius:12px;height:72px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.demo-sign-animated{font-family:Great Vibes,cursive;font-size:26px;color:#ddaa44e6;text-shadow:0 0 12px rgba(221,170,68,.25);display:flex;align-items:center;padding-bottom:4px}.demo-sign-line-base{position:absolute;bottom:14px;left:14px;right:14px;height:1px;background:#ddaa442e}.demo-done-wrap{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px 14px;width:100%}.demo-done-title{font-family:Poppins,sans-serif;font-weight:700;font-size:15px;color:#fff;text-align:center}.demo-done-options{display:flex;gap:10px;width:100%}.demo-done-option{flex:1;background:#ddaa4417;border:1px solid rgba(221,170,68,.28);border-radius:14px;padding:14px 8px;display:flex;flex-direction:column;align-items:center;gap:5px}.demo-done-icon{font-size:26px}.demo-done-opt-label{font-family:Poppins,sans-serif;font-size:11px;font-weight:600;color:#ffffffbf;text-align:center}.demo-cta-btn{background:linear-gradient(135deg,#dda844,#b07828);border:none;border-radius:50px;color:#1a1000;font-family:Poppins,sans-serif;font-weight:700;font-size:12px;padding:11px 18px;cursor:pointer;width:100%;letter-spacing:.03em}.demo-restart-btn{background:none;border:none;color:#ffffff59;font-family:Poppins,sans-serif;font-size:11px;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:2px}.demo-progress{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;gap:5px;z-index:10}.demo-dot{height:5px;border-radius:3px;background:#ffffff2e;cursor:pointer;transition:background .3s,width .35s;width:5px;padding:8px;margin:-8px;box-sizing:content-box}.demo-dot.active{width:18px;background:#da4c}.demo-nav-btn{width:44px;height:44px;border-radius:50%;background:#ddaa441a;border:1px solid rgba(221,170,68,.28);color:#da4c;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s;flex-shrink:0;align-self:center}.demo-nav-btn:hover{background:#da43;transform:scale(1.08)}.demo-steps-row{display:flex;align-items:flex-start;justify-content:center;gap:clamp(6px,2vw,24px);margin-top:clamp(24px,3vw,36px);flex-wrap:wrap;padding:0 12px}.demo-step-item{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;opacity:.38;transition:opacity .3s;min-width:60px;max-width:90px}.demo-step-item.active{opacity:1}.demo-step-num{width:36px;height:36px;border-radius:50%;background:#ddaa441f;border:1px solid rgba(221,170,68,.28);display:flex;align-items:center;justify-content:center;font-family:Poppins,sans-serif;font-size:13px;font-weight:700;color:#ddaa44a6;transition:background .3s,border-color .3s}.demo-step-item.active .demo-step-num{background:#ddaa4447;border-color:#ddaa44b3;color:#dda844}.demo-step-name{font-family:Poppins,sans-serif;font-size:12px;color:#ffffff80;text-align:center;letter-spacing:.02em;line-height:1.3}.demo-step-item.active .demo-step-name{color:#ffffffe0}.demo-on-light .demo-step-name{color:#11111173}.demo-on-light .demo-step-item.active .demo-step-name{color:#111111d1}.demo-on-light .demo-step-num{border-color:#96641e4d;color:#825014a6}.demo-on-light .demo-step-item.active .demo-step-num{background:#96641e2e;border-color:#96641e8c;color:#8b5e14}.demo-on-light .demo-nav-btn{background:#96641e1a;border-color:#96641e4d;color:#825014cc}.demo-on-light .demo-nav-btn:hover{background:#96641e33}@keyframes demoPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@media (max-width:600px){.demo-outer{gap:16px 20px;flex-wrap:wrap;justify-content:center}.demo-frame{order:1;flex:0 0 min(82vw,300px)}.demo-nav-btn{order:2;display:flex!important}}