*,::after,::before{margin:0;padding:0;box-sizing:border-box}:root{--color-primary:#E53935;--color-primary-light:#FF6F61;--color-secondary:#F48FB1;--color-accent:#FFD700;--color-text:#4A2C2A;--color-text-light:#8B6F6F;--color-white:#FFFFFF;--font-display:'Playfair Display',serif;--font-body:'Lato',sans-serif;--font-handwriting:'Caveat',cursive;--radius-md:12px;--radius-lg:20px}html{height:100%}body{height:100%;margin:0;font-family:var(--font-body);background:linear-gradient(135deg,var(--color-secondary) 0,var(--color-primary-light) 50%,var(--color-accent) 100%);display:flex;align-items:center;justify-content:center;padding:1.5rem;min-height:100dvh}.gate-card{position:absolute;z-index:1;width:min(400px,120vw);aspect-ratio:1/1.05;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 2.5rem 1rem}.gate-card::before{content:'';position:absolute;inset:0;background:var(--color-primary);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 90 C25 70, 0 50, 0 30 C0 12, 12 0, 28 0 C38 0, 46 6, 50 16 C54 6, 62 0, 72 0 C88 0, 100 12, 100 30 C100 50, 75 70, 50 90Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 90 C25 70, 0 50, 0 30 C0 12, 12 0, 28 0 C38 0, 46 6, 50 16 C54 6, 62 0, 72 0 C88 0, 100 12, 100 30 C100 50, 75 70, 50 90Z'/%3E%3C/svg%3E") center/contain no-repeat;z-index:-1;filter:drop-shadow(0 8px 30px rgba(229, 57, 53, .35))}.gate-hearts{display:none}.gate-title{font-family:var(--font-display);font-size:clamp(2.2rem, 5.5vw, 2.1rem);color:var(--color-primary);margin-bottom:.15rem}.gate-hint{font-family:var(--font-handwriting);font-size:1.3rem;color:var(--color-text-light);margin-bottom:.5rem}.gate-input-wrap{display:flex;gap:.3rem;margin-bottom:.3rem;max-width:220px;width:100%}.gate-input{flex:1;padding:.4rem .5rem;border:2px solid var(--color-secondary);border-radius:var(--radius-md);font-size:.85rem;font-family:var(--font-body);color:var(--color-text);outline:0;text-align:center;letter-spacing:.2em;transition:border-color .2s}.gate-input:focus{border-color:var(--color-primary)}.gate-btn{width:36px;height:36px;min-width:36px;min-height:36px;border:none;border-radius:var(--radius-md);background:var(--color-primary);color:#fff;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s}.gate-btn:active{transform:scale(.95)}.gate-error{color:var(--color-primary);font-size:.82rem;min-height:1rem;font-family:var(--font-body)}.gate-floating-hearts{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}@keyframes floatHeartGate{0%{opacity:0;transform:translateY(0) scale(.5)}10%{opacity:.7}90%{opacity:.15}100%{opacity:0;transform:translateY(-100vh) scale(1.1)}}.gate-heart{position:absolute;bottom:-30px;font-size:1rem;animation:floatHeartGate linear infinite;pointer-events:none}.gate-title{color:var(--color-white)}.gate-hint{color:rgba(255,255,255,.85)}.gate-input{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.2);color:var(--color-white)}.gate-input::placeholder{color:rgba(255,255,255,.5)}.gate-input:focus{border-color:var(--color-white);background:rgba(255,255,255,.3)}.gate-btn{background:var(--color-white);color:var(--color-primary)}.gate-error{color:var(--color-white)}