*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background-color:#f3f4f6;color:#111827}.app{min-height:100vh;display:flex;flex-direction:column;align-items:stretch}.toast-wrap{position:fixed;top:.6rem;left:50%;transform:translate(-50%);width:calc(100% - 1.5rem);max-width:520px;display:flex;flex-direction:column;gap:.5rem;z-index:1000;pointer-events:none}.toast{pointer-events:none;border-radius:.75rem;padding:.6rem .75rem;font-size:.85rem;box-shadow:0 10px 22px #0f172a1f;border:1px solid #e5e7eb;background-color:#fff;color:#111827}.toast-success{border-color:#2ecc7159;background-color:#ecfdf5}.toast-info{border-color:#3b82f659;background-color:#eff6ff}.toast-warning{border-color:#f59e0b66;background-color:#fffbeb}.toast-error{border-color:#ef444459;background-color:#fef2f2}.header{display:flex;align-items:center;justify-content:space-between;padding:.6rem .9rem;background-color:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:10}.header h1{font-size:1rem;margin:0}.brand{display:flex;align-items:center;gap:.5rem}.brand-logo{width:40px;height:40px}.brand-text h1{font-size:.9rem;font-weight:700}.brand-text p{margin:.1rem 0 0;font-size:.7rem;color:#6b7280}.status-pill{display:flex;align-items:center;padding:.15rem .5rem;border-radius:999px;background-color:#f3f4f6}.header-right{display:flex;align-items:center;gap:.4rem}.status-dot{width:.6rem;height:.6rem;border-radius:999px;margin-right:.25rem}.status-dot.online{background-color:#22c55e}.status-dot.offline{background-color:#f97316}.status-text{font-size:.8rem;color:#6b7280}.main{flex:1;display:flex;justify-content:center;padding:.75rem .75rem 1rem}.form{width:100%;max-width:480px;background-color:#fff;border-radius:.9rem;border:1px solid #e5e7eb;padding:1rem;box-shadow:0 8px 20px #0f172a14}.form-heading{margin-bottom:.75rem}.form-heading h2{margin:0 0 .15rem;font-size:1rem}.form-heading p{margin:0;font-size:.75rem;color:#6b7280}.field{display:flex;flex-direction:column;margin-bottom:.75rem}.field label{font-size:.8rem;margin-bottom:.25rem;color:#4b5563}.field input,.field textarea,.field select,.field button{font-size:.9rem}.field input,.field textarea,.field select{width:100%;max-width:100%}.field input,.field textarea,.field select{padding:.5rem .6rem;border-radius:.5rem;border:1px solid #d1d5db;background-color:#fff;color:#111827}.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid #2ecc71;outline-offset:1px;border-color:transparent}.inline{flex-direction:row;flex-wrap:wrap;gap:.5rem}.inline>div{flex:1 1 45%;min-width:0}.inline button{flex:1 1 100%;margin-top:.25rem;width:100%;max-width:100%;min-width:0}button{cursor:pointer;max-width:100%}.submit{width:100%;margin-top:.5rem;padding:.7rem;border-radius:.75rem;border:none;background:linear-gradient(to right,#2ecc71,#1abc9c);color:#fff;font-weight:600}.submit:disabled{opacity:.75;cursor:not-allowed}.submit-content{display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.spinner{width:1rem;height:1rem;border-radius:999px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.submit:active{transform:scale(.98)}.status-message,.sync-message{margin-top:.5rem;font-size:.8rem;color:#4b5563}.exports{margin-top:1rem;border-top:1px solid #e5e7eb;padding-top:.75rem}.exports h2{font-size:.9rem;margin:0 0 .5rem}.export-link{display:block;font-size:.85rem;color:#2563eb;text-decoration:none;margin-bottom:.25rem}.export-link:active{opacity:.8}.logout-button{border:none;background:transparent;color:#6b7280;font-size:.75rem}.logout-button:active{opacity:.7}