/* Halaman login bergaya neumorphism. Hanya dimuat oleh index.php; tidak mempengaruhi halaman lain. */
:root{--nl-page:#e6ede4;--nl-bg:#e6ede4;--nl-dark:#bcc8ba;--nl-light:#fbfffa;--nl-ink:#0b3d2e;--nl-mut:#476255;--nl-acc:#0f6b4b;--nl-gold:#c9a227;--nl-gold-a:#e3c566;--nl-gold-b:#c29a2c;--nl-btn-ink:#0b3d2e;--nl-err:#b91c1c;--nl-card-shadow:20px 20px 60px var(--nl-dark),-20px -20px 60px var(--nl-light)}
body.bare{background:var(--nl-page);color:var(--nl-ink)}
body.bare::before{content:"";position:fixed;top:0;left:0;right:0;height:6px;background:linear-gradient(90deg,var(--nl-acc),var(--nl-gold-a) 55%,var(--nl-gold));z-index:1}
body.bare main{max-width:none;margin:0;padding:0}
.login-wrap{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:20px}
.login-card{width:100%;max-width:420px;background:var(--nl-bg);border-radius:30px;padding:48px 36px 40px;box-shadow:var(--nl-card-shadow)}
.login-head{text-align:center;margin-bottom:34px}
.login-icon{width:80px;height:80px;margin:0 auto 22px;border-radius:50%;background:var(--nl-bg);display:flex;align-items:center;justify-content:center;color:var(--nl-acc);border:2px solid var(--nl-gold);box-shadow:8px 8px 20px var(--nl-dark),-8px -8px 20px var(--nl-light)}
.login-icon svg{width:38px;height:38px}
.login-head h1{margin:0 0 8px;font-size:1.75rem;font-weight:650;line-height:1.25;color:var(--nl-ink);overflow-wrap:anywhere}
.login-head p{margin:0;font-size:15px;color:var(--nl-mut)}
.login-head p::after{content:"";display:block;width:56px;height:3px;margin:18px auto 0;border-radius:3px;background:linear-gradient(90deg,var(--nl-gold-a),var(--nl-gold-b))}
.login-error{margin:0 0 24px;padding:12px 16px;border-radius:14px;background:var(--nl-bg);color:var(--nl-err);font-size:14px;font-weight:600;line-height:1.45;box-shadow:inset 4px 4px 9px var(--nl-dark),inset -4px -4px 9px var(--nl-light);border-left:4px solid var(--nl-err)}
.login-field{position:relative;margin-bottom:26px;border-radius:15px;background:var(--nl-bg);box-shadow:inset 8px 8px 16px var(--nl-dark),inset -8px -8px 16px var(--nl-light);transition:box-shadow .25s ease}
.login-field:focus-within{box-shadow:inset 4px 4px 8px var(--nl-dark),inset -4px -4px 8px var(--nl-light),0 0 0 2px var(--nl-acc)}
.login-field input{display:block;width:100%;margin:0;padding:28px 18px 10px 54px;border:0;border-radius:15px;background:transparent;color:var(--nl-ink);font-family:inherit;font-size:16px;font-weight:500;line-height:1.3;outline:none}
.login-field label{position:absolute;left:54px;top:50%;transform:translateY(-50%);color:var(--nl-mut);font-size:16px;line-height:1.2;pointer-events:none;transition:all .2s ease}
.login-field input:focus+label,.login-field input:not(:placeholder-shown)+label,.login-field input:-webkit-autofill+label{top:9px;transform:none;font-size:12px}
.login-field input:-webkit-autofill{-webkit-text-fill-color:var(--nl-ink);box-shadow:0 0 0 40px var(--nl-bg) inset;transition:background-color 9999s}
.login-field .ico{position:absolute;left:19px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--nl-mut);pointer-events:none}
.login-field .ico svg{display:block;width:100%;height:100%}
.login-btn{position:relative;overflow:hidden;width:100%;margin-top:8px;padding:17px 24px;border:0;border-radius:15px;background:linear-gradient(145deg,var(--nl-gold-a),var(--nl-gold-b));color:var(--nl-btn-ink);font-family:inherit;font-size:16px;font-weight:700;line-height:1.2;letter-spacing:.3px;cursor:pointer;box-shadow:8px 8px 20px var(--nl-dark),-8px -8px 20px var(--nl-light);transition:transform .25s ease,box-shadow .25s ease}
.login-btn::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .5s ease}
.login-btn:hover{transform:translateY(-2px);box-shadow:12px 12px 30px var(--nl-dark),-12px -12px 30px var(--nl-light)}
.login-btn:hover::before{left:100%}
.login-btn:active{transform:translateY(0);box-shadow:inset 4px 4px 10px var(--nl-dark),inset -4px -4px 10px var(--nl-light)}
.login-btn:focus-visible{outline:2px solid var(--nl-acc);outline-offset:3px}
.login-foot{margin:26px 0 0;text-align:center;font-size:12.5px;color:var(--nl-mut)}
@media (max-width:480px){:root{--nl-card-shadow:14px 14px 40px var(--nl-dark),-14px -14px 40px var(--nl-light)}.login-wrap{padding:16px}.login-card{padding:36px 24px 30px;border-radius:22px;box-shadow:var(--nl-card-shadow)}.login-head h1{font-size:1.5rem}.login-icon{width:70px;height:70px}.login-field input{padding-left:50px}.login-field label{left:50px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}