*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{background-attachment:fixed;background-color:#F8F8F8;background-image:linear-gradient(rgb(0 0 0 / .05) 1px,transparent 1px),linear-gradient(90deg,rgb(0 0 0 / .05) 1px,transparent 1px);background-size:10px 10px;color:#333;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;margin:0;padding-top:15px;text-shadow:0 1px hsl(0 0% 100% / .5);text-rendering:optimizelegibility;min-height:100vh;opacity:1!important;overflow-x:hidden;transition:all 0.3s ease}body.loaded{animation:fadeIn 1s ease-out}@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.container{margin:0 auto;max-width:750px;padding:20px}a{color:#0078B4;text-decoration:none;position:relative;overflow:hidden}a::after{content:'';position:absolute;bottom:0;left:50%;width:0;height:2px;background:#005580;transition:all 0.3s ease;transform:translateX(-50%)}a:hover::after{width:100%}a:hover,a:focus,a:active{color:#005580}a:focus{outline:thin dotted #333}.jumbotron{margin:60px 0;text-align:center}.jumbotron h1{color:inherit;font-family:inherit;font-size:72px;font-weight:700;line-height:1;margin:10px 0;cursor:default;text-rendering:optimizelegibility;animation:slideInDown 0.8s ease-out}@keyframes slideInDown{from{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.jumbotron .lead{font-size:21px;font-weight:200;line-height:30px;margin-bottom:20px;animation:fadeInUp 0.8s ease-out 0.2s both}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.auth-section{background-color:rgb(255 255 255 / .8);border:1px solid #B7D1A0;border-radius:4px;margin-bottom:20px;padding:20px;transition:all 0.3s ease;opacity:0;transform:translateY(30px);animation:fadeInUp 0.6s ease-out forwards;position:relative;overflow:hidden}.auth-section::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(183 209 160 / .1),transparent);transition:left 0.5s}.auth-section:hover::before{left:100%}.auth-section:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgb(70 136 71 / .2)}.auth-section h2{color:#468847;font-size:24px;margin-bottom:20px;position:relative;text-align:center}.auth-section h2::after{content:'';position:absolute;bottom:-5px;left:50%;width:0;height:2px;background:#468847;transition:width 0.3s ease;transform:translateX(-50%)}.auth-section:hover h2::after{width:50px}.auth-section .link{text-align:center;margin-top:15px;color:#333}.auth-section .link a{color:#468847;font-weight:700}.auth-section .link a:hover{color:#005580}.auth-section .error{color:#d9534f;text-align:center;margin-top:10px;font-size:14px;opacity:0;transform:translateY(-10px);transition:all 0.3s ease;position:relative}.auth-section .error.show{opacity:1;transform:translateY(0);animation:shake 0.5s ease-in-out}@keyframes shake{0%,100%{transform:translateX(0) translateY(0)}10%,30%,50%,70%,90%{transform:translateX(-5px) translateY(0)}20%,40%,60%,80%{transform:translateX(5px) translateY(0)}}.auth-section .success{color:#468847;text-align:center;margin-top:10px;font-size:14px;opacity:0;transform:translateY(-10px);transition:all 0.3s ease;position:relative}.auth-section .success.show{opacity:1;transform:translateY(0);animation:bounceIn 0.6s ease-in-out}@keyframes bounceIn{0%{transform:scale(.3) translateY(-10px);opacity:0}50%{transform:scale(1.05) translateY(0)}70%{transform:scale(.9) translateY(0)}100%{transform:scale(1) translateY(0);opacity:1}}.social-logins{text-align:center;margin-top:0;padding-top:0;border-top:none}.social-logins h3{color:#333;margin-bottom:15px;font-size:16px}.social-btn{width:100%;padding:12px;margin:5px 0;border:none;border-radius:4px;font-size:16px;cursor:pointer;transition:background 0.3s ease;color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;gap:10px}.github{background:#24292e}.github:hover{background:#1a1f26}.google{background:#4285f4}.google:hover{background:#3367d6}.social-btn i{font-size:18px}.theme-toggle{position:fixed;top:15px;right:15px;padding:8px 12px;border-radius:999px;border:1px solid rgb(0 0 0 / .1);background:rgb(255 255 255 / .85);color:#333;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-size:14px;z-index:1000;backdrop-filter:blur(8px);transition:background 0.3s ease,color 0.3s ease,border-color 0.3s ease,transform 0.2s ease}.theme-toggle:hover{transform:translateY(-1px)}.theme-toggle i{font-size:16px}body.dark-mode{background-color:#050810;background-image:linear-gradient(rgb(255 255 255 / .04) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .04) 1px,transparent 1px);background-size:10px 10px;color:#e5e7eb;text-shadow:none}body.dark-mode .theme-toggle{background:rgb(15 23 42 / .9);border-color:rgb(148 163 184 / .5);color:#e5e7eb}body.dark-mode .jumbotron h1{color:#f9fafb}body.dark-mode .jumbotron .lead{color:#cbd5f5}body.dark-mode .auth-section{background-color:rgb(15 23 42 / .96);border-color:#334155;box-shadow:0 4px 18px rgb(0 0 0 / .6)}body.dark-mode .auth-section::before{background:linear-gradient(90deg,transparent,rgb(74 222 128 / .08),transparent)}body.dark-mode .auth-section h2{color:#4ade80}body.dark-mode .auth-section h2::after{background:#4ade80}body.dark-mode .auth-section .link{color:#e5e7eb}body.dark-mode .auth-section .link a{color:#4ade80}body.dark-mode .auth-section .link a:hover{color:#38bdf8}body.dark-mode .social-logins{border-top-color:#1f2937}body.dark-mode .social-logins h3{color:#e5e7eb}body.dark-mode a{color:#38bdf8}body.dark-mode a::after{background:#0ea5e9}body.dark-mode a:hover,body.dark-mode a:focus,body.dark-mode a:active{color:#0ea5e9}body.dark-mode footer{color:#93c5fd}body.dark-mode .auth-section .error{color:#f87171}body.dark-mode .auth-section .success{color:#4ade80}@media only screen and (max-width:600px){body{padding:10px 0 0 0}.jumbotron{margin:20px 0 30px}.jumbotron .lead{font-size:18px}.container{padding:10px}.auth-section{padding:15px}.auth-section h2{font-size:20px}}footer{text-align:center;padding:15px;font-size:14px;color:#167196;font-weight:600;margin-bottom:20px;transition:all 0.3s ease}footer:hover{transform:translateY(-1px)}@media (max-width:480px){footer{padding:10px}}
