:root { --input-padding-x: 0.75rem; --input-padding-y: 0.75rem; } 
 .mx-input { height: 37px !important; font-size: 16px !important; background-color: #e0dbdb !important; } 
 .login { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; height: 100%; padding-top: 40px; padding-bottom: 40px; background-color: #f5f5f5; background: url('/static/image/bj5.png') no-repeat center #495057; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../public/static/image/bj5.jpg', sizingMethod='scale'); } 

 .form-signin { width: 100%; max-width: 420px; padding: 15px; margin: auto; } 

 .form-label-group { position: relative; margin-bottom: 1rem; } 

 .form-label-group>input,
 .form-label-group>label { padding: var(--input-padding-y) var(--input-padding-x); } 

 .form-label-group>label { position: absolute; top: 0; left: 0; display: block; width: 100%; margin-bottom: 0; line-height: 1.5; color: #495057; cursor: text; border: 1px solid transparent; border-radius: 0.25rem; transition: all 0.1s ease-in-out; } 

 html { height: 100%; } 

 body { height: 100%; background-color: #000; margin: 0; padding: 0; } 

 .lensflare { position: relative; overflow: hidden; width: 100%; min-height: 100%; } 

 .source-spread { position: absolute; background: radial-gradient(rgba(255, 225, 255, 0.05) 10%, rgba(255, 225, 255, 0.05) 30%, rgba(0, 0, 0, 0) 60%); border-radius: 50%; width: 2000px; height: 2000px; margin-top: -1000px; margin-left: -1000px; top: 14%; left: 14%; z-index: 0; } 

 .source { position: absolute; background: radial-gradient(#fff 0%, rgba(243, 206, 205, 0.4) 35%, rgba(88, 88, 88, 0.3) 60%, rgba(0, 0, 0, 0) 70%); border-radius: 50%; width: 800px; height: 800px; margin-top: -400px; margin-left: -400px; top: 14%; left: 14%; z-index: 2; } 

 .source-beam { position: absolute; background: radial-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0) 70%); border-radius: 50%; width: 2200px; height: 28px; margin-top: -14px; margin-left: -1100px; top: 14%; left: 14%; z-index: 1; } 

 .c1 { position: absolute; background: radial-gradient(ellipse at center, rgba(189, 91, 87, 0) 40%, rgba(189, 91, 87, 0.5) 45%, rgba(189, 91, 87, 0) 50%, rgba(189, 91, 87, 0) 100%); border-radius: 50%; width: 400px; height: 400px; margin-top: -200px; margin-left: -200px; top: 14%; left: 14%; z-index: 3; } 

 .c2 { position: absolute; background: radial-gradient(ellipse at center, rgba(162, 196, 134, 0) 20%, rgba(162, 196, 134, 0.3) 43%, rgba(67, 85, 52, 0) 50%, rgba(67, 85, 52, 0) 100%); border-radius: 50%; width: 300px; height: 300px; margin-top: -150px; margin-left: -150px; top: 3%; left: 3%; z-index: 4; } 

 .c3 { position: absolute; background: radial-gradient(ellipse at center, rgba(31, 99, 255, 0.1) 1%, rgba(31, 99, 255, 0.13) 100%); border-radius: 50%; width: 160px; height: 160px; margin-top: -80px; margin-left: -80px; top: 46%; left: 46%; z-index: 5; } 

 .c4 { position: absolute; background: radial-gradient(ellipse at center, rgba(31, 99, 255, 0.1) 1%, rgba(31, 99, 255, 0.13) 100%); border-radius: 50%; width: 50px; height: 50px; margin-top: -25px; margin-left: -25px; top: 44%; left: 44%; z-index: 6; } 

 .c5 { position: absolute; background: radial-gradient(ellipse at center, rgba(31, 99, 255, 0.1) 1%, rgba(31, 99, 255, 0.13) 100%); border-radius: 50%; width: 88px; height: 88px; margin-top: -44px; margin-left: -44px; top: 47%; left: 47%; z-index: 7; } 

 .c6 { position: absolute; background: radial-gradient(ellipse at center, rgba(255, 129, 57, 0.15) 1%, rgba(255, 129, 57, 0.2) 100%); border-radius: 50%; width: 88px; height: 88px; margin-top: -44px; margin-left: -44px; top: 57%; left: 57%; z-index: 8; } 

 .c7 { position: absolute; background: radial-gradient(rgba(255, 225, 255, 0.9) 10%, rgba(137, 255, 220, 0.4) 30%, rgba(0, 0, 0, 0) 60%); border-radius: 50%; width: 16px; height: 16px; margin-top: -8px; margin-left: -8px; top: 62%; left: 62%; z-index: 9; } 

 .c8 { position: absolute; background: radial-gradient(ellipse at center, rgba(255, 129, 57, 0.15) 10%, rgba(187, 129, 57, 0.2) 50%, rgba(255, 129, 57, 0.2) 60%, rgba(0, 0, 0, 0) 65%); border-radius: 50%; width: 190px; height: 190px; margin-top: -95px; margin-left: -95px; top: 71%; left: 71%; z-index: 10; } 

 .c9 { position: absolute; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.15) 1%, rgba(255, 129, 57, 0.2) 100%); border-radius: 50%; width: 104px; height: 104px; margin-top: -52px; margin-left: -52px; top: 70%; left: 70%; z-index: 11; } 

 .c10 { position: absolute; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.15) 1%, rgba(255, 129, 57, 0.2) 100%); border-radius: 50%; width: 60px; height: 60px; margin-top: -30px; margin-left: -30px; top: 72%; left: 72%; z-index: 12; } 

 .c11 { position: absolute; background: radial-gradient(rgba(255, 225, 255, 0.9) 10%, rgba(137, 255, 220, 0.4) 30%, rgba(0, 0, 0, 0) 60%); border-radius: 50%; width: 22px; height: 22px; margin-top: -11px; margin-left: -11px; top: 75%; left: 75%; z-index: 13; } 

 .c12 { position: absolute; background: radial-gradient(ellipse at center, rgba(73, 168, 199, 0.15) 10%, rgba(100, 145, 42, 0.2) 30%, rgba(100, 145, 42, 0.2) 60%, rgba(0, 0, 0, 0) 65%); border-radius: 50%; width: 80px; height: 80px; margin-top: -40px; margin-left: -40px; top: 81%; left: 81%; z-index: 14; } 

 .c13 { position: absolute; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.5) 4%, rgba(100, 145, 42, 0.2) 36%, rgba(163, 240, 63, 0.2) 38%, rgba(100, 145, 42, 0.1) 40%, rgba(189, 91, 87, 0) 43%); border-radius: 50%; width: 240px; height: 240px; margin-top: -120px; margin-left: -120px; top: 88%; left: 88%; z-index: 15; } 

 .c14 { position: absolute; background: radial-gradient(ellipse at center,
 rgba(189, 91, 87, 0) 39%,
 rgba(94, 29, 191, 0.2) 41%,
 rgba(29, 71, 191, 0.2) 42%,
 rgba(191, 113, 29, 0.2) 43%,
 rgba(189, 91, 87, 0) 45%,
 rgba(189, 91, 87, 0) 100%); border-radius: 50%; width: 600px; height: 600px; margin-top: -300px; margin-left: -300px; top: 99%; left: 99%; z-index: 16; } 

 .container-hci { width: 300px; margin: 50px auto; padding: 20px; border: 1px solid #ccc; border-radius: 5px; } 

 .verify-container-hci { position: relative; width: 250px; height: 150px; margin: 20px 0; background: #f0f0f0; user-select: none; overflow: hidden; border-radius: 5px; } 

 .verify-text { position: absolute; cursor: pointer; font-size: 16px; padding: 3px 6px; background: white; border: 1px solid #ddd; border-radius: 3px; transition: all 0.3s ease; white-space: nowrap; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } 

 .verify-text.active { color: white; background: #4caf50; transform: scale(1.1); } 

 .message { color: red; margin: 10px 0; }