/* ================================================================
   V10.0.0 — DESIGN SYSTEM / DARK COACHING UI
   Etapa 1: identidade visual global sem reposicionar módulos
   Referência: dashboard dark premium, superfícies em camadas,
   bordas finas, ciano primário e acentos violeta/âmbar.
   ================================================================ */
:root {
    --bg-color: #061321;
    --card-bg: #0c1b2d;
    --text-color: #eef7fb;
    --border-color: #24384d;
    --primary-blue: #53e3d5;
    --primary-hover: #74eee2;
    --header-materia-bg: #10283b;
    --header-materia-text: #65e8dc;
    --danger-bg: #f26d78;
    --completed-bg: rgba(83, 227, 213, .10);
    --completed-border: #53e3d5;
    --completed-text: #7cecdf;
    --code-bg: #05101c;
    --atrasado-bg: rgba(242, 109, 120, .09);
    --atrasado-border: #f26d78;

    --modern-bg: #061321;
    --modern-surface: #0a1929;
    --modern-surface-2: #0e2033;
    --modern-surface-3: #12263a;
    --modern-border: #263a50;
    --modern-border-soft: #1c3045;
    --modern-muted: #8ea5b9;
    --modern-muted-2: #6f879c;
    --modern-blue: #53e3d5;
    --modern-blue-2: #32c9bd;
    --modern-green: #53e3d5;
    --modern-purple: #8e87ff;
    --modern-warning: #f4bc6a;
    --modern-danger: #f26d78;
    --modern-radius: 13px;
    --modern-radius-sm: 10px;
    --modern-shadow: 0 14px 34px rgba(0, 0, 0, .20);
    --modern-shadow-soft: 0 8px 20px rgba(0, 0, 0, .13);
}

body {
    background:
        radial-gradient(circle at 14% -5%, rgba(64, 200, 191, .055), transparent 25rem),
        radial-gradient(circle at 92% 4%, rgba(97, 105, 220, .05), transparent 28rem),
        #061321;
    color: var(--text-color);
    letter-spacing: -.005em;
}

/* Superfícies */
.card,
.delayed-panel,
.retention-diagnostic-panel,
.overview-card,
.action-bar,
.concurso-selector-bar,
.auth-card,
.modal,
.backup-slot,
.account-section,
.account-summary,
.flashcard-study-modal {
    background: linear-gradient(180deg, rgba(255,255,255,.012), rgba(255,255,255,0)), #0c1b2d;
    border: 1px solid var(--modern-border);
    box-shadow: var(--modern-shadow-soft);
}

.card,
.delayed-panel,
.retention-diagnostic-panel,
.overview-card,
.auth-card,
.modal,
.flashcard-study-modal {
    border-radius: var(--modern-radius);
}

.card { padding: 1.15rem; }
.card h3,
.retention-diagnostic-panel h3 {
    color: #edf8fb;
    font-weight: 760;
    letter-spacing: -.018em;
}

/* Cabeçalho e navegação */
header.modern-header {
    background: rgba(5, 17, 29, .91);
    border-color: #21364a;
    box-shadow: 0 12px 30px rgba(0,0,0,.20);
    backdrop-filter: blur(18px);
}
.header-brand-copy h2 { color: #f4fbfd; font-weight: 780; }
.header-brand img {
    border-color: rgba(83,227,213,.42);
    box-shadow: 0 0 0 3px rgba(83,227,213,.035);
}
.header-sync-status {
    border-color:rgba(83,227,213,.20) !important;
    background:rgba(7,22,37,.74) !important;
    box-shadow:none !important;
}
.app-version-badge {
    background: rgba(142, 165, 185, .08) !important;
    border: 1px solid #263b50 !important;
    color: #9db3c5 !important;
    box-shadow: none !important;
}

.concurso-selector-bar {
    background: #0a1a2b !important;
    border-color: #23384d !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.018) !important;
}
.concurso-selector-bar select,
.header-search-shell {
    background: #071625 !important;
    border-color: #263b50 !important;
    box-shadow: none !important;
}
.concurso-selector-bar select:focus,
.header-search-shell:focus-within,
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(83,227,213,.72) !important;
    box-shadow: 0 0 0 3px rgba(83,227,213,.08) !important;
}

