@import "https://fonts.googleapis.com/css2?family=Yomogi&family=Inter:wght@400;500;600;800&display=swap";:root{--base-bg:#fde6d8;--accent-color:#3b2f2f;--primary-btn:#4a3b32;--primary-btn-hover:#3b2f2f;--reach-color:#e67e22;--bingo-color:#e74c3c;--card-bg:#fff;--text-main:#3b2f2f;--base-font-size:1.1rem;--small-font-size:.85rem}body{background-color:var(--base-bg);color:var(--text-main);-webkit-font-smoothing:antialiased;justify-content:center;align-items:center;min-height:100vh;margin:0;padding:0;font-family:Inter,Helvetica Neue,Arial,sans-serif;display:flex}.app-layout{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:500px;min-height:100vh;padding:2rem 1rem;display:flex}.fade-in{animation:.4s ease-out forwards fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}h1,h2,h3,.yomogi-text{font-family:Yomogi,cursive}.title-logo{text-align:center;color:var(--accent-color);margin-bottom:2rem;font-size:1.8rem;font-weight:700;line-height:1.4}.subtitle{color:#665b5b;margin-bottom:.2rem;font-family:Inter,sans-serif;font-size:.9rem;font-weight:600;display:block}.login-card{background-color:var(--card-bg);box-sizing:border-box;border-radius:12px;width:100%;margin-bottom:1.5rem;padding:2rem;box-shadow:0 10px 30px #3b2f2f14}.input-group{flex-direction:column;margin-bottom:1.5rem;display:flex}.input-group label{color:var(--text-main);margin-bottom:.5rem;font-size:.9rem;font-weight:600}.input-group input{border:1.5px solid #d3c4bc;border-radius:8px;outline:none;padding:.8rem 1rem;font-family:Inter,sans-serif;font-size:1rem;transition:all .2s}.input-group input:focus{border-color:var(--accent-color);box-shadow:0 0 0 3px #3b2f2f1a}button{cursor:pointer;border:none;border-radius:8px;width:100%;padding:.9rem 1.2rem;font-family:Inter,sans-serif;font-size:1rem;font-weight:600;transition:all .2s}.primary-button{background-color:var(--primary-btn);color:#fff;box-shadow:0 4px 6px #4a3b3233}.primary-button:hover{background-color:var(--primary-btn-hover);transform:translateY(-1px);box-shadow:0 6px 12px #4a3b3240}.secondary-button{color:var(--accent-color);background-color:#f7ede8;border:1px solid #d3c4bc}.secondary-button:hover{background-color:#f0e2da}.text-button{color:#8c7d7d;background:0 0;padding:.5rem;font-weight:500;text-decoration:underline}.text-button:hover{color:var(--accent-color)}.inline-rules{margin-top:1rem;font-size:.9rem}.divider{text-align:center;color:#a89c9c;align-items:center;margin:1.5rem 0;font-size:.85rem;display:flex}.divider:before,.divider:after{content:"";border-bottom:1px solid #e8ddd6;flex:1}.divider span{padding:0 10px}.font-bold{font-weight:700}.generated-pass-alert{border:1px dashed var(--accent-color);text-align:center;background-color:#fffaf5;border-radius:8px;margin-top:1.5rem;padding:1rem;animation:.3s fadeIn}.highlight-pass{color:var(--reach-color);margin:.5rem 0;font-size:1.4rem;font-weight:700;display:inline-block}.warning-text{color:#d35400;margin-top:.5rem;font-size:.75rem;font-weight:700}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#3b2f2f99;justify-content:center;align-items:center;padding:1rem 1rem 3rem;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal-content{background:#fff;border-radius:12px;width:100%;max-width:400px;max-height:70dvh;padding:1.5rem;overflow-y:auto;box-shadow:0 20px 40px #0000001a}.modal-content h2{color:var(--accent-color);border-bottom:2px solid #f0e2da;margin-top:0;margin-bottom:1.5rem;padding-bottom:.5rem}.rule-section{margin-bottom:1.2rem}.rule-section h3{color:#8c7d7d;margin-bottom:.3rem;font-family:Inter,sans-serif;font-size:.9rem}.rule-section p{margin:0;font-size:.95rem;line-height:1.5}.reward-list{margin:0;padding-left:1.2rem;font-size:.95rem;line-height:1.6}.modal-content .primary-button{margin-top:1.5rem}.bingo-page-container{flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.actions-section{flex-direction:column;align-items:center;width:100%;margin-top:2rem;display:flex}.status-board{gap:20px;height:3rem;margin-bottom:20px;font-family:Yomogi,cursive;font-size:2.5rem;font-weight:700;display:flex}.status-text{opacity:.15;transition:all .3s}#reach-text.active{opacity:1;color:var(--reach-color);animation:1s infinite alternate flash}#bingo-text.active{opacity:1;color:var(--bingo-color);animation:.5s forwards bounce;transform:scale(1.1)}@keyframes flash{0%{opacity:.5;text-shadow:none}to{opacity:1;text-shadow:0 0 10px #f39c1280}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)scale(1.1)}40%{transform:translateY(-10px)scale(1.1)}60%{transform:translateY(-5px)scale(1.1)}}.bingo-container{background-color:var(--card-bg);border-radius:2px 15px 3px 10px/15px 2px 10px 3px;padding:2rem;box-shadow:2px 4px 15px #3b2f2f1a}.bingo-grid{border:4px solid var(--accent-color);border-radius:255px 15px 225px/15px 225px 15px 255px;grid-template-rows:repeat(3,100px);grid-template-columns:repeat(3,100px);gap:0;display:grid}.bingo-cell{text-align:center;font-size:var(--base-font-size);word-break:auto-phrase;box-sizing:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--accent-color);border:1px solid #8c7d7d;border-radius:10px 2px 8px 3px/3px 10px 2px 8px;justify-content:center;align-items:center;padding:4px;font-family:Yomogi,cursive;font-weight:700;line-height:1.2;transition:background-color .2s;display:flex;position:relative}.bingo-cell:hover,.bingo-cell:active{background-color:#fdf6f0}.bingo-cell.small-text{font-size:var(--small-font-size)}.bingo-cell.marked:after{content:"";border:4px solid var(--bingo-color);pointer-events:none;opacity:.85;border-radius:50% 40% 60%/40% 50% 40% 60%;width:80%;height:80%;animation:.2s cubic-bezier(.175,.885,.32,1.275) fadeInScale;position:absolute;top:5%;left:10%;transform:rotate(-10deg)}@keyframes fadeInScale{0%{opacity:0;transform:scale(.5)rotate(-20deg)}to{opacity:.85;transform:scale(1)rotate(-10deg)}}.bingo-cell:nth-child(-n+3){border-top:none}.bingo-cell:nth-child(n+7){border-bottom:none}.bingo-cell:nth-child(3n+1){border-left:none}.bingo-cell:nth-child(3n){border-right:none}.error-message{color:var(--bingo-color);margin-top:-1rem;margin-bottom:1rem;font-size:.85rem;font-weight:700;animation:.2s fadeIn}.access-counter{color:#8c7d7d;text-align:center;letter-spacing:.5px;margin-top:1.5rem;font-family:Inter,sans-serif;font-size:.85rem}.counter-number{color:var(--accent-color);margin:0 4px;font-size:1.05rem;font-weight:700}.reward-container{justify-content:center;width:100%;margin-top:1.5rem;margin-bottom:1rem;display:flex}.reward-button,.luxury-button{text-align:center;box-sizing:border-box;border-radius:50px;width:90%;padding:1rem 1.5rem;font-family:Inter,sans-serif;font-size:1.05rem;font-weight:700;text-decoration:none;animation:2s ease-in-out infinite pulse-light;display:block}.reward-button{color:#fff;background:linear-gradient(135deg,#1aa3ff,#07c);box-shadow:0 5px 15px #07c6}.luxury-button{color:#fff;background:linear-gradient(135deg,gold,#ff8c00,#ff1493);font-size:1.15rem;animation:1.5s infinite pulse-luxury;box-shadow:0 8px 25px #ff8c0080}@keyframes pulse-light{0%{transform:scale(1)}50%{transform:scale(1.03)}to{transform:scale(1)}}@keyframes pulse-luxury{0%{transform:scale(1);box-shadow:0 0 15px #ff8c0066}50%{transform:scale(1.05);box-shadow:0 0 30px #ff1493b3}to{transform:scale(1);box-shadow:0 0 15px #ff8c0066}}.reward-page-wrapper{background-color:var(--base-bg);box-sizing:border-box;justify-content:center;align-items:center;width:100vw;min-height:100vh;padding:1.5rem;display:flex}.theme-luxury{background:linear-gradient(135deg,#1a0b2e,#4b003a)}.reward-card{color:var(--text-main);text-align:center;z-index:10;background:#fff;border-radius:20px;width:100%;max-width:400px;padding:2.5rem 1.5rem;position:relative;box-shadow:0 15px 40px #0000001a}.theme-luxury .reward-card{color:#fde6d8;background:linear-gradient(145deg,#27201c,#3b2f2f);border:2px solid gold;box-shadow:0 0 40px #ffd7004d}.reward-card h1{color:#a87e5b;margin-bottom:.5rem;font-size:1.25rem}.theme-luxury .reward-card h1{color:gold;text-shadow:0 0 10px #ffd70080}.reward-card h2{margin-bottom:1.5rem;font-size:1.7rem;font-weight:800;line-height:1.3}.theme-luxury .reward-card h2{background:linear-gradient(90deg,gold,#ff8c00);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.description{margin-bottom:1.5rem;font-size:.9rem;line-height:1.6}.coupon-box{background:#f7f3ec;border:2px dashed #bba183;border-radius:10px;margin:1.5rem 0;padding:1.5rem 1rem}.theme-luxury .coupon-box{background:#ffd7000d;border:2px dashed gold}.coupon-label{color:#665b5b;margin-bottom:.5rem;font-size:.85rem;display:block}.theme-luxury .coupon-label{color:#e0d0c1}.coupon-code{color:var(--bingo-color);letter-spacing:3px;font-size:2rem;font-weight:800}.theme-luxury .coupon-code{color:gold}.expiry-date{color:#8c7d7d;margin-bottom:2rem;font-size:.9rem;font-weight:700}.theme-luxury .expiry-date{color:#e0d0c1}.shop-link{text-decoration:none;display:block}.theme-luxury .shop-link{color:#1a0b2e;background:linear-gradient(135deg,gold,#ff8c00)}.base-sync-card{background-color:var(--card-bg);box-sizing:border-box;text-align:center;border:2px dashed #d3c4bc;border-radius:12px;width:100%;margin-bottom:2rem;padding:1.5rem;box-shadow:0 5px 15px #3b2f2f0d}.base-sync-card h3{color:var(--accent-color);margin-top:0;margin-bottom:1rem;font-family:Inter,sans-serif;font-size:1rem}.sync-input{box-sizing:border-box;border:1.5px solid #d3c4bc;border-radius:8px;outline:none;width:100%;margin-bottom:1rem;padding:.8rem 1rem;font-family:Inter,sans-serif;font-size:.95rem;transition:all .2s}.sync-input:focus{border-color:var(--accent-color);box-shadow:0 0 0 3px #3b2f2f1a}.sync-msg{margin-top:1rem;margin-bottom:0;font-size:.85rem;font-weight:700;animation:.3s fadeIn}.sync-msg.success{color:#27ae60}.sync-msg.error{color:var(--bingo-color)}.current-password-display{background-color:var(--card-bg);color:var(--text-color);border:1px solid #d3c4bc;border-radius:20px;margin-block:0 1.5rem;padding:.4rem 1rem;font-size:.95rem;display:inline-block;box-shadow:0 2px 5px #0000000d}.current-password-display strong{color:var(--accent-color);letter-spacing:1px;font-size:1.05rem}
