*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app{flex-direction:column;min-height:100vh;padding:20px;display:flex}.auth-container{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.auth-card{background:#fff;border-radius:16px;width:100%;max-width:500px;padding:40px;box-shadow:0 20px 60px #0000004d}.auth-card h1{text-align:center;color:#667eea;margin-bottom:10px;font-size:2.5rem}.auth-subtitle{text-align:center;color:#666;margin-bottom:40px;font-size:1.1rem}.auth-section{margin-bottom:30px}.auth-section h2{color:#333;margin-bottom:10px;font-size:1.3rem}.auth-description{color:#666;margin-bottom:20px;font-size:.95rem;line-height:1.5}.divider{color:#999;align-items:center;margin:30px 0;display:flex}.divider:before,.divider:after{content:"";border-bottom:1px solid #ddd;flex:1}.divider span{padding:0 15px;font-weight:600}.code-input{text-align:center;letter-spacing:.2em;text-transform:uppercase;border:2px solid #ddd;border-radius:8px;width:100%;margin-bottom:10px;padding:15px;font-family:Courier New,monospace;font-size:1.5rem;transition:border-color .3s}.code-input:focus{border-color:#667eea;outline:none}.error-message{color:#e74c3c;text-align:center;margin-bottom:10px;font-size:.9rem}.btn{cursor:pointer;border:none;border-radius:8px;width:100%;padding:15px 25px;font-size:1.1rem;font-weight:600;transition:all .3s}.btn-primary{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 20px #667eea66}.btn-secondary{color:#fff;background:#34495e}.btn-secondary:hover{background:#2c3e50;transform:translateY(-2px);box-shadow:0 5px 20px #34495e66}.btn-small{width:auto;margin-left:10px;padding:8px 16px;font-size:.9rem}.btn-logout{background:#e74c3c}.btn-logout:hover{background:#c0392b}.header{color:#fff;margin-bottom:20px}.header-content{justify-content:space-between;align-items:center;max-width:900px;margin:0 auto;display:flex}.header h1{text-shadow:2px 2px 4px #0003;margin-bottom:5px;font-size:2rem}.subtitle{opacity:.9;font-size:1rem}.subtitle strong{letter-spacing:.1em;background:#fff3;border-radius:4px;padding:2px 8px;font-family:Courier New,monospace}.header-actions{align-items:center;display:flex}.qr-container{justify-content:center;margin-bottom:20px;display:flex}.qr-card{text-align:center;background:#fff;border-radius:12px;padding:30px;box-shadow:0 10px 40px #0003}.qr-card h3{color:#333;margin-bottom:20px;font-size:1.3rem}.qr-code-text{color:#667eea;letter-spacing:.2em;margin:15px 0;font-family:Courier New,monospace;font-size:1.8rem;font-weight:700}.qr-instruction{color:#666;margin-top:10px;font-size:.9rem}.main{flex:1;justify-content:center;align-items:stretch;width:100%;max-width:900px;margin:0 auto;display:flex}.note-textarea{resize:vertical;background:#fff;border:none;border-radius:12px;width:100%;min-height:400px;padding:25px;font-family:Courier New,Courier,monospace;font-size:1.1rem;line-height:1.6;transition:box-shadow .3s;box-shadow:0 10px 40px #0003}.note-textarea:focus{outline:none;box-shadow:0 15px 50px #0000004d}.note-textarea::placeholder{color:#999;font-style:italic}.footer{text-align:center;color:#fff;opacity:.8;margin-top:30px;font-size:.95rem}@media (width<=768px){.auth-card{padding:30px 20px}.header-content{text-align:center;flex-direction:column}.header-actions{flex-wrap:wrap;justify-content:center;margin-top:15px}.btn-small{margin:5px}.header h1{font-size:1.5rem}.subtitle{font-size:.9rem}.note-textarea{padding:20px;font-size:1rem}.qr-card{padding:20px}.code-input{font-size:1.2rem}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}#root{width:100%;min-height:100vh}