:root{--cf-orange: #f38020;--cf-blue: #003682;--cf-dark: #1a1a2e;--cf-bg: #f5f5f5;--cf-card: #ffffff;--cf-border: #e0e0e0;--cf-success: #16a34a;--cf-error: #dc2626;--cf-text: #1a1a1a;--cf-muted: #6b7280;--radius: 8px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:var(--cf-bg);color:var(--cf-text);min-height:100vh}.container{max-width:480px;margin:0 auto;padding:2rem 1rem}.container-wide{max-width:960px;margin:0 auto;padding:2rem 1rem}.logo{text-align:center;margin-bottom:2rem}.logo h1{font-size:1.5rem;color:var(--cf-blue)}.logo .domain{color:var(--cf-orange);font-weight:700}.card{background:var(--cf-card);border:1px solid var(--cf-border);border-radius:var(--radius);padding:1.5rem;margin-bottom:1rem}.card h2{font-size:1.1rem;margin-bottom:1rem;color:var(--cf-blue)}label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.25rem;color:var(--cf-muted)}input[type=email],input[type=text],textarea{width:100%;padding:.6rem .75rem;border:1px solid var(--cf-border);border-radius:var(--radius);font-size:1rem;margin-bottom:.75rem}input:focus,textarea:focus{outline:2px solid var(--cf-orange);outline-offset:-1px;border-color:var(--cf-orange)}.pin-input{font-size:1.5rem;letter-spacing:.5em;text-align:center;font-family:monospace}button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 1.25rem;font-size:.9rem;font-weight:600;border:none;border-radius:var(--radius);cursor:pointer;transition:background .15s,opacity .15s;text-decoration:none}.btn-primary{background:var(--cf-orange);color:#fff}.btn-primary:hover{background:#d96e1a}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--cf-blue);color:#fff}.btn-secondary:hover{background:#002a6b}.btn-outline{background:transparent;color:var(--cf-text);border:1px solid var(--cf-border)}.btn-outline:hover{background:#f0f0f0}.btn-sm{padding:.35rem .75rem;font-size:.8rem}.error{color:var(--cf-error);font-size:.85rem;margin-bottom:.5rem}.success{color:var(--cf-success);font-size:.85rem;margin-bottom:.5rem}.credential{background:#f0f4ff;border:1px solid #c8d6f0;border-radius:var(--radius);padding:1rem;margin-bottom:.75rem;font-family:monospace;font-size:1.05rem;word-break:break-all;position:relative}.credential .label{display:block;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.75rem;font-weight:600;color:var(--cf-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}.credential .copy-btn{position:absolute;top:.5rem;right:.5rem;background:transparent;border:1px solid var(--cf-border);border-radius:4px;padding:.2rem .4rem;font-size:.75rem;cursor:pointer;color:var(--cf-muted)}.credential .copy-btn:hover{background:#e8ecf4}.status-pill{display:inline-block;padding:.15rem .5rem;font-size:.75rem;font-weight:600;border-radius:999px;text-transform:uppercase}.status-pending{background:#fef3c7;color:#92400e}.status-active{background:#dcfce7;color:#166534}.status-expired{background:#fee2e2;color:#991b1b}.status-accepted{background:#dbeafe;color:#1d4ed8}.invite-btn{display:block;width:100%;text-align:center;padding:.75rem;background:var(--cf-orange);color:#fff;font-weight:600;border-radius:var(--radius);text-decoration:none;margin-top:.5rem}.invite-btn:hover{background:#d96e1a}.expiry{text-align:center;font-size:.8rem;color:var(--cf-muted);margin-top:.5rem}.disclaimer{text-align:center;font-size:.75rem;color:var(--cf-muted);margin-top:2rem;padding-top:1rem;border-top:1px solid var(--cf-border)}.roster-table{width:100%;border-collapse:collapse;font-size:.85rem}.roster-table th,.roster-table td{text-align:left;padding:.5rem .75rem;border-bottom:1px solid var(--cf-border)}.roster-table th{background:#f8f8f8;font-weight:600;color:var(--cf-muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}.roster-table tr:hover{background:#fafafa}.mono{font-family:monospace;font-size:.8rem}.toolbar{display:flex;gap:.5rem;margin-bottom:1rem;align-items:center;flex-wrap:wrap}select{padding:.4rem .6rem;border:1px solid var(--cf-border);border-radius:var(--radius);font-size:.85rem}textarea{min-height:100px;resize:vertical}