.driver-popover.driverjs-theme{background-color:#ffffff;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.15);max-width:400px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.driver-popover.driverjs-theme .driver-popover-title{font-size:18px;font-weight:700;color:#1f2937;margin-bottom:8px;font-family:inherit}.driver-popover.driverjs-theme .driver-popover-description{font-size:14px;line-height:1.6;color:#6b7280;font-family:inherit}.driver-popover.driverjs-theme .driver-popover-progress-text{font-size:12px;color:#9ca3af;font-weight:500;font-family:inherit}.driver-popover.driverjs-theme button{border-radius:8px;font-weight:600;padding:8px 16px;transition:all .2s ease;font-family:inherit;text-shadow:none!important}.driver-popover.driverjs-theme .driver-popover-next-btn{background-color:#fb356d;color:white;font-weight:600}.driver-popover.driverjs-theme .driver-popover-next-btn:hover{background-color:#e02a5d;transform:translateY(-1px)}.driver-popover.driverjs-theme .driver-popover-prev-btn{background-color:#f3f4f6;color:#374151}.driver-popover.driverjs-theme .driver-popover-prev-btn:hover{background-color:#e5e7eb}.driver-popover.driverjs-theme .driver-popover-close-btn{color:#9ca3af}.driver-popover.driverjs-theme .driver-popover-close-btn:hover{color:#6b7280}.driver-active-element{border-radius:8px!important}.driver-active-element.driver-no-interaction-disabled{animation:driverPulse 1.5s ease-in-out infinite;box-shadow:0 0 0 0 rgba(251,53,109,.4)}@keyframes driverPulse{0%{box-shadow:0 0 0 0 rgba(251,53,109,.6)}70%{box-shadow:0 0 0 12px rgba(251,53,109,0)}to{box-shadow:0 0 0 0 rgba(251,53,109,0)}}.tap-indicator{display:inline-flex;align-items:center;gap:4px;background:linear-gradient(135deg,#fb356d,#ff6b9d);color:white;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;margin-top:8px;animation:tapBounce 1s ease-in-out infinite}@keyframes tapBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.driver-overlay{background-color:rgba(0,0,0,.03)!important}.driver-active-element:after{content:"";position:absolute;bottom:-40px;left:50%;transform:translateX(-50%);width:32px;height:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fb356d'%3E%3Cpath d='M9 11.24V7.5a2.5 2.5 0 0 1 5 0v3.74c1.21-.81 2-2.18 2-3.74a5 5 0 0 0-10 0c0 1.56.79 2.93 2 3.74zm9.84 4.63l-4.54-2.26c-.17-.07-.35-.11-.54-.11H13v-6a.5.5 0 0 0-1 0v8.5H9.5a.5.5 0 0 0 0 1h3.5v2.5a.5.5 0 0 0 1 0V16h.76c.19 0 .37-.04.54-.11l4.54-2.26c.32-.16.5-.5.46-.86-.04-.36-.28-.66-.62-.77l-.34-.13z'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;animation:pointerBounce .8s ease-in-out infinite;pointer-events:none;z-index:10001;display:none}.driver-active-element.show-pointer:after{display:block}@keyframes pointerBounce{0%,to{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-8px)}}.animate-shake{animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-6px)}80%{transform:translateX(6px)}}.driver-popover{animation:driverPopoverFadeIn .3s ease-out}@keyframes driverPopoverFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:767px){.driver-popover.driverjs-theme{max-width:calc(100vw - 32px);margin:0 16px}.driver-popover.driverjs-theme .driver-popover-title{font-size:16px}.driver-popover.driverjs-theme .driver-popover-description{font-size:13px;line-height:1.5}.driver-popover.driverjs-theme button{padding:6px 12px;font-size:13px}.driver-active-element:after{display:none!important}.driver-highlighted-element{border-radius:6px!important}}
/* Safari iOS tự zoom khi focus ô nhập nhỏ hơn 16px (luật dự án, xem CLAUDE.md). */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),select,textarea{font-size:max(16px,1em)!important}

