@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700&display=swap');:root{--primary-color:#e8a9c8;--white-color:#ffffff;--black-color:rgba(0,0,0,.95);--light-text-color:#8a8a8a;--light-bg-color:#f3f3f3;--dark-color:#333333;--background-color:#fcfcff;--secondary-text:#777;--button-text:#fff}@media (prefers-color-scheme:dark){:root{--primary-color:#8A6376;--white-color:#000000;--black-color:rgba(255,255,255,.95);--light-text-color:#5E5E5E;--light-bg-color:#1c1c1c;--dark-color:#333333;--background-color:#000000;--secondary-text:#9B9B9B;--button-text:rgba(200,200,200,.8)}body{color-scheme:dark}}*{margin:0;padding:0}*,::before,::after{box-sizing:border-box}body{font-family:'Noto Sans SC',sans-serif;font-size:16px;font-weight:400;line-height:1.8;color:var(--dark-color);background-color:var(--background-color);user-select:none;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px}a{text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent}h1{font-size:3.5em;font-weight:700;line-height:1.2;color:var(--black-color);margin-bottom:25px}.login{display:flex;flex-wrap:wrap;gap:80px;width:80%;max-width:1200px;align-items:center;justify-content:center}.titlepage{flex:1;position:relative;display:flex;flex-direction:column;justify-content:center;gap:30px;min-width:350px;max-width:500px}.titlepage::before{content:'';position:absolute;top:15%;left:-20px;width:280px;height:100px;background:linear-gradient(to right,var(--primary-color),#c471ed,#f64f59);z-index:-1;filter:blur(70px);opacity:0.7}.titlepage p{color:var(--secondary-text);font-size:1.2em;line-height:1.6}.titlepage a{font-weight:500;color:var(--primary-color);transition:color .3s}.titlepage a:hover{color:var(--dark-color);text-decoration:underline}.main{flex:0.4;min-width:320px;max-width:380px;display:flex;flex-direction:column;justify-content:center}.main form{display:flex;flex-direction:column;gap:25px;width:100%}.main form p{position:relative}form input{font:inherit;font-size:16px;width:100%;border:2px solid var(--primary-color);border-radius:12px;outline:0;padding:0 20px;line-height:60px;border-radius:12px;box-sizing:border-box;transition:all 0.3s}input::placeholder{color:var(--light-text-color);font-family:'Noto Sans SC',sans-serif}form input:not(.submit){background-color:var(--light-bg-color);border:1px solid transparent}form input:not(.submit):focus{border-color:var(--primary-color);background-color:var(--white-color)}.detailbutton{text-align:center;margin:-5px 0 15px}.detailbutton a{font-size:15px;color:var(--light-text-color);transition:color 0.3s}.detailbutton a:hover{color:var(--primary-color);text-decoration:underline}form input.submit{font-size:18px;font-weight:600;color:var(--button-text);background-color:var(--primary-color);cursor:pointer;transition:all 0.3s;box-shadow:var(--primary-color) 0 5px 20px -5px}form input.submit:hover{box-shadow:var(--primary-color) 0 5px 30px -10px;transform:translateY(1px);filter:brightness(1.2)}form input.submit:active{box-shadow:var(--primary-color) 0 5px 25px;filter:none;transform:translateY(1px) scale(.95)}@media (max-width:1100px){body{padding:30px}.login{gap:60px}h1{font-size:3em}}@media (max-width:973px){.login{flex-direction:column;gap:50px;text-align:center}.titlepage::before{left:50%;transform:translateX(-50%)}.main{max-width:400px;width:100%}h1{font-size:2.8em}}@media (max-width:600px){body{padding:20px}h1{font-size:2.5em}.titlepage p{font-size:1.1em}.titlepage,.main{min-width:auto;width:100%}.main{max-width:390px}}@media (max-width:480px){body{padding:15px}.login{gap:40px}h1{font-size:2.2em}form input{line-height:55px;font-size:15px}.titlepage p{font-size:1em}.main{max-width:360px}}@media (max-width:380px){.main{max-width:280px}form input{padding:0 15px}}