:root{--bg: #0f172a;--card: #111827;--text: #e5e7eb;--muted: #9ca3af;--accent: #3b82f6;--accent-2: #22d3ee;--error: #ef4444;--success: #10b981}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Helvetica Neue,sans-serif;background:linear-gradient(120deg,var(--bg),#0b1225 60%,#091020 100%);color:var(--text);display:grid;place-items:center;min-height:100vh}.container{width:100%;max-width:720px;padding:10px}.card{background:linear-gradient(180deg,#0e162b,#0c1426);border:1px solid #1f2937;border-radius:12px;padding:20px;box-shadow:0 10px 30px #00000059;margin:0 auto;width:800px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}header h1{font-size:1.25rem;margin:0;font-weight:600;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-title{font-size:1.25rem;margin:0;font-weight:600;letter-spacing:.2px;flex-direction:column;flex:1 1 25%}.profile-badge{flex-direction:column;align-items:center;text-align:right;margin-left:20px;flex:1 1 25%}.display-email{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;font-size:.85rem;color:var(--text);background:linear-gradient(180deg,#132646,#0f1f39);border:1px solid #2a3a54;border-radius:8px;cursor:pointer;box-shadow:0 6px 18px #00000059;transition:transform .05s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease;-webkit-user-select:none;user-select:none}.display-email:hover{border-color:#3b5a8a;box-shadow:0 10px 28px #00000073;transform:translateY(-1px)}.display-email:active{transform:translateY(1px)}.spacer{flex-direction:column;flex:2 2 50%}.status{font-size:.9rem;color:var(--muted)}.btn{appearance:none;-webkit-appearance:none;border:1px solid #2a3a54;background:linear-gradient(180deg,#132646,#0f1f39);color:var(--text);padding:10px 14px;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:1rem;line-height:1;text-decoration:none;transition:transform .05s ease,border-color .2s ease,box-shadow .2s ease}.btn:hover{border-color:#3b5a8a;box-shadow:0 6px 18px #00000059}.btn:active{transform:translateY(1px)}.btn.primary{border-color:#1e3a8a;background:linear-gradient(180deg,#1e3a8a,#172554)}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:12px}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:.95rem;color:var(--muted)}select,input[type=text],textarea{border:1px solid #25324a;background:#0b162c;color:var(--text);border-radius:8px;padding:10px;font-size:1rem;outline:none}select:focus,input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #3b82f640}textarea{min-height:100px;resize:vertical}.row-span-2{grid-column:1 / -1}.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.dropdown-wrapper{display:flex;gap:6px;align-items:stretch}.dropdown-wrapper select{flex:1}.btn-plus{appearance:none;border:1px solid #2a3a54;background:linear-gradient(180deg,#132646,#0f1f39);color:var(--text);padding:0 12px;border-radius:8px;cursor:pointer;transition:transform .05s ease,border-color .2s ease,box-shadow .2s ease;font-size:1.2rem;font-weight:700;min-width:40px}.btn-plus:hover{border-color:#3b5a8a;box-shadow:0 6px 18px #00000059}.btn-plus:active{transform:translateY(1px)}.hidden{display:none!important}.message{margin-top:12px;font-size:.95rem}.message.error{color:var(--error)}.message.success{color:var(--success)}footer{margin-top:14px;font-size:.85rem;color:var(--muted);text-align:center}.modal-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:linear-gradient(180deg,#0e162b,#0c1426);border:1px solid #1f2937;border-radius:12px;padding:20px;max-width:500px;width:100%;box-shadow:0 20px 60px #00000080;max-height:90vh;overflow-y:auto}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.modal-header h2{font-size:1.1rem;margin:0;font-weight:600}.modal-close{background:none;border:none;color:var(--muted);font-size:1.5rem;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background .2s,color .2s}.modal-close:hover{background:#ffffff1a;color:var(--text)}.modal-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;align-items:start}.modal-form .field{display:flex;flex-direction:column;gap:6px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.modal-content input,.modal-content select,.modal-content textarea{border:1px solid #25324a;background:#0b162c;color:var(--text);border-radius:8px;padding:10px;font-size:1rem;outline:none;width:100%;box-sizing:border-box;font-family:inherit}.modal-content input:focus,.modal-content select:focus,.modal-content textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #3b82f61f}.modal-form .row-span-2{grid-column:1 / -1}@media(max-width:520px){.dropdown-wrapper{display:flex;align-items:center;gap:8px}.dropdown-wrapper select{flex:1 1 auto;min-width:0;max-width:calc(100% - 56px)}.btn-plus{flex:0 0 44px;padding:0;height:40px;display:inline-flex;align-items:center;justify-content:center}input,select,textarea{padding:8px 10px}.card{width:100%}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}