*{box-sizing:border-box}body{font-family:Arial,sans-serif}.cb-body{margin:0;min-height:100vh;background:#f3f7fb;color:#172033}.cb-topbar{position:fixed;inset:0 0 auto;z-index:40;height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:#fff;border-bottom:1px solid #dbe4ef}.cb-menu-btn,.cb-bell{width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:13px;background:#eef4ff;color:#2563eb;text-decoration:none}.cb-brand{display:flex;align-items:center;gap:10px;color:#172033;text-decoration:none}.cb-brand i{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,#2563eb,#06b6d4);color:#fff}.cb-sidebar{position:fixed;top:68px;bottom:0;left:0;z-index:35;width:270px;padding:18px;background:#172033;overflow:auto}.cb-user{display:flex;align-items:center;gap:12px;padding:14px;border-radius:15px;background:rgba(255,255,255,.08);color:#fff}.cb-user>span{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:#2563eb;font-weight:900}.cb-user>div{display:flex;flex-direction:column}.cb-user small{color:#94a3b8}.cb-sidebar nav{display:grid;gap:6px;margin-top:18px}.cb-sidebar nav a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;color:#cbd5e1;text-decoration:none}.cb-sidebar nav a:hover,.cb-sidebar nav a.active{background:#2563eb;color:#fff}.cb-main{margin-left:270px;padding:92px 24px 90px}.cb-welcome{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px;border-radius:22px;background:linear-gradient(135deg,#172033,#2563eb);color:#fff}.cb-welcome span{color:#93c5fd;font-size:11px;font-weight:900}.cb-welcome h1{margin:7px 0;font-size:30px;font-weight:900}.cb-welcome p{margin:0;color:#dbeafe}.cb-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:20px 0}.cb-stats article{display:flex;align-items:center;gap:12px;padding:17px;border:1px solid #dbe4ef;border-radius:16px;background:#fff}.cb-stats i{width:47px;height:47px;display:grid;place-items:center;border-radius:14px}.blue{background:#dbeafe;color:#1d4ed8}.amber{background:#fef3c7;color:#b45309}.green{background:#dcfce7;color:#166534}.cb-stats article div{display:flex;flex-direction:column}.cb-stats small{color:#64748b}.cb-stats strong{font-size:23px}.cb-card{overflow:hidden;border:1px solid #dbe4ef;border-radius:19px;background:#fff}.cb-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 20px;border-bottom:1px solid #dbe4ef}.cb-head h2{margin:0;font-size:18px;font-weight:900}.cb-head p{margin:5px 0 0;color:#64748b}.cb-list{display:grid;gap:10px;padding:15px}.cb-list article{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:14px;padding:14px;border:1px solid #dbe4ef;border-radius:14px}.cb-list span,.cb-tile>div:first-child span{color:#2563eb;font-size:10px;font-weight:900}.cb-list h3{margin:4px 0}.cb-list p,.cb-page-head p,.cb-tile>p{margin:4px 0;color:#64748b}.cb-list>article>strong,.cb-tile>div:first-child>strong{padding:6px 9px;border-radius:999px;background:#eef2f7;font-size:10px}.cb-page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.cb-page-head h1{margin:0;font-size:27px;font-weight:900}.cb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:18px}.cb-tile{padding:17px;border:1px solid #dbe4ef;border-radius:16px}.cb-tile>div:first-child{display:flex;justify-content:space-between}.cb-tile h2{margin:14px 0 0;font-size:18px}.cb-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:15px 0}.cb-meta div,.cb-details div{padding:10px;border-radius:10px;background:#f8fafc}.cb-meta span,.cb-details span{display:block;color:#64748b;font-size:10px}.cb-meta strong,.cb-details strong{display:block;margin-top:4px}.cb-two{display:grid;grid-template-columns:1fr 1fr;gap:20px}.cb-details{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:18px}.cb-details .wide{grid-column:1/-1}.cb-actions{display:flex;gap:10px;padding:0 18px 18px}.cb-actions .btn{flex:1}.cb-tests{display:grid;gap:10px;padding:18px}.cb-tests article{display:flex;justify-content:space-between;padding:12px;border:1px solid #dbe4ef;border-radius:12px}.cb-tests article div{display:flex;flex-direction:column}.cb-tests small{color:#64748b}.cb-tests article>span{padding:6px 9px;border-radius:999px;background:#eef2f7;font-size:10px}.cb-form{padding:24px}.cb-narrow{max-width:900px}.cb-empty{min-height:190px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#64748b;text-align:center}.cb-bottom{display:none}.cb-login-body{margin:0;min-height:100vh;background:linear-gradient(135deg,#eaf1ff,#fff,#dff8ff)}.cb-login-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.cb-login-brand,.cb-login-card{display:flex;justify-content:center;flex-direction:column;padding:7vw}.cb-login-brand{background:linear-gradient(145deg,#172033,#2563eb);color:#fff}.cb-login-brand>span{width:78px;height:78px;display:grid;place-items:center;border-radius:24px;background:rgba(255,255,255,.14);font-size:34px}.cb-login-brand h1{font-size:40px;font-weight:900}.cb-login-card{background:#fff}.cb-login-card h2{font-size:32px;font-weight:900}.cb-login-card>small{color:#2563eb;font-weight:900}@media(max-width:1000px){.cb-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){.cb-sidebar{left:-280px;transition:.2s}.cb-sidebar.open{left:0}.cb-overlay.show{display:block;position:fixed;inset:68px 0 0;z-index:30;background:rgba(15,23,42,.5)}.cb-main{margin-left:0;padding-inline:16px}.cb-bottom{position:fixed;inset:auto 0 0;z-index:25;height:66px;display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border-top:1px solid #dbe4ef}.cb-bottom a{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;color:#64748b;text-decoration:none;font-size:10px}.cb-bottom .track{color:#2563eb}.cb-two{grid-template-columns:1fr}}@media(max-width:650px){.cb-welcome,.cb-page-head,.cb-head{align-items:stretch;flex-direction:column}.cb-stats,.cb-grid{grid-template-columns:1fr}.cb-list article{grid-template-columns:1fr}.cb-meta,.cb-details{grid-template-columns:1fr}.cb-details .wide{grid-column:auto}.cb-login-shell{grid-template-columns:1fr}.cb-login-brand{min-height:320px}}



/* V2.2 — keep the Collection Boy photo inside the sidebar profile header only */
.cb-sidebar .cb-user{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:74px;
}
.cb-sidebar .cb-user .cb-user-photo{
    position:relative!important;
    inset:auto!important;
    z-index:1!important;
    display:block!important;
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    flex:0 0 46px!important;
    overflow:hidden!important;
    padding:0!important;
    margin:0!important;
    border:2px solid rgba(255,255,255,.26)!important;
    border-radius:14px!important;
    background:#e9f5f3!important;
    box-shadow:none!important;
}
.cb-sidebar .cb-user .cb-user-photo::before,
.cb-sidebar .cb-user .cb-user-photo::after{
    content:none!important;
    display:none!important;
}
.cb-sidebar .cb-user .cb-user-photo img{
    position:static!important;
    inset:auto!important;
    display:block!important;
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:11px!important;
    object-fit:cover!important;
    object-position:center!important;
    opacity:1!important;
    filter:none!important;
    transform:none!important;
}
.cb-sidebar .cb-user .cb-user-meta{
    position:relative;
    z-index:2;
    min-width:0;
    overflow:hidden;
}
.cb-sidebar .cb-user .cb-user-meta strong,
.cb-sidebar .cb-user .cb-user-meta small{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.cb-sidebar nav{
    position:relative;
    z-index:2;
}

/* V2.3 — Collection Boy identity card on dashboard hero */
.cb-welcome-profile{
    position:relative;
    overflow:hidden;
    min-height:220px;
    padding:28px 30px;
}
.cb-welcome-profile::before{
    content:"";
    position:absolute;
    width:250px;
    height:250px;
    right:-88px;
    top:-115px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    pointer-events:none;
}
.cb-welcome-profile::after{
    content:"";
    position:absolute;
    width:170px;
    height:170px;
    right:110px;
    bottom:-120px;
    border-radius:50%;
    background:rgba(14,165,233,.16);
    pointer-events:none;
}
.cb-welcome-identity{
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    gap:24px;
    min-width:0;
}
.cb-dashboard-avatar{
    position:relative;
    display:block;
    width:112px;
    min-width:112px;
    height:112px;
    padding:4px;
    border-radius:32px;
    background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(219,234,254,.9));
    box-shadow:0 18px 42px rgba(2,6,23,.32),0 0 0 1px rgba(255,255,255,.4);
    text-decoration:none;
    transform:translateZ(0);
}
.cb-dashboard-avatar img{
    display:block;
    width:104px;
    height:104px;
    border-radius:27px;
    object-fit:cover;
    object-position:center;
    background:#e9f5f3;
}
.cb-dashboard-avatar-status{
    position:absolute;
    right:2px;
    bottom:4px;
    width:22px;
    height:22px;
    border:4px solid #fff;
    border-radius:50%;
    box-shadow:0 4px 12px rgba(15,23,42,.28);
}
.cb-dashboard-avatar-status.is-online{background:#22c55e}
.cb-dashboard-avatar-status.is-idle{background:#f59e0b}
.cb-welcome-copy{
    min-width:0;
}
.cb-welcome-copy h1{
    max-width:720px;
    line-height:1.12;
}
.cb-dashboard-profile-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:15px;
    padding:8px 12px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:999px;
    background:rgba(255,255,255,.1);
    color:#fff;
    font-size:12px;
    font-weight:800;
    text-decoration:none;
    backdrop-filter:blur(7px);
}
.cb-dashboard-profile-link:hover,
.cb-dashboard-profile-link:focus{
    background:rgba(255,255,255,.18);
    color:#fff;
}
.cb-duty-button{
    position:relative;
    z-index:1;
    min-width:180px;
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    font-weight:800;
}
@media(max-width:760px){
    .cb-welcome-profile{
        min-height:0;
        padding:24px 22px;
    }
    .cb-welcome-identity{
        width:100%;
        align-items:flex-start;
        gap:17px;
    }
    .cb-dashboard-avatar{
        width:88px;
        min-width:88px;
        height:88px;
        padding:3px;
        border-radius:25px;
    }
    .cb-dashboard-avatar img{
        width:82px;
        height:82px;
        border-radius:22px;
    }
    .cb-dashboard-avatar-status{
        width:19px;
        height:19px;
        border-width:3px;
    }
    .cb-welcome-copy h1{
        margin-top:5px;
        font-size:clamp(25px,7vw,34px);
        overflow-wrap:anywhere;
    }
    .cb-welcome-copy p{
        font-size:14px;
        line-height:1.5;
    }
    .cb-duty-button{
        width:100%;
        margin-top:4px;
    }
}
@media(max-width:430px){
    .cb-welcome-identity{
        align-items:center;
    }
    .cb-dashboard-avatar{
        width:78px;
        min-width:78px;
        height:78px;
        border-radius:22px;
    }
    .cb-dashboard-avatar img{
        width:72px;
        height:72px;
        border-radius:19px;
    }
    .cb-dashboard-profile-link{
        margin-top:10px;
        padding:7px 10px;
    }
}


/* V2.4 — approved centered circular identity hero and logo-only header */
.cb-topbar .cb-brand{
    min-width:0;
    justify-content:center;
    gap:0;
}
.cb-topbar .cb-brand-logo{
    display:block;
    width:auto;
    max-width:min(210px,42vw);
    height:46px;
    object-fit:contain;
}

.cb-welcome-profile{
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    min-height:520px;
    padding:38px 42px 36px;
    text-align:center;
    background:
        radial-gradient(circle at 50% 8%,rgba(37,99,235,.52),transparent 34%),
        linear-gradient(145deg,#071c47 0%,#073986 55%,#1559dc 100%);
    box-shadow:0 22px 50px rgba(16,51,118,.24);
}
.cb-welcome-profile::before{
    width:420px;
    height:420px;
    right:-180px;
    top:-205px;
    background:rgba(255,255,255,.055);
}
.cb-welcome-profile::after{
    width:310px;
    height:310px;
    left:-165px;
    right:auto;
    bottom:-200px;
    background:rgba(14,165,233,.12);
}
.cb-welcome-identity{
    position:relative;
    z-index:2;
    display:flex;
    width:100%;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:16px;
}
.cb-dashboard-avatar{
    position:relative;
    display:block;
    width:166px;
    min-width:166px;
    height:166px;
    padding:7px;
    border:3px solid rgba(255,255,255,.98);
    border-radius:50%;
    background:linear-gradient(145deg,#fff,#dbeafe);
    box-shadow:
        0 0 0 9px rgba(37,99,235,.3),
        0 18px 44px rgba(1,8,28,.42);
    text-decoration:none;
}
.cb-dashboard-avatar img{
    display:block;
    width:146px;
    height:146px;
    border-radius:50%;
    object-fit:cover;
    object-position:center;
    background:#e9f5f3;
}
.cb-dashboard-avatar-status{
    position:absolute;
    right:2px;
    bottom:11px;
    z-index:3;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:5px solid #fff;
    border-radius:50%;
    color:#fff;
    box-shadow:0 7px 18px rgba(15,23,42,.36);
    font-size:12px;
}
.cb-dashboard-avatar-status.is-online{background:#16a34a}
.cb-dashboard-avatar-status.is-idle{background:#f59e0b}
.cb-welcome-copy{
    display:flex;
    width:100%;
    min-width:0;
    flex-direction:column;
    align-items:center;
}
.cb-dashboard-uid{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    margin:0 0 7px;
    padding:8px 18px;
    border-radius:999px;
    background:rgba(37,99,235,.32);
    color:#dbeafe!important;
    box-shadow:inset 0 0 0 1px rgba(147,197,253,.12);
    font-size:14px!important;
    letter-spacing:.02em;
}
.cb-welcome-copy h1{
    max-width:900px;
    margin:5px 0 10px;
    color:#fff;
    font-size:clamp(32px,4vw,48px);
    line-height:1.08;
    text-align:center;
    text-wrap:balance;
}
.cb-welcome-divider{
    display:flex;
    width:min(390px,78%);
    align-items:center;
    gap:17px;
    margin:1px auto 14px;
    color:#38a3ff;
}
.cb-welcome-divider::before,
.cb-welcome-divider::after{
    content:"";
    height:2px;
    flex:1;
    border-radius:999px;
    background:linear-gradient(90deg,transparent,#2492ff);
}
.cb-welcome-divider::after{transform:scaleX(-1)}
.cb-welcome-copy p{
    max-width:740px;
    margin:0;
    color:#e6efff;
    font-size:18px;
    line-height:1.55;
    text-align:center;
}
.cb-dashboard-profile-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    margin-top:10px;
    padding:5px 8px;
    border:0;
    border-radius:0;
    background:transparent;
    color:#2f9cff;
    font-size:16px;
    font-weight:800;
    text-decoration:underline;
    text-underline-offset:4px;
    backdrop-filter:none;
}
.cb-dashboard-profile-link:hover,
.cb-dashboard-profile-link:focus{
    background:transparent;
    color:#7cc4ff;
}
.cb-duty-button{
    position:relative;
    z-index:2;
    width:min(760px,100%);
    min-height:58px;
    margin-top:23px;
    border-radius:13px;
    font-size:20px;
    font-weight:800;
}

@media(max-width:760px){
    .cb-topbar .cb-brand-logo{
        max-width:46vw;
        height:43px;
    }
    .cb-welcome-profile{
        min-height:0;
        padding:34px 22px 28px;
        border-radius:25px;
    }
    .cb-welcome-identity{
        align-items:center;
        gap:14px;
    }
    .cb-dashboard-avatar{
        width:148px;
        min-width:148px;
        height:148px;
        padding:6px;
        border-width:3px;
        box-shadow:0 0 0 7px rgba(37,99,235,.28),0 16px 36px rgba(1,8,28,.4);
    }
    .cb-dashboard-avatar img{
        width:130px;
        height:130px;
        border-radius:50%;
    }
    .cb-dashboard-avatar-status{
        right:0;
        bottom:9px;
        width:34px;
        height:34px;
        border-width:4px;
    }
    .cb-dashboard-uid{
        min-height:32px;
        margin-top:1px;
        padding:7px 15px;
        font-size:13px!important;
    }
    .cb-welcome-copy h1{
        margin:4px 0 8px;
        font-size:clamp(30px,8.5vw,42px);
        overflow-wrap:anywhere;
    }
    .cb-welcome-copy p{
        max-width:520px;
        font-size:16px;
        line-height:1.5;
    }
    .cb-dashboard-profile-link{
        margin-top:8px;
        font-size:15px;
    }
    .cb-duty-button{
        width:100%;
        min-height:56px;
        margin-top:20px;
        font-size:18px;
    }
}
@media(max-width:430px){
    .cb-welcome-profile{padding:30px 18px 24px}
    .cb-dashboard-avatar{
        width:132px;
        min-width:132px;
        height:132px;
    }
    .cb-dashboard-avatar img{
        width:114px;
        height:114px;
    }
    .cb-dashboard-avatar-status{
        width:31px;
        height:31px;
        font-size:10px;
    }
    .cb-welcome-copy h1{font-size:clamp(29px,9vw,38px)}
    .cb-welcome-divider{width:82%;margin-bottom:12px}
    .cb-welcome-copy p{font-size:15px}
}