*{margin:0;padding:0;box-sizing:border-box}
body{background:#000;color:#fff;font-family:'Inter',sans-serif;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;overflow-x:hidden}
.logo{margin-bottom:50px;user-select:none;width:100%;display:flex;justify-content:center;overflow:hidden}
.logo-img{height:200px;width:auto;filter:invert(1);margin-top:-30px}
.countdown-section{text-align:center;margin-bottom:50px}
.countdown-label{font-size:.85rem;font-weight:400;letter-spacing:.35em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:24px}
.countdown{display:flex;align-items:center;gap:8px}
.countdown-block{display:flex;flex-direction:column;align-items:center;min-width:100px}
.countdown-number{font-size:5.5rem;font-weight:200;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.countdown-unit{font-size:.7rem;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:12px}
.countdown-separator{font-size:4rem;font-weight:100;color:rgba(255,255,255,.25);align-self:flex-start;padding-top:8px}
.subscribe-section{text-align:center;width:100%;max-width:420px;margin-bottom:50px}
.subscribe-title{font-size:.85rem;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:20px}
.subscribe-form{display:flex;flex-direction:column;gap:14px}
.subscribe-input{background:transparent;border:1px solid rgba(255,255,255,.25);color:#fff;font-family:'Inter',sans-serif;font-size:.9rem;font-weight:300;padding:14px 18px;outline:none;letter-spacing:.04em;transition:border-color .3s ease}
.subscribe-input::placeholder{color:rgba(255,255,255,.3);font-weight:300}
.subscribe-input:focus{border-color:rgba(255,255,255,.7)}
.subscribe-button{background:#fff;color:#000;border:none;font-family:'Inter',sans-serif;font-size:.8rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;padding:15px 18px;cursor:pointer;transition:opacity .3s ease}
.subscribe-button:hover{opacity:.85}
.subscribe-button:active{opacity:.7}
.subscribe-confirmation{display:none;font-size:.85rem;font-weight:300;letter-spacing:.04em;color:rgba(255,255,255,.7);margin-top:16px;line-height:1.6}
.subscribe-confirmation.visible{display:block;animation:fadeIn .5s ease forwards}
.lock-section{text-align:center;width:100%;max-width:500px}
.lock-title{font-size:.85rem;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:24px}
.lock{display:flex;justify-content:center;gap:6px;margin-bottom:24px}
.lock-digit{display:flex;flex-direction:column;align-items:center;gap:0}
.lock-arrow{background:none;border:none;color:rgba(255,255,255,.3);font-size:.7rem;cursor:pointer;padding:8px 12px;transition:color .2s ease;user-select:none;line-height:1}
.lock-arrow:hover{color:rgba(255,255,255,.8)}
.lock-display{width:44px;height:60px;border:1px solid rgba(255,255,255,.2);overflow:hidden;position:relative}
.lock-roller{position:absolute;top:0;left:0;width:100%;transition:transform .25s ease}
.lock-roller span{display:flex;align-items:center;justify-content:center;width:100%;height:60px;font-size:1.8rem;font-weight:300;font-variant-numeric:tabular-nums}
.lock-submit{background:#fff;color:#000;border:none;font-family:'Inter',sans-serif;font-size:.8rem;font-weight:600;letter-spacing:.25em;text-transform:uppercase;padding:14px 40px;cursor:pointer;transition:opacity .3s ease}
.lock-submit:hover{opacity:.85}
.lock-submit:active{opacity:.7}
.lock-error{display:none;font-size:.8rem;font-weight:300;color:rgba(255,255,255,.5);margin-top:14px}
.lock-error.visible{display:block;animation:fadeIn .4s ease forwards}
.lock-success{display:none;font-size:.85rem;font-weight:300;color:rgba(255,255,255,.7);margin-top:14px}
.lock-success.visible{display:block;animation:fadeIn .5s ease forwards}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.lock.shake{animation:shake .4s ease}
@media(max-width:600px){.logo-img{height:120px}.countdown-number{font-size:3rem}.countdown-block{min-width:60px}.countdown-separator{font-size:2.4rem}.countdown-section{margin-bottom:40px}.logo{margin-bottom:40px}.lock-display{width:36px;height:50px}.lock-roller span{height:50px;font-size:1.4rem}.lock{gap:4px}}
