:root {
    --kuryn-navy: #071b45;
    --kuryn-blue: #0d6efd;
    --kuryn-cyan: #19a7ff;
    --kuryn-bg: #f4f7fb;
    --kuryn-text: #13213c;
}

* { box-sizing: border-box; }
body { font-family: "Segoe UI", Inter, system-ui, -apple-system, sans-serif; color: var(--kuryn-text); }
.navbar-brand { font-weight: 800; color: var(--kuryn-navy); }
.brand-logo { width: 42px; height: 42px; object-fit: contain; }
.hero-section { background: radial-gradient(circle at 90% 10%, rgba(25,167,255,.18), transparent 30%), linear-gradient(135deg, #f8fbff, #eef4ff); min-height: 78vh; display: flex; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: .45rem; color: var(--kuryn-blue); font-weight: 800; font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; }
.hero-card, .feature-card, .content-card, .course-card { background: #fff; border: 1px solid rgba(9,48,107,.08); border-radius: 1.25rem; box-shadow: 0 20px 50px rgba(11,45,107,.10); }
.hero-card { overflow: hidden; }
.window-bar { background: #edf2f9; padding: .75rem 1rem; display: flex; gap: .4rem; }
.window-bar span { width: 10px; height: 10px; border-radius: 50%; background: #a9b6c9; }
.simulation-box { display: flex; align-items: center; gap: 1rem; background: #f3f7ff; border: 1px dashed #9cbcff; border-radius: 1rem; padding: 1.25rem; }
.simulation-box i { font-size: 2.5rem; color: var(--kuryn-blue); }
.simulation-box small { display: block; color: #67758c; }
.feature-card { padding: 2rem; height: 100%; box-shadow: 0 10px 30px rgba(11,45,107,.07); }
.feature-card i { font-size: 2rem; color: var(--kuryn-blue); margin-bottom: 1.25rem; }
.feature-card h3 { font-size: 1.25rem; font-weight: 800; }
.feature-card p { color: #66758d; margin-bottom: 0; }

.auth-page { background: radial-gradient(circle at top right, rgba(25,167,255,.20), transparent 35%), var(--kuryn-bg); }
.auth-card { width: min(100%, 460px); background: #fff; border-radius: 1.4rem; padding: 2rem; box-shadow: 0 25px 70px rgba(7,27,69,.14); }
.auth-logo { width: 150px; height: 90px; object-fit: contain; }
.form-control { border-radius: .8rem; border-color: #dbe3ef; }
.btn { border-radius: .8rem; font-weight: 700; }

.dashboard-body { background: var(--kuryn-bg); min-height: 100vh; }
.dashboard-layout { display: grid; grid-template-columns: 260px 1fr; min-height: 100vh; }
.sidebar { background: linear-gradient(180deg, #071b45, #0b2d6b); color: #fff; padding: 1.5rem; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
.sidebar-brand { color: #fff; text-decoration: none; display: flex; align-items: center; gap: .7rem; font-weight: 800; font-size: 1.2rem; }
.sidebar-brand img { width: 52px; height: 52px; object-fit: contain; background: #fff; border-radius: .8rem; padding: .3rem; }
.sidebar nav a, .sidebar-logout { display: flex; align-items: center; gap: .8rem; width: 100%; color: rgba(255,255,255,.78); text-decoration: none; padding: .85rem 1rem; margin-bottom: .35rem; border-radius: .8rem; border: 0; background: transparent; text-align: left; }
.sidebar nav a:hover, .sidebar nav a.active, .sidebar-logout:hover { background: rgba(255,255,255,.12); color: #fff; }
.dashboard-main { padding: 2rem; min-width: 0; }
.dashboard-topbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem; }
.dashboard-topbar small { color: #75839a; }
.dashboard-topbar h1 { font-size: 1.8rem; font-weight: 800; margin: .2rem 0 0; }
.profile-pill { background: #fff; border-radius: 999px; padding: .7rem 1rem; font-weight: 700; box-shadow: 0 8px 25px rgba(11,45,107,.08); }
.stat-card { background: #fff; padding: 1.4rem; border-radius: 1.1rem; display: flex; align-items: center; gap: 1rem; box-shadow: 0 10px 30px rgba(11,45,107,.07); }
.stat-card > i { width: 54px; height: 54px; border-radius: 1rem; display: grid; place-items: center; background: #eaf2ff; color: var(--kuryn-blue); font-size: 1.35rem; }
.stat-card span { color: #768399; display: block; font-size: .9rem; }
.stat-card strong { font-size: 1.7rem; }
.content-card { padding: 1.5rem; box-shadow: 0 10px 30px rgba(11,45,107,.07); }
.content-card-header h2 { font-size: 1.2rem; font-weight: 800; margin: .25rem 0 1rem; }
.roadmap-list { display: grid; gap: 1rem; }
.roadmap-list > div { display: flex; gap: 1rem; align-items: center; padding: 1rem; border-radius: 1rem; background: #f7f9fc; }
.roadmap-list > div > span { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: #dfe7f2; font-weight: 800; }
.roadmap-list .done > span { background: #dff6e7; color: #15803d; }
.roadmap-list small, .student-list small { display: block; color: #78869b; }
.student-list { display: grid; gap: .9rem; }
.student-list > div { display: flex; gap: .8rem; align-items: center; }
.student-list > div > span { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #e9f1ff; color: var(--kuryn-blue); font-weight: 800; }
.course-card { padding: 1.5rem; height: 100%; }
.course-card h2 { font-size: 1.25rem; font-weight: 800; margin-top: 1rem; }
.course-card p { color: #6f7e94; }

@media (max-width: 991px) {
    .dashboard-layout { grid-template-columns: 1fr; }
    .sidebar { position: static; height: auto; }
    .dashboard-main { padding: 1.25rem; }
    .dashboard-topbar { align-items: flex-start; gap: 1rem; }
}

/* Etapa 2 — Catálogo educacional */
.sidebar-label { margin: 1.1rem 1rem .45rem; color: rgba(255,255,255,.45); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.sidebar .disabled-link { opacity: .55; cursor: default; pointer-events: none; }
.page-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.catalog-filters { display: flex; gap: .7rem; align-items: center; flex: 1; }
.catalog-filters .input-group { max-width: 340px; }
.catalog-filters .form-select { max-width: 220px; }
.catalog-filters-wide .input-group { min-width: 260px; }
.catalog-table { margin-bottom: 0; }
.catalog-table thead th { color: #78869b; font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; border-bottom-width: 1px; white-space: nowrap; }
.catalog-table td { padding-top: 1rem; padding-bottom: 1rem; }
.catalog-table td strong, .catalog-table td small { display: block; }
.catalog-table td small { color: #7b8799; margin-top: .2rem; max-width: 460px; }
.catalog-table code { color: #43536c; background: #f0f4f9; padding: .3rem .5rem; border-radius: .45rem; }
.status-badge { display: inline-flex; align-items: center; padding: .3rem .55rem; border-radius: 999px; font-size: .72rem; font-weight: 800; white-space: nowrap; }
.status-ativa, .status-publicado, .status-publicada { background: #dcfce7; color: #166534; }
.status-inativa, .status-arquivado { background: #f1f5f9; color: #526174; }
.status-rascunho { background: #fef3c7; color: #92400e; }
.empty-state { text-align: center; padding: 4rem 1.5rem; }
.empty-state > i { font-size: 3rem; color: #9db4d8; margin-bottom: 1rem; }
.empty-state h2 { font-size: 1.35rem; font-weight: 800; }
.empty-state p { color: #77869b; }
.form-card { border: 0; }
.form-card .form-label { font-weight: 700; color: #263752; }
.form-section-title { font-size: 1.1rem; font-weight: 800; padding-bottom: .9rem; margin-bottom: 1.25rem; border-bottom: 1px solid #e9eef5; }
.form-actions { display: flex; justify-content: flex-end; gap: .8rem; padding-top: 1.5rem; margin-top: 1.5rem; border-top: 1px solid #e9eef5; }
.sticky-form-actions { position: sticky; bottom: 0; z-index: 10; display: flex; justify-content: flex-end; gap: .8rem; margin-top: 1.5rem; padding: 1rem 1.25rem; background: rgba(255,255,255,.95); border: 1px solid #dce5f1; border-radius: 1rem; box-shadow: 0 -10px 30px rgba(7,27,69,.08); backdrop-filter: blur(10px); }
.course-cover-preview { width: 100%; aspect-ratio: 16/9; border-radius: 1rem; object-fit: cover; border: 1px solid #dce5f1; }
.content-editor { min-height: 310px; }
.current-file { display: flex; align-items: center; gap: .6rem; margin-bottom: .75rem; padding: .75rem; background: #f2f7ff; border-radius: .8rem; }
.info-box { display: flex; gap: .9rem; align-items: flex-start; }
.info-box > i { width: 42px; height: 42px; border-radius: .8rem; background: #fff3cd; color: #946200; display: grid; place-items: center; flex: 0 0 auto; }
.info-box p { color: #708097; font-size: .9rem; margin-top: .25rem; }
.order-pill { width: 36px; height: 36px; border-radius: .7rem; display: grid; place-items: center; background: #edf3ff; color: #0d6efd; font-weight: 800; }
.type-badge { display: inline-flex; gap: .45rem; align-items: center; color: #52627b; font-size: .85rem; }
.stat-card-link { color: inherit; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.stat-card-link:hover { color: inherit; transform: translateY(-3px); box-shadow: 0 16px 34px rgba(11,45,107,.12); }
.mini-empty { text-align: center; padding: 2rem 1rem; color: #74839a; }
.mini-empty i { font-size: 2rem; color: #9db4d8; }
.mini-empty p { margin: .8rem 0 .2rem; }
.recent-course-list { display: grid; gap: .75rem; }
.recent-course-list > a { display: grid; grid-template-columns: 46px 1fr auto; align-items: center; gap: .75rem; color: inherit; text-decoration: none; padding: .7rem; border-radius: .8rem; transition: background .2s; }
.recent-course-list > a:hover { background: #f4f7fb; }
.recent-course-list img, .recent-cover { width: 46px; height: 46px; object-fit: cover; border-radius: .7rem; background: #edf3ff; color: #0d6efd; display: grid; place-items: center; }
.recent-course-list strong, .recent-course-list small { display: block; }
.recent-course-list small { color: #7b8799; font-size: .78rem; }

.admin-course-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.admin-course-card { background: #fff; border: 1px solid #e2e9f3; border-radius: 1.1rem; overflow: hidden; display: flex; flex-direction: column; min-width: 0; }
.admin-course-cover { aspect-ratio: 16/8.5; position: relative; overflow: hidden; background: #edf3ff; }
.admin-course-cover img { width: 100%; height: 100%; object-fit: cover; }
.cover-placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: #4b83dd; font-size: 3rem; background: linear-gradient(135deg,#e8f0ff,#f7fbff); }
.featured-badge { position: absolute; top: .75rem; left: .75rem; background: rgba(7,27,69,.88); color: #fff; border-radius: 999px; padding: .35rem .6rem; font-size: .72rem; font-weight: 800; }
.admin-course-body { padding: 1.2rem; display: flex; flex-direction: column; flex: 1; }
.admin-course-body h2 { font-size: 1.15rem; font-weight: 800; margin: .8rem 0 .5rem; }
.admin-course-body p { color: #708097; font-size: .9rem; min-height: 2.7rem; }
.course-metrics { display: flex; flex-wrap: wrap; gap: .8rem; color: #67778e; font-size: .8rem; }
.course-metrics span { display: inline-flex; gap: .35rem; align-items: center; }
.course-price { display: flex; align-items: baseline; gap: .6rem; margin-top: 1rem; }
.course-price strong { font-size: 1.15rem; color: #0b2d6b; }
.course-price del { color: #8995a8; font-size: .8rem; }
.course-card-actions { display: flex; gap: .45rem; align-items: center; margin-top: auto; padding-top: 1.1rem; }
.course-card-actions form { display: inline; }

.course-structure-header { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; }
.course-structure-summary { display: flex; align-items: center; gap: 1.2rem; min-width: 0; }
.course-structure-summary > img, .structure-cover-placeholder { width: 170px; aspect-ratio: 16/9; object-fit: cover; border-radius: 1rem; flex: 0 0 auto; }
.structure-cover-placeholder { display: grid; place-items: center; background: #edf3ff; color: #0d6efd; font-size: 2.5rem; }
.course-structure-summary h2 { font-size: 1.35rem; font-weight: 800; margin: 0 0 .3rem; }
.course-structure-summary p { color: #718096; margin-bottom: .7rem; }
.structure-actions { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: flex-end; }
.module-builder { display: grid; gap: 1.25rem; }
.module-block { background: #fff; border: 1px solid #dfe7f2; border-radius: 1.1rem; overflow: hidden; box-shadow: 0 8px 24px rgba(11,45,107,.05); }
.module-block-header { display: flex; align-items: center; gap: 1rem; padding: 1.2rem; background: #f8faff; border-bottom: 1px solid #e4ebf4; }
.module-order { width: 44px; height: 44px; display: grid; place-items: center; border-radius: .9rem; background: #0d6efd; color: #fff; font-weight: 900; flex: 0 0 auto; }
.module-block-header h2 { font-size: 1.1rem; font-weight: 800; margin: 0; }
.module-block-header p { color: #74839a; margin: .3rem 0 0; font-size: .87rem; }
.module-actions, .lesson-actions { display: flex; gap: .35rem; align-items: center; flex-wrap: wrap; }
.module-actions form, .lesson-actions form { display: inline; }
.lesson-builder-list { padding: .7rem 1.2rem 1.2rem; }
.lesson-builder-item { display: grid; grid-template-columns: 36px 42px minmax(220px,1fr) auto auto; align-items: center; gap: .8rem; padding: .85rem 0; border-bottom: 1px solid #edf1f6; }
.lesson-builder-item:last-child { border-bottom: 0; }
.lesson-order { color: #8290a4; font-weight: 800; text-align: center; }
.lesson-type-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: .8rem; background: #edf3ff; color: #0d6efd; }
.lesson-main strong, .lesson-main small { display: block; }
.lesson-main small { color: #75839a; margin-top: .25rem; }
.lesson-meta { display: flex; gap: .8rem; color: #76859b; font-size: .78rem; }
.module-empty { padding: 1.2rem; display: flex; align-items: center; justify-content: center; gap: .7rem; color: #74839a; }

.catalog-section { background: #f5f8fd; }
.public-empty { background: #fff; border-radius: 1.2rem; padding: 3rem; text-align: center; border: 1px solid #e4eaf3; }
.public-empty i { font-size: 2.8rem; color: #0d6efd; }
.public-course-card { height: 100%; background: #fff; border: 1px solid #e1e8f2; border-radius: 1.1rem; overflow: hidden; box-shadow: 0 12px 32px rgba(11,45,107,.07); transition: transform .2s ease; }
.public-course-card:hover { transform: translateY(-5px); }
.public-course-card > img, .public-course-placeholder { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.public-course-placeholder { display: grid; place-items: center; color: #0d6efd; font-size: 3.2rem; background: linear-gradient(135deg,#e8f0ff,#f9fbff); }
.public-course-card h3 { font-size: 1.25rem; font-weight: 800; margin: .7rem 0; }
.public-course-card p { color: #718097; min-height: 3rem; }
.public-price { color: #0b2d6b; font-size: 1.15rem; }
.course-public-hero { background: radial-gradient(circle at top right,rgba(25,167,255,.16),transparent 35%),linear-gradient(135deg,#f8fbff,#eef4ff); }
.course-public-hero h1 { font-size: clamp(2.2rem,5vw,4rem); font-weight: 850; margin: 1rem 0; }
.course-public-hero .lead { color: #5f6f86; }
.course-public-meta { display: flex; flex-wrap: wrap; gap: 1rem; color: #50627d; }
.course-public-meta span { display: inline-flex; align-items: center; gap: .4rem; }
.course-public-cover { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 1.2rem; box-shadow: 0 20px 50px rgba(11,45,107,.15); }
.course-public-cover.placeholder { display: grid; place-items: center; font-size: 5rem; color: #0d6efd; background: #fff; }
.public-detail-card, .enroll-card { background: #fff; border: 1px solid #e1e8f2; border-radius: 1.15rem; padding: 1.5rem; margin-bottom: 1.25rem; }
.public-detail-card h2 { font-size: 1.35rem; font-weight: 800; margin-bottom: 1rem; }
.public-detail-card p { color: #65758c; line-height: 1.75; }
.learning-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .85rem; }
.learning-list > div { display: flex; gap: .65rem; align-items: flex-start; color: #44546c; }
.learning-list i { color: #16a34a; margin-top: .2rem; }
.accordion-item { border-color: #e2e9f2; }
.accordion-button { gap: .8rem; }
.accordion-button strong, .accordion-button small { display: block; }
.accordion-button small { color: #7b8799; font-size: .75rem; margin-top: .1rem; }
.module-number { width: 34px; height: 34px; display: grid; place-items: center; border-radius: .7rem; background: #edf3ff; color: #0d6efd; font-weight: 800; flex: 0 0 auto; }
.public-lesson-row { display: grid; grid-template-columns: 25px 1fr auto; gap: .7rem; align-items: center; padding: .75rem 0; border-bottom: 1px solid #edf1f6; }
.public-lesson-row:last-child { border-bottom: 0; }
.public-lesson-row i { color: #0d6efd; }
.public-lesson-row small { color: #7a8799; }
.enroll-card { position: sticky; top: 95px; box-shadow: 0 18px 45px rgba(11,45,107,.09); }
.enroll-card > span, .enroll-card > del, .enroll-card > strong { display: block; }
.enroll-card > del { color: #8b97a8; margin-top: .4rem; }
.enroll-card > strong { font-size: 2rem; color: #0b2d6b; margin: .2rem 0 1.2rem; }
.enroll-card ul { list-style: none; padding: 1.2rem 0 0; margin: 1.2rem 0 0; border-top: 1px solid #e8edf4; display: grid; gap: .8rem; }
.enroll-card li { display: flex; gap: .6rem; align-items: center; color: #53647c; }
.enroll-card li i { color: #0d6efd; width: 20px; }
.instructor-line { display: flex; align-items: center; gap: .7rem; padding-top: 1.2rem; margin-top: 1.2rem; border-top: 1px solid #e8edf4; }
.instructor-line > i { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #edf3ff; color: #0d6efd; }
.instructor-line small, .instructor-line strong { display: block; }

@media (max-width: 1199px) {
    .admin-course-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .course-structure-header { align-items: flex-start; flex-direction: column; }
    .structure-actions { justify-content: flex-start; }
    .lesson-builder-item { grid-template-columns: 36px 42px minmax(180px,1fr) auto; }
    .lesson-meta { display: none; }
}
@media (max-width: 767px) {
    .page-actions, .catalog-filters { align-items: stretch; flex-direction: column; }
    .catalog-filters .input-group, .catalog-filters .form-select { max-width: none; width: 100%; }
    .admin-course-grid { grid-template-columns: 1fr; }
    .course-structure-summary { align-items: flex-start; flex-direction: column; }
    .course-structure-summary > img, .structure-cover-placeholder { width: 100%; }
    .module-block-header { align-items: flex-start; flex-wrap: wrap; }
    .module-actions { width: 100%; }
    .lesson-builder-item { grid-template-columns: 32px 40px 1fr; }
    .lesson-actions { grid-column: 2 / -1; }
    .learning-list { grid-template-columns: 1fr; }
    .public-lesson-row { grid-template-columns: 24px 1fr; }
    .public-lesson-row small { grid-column: 2; }
    .sticky-form-actions { position: static; }
}
.update-card { max-width: 760px; margin: 0 auto; text-align: center; padding: 2.5rem; }
.update-icon { width: 76px; height: 76px; border-radius: 1.2rem; display: grid; place-items: center; margin: 0 auto 1rem; background: #edf3ff; color: #0d6efd; font-size: 2rem; }
.update-card h2 { font-weight: 800; }
.migration-list { display: flex; flex-wrap: wrap; justify-content: center; gap: .55rem; margin-top: 1.25rem; }
.migration-list span { display: inline-flex; align-items: center; gap: .4rem; background: #f3f6fa; border-radius: 999px; padding: .45rem .7rem; color: #53647c; font-size: .82rem; }
.migration-list i { color: #16a34a; }

/* Etapa 3 — Alunos, matrículas e ambiente de aprendizagem */
.auth-card-wide { width: min(100%, 640px); }
.admin-table thead th { color: #78869b; font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.admin-table td { padding-top: 1rem; padding-bottom: 1rem; }
.student-identity { display: flex; align-items: center; gap: .8rem; }
.student-identity > span { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #eaf2ff; color: #0d6efd; font-weight: 900; }
.student-identity strong, .student-identity small { display: block; }
.student-identity small { color: #78869b; margin-top: .15rem; }
.progress-thin { height: 7px; border-radius: 999px; background: #e8eef7; }
.status-ativo, .status-ativa, .status-concluida { background: #dcfce7; color: #166534; }
.status-inativo, .status-inativa, .status-expirada { background: #f1f5f9; color: #526174; }
.status-bloqueado, .status-cancelada { background: #fee2e2; color: #991b1b; }
.student-profile-card { text-align: center; }
.student-avatar-lg { width: 88px; height: 88px; margin: 0 auto 1rem; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg,#dce9ff,#f1f7ff); color: #0d6efd; font-size: 2rem; font-weight: 900; }
.student-profile-card h2 { font-size: 1.35rem; font-weight: 800; margin-bottom: .35rem; }
.student-profile-card > p { color: #6f7e94; margin-bottom: .45rem; }
.student-profile-meta { display: grid; gap: .65rem; text-align: left; margin: 1.4rem 0; padding: 1rem; background: #f5f8fc; border-radius: .9rem; color: #6d7c91; font-size: .85rem; }
.student-profile-meta span { display: flex; justify-content: space-between; gap: 1rem; }
.admin-enrollment-list { display: grid; gap: 1rem; }
.admin-enrollment-list article { display: grid; grid-template-columns: 64px minmax(0,1fr) 135px; align-items: center; gap: 1rem; padding: 1rem; border: 1px solid #e4eaf3; border-radius: 1rem; }
.admin-enrollment-list img, .admin-enrollment-list .recent-cover { width: 64px; height: 64px; border-radius: .9rem; object-fit: cover; }
.admin-enrollment-list small { color: #76859a; }
.enrollment-status-form { min-width: 130px; }
.learning-history { display: grid; gap: .8rem; }
.learning-history > div { display: grid; grid-template-columns: 42px 1fr auto; gap: .8rem; align-items: center; padding: .75rem 0; border-bottom: 1px solid #edf1f6; }
.learning-history > div:last-child { border-bottom: 0; }
.history-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: .8rem; background: #edf3ff; color: #0d6efd; }
.learning-history strong, .learning-history small { display: block; }
.learning-history small { color: #718096; margin-top: .15rem; }
.learning-history time { color: #8a96a7; font-size: .75rem; white-space: nowrap; }

.student-body { margin: 0; min-height: 100vh; background: #f3f6fb; }
.student-layout { display: grid; grid-template-columns: 245px minmax(0,1fr); min-height: 100vh; }
.student-sidebar { position: sticky; top: 0; height: 100vh; background: linear-gradient(180deg,#071b45,#0d3275); padding: 1.4rem; display: flex; flex-direction: column; color: #fff; z-index: 1030; }
.student-brand { display: flex; align-items: center; gap: .75rem; color: #fff; text-decoration: none; font-weight: 900; font-size: 1.15rem; }
.student-brand img { width: 50px; height: 50px; object-fit: contain; background: #fff; padding: .25rem; border-radius: .8rem; }
.student-sidebar nav { display: grid; gap: .35rem; margin-top: 2rem; }
.student-sidebar nav a, .student-logout { display: flex; align-items: center; gap: .8rem; color: rgba(255,255,255,.78); text-decoration: none; border: 0; background: transparent; width: 100%; padding: .85rem 1rem; border-radius: .8rem; text-align: left; }
.student-sidebar nav a:hover, .student-sidebar nav a.active, .student-logout:hover { background: rgba(255,255,255,.12); color: #fff; }
.student-main { padding: 1.7rem 2rem 3rem; min-width: 0; }
.student-topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.8rem; }
.student-topbar small { color: #7b8799; }
.student-topbar h1 { margin: .2rem 0 0; font-size: 1.75rem; font-weight: 850; }
.student-user-pill { display: flex; align-items: center; gap: .7rem; background: #fff; border-radius: 999px; padding: .5rem .85rem .5rem .55rem; box-shadow: 0 8px 25px rgba(11,45,107,.08); }
.student-user-pill > span { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: #eaf2ff; color: #0d6efd; font-weight: 900; }
.student-user-pill strong, .student-user-pill small { display: block; line-height: 1.2; }
.student-user-pill small { font-size: .72rem; }
.student-menu-button { display: none; width: 42px; height: 42px; border: 0; border-radius: .75rem; background: #fff; color: #0b2d6b; box-shadow: 0 8px 20px rgba(11,45,107,.08); }
.student-stat-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.student-stat-grid > div { background: #fff; border: 1px solid #e4eaf3; border-radius: 1rem; padding: 1.2rem; display: grid; grid-template-columns: 50px 1fr; gap: .1rem 1rem; align-items: center; }
.student-stat-grid i { grid-row: 1 / 3; width: 50px; height: 50px; display: grid; place-items: center; border-radius: .9rem; background: #eaf2ff; color: #0d6efd; font-size: 1.2rem; }
.student-stat-grid span { color: #728198; font-size: .85rem; }
.student-stat-grid strong { font-size: 1.55rem; }
.student-empty { background: #fff; border: 1px solid #e3e9f2; border-radius: 1.2rem; padding: 4rem 1.5rem; text-align: center; }
.student-empty.compact { padding: 3rem 1.5rem; }
.student-empty > i { font-size: 3rem; color: #0d6efd; margin-bottom: 1rem; }
.student-empty h2 { font-size: 1.45rem; font-weight: 850; }
.student-empty p { color: #728198; }
.continue-learning-card { display: grid; grid-template-columns: minmax(260px,34%) 1fr; background: linear-gradient(135deg,#071b45,#0e428f); color: #fff; border-radius: 1.3rem; overflow: hidden; box-shadow: 0 18px 45px rgba(7,27,69,.18); }
.continue-cover { min-height: 265px; background: rgba(255,255,255,.08); display: grid; place-items: center; font-size: 4rem; }
.continue-cover img { width: 100%; height: 100%; object-fit: cover; }
.continue-content { padding: 2rem; align-self: center; }
.continue-content .eyebrow { color: #8fd3ff; }
.continue-content h2 { font-size: 1.8rem; font-weight: 850; margin: .7rem 0; }
.continue-content p, .continue-content small { color: rgba(255,255,255,.72); }
.continue-content .progress { background: rgba(255,255,255,.18); height: 9px; }
.continue-content .progress-bar { background: #38bdf8; }
.student-section { background: #fff; border: 1px solid #e2e9f2; border-radius: 1.15rem; padding: 1.4rem; }
.student-section-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; }
.student-section-header h2 { font-size: 1.35rem; font-weight: 850; margin: .2rem 0 0; }
.student-section-header > a { text-decoration: none; font-weight: 700; }
.student-course-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.student-course-card { border: 1px solid #e2e9f3; border-radius: 1rem; overflow: hidden; }
.student-course-card > img, .student-course-placeholder { width: 100%; aspect-ratio: 16/8.5; object-fit: cover; }
.student-course-placeholder { display: grid; place-items: center; background: linear-gradient(135deg,#e8f1ff,#f8fbff); color: #0d6efd; font-size: 2.8rem; }
.student-course-card > div:last-child { padding: 1rem; }
.student-course-card h3 { font-size: 1.05rem; font-weight: 800; margin: .7rem 0; }
.student-course-card a { display: inline-flex; align-items: center; gap: .4rem; margin-top: .85rem; text-decoration: none; font-weight: 750; }
.course-progress-label { display: flex; justify-content: space-between; color: #758399; font-size: .76rem; margin-top: .35rem; }
.student-history.learning-history > div { grid-template-columns: 38px 1fr; }
.student-history .history-icon { width: 38px; height: 38px; }
.student-history time { display: block; margin-top: .25rem; }
.student-filter-tabs { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1.2rem; }
.student-filter-tabs a { color: #52647e; text-decoration: none; border: 1px solid #dce4ef; border-radius: 999px; padding: .55rem .85rem; font-size: .85rem; font-weight: 700; }
.student-filter-tabs a.active { background: #0d6efd; color: #fff; border-color: #0d6efd; }
.student-library-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.15rem; }
.student-library-grid > article { border: 1px solid #e1e8f2; border-radius: 1rem; overflow: hidden; display: flex; flex-direction: column; }
.student-library-grid > article > img, .student-library-grid > article > .student-course-placeholder { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.library-card-body { display: flex; flex-direction: column; flex: 1; padding: 1.1rem; }
.library-card-body > div:first-child small { color: #7b8799; }
.library-card-body h2 { font-size: 1.1rem; font-weight: 850; margin: .8rem 0 .45rem; }
.library-card-body p { color: #718096; font-size: .88rem; min-height: 2.6rem; }
.student-course-hero { display: grid; grid-template-columns: minmax(240px,32%) 1fr; gap: 1.8rem; align-items: center; background: #fff; border: 1px solid #e2e9f3; border-radius: 1.2rem; padding: 1.4rem; }
.student-course-hero-cover { width: 100%; aspect-ratio: 16/10; border-radius: 1rem; overflow: hidden; display: grid; place-items: center; background: #edf3ff; color: #0d6efd; font-size: 4rem; }
.student-course-hero-cover img { width: 100%; height: 100%; object-fit: cover; }
.student-course-hero h2 { font-size: 1.8rem; font-weight: 850; margin: .7rem 0; }
.student-course-hero p { color: #66778e; }
.course-overview-meta { display: flex; flex-wrap: wrap; gap: 1rem; color: #586b84; }
.course-overview-meta span { display: inline-flex; align-items: center; gap: .4rem; }
.student-module-list { display: grid; gap: 1rem; }
.student-module-list > article { border: 1px solid #e2e9f2; border-radius: 1rem; overflow: hidden; }
.student-module-list article > header { display: flex; gap: 1rem; align-items: flex-start; padding: 1rem; background: #f8faff; }
.student-module-list h3 { font-size: 1.05rem; font-weight: 850; margin: 0; }
.student-module-list header small { color: #718096; white-space: nowrap; }
.student-module-list header p { color: #78869b; font-size: .84rem; margin: .65rem 0 0; }
.student-lesson-list { padding: .4rem 1rem .8rem; }
.student-lesson-list a { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: .75rem; align-items: center; padding: .85rem 0; border-bottom: 1px solid #edf1f6; color: inherit; text-decoration: none; }
.student-lesson-list a:last-child { border-bottom: 0; }
.lesson-check { width: 38px; height: 38px; border-radius: .75rem; display: grid; place-items: center; background: #edf3ff; color: #0d6efd; }
.lesson-status-concluida .lesson-check { background: #dcfce7; color: #16a34a; }
.student-lesson-list strong, .student-lesson-list small { display: block; }
.student-lesson-list small { color: #7b8799; margin-top: .15rem; }
.student-lesson-list > a > span:last-child { color: #7b8799; font-size: .78rem; }
.full-history > div { padding: 1rem 0; }
.full-history > div > div span { display: block; color: #0d6efd; font-size: .76rem; margin-top: .25rem; }

.lesson-player-layout { display: grid; grid-template-columns: 290px minmax(0,1fr); gap: 1.4rem; align-items: start; }
.lesson-course-nav { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow: auto; background: #fff; border: 1px solid #e2e9f2; border-radius: 1rem; padding: 1rem; }
.back-to-course { display: inline-flex; gap: .45rem; align-items: center; text-decoration: none; font-weight: 700; font-size: .85rem; }
.lesson-course-nav > h2 { font-size: 1rem; font-weight: 850; margin: 1rem 0; }
.lesson-nav-modules { display: grid; gap: .7rem; }
.lesson-nav-modules details { border: 1px solid #e5ebf3; border-radius: .8rem; overflow: hidden; }
.lesson-nav-modules summary { display: flex; align-items: center; gap: .6rem; padding: .75rem; cursor: pointer; font-weight: 800; font-size: .82rem; background: #f8faff; }
.lesson-nav-modules summary span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: .55rem; background: #e7f0ff; color: #0d6efd; }
.lesson-nav-modules details > a { display: grid; grid-template-columns: 24px 1fr; gap: .45rem; align-items: center; padding: .65rem .75rem; color: #52627b; text-decoration: none; font-size: .8rem; border-top: 1px solid #edf1f6; }
.lesson-nav-modules details > a.active { background: #edf4ff; color: #0d6efd; font-weight: 800; }
.lesson-nav-modules details > a.lesson-status-concluida i { color: #16a34a; }
.lesson-player-content { min-width: 0; }
.lesson-breadcrumb { display: flex; flex-wrap: wrap; gap: .45rem; color: #758399; font-size: .8rem; }
.lesson-player-content > h2 { font-size: 1.8rem; font-weight: 850; margin: .7rem 0; }
.lesson-summary { color: #687990; }
.lesson-content-box { background: #fff; border: 1px solid #e1e8f2; border-radius: 1.1rem; overflow: hidden; margin-top: 1.2rem; }
.video-wrapper { position: relative; width: 100%; aspect-ratio: 16/9; background: #020617; }
.video-wrapper iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lesson-text-content { padding: clamp(1.4rem,3vw,2.4rem); line-height: 1.85; color: #34445c; font-size: 1rem; }
.lesson-resource-state { padding: 4rem 1.5rem; text-align: center; }
.lesson-resource-state > i { font-size: 3rem; color: #0d6efd; margin-bottom: 1rem; }
.lesson-resource-state h3 { font-weight: 850; }
.lesson-resource-state p { color: #718096; }
.lesson-notes { padding: 1.5rem; border-top: 1px solid #e8edf4; }
.lesson-notes h3 { font-size: 1.1rem; font-weight: 850; }
.lesson-notes p { color: #5f7087; line-height: 1.75; margin-bottom: 0; }
.lesson-completion-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: #fff; border: 1px solid #e1e8f2; border-radius: 1rem; padding: 1rem 1.2rem; margin-top: 1rem; }
.lesson-completion-bar strong, .lesson-completion-bar small { display: block; }
.lesson-completion-bar small { color: #77869b; margin-top: .15rem; }
.completed-pill { display: inline-flex; align-items: center; gap: .45rem; color: #166534; background: #dcfce7; border-radius: 999px; padding: .55rem .8rem; font-weight: 800; }
.lesson-prev-next { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1rem; }
.lesson-prev-next a { display: block; background: #fff; border: 1px solid #e1e8f2; border-radius: 1rem; padding: 1rem; color: inherit; text-decoration: none; }
.lesson-prev-next small, .lesson-prev-next strong { display: block; }
.lesson-prev-next small { color: #7a8799; margin-bottom: .35rem; }
.lesson-prev-next strong { font-size: .9rem; }

@media (max-width: 1199px) {
    .student-library-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .lesson-player-layout { grid-template-columns: 240px minmax(0,1fr); }
}
@media (max-width: 991px) {
    .student-layout { grid-template-columns: 1fr; }
    .student-sidebar { position: fixed; left: -270px; width: 245px; transition: left .25s ease; box-shadow: 18px 0 45px rgba(7,27,69,.2); }
    .student-menu-open .student-sidebar { left: 0; }
    .student-main { padding: 1.25rem; }
    .student-menu-button { display: grid; place-items: center; }
    .student-topbar { justify-content: flex-start; }
    .student-user-pill { margin-left: auto; }
    .continue-learning-card { grid-template-columns: 1fr; }
    .continue-cover { min-height: 220px; }
    .student-course-hero { grid-template-columns: 1fr; }
    .student-course-hero-cover { max-height: 330px; }
    .lesson-player-layout { grid-template-columns: 1fr; }
    .lesson-course-nav { position: static; max-height: none; }
}
@media (max-width: 767px) {
    .admin-enrollment-list article { grid-template-columns: 52px minmax(0,1fr); }
    .admin-enrollment-list img, .admin-enrollment-list .recent-cover { width: 52px; height: 52px; }
    .enrollment-status-form { grid-column: 1 / -1; width: 100%; }
    .student-stat-grid { grid-template-columns: 1fr; }
    .student-course-grid, .student-library-grid { grid-template-columns: 1fr; }
    .student-user-pill div { display: none; }
    .student-topbar h1 { font-size: 1.35rem; }
    .continue-content { padding: 1.4rem; }
    .continue-content h2 { font-size: 1.4rem; }
    .student-module-list article > header { flex-direction: column; }
    .student-lesson-list a { grid-template-columns: 38px minmax(0,1fr); }
    .student-lesson-list > a > span:last-child { grid-column: 2; }
    .lesson-completion-bar { align-items: stretch; flex-direction: column; }
    .lesson-completion-bar form, .lesson-completion-bar button { width: 100%; }
    .lesson-prev-next { grid-template-columns: 1fr; }
    .learning-history > div { grid-template-columns: 40px 1fr; }
    .learning-history time { grid-column: 2; }
}

/* Etapa 4 — Banco de questões, caderno de erros e simulados */
.student-sidebar-label { margin: 1rem .8rem .35rem; color: rgba(255,255,255,.48); font-size: .67rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.question-admin-filters { display: grid; grid-template-columns: minmax(230px,1.5fr) repeat(5,minmax(135px,.8fr)) auto; gap: .65rem; flex: 1; }
.question-admin-list { display: grid; gap: .85rem; }
.question-admin-list article { display: grid; grid-template-columns: 52px minmax(0,1fr) auto auto; gap: 1rem; align-items: center; padding: 1rem; border: 1px solid #e3e9f2; border-radius: 1rem; background: #fff; transition: .2s ease; }
.question-admin-list article:hover { border-color: #bfd3fb; box-shadow: 0 10px 25px rgba(11,45,107,.07); }
.question-id { width: 52px; height: 52px; display: grid; place-items: center; border-radius: .9rem; background: #edf3ff; color: #0d6efd; font-weight: 900; }
.question-admin-main { min-width: 0; }
.question-admin-main > strong { display: block; margin: .45rem 0; line-height: 1.45; }
.question-admin-main > small { color: #78869a; }
.question-admin-actions { display: flex; gap: .35rem; }
.question-admin-actions form { display: inline; }
.question-tags { display: flex; flex-wrap: wrap; gap: .35rem; }
.question-tags span { display: inline-flex; align-items: center; border-radius: 999px; padding: .22rem .5rem; background: #eef3fa; color: #53657e; font-size: .7rem; font-weight: 750; }
.question-tags .difficulty-facil, .difficulty-facil { background: #dcfce7; color: #166534; }
.question-tags .difficulty-media, .difficulty-media { background: #fef3c7; color: #92400e; }
.question-tags .difficulty-dificil, .difficulty-dificil { background: #fee2e2; color: #991b1b; }
.status-publicada, .status-publicado { background: #dcfce7; color: #166534; }
.status-rascunho { background: #e8eef7; color: #526174; }
.status-arquivada, .status-arquivado { background: #fee2e2; color: #991b1b; }
.status-ativa, .status-ativo { background: #dcfce7; color: #166534; }
.status-inativa, .status-inativo { background: #f1f5f9; color: #526174; }
.question-form-card { max-width: 1100px; margin: 0 auto; }
.question-editor { min-height: 190px; }
.alternative-builder { display: grid; gap: .8rem; }
.alternative-row { display: grid; grid-template-columns: 54px minmax(0,1fr); gap: .8rem; align-items: start; padding: .85rem; border: 1px solid #e1e8f2; border-radius: 1rem; background: #fbfcfe; }
.alternative-letter input { position: absolute; opacity: 0; pointer-events: none; }
.alternative-letter span { width: 46px; height: 46px; display: grid; place-items: center; border: 2px solid #cfd9e8; border-radius: 50%; font-weight: 900; color: #64748b; cursor: pointer; transition: .2s ease; }
.alternative-letter input:checked + span { border-color: #0d6efd; background: #0d6efd; color: #fff; box-shadow: 0 0 0 5px rgba(13,110,253,.1); }
.true-false-options, .true-false-answer { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; }
.true-false-options input, .true-false-answer input { position: absolute; opacity: 0; pointer-events: none; }
.true-false-options label span, .true-false-answer label span { display: flex; align-items: center; justify-content: center; gap: .65rem; min-height: 58px; border: 2px solid #dce4ef; border-radius: 1rem; cursor: pointer; font-weight: 850; color: #53647b; transition: .2s ease; }
.true-false-options input:checked + span, .true-false-answer input:checked + span { border-color: #0d6efd; background: #edf4ff; color: #0d6efd; }
.course-checkbox-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .6rem; padding: .9rem; border: 1px solid #e1e8f2; border-radius: 1rem; max-height: 260px; overflow: auto; }
.course-checkbox-grid label { display: flex; gap: .55rem; align-items: flex-start; color: #53647b; font-size: .9rem; }
.mock-admin-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.mock-admin-card { border: 1px solid #e1e8f2; border-radius: 1.1rem; padding: 1.2rem; background: #fff; box-shadow: 0 10px 28px rgba(11,45,107,.055); }
.mock-admin-head { display: flex; justify-content: space-between; align-items: center; }
.mock-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: .9rem; background: #edf3ff; color: #0d6efd; font-size: 1.25rem; }
.mock-admin-card h2 { font-size: 1.15rem; font-weight: 850; margin: 1rem 0 .5rem; }
.mock-admin-card > p { color: #6d7d93; min-height: 48px; }
.mock-admin-card > small { display: block; color: #7c889a; margin: .85rem 0; }
.mock-meta-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .55rem; }
.mock-meta-grid span { padding: .65rem; border-radius: .8rem; background: #f5f8fc; color: #748197; font-size: .75rem; }
.mock-meta-grid strong { display: block; color: #13233e; font-size: 1rem; }
.mock-actions { display: flex; gap: .45rem; align-items: center; padding-top: .9rem; border-top: 1px solid #edf1f6; }
.mock-actions form { margin-left: auto; }
.mock-selection-summary { display: flex; gap: 1rem; align-items: center; margin: 1rem 0; padding: 1rem; background: #f4f7fb; border-radius: 1rem; }
.mock-selection-summary > div { min-width: 110px; text-align: center; }
.mock-selection-summary strong { display: block; color: #0d6efd; font-size: 1.8rem; }
.mock-selection-summary span { color: #718096; font-size: .75rem; }
.mock-selection-summary p { margin: 0; color: #617188; }
.question-select-list { display: grid; gap: .65rem; }
.question-select-item { display: grid; grid-template-columns: 44px 1fr; gap: .8rem; align-items: center; padding: .9rem; border: 1px solid #e2e8f1; border-radius: 1rem; cursor: pointer; transition: .2s ease; }
.question-select-item input { position: absolute; opacity: 0; }
.question-select-item.selected { border-color: #0d6efd; background: #f1f6ff; }
.question-select-check { width: 38px; height: 38px; display: grid; place-items: center; border-radius: .8rem; background: #e9eef6; color: transparent; }
.question-select-item.selected .question-select-check { background: #0d6efd; color: #fff; }
.question-select-item strong { display: block; margin-top: .4rem; line-height: 1.45; }
.practice-hero, .mock-student-hero, .error-book-hero { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2rem; margin-bottom: 1.5rem; border-radius: 1.35rem; background: radial-gradient(circle at top right,rgba(25,167,255,.22),transparent 38%),linear-gradient(135deg,#092658,#0d4db8); color: #fff; box-shadow: 0 20px 45px rgba(11,45,107,.18); }
.practice-hero h2, .mock-student-hero h2, .error-book-hero h2 { font-size: clamp(1.6rem,3vw,2.5rem); font-weight: 900; margin: .4rem 0; }
.practice-hero p, .mock-student-hero p, .error-book-hero p { max-width: 720px; margin: 0; color: rgba(255,255,255,.78); }
.practice-hero .eyebrow, .mock-student-hero .eyebrow, .error-book-hero .eyebrow { color: #75bdff; }
.practice-hero-icon, .mock-student-hero > i { width: 95px; height: 95px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 1.4rem; background: rgba(255,255,255,.12); font-size: 2.7rem; }
.question-stat-grid { grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: 1.5rem; }
.practice-filter-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.practice-filter-form > div label { display: block; margin-bottom: .35rem; font-size: .78rem; font-weight: 800; color: #607088; }
.practice-filter-form > button { grid-column: 1/-1; }
.error-notebook-callout { display: grid; grid-template-columns: 52px 1fr auto; gap: .9rem; align-items: center; margin-top: 1.25rem; padding: 1rem; border: 1px solid #fed7aa; border-radius: 1rem; background: #fff7ed; color: #9a3412; text-decoration: none; }
.error-notebook-callout > i:first-child { width: 52px; height: 52px; display: grid; place-items: center; border-radius: .9rem; background: #ffedd5; font-size: 1.25rem; }
.error-notebook-callout strong, .error-notebook-callout span { display: block; }
.error-notebook-callout span { color: #b45309; font-size: .84rem; margin-top: .2rem; }
.practice-shortcuts { display: grid; gap: .7rem; }
.practice-shortcuts a { display: grid; grid-template-columns: 46px 1fr; gap: .75rem; align-items: center; padding: .85rem; border: 1px solid #e3e9f2; border-radius: .95rem; text-decoration: none; color: #17233a; }
.practice-shortcuts a > i { width: 46px; height: 46px; display: grid; place-items: center; border-radius: .8rem; background: #edf3ff; color: #0d6efd; }
.practice-shortcuts strong, .practice-shortcuts small { display: block; }
.practice-shortcuts small { color: #748197; margin-top: .15rem; }
.recent-answer-list, .mock-result-history { display: grid; gap: .45rem; }
.recent-answer-list a, .mock-result-history a { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: .75rem; align-items: center; padding: .75rem; border-bottom: 1px solid #edf1f6; text-decoration: none; color: #18243a; }
.mock-result-history a { grid-template-columns: 42px minmax(0,1fr) auto 18px; }
.recent-answer-list strong, .recent-answer-list small, .mock-result-history strong, .mock-result-history small { display: block; }
.recent-answer-list small, .mock-result-history small { color: #7c899b; margin-top: .15rem; }
.answer-result { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; }
.answer-result.correct { background: #dcfce7; color: #15803d; }
.answer-result.wrong { background: #fee2e2; color: #b91c1c; }
.question-practice-shell { max-width: 980px; margin: 0 auto; }
.question-practice-top { display: flex; justify-content: space-between; gap: 1rem; align-items: center; margin-bottom: 1rem; }
.question-practice-top > a { color: #5f6e84; text-decoration: none; font-weight: 750; }
.question-card-live { background: #fff; border: 1px solid #e1e8f2; border-radius: 1.3rem; padding: clamp(1.2rem,3vw,2.2rem); box-shadow: 0 18px 45px rgba(11,45,107,.08); }
.question-reference { color: #76859a; font-size: .82rem; margin-bottom: 1.2rem; }
.question-statement { color: #17233a; font-size: 1.08rem; line-height: 1.8; }
.answer-form { margin-top: 1.5rem; }
.answer-options { display: grid; gap: .75rem; }
.answer-options label { display: grid; grid-template-columns: 44px 1fr; gap: .8rem; align-items: center; padding: .9rem; border: 2px solid #e2e8f1; border-radius: 1rem; cursor: pointer; transition: .2s ease; }
.answer-options label:hover { border-color: #b8cdf5; background: #f8fbff; }
.answer-options input { position: absolute; opacity: 0; }
.answer-options label:has(input:checked) { border-color: #0d6efd; background: #eef5ff; }
.answer-letter { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #edf2f8; color: #53647a; font-weight: 900; }
.answer-options label:has(input:checked) .answer-letter { background: #0d6efd; color: #fff; }
.answer-submit { width: 100%; margin-top: 1.1rem; }
.answer-feedback { display: flex; gap: 1rem; align-items: center; margin-top: 1.5rem; padding: 1rem; border-radius: 1rem; }
.answer-feedback > span { font-size: 2rem; }
.answer-feedback h2 { font-size: 1.25rem; font-weight: 900; margin: 0 0 .2rem; }
.answer-feedback p { margin: 0; }
.answer-feedback.correct { background: #ecfdf5; color: #166534; }
.answer-feedback.wrong { background: #fff1f2; color: #9f1239; }
.review-answer-block { margin-top: 1.2rem; padding-top: 1.2rem; border-top: 1px solid #e8edf4; }
.review-answer-block h3 { font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; color: #748197; margin: 1rem 0 .4rem; }
.correct-answer { color: #166534; }
.answer-explanation { padding: 1rem; border-radius: .9rem; background: #f5f8fc; color: #42526b; line-height: 1.7; }
.alternative-comments { display: grid; gap: .5rem; margin-top: 1rem; }
.alternative-comments > div { display: grid; grid-template-columns: 24px 1fr; gap: .45rem; color: #66768c; font-size: .86rem; }
.question-next-actions { display: flex; justify-content: space-between; gap: .75rem; margin-top: 1.25rem; }
.error-book-hero { background: radial-gradient(circle at top right,rgba(251,146,60,.2),transparent 40%),linear-gradient(135deg,#5b210b,#b45309); }
.error-book-hero .btn { flex: 0 0 auto; background: #fff; color: #9a3412; border: 0; }
.status-tabs { display: flex; gap: .35rem; background: #f1f5f9; padding: .3rem; border-radius: .8rem; }
.status-tabs a { padding: .45rem .7rem; border-radius: .6rem; color: #65758b; text-decoration: none; font-size: .82rem; font-weight: 800; }
.status-tabs a.active { background: #fff; color: #0d6efd; box-shadow: 0 3px 10px rgba(15,23,42,.08); }
.error-book-list { display: grid; gap: .7rem; }
.error-book-list article { display: grid; grid-template-columns: 46px minmax(0,1fr) auto; gap: .8rem; align-items: center; padding: .9rem; border: 1px solid #e1e8f2; border-radius: 1rem; }
.error-book-status { width: 44px; height: 44px; display: grid; place-items: center; border-radius: .85rem; }
.error-book-status.pendente { background: #fff7ed; color: #c2410c; }
.error-book-status.revisada { background: #dcfce7; color: #15803d; }
.error-book-list strong, .error-book-list small { display: block; }
.error-book-list > article > div > strong { margin: .4rem 0; }
.error-book-list small { color: #7a8798; }
.activity-bars { height: 250px; display: grid; grid-template-columns: repeat(14,minmax(20px,1fr)); gap: .5rem; align-items: end; padding-top: 1rem; }
.activity-bars > div { height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: .45rem; }
.activity-bars span { width: min(30px,100%); min-height: 4px; border-radius: .4rem .4rem 0 0; background: linear-gradient(180deg,#1d66ff,#0b2d6b); }
.activity-bars small { font-size: .62rem; color: #8a96a7; transform: rotate(-45deg); white-space: nowrap; }
.performance-ring, .mock-score-circle { --value: 0; width: 180px; height: 180px; margin: 1rem auto; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(#0d6efd calc(var(--value)*1%),#e9eef5 0); position: relative; }
.performance-ring::before, .mock-score-circle::before { content:""; position:absolute; inset:15px; border-radius:50%; background:#fff; }
.performance-ring > div, .mock-score-circle > strong, .mock-score-circle > span { position: relative; z-index: 1; }
.performance-ring strong, .performance-ring span { display: block; text-align: center; }
.performance-ring strong { font-size: 2rem; color: #0b2d6b; }
.performance-message { text-align: center; color: #66768c; }
.performance-list { display: grid; gap: 1rem; }
.performance-list > div > div:first-child { display: flex; justify-content: space-between; gap: .8rem; margin-bottom: .4rem; }
.performance-list span { color: #758297; font-size: .8rem; }
.mock-student-hero > i { color: #fff; }
.student-mock-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.student-mock-grid article { display: flex; flex-direction: column; border: 1px solid #e1e8f2; border-radius: 1.1rem; padding: 1.15rem; background: #fff; }
.student-mock-icon { width: 52px; height: 52px; display: grid; place-items: center; border-radius: .9rem; background: #edf3ff; color: #0d6efd; font-size: 1.3rem; margin-bottom: .9rem; }
.student-mock-grid h3 { font-size: 1.15rem; font-weight: 900; margin: .8rem 0 .45rem; }
.student-mock-grid p { color: #68788e; flex: 1; }
.student-mock-grid > article > small { color: #8290a2; }
.mock-best-score { display: flex; justify-content: space-between; align-items: center; margin-top: .8rem; padding: .65rem; border-radius: .8rem; background: #ecfdf5; color: #166534; }
.mock-start-area { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #e8edf4; text-align: center; }
.mock-start-area > span { display: block; margin-top: .5rem; color: #8490a1; font-size: .72rem; }
.mock-exam-shell { max-width: 1050px; margin: 0 auto; }
.mock-exam-header { position: sticky; top: 0; z-index: 20; display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; padding: 1rem 1.2rem; border: 1px solid #e1e8f2; border-radius: 1rem; background: rgba(255,255,255,.96); backdrop-filter: blur(10px); box-shadow: 0 12px 30px rgba(11,45,107,.08); }
.mock-exam-header h2 { font-size: 1.25rem; font-weight: 900; margin: .2rem 0; }
.mock-exam-header p { margin: 0; color: #718096; font-size: .82rem; }
.mock-timer { display: flex; align-items: center; gap: .7rem; padding: .7rem .9rem; border-radius: .9rem; background: #edf3ff; color: #0d4db8; }
.mock-timer > i { font-size: 1.4rem; }
.mock-timer small, .mock-timer strong { display: block; }
.mock-timer strong { font-size: 1.2rem; font-variant-numeric: tabular-nums; }
.mock-timer.ending { background: #fee2e2; color: #b91c1c; animation: timerPulse 1s infinite; }
@keyframes timerPulse { 50% { transform: scale(1.03); } }
.mock-instructions { display: flex; gap: .8rem; padding: 1rem; margin-bottom: 1rem; border-radius: 1rem; background: #eff6ff; color: #1e40af; }
.mock-instructions p { margin: 0; }
.mock-question-nav { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.mock-question-nav a { width: 34px; height: 34px; display: grid; place-items: center; border-radius: .55rem; background: #e9eef5; color: #607087; text-decoration: none; font-size: .78rem; font-weight: 850; }
.mock-question-nav a.answered { background: #dcfce7; color: #15803d; }
.mock-question-list { display: grid; gap: 1rem; }
.mock-question-card { scroll-margin-top: 130px; padding: 1.4rem; border: 1px solid #e1e8f2; border-radius: 1.15rem; background: #fff; }
.mock-question-card.answered { border-color: #b7d4fb; }
.mock-question-number { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.mock-question-number > span { color: #0d6efd; font-weight: 900; }
.compact-options { margin-top: 1.2rem; }
.mock-submit-bar { position: sticky; bottom: 1rem; z-index: 20; display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1rem; padding: 1rem; border: 1px solid #dfe7f2; border-radius: 1rem; background: rgba(255,255,255,.97); box-shadow: 0 15px 35px rgba(11,45,107,.13); }
.mock-submit-bar strong, .mock-submit-bar small { display: block; }
.mock-submit-bar small { color: #7c899b; }
.mock-result-hero { display: grid; grid-template-columns: 90px 1fr 180px; gap: 1.2rem; align-items: center; padding: 1.5rem; margin-bottom: 1.5rem; border-radius: 1.3rem; background: #fff; border: 1px solid #e1e8f2; }
.mock-result-hero.approved { background: linear-gradient(135deg,#f0fdf4,#eff6ff); }
.mock-result-hero.needs-review { background: linear-gradient(135deg,#fff7ed,#fff); }
.mock-result-medal { width: 86px; height: 86px; display: grid; place-items: center; border-radius: 1.2rem; background: #0d6efd; color: #fff; font-size: 2rem; }
.mock-result-hero h2 { font-size: 1.5rem; font-weight: 900; margin: .3rem 0; }
.mock-result-hero p { margin: 0; color: #66768c; }
.mock-score-circle { --value: var(--score); width: 155px; height: 155px; margin: 0; background: conic-gradient(#0d6efd calc(var(--score)*1%),#dce5f1 0); }
.mock-score-circle strong, .mock-score-circle span { display: block; text-align: center; }
.mock-score-circle strong { font-size: 1.8rem; color: #0b2d6b; }
.mock-score-circle span { font-size: .72rem; color: #718096; }
.mock-result-actions { display: flex; justify-content: space-between; gap: .8rem; }
.mock-review-list { display: grid; gap: 1rem; }
.mock-review-list > article { border: 1px solid #e1e8f2; border-left-width: 5px; border-radius: 1rem; padding: 1.1rem; }
.mock-review-list > article.correct { border-left-color: #16a34a; }
.mock-review-list > article.wrong { border-left-color: #dc2626; }
.mock-review-list header { display: grid; grid-template-columns: 36px 1fr auto; gap: .7rem; align-items: center; margin-bottom: .9rem; }
.mock-review-list header > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: .6rem; background: #edf3ff; color: #0d6efd; font-weight: 900; }
.mock-review-list header > strong { font-size: .8rem; }
.mock-review-list article.correct header > strong { color: #15803d; }
.mock-review-list article.wrong header > strong { color: #b91c1c; }
.review-comparison { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; margin: 1rem 0; }
.review-comparison > div { padding: .85rem; border-radius: .85rem; background: #f6f8fb; }
.review-comparison small { display: block; color: #7c899b; margin-bottom: .3rem; }
.review-comparison p { margin: 0; }

@media (max-width: 1199px) {
    .question-admin-filters { grid-template-columns: repeat(3,minmax(150px,1fr)); }
    .mock-admin-grid, .student-mock-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .question-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
    .question-admin-filters { grid-template-columns: 1fr; width: 100%; }
    .question-admin-list article { grid-template-columns: 44px minmax(0,1fr); }
    .question-admin-list .status-badge, .question-admin-actions { grid-column: 2; }
    .course-checkbox-grid { grid-template-columns: 1fr; }
    .mock-admin-grid, .student-mock-grid { grid-template-columns: 1fr; }
    .practice-hero, .mock-student-hero, .error-book-hero { align-items: flex-start; flex-direction: column; padding: 1.35rem; }
    .practice-hero-icon, .mock-student-hero > i { width: 64px; height: 64px; font-size: 1.7rem; }
    .question-stat-grid { grid-template-columns: 1fr 1fr; }
    .practice-filter-form { grid-template-columns: 1fr; }
    .question-practice-top { align-items: flex-start; flex-direction: column; }
    .true-false-options, .true-false-answer { grid-template-columns: 1fr; }
    .question-next-actions, .mock-result-actions { flex-direction: column; }
    .error-book-list article { grid-template-columns: 42px 1fr; }
    .error-book-list article > a { grid-column: 2; justify-self: start; }
    .activity-bars { gap: .25rem; overflow-x: auto; }
    .mock-exam-header { position: static; align-items: flex-start; flex-direction: column; }
    .mock-timer { width: 100%; justify-content: center; }
    .mock-submit-bar { bottom: .4rem; align-items: stretch; flex-direction: column; }
    .mock-result-hero { grid-template-columns: 70px 1fr; }
    .mock-result-medal { width: 68px; height: 68px; }
    .mock-score-circle { grid-column: 1/-1; justify-self: center; }
    .review-comparison { grid-template-columns: 1fr; }
    .mock-review-list header { grid-template-columns: 34px 1fr; }
    .mock-review-list header > strong { grid-column: 2; }
}
.practice-dashboard-card { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; margin-bottom:1.5rem; padding:1.4rem; border-radius:1.2rem; background:linear-gradient(135deg,#eff6ff,#fff); border:1px solid #d9e7fb; }
.practice-dashboard-card h2 { font-size:1.35rem; font-weight:900; margin:.35rem 0; }
.practice-dashboard-card p { margin:0; color:#63738a; }
.practice-dashboard-card > i { width:82px; height:82px; display:grid; place-items:center; border-radius:1.1rem; background:#0d6efd; color:#fff; font-size:2rem; }
@media(max-width:767px){.practice-dashboard-card{align-items:flex-start;flex-direction:column}.practice-dashboard-card>i{width:58px;height:58px;font-size:1.4rem;}}

/* ==========================================================
   Etapa 4.1 — revisão responsiva global
   ========================================================== */
html,
body {
    max-width: 100%;
}

.dashboard-body,
.student-body {
    overflow-x: hidden;
}

img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
}

.dashboard-layout {
    grid-template-columns: 260px minmax(0, 1fr);
}

.dashboard-main,
.student-main,
.content-card,
.student-section,
.page-actions,
.catalog-filters,
.question-admin-filters,
.table-responsive,
.row > * {
    min-width: 0;
}

.dashboard-main,
.student-main {
    width: 100%;
    max-width: 100%;
}

.content-card,
.student-section {
    max-width: 100%;
}

.table-responsive {
    width: 100%;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}

.sidebar,
.student-sidebar {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.sidebar-head,
.student-sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.sidebar-close-button,
.student-sidebar-close,
.dashboard-menu-button {
    display: none;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border: 0;
    border-radius: .75rem;
}

.sidebar-close-button,
.student-sidebar-close {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

.dashboard-menu-button {
    background: #fff;
    color: #0b2d6b;
    box-shadow: 0 8px 20px rgba(11, 45, 107, .08);
}

.dashboard-menu-overlay,
.student-menu-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1040;
    padding: 0;
    border: 0;
    background: rgba(4, 17, 45, .58);
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s ease;
}

.dashboard-heading,
.student-heading {
    min-width: 0;
}

.dashboard-heading h1,
.student-heading h1,
.content-card h1,
.content-card h2,
.content-card h3,
.student-section h1,
.student-section h2,
.student-section h3,
.question-admin-main,
.question-admin-main strong,
.question-admin-main p {
    overflow-wrap: anywhere;
}

.page-actions {
    flex-wrap: wrap;
    max-width: 100%;
}

.page-actions > .btn,
.page-actions > a.btn {
    flex: 0 0 auto;
}

.catalog-filters {
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
}

.catalog-filters .input-group {
    flex: 2 1 260px;
    min-width: 220px;
    max-width: none;
}

.catalog-filters .form-select {
    flex: 1 1 165px;
    min-width: 145px;
    max-width: none;
}

.catalog-filters > .btn,
.catalog-filters > a.btn {
    flex: 0 0 auto;
}

.catalog-filters-wide .input-group {
    min-width: 220px;
}

.question-admin-filters {
    grid-template-columns: minmax(220px, 1.7fr) repeat(3, minmax(135px, 1fr));
    flex: 1 1 760px;
    width: 100%;
    max-width: 100%;
}

.question-admin-filters .input-group,
.question-admin-filters .form-select,
.question-admin-filters .btn {
    min-width: 0;
    width: 100%;
}

.form-control,
.form-select,
.input-group {
    min-width: 0;
}

.form-actions,
.sticky-form-actions,
.mock-result-actions,
.question-next-actions {
    flex-wrap: wrap;
}

@media (min-width: 1600px) {
    .question-admin-filters {
        grid-template-columns: minmax(240px, 1.7fr) repeat(5, minmax(130px, .9fr)) auto;
    }
}

@media (max-width: 1199.98px) {
    .question-admin-filters {
        grid-template-columns: repeat(3, minmax(145px, 1fr));
    }

    .dashboard-main {
        padding: 1.5rem;
    }
}

@media (max-width: 991.98px) {
    body.admin-menu-open,
    body.student-menu-open {
        overflow: hidden;
    }

    .dashboard-layout,
    .student-layout {
        display: block;
        min-height: 100vh;
    }

    .sidebar,
    .student-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        left: 0;
        width: min(286px, 86vw);
        height: 100dvh;
        z-index: 1045;
        transform: translateX(-105%);
        transition: transform .25s ease;
        box-shadow: 18px 0 45px rgba(7, 27, 69, .24);
    }

    .admin-menu-open .sidebar,
    .student-menu-open .student-sidebar {
        left: 0;
        transform: translateX(0);
    }

    .dashboard-menu-overlay,
    .student-menu-overlay {
        display: block;
    }

    .admin-menu-open .dashboard-menu-overlay,
    .student-menu-open .student-menu-overlay {
        opacity: 1;
        pointer-events: auto;
    }

    .sidebar-close-button,
    .student-sidebar-close,
    .dashboard-menu-button,
    .student-menu-button {
        display: grid;
    }

    .dashboard-main,
    .student-main {
        padding: 1.25rem;
    }

    .dashboard-topbar,
    .student-topbar {
        justify-content: flex-start;
        align-items: center;
        gap: .9rem;
    }

    .profile-pill,
    .student-user-pill {
        margin-left: auto;
        flex: 0 0 auto;
    }

    .question-admin-filters {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
        flex-basis: 100%;
    }

    .page-actions > .question-admin-filters + .btn,
    .page-actions > .question-admin-filters + a.btn {
        margin-left: auto;
    }

    .lesson-course-nav {
        position: static;
        max-height: none;
    }
}

@media (max-width: 767.98px) {
    .dashboard-main,
    .student-main {
        padding: 1rem;
    }

    .dashboard-topbar,
    .student-topbar {
        margin-bottom: 1.25rem;
    }

    .dashboard-topbar h1,
    .student-topbar h1 {
        font-size: 1.4rem;
        line-height: 1.15;
    }

    .dashboard-topbar small,
    .student-topbar small {
        display: block;
        font-size: .76rem;
        line-height: 1.25;
    }

    .content-card,
    .student-section {
        padding: 1rem;
        border-radius: 1rem;
    }

    .page-actions,
    .catalog-filters {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .page-actions > *,
    .catalog-filters > *,
    .catalog-filters .input-group,
    .catalog-filters .form-select,
    .catalog-filters > .btn,
    .catalog-filters > a.btn {
        width: 100%;
        max-width: none;
        min-width: 0;
        flex-basis: auto;
    }

    .question-admin-filters {
        grid-template-columns: 1fr;
        width: 100%;
        flex-basis: 100%;
    }

    .page-actions > .btn,
    .page-actions > a.btn,
    .page-actions > .question-admin-filters + .btn,
    .page-actions > .question-admin-filters + a.btn {
        width: 100%;
        margin-left: 0;
    }

    .form-actions,
    .sticky-form-actions,
    .mock-result-actions,
    .question-next-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .form-actions > *,
    .sticky-form-actions > *,
    .mock-result-actions > *,
    .question-next-actions > * {
        width: 100%;
    }

    .sticky-form-actions {
        bottom: .5rem;
        padding: .8rem;
    }

    .stat-card,
    .student-stat-grid > div {
        padding: 1rem;
    }

    .empty-state,
    .student-empty {
        padding: 2.5rem 1rem;
    }

    .question-admin-list article,
    .error-book-list article,
    .recent-answer-list a,
    .mock-result-history a {
        max-width: 100%;
    }

    .mock-selection-summary,
    .mock-exam-header,
    .mock-submit-bar,
    .mock-result-actions {
        max-width: 100%;
    }

    .lesson-content-text,
    .question-statement,
    .question-feedback,
    .mock-question-card {
        overflow-wrap: anywhere;
    }
}

@media (max-width: 575.98px) {
    .dashboard-main,
    .student-main {
        padding: .8rem .7rem 2rem;
    }

    .dashboard-menu-button,
    .student-menu-button {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }

    .profile-pill {
        padding: .65rem .75rem;
    }

    .profile-pill > span {
        display: none;
    }

    .student-user-pill {
        padding: .35rem;
    }

    .student-user-pill > span {
        width: 36px;
        height: 36px;
    }

    .dashboard-topbar h1,
    .student-topbar h1 {
        font-size: 1.25rem;
    }

    .content-card,
    .student-section,
    .form-card {
        padding: .85rem;
    }

    .content-card .btn,
    .student-section .btn {
        white-space: normal;
    }

    .question-stat-grid {
        grid-template-columns: 1fr;
    }

    .alternative-row,
    .answer-options label {
        grid-template-columns: 38px minmax(0, 1fr);
        padding: .75rem;
    }

    .mock-question-card {
        padding: 1rem;
    }

    .mock-result-hero {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .mock-result-medal,
    .mock-score-circle {
        justify-self: center;
    }
}

/* =========================================================
   ETAPA 5 — SIMULAÇÕES INTERATIVAS
   ========================================================= */
.status-publicada { background: #e8f8ef; color: #157347; }
.status-arquivada { background: #eef1f5; color: #667085; }
.simulation-admin-filters { flex: 1 1 760px; }
.simulation-admin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.simulation-admin-card { display: grid; grid-template-columns: 76px minmax(0,1fr); gap: 1rem; padding: 1.25rem; border: 1px solid #e5eaf2; border-radius: 1.1rem; background: #fff; box-shadow: 0 10px 28px rgba(17,44,97,.06); }
.simulation-card-icon, .simulation-student-icon { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 18px; background: linear-gradient(145deg,#e9f2ff,#f7faff); color: #0866ff; font-size: 1.65rem; }
.simulation-card-body { min-width: 0; }
.simulation-card-body h2 { font-size: 1.15rem; margin: .35rem 0 .5rem; }
.simulation-card-body p { color: #667085; margin-bottom: .8rem; }
.simulation-card-body > small { color: #667085; display: block; margin-top: .8rem; }
.simulation-difficulty { display: inline-flex; align-items: center; padding: .3rem .65rem; border-radius: 999px; font-size: .73rem; font-weight: 800; }
.difficulty-facil { background: #e8f8ef; color: #157347; }
.difficulty-media { background: #fff4d8; color: #9a6700; }
.difficulty-dificil { background: #ffe8e8; color: #b42318; }
.simulation-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .5rem; }
.simulation-metrics span { padding: .6rem .45rem; text-align: center; border-radius: .75rem; background: #f6f8fc; color: #667085; font-size: .72rem; }
.simulation-metrics strong { display: block; color: #0a1f44; font-size: 1rem; }
.simulation-card-actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1rem; }
.simulation-card-actions form { margin: 0; }
.simulation-form-note, .simulation-target-help { display: flex; gap: 1rem; align-items: flex-start; padding: 1rem; border-radius: 1rem; background: #eef5ff; color: #16458b; }
.simulation-form-note > i, .simulation-target-help > i { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #fff; color: #0866ff; flex: 0 0 auto; }
.simulation-form-note p, .simulation-target-help p { margin: .25rem 0 0; color: #4e6383; }
.simulation-builder-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.simulation-builder-header p { color: #667085; margin: .3rem 0 0; }
.builder-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; margin: 1.25rem 0; }
.builder-summary span { display: flex; align-items: center; gap: .65rem; padding: .85rem; border-radius: .85rem; background: #f6f8fc; color: #667085; }
.builder-summary i { color: #0866ff; }
.builder-summary strong { color: #0a1f44; }
.simulation-step-list { display: grid; gap: .8rem; }
.simulation-step-list article { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; gap: 1rem; align-items: center; padding: 1rem; border: 1px solid #e5eaf2; border-radius: 1rem; background: #fff; }
.step-order { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #eaf2ff; color: #075de5; font-weight: 900; }
.step-main h3 { font-size: 1rem; margin: .4rem 0 .25rem; }
.step-main p { margin: 0 0 .35rem; color: #667085; }
.step-main small { color: #7b8496; }
.step-action-badge { display: inline-flex; align-items: center; width: fit-content; padding: .28rem .62rem; border-radius: 999px; background: #eaf2ff; color: #075de5; font-size: .72rem; font-weight: 800; }
.step-actions { display: flex; gap: .35rem; }
.step-actions form { margin: 0; }
.simulation-preview-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; }
.simulation-preview-header p { color: #667085; margin: .3rem 0 0; }
.preview-step-list { display: grid; gap: .65rem; max-height: 540px; overflow: auto; }
.preview-step-list > div { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: .65rem; padding: .7rem; border-radius: .75rem; background: #f6f8fc; }
.preview-step-list > div > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #eaf2ff; color: #075de5; font-weight: 900; }
.preview-step-list strong, .preview-step-list small, .preview-step-list code { display: block; }
.preview-step-list small { color: #667085; margin: .15rem 0; }
.preview-step-list code { font-size: .7rem; }
.preview-target-active { outline: 4px solid rgba(8,102,255,.35) !important; outline-offset: 2px; }

.simulation-student-hero { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.5rem; border-radius: 1.25rem; background: linear-gradient(135deg,#0a2d6b,#1269ea); color: #fff; margin-bottom: 1.5rem; overflow: hidden; }
.simulation-student-hero h2 { font-size: 1.6rem; margin: .25rem 0 .5rem; }
.simulation-student-hero p { margin: 0; color: rgba(255,255,255,.82); max-width: 720px; }
.simulation-student-hero > i { font-size: 5rem; opacity: .18; transform: rotate(-12deg); }
.simulation-student-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.simulation-student-grid article { display: flex; flex-direction: column; min-width: 0; padding: 1.15rem; border: 1px solid #e6ebf3; border-radius: 1rem; background: #fff; }
.simulation-student-grid h3 { font-size: 1.05rem; margin: .75rem 0 .45rem; }
.simulation-student-grid p { color: #667085; flex: 1; }
.simulation-student-grid small { color: #667085; margin: .65rem 0; }
.simulation-student-meta { display: flex; flex-wrap: wrap; gap: .75rem; color: #667085; font-size: .78rem; }
.simulation-student-meta i { color: #0866ff; margin-right: .25rem; }
.simulation-best { display: flex; justify-content: space-between; align-items: center; padding: .7rem; background: #f6f8fc; border-radius: .75rem; margin: .65rem 0; }
.simulation-best span { color: #667085; font-size: .75rem; }
.simulation-best strong { color: #0a1f44; }
.simulation-history-list { display: grid; gap: .65rem; }
.simulation-history-list a { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: .75rem; padding: .75rem; border-radius: .85rem; background: #f7f9fc; color: inherit; text-decoration: none; }
.history-simulation-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #eaf2ff; color: #0866ff; }
.simulation-history-list small { display: block; color: #667085; }
.simulation-result-pill { padding: .35rem .65rem; border-radius: 999px; font-weight: 900; }
.simulation-result-pill.is-approved { background: #e8f8ef; color: #157347; }
.simulation-result-pill.is-reproved { background: #ffe8e8; color: #b42318; }
.simulation-dashboard-card { background: linear-gradient(135deg,#eff6ff,#f8fbff); border: 1px solid #d9e8ff; }

.simulation-runner-page { min-width: 0; }
.simulation-runner-top { display: grid; grid-template-columns: auto minmax(180px,1fr) auto; gap: 1rem; align-items: center; margin-bottom: 1rem; }
.simulation-runner-progress { max-width: 520px; width: 100%; justify-self: center; }
.simulation-runner-progress small { display: block; text-align: center; margin-top: .3rem; color: #667085; }
.simulation-live-score { text-align: right; }
.simulation-live-score span { display: block; color: #667085; font-size: .72rem; }
.simulation-live-score strong { color: #0a1f44; font-size: 1.25rem; }
.simulation-runner-layout { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 1rem; align-items: start; }
.simulation-stage { min-width: 0; padding: .8rem; border-radius: 1.25rem; background: #15223b; box-shadow: 0 18px 50px rgba(11,31,69,.2); overflow: hidden; }
.simulation-task-panel { position: sticky; top: 1rem; padding: 1.2rem; border-radius: 1.1rem; background: #fff; box-shadow: 0 14px 40px rgba(17,44,97,.1); }
.simulation-panel-label { display: block; color: #0866ff; font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .09em; margin-bottom: .55rem; }
.simulation-task-panel h2 { font-size: 1.25rem; margin: .65rem 0 .5rem; }
.simulation-task-panel > p { color: #475467; font-size: 1rem; }
.simulation-hint-button { border: 0; background: transparent; color: #8a6400; font-weight: 800; padding: 0; }
.simulation-hint { padding: .75rem; border-radius: .75rem; margin-top: .65rem; background: #fff8dd; color: #73510a; }
.simulation-feedback { display: flex; gap: .65rem; align-items: flex-start; padding: .8rem; border-radius: .8rem; margin-top: .8rem; font-weight: 700; }
.simulation-feedback.is-success { background: #e8f8ef; color: #157347; }
.simulation-feedback.is-error { background: #ffe8e8; color: #b42318; }
.simulation-feedback.is-info { background: #eaf2ff; color: #075de5; }
.simulation-generic-action { display: grid; gap: .65rem; padding-top: .8rem; }
.simulation-generic-action p { margin: 0; color: #475467; }
.simulation-task-footer { margin-top: 1rem; padding-top: .8rem; border-top: 1px solid #edf0f5; color: #7b8496; font-size: .75rem; }
.is-processing .simulation-stage, .is-processing .simulation-task-panel { cursor: progress; }
.simulation-wrong-target { animation: simShake .35s ease; outline: 3px solid #e5484d !important; }
.simulation-drop-active { outline: 4px dashed #0866ff !important; background: #eaf2ff !important; }
@keyframes simShake { 0%,100%{transform:translateX(0)} 30%{transform:translateX(-6px)} 70%{transform:translateX(6px)} }

.simulation-environment { position: relative; width: 100%; min-height: 610px; border-radius: .85rem; overflow: hidden; user-select: none; }
.simulation-environment button, .simulation-environment input, .simulation-environment select, .simulation-environment textarea { font: inherit; }
.simulation-environment [data-sim-target] { transition: outline .15s, transform .15s, background .15s; }
.simulation-environment button[data-sim-target]:hover { transform: translateY(-1px); }
.windows-desktop { position: relative; min-height: 610px; padding: 1rem; background: radial-gradient(circle at 70% 20%,rgba(255,255,255,.6),transparent 22%),linear-gradient(145deg,#1776d2,#5bc1ea 55%,#1b6fbe); }
.desktop-icon { display: flex; flex-direction: column; align-items: center; gap: .35rem; width: 88px; min-height: 78px; border: 0; background: transparent; color: #fff; text-shadow: 0 1px 3px #000; margin-bottom: .55rem; }
.desktop-icon i { font-size: 2rem; filter: drop-shadow(0 3px 5px rgba(0,0,0,.25)); }
.desktop-icon span { font-size: .72rem; }
.windows-taskbar { position: absolute; inset: auto 0 0; height: 52px; display: flex; align-items: center; gap: .25rem; padding: .35rem .65rem; background: rgba(238,247,255,.93); backdrop-filter: blur(12px); color: #17345f; }
.windows-taskbar button { width: 42px; height: 42px; border: 0; border-radius: 9px; background: transparent; color: #24558e; font-size: 1.25rem; }
.windows-taskbar button:hover { background: rgba(91,143,204,.16); }
.taskbar-spacer { flex: 1; }
.windows-taskbar time { font-size: .75rem; }
.windows-start-menu { position: absolute; left: 50%; bottom: 58px; transform: translateX(-50%); width: min(440px,88%); padding: 1rem; border-radius: 1rem; background: rgba(245,250,255,.97); box-shadow: 0 18px 48px rgba(0,0,0,.28); z-index: 8; }
.windows-start-menu input { width: 100%; border: 1px solid #cbd8e7; border-radius: .65rem; padding: .65rem .75rem; }
.start-app-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .7rem; margin-top: .9rem; }
.start-app-grid span { display: grid; place-items: center; gap: .3rem; padding: .75rem; border-radius: .7rem; color: #24476e; font-size: .72rem; }
.start-app-grid i { font-size: 1.3rem; }
.sim-window { position: absolute; left: 13%; top: 8%; width: 74%; min-height: 410px; border-radius: .65rem; overflow: hidden; background: #fff; box-shadow: 0 20px 55px rgba(0,0,0,.3); z-index: 6; color: #223; }
.sim-window.always-open { position: relative; left: auto; top: auto; width: 100%; min-height: 610px; border-radius: .75rem; }
.sim-window-title, .office-titlebar { display: flex; justify-content: space-between; align-items: center; min-height: 42px; padding-left: .75rem; background: #f7f9fc; border-bottom: 1px solid #dfe5ee; }
.sim-window-title > div, .office-titlebar > div { display: flex; align-self: stretch; }
.sim-window-title button, .office-titlebar button { width: 42px; border: 0; background: transparent; }
.sim-window-title button:last-child:hover, .office-titlebar button:last-child:hover { background: #e5484d; color: #fff; }
.explorer-toolbar { display: flex; gap: .5rem; align-items: center; padding: .55rem; border-bottom: 1px solid #e6eaf0; }
.explorer-toolbar button { border: 0; background: #eef3f9; padding: .45rem .7rem; border-radius: .45rem; }
.explorer-toolbar input, .sim-address { min-width: 0; border: 1px solid #d4dce8; border-radius: .45rem; padding: .45rem .6rem; background: #fff; flex: 1; }
.explorer-body, .files-layout { display: grid; grid-template-columns: 155px 1fr; min-height: 330px; }
.explorer-body aside, .files-layout aside { padding: .65rem; border-right: 1px solid #e6eaf0; background: #fafbfc; }
.explorer-body aside span, .files-layout aside button { display: block; width: 100%; border: 0; background: transparent; text-align: left; padding: .5rem; color: #475467; border-radius: .4rem; }
.explorer-body main, .files-layout main { display: flex; flex-wrap: wrap; align-content: flex-start; gap: .8rem; padding: 1rem; }
.folder-tile, .file-item { display: flex; flex-direction: column; align-items: center; gap: .4rem; width: 92px; min-height: 80px; border: 0; border-radius: .6rem; background: transparent; }
.folder-tile:hover, .file-item:hover { background: #eaf2ff; }
.folder-tile i, .file-item i { font-size: 2.1rem; color: #f4b942; }
.file-item i.fa-file-word { color: #1769d2; }
.file-item i.fa-file-excel { color: #16865a; }
.drop-folder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; width: 130px; min-height: 90px; border: 2px dashed #b7c6db; border-radius: .7rem; color: #667085; }
.office-app, .browser-app, .email-app { min-height: 610px; background: #fff; color: #202939; }
.word-app .office-titlebar { background: #1769d2; color: #fff; }
.excel-app .office-titlebar { background: #107c41; color: #fff; }
.office-titlebar button { color: inherit; }
.office-tabs { display: flex; gap: .3rem; padding: .4rem .6rem 0; border-bottom: 1px solid #dfe5ee; }
.office-tabs button { border: 0; background: transparent; padding: .55rem .7rem; }
.office-ribbon, .spreadsheet-toolbar { display: flex; gap: .45rem; align-items: center; padding: .65rem; background: #f7f9fc; border-bottom: 1px solid #dfe5ee; }
.office-ribbon button, .spreadsheet-toolbar button { border: 1px solid #d9e0e8; background: #fff; border-radius: .4rem; padding: .45rem .6rem; }
.office-ribbon select, .spreadsheet-toolbar input { border: 1px solid #d9e0e8; border-radius: .4rem; padding: .4rem; }
.document-canvas { padding: 2rem; background: #dfe3e8; min-height: 480px; }
.document-canvas textarea { display: block; width: min(600px,90%); min-height: 410px; margin: auto; padding: 2.2rem; border: 0; resize: none; box-shadow: 0 5px 15px rgba(0,0,0,.18); line-height: 1.6; }
.sim-bold-active .document-canvas textarea { font-weight: 700; }
.sim-italic-active .document-canvas textarea { font-style: italic; }
.sim-center-active .document-canvas textarea { text-align: center; }
.formula-row { display: grid; grid-template-columns: 40px 1fr; align-items: center; padding: .4rem .65rem; border-bottom: 1px solid #dfe5ee; }
.formula-row input { border: 1px solid #cfd8e3; padding: .4rem; }
.spreadsheet-grid { display: grid; grid-template-columns: 44px repeat(4,minmax(90px,1fr)); grid-auto-rows: 42px; overflow: auto; background: #d8dee7; gap: 1px; }
.spreadsheet-grid > * { display: grid; place-items: center; border: 0; background: #fff; min-width: 0; }
.spreadsheet-grid b { background: #eef1f4; color: #475467; }
.sheet-tab { margin: .5rem; border: 0; border-bottom: 3px solid #107c41; background: transparent; padding: .45rem 1rem; }
.browser-tabs { display: flex; align-items: center; gap: .5rem; padding: .55rem; background: #e9edf3; }
.browser-tabs span { background: #fff; padding: .45rem 1rem; border-radius: .6rem .6rem 0 0; }
.browser-tabs button, .browser-toolbar button { border: 0; background: transparent; }
.browser-toolbar { display: flex; gap: .4rem; align-items: center; padding: .55rem; border-bottom: 1px solid #e1e5eb; }
.browser-toolbar input { flex: 1; min-width: 0; border: 1px solid #d0d7e2; border-radius: 999px; padding: .55rem .8rem; }
.browser-page { padding: 2rem; }
.search-result { display: block; width: 100%; max-width: 700px; text-align: left; border: 0; background: transparent; padding: .8rem; border-radius: .65rem; margin-bottom: .65rem; }
.search-result:hover { background: #f4f7fb; }
.search-result strong, .search-result span, .search-result p { display: block; }
.search-result strong { color: #174ea6; font-size: 1.05rem; }
.search-result span { color: #168038; font-size: .8rem; }
.search-result.fake span { color: #b42318; }
.email-toolbar { display: flex; gap: .4rem; padding: .65rem; border-bottom: 1px solid #e3e7ed; }
.email-toolbar button { border: 0; background: #f3f6fa; border-radius: .45rem; padding: .55rem .7rem; }
.email-toolbar .report-button { margin-left: auto; background: #ffe8e8; color: #b42318; }
.email-message { max-width: 760px; padding: 2rem; }
.email-sender { display: block; border: 0; background: transparent; text-align: left; padding: 0; color: #475467; margin-bottom: 1.2rem; }
.email-sender span { display: block; color: #101828; font-weight: 800; }
.suspicious-link { border: 0; border-radius: .45rem; background: #0866ff; color: #fff; padding: .7rem 1rem; }
.attachment { display: block; margin-top: 1rem; border: 1px solid #d7dde6; border-radius: .5rem; background: #fff; padding: .65rem; }
.phone-shell { width: min(340px,90%); margin: 0 auto; padding: 12px; border-radius: 38px; background: #101318; box-shadow: 0 25px 55px rgba(0,0,0,.35); }
.phone-speaker { width: 80px; height: 6px; border-radius: 999px; background: #343a43; margin: 2px auto 9px; }
.phone-screen { position: relative; min-height: 570px; border-radius: 27px; overflow: hidden; background: linear-gradient(160deg,#e8f0ff,#c9ddff); color: #18304f; }
.phone-status { display: flex; justify-content: space-between; padding: .65rem .9rem; font-size: .72rem; }
.phone-quick { display: grid; grid-template-columns: repeat(2,1fr); gap: .65rem; padding: .8rem; }
.phone-quick button { border: 0; border-radius: 1rem; padding: .8rem; background: rgba(255,255,255,.75); color: #24476e; }
.phone-quick i, .phone-apps i { display: block; font-size: 1.5rem; margin-bottom: .3rem; }
.phone-apps { display: grid; grid-template-columns: repeat(3,1fr); gap: .8rem; padding: 1rem; }
.phone-apps button { border: 0; background: transparent; color: #18304f; font-size: .72rem; }
.phone-apps i { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto .35rem; border-radius: 16px; background: #fff; box-shadow: 0 5px 15px rgba(30,65,115,.15); }
.phone-settings-panel { position: absolute; inset: 42px 0 40px; padding: 1rem; background: #fff; z-index: 3; }
.phone-settings-panel button { display: block; width: 100%; border: 0; border-bottom: 1px solid #edf0f4; background: transparent; text-align: left; padding: 1rem .5rem; }
.phone-back { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); border: 0; background: transparent; }

.simulation-result-hero { display: grid; grid-template-columns: 90px minmax(0,1fr) 150px; align-items: center; gap: 1.2rem; padding: 1.5rem; border-radius: 1.25rem; background: #fff; box-shadow: 0 12px 38px rgba(17,44,97,.08); }
.simulation-result-hero.is-approved { border: 1px solid #bfe8cf; background: linear-gradient(135deg,#f4fff8,#fff); }
.simulation-result-hero.is-reproved { border: 1px solid #ffd0d0; background: linear-gradient(135deg,#fff8f8,#fff); }
.simulation-result-medal { width: 82px; height: 82px; display: grid; place-items: center; border-radius: 50%; background: #eaf2ff; color: #0866ff; font-size: 2rem; }
.is-approved .simulation-result-medal { background: #e8f8ef; color: #157347; }
.is-reproved .simulation-result-medal { background: #ffe8e8; color: #b42318; }
.simulation-result-hero h2 { font-size: 1.4rem; margin: .3rem 0; }
.simulation-result-hero p { color: #667085; margin: 0; }
.simulation-score-circle { width: 132px; height: 132px; display: grid; place-items: center; align-content: center; border: 10px solid #dce8fa; border-radius: 50%; }
.simulation-score-circle strong { font-size: 1.75rem; color: #0a1f44; }
.simulation-score-circle span { font-size: .68rem; color: #667085; }
.simulation-result-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; margin-top: 1rem; }
.simulation-result-stats > div { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: .65rem; padding: 1rem; border-radius: 1rem; background: #fff; box-shadow: 0 8px 24px rgba(17,44,97,.06); }
.simulation-result-stats i { grid-row: span 2; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #eaf2ff; color: #0866ff; }
.simulation-result-stats span { color: #667085; font-size: .75rem; }
.simulation-result-stats strong { color: #0a1f44; }
.simulation-result-steps { display: grid; gap: .7rem; }
.simulation-result-steps article { display: grid; grid-template-columns: 42px minmax(0,1fr) 100px; gap: .8rem; align-items: center; padding: .85rem; border: 1px solid #e5eaf2; border-radius: .9rem; }
.result-step-number { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #eef3fa; color: #475467; font-weight: 900; }
.simulation-result-steps h3 { font-size: .95rem; margin: 0 0 .2rem; }
.simulation-result-steps p { color: #667085; margin: 0 0 .2rem; }
.simulation-result-steps small { color: #7b8496; }
.result-step-score { display: grid; grid-template-columns: 28px 1fr; align-items: center; text-align: right; }
.result-step-score i { grid-row: span 2; }
.result-step-score span { font-size: .7rem; color: #667085; }
.result-step-score.is-correct { color: #157347; }
.result-step-score.is-skipped { color: #9a6700; }
.result-step-score.is-wrong { color: #b42318; }

@media (max-width: 1199.98px) {
    .simulation-admin-grid { grid-template-columns: 1fr; }
    .simulation-student-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .simulation-runner-layout { grid-template-columns: 1fr; }
    .simulation-task-panel { position: static; }
}
@media (max-width: 991.98px) {
    .simulation-environment { min-height: 540px; }
    .windows-desktop, .sim-window.always-open, .office-app, .browser-app, .email-app { min-height: 540px; }
    .simulation-result-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .builder-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767.98px) {
    .simulation-builder-header, .simulation-preview-header { flex-direction: column; }
    .simulation-student-grid { grid-template-columns: 1fr; }
    .simulation-runner-top { grid-template-columns: 1fr auto; }
    .simulation-runner-progress { grid-column: 1/-1; grid-row: 2; }
    .simulation-live-score { grid-column: 2; grid-row: 1; }
    .simulation-step-list article { grid-template-columns: 42px minmax(0,1fr); }
    .step-actions { grid-column: 1/-1; justify-content: flex-end; }
    .simulation-result-hero { grid-template-columns: 70px minmax(0,1fr); }
    .simulation-score-circle { grid-column: 1/-1; justify-self: center; }
    .simulation-result-steps article { grid-template-columns: 38px minmax(0,1fr); }
    .result-step-score { grid-column: 2; justify-self: start; text-align: left; }
    .simulation-stage { padding: .4rem; }
    .simulation-environment { min-height: 470px; }
    .windows-desktop, .sim-window.always-open, .office-app, .browser-app, .email-app { min-height: 470px; }
    .sim-window { left: 3%; top: 6%; width: 94%; min-height: 350px; }
    .explorer-body, .files-layout { grid-template-columns: 110px 1fr; }
    .document-canvas { padding: .8rem; }
    .document-canvas textarea { width: 100%; min-height: 350px; padding: 1rem; }
    .browser-page, .email-message { padding: 1rem; }
}
@media (max-width: 575.98px) {
    .simulation-admin-card { grid-template-columns: 1fr; }
    .simulation-card-icon { width: 52px; height: 52px; }
    .simulation-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .builder-summary, .simulation-result-stats { grid-template-columns: 1fr; }
    .simulation-student-hero > i { display: none; }
    .simulation-runner-top { display: flex; flex-wrap: wrap; }
    .simulation-runner-progress { order: 3; flex-basis: 100%; }
    .simulation-live-score { margin-left: auto; }
    .simulation-environment { min-height: 420px; }
    .windows-desktop, .sim-window.always-open, .office-app, .browser-app, .email-app { min-height: 420px; }
    .desktop-icon { width: 72px; min-height: 64px; }
    .windows-taskbar { height: 48px; }
    .windows-taskbar button { width: 36px; height: 36px; }
    .sim-window { top: 4%; min-height: 330px; }
    .explorer-body, .files-layout { grid-template-columns: 1fr; }
    .explorer-body aside, .files-layout aside { display: none; }
    .office-ribbon, .spreadsheet-toolbar, .email-toolbar { overflow-x: auto; }
    .office-ribbon > *, .spreadsheet-toolbar > *, .email-toolbar > * { flex: 0 0 auto; }
    .spreadsheet-grid { grid-template-columns: 36px repeat(4,82px); }
    .phone-shell { width: 100%; max-width: 310px; }
    .simulation-result-hero { grid-template-columns: 1fr; text-align: center; }
    .simulation-result-medal { justify-self: center; }
    .simulation-result-steps article { grid-template-columns: 34px minmax(0,1fr); padding: .7rem; }
}

/* Etapa 6 — Organizações, grupos e treinamentos */
.status-prospect, .status-planejado { background: #fff4d6; color: #8a5a00; }
.status-inativa, .status-inativo, .status-cancelado, .status-cancelada { background: #f1f3f6; color: #667085; }
.status-concluido { background: #e8f8ef; color: #157347; }

.organization-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.organization-card { display: flex; flex-direction: column; min-width: 0; padding: 1.2rem; border: 1px solid #e5eaf2; border-radius: 1.15rem; background: #fff; box-shadow: 0 8px 28px rgba(17,44,97,.06); }
.organization-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.organization-icon { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 14px; background: #eaf2ff; color: #0866ff; font-size: 1.2rem; }
.organization-icon-lg { width: 66px; height: 66px; border-radius: 18px; font-size: 1.65rem; }
.organization-card h2 { font-size: 1.12rem; margin: .35rem 0; color: #0a1f44; }
.organization-card p { color: #667085; min-height: 42px; margin-bottom: 1rem; }
.organization-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .5rem; margin-top: auto; }
.organization-metrics span { padding: .65rem .4rem; border-radius: .75rem; background: #f7f9fc; color: #667085; text-align: center; font-size: .7rem; }
.organization-metrics strong { display: block; color: #0a1f44; font-size: 1.05rem; }
.organization-card-actions { display: flex; gap: .55rem; margin-top: 1rem; }
.organization-card-actions .btn:first-child { flex: 1; }

.organization-hero { display: flex; justify-content: space-between; align-items: center; gap: 1.25rem; }
.organization-hero-main { display: flex; align-items: center; min-width: 0; gap: 1rem; }
.organization-hero h2 { margin: .2rem 0; font-size: 1.55rem; }
.organization-hero p { margin: 0; color: #667085; }
.organization-tabs { display: flex; gap: .45rem; padding: .45rem; overflow-x: auto; border: 1px solid #e4e9f1; border-radius: 1rem; background: #fff; }
.organization-tabs a { display: inline-flex; align-items: center; gap: .5rem; flex: 0 0 auto; padding: .7rem .9rem; border-radius: .75rem; color: #667085; text-decoration: none; font-weight: 800; font-size: .82rem; }
.organization-tabs a:hover, .organization-tabs a.active { background: #eaf2ff; color: #075de5; }
.organization-data { display: grid; gap: .7rem; margin: 0; }
.organization-data > div { padding: .8rem; border-radius: .75rem; background: #f7f9fc; }
.organization-data dt { color: #667085; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.organization-data dd { margin: .2rem 0 0; color: #0a1f44; font-weight: 800; }

.simple-list { display: grid; gap: .65rem; }
.simple-list article { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; gap: .8rem; align-items: center; padding: .8rem; border: 1px solid #e8ecf2; border-radius: .85rem; }
.simple-list-icon, .student-avatar-small, .group-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #eaf2ff; color: #0866ff; font-weight: 900; }
.simple-list strong, .simple-list small { display: block; }
.simple-list small { color: #667085; margin-top: .15rem; }

.group-card-list { display: grid; gap: .7rem; }
.group-card-list > a { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; gap: .8rem; align-items: center; padding: .85rem; border: 1px solid #e5eaf2; border-radius: .9rem; color: inherit; text-decoration: none; transition: .2s; }
.group-card-list > a:hover { border-color: #bcd2f4; transform: translateY(-1px); box-shadow: 0 8px 24px rgba(17,44,97,.06); }
.group-card-list strong, .group-card-list small { display: block; }
.group-card-list small { color: #667085; margin-top: .2rem; }

.training-summary-list { display: grid; gap: .75rem; }
.training-summary-list article { display: grid; grid-template-columns: minmax(0,1fr) minmax(180px,240px); gap: 1rem; align-items: center; padding: .9rem; border: 1px solid #e5eaf2; border-radius: .9rem; }
.training-summary-list strong, .training-summary-list small { display: block; }
.training-summary-list small { color: #667085; margin-top: .2rem; }
.training-progress { text-align: right; }
.training-progress .progress { margin: .3rem 0; }

.manager-organization-chip { display: grid; grid-template-columns: 38px minmax(0,1fr); gap: .65rem; align-items: center; padding: .7rem; margin-top: 1rem; border-radius: .85rem; background: rgba(255,255,255,.08); color: #fff; }
.manager-organization-chip > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: rgba(255,255,255,.1); }
.manager-organization-chip small, .manager-organization-chip strong { display: block; }
.manager-organization-chip small { color: rgba(255,255,255,.65); font-size: .67rem; }
.manager-organization-chip strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; }
.manager-switch-form { width: min(260px,30vw); }
.manager-welcome { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding: 1.5rem; margin-bottom: 1.5rem; overflow: hidden; border-radius: 1.25rem; background: linear-gradient(135deg,#092e6c,#126cea); color: #fff; }
.manager-welcome h2 { margin: .25rem 0 .45rem; font-size: 1.55rem; }
.manager-welcome p { margin: 0; color: rgba(255,255,255,.78); }
.manager-welcome > i { font-size: 5rem; opacity: .18; transform: rotate(-8deg); }
.deadline-list { display: grid; gap: .7rem; }
.deadline-list article { display: grid; grid-template-columns: 52px minmax(0,1fr); gap: .75rem; align-items: center; padding: .75rem; border-radius: .85rem; background: #f7f9fc; }
.deadline-date { width: 50px; min-height: 50px; display: grid; place-items: center; align-content: center; border-radius: 12px; background: #eaf2ff; color: #075de5; }
.deadline-date strong, .deadline-date small { display: block; line-height: 1; }
.deadline-date strong { font-size: 1.05rem; }
.deadline-date small { margin-top: .2rem; font-size: .56rem; font-weight: 900; }
.deadline-list article > div > strong, .deadline-list article > div > small { display: block; }
.deadline-list article > div > small { color: #667085; margin-top: .2rem; }

@media (max-width: 1199.98px) {
    .organization-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767.98px) {
    .organization-grid { grid-template-columns: 1fr; }
    .organization-hero { align-items: flex-start; flex-direction: column; }
    .organization-hero-main { align-items: flex-start; }
    .training-summary-list article { grid-template-columns: 1fr; }
    .training-progress { text-align: left; }
    .manager-switch-form { width: 150px; }
    .manager-welcome > i { display: none; }
}
@media (max-width: 575.98px) {
    .organization-metrics { grid-template-columns: 1fr; }
    .group-card-list > a, .simple-list article { grid-template-columns: 42px minmax(0,1fr); }
    .group-card-list .status-badge, .simple-list article > form, .simple-list article > .status-badge { grid-column: 2; justify-self: start; }
    .organization-icon-lg { width: 52px; height: 52px; }
    .manager-switch-form { display: none; }
}

/* Etapa 6.1 — múltiplos perfis e troca de áreas */
.area-picker-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 12% 18%, rgba(29,102,255,.12), transparent 28%),
        radial-gradient(circle at 88% 82%, rgba(11,45,107,.12), transparent 30%),
        #f5f7fb;
    color: #0a1f44;
}
.area-picker-shell { max-width: 920px; }
.area-picker-logo { width: 126px; height: 72px; object-fit: contain; }
.area-picker-shell h1 { margin: .35rem 0 .55rem; font-weight: 900; letter-spacing: -.035em; }
.area-picker-shell > div > p { max-width: 650px; margin: 0 auto; color: #667085; }
.area-picker-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.area-picker-form { min-width: 0; }
.area-picker-card {
    width: 100%; height: 100%; min-height: 210px; display: flex; flex-direction: column;
    position: relative; text-align: left; padding: 1.35rem; border: 1px solid #e3e9f2;
    border-radius: 1.25rem; background: #fff; color: inherit;
    box-shadow: 0 12px 34px rgba(17,44,97,.08); transition: .22s ease;
}
.area-picker-card:hover { transform: translateY(-4px); border-color: #9fc1f7; box-shadow: 0 18px 44px rgba(17,44,97,.13); }
.area-picker-icon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 17px; background: #eaf2ff; color: #0866ff; font-size: 1.45rem; }
.area-picker-copy { display: block; margin-top: 1rem; padding-right: 1.4rem; }
.area-picker-copy strong, .area-picker-copy small { display: block; }
.area-picker-copy strong { font-size: 1.08rem; color: #0a1f44; }
.area-picker-copy small { margin-top: .4rem; color: #667085; line-height: 1.5; }
.area-picker-arrow { position: absolute; right: 1.2rem; bottom: 1.2rem; color: #0866ff; }

.area-switcher-button { display: inline-flex; align-items: center; gap: .55rem; min-height: 40px; padding: .45rem .75rem; border: 1px solid #e1e7ef; border-radius: .75rem; background: #fff; color: #344054; font-size: .78rem; font-weight: 800; }
.area-switcher-button:hover, .area-switcher-button:focus { border-color: #aac6f2; background: #f7faff; color: #075de5; }
.area-switcher-menu { width: min(360px, calc(100vw - 2rem)); border: 1px solid #e2e8f0; border-radius: 1rem; box-shadow: 0 18px 48px rgba(15,36,72,.18); }
.area-switcher-item { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: .7rem; align-items: center; white-space: normal; padding: .7rem; border-radius: .75rem; }
.area-switcher-item > span:first-child { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: #eef4ff; color: #0866ff; }
.area-switcher-item strong, .area-switcher-item small { display: block; }
.area-switcher-item strong { color: #0a1f44; font-size: .83rem; }
.area-switcher-item small { margin-top: .15rem; color: #667085; font-size: .7rem; line-height: 1.35; }
.area-switcher-item.active, .area-switcher-item:active { background: #eaf2ff; color: #075de5; }

.sidebar-area-form, .student-area-form { margin: 0; }
.sidebar-area-form button, .student-area-form button {
    display: flex; align-items: center; gap: .75rem; width: 100%; padding: .72rem .8rem;
    border: 0; border-radius: .65rem; background: transparent; color: inherit;
    font: inherit; font-weight: 700; text-align: left;
}
.sidebar-area-form button { color: rgba(255,255,255,.78); }
.sidebar-area-form button:hover { background: rgba(255,255,255,.09); color: #fff; }
.student-area-form button { color: #526176; }
.student-area-form button:hover { background: #eef4ff; color: #075de5; }
.sidebar-area-form i, .student-area-form i { width: 18px; text-align: center; }

.manager-organization-chip span { display: block; margin-top: .15rem; color: rgba(255,255,255,.62); font-size: .62rem; line-height: 1.3; }
.refinement-badge { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .65rem; border-radius: 999px; background: #eaf2ff; color: #075de5; font-size: .72rem; font-weight: 900; white-space: nowrap; }
.account-role-list { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .45rem; }
.account-role-list span, .account-role-badge { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .48rem; border-radius: 999px; background: #f1f4f8; color: #526176; font-size: .66rem; font-weight: 800; }
.account-role-badge { background: #e8f8ef; color: #157347; }
.manager-admin-list article { align-items: flex-start; }
.topbar-actions { min-width: 0; }

@media (max-width: 991.98px) {
    .area-picker-grid { grid-template-columns: 1fr; max-width: 620px; margin-inline: auto; }
    .area-picker-card { min-height: 150px; display: grid; grid-template-columns: 58px minmax(0,1fr); gap: 1rem; align-items: center; }
    .area-picker-copy { margin-top: 0; }
}
@media (max-width: 767.98px) {
    .area-switcher-label { display: none; }
    .area-switcher-button { width: 42px; justify-content: center; padding: .45rem; }
    .area-switcher-button::after { display: none; }
    .topbar-actions .profile-pill { display: none; }
    .refinement-badge { display: none; }
}
@media (max-width: 575.98px) {
    .area-picker-page main { padding-inline: 1rem; }
    .area-picker-card { grid-template-columns: 48px minmax(0,1fr); min-height: 138px; padding: 1rem; }
    .area-picker-icon { width: 48px; height: 48px; border-radius: 14px; }
    .area-picker-arrow { right: 1rem; bottom: .9rem; }
    .manager-admin-list article { grid-template-columns: 42px minmax(0,1fr); }
    .manager-admin-list article > form { grid-column: 2; }
}


/* Etapa 7 — Conteúdo inicial do InfoConcurso */
.update-card .metric-card {
    height: 100%;
    padding: 1rem .75rem;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    background: #f8fafc;
    text-align: center;
}
.update-card .metric-card span,
.update-card .metric-card small { display: block; color: #718096; }
.update-card .metric-card span { font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.update-card .metric-card strong { display: block; margin: .15rem 0; color: #0a1f44; font-size: 1.7rem; }
.update-card form { text-align: left; }
.update-card .roadmap-list { text-align: left; }

/* Etapa 8 — ambientes de Word e apresentações */
.word-find-panel { display: flex; align-items: center; gap: .55rem; padding: .65rem .8rem; background: #eef4ff; border-bottom: 1px solid #d9e3f2; }
.word-find-panel[hidden] { display: none !important; }
.word-find-panel input { width: min(360px, 100%); border: 1px solid #cbd7e6; border-radius: .45rem; padding: .5rem .65rem; }
.powerpoint-app { position: relative; overflow: hidden; }
.powerpoint-app .office-titlebar { background: #c43e1c; color: #fff; }
.presentation-ribbon { display: flex; gap: .55rem; align-items: center; padding: .7rem; background: #fff7f2; border-bottom: 1px solid #ecd8cf; }
.presentation-ribbon button, .presentation-ribbon select { border: 1px solid #dec8be; background: #fff; border-radius: .45rem; padding: .48rem .65rem; }
.presentation-workspace { display: grid; grid-template-columns: 190px 1fr; min-height: 470px; background: #e6e6e8; }
.slide-thumbnails { padding: .8rem; background: #f7f7f8; border-right: 1px solid #d0d0d4; overflow: auto; }
.slide-thumbnails button { display: grid; grid-template-columns: 22px 1fr; gap: .4rem; width: 100%; text-align: left; border: 2px solid transparent; background: transparent; border-radius: .5rem; padding: .35rem; margin-bottom: .55rem; }
.slide-thumbnails button:first-child { border-color: #c43e1c; }
.slide-thumbnails button div { aspect-ratio: 16 / 9; display: flex; flex-direction: column; justify-content: center; align-items: center; background: #fff; border: 1px solid #cfd1d6; box-shadow: 0 2px 5px rgba(0,0,0,.08); overflow: hidden; }
.slide-thumbnails strong { font-size: .62rem; }
.slide-thumbnails small { font-size: .5rem; color: #667085; }
.slide-stage { display: grid; place-items: center; padding: 1.4rem; overflow: auto; }
.slide-canvas { width: min(760px, 100%); aspect-ratio: 16 / 9; display: flex; flex-direction: column; justify-content: center; gap: 1.2rem; background: linear-gradient(145deg,#fff 0%,#f7fbff 100%); border: 1px solid #bfc3ca; box-shadow: 0 8px 24px rgba(0,0,0,.16); padding: 8%; }
.slide-canvas input, .slide-canvas textarea { width: 100%; border: 1px dashed #aeb7c4; background: rgba(255,255,255,.82); text-align: center; padding: .7rem; resize: none; }
.slide-canvas input { font-size: clamp(1rem, 2.2vw, 2rem); font-weight: 700; }
.slide-canvas textarea { min-height: 90px; font-size: clamp(.8rem, 1.35vw, 1.15rem); }
.presentation-status { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem .75rem; border-top: 1px solid #d6d6da; background: #fafafa; color: #5d6675; font-size: .82rem; }
.presentation-overlay { position: absolute; inset: 0; z-index: 8; display: grid; place-items: center; background: #111827; color: #fff; }
.presentation-overlay[hidden] { display: none !important; }
.presentation-overlay > div { display: grid; place-items: center; gap: .75rem; }
.presentation-overlay i { font-size: 4rem; }
.presentation-overlay strong { font-size: 1.5rem; }
.sim-presentation-running .presentation-overlay { display: grid !important; }

@media (max-width: 767.98px) {
    .presentation-ribbon { overflow-x: auto; }
    .presentation-ribbon > * { flex: 0 0 auto; }
    .presentation-workspace { grid-template-columns: 92px 1fr; min-height: 370px; }
    .slide-thumbnails { padding: .35rem; }
    .slide-thumbnails button { grid-template-columns: 1fr; }
    .slide-thumbnails button > span { display: none; }
    .slide-stage { padding: .55rem; }
    .slide-canvas { padding: 7%; }
}

/* Etapa 9 — Internet, Segurança, Redes e Nuvem */
.browser-app, .email-app, .network-lab, .cloud-drive-app { position: relative; min-height: 610px; }
.browser-security-panel,
.browser-downloads-panel {
    position: absolute; z-index: 5; top: 96px; display: flex; align-items: center; gap: .75rem;
    width: min(420px, calc(100% - 2rem)); padding: .9rem 1rem; border: 1px solid #d9e3ee;
    border-radius: .8rem; background: #fff; box-shadow: 0 16px 40px rgba(15,36,72,.18);
}
.browser-security-panel { left: 1rem; color: #176b45; }
.browser-downloads-panel { right: 1rem; justify-content: space-between; color: #344054; }
.browser-security-panel[hidden], .browser-downloads-panel[hidden] { display: none !important; }
.browser-security-panel i, .browser-downloads-panel i { font-size: 1.45rem; color: #16865a; }
.browser-security-panel strong, .browser-security-panel small,
.browser-downloads-panel strong, .browser-downloads-panel small { display: block; }
.browser-security-panel small, .browser-downloads-panel small { margin-top: .2rem; color: #667085; line-height: 1.35; }
.sim-browser-new-tab .browser-tabs::after { content: 'Nova guia'; padding: .45rem 1rem; border-radius: .6rem .6rem 0 0; background: #f8fafc; color: #475467; }
.email-sender-details { max-width: 620px; margin: -.65rem 0 1rem; padding: .7rem .8rem; border-left: 4px solid #e5484d; border-radius: .45rem; background: #fff3f2; color: #6b2525; font-size: .85rem; }
.email-sender-details[hidden], .email-more-panel[hidden], .email-report-status[hidden] { display: none !important; }
.email-more-panel { display: flex; flex-wrap: wrap; gap: .45rem; max-width: 620px; margin-top: 1rem; padding: .75rem; border: 1px solid #e1e6ee; border-radius: .7rem; background: #f8fafc; }
.email-more-panel button { border: 1px solid #d8dee8; border-radius: .45rem; background: #fff; padding: .45rem .6rem; color: #475467; }
.email-report-status { max-width: 620px; margin-top: 1rem; padding: .75rem; border-radius: .7rem; background: #e8f8ef; color: #157347; font-weight: 800; }
.sim-email-reported .suspicious-link, .sim-email-reported .attachment { opacity: .45; pointer-events: none; }
.sim-email-deleted .email-message { opacity: .28; filter: grayscale(.5); }

.network-lab { padding: 1rem; background: linear-gradient(145deg,#eef6ff,#dfeaf8); color: #18304f; }
.network-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .9rem 1rem; border-radius: .9rem; background: #0b2d6b; color: #fff; box-shadow: 0 12px 30px rgba(11,45,107,.18); }
.network-header > div { display: grid; grid-template-columns: 42px 1fr; align-items: center; column-gap: .7rem; }
.network-header > div > i { grid-row: span 2; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: rgba(255,255,255,.12); }
.network-header strong, .network-header small { display: block; }
.network-header small { color: rgba(255,255,255,.7); }
.network-header button { border: 1px solid rgba(255,255,255,.2); border-radius: .55rem; background: rgba(255,255,255,.1); color: #fff; padding: .55rem .7rem; }
.network-status-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .8rem; margin: 1rem 0; }
.network-status-card { display: grid; grid-template-columns: 42px 1fr; gap: .15rem .65rem; align-items: center; min-width: 0; padding: .85rem; border: 1px solid #d8e3f1; border-radius: .85rem; background: #fff; text-align: left; color: #18304f; }
.network-status-card i { grid-row: span 2; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: #e8f8ef; color: #16865a; }
.network-status-card span { color: #667085; font-size: .72rem; }
.network-status-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sim-network-status-open [data-sim-target="router_status"] { border-color: #16865a; box-shadow: 0 0 0 3px rgba(22,134,90,.12); }
.network-panels { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.network-config-card { padding: 1rem; border: 1px solid #d8e3f1; border-radius: 1rem; background: #fff; box-shadow: 0 8px 22px rgba(25,58,99,.08); }
.network-card-title { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding-bottom: .75rem; border-bottom: 1px solid #edf1f6; margin-bottom: .75rem; }
.network-card-title strong, .network-card-title small { display: block; }
.network-card-title small { margin-top: .15rem; color: #667085; font-size: .74rem; }
.network-card-title select, .network-config-card label select, .network-config-card label input { width: 100%; border: 1px solid #cbd6e4; border-radius: .5rem; background: #fff; padding: .55rem .65rem; }
.network-card-title select { width: auto; min-width: 110px; }
.network-config-card label { display: grid; gap: .3rem; margin-bottom: .65rem; color: #475467; font-size: .78rem; font-weight: 700; }
.btn-network-test, .btn-network-connect { width: 100%; border: 0; border-radius: .55rem; background: #0866ff; color: #fff; padding: .65rem .75rem; font-weight: 800; }
.network-test-result, .wifi-connect-result { margin-top: .7rem; padding: .65rem; border-radius: .6rem; background: #e8f8ef; color: #157347; font-size: .8rem; font-weight: 800; }
.network-test-result[hidden], .wifi-connect-result[hidden] { display: none !important; }

.cloud-drive-app { background: #f6f8fb; color: #1f2d3d; }
.cloud-topbar { display: grid; grid-template-columns: auto minmax(180px,1fr) auto; gap: 1rem; align-items: center; padding: .75rem; border-bottom: 1px solid #dde4ed; background: #fff; }
.cloud-brand { display: flex; align-items: center; gap: .55rem; color: #0b2d6b; }
.cloud-brand i { font-size: 1.4rem; color: #0866ff; }
.cloud-search { display: flex; align-items: center; gap: .45rem; max-width: 620px; padding: .45rem .65rem; border-radius: 999px; background: #eef3f8; }
.cloud-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; }
.cloud-topbar > button { border: 0; border-radius: .55rem; background: #0866ff; color: #fff; padding: .6rem .75rem; }
.cloud-layout { display: grid; grid-template-columns: 190px 1fr; min-height: 540px; }
.cloud-layout aside { padding: .75rem; border-right: 1px solid #dde4ed; background: #fff; }
.cloud-layout aside button { display: flex; align-items: center; gap: .55rem; width: 100%; border: 0; border-radius: .55rem; background: transparent; color: #475467; padding: .65rem; text-align: left; }
.cloud-layout aside button:hover { background: #eef4ff; color: #075de5; }
.cloud-layout main { position: relative; min-width: 0; padding: 1rem; }
.cloud-actions { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.cloud-actions span { font-weight: 900; color: #0a1f44; }
.cloud-actions button { border: 1px solid #cbd7e6; border-radius: .55rem; background: #fff; color: #0b2d6b; padding: .55rem .7rem; }
.cloud-file-grid { display: grid; grid-template-columns: repeat(2,minmax(0,220px)); gap: 1rem; }
.cloud-file, .cloud-folder { display: grid; grid-template-columns: 42px 1fr; gap: .15rem .65rem; align-items: center; min-height: 88px; padding: .8rem; border: 1px solid #dce4ee; border-radius: .85rem; background: #fff; text-align: left; color: #1f2d3d; }
.cloud-file i, .cloud-folder i { grid-row: span 2; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #eaf2ff; color: #1769d2; font-size: 1.25rem; }
.cloud-folder i { background: #fff6d8; color: #b77900; }
.cloud-file strong, .cloud-file small, .cloud-folder strong, .cloud-folder small { display: block; }
.cloud-file small, .cloud-folder small { color: #667085; }
.sim-cloud-backup-selected [data-sim-target="backup_folder"] { border-color: #16865a; box-shadow: 0 0 0 3px rgba(22,134,90,.12); }
.cloud-share-panel, .cloud-version-panel, .cloud-upload-panel { position: absolute; z-index: 5; right: 1rem; top: 4rem; width: min(390px, calc(100% - 2rem)); padding: 1rem; border: 1px solid #dce4ee; border-radius: 1rem; background: #fff; box-shadow: 0 18px 48px rgba(15,36,72,.18); }
.cloud-share-panel[hidden], .cloud-version-panel[hidden], .cloud-upload-panel[hidden], .cloud-share-status[hidden] { display: none !important; }
.cloud-share-panel > div:first-child { display: flex; justify-content: space-between; gap: .75rem; margin-bottom: .8rem; }
.cloud-panel-close { border: 0; background: transparent; font-size: 1.3rem; }
.cloud-share-panel label { display: grid; gap: .3rem; margin-bottom: .65rem; color: #475467; font-size: .78rem; font-weight: 700; }
.cloud-share-panel input, .cloud-share-panel select { width: 100%; border: 1px solid #cbd7e6; border-radius: .5rem; padding: .55rem .65rem; }
.cloud-share-panel > button { width: 100%; border: 0; border-radius: .55rem; background: #0866ff; color: #fff; padding: .65rem; }
.cloud-share-status { margin-top: .7rem; padding: .65rem; border-radius: .55rem; background: #e8f8ef; color: #157347; font-size: .8rem; font-weight: 800; }
.cloud-version-panel ol { margin: .75rem 0 0; padding-left: 1.25rem; color: #475467; }
.cloud-version-panel li { margin-bottom: .45rem; }
.cloud-version-panel, .cloud-upload-panel { pointer-events: none; }
.cloud-upload-panel { display: flex; align-items: center; gap: .75rem; top: auto; bottom: 1rem; }
.cloud-upload-panel i { font-size: 1.5rem; color: #0866ff; }
.cloud-upload-panel strong, .cloud-upload-panel small { display: block; }
.cloud-upload-panel small { color: #667085; }

@media (max-width: 991.98px) {
    .network-lab, .cloud-drive-app { min-height: 540px; }
    .network-panels { grid-template-columns: 1fr; }
    .cloud-layout { grid-template-columns: 150px 1fr; min-height: 480px; }
}
@media (max-width: 767.98px) {
    .browser-security-panel, .browser-downloads-panel { top: 105px; }
    .network-status-grid { grid-template-columns: 1fr; }
    .network-header { align-items: flex-start; }
    .network-header > button { font-size: .72rem; }
    .cloud-topbar { grid-template-columns: auto 1fr; }
    .cloud-topbar > button { grid-column: 1 / -1; width: 100%; }
    .cloud-layout { grid-template-columns: 1fr; }
    .cloud-layout aside { display: flex; gap: .35rem; overflow-x: auto; border-right: 0; border-bottom: 1px solid #dde4ed; }
    .cloud-layout aside button { flex: 0 0 auto; width: auto; }
    .cloud-file-grid { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
    .network-lab { padding: .55rem; }
    .network-header { flex-direction: column; }
    .network-header > button { width: 100%; }
    .network-card-title { align-items: flex-start; }
    .network-card-title select { width: 100%; }
    .cloud-topbar { gap: .55rem; }
    .cloud-brand strong { display: none; }
    .cloud-actions { align-items: stretch; flex-direction: column; }
    .cloud-actions button { width: 100%; }
    .cloud-share-panel, .cloud-version-panel, .cloud-upload-panel { right: .5rem; width: calc(100% - 1rem); }
}