.main-layout{min-height:100vh;min-height:100dvh;background:var(--bg-secondary);width:100%;margin:0 auto;position:relative;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;flex-direction:column}@media(min-width:768px){.main-layout{max-width:480px;box-shadow:0 0 50px #0000001a;background:var(--bg-color)}}.main-content{flex:1;padding-bottom:calc(80px + env(safe-area-inset-bottom));width:100%;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;background:var(--nav-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;justify-content:space-around;padding:12px 0;padding-bottom:calc(12px + env(safe-area-inset-bottom));border-top:var(--nav-border);box-shadow:0 -4px 20px #00000008;z-index:1000}@media(min-width:768px){.bottom-nav{max-width:480px}}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;background:transparent;border:none;color:var(--text-secondary);font-size:11px;cursor:pointer;padding:8px 16px;transition:color .2s,transform .1s}.nav-item:hover{color:var(--primary-color)}.nav-item:active{transform:scale(.95)}.nav-item.active{color:var(--secondary-color)}.nav-item.active span{font-weight:600}@media(max-width:380px){.bottom-nav{padding:10px 0 16px}.nav-item{padding:6px 12px}}.home-container{flex:1;background:transparent;color:var(--text-primary);padding:20px;padding-top:calc(20px + env(safe-area-inset-top));max-width:100%;width:100%;margin:0 auto;position:relative;z-index:1}.home-container:before{content:"";position:absolute;top:0;left:0;width:100%;height:280px;background:var(--secondary-gradient);z-index:-1;border-bottom-left-radius:30px;border-bottom-right-radius:30px;box-shadow:0 4px 20px #03a9f433}.home-header{margin-bottom:20px}.header-content{padding:0 4px}.header-title{font-size:24px;font-weight:800;margin:0;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.1);display:flex;align-items:center;gap:8px}.header-subtitle{font-size:14px;color:#ffffffe6;margin:4px 0 0;font-weight:500}.wave{display:inline-block;animation:wave-animation 2.5s infinite;transform-origin:70% 70%}@keyframes wave-animation{0%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}60%{transform:rotate(0)}to{transform:rotate(0)}}.cards-section{margin-bottom:24px}.cards-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.cards-title{font-size:18px;font-weight:700;margin:0;color:var(--text-primary)}.btn-new-card{background:transparent;color:var(--primary-color);border:none;font-size:14px;font-weight:600;cursor:pointer;padding:8px 12px;border-radius:8px;transition:background .2s}.btn-new-card:hover{background:#ffa5001a}.cards-header-row{margin-bottom:16px}.cards-header-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.home-filter-tabs{display:flex;gap:8px;margin-bottom:8px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}.home-filter-tab{background:var(--card-bg);border:1px solid var(--border-color);color:var(--text-secondary);font-size:13px;padding:8px 18px;border-radius:20px;cursor:pointer;white-space:nowrap;transition:all .2s;font-weight:500}.home-filter-tab.active{background:var(--secondary-color);border-color:var(--secondary-color);color:#fff;box-shadow:0 4px 10px #03a9f433}.cards-list{display:flex;flex-direction:column;gap:16px}.zing-card{position:relative;width:100%;height:200px;border-radius:16px;overflow:hidden;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease;box-shadow:0 4px 12px #00000026}.zing-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0003}.zing-card-sunburst{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.zing-card-round .zing-card-sunburst{background:repeating-conic-gradient(from 0deg at 50% 50%,#00bcd4 0deg 12deg,#00acc1 12deg 24deg)}.zing-card-money .zing-card-sunburst{background:repeating-conic-gradient(from 0deg at 50% 50%,#ffa726 0deg 12deg,#ff9800 12deg 24deg)}.zing-card-content{position:relative;z-index:1;padding:16px;height:100%;display:flex;flex-direction:column}.zing-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.zing-card-title{font-size:14px;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.zing-new-badge{background:#e91e63;color:#fff;font-size:9px;font-weight:700;padding:3px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 6px #e91e6366}.zing-card-center{flex:1;display:flex;align-items:center;justify-content:center;margin-top:-20px}.zing-text{font-size:72px;font-weight:900;color:#fff;text-shadow:0 4px 8px rgba(0,0,0,.3),0 0 40px rgba(255,255,255,.2);line-height:1;letter-spacing:-2px}.zing-card-bus{position:absolute;bottom:50px;left:16px;opacity:.8}.zing-card-info{position:absolute;bottom:12px;left:16px;right:50px;display:flex;justify-content:space-between;gap:12px}.zing-info-item{display:flex;flex-direction:column;gap:2px}.zing-info-label{font-size:10px;font-weight:600;color:#fffc;text-transform:uppercase;letter-spacing:.5px}.zing-info-value{font-size:13px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.3)}.zing-card-strip{position:absolute;right:0;top:0;bottom:0;width:40px;display:flex;align-items:center;justify-content:center;z-index:2}.zing-card-round .zing-card-strip{background:#009688e6}.zing-card-money .zing-card-strip{background:#e65100e6}.zing-strip-text{writing-mode:vertical-rl;text-orientation:mixed;font-size:9px;font-weight:700;color:#fff;letter-spacing:1px;text-transform:uppercase;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media(max-width:380px){.zing-text{font-size:60px}.zing-card{height:180px}}.cards-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;gap:12px;color:var(--text-secondary)}.cards-loading .loading-spinner{width:32px;height:32px;border:3px solid rgba(0,0,0,.1);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}.cards-error{text-align:center;padding:30px 20px;color:var(--danger-color);background:#e91e630d;border-radius:12px;border:1px solid rgba(233,30,99,.1)}.cards-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;gap:16px;color:var(--text-secondary);text-align:center}.cards-empty .btn-buycard{background:var(--primary-gradient);color:#fff;border:none;box-shadow:0 4px 15px #ffa5004d;padding:12px 24px;border-radius:14px;font-size:15px;font-weight:600;cursor:pointer;transition:transform .2s}.cards-empty .btn-buycard:hover{transform:translateY(-2px)}.authentic-card{position:relative;width:100%;height:220px;border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease;box-shadow:0 4px 16px #0003}.authentic-card:hover{transform:translateY(-4px);box-shadow:0 8px 28px #00000040}.authentic-card-sunburst{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.authentic-card-adult .authentic-card-sunburst{background:repeating-conic-gradient(from 0deg at 50% 50%,#ff9800 0deg 10deg,#f57c00 10deg 20deg)}.authentic-card-student .authentic-card-sunburst{background:repeating-conic-gradient(from 0deg at 50% 50%,#e91e63 0deg 10deg,#c2185b 10deg 20deg)}.authentic-card-content{position:relative;z-index:1;padding:12px 16px;height:100%;display:flex;flex-direction:column}.authentic-card-bus-top{width:100%;margin-bottom:8px}.authentic-card-center{position:relative;flex:1;display:flex;align-items:center;justify-content:center}.authentic-shape{position:absolute;opacity:.6}.authentic-shape-1{width:80px;height:80px;background:#ffffff4d;border-radius:50%;top:10%;left:10%}.authentic-shape-2{width:60px;height:60px;background:#ffffff40;border-radius:8px;bottom:15%;right:15%;transform:rotate(45deg)}.authentic-text{font-size:80px;font-weight:900;color:#fff;text-shadow:0 4px 12px rgba(0,0,0,.4),0 0 50px rgba(255,255,255,.3);line-height:1;letter-spacing:-3px;z-index:2}.authentic-card-bottom{display:flex;align-items:center;margin-top:auto}.authentic-brand{font-size:16px;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.authentic-info-badge{position:absolute;bottom:12px;right:50px;background:#fffffff2;border-radius:8px;padding:8px 12px;box-shadow:0 2px 8px #0003;min-width:100px}.authentic-info-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}.authentic-info-row:last-child{margin-bottom:0}.authentic-info-label{font-size:9px;font-weight:600;color:#666;text-transform:uppercase}.authentic-info-value{font-size:13px;font-weight:800;color:#333}.authentic-info-value-small{font-size:10px;font-weight:700;color:#555}.authentic-new-badge{position:absolute;top:12px;right:50px;background:#4caf50;color:#fff;font-size:10px;font-weight:700;padding:4px 10px;border-radius:12px;text-transform:uppercase;box-shadow:0 2px 8px #4caf5066}.authentic-card-strip{position:absolute;right:0;top:0;bottom:0;width:38px;display:flex;align-items:center;justify-content:center;z-index:2}.authentic-card-adult .authentic-card-strip{background:#bf360cf2}.authentic-card-student .authentic-card-strip{background:#880e4ff2}.authentic-strip-text{writing-mode:vertical-rl;text-orientation:mixed;font-size:10px;font-weight:800;color:#fff;letter-spacing:1.5px;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.4)}@media(max-width:380px){.authentic-text{font-size:65px}.authentic-card{height:200px}}.card-detail-overlay{position:fixed;inset:0;background-color:#0006;display:flex;align-items:flex-end;justify-content:center;z-index:1000;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:fadeIn .3s ease-out}@media(min-width:480px){.card-detail-overlay{align-items:center}}.card-detail-content{background:var(--card-bg);border-top-left-radius:24px;border-top-right-radius:24px;box-shadow:0 -4px 20px #0000001a;display:flex;flex-direction:column;padding:24px;width:100%;max-width:480px;animation:slideUp .3s cubic-bezier(.165,.84,.44,1);max-height:90vh;overflow-y:auto;position:relative}@media(min-width:480px){.card-detail-content{border-radius:24px;box-shadow:var(--card-shadow);width:90%;animation:scaleUp .3s cubic-bezier(.165,.84,.44,1)}}.card-modal-header{display:flex;justify-content:flex-end;margin-bottom:8px;position:absolute;top:20px;right:20px;z-index:10}.qr-display-section{display:flex;flex-direction:column;align-items:center;margin-top:10px;margin-bottom:24px}.qr-wrapper{background:#fff;padding:16px;border-radius:20px;box-shadow:0 4px 12px #0000000d;border:1px solid rgba(0,0,0,.05);margin-bottom:16px}.card-title-large{font-size:20px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.card-subtitle{font-size:14px;color:var(--text-secondary)}.card-details-list{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}.detail-row:last-child{border-bottom:none;padding-bottom:0}.detail-value{font-size:14px;font-weight:600;color:var(--text-primary);text-align:right}.status-badge{font-size:12px;padding:4px 10px;border-radius:8px}.status-badge.active{color:var(--success-color);background:#4caf501a}.status-badge.new{color:#f06292;background:#e91e631a}.status-badge.expired{color:var(--danger-color);background:#ef44441a}.card-actions{margin-top:auto}.btn-scan{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;background:var(--primary-gradient);color:#fff;border:none;padding:14px;border-radius:14px;font-size:15px;font-weight:600;cursor:pointer;transition:transform .2s;box-shadow:0 4px 15px #ff98004d}.btn-scan:disabled{opacity:.7;cursor:not-allowed;background:var(--text-secondary);box-shadow:none}.btn-scan:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #ff980066}@keyframes scaleUp{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.success-modal-overlay{position:fixed;inset:0;background-color:#0006;display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:fadeIn .2s ease-out}.success-modal-content{background:var(--card-bg);border-radius:24px;box-shadow:0 20px 50px #0000001a;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;text-align:center;width:85%;max-width:320px;animation:scaleUp .3s cubic-bezier(.175,.885,.32,1.275)}.success-circle{width:80px;height:80px;background:#4caf501a;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:20px;animation:scaleIn .4s ease-out .1s backwards}.success-title{font-size:22px;font-weight:700;margin:0 0 8px;color:var(--text-primary)}.success-desc{color:var(--text-secondary);font-size:15px;line-height:1.5;margin:0}.success-details-box{margin-top:1rem;text-align:left;background:var(--bg-secondary);padding:1rem;border-radius:12px;width:100%;box-sizing:border-box}.detail-row{display:flex;justify-content:space-between;margin-bottom:8px}.detail-row:last-child{margin-bottom:0}.detail-label{color:var(--text-secondary)}.detail-value{color:var(--text-primary);font-weight:700}.btn-success-close{margin-top:1.5rem;background:var(--primary-color);color:#fff;border:none;padding:12px 24px;border-radius:25px;width:100%;font-size:16px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.btn-success-close:hover{transform:translateY(-2px);box-shadow:0 4px 12px #4caf504d}@keyframes scaleIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.countdown-modal-overlay{position:fixed;inset:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:fadeIn .3s ease-out}.countdown-modal-content{background:var(--card-bg);border-radius:24px;box-shadow:var(--card-shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;text-align:center;width:90%;max-width:340px;border:1px solid var(--border-color);animation:scaleUp .3s cubic-bezier(.175,.885,.32,1.275)}.countdown-icon{width:80px;height:80px;background:#03a9f41a;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:24px;color:var(--secondary-color);animation:pulse 2s infinite}.countdown-title{font-size:20px;font-weight:700;margin:0 0 12px;color:var(--text-primary)}.countdown-timer{font-size:48px;font-weight:800;color:var(--primary-color);margin:16px 0;font-variant-numeric:tabular-nums;letter-spacing:2px}.countdown-desc{color:var(--text-secondary);font-size:14px;line-height:1.5;margin:0 0 24px}.countdown-progress{width:100%;height:6px;background:var(--bg-secondary);border-radius:3px;margin-bottom:24px;overflow:hidden}.countdown-progress-bar{height:100%;background:var(--primary-gradient);border-radius:3px;transition:width 1s linear}.btn-close-countdown{background:var(--bg-secondary);color:var(--text-secondary);border:none;padding:12px 24px;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;width:100%}.btn-close-countdown:hover{background:var(--border-color);color:var(--text-primary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 #03a9f433}70%{transform:scale(1.05);box-shadow:0 0 0 10px #03a9f400}to{transform:scale(1);box-shadow:0 0 #03a9f400}}.transaction-modal-overlay{position:fixed;inset:0;background-color:#0006;display:flex;align-items:flex-end;justify-content:center;z-index:1000;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:fadeIn .3s ease-out}@media(min-width:480px){.transaction-modal-overlay{align-items:center}}.transaction-modal-content{background:var(--card-bg);border-top-left-radius:24px;border-top-right-radius:24px;box-shadow:0 -4px 20px #0000001a;display:flex;flex-direction:column;padding:24px;width:100%;max-width:480px;animation:slideUp .3s cubic-bezier(.165,.84,.44,1);max-height:90vh;overflow-y:auto}@media(min-width:480px){.transaction-modal-content{border-radius:24px;box-shadow:var(--card-shadow);width:90%;animation:scaleUp .3s cubic-bezier(.165,.84,.44,1)}}.transaction-modal-header{display:flex;justify-content:flex-end;margin-bottom:8px}.btn-close-modal{background:var(--bg-secondary);border:none;width:32px;height:32px;border-radius:50%;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.btn-close-modal:hover{background:var(--border-color);color:var(--text-primary)}.transaction-icon-large{width:80px;height:80px;border-radius:24px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px}.transaction-amount-large{font-size:32px;font-weight:800;text-align:center;color:var(--text-primary);margin-bottom:8px}.transaction-title-large{font-size:16px;font-weight:600;text-align:center;color:var(--text-secondary);margin-bottom:32px}.transaction-details-list{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}.detail-row{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px dashed var(--border-color)}.detail-row:last-child{border-bottom:none}.detail-label{font-size:14px;color:var(--text-secondary);font-weight:500}.detail-value{font-size:14px;font-weight:600;color:var(--text-primary)}.status-valid{color:var(--success-color);background:#4caf501a;padding:4px 10px;border-radius:8px}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.history-page{padding:20px;padding-top:calc(20px + env(safe-area-inset-top));color:var(--text-primary);min-height:100vh;display:flex;flex-direction:column;position:relative;z-index:1}.history-page:before{content:"";position:absolute;top:0;left:0;width:100%;height:180px;background:var(--secondary-gradient);z-index:-1;border-bottom-left-radius:30px;border-bottom-right-radius:30px;box-shadow:0 4px 20px #03a9f433}.history-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.header-icon{width:40px;height:40px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;border:1px solid rgba(255,255,255,.3)}.history-header h1{font-size:20px;font-weight:700;margin:0;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.1)}.tabs-container{display:flex;gap:8px;margin-bottom:24px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch;border-bottom:none}.tab-button{background:#fff3;border:1px solid rgba(255,255,255,.1);color:#fffc;font-size:13px;padding:8px 16px;border-radius:20px;cursor:pointer;font-weight:500;white-space:nowrap;transition:all .2s}.tab-button:hover{background:#ffffff4d}.tab-button.active{background:var(--card-bg);color:var(--secondary-color);box-shadow:0 4px 12px #0000001a;font-weight:600}.tab-button.active:after{display:none}.transactions-list{display:flex;flex-direction:column;gap:12px;padding-bottom:80px;flex:1}.transaction-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:var(--card-bg);border-radius:16px;box-shadow:var(--card-shadow);border:1px solid var(--border-color);transition:transform .2s}.transaction-item:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000000f}.transaction-left{display:flex;gap:16px;align-items:center}.icon-wrapper{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.transaction-info{display:flex;flex-direction:column;gap:2px}.transaction-title{font-size:14px;font-weight:600;color:var(--text-primary)}.transaction-date{font-size:12px;color:var(--text-secondary)}.transaction-right{text-align:right;display:flex;flex-direction:column;gap:2px}.transaction-amount{font-size:15px;font-weight:700;color:var(--text-primary)}.transaction-amount.positive{color:var(--success-color)}.transaction-type{font-size:11px;color:var(--text-secondary);text-transform:capitalize;background:var(--bg-secondary);padding:2px 6px;border-radius:4px;align-self:flex-end}.empty-state{text-align:center;padding:60px 20px;color:var(--text-secondary);background:var(--card-bg);border-radius:20px;margin-top:20px;box-shadow:var(--card-shadow);border:1px solid var(--border-color)}.empty-icon{font-size:48px;margin-bottom:16px;display:block}.empty-title{font-size:16px;font-weight:600;margin-bottom:8px;color:var(--text-primary)}.empty-subtitle{font-size:14px;color:var(--text-secondary)}:root{--primary-color: #FFA500;--primary-gradient: linear-gradient(135deg, #FFA500 0%, #FF9800 100%);--secondary-color: #03A9F4;--secondary-gradient: linear-gradient(180deg, #03A9F4 0%, #0288D1 100%);--success-color: #4CAF50;--danger-color: #E91E63;--bg-color: #FFFFFF;--bg-secondary: #F5F7FA;--card-bg: #FFFFFF;--text-primary: #333333;--text-secondary: #757575;--border-color: rgba(0, 0, 0, .1);--card-shadow: 0 4px 12px rgba(0, 0, 0, .05);--input-bg: #FFFFFF;--primary-color-alpha: rgba(255, 165, 0, .5);--nav-bg: #FFFFFF;--nav-border: rgba(0, 0, 0, .05)}[data-theme=dark]{--bg-color: #0d1117;--bg-secondary: #0a0e14;--card-bg: #161b22;--text-primary: #f0f6fc;--text-secondary: #8b949e;--border-color: rgba(240, 246, 252, .1);--card-shadow: 0 4px 12px rgba(0, 0, 0, .3);--input-bg: #0d1117;--primary-color-alpha: rgba(255, 165, 0, .3);--nav-bg: rgba(22, 27, 34, .95);--nav-border: rgba(240, 246, 252, .1)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}#root{width:100%;min-height:100vh;margin:0;padding:0}html,body{margin:0;padding:0;width:100%;min-height:100vh;background-color:var(--bg-secondary);color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow-x:hidden;padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.buy-card-container{min-height:100vh;background-color:var(--bg-color);color:var(--text-primary);padding:20px 20px 40px;padding-top:calc(20px + env(safe-area-inset-top));max-width:100%;margin:0 auto;font-family:inherit;display:flex;flex-direction:column;position:relative;z-index:1}.buy-card-container:before{content:"";position:absolute;top:0;left:0;width:100%;height:180px;background:var(--secondary-gradient);z-index:-1;border-bottom-left-radius:30px;border-bottom-right-radius:30px;box-shadow:0 4px 20px #03a9f433}.buy-card-header{display:flex;align-items:center;gap:16px;margin-bottom:24px}.header-title{font-size:20px;font-weight:700;margin:0;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.1)}.btn-back{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .2s}.btn-back:hover{background:#ffffff4d}.buy-card-content{background:var(--card-bg);border-radius:24px;padding:24px;box-shadow:var(--card-shadow);flex:1;display:flex;flex-direction:column;border:1px solid var(--border-color)}.card-type-label{color:var(--text-secondary);font-size:13px;margin-bottom:8px;font-weight:500}.form-group{margin-bottom:24px}.form-group label{display:block;color:var(--text-secondary);font-size:14px;margin-bottom:8px;font-weight:600}.dropdown-container{position:relative}.dropdown-trigger{width:100%;background:var(--card-bg);border:1px solid var(--border-color);border-radius:14px;padding:14px 16px;color:var(--text-primary);font-size:15px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .2s;font-weight:500}.dropdown-trigger:hover{border-color:var(--primary-color);background:var(--bg-secondary)}.dropdown-trigger:focus{border-color:var(--primary-color);box-shadow:0 0 0 2px #ff98001a;outline:none}.dropdown-menu{position:absolute;top:100%;left:0;right:0;background:var(--card-bg);border:1px solid var(--border-color);border-radius:14px;margin-top:8px;z-index:100;overflow:hidden;box-shadow:0 10px 40px #0000001a}.dropdown-item{padding:14px 16px;cursor:pointer;display:flex;flex-direction:column;gap:4px;border-bottom:1px solid var(--border-color);transition:background .2s}.dropdown-item:last-child{border-bottom:none}.dropdown-item:hover{background:var(--bg-secondary);opacity:.8}.dropdown-item.active{background:var(--bg-secondary);border-left:3px solid var(--primary-color)}.dropdown-item-name{font-size:14px;font-weight:600;color:var(--text-primary)}.dropdown-item-info{font-size:12px;color:var(--text-secondary)}.rounds-display{display:flex;gap:10px}.round-btn{background:var(--card-bg);border:1px solid var(--border-color);border-radius:14px;padding:16px 20px;display:flex;flex-direction:column;align-items:center;cursor:pointer;transition:all .2s;min-width:100px}.round-btn:hover{border-color:var(--primary-color-alpha);background:var(--bg-secondary)}.round-btn.active{background:var(--bg-secondary);border-color:var(--primary-color);box-shadow:0 4px 12px #ff980026}.round-val{font-size:24px;font-weight:800;color:var(--text-primary);margin-bottom:4px}.round-btn.active .round-val{color:var(--primary-color)}.round-label{font-size:11px;color:var(--text-secondary);text-transform:uppercase;font-weight:600;letter-spacing:.5px}.round-btn.active .round-label{color:var(--primary-color)}.expiry-hint{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--secondary-color);margin-top:12px;padding:10px 14px;background:#03a9f41a;border-radius:10px;width:fit-content;font-weight:500}.quantity-selector{display:flex;align-items:center;gap:15px;background:var(--bg-secondary);padding:6px;border-radius:14px;border:1px solid transparent;width:fit-content}.quantity-selector button{width:32px;height:32px;border-radius:10px;border:none;background:var(--card-bg);color:var(--text-primary);cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000000d;transition:all .2s}.quantity-selector button:hover{transform:translateY(-1px);box-shadow:0 4px 8px #0000001a}.quantity-selector span{font-size:16px;font-weight:700;min-width:30px;text-align:center;color:var(--text-primary)}.order-summary{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:20px;padding:24px;margin-top:24px}.summary-title{font-size:16px;font-weight:700;color:var(--text-primary);margin:0 0 16px}.summary-row{display:flex;justify-content:space-between;font-size:14px;color:var(--text-secondary);margin-bottom:12px}.summary-row span:last-child{font-weight:600;color:var(--text-primary)}.summary-divider{height:1px;background:var(--border-color);margin:16px 0}.total-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.total-row span:first-child{font-size:16px;font-weight:600;color:var(--text-primary)}.total-amount{font-size:28px;font-weight:800;color:var(--primary-color)}.btn-confirm{width:100%;background:var(--primary-gradient);border:none;border-radius:16px;padding:18px;color:#fff;font-size:16px;font-weight:700;cursor:pointer;margin-top:8px;box-shadow:0 8px 20px #ff98004d;transition:all .2s}.btn-confirm:hover{transform:translateY(-2px);box-shadow:0 10px 25px #ff980066}.btn-confirm:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none;background:#ccc}.error-state{text-align:center;padding:40px 20px;color:var(--danger-color)}.error-message{color:var(--danger-color);font-size:13px;margin-bottom:16px;padding:12px;background:#fef2f2;border-radius:12px;text-align:center;border:1px solid #FEE2E2;font-weight:500}.loading-state .loading-spinner{width:40px;height:40px;border:3px solid rgba(0,0,0,.1);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}.card-preview-section{margin-bottom:24px}.card-preview-section label{display:block;color:var(--text-secondary);font-size:14px;margin-bottom:12px;font-weight:600}.preview-card{max-width:100%;margin:0 auto;pointer-events:none}.profile-page{background-color:transparent;min-height:100vh;color:var(--text-primary);padding-bottom:90px;padding-top:calc(20px + env(safe-area-inset-top));position:relative;z-index:1}.profile-page:before{content:"";position:absolute;top:0;left:0;width:100%;height:250px;background:var(--secondary-gradient);z-index:-1;border-bottom-left-radius:40px;border-bottom-right-radius:40px;box-shadow:0 4px 20px #03a9f433}.profile-header{display:flex;align-items:center;padding:20px;gap:15px;position:relative}.header-icon{width:40px;height:40px;background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.3)}.profile-header h1{font-size:20px;font-weight:700;margin:0;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.1)}.header-actions{margin-left:auto;display:flex;gap:8px}.lang-btn,.theme-toggle-btn{width:40px;height:40px;border-radius:12px;background:#fff3;border:1px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .2s;font-size:14px;font-weight:700}.lang-btn:hover,.theme-toggle-btn:hover{background:#ffffff4d}.theme-toggle-btn{font-size:20px}.profile-content{padding:0 20px}.user-section{display:flex;flex-direction:column;align-items:center;margin-bottom:24px}.avatar-container{position:relative;margin-bottom:20px}.avatar{width:100px;height:100px;border-radius:50%;background:var(--card-bg);border:4px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px #0000001a}.avatar-image{width:100px;height:100px;border-radius:50%;border:4px solid rgba(255,255,255,.5);object-fit:cover;box-shadow:0 8px 20px #0000001a;background:var(--card-bg)}.user-info{text-align:center;background:var(--card-bg);padding:16px 30px;border-radius:20px;box-shadow:var(--card-shadow);min-width:200px;border:1px solid var(--border-color)}.user-info h2{font-size:18px;font-weight:700;margin:0 0 4px;color:var(--text-primary)}.user-info p{font-size:13px;color:var(--text-secondary);margin:0}.btn-logout{display:inline-flex;align-items:center;gap:8px;background:#fef2f2;color:#ef4444;border:1px solid #FEE2E2;border-radius:12px;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:12px}[data-theme=dark] .btn-logout{background:#ef444426;border-color:#ef444433;color:#f87171}.btn-logout:hover{transform:translateY(-1px)}.loyalty-card{background:linear-gradient(135deg,#ff9800,#f57c00);border-radius:20px;padding:24px;margin-bottom:24px;position:relative;overflow:hidden;color:#fff;box-shadow:0 8px 20px #ff980040}.loyalty-card:before{content:"";position:absolute;top:-50%;right:-20%;width:200px;height:200px;background:#ffffff1a;border-radius:50%}.loyalty-header{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:14px;font-weight:600;opacity:.9}.points-display{margin-bottom:24px}.points-display .points{font-size:48px;font-weight:800;margin-right:8px;text-shadow:0 2px 4px rgba(0,0,0,.1)}.points-display .unit{font-size:18px;opacity:.9;font-weight:500}.progress-section{color:#fff}.progress-labels{display:flex;justify-content:space-between;font-size:12px;margin-bottom:6px;font-weight:500;opacity:.9}.progress-bar{height:8px;background:#0000001a;border-radius:4px;margin-bottom:8px;overflow:hidden}.progress-fill{height:100%;background:#fff;border-radius:4px;box-shadow:0 0 10px #ffffff80}.helper-text{font-size:11px;text-align:center;opacity:.8;margin:0}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}.stat-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:16px;padding:20px;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:var(--card-shadow);transition:transform .2s}.stat-card:hover{transform:translateY(-2px);box-shadow:0 8px 16px #0000000f}.stat-icon{width:44px;height:44px;border-radius:12px;background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;margin-bottom:12px;color:var(--primary-color)}.stat-label{font-size:12px;color:var(--text-secondary);margin-bottom:4px;font-weight:500}.stat-value{font-size:18px;font-weight:700;color:var(--text-primary)}.member-points-section h3{font-size:18px;margin:0 0 16px;color:var(--text-primary);font-weight:700}.member-point-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:20px;padding:20px;box-shadow:var(--card-shadow);transition:transform .2s}.card-header{display:flex;align-items:center;gap:16px;margin-bottom:20px}.point-icon{width:48px;height:48px;background:var(--bg-secondary);border-radius:14px;display:flex;align-items:center;justify-content:center}.point-details{display:flex;flex-direction:column}.point-name{font-weight:700;font-size:16px;color:var(--text-primary)}.point-type{font-size:12px;color:var(--text-secondary);margin-top:2px}.card-footer{display:flex;justify-content:space-between;align-items:flex-end;padding-top:16px;border-top:1px dashed var(--border-color)}.balance-info,.expiry-info{display:flex;flex-direction:column;gap:2px}.balance-info .label,.expiry-info .label{font-size:12px;color:var(--text-secondary);font-weight:500}.balance-info .amount{font-size:20px;font-weight:800;color:var(--text-primary)}.expiry-info .date{font-size:14px;font-weight:600;color:var(--text-primary)}.expiry-info{text-align:right}.expiry-info .label{justify-content:flex-end}.all-cards-section{margin-top:32px}.section-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px;flex-wrap:wrap}.filter-tabs{display:flex;gap:4px;background:var(--bg-secondary);padding:4px;border-radius:12px}.filter-tab{background:transparent;border:none;color:var(--text-secondary);font-size:12px;padding:6px 14px;border-radius:8px;cursor:pointer;transition:all .2s;font-weight:600}.filter-tab:hover{color:var(--primary-color)}.filter-tab.active{background:var(--card-bg);color:var(--primary-color);box-shadow:0 2px 8px #0000000d}.cards-list{display:flex;flex-direction:column;gap:12px;padding-bottom:20px}.card-list-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:var(--card-bg);border-radius:16px;box-shadow:var(--card-shadow);border:1px solid var(--border-color);transition:transform .2s,background-color .2s;cursor:pointer}.card-list-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000000f}.card-list-item.expired{opacity:.7;background:var(--bg-secondary)}.card-item-left{display:flex;gap:16px;align-items:center}.card-icon-wrapper{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:#f3e8ff;border:1px solid #E9D5FF;color:#9333ea}.card-icon-wrapper.expired-icon{background:#e5e7eb;border:1px solid #D1D5DB;color:#6b7280}.card-item-info{display:flex;flex-direction:column;gap:2px}.card-item-title{font-size:14px;font-weight:600;color:var(--text-primary)}.card-item-subtitle{font-size:12px;color:var(--text-secondary)}.card-item-right{text-align:right;display:flex;flex-direction:column;gap:4px;align-items:flex-end}.card-item-amount{font-size:15px;font-weight:700;color:var(--text-primary)}.card-status-badge{font-size:10px;padding:2px 8px;border-radius:6px;font-weight:600;text-transform:uppercase}.card-status-badge.active{background:#4caf501a;color:var(--success-color)}.card-status-badge.expired{background:#ef44441a;color:var(--danger-color)}.card-status-badge.new{background:#e91e631a;color:var(--danger-color)}.no-cards-placeholder{text-align:center;padding:40px;color:var(--text-secondary);font-size:14px;border:2px dashed var(--border-color);border-radius:16px;background:var(--bg-secondary)}.loading-container{color:var(--text-secondary);text-align:center;padding:20px}.loading-spinner{border:3px solid rgba(0,0,0,.1);border-top-color:var(--primary-color);width:24px;height:24px;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 10px}.virtual-card{background:var(--card-bg);border-radius:20px;padding:20px;border:1px solid var(--border-color);box-shadow:var(--card-shadow);transition:transform .2s,box-shadow .2s;cursor:pointer}.virtual-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00000014}.virtual-card .card-top{display:flex;align-items:center;gap:16px;margin-bottom:20px}.virtual-card .card-icon-wrapper{width:48px;height:48px;background:var(--bg-secondary);border-radius:14px;display:flex;align-items:center;justify-content:center;border:none;color:inherit}.virtual-card .card-info{display:flex;flex-direction:column;gap:2px}.virtual-card .card-name{font-size:16px;font-weight:700;color:var(--text-primary)}.virtual-card .card-type{font-size:12px;color:var(--text-secondary);background:var(--bg-secondary);padding:2px 8px;border-radius:4px;align-self:flex-start}.virtual-card .card-bottom{display:flex;justify-content:space-between;align-items:flex-end;padding-top:16px;border-top:1px dashed var(--border-color)}.virtual-card .card-balance,.virtual-card .card-expires{display:flex;flex-direction:column}.virtual-card .card-balance-label,.virtual-card .card-expires-label{font-size:12px;color:var(--text-secondary);margin-bottom:4px;font-weight:500}.virtual-card .card-balance-value{font-size:20px;font-weight:800;color:var(--text-primary)}.virtual-card .card-expires-value{font-size:14px;font-weight:600;color:var(--text-primary)}.virtual-card .card-expires{text-align:right}.virtual-card.money-card{border-left:4px solid var(--success-color)}.virtual-card.money-card:hover{box-shadow:0 8px 24px #4caf5026}.virtual-card.money-card .card-balance-value{color:var(--success-color)}.virtual-card.round-card{border-left:4px solid var(--secondary-color)}.virtual-card.round-card .card-balance-value{color:var(--secondary-color)}.virtual-card.expired{opacity:.8;filter:grayscale(1)}.virtual-card .new-badge{background:var(--danger-color);color:#fff;font-size:10px;font-weight:700;padding:4px 10px;border-radius:12px;text-transform:uppercase;letter-spacing:.5px;margin-left:auto;box-shadow:0 2px 8px #e91e634d;animation:pulse-new 2s ease-in-out infinite}@keyframes pulse-new{0%,to{box-shadow:0 2px 8px #e91e634d}50%{box-shadow:0 2px 16px #e91e6380}}.register-container{padding:24px;height:100vh;display:flex;flex-direction:column;justify-content:center;background:transparent;position:relative;z-index:1}.register-container:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--bg-primary);z-index:-1}.register-header{text-align:center;margin-bottom:40px}.register-header h1{font-size:32px;font-weight:800;color:var(--text-primary);margin-bottom:8px;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.register-header p{color:var(--text-secondary);font-size:16px}.register-form{display:flex;flex-direction:column;gap:24px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:600;color:var(--text-secondary)}.form-input{padding:14px 16px;border-radius:12px;border:1px solid var(--border-color);background:var(--card-bg);color:var(--text-primary);font-size:16px;outline:none;transition:border-color .2s}.form-input:focus{border-color:var(--primary-color)}.btn-submit{margin-top:16px;padding:16px;border-radius:14px;background:var(--primary-gradient);color:#fff;font-size:16px;font-weight:700;border:none;cursor:pointer;box-shadow:0 4px 15px #ffa5004d;transition:transform .2s}.btn-submit:active{transform:scale(.98)}.btn-submit:disabled{opacity:.7;cursor:not-allowed}.error-message{color:var(--danger-color);text-align:center;font-size:14px;background:#e91e631a;padding:10px;border-radius:8px}.yourcard-container{min-height:100vh;background-color:var(--bg-color);padding:20px 20px 100px;padding-top:calc(20px + env(safe-area-inset-top))}.yourcard-header{margin-bottom:24px}.yourcard-header h1{font-size:24px;font-weight:800;color:var(--text-primary);margin:0}.card-slider-section{margin-bottom:32px}.card-slider{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:8px 0}.card-slider::-webkit-scrollbar{display:none}.slider-card-wrapper{flex:0 0 90%;scroll-snap-align:center;transition:transform .3s ease,opacity .3s ease;opacity:.6;transform:scale(.95)}.slider-card-wrapper.active{opacity:1;transform:scale(1)}.slider-card-wrapper .authentic-card{cursor:pointer}.slider-indicators{display:flex;justify-content:center;gap:8px;margin-top:16px}.indicator-dot{width:8px;height:8px;border-radius:50%;background:var(--border-color);border:none;padding:0;cursor:pointer;transition:all .3s ease}.indicator-dot.active{width:24px;border-radius:4px;background:var(--primary-color)}.card-details-section{display:flex;flex-direction:column;gap:12px}.detail-card{background:var(--card-bg);border-radius:16px;padding:16px;display:flex;align-items:center;gap:16px;box-shadow:var(--card-shadow);border:1px solid var(--border-color);transition:transform .2s ease}.detail-card:active{transform:scale(.98)}.qr-card{flex-direction:column;align-items:center;padding:24px}.qr-code-placeholder{width:150px;height:150px;display:flex;align-items:center;justify-content:center;margin-bottom:12px}.qr-label{font-size:14px;font-weight:600;color:var(--text-secondary);margin:0}.detail-icon{width:48px;height:48px;border-radius:12px;background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;color:var(--primary-color);flex-shrink:0}.detail-content{flex:1;display:flex;flex-direction:column;gap:4px}.detail-label{font-size:13px;font-weight:600;color:var(--text-secondary)}.detail-value{font-size:16px;font-weight:700;color:var(--text-primary)}.detail-subtitle{font-size:12px;color:var(--text-secondary);margin-top:2px}.toggle-card{justify-content:space-between}.toggle-switch{position:relative;display:inline-block;width:50px;height:28px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.3s;border-radius:28px}.toggle-slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;transition:.3s;border-radius:50%}.toggle-switch input:checked+.toggle-slider{background-color:var(--primary-color)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(22px)}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:16px;color:var(--text-secondary)}.loading-spinner{width:40px;height:40px;border:3px solid rgba(0,0,0,.1);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:60px 20px;color:var(--text-secondary)}@media(max-width:380px){.slider-card-wrapper{flex:0 0 95%}}