*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6;background-color:#f4f7f9;color:#333}#app{max-width:1200px;margin:0 auto;padding:2rem}header{margin-bottom:2rem;text-align:center}h1{color:#2c3e50}.form-container,.table-container{background-color:#fff;padding:2rem;border-radius:8px;box-shadow:0 4px 6px #0000001a;margin-bottom:2rem}h2{margin-bottom:1.5rem;color:#34495e;border-bottom:2px solid #e0e0e0;padding-bottom:.5rem}form{display:flex;gap:1rem;align-items:center}input{width:100%;padding:.75rem;border:1px solid #ccc;border-radius:4px;font-size:1rem}.add-form{flex-wrap:wrap}.add-form input{flex:1 1 300px}button{padding:.75rem 1.5rem;border:none;border-radius:4px;color:#fff;background-color:#3498db;cursor:pointer;font-size:1rem;transition:background-color .3s ease}button:hover{background-color:#2980b9}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:1rem;border-bottom:1px solid #ddd;vertical-align:middle}td input{padding:.5rem}thead th{background-color:#f9fafb;font-weight:600}.token-cell{max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:help}.actions{display:flex;gap:.5rem}.actions button{padding:.5rem 1rem;font-size:.875rem}.edit-btn,.save-btn{background-color:#2ecc71}.edit-btn:hover,.save-btn:hover{background-color:#27ae60}.delete-btn,.cancel-btn{background-color:#e74c3c}.delete-btn:hover,.cancel-btn:hover{background-color:#c0392b}.signin-btn{background-color:#9b59b6}.signin-btn:hover{background-color:#8e44ad}@media (max-width: 768px){#app{padding:1rem}.form-container,.table-container{padding:1.5rem 1rem}h1{font-size:1.75rem}h2{font-size:1.25rem}.add-form{flex-direction:column;align-items:stretch}.add-form button{width:100%}table{border:0}thead{border:none;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}tr{display:block;border-radius:8px;box-shadow:0 2px 8px #0000001a;margin-bottom:1.5rem;background:#fff}tr.no-hover{box-shadow:none;background:transparent}td{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;border-bottom:1px solid #f0f0f0;text-align:right}tr td:last-child{border-bottom:0}td:before{content:attr(data-label);font-weight:600;color:#34495e;text-align:left;margin-right:1rem}td.token-cell{white-space:normal;word-break:break-all}td.actions{flex-direction:column;gap:.75rem;align-items:stretch}td.actions:before{display:none}.actions button{width:100%;text-align:center}}
