body{margin:0;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}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{--primary-color: #4a6fa5;--primary-dark: #3a5a8c;--secondary-color: #6c757d;--success-color: #28a745;--danger-color: #dc3545;--light-color: #f8f9fa;--dark-color: #343a40;--border-color: #dee2e6;--border-radius: 4px;--box-shadow: 0 2px 5px rgba(0, 0, 0, .1);--header-height: 60px;--footer-height: 80px;--container-padding: 15px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:var(--dark-color);background-color:#f5f7fa;-webkit-overflow-scrolling:touch}.app{min-height:100vh}.btn-primary,.btn-secondary,.btn-logout{padding:10px 15px;border:none;border-radius:var(--border-radius);cursor:pointer;font-weight:500;transition:all .3s ease}.btn-primary{background-color:var(--primary-color);color:#fff}.btn-primary:hover{background-color:var(--primary-dark)}.btn-primary:disabled{background-color:var(--secondary-color);cursor:not-allowed}.btn-secondary{background-color:var(--secondary-color);color:#fff}.btn-secondary:hover{background-color:#5a6268}.btn-logout{background-color:transparent;color:var(--secondary-color);padding:5px 10px}.btn-logout:hover{color:var(--danger-color)}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;font-weight:500}.form-group input,.form-group textarea{width:100%;padding:10px;border:1px solid var(--border-color);border-radius:var(--border-radius);font-size:16px}.form-group textarea{min-height:100px;resize:vertical}.form-actions{display:flex;justify-content:space-between;margin-top:30px}.error-message{color:var(--danger-color);margin-bottom:15px;padding:10px;background-color:#dc35451a;border-radius:var(--border-radius)}.error-card{background-color:#fff;border-radius:12px;padding:40px 30px;max-width:500px;margin:40px auto;box-shadow:0 4px 12px #0000001a;text-align:center;animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.error-icon{display:flex;justify-content:center;margin-bottom:20px;animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.error-title{color:var(--danger-color);font-size:1.5rem;font-weight:600;margin-bottom:15px}.error-description{color:var(--secondary-color);font-size:1rem;line-height:1.6;margin-bottom:25px}.error-actions{display:flex;justify-content:center;gap:10px}.error-actions .btn-primary{padding:12px 24px;font-size:1rem}@media (max-width: 768px){.error-card{padding:30px 20px;margin:20px}.error-title{font-size:1.3rem}.error-description{font-size:.95rem}}.success-message{color:var(--success-color);margin-top:15px;padding:10px;background-color:#28a7451a;border-radius:var(--border-radius);text-align:center}.loading{display:flex;justify-content:center;align-items:center;height:100vh;font-size:18px;color:var(--primary-color)}.auth-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px;background-color:#f5f7fa}.auth-card{width:100%;max-width:400px;padding:30px;background-color:#fff;border-radius:8px;box-shadow:var(--box-shadow)}.auth-card h2{margin-bottom:20px;text-align:center;color:var(--primary-color)}.auth-link{margin-top:20px;text-align:center}.auth-link a{color:var(--primary-color);text-decoration:none}.auth-link a:hover{text-decoration:underline}.auth-logo-container{display:flex;justify-content:center;margin-bottom:30px}.auth-logo{width:120px;height:auto}.dashboard-header{background-color:#fff;padding:15px 30px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 1px 3px #0000001a}.dashboard-header h1{color:var(--primary-color);font-size:24px}.user-info{display:flex;align-items:center;gap:15px}.dashboard-content{padding:var(--container-padding);background-color:#f5f7fa;min-height:calc(100vh - var(--header-height) - var(--footer-height))}.welcome-section{background-color:#fff;border-radius:10px;padding:20px;margin-bottom:20px;box-shadow:0 2px 8px #0000000d}.welcome-section h1{color:var(--primary-color);font-size:1.5rem;margin-bottom:5px}.user-email{color:var(--secondary-color);font-size:.9rem}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid var(--border-color)}.section-header h2{font-size:1.3rem;color:var(--dark-color);margin:0}.templates-section{margin-bottom:40px}.template-card{background-color:#fff;border-radius:10px;padding:15px;box-shadow:0 2px 8px #0000000d;transition:transform .2s,box-shadow .2s;cursor:pointer;border:2px solid transparent}.template-card:hover{box-shadow:0 4px 12px #0000001a}.template-card.selected{border-color:var(--primary-color);background-color:#4a6fa50d}.template-card h3{font-size:1.1rem;margin-bottom:10px;color:var(--primary-color)}.template-details-row{display:flex;justify-content:space-between;margin-bottom:12px;font-size:.9rem}.template-reward{color:var(--success-color);font-weight:500}.template-punches{color:var(--secondary-color)}.template-actions{display:flex;justify-content:flex-end}.btn-sm{padding:5px 10px;font-size:.8rem}.no-templates{background-color:#fff;border-radius:10px;padding:30px;text-align:center;box-shadow:0 2px 8px #0000000d}.no-templates p{margin-bottom:20px;color:var(--secondary-color)}.selected-template-section{background-color:#fff;border-radius:10px;padding:20px;margin-top:20px;box-shadow:0 2px 8px #0000000d}.qr-section{display:flex;flex-direction:column;align-items:center;margin-bottom:20px;padding:15px;background-color:#f8f9fa;border-radius:8px}.qr-code-container{margin-bottom:15px;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a}.download-qr{margin-top:10px}.stats-section{margin-bottom:20px}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat-card{background-color:#f8f9fa;border-radius:8px;padding:15px;text-align:center;box-shadow:0 1px 3px #0000000d}.stat-value{font-size:1.5rem;font-weight:700;color:var(--primary-color);display:block;margin-bottom:5px}.stat-label{font-size:.8rem;color:var(--secondary-color)}.mobile-punch-cards{margin-top:20px}.mobile-punch-card{background-color:#f8f9fa;border-radius:8px;padding:15px;margin-bottom:10px;box-shadow:0 1px 3px #0000000d}.mobile-punch-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.mobile-punch-code{font-weight:500;font-size:.9rem}.mobile-punch-details{display:flex;justify-content:space-between;font-size:.8rem;color:var(--secondary-color)}.status{padding:3px 8px;border-radius:12px;font-size:.7rem;font-weight:500}.status.active{background-color:#28a7451a;color:var(--success-color)}.status.redeemed{background-color:#6c757d1a;color:var(--secondary-color)}#create-template-button{display:flex;align-items:center;justify-content:center;font-weight:500;padding:5px 15px 8px}.app-header{display:flex;justify-content:space-between;align-items:center;background-color:#fff;padding:0 var(--container-padding);height:var(--header-height);box-shadow:0 2px 4px #0000000d;position:sticky;top:0;z-index:100}.logo-container{display:flex;align-items:center}.app-name{font-size:1.5rem;font-weight:700;color:var(--primary-color);text-decoration:none}.header-nav{position:relative;display:flex;align-items:center}.mobile-menu-button{width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;transition:background-color .2s;z-index:101}.mobile-menu-button:hover{background-color:#0000000d}.menu-icon{width:20px;height:2px;background-color:var(--dark-color);position:relative;transition:background-color .3s}.menu-icon:before,.menu-icon:after{content:"";position:absolute;width:20px;height:2px;background-color:var(--dark-color);transition:transform .3s}.menu-icon:before{top:-6px}.menu-icon:after{bottom:-6px}.header-actions{display:none}.header-actions.menu-open{display:block;position:absolute;top:var(--header-height);right:0;background-color:#fff;box-shadow:0 4px 6px #0000001a;border-radius:0 0 4px 4px;padding:10px;z-index:100;min-width:150px}.btn-logout{display:block;width:100%;text-align:center;padding:10px 15px;color:var(--danger-color);background-color:transparent;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s}.btn-logout:hover{background-color:#dc35451a}@media (min-width: 768px){.app-name{font-size:1.8rem}.mobile-menu-button{display:none}.header-actions{display:block;position:static;box-shadow:none;padding:0}.btn-logout{padding:8px 15px}}.dashboard-container{min-height:100vh;display:flex;flex-direction:column}.dashboard-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.auth-container,.form-container,.punch-card-container{padding-top:20px}.app-footer{background-color:#fff;border-top:1px solid var(--border-color);padding:20px;margin-top:auto}.footer-content{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:15px}.footer-links{display:flex;gap:20px}.footer-link{color:var(--primary-color);text-decoration:none;font-weight:500}.footer-link:hover{text-decoration:underline}.footer-copyright{color:var(--secondary-color);font-size:14px}.inactive-merchant-container{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 140px);padding:20px}.inactive-merchant-message{background-color:#fff;border-radius:8px;box-shadow:var(--box-shadow);padding:30px;max-width:500px;text-align:center}.inactive-merchant-message h2{color:var(--danger-color);margin-bottom:15px}.inactive-merchant-message p{margin-bottom:15px}.inactive-merchant-message .btn-primary{margin-top:10px}.page-container{display:flex;flex-direction:column;min-height:100vh}.content-container{flex:1;padding:30px;max-width:1200px;margin:0 auto;width:100%}.contact-container,.feedback-container{background-color:#fff;border-radius:8px;box-shadow:var(--box-shadow);padding:30px;max-width:600px;margin:0 auto}.contact-intro,.feedback-intro{margin-bottom:20px}.contact-form,.feedback-form{display:flex;flex-direction:column;gap:20px}.rating-container{display:flex;gap:10px;margin-top:10px}.star-button{background:none;border:none;font-size:30px;color:#ccc;cursor:pointer}.star-button.active{color:#ffc107}.dashboard-container,.auth-container,.form-container,.punch-card-container{min-height:100vh;display:flex;flex-direction:column}.direct-contact-info{display:flex;flex-wrap:wrap;gap:30px;margin:25px 0;justify-content:center}.contact-method{text-align:center;padding:15px;background-color:#f8f9fa;border-radius:8px;min-width:200px}.contact-method h3{margin-bottom:10px;color:var(--primary-color)}.contact-method a{color:var(--dark-color);text-decoration:none;font-size:16px;display:block}.contact-method a:hover{color:var(--primary-color);text-decoration:underline}.contact-divider{position:relative;text-align:center;margin:30px 0}.contact-divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background-color:var(--border-color)}.contact-divider span{position:relative;background-color:#fff;padding:0 15px;color:var(--secondary-color);font-size:14px}.content-container{padding:var(--container-padding);width:100%;max-width:100%}h1{font-size:1.8rem;margin-bottom:1rem}h2{font-size:1.5rem;margin-bottom:.8rem}h3{font-size:1.2rem;margin-bottom:.6rem}.app-header{height:var(--header-height);padding:0 var(--container-padding)}.app-name{font-size:1.5rem}.dashboard-content{padding:var(--container-padding)}.dashboard-title h1{font-size:1.5rem}.user-email{display:block;margin-top:5px}.templates-grid{display:grid;grid-template-columns:1fr;gap:15px}.template-card{width:100%}.stats-grid{grid-template-columns:repeat(3,1fr);gap:10px}.stat-card{padding:10px}.stat-value{font-size:1.2rem}.punch-cards-table{display:block;overflow-x:auto;white-space:nowrap;font-size:.9rem}.auth-card{width:100%;max-width:100%;padding:20px}.contact-container,.feedback-container{padding:20px}.direct-contact-info{flex-direction:column;gap:15px}.contact-method{width:100%}.app-footer{padding:15px}.footer-links{gap:15px}.inactive-merchant-message{padding:20px;max-width:100%}@media (min-width: 576px){.content-container{padding:20px}.templates-grid{grid-template-columns:repeat(2,1fr)}.auth-card{max-width:450px;padding:30px}.contact-container,.feedback-container{padding:30px;max-width:500px}.direct-contact-info{flex-direction:row}}@media (min-width: 768px){h1{font-size:2rem}h2{font-size:1.7rem}h3{font-size:1.4rem}.dashboard-title{display:flex;align-items:center;justify-content:space-between}.user-email{display:inline;margin-top:0}.templates-grid{grid-template-columns:repeat(3,1fr)}.content-container{max-width:720px;margin:0 auto}}@media (min-width: 992px){.content-container{max-width:960px}.templates-grid{grid-template-columns:repeat(4,1fr)}.contact-container,.feedback-container{max-width:600px}}@media (min-width: 1200px){.content-container{max-width:1140px}}.btn-primary,.btn-secondary,.btn-logout{min-height:44px;padding:10px 20px}input,textarea,select,button{font-size:16px}.form-group input,.form-group textarea{padding:12px}.star-button{font-size:35px;padding:5px}.qr-section{display:flex;flex-direction:column;align-items:center}.page-container{min-height:100vh;min-height:-webkit-fill-available}.punch-card-container{padding:var(--container-padding);background-color:#f5f7fa;min-height:calc(100vh - var(--header-height) - var(--footer-height));display:flex;justify-content:center;align-items:flex-start;padding-top:20px}.punch-card{background-color:#fff;border-radius:12px;box-shadow:0 4px 15px #00000014;padding:25px;width:100%;max-width:500px;margin:0 auto}.punch-card-header{text-align:center;margin-bottom:25px;padding-bottom:15px;border-bottom:1px solid var(--border-color)}.punch-card-header h1{color:var(--primary-color);font-size:1.5rem;margin-bottom:10px}.reward-description{color:var(--secondary-color);font-size:.95rem}.reward-label{font-weight:600;color:var(--dark-color)}.punch-progress{margin-bottom:20px}.progress-bar{height:10px;background-color:#e9ecef;border-radius:5px;overflow:hidden;margin-bottom:5px}.progress-fill{height:100%;background-color:var(--primary-color);border-radius:5px;transition:width .3s ease}.progress-text{text-align:right;font-size:.85rem;color:var(--secondary-color)}.punch-grid-container{margin-bottom:25px}.punch-grid{display:grid;gap:10px;margin-top:15px}.punch-slot{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background-color:#f8f9fa;border-radius:8px;font-size:1.2rem;font-weight:600;color:var(--secondary-color);border:1px dashed var(--border-color);transition:all .2s ease}.punch-slot.punched{background-color:#4a6fa51a;border:1px solid var(--primary-color);color:var(--primary-color)}.punch-icon{font-size:1.4rem;color:var(--primary-color)}.punch-number{font-size:1.1rem}.punch-actions{display:flex;flex-direction:column;gap:10px;margin-top:20px}.punch-button,.email-button{width:100%;padding:12px;font-size:1rem}.email-form{margin-top:20px;padding:15px;background-color:#f8f9fa;border-radius:8px}.email-form p{margin-bottom:15px;text-align:center;color:var(--secondary-color);font-size:.9rem}.email-form .form-group{margin-bottom:15px}.email-form input{width:100%;padding:10px}.email-form button{width:100%}.redeemed-message,.completed-message{margin-top:20px;padding:15px;border-radius:8px;text-align:center;font-weight:500}.redeemed-message{background-color:#6c757d1a;color:var(--secondary-color)}.completed-message{background-color:#28a7451a;color:var(--success-color)}.success-message{margin-top:15px;padding:10px;background-color:#28a7451a;color:var(--success-color);border-radius:5px;text-align:center;animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (min-width: 576px){.punch-card{padding:30px}.punch-card-header h1{font-size:1.8rem}.punch-actions{flex-direction:row}.punch-button,.email-button{flex:1}}.qr-code-container{margin:20px 0;display:flex;flex-direction:column;align-items:center;padding:20px;background-color:#f8f9fa;border-radius:8px;border:1px dashed var(--border-color)}.qr-code-text{margin-bottom:15px;text-align:center;color:var(--secondary-color);font-size:.95rem}.qr-code{padding:15px;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a}.assign-button{width:100%;padding:12px;font-size:1rem;background-color:var(--primary-color)}.redeem-button{width:100%;padding:12px;font-size:1rem;background-color:var(--success-color)}.redeem-button:hover{background-color:#218838}.template-form-container{max-width:600px;margin:0 auto;padding:20px}.template-form-container h1{color:var(--primary-color);margin-bottom:20px;text-align:center}.template-form-card{background-color:#fff;border-radius:10px;box-shadow:0 4px 10px #00000014;padding:25px;margin-bottom:30px}.punch-input-container{display:flex;flex-direction:column;gap:10px}.punch-slider{width:100%;height:8px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e9ecef;outline:none;border-radius:4px}.punch-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--primary-color);cursor:pointer;transition:background .2s}.punch-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--primary-color);cursor:pointer;transition:background .2s}.punch-slider::-webkit-slider-thumb:hover{background:var(--primary-dark)}.punch-slider::-moz-range-thumb:hover{background:var(--primary-dark)}.punch-value-display{display:flex;align-items:center;gap:10px}.punch-value-display input{width:60px;text-align:center;padding:8px;border:1px solid var(--border-color);border-radius:4px}.punch-label{color:var(--secondary-color)}.template-preview{margin-top:30px;margin-bottom:30px}.template-preview h3{color:var(--secondary-color);font-size:1.1rem;margin-bottom:15px;text-align:center}.preview-card{background-color:#f8f9fa;border-radius:8px;padding:20px;box-shadow:0 2px 5px #0000000d}.preview-header{margin-bottom:20px;text-align:center}.preview-header h4{color:var(--primary-color);margin-bottom:8px;font-size:1.2rem}.preview-reward{color:var(--secondary-color);font-size:.9rem}.preview-punches{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:10px;justify-content:center}.preview-punch-slot{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background-color:#fff;border-radius:50%;font-size:1.2rem;color:var(--primary-color);border:1px dashed var(--border-color);transition:all .2s ease}.preview-punch-slot:first-child{background-color:#4a6fa51a;border:1px solid var(--primary-color)}.form-actions{display:flex;justify-content:space-between;gap:15px;margin-top:20px}.form-actions button{flex:1;padding:12px}@media (min-width: 768px){.template-form-card{padding:30px}.punch-input-container{flex-direction:row;align-items:center}.punch-slider{flex:1}.preview-punches{grid-template-columns:repeat(auto-fill,minmax(50px,1fr))}}