body.exercise-mode .header-studies,body.exercise-mode .brand-copy p,
body.exercise-mode #toolbarContent,body.exercise-mode #analysisContent,
body.exercise-mode .canvas-hud,body.exercise-mode .canvas-tip { display:none; }
body.exercise-mode #toolbarContent,body.exercise-mode #analysisContent { display:none !important; }
body.exercise-mode .app-workspace { grid-template-columns:365px minmax(0,1fr); }
body.exercise-mode #toolbarContent { padding-top:10px; }
body.exercise-mode .brand-copy h1::after { content:' · Exercices graphiques'; font-size:.75em; font-weight:500; }
.exercise-exit { color:white; font-size:.8rem; white-space:nowrap; }
#exercisePanel { padding:18px 18px 10px; border-bottom:1px solid var(--line); }
#exercisePanel h2 { font-size:1.05rem; margin:8px 0; color:#173d9a; }
#exercisePanel p { font-size:.82rem; line-height:1.5; margin:8px 0; }
#exercisePanel label { font-size:.78rem; }
#exercisePanel select { width:100%; margin:5px 0; }
#exercisePanel details { font-size:.8rem; margin:10px 0; line-height:1.5; }
#exercisePanel summary { cursor:pointer; font-weight:700; }
#exercisePanel .exercise-progress { font-size:.75rem; font-weight:800; color:#526076; }
#exercisePanel progress { width:100%; height:8px; accent-color:#0f8b83; }
#exerciseStep { padding:12px; background:#eef4ff; border-radius:12px; margin-top:10px; }
#exerciseStep h3 { font-size:.9rem; color:#173d9a; }
#exerciseFeedback { border-left:3px solid #d97706; padding-left:9px; color:#854d0e; }
#exerciseFeedback.success { border-color:#15803d; color:#166534; }
.exercise-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.exercise-actions button { border:1px solid #cbd5e1; background:white; color:#173d9a; border-radius:8px; padding:8px; cursor:pointer; font-size:.76rem; }
.exercise-actions button:hover { background:#eaf0ff; }
body.exercise-mode button[data-tool-btn].active,body.exercise-mode button[data-tool-btn].active i { color:white; }
body.exercise-mode .exercise-tools button.active { background:#1d4ed8; border-color:#1d4ed8; }
.exercise-tools button { flex:1; }
body.exercise-mode #exercisePanel [hidden] { display:none; }
#exerciseIntroduction { margin:12px 0; }
body.exercise-mode #properties label[for='propColor'],body.exercise-mode #properties #propColor { display:none; }
#exerciseChecklist { padding-left:20px; font-size:.78rem; line-height:1.65; }
#exerciseChecklist li[data-complete='true'] { color:#15803d; }
#exerciseResult { font-size:.8rem; line-height:1.6; }
#exerciseResult table { width:100%; border-collapse:collapse; margin:8px 0; }
#exerciseResult th,#exerciseResult td { padding:5px; border-bottom:1px solid #dbe3ee; text-align:left; }
#exerciseCanvasStatus { position:absolute; z-index:4; left:12px; right:12px; top:12px; background:rgba(255,255,255,.96); border:1px solid #cbd5e1; border-radius:10px; padding:8px 12px; font-size:.8rem; color:#173d9a; pointer-events:none; }
@media(max-width:980px) { body.exercise-mode .app-workspace { grid-template-columns:320px minmax(0,1fr); } }
@media(max-width:760px) {
    body.exercise-mode { --header-height:74px; }
    body.exercise-mode .app-header { flex-wrap:nowrap; gap:8px; }
    body.exercise-mode .brand-mark { display:none; }
    body.exercise-mode .brand-copy h1 { font-size:.95rem; }
    body.exercise-mode .brand-copy h1::after { display:block; margin-top:5px; }
    body.exercise-mode .exercise-exit { font-size:.72rem; }
    #exercisePanel { padding:14px; }
    #exerciseCanvasStatus { font-size:.72rem; }
}

/* Après validation de toutes les constructions, afficher l'analyse statique intégrée. */
body.exercise-mode.exercise-analysis-mode #exercisePanel { display:none; }
body.exercise-mode.exercise-analysis-mode #analysisContent { display:block !important; }
body.exercise-mode.exercise-analysis-mode #toolbarContent { display:none !important; }


/* Navigation de fin d'exercice dans l'analyse statique. */
body.exercise-mode.exercise-analysis-mode #availableVectors,
body.exercise-mode.exercise-analysis-mode #availableVectors[hidden] { display:none !important; }
.exercise-analysis-actions {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid var(--line);
}
.exercise-analysis-actions button {
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:9px 12px;
    border:1px solid var(--line);
    border-radius:11px;
    background:#fff;
    color:#173d9a;
    font-weight:800;
    cursor:pointer;
}
.exercise-analysis-actions button:last-child:not(:disabled) {
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary-color),#1d4ed8);
}
.exercise-analysis-actions button:disabled {
    opacity:.55;
    cursor:default;
}
@media(max-width:760px){.exercise-analysis-actions{grid-template-columns:1fr;}}


/* En mode exercice l'analyse est déjà lancée et validée automatiquement. */
body.exercise-mode.exercise-analysis-mode .analysis-controls { display:none !important; }

.exercise-kinematic-summary {
    margin-top:12px;
    padding:12px 13px;
    border:1px solid #bfe5e1;
    border-left:4px solid var(--accent-color);
    border-radius:12px;
    background:var(--accent-soft);
    color:#315d5a;
}
.exercise-kinematic-summary strong { color:#0f6863; }
.exercise-kinematic-summary p { margin:5px 0 0 !important; }

.exercise-concept { margin:12px 0; padding:12px 13px; border:1px solid #b8cdf2; border-left:4px solid #2358d8; border-radius:12px; background:#f4f8ff; }
.exercise-concept h2 { margin:0 0 6px !important; font-size:.92rem !important; color:#173d9a !important; }
.exercise-concept p { margin:0 !important; color:#334155; font-size:.8rem !important; line-height:1.55 !important; }

/* Icônes des outils du didacticiel : même langage visuel que la barre MecaGraph. */
.exercise-tools button i { width:18px; text-align:center; flex:0 0 18px; }
.exercise-tools button { align-items:center; justify-content:flex-start; gap:7px; }