*{box-sizing:border-box;margin:0;padding:0} body{font-family:'Segoe UI',Arial,sans-serif;background:#0d1117;color:#c9d1d9;font-size:13px;display:flex;height:100vh;overflow:hidden} /* Sidebar */ #sidebar{width:200px;min-width:200px;background:#161b22;border-right:1px solid #30363d;display:flex;flex-direction:column;padding:12px 0;z-index:600} #sidebar .logo{padding:10px 16px 16px;border-bottom:1px solid #30363d;margin-bottom:8px} #sidebar .logo .brand{font-size:16px;font-weight:800;color:#58a6ff;letter-spacing:-.3px} #sidebar .logo .sub{font-size:11px;color:#8b949e;font-weight:600;margin-top:2px} #sidebar nav a{display:block;padding:8px 16px;color:#8b949e;text-decoration:none;border-radius:6px;margin:1px 8px;font-size:13px;cursor:pointer;transition:background .15s,color .15s;user-select:none} #sidebar nav a:hover{background:#21262d;color:#c9d1d9} #sidebar nav a.active{background:#1f6feb22;color:#58a6ff;font-weight:600} #sidebar .user-info{margin-top:auto;padding:10px 16px;border-top:1px solid #30363d;font-size:11px;color:#8b949e;display:flex;align-items:center;gap:6px} .conn-dot{width:7px;height:7px;border-radius:50%;display:inline-block;flex-shrink:0} .conn-ok{background:#3fb950}.conn-err{background:#f85149}.conn-wait{background:#d29922} /* Main */ #main{flex:1;display:flex;flex-direction:column;overflow:hidden} /* Topbar */ #topbar{background:#161b22;border-bottom:1px solid #30363d;padding:6px 16px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:48px} .page-title{font-size:14px;font-weight:600;color:#c9d1d9;flex-shrink:0} .btn{padding:5px 12px;border:1px solid #30363d;border-radius:6px;background:#21262d;color:#c9d1d9;cursor:pointer;font-size:12px;transition:background .15s;white-space:nowrap} .btn:hover{background:#30363d} .btn:disabled{opacity:.4;cursor:not-allowed} .btn-primary{background:#1f6feb;border-color:#1f6feb;color:#fff} .btn-primary:hover{background:#388bfd} .btn-success{background:#238636;border-color:#238636;color:#fff} .btn-success:hover{background:#2ea043} .btn-danger{background:#da3633;border-color:#da3633;color:#fff} .btn-danger:hover{background:#f85149} .btn-sm{padding:3px 8px;font-size:11px} #search-box{padding:5px 10px;background:#0d1117;border:1px solid #30363d;border-radius:6px;color:#c9d1d9;font-size:12px;width:220px;outline:none;transition:border .15s} #search-box:focus{border-color:#58a6ff} #topbar-filters{display:flex;align-items:center;gap:6px;flex-wrap:wrap} #topbar-right{margin-left:auto;display:flex;gap:6px;align-items:center} /* Stat row */ #stat-row{padding:6px 10px;display:flex;gap:5px;flex-wrap:wrap;border-bottom:1px solid #30363d;align-items:center;flex-shrink:0} .ord-cube{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 12px;border-radius:5px;border:1px solid;cursor:pointer;min-width:86px;line-height:1.4;flex-shrink:0;transition:filter .15s,outline .1s} .ord-cube:hover{filter:brightness(1.18)} .oc-lbl{font-size:10px;font-weight:600;opacity:.85;white-space:nowrap;text-align:center} .oc-val{font-size:18px;font-weight:700;white-space:nowrap} .oc-all {background:#133225;border-color:#5fd98b;color:#a5d6a7} .oc-prog {background:#0d2137;border-color:#42a5f5;color:#90caf9} .oc-closed{background:#1a2d00;border-color:#8bc34a;color:#dcedc8} .oc-lost {background:#3b1212;border-color:#ef9a9a;color:#ffcdd2} .oc-nc {background:#2d2500;border-color:#ffd54f;color:#ffe082} /* Table */ #table-wrap{flex:1;overflow:auto;padding:0 16px 16px} table{width:max-content;min-width:100%;border-collapse:collapse;font-size:12px} thead th{background:#161b22;position:sticky;top:0;padding:4px 8px;height:28px;text-align:left;border-bottom:2px solid #30363d;color:#8b949e;cursor:pointer;white-space:nowrap;user-select:none;z-index:1} thead th:hover{color:#c9d1d9} thead th.sort-asc::after{content:' \2191';color:#58a6ff} thead th.sort-desc::after{content:' \2193';color:#58a6ff} tbody tr{border-bottom:1px solid #21262d;cursor:pointer;transition:background .1s} tbody tr:hover{background:#161b22} tbody td{padding:3px 8px;white-space:nowrap;max-width:240px;overflow:hidden;text-overflow:ellipsis} .badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600} .b-inprocess{background:#0d2137;color:#42a5f5;border:1px solid #42a5f5} .b-closed {background:#1a2d00;color:#8bc34a;border:1px solid #8bc34a} .b-lost {background:#3b1212;color:#ef9a9a;border:1px solid #ef9a9a} .yes-tag{background:#1a2d00;color:#3fb950;border:1px solid #3fb950;border-radius:10px;font-size:11px;font-weight:600;padding:2px 8px} .no-tag{background:#21262d;color:#555;border:1px solid #30363d;border-radius:10px;font-size:11px;padding:2px 8px} .dim{color:#555} /* Pagination */ #pager{display:flex;align-items:center;gap:8px;padding:8px 16px;border-top:1px solid #30363d;background:#161b22;font-size:12px;flex-shrink:0} #pager button{padding:4px 10px;border:1px solid #30363d;border-radius:4px;background:#21262d;color:#c9d1d9;cursor:pointer} #pager button:disabled{opacity:.4;cursor:default} .page-info{color:#8b949e} /* Multi-select */ .ms-wrap{position:relative;display:inline-block;flex-shrink:0} .ms-btn{padding:0 10px;background:#0d1117;border:1px solid #30363d;border-radius:6px;color:#c9d1d9;font-size:12px;cursor:pointer;white-space:nowrap;height:28px;display:flex;align-items:center;gap:6px} .ms-btn:hover{background:#21262d} .ms-btn.has-sel{border-color:#58a6ff;color:#58a6ff} .ms-dd{display:none;position:absolute;top:calc(100% + 4px);left:0;background:#161b22;border:1px solid #30363d;border-radius:8px;min-width:180px;max-height:260px;overflow-y:auto;z-index:500;box-shadow:0 8px 24px rgba(0,0,0,.6);padding:4px 0} .ms-dd.open{display:block} .ms-dd label{display:flex;align-items:center;gap:8px;padding:7px 12px;cursor:pointer;font-size:12px;transition:background .1s} .ms-dd label:hover{background:#21262d} .ms-dd input[type=checkbox]{accent-color:#58a6ff;flex-shrink:0} /* Modal */ .modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:1000;align-items:center;justify-content:center} .modal-overlay.open{display:flex} .modal{background:#161b22;border:1px solid #30363d;border-radius:12px;width:820px;max-width:96vw;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 16px 48px rgba(0,0,0,.7)} .modal-header{padding:14px 20px;border-bottom:1px solid #30363d;display:flex;align-items:center;justify-content:space-between;flex-shrink:0} .modal-title{font-size:15px;font-weight:700;color:#c9d1d9} .modal-close{background:none;border:none;color:#8b949e;cursor:pointer;font-size:20px;padding:0 6px;line-height:1} .modal-close:hover{color:#c9d1d9} .modal-tabs{display:flex;border-bottom:1px solid #30363d;padding:0 20px;flex-shrink:0} .modal-tab{background:none;border:none;border-bottom:2px solid transparent;padding:9px 16px;font-size:13px;color:#8b949e;cursor:pointer;transition:color .15s} .modal-tab.active{color:#58a6ff;border-bottom-color:#58a6ff;font-weight:600} .modal-body{flex:1;overflow:auto;padding:18px 20px} .modal-footer{padding:12px 20px;border-top:1px solid #30363d;display:flex;align-items:center;gap:8px;flex-shrink:0} .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px} .form-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px} .form-group{display:flex;flex-direction:column;gap:4px} .form-group.span2{grid-column:span 2} .form-group.span3{grid-column:span 3} .form-label{font-size:11px;font-weight:600;color:#8b949e;text-transform:uppercase;letter-spacing:.5px} .form-input,.form-select,.form-textarea{background:#0d1117;border:1px solid #30363d;border-radius:6px;padding:7px 10px;color:#c9d1d9;font-size:13px;font-family:inherit;width:100%;outline:none;transition:border .15s} .form-input:focus,.form-select:focus,.form-textarea:focus{border-color:#58a6ff} .form-select option{background:#161b22;color:#c9d1d9} .form-textarea{resize:vertical;min-height:80px} .required-star{color:#f85149} .form-check{display:flex;align-items:center;gap:8px;margin-top:4px} .form-check input[type=checkbox]{width:15px;height:15px;accent-color:#58a6ff;cursor:pointer;flex-shrink:0} .form-check label{cursor:pointer;font-size:13px;color:#c9d1d9} .section-sub{font-size:11px;font-weight:700;color:#58a6ff;text-transform:uppercase;letter-spacing:.6px;margin:16px 0 8px;padding-bottom:5px;border-bottom:1px solid #21262d} .section-sub:first-child{margin-top:0} /* Contact log */ .contact-entry{padding:12px 14px;border-radius:8px;border:1px solid #30363d;margin-bottom:8px;background:#0d1117} .contact-meta{font-size:11px;color:#8b949e;margin-bottom:6px;display:flex;align-items:center;gap:10px} .contact-notes{font-size:12px;color:#c9d1d9;line-height:1.6;white-space:pre-wrap} /* History */ .history-entry{padding:10px 14px;border-radius:8px;border:1px solid #30363d;margin-bottom:8px;background:#0d1117} .history-meta{font-size:11px;color:#8b949e;margin-bottom:5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap} .history-notes{font-size:12px;color:#c9d1d9;line-height:1.5} .status-arrow{display:inline-flex;align-items:center;gap:5px} /* Lookup admin cards */ .lookup-card{background:#0d1117;border:1px solid #30363d;border-radius:8px;padding:14px} .lookup-card-title{font-size:11px;font-weight:700;color:#58a6ff;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px} .lookup-item{display:flex;align-items:center;justify-content:space-between;padding:5px 0;border-bottom:1px solid #21262d;font-size:12px;color:#c9d1d9;gap:8px} .lookup-item:last-of-type{border-bottom:none} /* Context menu */ #ctx-menu{display:none;position:fixed;background:#161b22;border:1px solid #30363d;border-radius:8px;padding:4px;z-index:2000;min-width:180px;box-shadow:0 8px 24px rgba(0,0,0,.7)} .ctx-item{display:block;padding:7px 14px;font-size:12px;color:#c9d1d9;cursor:pointer;border-radius:5px;border:none;background:none;width:100%;text-align:left;transition:background .1s} .ctx-item:hover{background:#21262d} .ctx-sep{border-top:1px solid #30363d;margin:3px 0} /* Toast */ #toast{position:fixed;bottom:24px;right:24px;background:#238636;color:#fff;padding:10px 18px;border-radius:8px;font-size:13px;font-weight:600;z-index:9999;display:none;pointer-events:none} #toast.err{background:#da3633} /* Loading bar */ #loading-bar{display:none;position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#1f6feb 0%,#58a6ff 50%,#1f6feb 100%);background-size:200% 100%;animation:shimmer 1.2s linear infinite;z-index:9998} @keyframes shimmer{0%{background-position:0% 0}100%{background-position:200% 0}} /* Confirm */ #confirm-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:1100;align-items:center;justify-content:center} #confirm-overlay.open{display:flex} .confirm-box{background:#161b22;border:1px solid #30363d;border-radius:10px;padding:24px;max-width:360px;width:90%;text-align:center} .confirm-box h3{color:#c9d1d9;margin-bottom:10px;font-size:15px} .confirm-box p{color:#8b949e;font-size:13px;margin-bottom:20px;line-height:1.5} .confirm-btns{display:flex;gap:8px;justify-content:center} /* Misc */ .section-title{font-size:14px;font-weight:600;color:#c9d1d9;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid #30363d} #analytics-wrap,#admin-wrap{display:none;flex:1;overflow:auto;padding:24px} /* ── Light mode ── */ body.light{background:#f6f8fa;color:#1f2328} body.light #sidebar{background:#fff;border-right-color:#d0d7de} body.light #sidebar .logo{border-bottom-color:#d0d7de} body.light #sidebar .logo .brand{color:#0969da} body.light #sidebar .logo .sub{color:#636c76} body.light #sidebar nav a{color:#636c76} body.light #sidebar nav a:hover{background:#eaeef2;color:#1f2328} body.light #sidebar nav a.active{background:#0969da15;color:#0969da;font-weight:600} body.light #sidebar .user-info{border-top-color:#d0d7de;color:#636c76} body.light #topbar{background:#fff;border-bottom-color:#d0d7de} body.light .page-title{color:#1f2328} body.light .btn{background:#eaeef2;border-color:#d0d7de;color:#1f2328} body.light .btn:hover{background:#d0d7de} body.light .btn-primary{background:#0969da;border-color:#0969da;color:#fff} body.light .btn-primary:hover{background:#0550ae} body.light .btn-success{background:#1a7f37;border-color:#1a7f37;color:#fff} body.light .btn-danger{background:#cf222e;border-color:#cf222e;color:#fff} body.light #search-box{background:#fff;border-color:#d0d7de;color:#1f2328} body.light #stat-row{border-bottom-color:#d0d7de} body.light .oc-all {background:#e6f4eb;border-color:#217346;color:#1b5e20} body.light .oc-prog {background:#dbeafe;border-color:#1d4ed8;color:#1e3a8a} body.light .oc-closed{background:#dcfce7;border-color:#16a34a;color:#14532d} body.light .oc-lost {background:#fee2e2;border-color:#dc2626;color:#7f1d1d} body.light .oc-nc {background:#fef9c3;border-color:#ca8a04;color:#713f12} body.light #table-wrap{background:#f6f8fa} body.light thead th{background:#f6f8fa;border-bottom-color:#d0d7de;color:#636c76} body.light thead th:hover{color:#1f2328} body.light tbody tr{border-bottom-color:#eaeef2} body.light tbody tr:hover{background:#eaeef2} body.light #pager{background:#fff;border-top-color:#d0d7de} body.light #pager button{background:#eaeef2;border-color:#d0d7de;color:#1f2328} body.light .page-info{color:#636c76} body.light .ms-btn{background:#fff;border-color:#d0d7de;color:#1f2328} body.light .ms-btn:hover{background:#eaeef2} body.light .ms-btn.has-sel{border-color:#0969da;color:#0969da} body.light .ms-dd{background:#fff;border-color:#d0d7de;box-shadow:0 4px 12px rgba(0,0,0,.12)} body.light .ms-dd label:hover{background:#eaeef2} body.light .modal{background:#fff;border-color:#d0d7de} body.light .modal-header{border-bottom-color:#d0d7de} body.light .modal-title{color:#1f2328} body.light .modal-close{color:#636c76} body.light .modal-close:hover{color:#1f2328} body.light .modal-tabs{border-bottom-color:#d0d7de} body.light .modal-tab{color:#636c76} body.light .modal-tab.active{color:#0969da;border-bottom-color:#0969da} body.light .modal-footer{border-top-color:#d0d7de} body.light .form-input,body.light .form-select,body.light .form-textarea{background:#fff;border-color:#d0d7de;color:#1f2328} body.light .form-input:focus,body.light .form-select:focus,body.light .form-textarea:focus{border-color:#0969da} body.light .form-select option{background:#fff;color:#1f2328} body.light .form-label{color:#636c76} body.light .form-check label{color:#1f2328} body.light .section-sub{color:#0969da;border-bottom-color:#eaeef2} body.light .b-inprocess{background:#dbeafe;color:#1d4ed8;border-color:#93c5fd} body.light .b-closed {background:#dcfce7;color:#15803d;border-color:#86efac} body.light .b-lost {background:#fee2e2;color:#dc2626;border-color:#fca5a5} body.light .yes-tag{background:#dcfce7;color:#15803d;border-color:#86efac} body.light .no-tag{background:#f3f4f6;color:#9ca3af;border-color:#e5e7eb} body.light .dim{color:#9ca3af} body.light .contact-entry{background:#f6f8fa;border-color:#d0d7de} body.light .contact-meta{color:#636c76} body.light .contact-notes{color:#1f2328} body.light .history-entry{background:#f6f8fa;border-color:#d0d7de} body.light .history-meta{color:#636c76} body.light .history-notes{color:#1f2328} body.light #ctx-menu{background:#fff;border-color:#d0d7de;box-shadow:0 4px 12px rgba(0,0,0,.12)} body.light .ctx-item{color:#1f2328} body.light .ctx-item:hover{background:#eaeef2} body.light .ctx-sep{border-top-color:#d0d7de} body.light .confirm-box{background:#fff;border-color:#d0d7de} body.light .confirm-box h3{color:#1f2328} body.light .confirm-box p{color:#636c76} body.light .lookup-card{background:#f6f8fa;border-color:#d0d7de} body.light .lookup-card-title{color:#0969da} body.light .lookup-item{border-bottom-color:#eaeef2;color:#1f2328} body.light #admin-log{background:#fff;border-color:#d0d7de;color:#636c76} body.light #analytics-wrap,body.light #admin-wrap{color:#1f2328} body.light .section-title{color:#1f2328;border-bottom-color:#d0d7de} body.light #btn-menu{color:#1f2328} /* Mobile sidebar overlay */ #sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:590} #sidebar-overlay.open{display:block} #btn-menu{display:none;background:none;border:none;color:#c9d1d9;font-size:20px;cursor:pointer;padding:2px 6px;flex-shrink:0;line-height:1} /* ── Responsive / Mobile ── */ @media (max-width:768px) { #btn-menu{display:block} body{flex-direction:column} #sidebar{position:fixed;left:0;top:0;bottom:0;width:220px;transform:translateX(-220px);transition:transform .25s ease;z-index:600} #sidebar.open{transform:translateX(0)} #main{width:100%;flex:1} #topbar{padding:6px 10px;gap:6px;min-height:44px} .page-title{font-size:13px} #search-box{width:100%;order:10;margin-top:2px} #topbar-filters{order:11;width:100%} #topbar-right .btn:not(.btn-success){display:none} .modal{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0} .form-grid,.form-grid-3{grid-template-columns:1fr} .form-group.span2,.form-group.span3{grid-column:span 1} #stat-row{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none} #stat-row::-webkit-scrollbar{display:none} .ord-cube{min-width:76px;padding:4px 8px} .oc-val{font-size:15px} .oc-lbl{font-size:9px} #admin-lookups{grid-template-columns:1fr} tbody td{font-size:11px;padding:3px 5px} thead th{font-size:11px;padding:3px 5px} .modal-body{padding:12px 14px} .modal-tabs .modal-tab{padding:8px 10px;font-size:12px} #pager{padding:6px 10px;font-size:11px} .btn{font-size:11px;padding:5px 9px} } @media (max-width:480px) { .ord-cube{min-width:68px} #topbar-right .btn-success{font-size:11px;padding:5px 8px} }

Google Authenticator Setup

Scan this QR code with Google Authenticator

Leads
Page 1 / 1
📊 Analytics
Analytics charts coming soon.
🔒 Dashboard Access Users

Each user gets their own Google Authenticator entry. Click 📱 QR to display the barcode for them to scan.

NameUsernameLevelStatusVerifiedActions
⚙ Admin — Bridge Tests


    
Lookup Values Management

Manage the options available in dropdown fields. Changes take effect immediately.

Confirm