:root{--primary-gradient-light: linear-gradient(135deg, #ff9a9e, #fecfef);--primary-gradient-dark: linear-gradient(135deg, #2c3e50, #4ca1af);--primary-color-light: #ff758c;--primary-color-dark: #00c6ff}:root{--primary-gradient: linear-gradient(135deg, #667eea, #764ba2);--primary-color: #4961c9;--primary-hover: #535bf2;--background-dark: #2b0d4a;--background-light: #2dd1d6;--text-dark: #213547;--text-light: rgba(255, 255, 255, .87);font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--text-light);background:var(--primary-gradient);min-height:100vh;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:var(--primary-color);text-decoration:none;transition:color .3s ease}a:hover{color:var(--primary-hover)}body{margin:0;display:flex;place-items:center;justify-content:center;min-width:320px;min-height:100vh;background:var(--primary-gradient)}h1,h2{font-weight:700;letter-spacing:-.5px;margin:0 0 1rem;text-align:center}button{border-radius:8px;border:1px solid transparent;padding:.75rem 1.2rem;font-size:1rem;font-weight:600;font-family:inherit;background-color:#1a1a1a;color:#fff;cursor:pointer;transition:all .3s ease}button:hover{border-color:var(--primary-color);transform:translateY(-2px);box-shadow:0 6px 14px #0003}button:focus{outline:3px solid rgba(102,126,234,.4);outline-offset:2px}@media (prefers-color-scheme: light){:root{color:var(--text-dark);background:linear-gradient(135deg,#f9f9f9,#dfe9f3)}body{background:linear-gradient(135deg,#f9f9f9,#dfe9f3)}button{background-color:#f9f9f9;color:#213547}}.app{background:var(--background-light);color:var(--text-dark);height:100vh;display:flex;flex-direction:column}.app.dark{background:var(--background-dark);color:var(--text-light)}.dashboard{display:flex;flex:1}.dashboard .chatroom-list button{background:transparent;border:none;cursor:pointer;color:inherit;padding:.5rem 1rem;border-radius:6px;transition:background .3s ease}.dashboard .chatroom-list button:hover{background:#0000000d}.app.dark .dashboard .chatroom-list button:hover{background:#ffffff1a}.login-page h2{font-size:2rem;font-weight:700;text-align:center;margin-bottom:1.5rem;background:linear-gradient(90deg,#ff758c,#ff7eb3);-webkit-background-clip:text;-webkit-text-fill-color:transparent;color:transparent;transition:all .3s ease}.login-page h2:hover{background:linear-gradient(90deg,#ff7eb3,#ff758c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;transform:scale(1.05)}.login-container{background:#fff;padding:2rem;border-radius:18px;box-shadow:0 8px 28px #0003;text-align:center;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;animation:fadeIn .5s ease-in-out;width:100%;max-width:620px}.login-container h2{margin-bottom:1.5rem;font-size:1.7rem;color:#333;font-weight:700}.login-container input{padding:.8rem 1rem;border:1px solid #ccc;border-radius:10px;width:100%;font-size:1rem;margin-bottom:1.2rem;transition:border-color .3s ease,box-shadow .3s ease}.login-container input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #667eea4d;outline:none}.login-container button{background:var(--primary-gradient);color:#fff;border:none;border-radius:10px;padding:.9rem 1rem;width:100%;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .3s ease}.login-container button:hover{transform:translateY(-2px);box-shadow:0 8px 18px #00000040}.login-container button:active{transform:translateY(0)}.app.dark .login-container{background:#1e1e1e;color:#e0e0e0}.app.dark .login-container h2{color:#fff}.app.dark .login-container input{background:#2a2a2a;color:#fff;border:1px solid #444}.app.dark .login-container input:focus{border-color:var(--primary-color)}.app.dark .login-container button{background:var(--primary-gradient);color:#fff}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 500px){.login-container{padding:1.5rem;border-radius:14px}}.login-page{background:linear-gradient(135deg,#667eea,#764ba2);color:#000;transition:all .3s ease}.login-page{background:linear-gradient(135deg,#667eea,#764ba2);color:#000;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:420px;min-height:80vh;padding:2rem;margin:2rem auto;border-radius:16px;box-shadow:0 8px 28px #0003}.login-page.dark input,.login-page.dark select{background:#2a2a2a;color:#fff;border:1px solid #444}.login-page.dark button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}