/* ========================================================================== gate.css — password gate overlay (INFRA, do not delete) Styled to match the Eden Garden Lagoense palette: olive / cream / sage. Fonts (Cormorant Garamond + Outfit) are loaded by index.html's . ========================================================================== */ #eden-gate { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; background: #F4F1E9; color: #2A2A24; transition: opacity 0.6s cubic-bezier(.22, .61, .36, 1); } #eden-gate::before { /* faint olive vignette so the cream isn't flat */ content: ""; position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 30%, transparent 40%, rgba(46, 58, 31, 0.10) 100%); pointer-events: none; } #eden-gate.eden-gate--hidden { opacity: 0; pointer-events: none; } .eden-gate__box { position: relative; width: min(380px, 86vw); text-align: center; } .eden-gate__mark { font-family: "Cormorant Garamond", Georgia, serif; font-size: 2.4rem; font-weight: 500; font-style: italic; line-height: 1.1; color: #3E4D2C; margin: 0 0 0.4rem; } .eden-gate__sub { font-family: "Outfit", system-ui, sans-serif; font-size: 0.7rem; font-weight: 500; letter-spacing: 0.32em; text-transform: uppercase; color: rgba(42, 42, 36, 0.5); margin: 0 0 2rem; } .eden-gate__input { width: 100%; padding: 0.9rem 1rem; font-family: "Outfit", system-ui, sans-serif; font-size: 1rem; text-align: center; letter-spacing: 0.12em; color: #2A2A24; background: #FBF9F3; border: 1px solid rgba(42, 42, 36, 0.18); border-radius: 12px; outline: none; transition: border-color 0.2s ease, box-shadow 0.2s ease; } .eden-gate__input::placeholder { color: rgba(42, 42, 36, 0.35); } .eden-gate__input:focus { border-color: #8A9A6B; box-shadow: 0 0 0 3px rgba(138, 154, 107, 0.18); } .eden-gate__input--error { border-color: #A4562F; box-shadow: 0 0 0 3px rgba(192, 107, 62, 0.16); } .eden-gate__box.eden-gate--shake { animation: eden-shake 0.42s; } .eden-gate__hint { font-family: "Outfit", system-ui, sans-serif; margin-top: 0.9rem; min-height: 1.2em; font-size: 0.8rem; letter-spacing: 0.04em; color: #A4562F; } @keyframes eden-shake { 0%, 100% { transform: translateX(0); } 20%, 60% { transform: translateX(-7px); } 40%, 80% { transform: translateX(7px); } } /* Lock scrolling while the gate is up. Removed by gate.js on unlock. */ html.eden-locked, body.eden-locked { overflow: hidden; height: 100%; }