:root{--primary: var(--cx-green, #1a7a46);--primary-light: var(--cx-green-l, #22a15c);--primary-dark: var(--cx-green-d, #0f5130);--gold: var(--cx-amber, #c98a1b);--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-700: #374151;--gray-900: #111827;--error: #dc2626;--cyberspace-blue: #0ea5e9;--cyberspace-green: var(--cx-green-l, #22a15c)}.login-navbar{position:sticky;top:0;z-index:100;background:#fffffff5;border-bottom:1px solid rgba(22,101,52,.16);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.navbar-container{max-width:1180px;margin:0 auto;padding:.8rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;position:relative}.navbar-brand{display:inline-flex;align-items:center;gap:.65rem;text-decoration:none}.navbar-logo img{width:34px;height:34px;object-fit:contain;transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.navbar-brand:hover .navbar-logo img{transform:rotate(-6deg) scale(1.08)}.navbar-title{font-size:.82rem;color:#14532d;font-weight:700;line-height:1.1}.navbar-subtitle{font-size:.68rem;color:var(--gray-500);font-weight:500}.navbar-links{display:inline-flex;align-items:center;gap:.8rem}.nav-link{text-decoration:none;color:#4b5563;font-size:.82rem;font-weight:500;display:inline-flex;align-items:center;gap:.35rem}.nav-link:hover{color:var(--primary)}.nav-link svg{width:14px;height:14px}.login-minimalist-wrapper{min-height:calc(100vh - 70px);display:flex;align-items:center;justify-content:center;padding:1.25rem;position:relative;overflow:hidden auto;background:#0a1410}.login-minimalist-wrapper:after{content:"";position:absolute;inset:-3%;z-index:-2;background:url(/images/ccs-center-official.webp) center / cover no-repeat;animation:cx-login-kenburns 22s ease-in-out infinite alternate;pointer-events:none}@keyframes cx-login-kenburns{0%{transform:scale(1) translate(0)}to{transform:scale(1.08) translate(-1.2%,1%)}}.login-minimalist-wrapper:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(130deg,#061212b8,#08201894),radial-gradient(circle at 12% 12%,rgba(46,204,113,.15) 0%,transparent 40%),radial-gradient(circle at 88% 88%,rgba(14,165,233,.16) 0%,transparent 38%);pointer-events:none}.login-form-panel{display:flex;align-items:center;justify-content:center;width:100%;position:relative;z-index:1}.form-wrapper{width:min(460px,100%);background:#fffffff5;border:1px solid rgba(255,255,255,.52);border-radius:var(--cx-radius, 14px);padding:1.5rem 1.6rem;box-shadow:0 20px 48px #02081747;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);max-height:calc(100vh - 3rem);overflow-y:auto;animation:cx-login-in .6s cubic-bezier(.16,1,.3,1) both}@keyframes cx-login-in{0%{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}.form-branding,.form-title,.form-description,.demo-quick-login,.login-form,.form-footer{animation:cx-login-child-in .55s cubic-bezier(.16,1,.3,1) both}.form-branding{animation-delay:.08s}.form-title{animation-delay:.14s}.form-description{animation-delay:.19s}.demo-quick-login{animation-delay:.24s}.login-form{animation-delay:.3s}.form-footer{animation-delay:.4s}@keyframes cx-login-child-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.form-header-section{margin-bottom:.85rem;text-align:center}.form-branding{margin-bottom:.55rem;display:flex;justify-content:center}.form-logo{width:46px;height:46px;border-radius:10px;object-fit:contain;background:#fff;border:1px solid var(--gray-200);padding:.2rem}.form-title{margin:0;font-size:1.5rem;line-height:1.2;color:var(--primary-dark);font-weight:800;letter-spacing:-.01em}.form-description{margin:.35rem 0 0;color:#52627c;font-size:.9rem}.demo-quick-login{margin-top:.75rem}.demo-toggle-btn{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:1px dashed rgba(26,122,70,.35);background:var(--cx-wash, #eaf3ee);color:var(--primary-dark);border-radius:999px;padding:.42rem .9rem;font-size:.78rem;font-weight:700;cursor:pointer;transition:background .15s ease,border-color .15s ease}.demo-toggle-btn:hover{background:#dcfce7;border-color:#1a7a468c}.demo-toggle-chevron{transition:transform .2s ease}.demo-toggle-btn.open .demo-toggle-chevron{transform:rotate(180deg)}.demo-chip-grid{margin-top:.55rem;grid-template-columns:repeat(2,1fr);gap:.4rem}.demo-chip-grid:not([hidden]){display:grid}.demo-chip{border:1px solid rgba(26,122,70,.22);background:#fff;color:#14532d;border-radius:8px;padding:.45rem .5rem;font-size:.72rem;font-weight:600;line-height:1.2;text-align:center;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .1s ease}.demo-chip-grid:not([hidden]) .demo-chip{animation:cx-chip-in .32s cubic-bezier(.16,1,.3,1) both}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(1){animation-delay:.02s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(2){animation-delay:.05s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(3){animation-delay:.08s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(4){animation-delay:.11s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(5){animation-delay:.14s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(6){animation-delay:.17s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(7){animation-delay:.2s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(8){animation-delay:.23s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(9){animation-delay:.26s}.demo-chip-grid:not([hidden]) .demo-chip:nth-child(10){animation-delay:.29s}@keyframes cx-chip-in{0%{opacity:0;transform:translateY(6px) scale(.95)}to{opacity:1;transform:none}}.demo-chip:hover{background:#f0fdf4;border-color:#1a7a4680}.demo-chip.active{background:var(--primary, #1a7a46);border-color:var(--primary, #1a7a46);color:#fff;transform:scale(.98)}.error-alert{display:flex;align-items:flex-start;gap:.65rem;border:1px solid rgba(220,38,38,.25);color:#b91c1c;background:#fef2f2;border-radius:10px;padding:.65rem .75rem;margin-bottom:1rem}.error-content{font-size:.87rem;line-height:1.45}.form-group{margin-bottom:.75rem}.form-label{display:block;margin-bottom:.5rem;color:var(--gray-700);font-size:.87rem;font-weight:600}.input-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;right:.78rem;top:50%;transform:translateY(-50%);color:var(--cyberspace-blue);pointer-events:none;width:18px;height:18px;display:block;line-height:1}.input-wrapper:focus-within .input-icon{color:var(--cyberspace-green)}.form-input{flex:1;border:1px solid #b9c4d6;border-radius:10px;padding:.78rem .9rem;background:#fffffff5;color:var(--gray-900);font-size:.95rem;transition:border-color .2s ease,box-shadow .2s ease}.input-wrapper.with-toggle .form-input{padding-right:2.4rem}.form-input::placeholder{color:#8ea0bb}.form-input:focus{outline:none;border-color:var(--primary-light);box-shadow:0 0 0 3px #22c55e2e;animation:cx-input-pulse .5s ease-out}@keyframes cx-input-pulse{0%{box-shadow:0 0 #22c55e59}to{box-shadow:0 0 0 3px #22c55e2e}}#password::-ms-reveal,#password::-ms-clear{display:none}#password::-webkit-credentials-auto-fill-button,#password::-webkit-contacts-auto-fill-button{visibility:hidden;display:none!important;pointer-events:none}#togglePasswordBtn.password-toggle{position:absolute;right:.7rem;top:50%;transform:translateY(-50%);width:16px;height:16px;min-width:16px;min-height:16px;padding:0;margin:0;border:none;background:transparent;color:#94a3b8;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;outline:none;box-shadow:none;appearance:none;-webkit-appearance:none;border-radius:0}#togglePasswordBtn.password-toggle .icon-eye{width:16px;height:16px;pointer-events:none}#togglePasswordBtn.password-toggle:hover,#togglePasswordBtn.password-toggle:focus,#togglePasswordBtn.password-toggle:active{color:#64748b;background:transparent;border:none;box-shadow:none;outline:none}.input-error{border-color:#dc262680}.field-error{margin-top:.4rem;color:#b91c1c;font-size:.8rem;font-weight:500}.form-options{margin-top:.2rem;margin-bottom:.85rem;display:flex;align-items:center;justify-content:space-between;gap:.8rem}.checkbox-wrapper{display:inline-flex;align-items:center;gap:.45rem;font-size:.84rem;color:var(--gray-700)}.checkbox-input{width:15px;height:15px;accent-color:var(--primary)}.forgot-password-link{font-size:.84rem;color:var(--primary);font-weight:600;text-decoration:none}.forgot-password-link:hover{text-decoration:underline}.submit-button{position:relative;overflow:hidden;width:100%;border:0;border-radius:12px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 100%);color:#fff;padding:.86rem 1rem;display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-weight:700;font-size:1rem;cursor:pointer;box-shadow:0 8px 20px #1665343d;transition:transform .2s ease,box-shadow .2s ease}.submit-button:after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);transform:skew(-20deg);transition:left .65s ease;pointer-events:none}.submit-button:hover:after{left:130%}.submit-button:hover{transform:translateY(-1px);box-shadow:0 10px 24px #1665344d}.submit-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.form-footer{margin-top:.75rem;text-align:center}.back-home-link{display:inline-flex;align-items:center;gap:.4rem;color:var(--primary);text-decoration:none;font-weight:600;font-size:.84rem}.back-home-link:hover{color:#14532d}.notification{position:fixed;right:1rem;bottom:1rem;background:#111827;color:#fff;border-radius:10px;padding:.75rem .95rem;box-shadow:0 12px 30px #0000003d;transform:translateY(10px);opacity:0;transition:opacity .2s ease,transform .2s ease;z-index:1200}.notification.show{transform:translateY(0);opacity:1}.notification.success{background:#14532d}.notification.error{background:#991b1b}@media (max-width: 1024px){.login-minimalist-wrapper{min-height:calc(100vh - 70px);padding:1.25rem}}@media (max-width: 768px){.navbar-container{padding:.7rem .9rem}.navbar-title{font-size:.78rem}.navbar-subtitle{display:none}.login-form-panel{padding:.4rem}.form-wrapper{border-radius:12px;padding:1.1rem}.form-title{font-size:1.4rem}.form-description{font-size:.87rem}.demo-chip-grid{grid-template-columns:1fr}}@media (max-height: 700px){.login-minimalist-wrapper{align-items:flex-start;padding-top:.85rem;padding-bottom:.85rem}.form-wrapper{padding:1.1rem 1.4rem;max-height:none}.form-logo{width:38px;height:38px}.form-branding{margin-bottom:.35rem}.form-header-section{margin-bottom:.6rem}.form-title{font-size:1.25rem}.form-description{display:none}.form-group{margin-bottom:.55rem}}@media (prefers-reduced-motion: reduce){.login-minimalist-wrapper:after,.form-wrapper,.form-branding,.form-title,.form-description,.demo-quick-login,.login-form,.form-footer,.form-input:focus,.submit-button,.submit-button:after,.demo-chip-grid:not([hidden]) .demo-chip,.navbar-logo img{animation:none;transition:none}.form-branding,.form-title,.form-description,.demo-quick-login,.login-form,.form-footer,.demo-chip-grid:not([hidden]) .demo-chip{opacity:1;transform:none}}
