/* =========================
   ESCAPADE — Home
========================= */

.landing-page {
    width: 100%;
    min-height: 100vh;
    padding: 22px 18px 120px;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        radial-gradient(circle at top right, rgba(0, 180, 255, 0.18), transparent 35%),
        radial-gradient(circle at bottom left, rgba(40, 69, 146, 0.25), transparent 45%),
        linear-gradient(180deg, #07142f 0%, #0b1d44 55%, #10295d 100%);
}

.landing-hero {
    width: 100%;
    max-width: 500px;
}

.landing-card {
    position: relative;
    overflow: hidden;

    padding: 28px 22px 30px;

    text-align: center;

    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 30px;

    box-shadow:
        0 28px 70px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.landing-card::before {
    content: "";

    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);

    width: 72%;
    height: 5px;

    background: linear-gradient(
        90deg,
        #2b4694,
        #0a84b8,
        #eab94b,
        #f39b70
    );

    border-radius: 0 0 8px 8px;
}

.landing-logo {
    display: block;

    width: 100%;
    max-width: 330px;
    height: auto;

    margin: 0 auto 20px;

    object-fit: contain;
}

.landing-kicker {
    margin: 0 0 10px;

    color: #284592;

    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.3em;
}

.landing-card h1 {
    max-width: 410px;
    margin: 0 auto;

    color: #0c244f;

    font-family: "Cinzel", serif;
    font-size: clamp(1.65rem, 6vw, 2.45rem);
    font-weight: 700;
    line-height: 1.2;
}

.landing-subtitle {
    max-width: 330px;
    margin: 18px auto 24px;

    color: #667085;

    font-size: 0.95rem;
    line-height: 1.55;
}

.landing-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 10px;

    min-height: 52px;
    padding: 0 24px;

    color: #ffffff;
    background: linear-gradient(135deg, #284592, #16336f);

    border-radius: 16px;

    text-decoration: none;
    font-weight: 600;

    box-shadow: 0 14px 28px rgba(40, 69, 146, 0.32);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.landing-button:hover {
    color: #ffffff;

    transform: translateY(-2px);

    box-shadow: 0 18px 34px rgba(40, 69, 146, 0.38);
}

.landing-button i {
    transition: transform 0.2s ease;
}

.landing-button:hover i {
    transform: translateX(4px);
}

@media (max-width: 576px) {
    .landing-page {
        align-items: flex-start;
        padding-top: 30px;
    }

    .landing-card {
        padding: 25px 18px 28px;
        border-radius: 26px;
    }

    .landing-logo {
        max-width: 300px;
        margin-bottom: 18px;
    }

    .landing-card h1 {
        font-size: 1.9rem;
    }
}

/* =========================
   ESCAPADE — Mission Brief
========================= */

.mission-page {
    width: 100%;
    min-height: 100vh;
    padding: 30px 18px 170px;

    background:
        radial-gradient(circle at top right, rgba(0, 180, 255, 0.14), transparent 32%),
        radial-gradient(circle at bottom left, rgba(40, 69, 146, 0.22), transparent 42%),
        linear-gradient(180deg, #07142f 0%, #0b1d44 55%, #10295d 100%);
}

.mission-container {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
}

.mission-header {
    margin-bottom: 24px;
    color: #ffffff;
}

.mission-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 8px 12px;
    margin-bottom: 18px;

    color: #ffd66b;
    background: rgba(255, 214, 107, 0.10);
    border: 1px solid rgba(255, 214, 107, 0.28);
    border-radius: 999px;

    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.mission-kicker {
    margin: 0 0 8px;

    color: #8ecbff;

    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.22em;
}

.mission-header h1 {
    margin: 0;

    color: #ffffff;

    font-family: "Cinzel", serif;
    font-size: clamp(2rem, 7vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
}

.mission-intro {
    max-width: 560px;
    margin: 14px 0 0;

    color: rgba(255, 255, 255, 0.72);

    font-size: 0.96rem;
    line-height: 1.6;
}

.mission-card {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 16px;

    margin-bottom: 16px;
    padding: 20px;

    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 22px;

    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
}

.mission-card-icon {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #284592;
    background: rgba(40, 69, 146, 0.10);
    border-radius: 15px;

    font-size: 1.2rem;
}

.mission-card-icon.warning {
    color: #a66a00;
    background: rgba(234, 185, 75, 0.20);
}

.mission-card h2 {
    margin: 0 0 10px;

    color: #10295d;

    font-size: 1.18rem;
    font-weight: 700;
}

.mission-card p {
    margin: 0 0 10px;

    color: #5f6b7a;

    font-size: 0.93rem;
    line-height: 1.6;
}

.mission-card p:last-child {
    margin-bottom: 0;
}

.mission-message {
    border-left: 5px solid #eab94b;
}

.mission-message blockquote {
    margin: 0;

    color: #26364f;

    font-size: 0.98rem;
    font-style: italic;
    font-weight: 500;
    line-height: 1.7;
}

.mission-objective {
    display: flex;
    align-items: center;
    gap: 14px;

    margin: 20px 0;
    padding: 18px;

    color: #ffffff;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 20px;

    backdrop-filter: blur(10px);
}

.mission-objective > i {
    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #ffd66b;
    background: rgba(255, 214, 107, 0.12);
    border-radius: 14px;
}

.mission-objective span {
    display: block;

    margin-bottom: 3px;

    color: #8ecbff;

    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.mission-objective strong {
    display: block;

    color: #ffffff;

    font-size: 0.94rem;
    line-height: 1.45;
}

.mission-accept-button {
    width: 100%;
    min-height: 56px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    color: #10295d;
    background: #ffffff;

    border-radius: 17px;

    text-decoration: none;
    font-weight: 700;

    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.mission-accept-button:hover {
    color: #10295d;

    transform: translateY(-2px);

    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.28);
}

@media (max-width: 576px) {
    .mission-page {
         padding: 24px 18px 170px;
    }

    .mission-card {
        grid-template-columns: 42px 1fr;
        gap: 13px;

        padding: 17px;
        border-radius: 19px;
    }

    .mission-card-icon {
        width: 42px;
        height: 42px;
        border-radius: 13px;
    }

    .mission-header h1 {
        font-size: 2rem;
    }
}


/* =========================
   ESCAPADE — Teams
========================= */

.teams-page {
    width: 100%;
    min-height: 100vh;
    padding: 30px 18px 170px;

    background:
        radial-gradient(circle at top right, rgba(0, 180, 255, 0.14), transparent 32%),
        radial-gradient(circle at bottom left, rgba(40, 69, 146, 0.22), transparent 42%),
        linear-gradient(180deg, #07142f 0%, #0b1d44 55%, #10295d 100%);
}

.teams-container {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
}

.teams-header {
    margin-bottom: 28px;
    color: #ffffff;
}

.teams-kicker {
    margin: 0 0 8px;

    color: #8ecbff;

    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.22em;
}

.teams-header h1 {
    margin: 0 0 12px;

    color: #ffffff;

    font-family: "Cinzel", serif;
    font-size: clamp(2rem, 7vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
}

.teams-header p {
    max-width: 520px;
    margin: 0;

    color: rgba(255, 255, 255, 0.72);

    font-size: 0.96rem;
    line-height: 1.6;
}

.teams-empty-card {
    padding: 34px 24px;

    text-align: center;

    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 26px;

    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.20);
}

.teams-empty-icon {
    width: 74px;
    height: 74px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin: 0 auto 20px;

    color: #284592;
    background: rgba(40, 69, 146, 0.10);
    border-radius: 22px;

    font-size: 1.8rem;
}

.teams-empty-card h2 {
    margin: 0 0 12px;

    color: #10295d;

    font-size: 1.35rem;
    font-weight: 700;
}

.teams-empty-card p {
    max-width: 420px;
    margin: 0 auto 22px;

    color: #667085;

    font-size: 0.95rem;
    line-height: 1.6;
}

.teams-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 9px 14px;

    color: #8a5a00;
    background: rgba(234, 185, 75, 0.20);
    border-radius: 999px;

    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

@media (max-width: 576px) {
    .teams-page {
        padding: 24px 18px 170px;
    }

    .teams-empty-card {
        padding: 30px 20px;
        border-radius: 22px;
    }

    .teams-header h1 {
        font-size: 2rem;
    }
}



/* =========================
   ESCAPADE — Login
========================= */

body:has(.login-card) {
    align-items: flex-start;

    background:
        radial-gradient(circle at top right, rgba(0, 180, 255, 0.14), transparent 32%),
        radial-gradient(circle at bottom left, rgba(40, 69, 146, 0.22), transparent 42%),
        linear-gradient(180deg, #07142f 0%, #0b1d44 55%, #10295d 100%);
}

body:has(.login-card) > .container {
    width: 100%;
    padding-top: 30px !important;
    padding-bottom: 170px !important;
}

body:has(.login-card) .login-card {
    border-radius: 26px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28) !important;
}

body:has(.login-card) .login-image {
    height: auto;
    max-height: 250px;
    padding: 24px 28px 10px;
}

body:has(.login-card) .card-body {
    padding-top: 22px !important;
}

body:has(.login-card) .form-control {
    min-height: 52px;
    border-radius: 12px;
}

body:has(.login-card) .btn-primary {
    min-height: 52px;
    border-radius: 12px;
    font-weight: 600;
}

@media (max-width: 576px) {
    body:has(.login-card) > .container {
        padding-top: 24px !important;
        padding-left: 18px;
        padding-right: 18px;
    }

    body:has(.login-card) .login-image {
        max-height: 220px;
        padding: 20px 20px 8px;
    }
}

/* =========================
   ESCAPADE — Support
========================= */

.support-page {
    width: 100%;
    min-height: 100vh;
    padding: 30px 18px 170px;

    background:
        radial-gradient(circle at top right, rgba(0, 180, 255, 0.14), transparent 32%),
        radial-gradient(circle at bottom left, rgba(40, 69, 146, 0.22), transparent 42%),
        linear-gradient(180deg, #07142f 0%, #0b1d44 55%, #10295d 100%);
}

.support-container {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
}

.support-header {
    margin-bottom: 26px;
    color: #ffffff;
}

.support-kicker {
    margin: 0 0 8px;

    color: #8ecbff;

    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.22em;
}

.support-header h1 {
    margin: 0 0 12px;

    color: #ffffff;

    font-family: "Cinzel", serif;
    font-size: clamp(2rem, 7vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
}

.support-header p {
    max-width: 560px;
    margin: 0;

    color: rgba(255, 255, 255, 0.72);

    font-size: 0.96rem;
    line-height: 1.6;
}

.support-card {
    position: relative;

    margin-bottom: 16px;
    padding: 24px;

    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 24px;

    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
}

.support-title {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.support-icon {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #284592;
    background: rgba(40, 69, 146, 0.10);
    border-radius: 14px;

    font-size: 1.15rem;
}

.support-card h2 {
    margin: 0;

    color: #10295d;

    font-size: 1.3rem;
    font-weight: 700;
}

.support-card p {
    margin: 0 0 14px;

    color: #5f6b7a;

    font-size: 0.95rem;
    line-height: 1.55;
}

.support-card p:last-child {
    margin-bottom: 0;
}

.support-card strong {
    color: #10295d;
    font-weight: 700;
}

@media (max-width: 576px) {
    .support-page {
        padding: 24px 18px 170px;
    }

    .support-card {
        padding: 21px;
        border-radius: 21px;
    }

    .support-header h1 {
        font-size: 2rem;
    }
}


/* =========================
   ESCAPADE — Investigation
========================= */

body:has(.investigation-header) {
    align-items: flex-start;

    background:
        radial-gradient(circle at top right, rgba(0, 180, 255, 0.14), transparent 32%),
        radial-gradient(circle at bottom left, rgba(40, 69, 146, 0.22), transparent 42%),
        linear-gradient(180deg, #07142f 0%, #0b1d44 55%, #10295d 100%);
}

body:has(.investigation-header) > .container {
    width: 100%;
    max-width: 760px;

    padding-top: 28px !important;
    padding-bottom: 170px !important;
}

.investigation-header {
    margin-bottom: 26px;
}

.investigation-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 22px;
}

.investigation-header .dashboard-label {
    display: block;

    margin-bottom: 8px;

    color: #8ecbff;

    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.2em;
}

.investigation-header .dashboard-title {
    margin: 0;

    color: #ffffff;

    font-family: "Cinzel", serif;
    font-size: clamp(2rem, 7vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
}

.mission-active {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    flex-shrink: 0;

    padding: 8px 12px;

    color: #b9f6ca;
    background: rgba(45, 190, 110, 0.12);
    border: 1px solid rgba(45, 190, 110, 0.3);
    border-radius: 999px;

    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.mission-active-dot {
    width: 8px;
    height: 8px;

    background: #35d07f;
    border-radius: 50%;

    box-shadow: 0 0 0 5px rgba(53, 208, 127, 0.13);
}

.team-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 16px;
    padding: 18px 20px;

    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 20px;

    backdrop-filter: blur(10px);
}

.team-summary-label {
    display: block;

    margin-bottom: 3px;

    color: #8ecbff;

    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.team-summary-name {
    display: block;

    color: #ffffff;

    font-size: 1.15rem;
    font-weight: 700;
}

.team-summary-score {
    display: flex;
    align-items: baseline;
    gap: 4px;

    flex-shrink: 0;

    color: rgba(255, 255, 255, 0.72);
}

.team-summary-score strong {
    color: #ffffff;
    font-size: 1.6rem;
}

.team-summary-score span {
    font-size: 0.82rem;
}

.investigation-progress {
    padding: 20px;

    background: rgba(255, 255, 255, 0.97);
    border-radius: 22px;

    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.2);
}

.investigation-progress-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 12px;

    color: #10295d;

    font-size: 0.92rem;
    font-weight: 700;
}

.investigation-progress-header strong {
    font-size: 1.05rem;
}

.investigation-progress-track {
    width: 100%;
    height: 11px;

    overflow: hidden;

    background: #e5e9f1;
    border-radius: 999px;
}

.investigation-progress-value {
    height: 100%;

    background: linear-gradient(90deg, #284592, #0a84b8);
    border-radius: inherit;

    transition: width 0.5s ease;
}

.investigation-progress p {
    margin: 10px 0 0;

    color: #667085;

    font-size: 0.82rem;
}

@media (max-width: 576px) {
    body:has(.investigation-header) > .container {
        padding: 24px 18px 170px !important;
    }

    .investigation-heading {
        display: block;
    }

    .mission-active {
        margin-top: 16px;
    }

    .investigation-header .dashboard-title {
        font-size: 2rem;
    }
}


/* =========================
   CASE FILES
========================= */

.case-card{
    background:#fff;
    border-radius:24px;
    padding:24px;
    margin-bottom:22px;

    box-shadow:0 18px 45px rgba(0,0,0,.18);

    transition:.25s;
}

.case-card:hover{
    transform:translateY(-3px);
}

.case-card-top{

    display:flex;
    justify-content:space-between;
    align-items:center;

    margin-bottom:18px;
}

.case-code{

    font-size:.80rem;
    font-weight:700;
    letter-spacing:.12em;

    color:#284592;
}

.case-status{

    padding:7px 14px;

    border-radius:999px;

    font-size:.74rem;
    font-weight:700;
}

.case-status-available{

    background:#e9f9ef;
    color:#14853b;
}

.case-status-solved{

    background:#e8f1ff;
    color:#284592;
}

.case-status-locked{

    background:#ececec;
    color:#6d6d6d;
}

.case-card-body{

    display:flex;
    gap:20px;

    align-items:flex-start;
}

.case-icon{

    width:64px;
    height:64px;

    border-radius:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#eef3ff;

    color:#284592;

    font-size:1.6rem;

    flex-shrink:0;
}

.case-content{

    flex:1;
}

.case-content h2{

    margin:0 0 12px;

    color:#10295d;

    font-size:1.55rem;
    font-weight:700;
}

.case-content p{

    margin:0;

    color:#667085;

    line-height:1.65;
}

.case-card-action{

    margin-top:24px;
}

.case-button{

    width:100%;

    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;

    padding:14px;

    border-radius:14px;

    text-decoration:none;

    background:#284592;
    color:#fff;

    font-weight:600;

    transition:.25s;
}

.case-button:hover{

    background:#203875;
    color:#fff;
}

.case-button-disabled{

    background:#d8d8d8;
    color:#777;
}

.case-button-solved{

    background:#0a8f5b;
}

.case-button-solved:hover{

    background:#08784d;
}

@media(max-width:576px){

.case-card-body{

    flex-direction:column;
}

.case-icon{

    width:58px;
    height:58px;
}
}


/* =====================================================
   CASE FILE
===================================================== */

body:has(.case-page) {
    align-items: flex-start;

    background:
        radial-gradient(circle at top right, rgba(0,180,255,.14), transparent 35%),
        radial-gradient(circle at bottom left, rgba(40,69,146,.20), transparent 45%),
        linear-gradient(180deg,#07142f 0%,#0b1d44 55%,#10295d 100%);
}

.case-page{

    width:100%;
    min-height:100vh;

    padding:28px 18px 170px;
}

.case-container{

    max-width:900px;
    margin:auto;
}

.case-back-link{

    display:inline-flex;
    align-items:center;
    gap:10px;

    margin-bottom:24px;

    color:#8ecbff;

    text-decoration:none;

    font-weight:600;
}

.case-back-link:hover{

    color:#ffffff;
}

.case-header{

    margin-bottom:28px;
}

.case-header-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.case-kicker{

    display:block;

    margin-bottom:0;

    color:#8ecbff;

    font-size:.78rem;
    font-weight:700;
    letter-spacing:.22em;
}

.case-header h1{

    margin:0;

    color:#fff;

    font-family:"Cinzel",serif;

    font-size:clamp(2rem,6vw,3rem);
}

.case-header p{

    margin-top:10px;

    color:rgba(255,255,255,.78);

    font-size:1.05rem;
}

.case-active-status{

    display:flex;
    align-items:center;
    gap:8px;

    padding:8px 14px;

    border-radius:999px;

    background:rgba(46,204,113,.12);

    border:1px solid rgba(46,204,113,.28);

    color:#baf7c8;

    font-size:.75rem;
    font-weight:700;

    text-transform:uppercase;
}

.case-active-dot{

    width:8px;
    height:8px;

    border-radius:50%;

    background:#2ecc71;
}

.case-document{

    background:#fff;

    border-radius:28px;

    padding:34px;

    box-shadow:0 25px 60px rgba(0,0,0,.22);
}

@media(max-width:768px){

    .case-document{
        padding:24px;
    }

    .case-header-top{
        flex-direction:row;
        align-items:center;
        justify-content:space-between;
        gap:12px;
    }

    .case-active-status{
        margin-top:0;
        padding:7px 11px;
        font-size:.68rem;
    }
}

/* =====================================================
   CASE SECTIONS
===================================================== */

.case-section{

    margin-bottom:40px;
}

.case-section-title{

    display:flex;
    align-items:center;
    gap:16px;

    margin-bottom:18px;
}

.case-section-icon{

    width:54px;
    height:54px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

    border-radius:16px;

    background:#eef3ff;

    color:#284592;

    font-size:1.35rem;
}

.case-section-title span{

    display:block;

    margin-bottom:4px;

    color:#6b7280;

    font-size:.75rem;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.10em;
}

.case-section-title h2{

    margin:0;

    color:#10295d;

    font-size:1.55rem;

    font-weight:700;
}

.case-lead{

    margin-bottom:14px;

    color:#10295d;

    font-size:1.18rem;

    font-weight:500;

    line-height:1.6;
}

.case-section p{

    color:#667085;

    line-height:1.8;
}




/* ======================================================
   PROGRESS PAGE
====================================================== */

.progress-page{
    background:#0b214a;
    min-height:100vh;
    padding:40px 18px 120px;
}

.progress-container{
    max-width:620px;
    margin:0 auto;
}

.progress-header{
    margin-bottom:30px;
}

.progress-kicker{
    color:#79b6ff;
    text-transform:uppercase;
    letter-spacing:3px;
    font-size:.82rem;
    font-weight:700;
    margin-bottom:12px;
}

.progress-header h1{
    font-family:"Cormorant Garamond",serif;
    color:#fff;
    font-size:3.2rem;
    line-height:.95;
    margin-bottom:15px;
}

.progress-header p{
    color:#d8e4ff;
    font-size:1.08rem;
}

.progress-empty-card{
    background:#fff;
    border-radius:28px;
    padding:45px 30px;
    text-align:center;
    box-shadow:0 20px 40px rgba(0,0,0,.15);
}

.progress-empty-card i{
    width:78px;
    height:78px;
    border-radius:20px;
    background:#eef3ff;
    color:#284592;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:2rem;
    margin:0 auto 25px;
}

.progress-empty-card h2{
    color:#163a7a;
    font-weight:700;
    margin-bottom:12px;
}

.progress-empty-card p{
    color:#6d7b96;
    margin:0;
}


/* ======================================================
   PROGRESS SUMMARY
====================================================== */

.progress-summary-card {
    margin-bottom: 22px;
    padding: 24px;

    background: #ffffff;
    border-radius: 26px;

    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.18);
}

.progress-summary-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    margin-bottom: 24px;
}

.progress-summary-label {
    display: block;

    margin-bottom: 5px;

    color: #667085;

    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.progress-summary-score {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.progress-summary-score strong {
    color: #10295d;

    font-size: 2.8rem;
    line-height: 1;
}

.progress-summary-score span {
    color: #667085;

    font-size: 0.92rem;
}

.progress-summary-icon {
    width: 62px;
    height: 62px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #a66a00;
    background: rgba(234, 185, 75, 0.20);
    border-radius: 18px;

    font-size: 1.45rem;
}

.progress-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.progress-stat {
    padding: 15px 12px;

    text-align: center;

    background: #f3f6fb;
    border-radius: 16px;
}

.progress-stat span {
    display: block;

    margin-bottom: 6px;

    color: #667085;

    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1.3;
}

.progress-stat strong {
    color: #10295d;

    font-size: 1.15rem;
}

@media (max-width: 480px) {
    .progress-summary-grid {
        grid-template-columns: 1fr;
    }

    .progress-stat {
        display: flex;
        align-items: center;
        justify-content: space-between;

        text-align: left;
    }

    .progress-stat span {
        margin-bottom: 0;
    }
}


/* =====================================================
   SP3 — FLIGHT PLAN
===================================================== */

.flight-plan-table-wrapper {
    width: 100%;
    overflow-x: auto;

    border: 1px solid #e4e8f0;
    border-radius: 18px;

    box-shadow: 0 10px 28px rgba(16, 41, 93, 0.08);
}

.flight-plan-table {
    width: 100%;
    min-width: 520px;

    border-collapse: collapse;

    background: #ffffff;
}

.flight-plan-table th,
.flight-plan-table td {
    padding: 14px 16px;

    text-align: left;

    border-bottom: 1px solid #e8ebf1;
}

.flight-plan-table th {
    color: #10295d;
    background: #f2f5fb;

    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.flight-plan-table td {
    color: #55627a;

    font-size: 0.92rem;
}

.flight-plan-table tbody tr:last-child td {
    border-bottom: 0;
}

.flight-plan-table tbody tr:hover {
    background: #f8faff;
}

.route-valid {
    display: inline-flex;
    align-items: center;

    padding: 6px 10px;

    color: #14853b;
    background: #e9f9ef;
    border-radius: 999px;

    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.route-ignored {
    background: #fff5f3;
}

.route-ignored td {
    color: #9d5a51;
    text-decoration: line-through;
}

.route-ignored td:last-child {
    text-decoration: none;
}

.route-ignored span {
    display: inline-flex;
    align-items: center;

    padding: 6px 10px;

    color: #a63d32;
    background: #fde5e2;
    border-radius: 999px;

    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.case-evidence-quote {
    margin: 0;
    padding: 20px 22px;

    color: #26364f;
    background: #f7f4ec;
    border-left: 5px solid #eab94b;
    border-radius: 0 16px 16px 0;

    font-size: 1rem;
    font-style: italic;
    font-weight: 500;
    line-height: 1.7;
}

.flight-plan-notes {
    display: grid;
    gap: 12px;

    margin-top: 20px;
}

.flight-plan-notes p {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    margin: 0;
    padding: 14px 16px;

    color: #4e5d73;
    background: #f4f7fb;
    border-radius: 14px;

    line-height: 1.5;
}

.flight-plan-notes i {
    width: 22px;

    flex-shrink: 0;

    color: #284592;
    text-align: center;

    margin-top: 3px;
}

@media (max-width: 576px) {
    .flight-plan-table th,
    .flight-plan-table td {
        padding: 12px 13px;
    }

    .case-evidence-quote {
        padding: 17px 18px;
    }
}