:root{--color-primary:#d4a574;--color-primary-hover:#e6c08d;--color-primary-dark:#b8860b;--color-secondary:#daa520;--bg-dark-primary:#0f1624;--bg-dark-secondary:#1a1a2e;--bg-dark-tertiary:#16213e;--bg-gradient-start:#d4a574;--bg-gradient-mid1:#b8860b;--bg-gradient-mid2:#4a3f7a;--bg-gradient-end:#2e3562;--text-primary:#fff;--text-secondary:#8b92a9;--text-placeholder:#5a6177;--border-default:#2e3562;--border-focus:#d4a574;--color-error:#ff6b6b;--shadow-light:#0000004d;--shadow-primary:#d4a5744d;--shadow-primary-hover:#d4a57466;--overlay-purple:#8a5da866;--error-bg:#ff6b6b1a;--error-border:#ff6b6b4d;--focus-ring:#d4a5741a}*{box-sizing:border-box;margin:0;padding:0}body{background:linear-gradient(135deg,var(--bg-dark-secondary)0%,var(--bg-dark-tertiary)50%,var(--bg-dark-primary)100%);min-height:100vh;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;overflow:hidden}.container{width:100%;height:100vh;display:flex}.left-side{flex-direction:column;flex:1;justify-content:center;align-items:center;padding:60px;display:flex;position:relative;overflow:hidden}.left-side:before{content:"";border-radius:50%;width:800px;height:800px;position:absolute;top:-200px;left:-400px}.logo-container{z-index:1;text-align:center;margin-bottom:60px}.logo{width:250px;height:auto;filter:drop-shadow(0 10px 20px var(--shadow-light));margin-bottom:40px}.welcome-text{color:var(--text-primary);text-align:center;z-index:1}.welcome-text h1{text-shadow:2px 2px 10px var(--shadow-light);margin-bottom:15px;font-size:3em;font-weight:700}.welcome-text p{opacity:.95;font-size:1.1em;line-height:1.8}.right-side{background:var(--bg-dark-primary);flex:1;justify-content:center;align-items:center;padding:60px;display:flex}.login-container{width:100%;max-width:450px}.login-header{text-align:right;margin-bottom:40px}.login-header h2{color:var(--text-primary);margin-bottom:10px;font-size:2em;font-weight:700}.login-header p{color:var(--text-secondary);font-size:.95em;line-height:1.6}.form-group{margin-bottom:25px}.form-group label{color:var(--text-primary);text-align:right;margin-bottom:8px;font-size:.9em;display:block}.form-group label span{color:var(--color-primary)}input[type=text],input[type=password]{border:1px solid var(--border-default);width:100%;color:var(--text-primary);text-align:right;background:0 0;border-radius:8px;padding:14px 18px;font-size:1em;transition:all .3s}input[type=text]:focus,input[type=password]:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--focus-ring);outline:none}input::placeholder{color:var(--text-placeholder)}.form-options{flex-direction:row-reverse;justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.remember-me{align-items:center;gap:8px;display:flex}.remember-me input[type=checkbox]{cursor:pointer;width:18px;height:18px;accent-color:var(--color-primary)}.remember-me label{color:var(--text-secondary);cursor:pointer;margin:0;font-size:.9em}.forgot-password{color:var(--color-primary);font-size:.9em;text-decoration:none;transition:color .3s}.forgot-password:hover{color:var(--color-primary-hover);text-decoration:underline}.login-button{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-secondary)100%);width:100%;color:var(--bg-dark-secondary);cursor:pointer;box-shadow:0 4px 15px var(--shadow-primary);border:none;border-radius:8px;padding:16px;font-size:1.1em;font-weight:700;transition:all .3s}.login-button:hover{box-shadow:0 6px 20px var(--shadow-primary-hover);transform:translateY(-2px)}.login-button:active{transform:translateY(0)}.signup-link{text-align:center;color:var(--text-secondary);margin-top:25px;font-size:.95em}.signup-link a{color:var(--color-primary);font-weight:700;text-decoration:none;transition:color .3s}.signup-link a:hover{color:var(--color-primary-hover);text-decoration:underline}.error-message{color:var(--color-error);background:var(--error-bg);border:1px solid var(--error-border);text-align:right;border-radius:8px;margin-top:15px;padding:12px;font-size:.9em;display:none}.error-message.show{display:block}@media (width<=768px){.left-side{display:none}.right-side{padding:40px 20px}}@media (width>=769px) and (width<=1024px){.left-side{min-height:40vh;padding:40px}.logo{width:180px}.welcome-text h1{font-size:2em}.right-side{padding:40px 20px}}