.header-nav-tabs,
.nav-tabs {
    background: #091827 !important;
    border: 1px solid #21364a !important;
    box-shadow: none !important;
}
.tab-btn {
    color: #879db0;
    font-weight: 700;
    border: 1px solid transparent;
}
.tab-btn:hover { color: #dcecf2; background: rgba(255,255,255,.025); }
.tab-btn.active {
    color: #061b1d !important;
    background: #53e3d5 !important;
    border-color: #75eee3 !important;
    box-shadow: 0 5px 14px rgba(83,227,213,.12) !important;
}

/* Botões — linguagem visual uniforme e menos saturada */
.btn,
.btn-action {
    min-height: 38px;
    border-radius: 10px;
    font-weight: 720;
    letter-spacing: -.01em;
    border: 1px solid transparent;
    box-shadow: none;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.btn:hover,
.btn-action:hover {
    opacity: 1;
    transform: translateY(-1px);
}
.btn:active,
.btn-action:active { transform: translateY(0); }

.btn-primary {
    background: #53e3d5 !important;
    border-color: #68e9de !important;
    color: #06191c !important;
}
.btn-primary:hover { background: #70ebdf !important; }
.btn-secondary,
.btn-account-header,
.btn-theme-header,
.btn-logout-header {
    background: #102236 !important;
    border-color: #2a4056 !important;
    color: #d8e6ed !important;
}
.btn-secondary:hover,
.btn-account-header:hover,
.btn-theme-header:hover,
.btn-logout-header:hover {
    background: #142a40 !important;
    border-color: #3b586f !important;
    color: #f3fafc !important;
    box-shadow: none !important;
}
.btn-success {
    background: rgba(83,227,213,.12) !important;
    border-color: rgba(83,227,213,.62) !important;
    color: #72eade !important;
}
.btn-info {
    background: #10283b !important;
    border-color: #2e6374 !important;
    color: #78d9e3 !important;
}
.btn-purple {
    background: rgba(142,135,255,.13) !important;
    border-color: rgba(142,135,255,.58) !important;
    color: #aaa5ff !important;
}
.btn-warning {
    background: rgba(244,188,106,.13) !important;
    border-color: rgba(244,188,106,.58) !important;
    color: #f5c478 !important;
}
.btn-danger {
    background: rgba(242,109,120,.13) !important;
    border-color: rgba(242,109,120,.60) !important;
    color: #ff8c95 !important;
}
.btn-danger:hover { background: rgba(242,109,120,.21) !important; }

/* Estados especiais do cabeçalho */
.countdown-badge {
    min-height: 38px;
    background: rgba(142,135,255,.10) !important;
    border-color: rgba(142,135,255,.35) !important;
    color: #aaa7fb !important;
    box-shadow: none;
}
.sync-status-pill {
    background: #0b1d2e;
    border-color: #294056;
    color: #9eb2c3;
    border-radius: 10px;
    box-shadow: none;
}
.sync-status-pill.synced {
    background: rgba(83,227,213,.075);
    border-color: rgba(83,227,213,.34);
    color: #76eadd;
}
.sync-status-pill.synced .sync-dot {
    background: #53e3d5;
    box-shadow: 0 0 0 3px rgba(83,227,213,.10);
}
.sync-status-pill.pending {
    background: rgba(244,188,106,.08);
    border-color: rgba(244,188,106,.34);
    color: #f3c16f;
}
.sync-status-pill.offline {
    background: rgba(242,109,120,.08);
    border-color: rgba(242,109,120,.34);
    color: #f58a93;
}
.sync-status-pill.syncing {
    background: rgba(142,135,255,.08);
    border-color: rgba(142,135,255,.34);
    color: #aaa7ff;
}

/* Formulários */
input,
select,
textarea {
    background: #081827;
    border-color: #273c51;
    color: #e7f1f5;
    border-radius: 10px;
    box-shadow: none;
}
input::placeholder,
textarea::placeholder,
#globalStudySearch::placeholder { color: #6f879b !important; opacity: 1; }
select option { background: #0b1b2c; color: #e8f2f6; }
input[type="checkbox"] { accent-color: #53e3d5; }

/* Overview e métricas */
.study-overview-grid { gap: 9px; }
.overview-card {
    min-height: 86px;
    padding: 12px 13px;
    background: #0b1b2c;
    border-color: #22374c;
    box-shadow: none;
}
.overview-label {
    color: #849aae;
    font-size: .70rem;
    font-weight: 760;
    text-transform: none;
}
.overview-value { color: #eef8fb; font-weight: 790; }
.overview-hint { color: #617a8e; }
.overview-card.accent .overview-value,
.overview-card.success .overview-value { color: #62e6da; }
.overview-card.warning .overview-value { color: #f4bd6c; }

/* Barra de ações */
.action-bar {
    background: #091928;
    border-color: #22374b;
    padding: 6px;
    box-shadow: none;
}
.action-bar .btn-action {
    background: transparent;
    border-color: transparent;
    color: #8299ad;
    min-height: 38px;
}
.action-bar .btn-action:hover {
    background: #102438;
    border-color: #2a4157;
    color: #e3eef3;
    box-shadow: none;
}

/* Pomodoro */
.pomodoro-card::before { background: rgba(83,227,213,.04); }
.timer-display {
    color: #f0fafc;
    font-weight: 760;
    text-shadow: 0 0 28px rgba(83,227,213,.055);
}
.pomodoro-ring {
    filter: saturate(.86);
}
.pomodoro-progress-track,
.progress-bar,
.progress-track {
    background: #172b3e !important;
    border-color: #23394d !important;
}
.pomodoro-progress-fill,
.progress-fill {
    background: linear-gradient(90deg, #45d7cc, #72eade) !important;
}
.active-study-context {
    border-color: rgba(83,227,213,.25);
    background: rgba(83,227,213,.055);
}
.active-study-context-label { color: #65e7dc; }

/* Diagnóstico, listas e cartões internos */
.retention-diagnostic-panel,
.delayed-panel {
    background: #0a1a2a;
    border-color: #22374c;
    box-shadow: none;
}
.retention-metric,
.retention-risk-item,
.exam-phase-strip,
.backup-slot,
.account-section,
.account-summary {
    background: #0b1d2f !important;
    border-color: #253a50 !important;
    box-shadow: none !important;
}

/* Tabelas / edital */
table { border-collapse: separate; border-spacing: 0; }
th {
    color: #849bad;
    background: #0a1a2a;
    border-color: #22384d !important;
    font-weight: 750;
}
td { border-color: #20354a !important; }
tbody tr:not(.materia-header-row):hover { background: rgba(83,227,213,.025); }
.materia-header-row td,
.materia-header-content {
    background: #0d2235 !important;
}
.materia-header-row td { border-color: #28435a !important; }
.materia-header-row strong,
.materia-header-content strong { color: #72eade !important; }

/* Cronograma */
.calendar-day,
.day-card,
.calendar-topic-item,
.schedule-topic-item,
.month-topic-card {
    border-color: #243a4f !important;
    background: #0b1b2c !important;
    box-shadow: none !important;
}
.calendar-day:hover,
.day-card:hover { border-color: #35536b !important; }

/* Flashcards / anotações */
.flashcard-card,
.note-card,
.flashcard-folder-card,
.study-card-container {
    background: #0b1b2c !important;
    border-color: #243a4f !important;
    box-shadow: none !important;
}
.flashcard-badge-materia,
.flashcard-badge-assunto {
    background: rgba(83,227,213,.075) !important;
    border-color: rgba(83,227,213,.25) !important;
    color: #70e8dd !important;
}

/* Modais */
.modal-overlay { background: rgba(2, 8, 14, .76); backdrop-filter: blur(5px); }
.modal {
    background: #0b1b2c;
    border-color: #2a4055;
    box-shadow: 0 24px 70px rgba(0,0,0,.48);
}
.modal h2,
.modal h3 { color: #edf8fb; }

/* Scrollbar discreta */
* { scrollbar-color: #2b455a #081522; scrollbar-width: thin; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: #081522; }
*::-webkit-scrollbar-thumb { background: #29445a; border-radius: 10px; border: 2px solid #081522; }
*::-webkit-scrollbar-thumb:hover { background: #36566e; }

/* Mobile — mesma identidade, controles mais compactos */
@media (max-width: 900px) {
    #app-dashboard { background: transparent; }
    header.modern-header { background: #071725; border-color: #21364a; }
    .concurso-selector-bar { background: #0a1a2b !important; }
    .card { padding: 13px; }
    .overview-card { min-height: 82px; }
    .mobile-bottom-nav {
        background: rgba(7,23,37,.96);
        border-color: #263b50;
        box-shadow: 0 16px 38px rgba(0,0,0,.35);
    }
    .mobile-nav-btn.active {
        background: rgba(83,227,213,.10);
        color: #75eade;
    }
    .context-fab {
        background: #53e3d5;
        color: #06191c;
        box-shadow: 0 12px 26px rgba(83,227,213,.14);
    }
}

/* Light mode permanece disponível, mas ganha a mesma linguagem de componentes */
body.light-mode {
    --bg-color: #edf3f6;
    --card-bg: #ffffff;
    --text-color: #142334;
    --border-color: #ccd9e2;
    --primary-blue: #168f89;
    --primary-hover: #0f7b76;
    --header-materia-bg: #e8f5f4;
    --header-materia-text: #0d746f;
    --modern-border: #d3dee6;
    --modern-muted: #667b8c;
}
body.light-mode {
    background: #edf3f6;
}
body.light-mode .card,
body.light-mode .delayed-panel,
body.light-mode .retention-diagnostic-panel,
body.light-mode .overview-card,
body.light-mode .action-bar,
body.light-mode .concurso-selector-bar,
body.light-mode .auth-card,
body.light-mode .modal,
body.light-mode .backup-slot,
body.light-mode .account-section,
body.light-mode .account-summary {
    background: #ffffff !important;
    border-color: #d3dee6 !important;
    box-shadow: 0 8px 22px rgba(33, 52, 69, .055) !important;
}
body.light-mode header.modern-header,
body.light-mode .header-nav-tabs,
body.light-mode .nav-tabs { background: rgba(255,255,255,.94) !important; border-color:#d3dee6 !important; }
body.light-mode .concurso-selector-bar select,
body.light-mode .header-search-shell,
body.light-mode input,
body.light-mode select,
body.light-mode textarea {
    background: #f7fafb !important;
    color: #1b2b3b !important;
    border-color: #ccd9e2 !important;
}
body.light-mode .btn-secondary,
body.light-mode .btn-account-header,
body.light-mode .btn-theme-header,
body.light-mode .btn-logout-header {
    background: #f4f8fa !important;
    border-color: #ccd9e2 !important;
    color: #395063 !important;
}
body.light-mode .overview-card,
body.light-mode .retention-metric,
body.light-mode .retention-risk-item,
body.light-mode .exam-phase-strip { background: #fff !important; }
body.light-mode .overview-value,
body.light-mode .card h3,
body.light-mode .retention-diagnostic-panel h3 { color: #172938; }
body.light-mode .overview-card.accent .overview-value,
body.light-mode .overview-card.success .overview-value { color: #168f89; }

/* =====================================================================
   V10.1.0 — ETAPA 2 / COMPOSIÇÃO E DENSIDADE DO DASHBOARD
   Reorganização exclusivamente visual: grids, proporções, alinhamentos,
   espaçamentos e densidade. Sem alteração de lógica ou contratos JS.
   ===================================================================== */

/* Canvas geral mais próximo de um dashboard desktop, sem alongar demais. */
#app-dashboard {
    max-width: 1540px;
    padding: 1.1rem 1.15rem 1.5rem;
}
header.modern-header { margin-bottom: 10px; }
.header-control-stack { gap: 7px; }

/* Métricas: mesma altura, menor ruído e leitura horizontal mais rápida. */
.study-overview-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}
.overview-card {
    min-height: 74px;
    padding: 10px 12px;
    border-radius: 12px;
    justify-content: center;
    gap: 3px;
}
.overview-label { line-height: 1.15; }
.overview-value {
    font-size: 1.22rem;
    line-height: 1.05;
    margin: 1px 0;
}
.overview-hint {
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Diagnóstico vira uma faixa analítica compacta em vez de um bloco alto. */
.retention-diagnostic-panel {
    margin: 0 0 10px;
    padding: 11px 12px;
    border-radius: 13px;
    display: grid;
    grid-template-columns: minmax(190px, .8fr) minmax(320px, 1.35fr) minmax(360px, 1.8fr);
    grid-template-areas:
        "head metrics phase"
        "critical critical risk";
    align-items: stretch;
    gap: 8px 10px;
}
.retention-diagnostic-head {
    grid-area: head;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0;
    min-width: 0;
}
.retention-diagnostic-head > div { min-width: 0; }
.retention-diagnostic-head h3 {
    margin: 0 0 2px;
    font-size: .98rem;
}
.retention-diagnostic-subtitle {
    font-size: .68rem;
    line-height: 1.3;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.retention-diagnostic-head .btn {
    flex: 0 0 auto;
    min-height: 34px;
    height: 34px;
    padding: 0 10px;
    font-size: .72rem;
}
.retention-metric-grid {
    grid-area: metrics;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    margin: 0;
}
.retention-metric {
    min-width: 0;
    min-height: 54px;
    padding: 8px 9px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
}
.retention-metric span {
    font-size: .62rem;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.retention-metric strong {
    font-size: 1rem;
    line-height: 1;
}
.exam-phase-strip {
    grid-area: phase;
    min-height: 54px;
    margin: 0;
    padding: 8px 10px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}
.exam-phase-strip strong { white-space: nowrap; font-size: .72rem; }
.exam-phase-strip span {
    min-width: 0;
    font-size: .68rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.critical-queue-head {
    grid-area: critical;
    margin: 0;
    min-height: 34px;
    padding: 6px 9px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 9px;
    background: rgba(255,255,255,.018);
    border: 1px solid rgba(117,151,179,.12);
}
.critical-queue-head strong { font-size: .72rem; white-space: nowrap; }
.critical-queue-head span {
    min-width: 0;
    font-size: .64rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.retention-risk-list {
    grid-area: risk;
    min-height: 34px;
    max-height: 76px;
    overflow: auto;
    margin: 0;
}
.retention-risk-item {
    padding: 7px 9px;
    margin-bottom: 5px;
    border-radius: 9px;
    font-size: .7rem;
}

/* Barra de utilidades mais baixa e alinhada ao mesmo ritmo dos demais painéis. */
.action-bar {
    margin-bottom: 10px;
    min-height: 46px;
    padding: 5px;
    gap: 4px;
}
.action-bar .btn-action {
    min-width: 0;
    min-height: 34px;
    padding: 0 10px;
    font-size: .72rem;
    border-radius: 9px;
}

/* Área principal: Pomodoro compacto à esquerda e análise mais larga à direita. */
.grid-top {
    grid-template-columns: minmax(380px, .82fr) minmax(520px, 1.18fr);
    gap: 10px;
    margin-bottom: 10px;
    align-items: stretch;
}
.grid-top > .card {
    margin: 0;
    min-width: 0;
    height: 100%;
    padding: 14px;
    border-radius: 13px;
}
.grid-top > .card > h3 {
    margin: 0 0 9px;
    font-size: .98rem;
    line-height: 1.2;
}

/* Pomodoro: reduz verticalidade sem perder informação. */
.pomodoro-card {
    display: grid;
    grid-template-columns: minmax(180px, .9fr) minmax(180px, 1.1fr);
    grid-template-areas:
        "title title"
        "hero actions"
        "hero settings"
        "daily daily";
    column-gap: 12px;
    row-gap: 8px;
    align-content: start;
}
.pomodoro-card > h3 { grid-area: title; }
.pomodoro-hero {
    grid-area: hero;
    min-height: 212px;
    align-items: center;
    justify-content: center;
}
.pomodoro-ring { --ring-size: 200px; --ring-thickness: 17px; }
.timer-display { font-size: clamp(2.8rem, 4vw, 3.7rem); }
.pomodoro-actions {
    grid-area: actions;
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 6px;
    align-self: end;
}
.pomodoro-actions .btn {
    width: 100%;
    min-width: 0;
    min-height: 36px;
    padding: 0 8px;
    font-size: .73rem;
}
.pomodoro-actions .btn:last-child { grid-column: 1 / -1; }
.timer-settings {
    grid-area: settings;
    width: 100%;
    padding: 8px 9px;
    gap: 7px;
    align-self: start;
}
.timer-settings label {
    flex: 1 1 0;
    font-size: .68rem;
    gap: 5px;
}
.timer-settings input {
    width: 58px;
    min-height: 34px;
    height: 34px;
    padding: 4px 6px;
}
.pomodoro-daily-panel {
    grid-area: daily;
    margin-top: 1px;
    padding: 10px;
    border-radius: 11px;
}
.pomodoro-daily-panel h4 {
    margin: 0 0 7px;
    font-size: .76rem;
}
.pomodoro-daily-stats { gap: 6px; }
.pomodoro-daily-stat {
    min-height: 50px;
    padding: 7px 8px;
    border-radius: 9px;
}
.pomodoro-daily-value { font-size: .96rem; }
.pomodoro-daily-label { font-size: .59rem; }
.pomodoro-daily-status { font-size: .64rem; margin-top: 6px; }
.active-study-context {
    min-height: 38px;
    padding: 6px 8px;
    margin-top: 7px;
    border-radius: 9px;
}
.active-study-context-label { font-size: .58rem; }
.active-study-context-title { font-size: .68rem; }
.pomodoro-reset-hours {
    min-height: 32px !important;
    margin-top: 7px;
    font-size: .66rem !important;
}

/* Progresso: conteúdo mais horizontal e com menos espaço morto. */
.study-progress-breakdown {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 6px;
    margin-bottom: 8px;
}
.study-progress-mini {
    min-height: 48px;
    padding: 7px 9px;
    border-radius: 9px;
}
.study-progress-mini span { font-size: .62rem; }
.study-progress-mini strong { font-size: .9rem; }
.progress-chart-shell {
    min-height: 165px;
    height: 165px;
    margin: 0;
}
.progress-chart-shell canvas { max-height: 165px !important; }
.chart-legend-grid {
    margin-top: 6px;
    gap: 5px;
}
.subject-hours-panel {
    margin-top: 8px;
    padding-top: 8px;
}
.subject-hours-panel h4 {
    margin: 0 0 6px;
    font-size: .76rem;
}
.subject-hours-list {
    max-height: 118px;
    overflow: auto;
}
#studyActivityDistribution { margin-top: 7px !important; font-size: .68rem !important; }

/* Demais cards da tela: mesma malha e menor altura visual artificial. */
#tab-edital > .card:not(.pomodoro-card) {
    margin-bottom: 10px;
    border-radius: 13px;
}
.card h3 { margin-bottom: 10px; }

/* Desktop intermediário: diagnóstico quebra em duas linhas sem perder alinhamento. */
@media (max-width: 1280px) and (min-width: 901px) {
    #app-dashboard { max-width: 1220px; }
    .study-overview-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .retention-diagnostic-panel {
        grid-template-columns: minmax(200px,.75fr) minmax(430px,1.5fr);
        grid-template-areas:
            "head metrics"
            "phase phase"
            "critical risk";
    }
    .grid-top { grid-template-columns: minmax(350px,.9fr) minmax(470px,1.1fr); }
    .pomodoro-card { grid-template-columns: 1fr; grid-template-areas: "title" "hero" "actions" "settings" "daily"; }
    .pomodoro-hero { min-height: 195px; }
    .pomodoro-ring { --ring-size: 185px; }
}

/* Tablet/mobile: preserva a composição vertical e aumenta áreas de toque. */
@media (max-width: 900px) {
    #app-dashboard { padding: 10px 10px calc(124px + env(safe-area-inset-bottom,0px)); }
    .study-overview-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .overview-card { min-height: 76px; }
    .retention-diagnostic-panel {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas: "head" "phase" "metrics" "critical" "risk";
        padding: 10px;
        gap: 8px;
    }
    .retention-metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .retention-risk-list { max-height: 140px; }
    .action-bar .btn-action { min-height: 48px; font-size: .75rem; }
    .grid-top { grid-template-columns: 1fr !important; gap: 10px; }
    .grid-top > .card { padding: 13px; }
    .pomodoro-card {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas: "title" "hero" "actions" "settings" "daily";
    }
    .pomodoro-hero { min-height: 220px; }
    .pomodoro-ring { --ring-size: min(68vw, 230px); --ring-thickness: 18px; }
    .pomodoro-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .pomodoro-actions .btn { min-height: 42px; font-size: .76rem; }
    .timer-settings { flex-wrap: wrap; }
    .timer-settings label { min-width: 130px; }
    .progress-chart-shell { height: 180px; min-height: 180px; }
    .progress-chart-shell canvas { max-height: 180px !important; }
}

@media (max-width: 430px) {
    .study-overview-grid { gap: 7px; }
    .overview-card { min-height: 72px; padding: 9px 10px; }
    .overview-value { font-size: 1.1rem; }
    .retention-metric-grid { gap: 5px; }
    .retention-metric { min-height: 50px; padding: 7px; }
    .retention-diagnostic-head { align-items: flex-start; }
    .retention-diagnostic-head .btn { min-height: 36px; }
    .pomodoro-ring { --ring-size: min(72vw, 218px); }
    .pomodoro-actions { gap: 5px; }
    .pomodoro-actions .btn { font-size: .7rem; padding: 0 5px; }
    .pomodoro-daily-stats { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

/* Light mode acompanha apenas a composição; sem mudança funcional. */
body.light-mode .critical-queue-head {
    background: #f6fafc;
    border-color: #dce6ec;
}


/* V10.1.1 — ajustes finos de contenção visual */
.study-launch-controls {
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center;
    justify-content:flex-start;
    gap:6px !important;
    width:100%;
    min-width:0;
}
.study-launch-controls .btn {
    flex:0 1 auto;
    max-width:100%;
    min-width:0;
    min-height:31px;
    padding:.34rem .52rem;
    font-size:.73rem;
    border-radius:9px;
    line-height:1.05;
    white-space:nowrap;
}
.study-launch-controls .btn-register-question-result {
    padding:.34rem .5rem;
    font-size:.72rem;
}
.study-launch-controls .btn-study-legal {
    padding:.34rem .5rem;
    font-size:.72rem;
}
.day-topic-row,
.day-topic-controls-row,
.day-topic-inline-actions {
    min-width:0;
}

.day-modal-footer {
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}
.day-modal-footer > * {
    min-width:0;
    max-width:100%;
}
.day-modal-footer #addNewTopicArea {
    flex:1 1 300px;
}
.day-modal-footer .modal-actions {
    flex:0 1 auto;
    margin-top:0;
    min-width:0;
}
.day-modal-footer .modal-actions .btn {
    max-width:100%;
    white-space:nowrap;
}

.anki-folder-count,
.anki-subfolder-item span:last-child {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:30px;
    padding:4px 10px;
    border-radius:999px;
    background:#53e3d5 !important;
    border:1px solid #68e9de !important;
    color:#06191c !important;
    font-size:.78rem !important;
    font-weight:800 !important;
    line-height:1;
    opacity:1 !important;
}

@media (max-width:700px) {
    .study-launch-controls {
        display:grid !important;
        grid-template-columns:repeat(3, minmax(0,1fr));
        gap:6px !important;
    }
    .study-launch-controls .btn {
        width:100%;
        white-space:normal;
        justify-content:center;
        text-align:center;
        min-height:35px;
        padding:.38rem .34rem;
        font-size:.70rem;
    }
    .day-modal-footer {
        flex-direction:column;
        align-items:stretch;
    }
    .day-modal-footer #addNewTopicArea,
    .day-modal-footer .modal-actions,
    .day-modal-footer .modal-actions .btn {
        width:100%;
    }
    .day-modal-footer .modal-actions {
        justify-content:stretch;
    }
}

@media (max-width:480px) {
    .study-launch-controls {
        grid-template-columns:repeat(2, minmax(0,1fr));
    }
    .study-launch-controls .btn {
        font-size:.71rem;
    }
    .anki-folder-count,
    .anki-subfolder-item span:last-child {
        min-height:28px;
        padding:4px 9px;
        font-size:.74rem !important;
    }
}


/* V10.1.2 — busca em diálogo + identidade cromática por matéria */
.header-utility-cluster {
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    width:auto;
    min-width:0;
    gap:8px;
}
.btn-search-header {
    min-height:40px !important;
    height:40px !important;
    padding:0 13px !important;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:7px;
    white-space:nowrap;
    border-radius:12px !important;
}
.btn-search-header-icon { font-size:1rem; line-height:1; opacity:.82; }

.global-search-dialog {
    width:min(680px, calc(100vw - 32px));
    max-width:680px;
    max-height:min(78vh, 720px);
    overflow:hidden;
    padding:18px;
    gap:14px;
}
.global-search-dialog-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}
.global-search-dialog-head h3 { margin:0 0 4px; }
.global-search-dialog-head p {
    margin:0;
    color:var(--modern-muted,#94a3b8);
    font-size:.78rem;
    line-height:1.4;
}
.global-search-modal-shell {
    width:100%;
    max-width:none;
    min-width:0;
    min-height:48px;
    height:48px;
    flex:none;
    margin:0;
}
.global-search-modal-shell #globalStudySearch {
    min-width:0;
    min-height:46px;
    font-size:.92rem;
}
.global-search-modal-results.global-search-results {
    position:static !important;
    inset:auto !important;
    width:100%;
    display:block;
    min-height:120px;
    max-height:460px;
    overflow:auto;
    padding:6px;
    border:1px solid var(--modern-border,var(--border-color));
    border-radius:12px;
    background:#081827;
    box-shadow:none;
}
.global-search-empty {
    min-height:106px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px;
    color:var(--modern-muted,#94a3b8);
    font-size:.84rem;
    text-align:center;
}
.global-search-dialog .search-result-item {
    border:1px solid transparent;
    margin-bottom:3px;
}
.global-search-dialog .search-result-item:hover {
    border-color:rgba(83,227,213,.22);
    background:rgba(83,227,213,.07);
}

.chart-legend-item {
    min-width:0;
    align-items:center;
}
.chart-legend-color {
    flex:0 0 16px;
    width:16px !important;
    height:16px !important;
    border-radius:999px !important;
    box-shadow:0 0 12px rgba(83,227,213,.08);
}

@media (max-width:900px) {
    .header-sync-status {
        order:2;
        margin-left:0;
    }
    .header-utility-cluster {
        grid-column:1 / -1 !important;
        display:grid !important;
        grid-template-columns:1fr !important;
        width:100% !important;
    }
    .header-account-actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .btn-search-header { width:100% !important; }
}
@media (max-width:520px) {
    .global-search-dialog {
        width:calc(100vw - 16px);
        max-height:84vh;
        padding:13px;
        gap:11px;
    }
    .global-search-dialog-head { gap:8px; }
    .global-search-dialog-head .btn { padding:.38rem .55rem !important; font-size:.72rem !important; }
    .global-search-dialog-head p { font-size:.72rem; }
    .global-search-modal-results.global-search-results { max-height:54vh; }
}
body.light-mode .global-search-modal-results.global-search-results { background:#fff; }


/* =========================================================
   V10.2.0 — AUDITORIA MOBILE: harmonia, alinhamento e densidade
   ========================================================= */
@media (max-width: 700px) {
    /* 1. Cabeçalho: Conta / Tema / Sair na mesma linha */
    .header-account-actions {
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        width:100% !important;
        gap:6px !important;
        padding:0 !important;
        flex-wrap:nowrap !important;
    }
    .header-account-actions .btn,
    .concurso-selector-bar .header-account-actions .btn-account-header,
    .concurso-selector-bar .header-account-actions .btn-theme-header,
    .concurso-selector-bar .header-account-actions .btn-logout-header {
        grid-column:auto !important;
        width:100% !important;
        min-width:0 !important;
        height:38px !important;
        min-height:38px !important;
        padding:0 4px !important;
        margin:0 !important;
        font-size:.67rem !important;
        line-height:1.05 !important;
        white-space:normal !important;
        text-align:center !important;
        justify-content:center !important;
        border-radius:10px !important;
    }
    .header-utility-cluster { gap:7px !important; }
    .btn-search-header { min-height:40px !important; height:40px !important; }

    /* 2. Gráfico: barras mais finas e respiro visual */
    .progress-chart-shell {
        height:190px !important;
        min-height:190px !important;
        padding:12px 10px 4px !important;
    }
    .chart-legend-grid {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        column-gap:14px !important;
        row-gap:10px !important;
    }
    .chart-legend-item { gap:8px !important; align-items:flex-start !important; }
    .chart-legend-color { width:14px !important; height:14px !important; flex:0 0 14px !important; margin-top:2px; }

    /* 3. Formulário manual do edital em uma linha */
    .edital-manual-form {
        display:grid !important;
        grid-template-columns:minmax(0,1.15fr) minmax(0,1.15fr) minmax(72px,.7fr) !important;
        gap:6px !important;
        align-items:stretch !important;
        width:100% !important;
        margin-bottom:10px !important;
    }
    .edital-manual-form > #materia,
    .edital-manual-form > #assunto,
    .edital-manual-form > #prioridade {
        grid-column:auto !important;
        width:100% !important;
        min-width:0 !important;
        height:46px !important;
        min-height:46px !important;
        padding:0 8px !important;
        font-size:.72rem !important;
        text-overflow:ellipsis;
    }
    .edital-manual-form > #materia,
    .edital-manual-form > #assunto { cursor:pointer; }
    .edital-manual-actions {
        grid-column:1 / -1 !important;
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:7px !important;
        width:100% !important;
    }
    .edital-manual-actions .btn {
        width:100% !important;
        min-width:0 !important;
        min-height:42px !important;
        padding:.45rem .35rem !important;
        font-size:.72rem !important;
        white-space:normal !important;
        justify-content:center !important;
        text-align:center !important;
    }
    .edital-manual-actions .btn-danger { grid-column:1 / -1; }
    .mobile-edital-field-dialog { width:min(94vw,540px) !important; }
    .mobile-edital-field-dialog #mobileEditalFieldInput {
        width:100%; min-height:52px; font-size:1rem; padding:0 14px;
    }
    .mobile-edital-field-actions { display:grid !important; grid-template-columns:1fr 1fr; width:100%; }
    .mobile-edital-field-actions .btn { width:100%; }

    /* 4. Cronograma: seis comandos em uma única linha */
    .study-launch-controls {
        display:grid !important;
        grid-template-columns:repeat(6,minmax(0,1fr)) !important;
        gap:4px !important;
        width:100% !important;
        min-width:0 !important;
        align-items:stretch !important;
    }
    .study-launch-controls .btn {
        width:100% !important;
        min-width:0 !important;
        min-height:40px !important;
        height:40px !important;
        padding:3px 2px !important;
        font-size:0 !important;
        line-height:1 !important;
        white-space:normal !important;
        overflow:hidden !important;
        text-align:center !important;
        justify-content:center !important;
        border-radius:8px !important;
    }
    .study-launch-controls .btn[data-mobile-label]::after {
        content:attr(data-mobile-label);
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        overflow:hidden;
        font-size:.56rem;
        font-weight:800;
        line-height:1.04;
        letter-spacing:-.01em;
        text-align:center;
    }
    .day-topic-row { padding:11px !important; }
    .day-topic-row > div:first-child strong {
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        overflow:hidden;
        line-height:1.3 !important;
    }
    .day-topic-controls-row { gap:7px !important; }

    /* 5. Ações de estudo de flashcards na mesma linha */
    #tab-flashcards .flashcard-study-actions {
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        width:100% !important;
        gap:7px !important;
    }
    #tab-flashcards .flashcard-study-actions .btn {
        width:100% !important;
        min-width:0 !important;
        min-height:42px !important;
        padding:.42rem .38rem !important;
        font-size:.68rem !important;
        line-height:1.15 !important;
        white-space:normal !important;
        text-align:center !important;
        justify-content:center !important;
    }
    #tab-flashcards .flashcards-header {
        display:block !important;
        margin-bottom:12px !important;
    }
    #tab-flashcards .flashcards-header h3 { margin-bottom:10px !important; }

    /* Auditoria geral mobile */
    .card { overflow:hidden; }
    .action-bar { gap:6px !important; padding:7px !important; }
    .action-bar .btn-action { min-width:0 !important; font-size:.68rem !important; line-height:1.15 !important; }
    .context-fab {
        min-width:54px !important;
        height:40px !important;
        padding:0 11px !important;
        right:12px !important;
        bottom:calc(88px + env(safe-area-inset-bottom,0px)) !important;
        border-radius:12px !important;
        font-size:.68rem !important;
    }
    .mobile-bottom-nav { z-index:500; }
    input, select, textarea, button { max-width:100%; box-sizing:border-box; }
}

@media (max-width: 390px) {
    .header-account-actions .btn,
    .concurso-selector-bar .header-account-actions .btn-account-header,
    .concurso-selector-bar .header-account-actions .btn-theme-header,
    .concurso-selector-bar .header-account-actions .btn-logout-header {
        font-size:.61rem !important;
        padding:0 2px !important;
    }
    .edital-manual-form { grid-template-columns:minmax(0,1fr) minmax(0,1fr) 68px !important; gap:5px !important; }
    .edital-manual-form > #materia,
    .edital-manual-form > #assunto,
    .edital-manual-form > #prioridade { font-size:.66rem !important; padding:0 6px !important; }
    .study-launch-controls { gap:3px !important; }
    .study-launch-controls .btn[data-mobile-label]::after { font-size:.51rem; }
    #tab-flashcards .flashcard-study-actions .btn { font-size:.63rem !important; padding:.38rem .3rem !important; }
}


/* =========================================================
   V10.3.0 — MINIMALISMO DO CABEÇALHO, GRÁFICO MAIS FINO,
   LIMPEZA DO EDITAL E REFINO DO DIAGNÓSTICO
   ========================================================= */
@media (min-width: 901px) {
    .concurso-selector-bar {
        display:flex !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        gap:8px !important;
        overflow:hidden;
    }
    .concurso-selector-bar label { flex:0 0 auto; }
    .concurso-selector-bar select {
        flex:1 1 300px !important;
        min-width:250px !important;
        max-width:none !important;
    }
    .concurso-selector-bar > .btn,
    .concurso-selector-bar > .countdown-badge,
    .concurso-selector-bar > .sync-status-pill,
    .header-account-actions .btn,
    .btn-search-header {
        height:38px !important;
        min-height:38px !important;
        padding:0 10px !important;
        border-radius:12px !important;
        font-size:.78rem !important;
    }
    .header-utility-cluster {
        flex:0 0 auto !important;
        width:auto !important;
        display:flex !important;
        align-items:center !important;
        gap:8px !important;
    }
    .header-account-actions {
        display:flex !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        justify-content:flex-end !important;
        gap:8px !important;
        width:auto !important;
    }
    .header-account-actions .btn {
        white-space:nowrap !important;
        min-width:auto !important;
    }
}
@media (min-width: 901px) and (max-width: 1350px) {
    .concurso-selector-bar { gap:6px !important; }
    .concurso-selector-bar > .btn,
    .concurso-selector-bar > .countdown-badge,
    .concurso-selector-bar > .sync-status-pill,
    .header-account-actions .btn,
    .btn-search-header {
        padding:0 8px !important;
        font-size:.72rem !important;
    }
    .header-account-actions { gap:6px !important; }
    .btn-theme-header { max-width:132px; }
}

.progress-chart-shell {
    height:165px !important;
    min-height:165px !important;
    padding:10px 10px 2px !important;
}
.progress-chart-shell canvas {
    max-height:165px !important;
}
@media (max-width: 700px) {
    .progress-chart-shell {
        height:158px !important;
        min-height:158px !important;
        padding:10px 8px 2px !important;
    }
    .progress-chart-shell canvas { max-height:158px !important; }
}

.materia-header-row {
    box-shadow:none !important;
}
#tab-edital tbody tr.adaptive-edital-row {
    border-left:0 !important;
    box-shadow:none !important;
}

.retention-diagnostic-panel {
    grid-template-columns:minmax(230px, .9fr) minmax(420px, 1.45fr) minmax(320px, 1.15fr) !important;
    grid-template-areas:
        "head metrics critical"
        "phase phase risk" !important;
    gap:10px 12px !important;
    align-items:stretch !important;
}
.retention-diagnostic-head {
    align-items:flex-start !important;
}
.retention-diagnostic-head .btn {
    margin-top:2px;
}
.retention-metric-grid {
    gap:8px !important;
}
.retention-metric {
    min-height:58px !important;
    padding:9px 10px !important;
}
.exam-phase-strip {
    min-height:58px !important;
    padding:10px 12px !important;
}
.critical-queue-head {
    min-height:58px !important;
    padding:10px 12px !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
}
.critical-queue-head span {
    white-space:normal !important;
    text-overflow:clip !important;
    overflow:visible !important;
    text-align:right !important;
}
.retention-risk-list {
    min-height:58px !important;
    max-height:none !important;
    padding:2px 0 0 !important;
}
@media (max-width: 1280px) and (min-width: 901px) {
    .retention-diagnostic-panel {
        grid-template-columns:minmax(220px,.95fr) minmax(360px,1.25fr) !important;
        grid-template-areas:
            "head metrics"
            "phase phase"
            "critical risk" !important;
    }
}
@media (max-width: 900px) {
    .retention-diagnostic-panel {
        grid-template-columns:1fr !important;
        grid-template-areas:"head" "phase" "metrics" "critical" "risk" !important;
        gap:8px !important;
    }
    .critical-queue-head span { text-align:left !important; }
}
