.demo-screen{max-width:800px;margin:0 auto}.demo-screen h2{color:#374151;border-bottom:2px solid #e5e7eb;padding-bottom:10px;margin-bottom:20px}.demo-section{margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #f3f4f6}.demo-section:last-child{border-bottom:none}.demo-section h3{color:#4b5563;margin-bottom:10px}.demo-section h4{color:#6b7280;margin-bottom:8px}.demo-action{margin:20px 0}.user-info{background-color:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:16px;margin:16px 0}.user-info p{margin:4px 0}.code-example{background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px;margin-top:20px}.code-example h4{margin-top:0;color:#374151}.code-example pre{background-color:#1f2937;color:#f9fafb;padding:12px;border-radius:6px;overflow-x:auto;font-size:14px;line-height:1.4}.info-box{margin:20px 0}.info-box h4{margin-top:0;color:#1e40af}.info-box ol{margin:8px 0;padding-left:20px}.info-box li{margin:4px 0}.button{padding:10px 20px;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.button.secondary{background-color:#6b7280;color:#fff}.button.secondary:hover{background-color:#4b5563}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:4px;font-weight:500;color:#374151}.form-group input{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:4px;font-size:14px}.form-group input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.error{background-color:#fef2f2;border:1px solid #fecaca;color:#dc2626;padding:12px;border-radius:6px;margin:16px 0}.loading{text-align:center;padding:40px;color:#6b7280}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}.container{max-width:800px;margin:0 auto;padding:20px}.header{text-align:center;margin-bottom:40px}.auth-section{background:#f5f5f5;padding:20px;border-radius:8px;margin-bottom:20px}.auth-section h3{margin-top:0}.button{background:#007bff;color:#fff;border:none;padding:10px 20px;border-radius:4px;cursor:pointer;margin:5px;font-size:14px}.button:hover{background:#0056b3}.button:disabled{background:#6c757d;cursor:not-allowed}.button.secondary{background:#6c757d}.button.secondary:hover{background:#5a6268}.user-info{background:#d4edda;border:1px solid #c3e6cb;color:#155724;padding:15px;border-radius:4px;margin:10px 0}.error{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24;padding:15px;border-radius:4px;margin:10px 0}.loading{color:#6c757d;font-style:italic}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:5px;font-weight:700}.form-group input{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.form-group input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px #007bff40}