/* Keyframes của bìa phong bì trên nguồn (styled-jsx nên không nằm trong source.css): hạt rơi, con dấu đập, vệt sáng nút. */
@keyframes envelope-away{0%{transform:translatey(0)rotate(0deg);opacity:1}15%{transform:translatey(10px)rotate(.5deg);opacity:1}100%{transform:translatey(-120vh)rotate(-2deg);opacity:0}}@keyframes particle-burst{0%{opacity:0;transform:translate(-50%,-50%)scale(0)rotate(0deg)}15%{opacity:1;transform:translate(-50%,-50%)scale(1.3)rotate(var(--rot-start,15deg))}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy)))scale(.6)rotate(var(--rot-end,180deg))}}@keyframes seal-pulse{0%,100%{transform:translate(-50%,-50%)scale(1);box-shadow:0 4px 20px var(--shadow-color)}50%{transform:translate(-50%,-50%)scale(1.06);box-shadow:0 6px 35px var(--shadow-color)}}@keyframes seal-break{0%{transform:translate(-50%,-50%)scale(1)rotate(0deg);opacity:1;filter:brightness(1)}30%{transform:translate(-50%,-50%)scale(1.15)rotate(5deg);opacity:.9;filter:brightness(1.3)}60%{transform:translate(-50%,-50%)scale(1.05)rotate(-3deg);opacity:.5;filter:brightness(1.5)}100%{transform:translate(-50%,-50%)scale(0)rotate(15deg);opacity:0;filter:brightness(2)}}@keyframes seal-ring{0%{transform:translate(-50%,-50%)scale(.8);opacity:.8}100%{transform:translate(-50%,-50%)scale(2.5);opacity:0}}@keyframes seal-flower-bloom{0%{transform:scale(1)rotate(0deg);filter:brightness(1)}45%{transform:scale(1.16)rotate(-3deg);filter:brightness(1.08)}100%{transform:scale(1.06)rotate(0deg);filter:brightness(1.02)}}@keyframes shine{0%{left:-100%}50%,100%{left:100%}}@keyframes dragon-fly-forward{0%{transform:scale(var(--fly-scale-x,1),1);filter:blur(0px);opacity:.7}40%{transform:scale(calc(var(--fly-scale-x,1)*1.6),1.6);filter:blur(2px);opacity:.5}100%{transform:scale(calc(var(--fly-scale-x,1)*3),3);filter:blur(10px);opacity:0}}@keyframes ambient-fall{0%{transform:translatey(-8vh)translatex(0)rotate(0deg);opacity:0}10%{opacity:.5}50%{transform:translatey(48vh)translatex(var(--sway,20px))rotate(180deg);opacity:.6}92%{opacity:.45}100%{transform:translatey(105vh)translatex(0)rotate(360deg);opacity:0}}@keyframes ambient-rise{0%{transform:translatey(6vh)translatex(0)rotate(0deg);opacity:0}12%{opacity:.45}55%{transform:translatey(-42vh)translatex(var(--sway,20px))rotate(8deg);opacity:.55}92%{opacity:.35}100%{transform:translatey(-92vh)translatex(0)rotate(0deg);opacity:0}}

/* Hiệu ứng riêng của CardMe (public/mirrors/interactions.js). Chỉ dùng transform/opacity để nhẹ GPU. */
.cd-fx{position:fixed;inset:0;z-index:60;overflow:hidden;pointer-events:none}
.cd-fx>span{position:absolute;line-height:1;user-select:none;will-change:transform,opacity}
.cd-fx>span.cd-float{top:auto;bottom:-30px;animation-name:ambient-rise;animation-timing-function:ease-in-out;animation-iteration-count:infinite}
.cd-fx>span.cd-pop{left:0;top:0}
@keyframes cd-wiggle{0%,84%,100%{rotate:0deg;scale:1}88%{rotate:-4deg;scale:1.06}92%{rotate:4deg;scale:1.06}96%{rotate:-2deg;scale:1.03}}
.cd-wiggle{animation:cd-wiggle 5s ease-in-out 2s infinite}
.cd-reveal{opacity:0;translate:0 22px;scale:.97}
.cd-reveal.cd-in{opacity:1;translate:0 0;scale:1;transition:opacity .8s ease,translate .8s cubic-bezier(.2,.8,.2,1),scale .8s cubic-bezier(.2,.8,.2,1)}
/* Trang chủ gửi cd-pause cho khung xem trước không phải khung đang chạy demo. */
.cd-paused *,.cd-paused *::before,.cd-paused *::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){.cd-fx,.cd-wiggle{display:none;animation:none}.cd-reveal{opacity:1;translate:none;scale:1}}