:root{--green:#0f5132;--light:#f7f7f7;--muted:#86868b;--accent:#1d1d1f;--radius:28px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial}*{box-sizing:border-box;margin:0;padding:0}.auth-page{width:100%;height:100vh;display:flex}.split{flex:1;display:flex}.left{background:var(--green);color:#fff;flex-direction:column;justify-content:center;align-items:flex-start;gap:32px;padding:60px;display:flex;position:relative;overflow:hidden}.brand{letter-spacing:-.5px;margin-bottom:20px;font-size:32px;font-weight:400}h1{margin:0;font-size:48px;font-weight:600;line-height:1.2}.tagline{margin-top:4px;font-size:42px;font-weight:300}.gallery{gap:20px;margin-top:auto;display:flex;position:relative}.card{border-radius:16px;transition:transform .3s;position:relative;overflow:hidden;box-shadow:0 20px 40px #0000004d}.card:hover{transform:translateY(-10px)scale(1.02)}.card.large{width:300px;height:400px}.card.small{align-self:flex-end;width:240px;height:240px}.card img{object-fit:cover;width:100%;height:100%;display:block}.tag{color:var(--green);background:#fffffff2;border-radius:20px;padding:6px 12px;font-size:12px;font-weight:500;position:absolute;bottom:10px;left:10px}.right{background:#fff;flex:1;justify-content:center;align-items:center;padding:64px;display:flex}.form-wrap{width:100%;max-width:400px}.tabs{border-bottom:1px solid #e5e5e7;gap:40px;margin-bottom:40px;display:flex;position:relative}.tabs button{color:var(--muted);cursor:pointer;background:0 0;border:none;padding:12px 0;font-size:18px;transition:color .3s;position:relative}.tabs button.active{color:var(--accent)}.tabs-indicator{background:var(--accent);height:2px;transition:left .3s,width .3s;position:absolute;bottom:-1px}.auth-btn{cursor:pointer;background:#fff;border:1px solid #d2d2d7;border-radius:50px;justify-content:center;align-items:center;gap:12px;width:100%;margin-bottom:16px;padding:8px 16px;font-size:16px;font-weight:500;transition:all .3s;display:flex}.auth-btn:hover{background:#f5f5f7;transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.auth-btn img{width:20px;height:20px}.or{text-align:center;color:var(--muted);margin:30px 0;position:relative}.or:before,.or:after{content:"";background:#d2d2d7;width:calc(50% - 80px);height:1px;position:absolute;top:50%}.or:before{left:0}.or:after{right:0}.form-group{margin-bottom:20px;position:relative}.form-group input{background:#f5f5f7;border:1px solid #d2d2d7;border-radius:12px;width:100%;padding:11px 16px 9px 48px;font-size:16px;transition:all .3s}.form-group input:focus{border-color:var(--green);background:#fff;outline:none;box-shadow:0 0 0 3px #0f51321a}.form-icon{stroke:#666;opacity:.5;width:20px;height:20px;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.forgot{text-align:right;color:var(--muted);cursor:pointer;margin-bottom:24px;font-size:14px;text-decoration:none;display:block}.forgot:hover{color:var(--green);text-decoration:underline}.primary{color:#fff;cursor:pointer;background:#1d1d1f;border:none;border-radius:50px;width:100%;padding:16px;font-size:16px;font-weight:600;transition:all .3s;position:relative;overflow:hidden}.primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #0003}.primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.toast{color:#fff;opacity:0;z-index:9999;text-align:center;background:#dc3545;border-radius:8px;width:-webkit-fill-available;padding:12px 24px;font-size:14px;font-weight:500;transition:all .3s;position:fixed;top:20px;left:50%;transform:translate(-50%)translateY(-100px);box-shadow:0 4px 12px #dc35454d}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}.loader{z-index:10000;background:#fff;flex-direction:column;justify-content:center;align-items:center;transition:opacity .5s;display:flex;position:fixed;inset:0}.loader.hidden{opacity:0;pointer-events:none}.loader-text{color:var(--green);letter-spacing:-.5px;margin-bottom:40px;font-size:24px;font-weight:600}.zigzag{align-items:center;gap:8px;display:flex}.zigzag i{border-right:3px solid var(--green);border-bottom:3px solid var(--green);width:20px;height:20px;animation:.6s ease-in-out infinite zigzag;transform:rotate(-45deg)}.zigzag i:nth-child(2){animation-delay:.15s}.zigzag i:nth-child(3){animation-delay:.3s}.zigzag i:nth-child(4){animation-delay:.45s}@keyframes zigzag{0%,to{opacity:.3;transform:rotate(-45deg)translate(0)}50%{opacity:1;transform:rotate(-45deg)translate(10px)}}@media (width<=768px){.split{flex-direction:column}.left{text-align:center;align-items:center;min-height:40vh;padding:30px}.gallery{flex-direction:column;align-items:center}.card.large{width:200px;height:260px}.card.small{width:180px;height:180px}}
