:root {
:    --panel-bg: rgba(18, 24, 32, 0.92);
:    --panel-border: rgba(255, 255, 255, 0.08);
:    --panel-shadow: 0 15px 30px rgba(0, 0, 0, 0.35);
}

.accent-panel {
    position: relative;
    overflow: hidden;
    border-radius: var(--panel-radius, 1rem);
    border: 1px solid var(--panel-border, rgba(255, 255, 255, 0.08));
    background: var(--panel-bg, rgba(12, 16, 24, 0.9));
    box-shadow: var(--panel-shadow, 0 10px 25px rgba(0, 0, 0, 0.25));
}

.accent-panel::before {
    content: "";
    position: absolute;
    top: 0.35rem;
    bottom: 0.35rem;
    left: 0;
    width: 4px;
    border-radius: 0 calc(var(--panel-radius, 1rem)) calc(var(--panel-radius, 1rem)) 0;
    background: var(--panel-accent, linear-gradient(180deg, #4c6ef5, #15e6b8));
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.35);
}

.accent-panel .card-header,
.accent-panel .card-body,
.accent-panel .card-footer {
    position: relative;
    z-index: 1;
    background: transparent;
}