/* GreenPro Auth UI — premium green + white, fully responsive */
:root{--gp-green:#16a34a;--gp-green-dark:#15803d;--gp-green-soft:#ecfdf3;--gp-ink:#172019;--gp-muted:#7b877f;--gp-field:#f5f8f6;--gp-border:#e3ebe5}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--gp-ink);background:#eef8f1}
body{min-height:100dvh;overflow:auto}
.auth-bg{width:100%;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 15% 10%,rgba(34,197,94,.16),transparent 30%),radial-gradient(circle at 85% 90%,rgba(22,163,74,.12),transparent 32%),linear-gradient(145deg,#f7fff9,#eaf7ee)}
.auth-device{width:min(100%,460px);min-height:720px;max-height:calc(100dvh - 48px);background:#fff;border:1px solid rgba(22,163,74,.10);border-radius:30px;overflow:hidden;box-shadow:0 28px 90px rgba(20,75,39,.18);display:flex;flex-direction:column}
.auth-hero{height:clamp(170px,28dvh,245px);flex:0 0 auto;background:var(--gp-green);position:relative;overflow:hidden}
.auth-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.10))}
.auth-hero img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.auth-hero-fallback{width:100%;height:100%;background:radial-gradient(circle at 75% 20%,rgba(255,255,255,.24),transparent 14%),radial-gradient(circle at 15% 85%,rgba(255,255,255,.12),transparent 25%),linear-gradient(145deg,#22c55e,#15803d)}
.auth-panel{position:relative;z-index:2;flex:1;min-height:0;background:#fff;border-radius:30px 30px 0 0;margin-top:-18px;padding:0 30px 22px;display:flex;flex-direction:column;border-top:1px solid rgba(255,255,255,.7)}
.auth-logo-wrap{width:92px;height:92px;flex:0 0 auto;margin:-46px auto 10px;z-index:5;border-radius:50%;background:#fff;padding:6px;box-shadow:0 10px 30px rgba(20,75,39,.20);border:1px solid rgba(22,163,74,.10)}
.auth-logo{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:var(--gp-green);border:2px solid #e8f6eb}
.auth-logo img{width:100%;height:100%;object-fit:cover}
.auth-logo-text{color:#fff;font-weight:950;font-size:23px;letter-spacing:-1px}
.auth-tabs{height:48px;display:flex;justify-content:center;align-items:flex-start;gap:70px;margin:0 0 12px;flex:0 0 auto}
.auth-tab{background:transparent;border:0;font-size:20px;line-height:30px;font-weight:850;color:#9aa59e;padding:0 2px 10px;position:relative;text-decoration:none}
.auth-tab.active{color:var(--gp-ink)}
.auth-tab.active:after{content:"";position:absolute;left:4px;right:4px;bottom:0;height:4px;border-radius:99px;background:linear-gradient(90deg,var(--gp-green),#22c55e)}
.auth-hint{display:flex;align-items:flex-start;gap:7px;color:var(--gp-green-dark);background:var(--gp-green-soft);border:1px solid rgba(22,163,74,.12);border-radius:13px;padding:9px 11px;font-size:11px;font-weight:700;margin:0 0 10px}
.auth-alert{border:1px solid #f3d6d6;border-radius:13px;background:#fff6f6;color:#a12626;padding:10px 12px;font-size:12px;font-weight:700;margin:0 0 10px;flex:0 0 auto;overflow-wrap:anywhere}
.auth-form-scroll{min-height:0;flex:1;display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain;scrollbar-width:none}.auth-form-scroll::-webkit-scrollbar{display:none}
.auth-form-scroll form{margin:0}
.auth-field{min-height:54px;border:1px solid var(--gp-border);background:var(--gp-field);border-radius:16px;display:flex;align-items:center;padding:0 15px;margin-bottom:10px;flex:0 0 auto;transition:.18s ease}
.auth-field:focus-within{background:#fff;border-color:rgba(22,163,74,.45);box-shadow:0 0 0 4px rgba(22,163,74,.09)}
.auth-field .ico{width:30px;flex:0 0 30px;font-size:17px;color:#8c9991}.auth-field input{width:100%;min-width:0;border:0;outline:0;background:transparent;font-size:14px;color:#202a23;padding:0}.auth-field input::placeholder{color:#9ca7a0}
.auth-prefix{font-size:15px;font-weight:850;color:var(--gp-green-dark);padding-right:10px;border-right:1px solid #d4dfd7;margin-right:10px;flex:0 0 auto}.eye{border:0;background:transparent;color:#8b9890;font-size:19px;padding:4px 0 4px 8px;line-height:1;cursor:pointer}
.auth-check{display:flex;justify-content:flex-start;align-items:center;margin:0 3px 11px;font-size:12px;min-height:24px}.auth-check label{display:flex;align-items:center;gap:8px;font-weight:700;color:#536158;cursor:pointer}.auth-check input{width:17px;height:17px;accent-color:var(--gp-green);margin:0}
.auth-btn{width:100%;min-height:54px;border:0;border-radius:16px;background:linear-gradient(180deg,#22c55e,var(--gp-green-dark));color:#fff;font-size:16px;font-weight:950;letter-spacing:.06em;box-shadow:0 12px 24px rgba(22,163,74,.22);margin-top:2px;cursor:pointer;transition:.18s ease}.auth-btn:hover{transform:translateY(-1px);box-shadow:0 15px 28px rgba(22,163,74,.27)}.auth-btn:active{transform:translateY(1px)}
.auth-bottom{text-align:center;margin-top:12px;color:#7c887f;font-size:12px;line-height:20px;flex:0 0 auto}.auth-bottom a{color:var(--gp-green-dark);font-weight:900;text-decoration:none}
@media(max-width:560px){.auth-bg{padding:0;align-items:stretch;background:#f4fbf6}.auth-device{width:100%;min-height:100dvh;max-height:none;border-radius:0;border:0;box-shadow:none}.auth-hero{height:clamp(145px,23dvh,210px)}.auth-panel{margin-top:-20px;border-radius:28px 28px 0 0;padding:0 18px 12px}.auth-logo-wrap{width:82px;height:82px;margin-top:-41px;margin-bottom:7px}.auth-tabs{height:43px;gap:58px;margin-bottom:9px}.auth-tab{font-size:18px;line-height:27px;padding-bottom:8px}.auth-field{min-height:50px;border-radius:15px;margin-bottom:8px;padding:0 13px}.auth-field input{font-size:13px}.auth-prefix{font-size:14px}.auth-btn{min-height:50px;border-radius:15px}.auth-bottom{margin-top:9px;font-size:11px}}
@media(max-width:560px) and (max-height:680px){.auth-hero{height:125px}.auth-logo-wrap{width:70px;height:70px;margin-top:-35px}.auth-tabs{height:38px;margin-bottom:6px}.auth-tab{font-size:17px}.auth-field{min-height:44px;margin-bottom:6px}.auth-btn{min-height:45px}.auth-check{margin-bottom:7px}.auth-bottom{margin-top:5px}}
@media(min-width:561px) and (max-height:780px){.auth-device{min-height:0;height:calc(100dvh - 28px)}.auth-hero{height:170px}.auth-logo-wrap{width:78px;height:78px;margin-top:-39px}.auth-field{min-height:48px;margin-bottom:7px}.auth-btn{min-height:49px}}
