@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Poppins:wght@600;700;800&display=swap');
:root{--ag:#00B4A3;--ag-dark:#008f82;--navy:#12233f;--ink:#1d2939;--muted:#667085;--bg:#f4fbfa;--card:#fff;--line:#dce9e7;--good:#11875d;--bad:#c93434;--gold:#e7a900}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Arial,sans-serif}
a{color:inherit}.container{max-width:1160px;margin:auto;padding:34px 20px 70px}.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:13px max(20px,calc((100vw - 1160px)/2));background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--navy)}.brand-mark{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:var(--ag);color:white;font-weight:900}.brand strong,.brand small{display:block}.brand small{font-size:11px;color:var(--muted);margin-top:2px}
nav{display:flex;align-items:center;gap:18px}nav a{text-decoration:none;font-weight:700;font-size:14px}.nav-cta,.btn{border:0;border-radius:999px;background:var(--ag);color:white!important;padding:12px 19px;text-decoration:none;font-weight:800;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;gap:8px}.btn:hover,.nav-cta:hover{background:var(--ag-dark)}.btn.secondary{background:white;color:var(--navy)!important;border:1px solid var(--line)}.btn.danger{background:var(--bad)}
.hero{text-align:center;padding:58px 0 36px}.eyebrow{display:inline-block;padding:7px 12px;border-radius:999px;background:#dcf8f4;color:#007e73;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}h1,h2,h3{font-family:Poppins,Inter,sans-serif;color:var(--navy)}h1{font-size:clamp(34px,5vw,60px);line-height:1.08;margin:18px auto 14px}.hero p{max-width:760px;margin:auto;color:var(--muted);font-size:18px;line-height:1.7}
.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:0 14px 38px rgba(22,71,68,.08)}.card h2,.card h3{margin-top:0}.muted{color:var(--muted)}.stat strong{display:block;font-size:28px;color:var(--navy)}.stat span{font-size:13px;color:var(--muted)}
.form-card{max-width:590px;margin:32px auto}.field{margin-bottom:16px}.field label{display:block;font-weight:700;font-size:13px;margin-bottom:7px}.field input,.field select{width:100%;padding:14px 15px;border:1px solid #cddbd9;border-radius:13px;background:white;font:inherit}.field input:focus,.field select:focus{outline:3px solid rgba(0,180,163,.17);border-color:var(--ag)}
.alert{padding:14px 16px;border-radius:14px;margin-bottom:18px}.alert.success{background:#e9f9f2;color:#08704b}.alert.error{background:#fff0f0;color:#a52121}
.level-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.level-tabs a{padding:10px 16px;border-radius:999px;background:white;border:1px solid var(--line);text-decoration:none;font-weight:800}.level-tabs a.active{background:var(--navy);color:white}
.test-card{display:flex;flex-direction:column}.test-card .meta{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 18px}.pill{font-size:11px;font-weight:800;padding:7px 9px;border-radius:999px;background:#f1f7f6;border:1px solid var(--line)}.test-card .btn{margin-top:auto}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:18px;background:white}table{width:100%;border-collapse:collapse;min-width:720px}th,td{padding:14px;text-align:left;border-bottom:1px solid var(--line);font-size:13px}th{background:#f3f8f7;color:var(--navy)}
.progress{height:10px;background:#e7efee;border-radius:999px;overflow:hidden}.progress span{display:block;height:100%;background:var(--ag)}
.quiz-shell{max-width:850px;margin:20px auto}.quiz-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.quiz-question{font-size:clamp(21px,3vw,30px);line-height:1.35}.options{display:grid;gap:12px;margin-top:22px}.option{width:100%;display:flex;align-items:center;gap:13px;padding:16px;border-radius:16px;background:white;border:2px solid var(--line);font:inherit;font-weight:700;text-align:left;cursor:pointer}.option:hover{border-color:var(--ag)}.option.correct{border-color:var(--good);background:#eaf9f3}.option.wrong{border-color:var(--bad);background:#fff0f0}.letter{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#eef5f4;flex:0 0 auto}.feedback{min-height:52px;padding:14px 0;color:var(--muted)}.quiz-actions{position:sticky;bottom:10px;display:flex;justify-content:space-between;gap:12px;padding:12px;background:rgba(244,251,250,.96);border-radius:18px}.quiz-actions .btn{min-width:145px}
.lock{font-size:12px;color:#8a5a00;background:#fff5d6;padding:8px 10px;border-radius:999px;font-weight:800}.site-footer{text-align:center;padding:32px 20px;color:var(--muted);font-size:12px;line-height:1.7;border-top:1px solid var(--line);background:white}
@media(max-width:800px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.site-header{align-items:flex-start}.site-header nav{gap:10px;flex-wrap:wrap;justify-content:flex-end}.site-header nav a:not(.nav-cta){display:none}.container{padding:25px 14px 55px}.card{padding:20px}.quiz-actions .btn{flex:1;min-width:0}.hero{padding-top:36px}}



/* Assessment mode */
.option.selected{
    border-color:var(--ag);
    background:#effbf9;
    box-shadow:0 0 0 2px rgba(0,180,163,.08);
}
.option.selected .letter{
    background:var(--ag);
    color:#fff;
}
.feedback:empty{
    display:none;
}

/* End-of-test assessment report */
.report-actions{
    display:flex;
    justify-content:flex-end;
    gap:12px;
    margin-bottom:20px;
}
.assessment-report{
    max-width:1050px;
    margin:0 auto;
}
.report-cover{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:24px;
    padding:42px;
    border-radius:28px;
    background:#132f50;
    color:#fff;
}
.report-cover h1{
    color:#fff;
    margin:12px 0 8px;
}
.report-cover p{
    margin:0;
    opacity:.82;
}
.report-score{
    text-align:right;
}
.report-score strong{
    display:block;
    font-size:clamp(48px,8vw,82px);
    line-height:1;
}
.report-score span{
    display:block;
    margin-top:8px;
}
.report-candidate{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin:18px 0;
}
.report-candidate>div{
    padding:16px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
}
.report-candidate small,
.report-candidate strong{
    display:block;
}
.report-candidate small{
    color:var(--muted);
    margin-bottom:5px;
}
.report-section{
    margin-top:22px;
}
.topic-summary{
    display:grid;
    gap:14px;
}
.topic-row{
    display:grid;
    grid-template-columns:minmax(180px,1fr) minmax(180px,2fr) 70px;
    align-items:center;
    gap:14px;
}
.topic-row span{
    display:block;
    color:var(--muted);
    font-size:14px;
    margin-top:3px;
}
.topic-progress{
    height:10px;
    background:#e8f0ef;
    border-radius:999px;
    overflow:hidden;
}
.topic-progress span{
    display:block;
    height:100%;
    margin:0;
    background:var(--ag);
    border-radius:inherit;
}
.analysis-item+ .analysis-item{
    border-top:1px solid var(--line);
    margin-top:18px;
    padding-top:18px;
}
.reason-list{
    margin:12px 0 0;
    padding-left:20px;
}
.reason-list li+li{
    margin-top:8px;
}
.review-item{
    display:grid;
    grid-template-columns:44px 1fr;
    gap:16px;
    padding:22px 0;
    border-top:1px solid var(--line);
}
.review-item:first-of-type{
    border-top:0;
}
.review-number{
    width:38px;
    height:38px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#fff0f0;
    color:#a92323;
    font-weight:800;
}
.review-item h3{
    margin:12px 0 16px;
    font-size:21px;
}
.answer-review{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin:0;
}
.answer-review>div{
    padding:14px;
    border-radius:14px;
    background:#f5faf9;
}
.answer-review>div:last-child{
    grid-column:1/-1;
}
.answer-review dt{
    color:var(--muted);
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.answer-review dd{
    margin:6px 0 0;
    font-weight:700;
    line-height:1.5;
}
.report-footer{
    text-align:center;
    color:var(--muted);
    padding:34px 20px 10px;
    line-height:1.7;
}

@media(max-width:800px){
    .report-cover{
        align-items:flex-start;
        flex-direction:column;
        padding:28px 22px;
    }
    .report-score{
        text-align:left;
    }
    .report-candidate{
        grid-template-columns:1fr 1fr;
    }
    .topic-row{
        grid-template-columns:1fr 60px;
    }
    .topic-progress{
        grid-column:1/-1;
        grid-row:2;
    }
    .answer-review{
        grid-template-columns:1fr;
    }
    .answer-review>div:last-child{
        grid-column:auto;
    }
}

@media print{
    @page{
        size:A4;
        margin:14mm;
    }
    body{
        background:#fff!important;
        color:#111!important;
        font-size:11pt;
    }
    .site-header,
    .site-footer,
    .no-print{
        display:none!important;
    }
    .container{
        max-width:none;
        padding:0!important;
    }
    .assessment-report{
        max-width:none;
    }
    .report-cover{
        border-radius:0;
        padding:18mm 12mm;
        background:#132f50!important;
        color:#fff!important;
        -webkit-print-color-adjust:exact;
        print-color-adjust:exact;
    }
    .report-candidate{
        grid-template-columns:repeat(2,1fr);
    }
    .card{
        box-shadow:none!important;
        break-inside:avoid;
    }
    .report-analysis{
        grid-template-columns:1fr 1fr!important;
    }
    .review-item{
        break-inside:avoid;
    }
    .report-footer{
        display:block;
    }
}