@import "https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;800&family=Plus+Jakarta+Sans:wght@300;400;500;600&display=swap";:root{--bg-color:#0b0712;--bg-card:#150d24;--bg-card-border:#d4af3740;--gold-main:#dfb758;--gold-glow:#f7e199;--gold-gradient:linear-gradient(135deg, #bf953f 0%, #fcf6ba 25%, #b38728 50%, #fbf5b7 75%, #aa771c 100%);--purple-glow:#9333ea4d;--text-main:#f3eee7;--text-muted:#b8acbe;--accent-red:#c0392b;--shadow-gold:0 4px 20px #dfb75833;--font-serif:"Cinzel", serif;--font-sans:"Plus Jakarta Sans", sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);font-family:var(--font-sans);background-image:radial-gradient(circle at 50% 0,#581c8740 0%,#0000 70%),radial-gradient(circle at 50% 100%,#bf953f1a 0%,#0000 60%);justify-content:center;min-height:100vh;display:flex;overflow-x:hidden}#app{background:var(--bg-color);border-left:1px solid #d4af371a;border-right:1px solid #d4af371a;flex-direction:column;width:100%;max-width:480px;min-height:100vh;display:flex;position:relative;box-shadow:0 0 50px #000c}header{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--bg-card-border);background:#0b0712eb;justify-content:space-between;align-items:center;padding:12px 16px;display:flex;position:sticky;top:0}.brand-title{font-family:var(--font-serif);letter-spacing:1px;background:var(--gold-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.2rem;font-weight:700}.brand-sub{color:var(--text-muted);letter-spacing:2px;text-transform:uppercase;font-size:.65rem}.header-cta{border:1px solid var(--gold-main);color:var(--gold-main);cursor:pointer;background:0 0;border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:.75rem;font-weight:600;transition:all .3s;display:flex}.header-cta:hover{background:var(--gold-main);color:var(--bg-color);box-shadow:var(--shadow-gold)}.hero-section{text-align:center;padding:24px 16px 20px;position:relative}.hero-img-container{border:1px solid var(--bg-card-border);border-radius:16px;width:100%;height:220px;margin-bottom:16px;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000080}.hero-img-container img{object-fit:cover;width:100%;height:100%}.hero-overlay{background:linear-gradient(#0000 40%,#0b0712e6 100%);position:absolute;inset:0}.hero-tag{border:1px solid var(--gold-main);color:var(--gold-glow);text-transform:uppercase;letter-spacing:2px;background:#d4af3726;border-radius:12px;margin-bottom:8px;padding:4px 12px;font-size:.7rem;display:inline-block}.hero-title{font-family:var(--font-serif);color:#fff;margin-bottom:8px;font-size:1.8rem;line-height:1.2}.hero-desc{color:var(--text-muted);font-size:.85rem;line-height:1.4}.notice-banner{background:linear-gradient(135deg,#c0392b40 0%,#0b0712cc 100%);border:1px solid #e0562480;border-radius:12px;align-items:center;gap:12px;margin:0 16px 24px;padding:14px 16px;display:flex;box-shadow:0 4px 15px #c0392b33}.notice-icon{font-size:1.6rem}.notice-text{color:#f7dcd5;font-size:.8rem;line-height:1.3}.notice-highlight{color:#ff9d85;font-size:.9rem;font-weight:700}.tarot-section{background:var(--bg-card);border-top:1px solid var(--bg-card-border);border-bottom:1px solid var(--bg-card-border);text-align:center;padding:24px 16px;position:relative;overflow:hidden}.section-badge{letter-spacing:2px;text-transform:uppercase;color:var(--gold-main);margin-bottom:4px;font-size:.7rem;display:block}.section-title{font-family:var(--font-serif);color:#fff;margin-bottom:8px;font-size:1.4rem}.tarot-sub{color:var(--text-muted);margin-bottom:20px;font-size:.8rem}.tarot-card-container{perspective:1000px;cursor:pointer;width:200px;height:320px;margin:0 auto 20px}.tarot-card-inner{text-align:center;width:100%;height:100%;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.175,.885,.32,1.275);position:relative}.tarot-card-container.flipped .tarot-card-inner{transform:rotateY(180deg)}.tarot-card-front,.tarot-card-back{backface-visibility:hidden;border:2px solid var(--gold-main);width:100%;height:100%;box-shadow:0 8px 25px #0009, var(--shadow-gold);border-radius:14px;position:absolute;overflow:hidden}.tarot-card-back{background:#110524}.tarot-card-back img{object-fit:cover;width:100%;height:100%}.tarot-card-front{background:#000;transform:rotateY(180deg)}.tarot-card-front img{object-fit:cover;width:100%;height:100%}.tarot-result{opacity:0;max-height:0;transition:all .5s;overflow:hidden;transform:translateY(10px)}.tarot-result.visible{opacity:1;max-height:500px;margin-top:15px;transform:translateY(0)}.tarot-card-title{font-family:var(--font-serif);color:var(--gold-glow);margin-bottom:6px;font-size:1.2rem}.tarot-card-desc{color:var(--text-main);background:#0b071299;border:1px solid #d4af3726;border-radius:8px;margin-bottom:12px;padding:10px;font-size:.82rem;line-height:1.4}.draw-btn{background:var(--gold-gradient);color:#0b0712;cursor:pointer;box-shadow:var(--shadow-gold);border:none;border-radius:25px;padding:12px 24px;font-size:.9rem;font-weight:700;transition:transform .2s,opacity .2s}.draw-btn:active{transform:scale(.96)}.draw-btn:disabled{opacity:.6;cursor:not-allowed}.agent-section{background:linear-gradient(180deg, var(--bg-color) 0%, #150d24cc 100%);text-align:center;padding:24px 16px}.agent-box{border:1px solid var(--gold-main);background:#150d24e6;border-radius:16px;padding:20px 16px;position:relative;box-shadow:0 8px 30px #00000080}.agent-avatar{border:2px solid var(--gold-main);width:70px;height:70px;box-shadow:0 0 15px var(--gold-main);border-radius:50%;margin:0 auto 12px;overflow:hidden}.agent-avatar img{object-fit:cover;width:100%;height:100%}.agent-voice-waves{justify-content:center;align-items:center;gap:4px;height:20px;margin:12px 0;display:flex}.agent-voice-waves span{background:var(--gold-main);border-radius:2px;width:4px;height:8px;transition:all .3s}.agent-voice-waves.active span{animation:1s ease-in-out infinite pulseWave}.agent-voice-waves.active span:nth-child(2){animation-delay:.2s}.agent-voice-waves.active span:nth-child(3){animation-delay:.4s}.agent-voice-waves.active span:nth-child(4){animation-delay:.6s}@keyframes pulseWave{0%,to{height:6px}50%{background:var(--gold-glow);height:20px}}.call-voice-btn{color:#fff;cursor:pointer;background:#27ae60;border:none;border-radius:25px;justify-content:center;align-items:center;gap:8px;margin:0 auto;padding:10px 20px;font-size:.9rem;font-weight:600;display:flex;box-shadow:0 4px 15px #27ae6066}.call-voice-btn.active{background:#c0392b;box-shadow:0 4px 15px #c0392b66}.services-section{padding:24px 16px}.service-card{background:var(--bg-card);border:1px solid var(--bg-card-border);border-radius:12px;justify-content:space-between;align-items:center;margin-bottom:12px;padding:16px;transition:transform .2s,border-color .2s;display:flex}.service-card:active{transform:scale(.98)}.service-name{font-family:var(--font-serif);color:#fff;margin-bottom:4px;font-size:1rem}.service-desc{color:var(--text-muted);font-size:.75rem}.service-right{text-align:right;flex-direction:column;align-items:flex-end;gap:6px;display:flex}.service-price{font-family:var(--font-serif);color:var(--gold-main);font-size:1.15rem;font-weight:700}.pay-btn{border:1px solid var(--gold-main);color:var(--gold-main);cursor:pointer;background:0 0;border-radius:16px;padding:6px 12px;font-size:.75rem;transition:all .2s}.pay-btn:hover{background:var(--gold-main);color:var(--bg-color)}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;opacity:0;pointer-events:none;background:#000000d9;justify-content:center;align-items:center;padding:16px;transition:opacity .3s;display:flex;position:fixed;inset:0}.modal-overlay.active{opacity:1;pointer-events:auto}.modal-box{background:var(--bg-card);border:1px solid var(--gold-main);border-radius:16px;width:100%;max-width:400px;padding:20px;box-shadow:0 10px 40px #000000e6}.modal-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.modal-title{font-family:var(--font-serif);color:var(--gold-main);font-size:1.2rem}.modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.4rem}.stripe-badge{color:#635bff;background:#635bff26;border-radius:6px;align-items:center;gap:6px;margin-bottom:12px;padding:4px 8px;font-size:.75rem;font-weight:700;display:inline-flex}.school-section{background:var(--bg-card);border-top:1px solid var(--bg-card-border);text-align:center;padding:24px 16px}.school-card{border:1px dashed var(--gold-main);background:#0b0712b3;border-radius:12px;margin-top:12px;padding:20px 16px}footer{text-align:center;color:var(--text-muted);border-top:1px solid var(--bg-card-border);padding:20px 16px;font-size:.75rem}
