/* My Progress only. Storage, synchronization and exports keep their existing data. */
body.progress-practice [hidden] { display: none !important; }
body.progress-practice .module-header p { color: var(--muted); font-size: 15px; line-height: 1.7; }
body.progress-practice .progress-continue { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; margin-top: 20px; padding: 12px 20px; border-radius: 12px; background: var(--sky); color: var(--practice-on-accent); font-size: 15px; font-weight: 600; text-decoration: none; line-height: 1.6; }
body.progress-practice .progress-continue:hover { background: var(--sky2); }
body.progress-practice .progress-status { color: var(--muted); font-size: 14px; line-height: 1.7; margin-bottom: 20px; }
body.progress-practice .progress-status:empty { display: none; }
body.progress-practice .progress-section-title { font-size: 18px; font-weight: 500; line-height: 1.6; color: var(--text); margin: 0 0 16px; letter-spacing: 0; text-transform: none; }
body.progress-practice .xp-card,
body.progress-practice .heatmap-card,
body.progress-practice .mistakes-card,
body.progress-practice .cert-section,
body.progress-practice .progress-empty { background: var(--practice-card); border: 1px solid var(--border); border-radius: 16px; padding: 24px; margin-bottom: 20px; }
body.progress-practice .xp-card { gap: 20px; flex-wrap: wrap; }
body.progress-practice .xp-icon-box { background: var(--practice-accent-wash); }
body.progress-practice .xp-info { min-width: 0; }
body.progress-practice .xp-meta { color: var(--muted); font-size: 13px; line-height: 1.6; letter-spacing: 0; text-transform: none; }
body.progress-practice .xp-val { font-size: 28px; font-weight: 600; line-height: 1.5; }
body.progress-practice .xp-track { height: 8px; background: var(--bg3); margin: 12px 0 8px; border-radius: 4px; }
body.progress-practice .xp-fill { height: 8px; background: var(--sky); border-radius: 4px; }
body.progress-practice .xp-next-txt { color: var(--muted); font-size: 13px; line-height: 1.7; }
body.progress-practice .cefr-badge { background: var(--practice-accent-wash); border-color: var(--border); padding: 14px 20px; }
body.progress-practice .cefr-num { color: var(--sky); font-size: 24px; font-weight: 600; line-height: 1.5; }
body.progress-practice .cefr-badge > div:last-child { font-size: 13px !important; line-height: 1.6; }
body.progress-practice .skill-levels-row,
body.progress-practice .stats-row { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-bottom: 24px; }
body.progress-practice .skill-chip,
body.progress-practice .stat-box { min-width: 0; background: var(--practice-card); border-color: var(--border); border-radius: 14px; padding: 16px 12px; }
body.progress-practice .skill-chip-val { font-size: 20px; font-weight: 600; }
body.progress-practice .stat-val { color: var(--sky) !important; font-size: 22px; font-weight: 600; line-height: 1.5; }
body.progress-practice .skill-chip-label,
body.progress-practice .stat-lbl { color: var(--muted); font-size: 13px; line-height: 1.6; letter-spacing: 0; text-transform: none; }
body.progress-practice .heatmap-title { color: var(--text); font-size: 18px; font-weight: 500; line-height: 1.6; margin-bottom: 16px; }
body.progress-practice .heatmap-row { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 8px; }
body.progress-practice .heatmap-day { min-width: 0; }
body.progress-practice .heatmap-dot { width: min(100%,40px); height: 40px; border-color: var(--border) !important; background: var(--bg) !important; }
body.progress-practice .heatmap-dot.active { color: var(--sky); border-color: var(--border2) !important; background: var(--practice-accent-wash) !important; }
body.progress-practice .heatmap-lbl { color: var(--muted); font-size: 12px; line-height: 1.6; }
body.progress-practice .progress-mistakes-title span { font-size: 18px !important; font-weight: 500 !important; }
body.progress-practice .mistake-header { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
body.progress-practice .mistake-rank { background: var(--practice-accent-wash) !important; color: var(--sky) !important; width: 28px; height: 28px; font-size: 13px; }
body.progress-practice .mistake-name { min-width: 0; font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
body.progress-practice .mistake-freq { color: var(--muted); font-size: 13px; line-height: 1.7; }
body.progress-practice .mistake-bar-track { margin-inline-start: 40px; margin-inline-end: 0; height: 6px; background: var(--bg3); border-radius: 3px; overflow: hidden; }
body.progress-practice .mistake-bar { height: 6px; background: var(--sky) !important; border-radius: 3px; }
body.progress-practice .mistake-exercises { color: var(--muted); margin-inline-start: 40px; margin-inline-end: 0; margin-top: 8px; font-size: 13px; line-height: 1.7; }
body.progress-practice .progress-empty h2 { font-size: 20px; font-weight: 500; line-height: 1.6; margin-bottom: 10px; }
body.progress-practice .progress-empty p { color: var(--muted); font-size: 15px; line-height: 1.7; margin-bottom: 10px; }
body.progress-practice .progress-empty a { display: inline-flex; align-items: center; min-height: 44px; color: var(--sky); font-size: 15px; }
body.progress-practice .progress-tools { border: 1px solid var(--border); border-radius: 16px; background: var(--practice-card); margin-bottom: 28px; }
body.progress-practice .progress-tools summary { display: flex; align-items: center; gap: 16px; min-height: 64px; padding: 20px 24px; list-style: none; border-radius: 16px; color: var(--text); font-size: 18px; font-weight: 500; cursor: pointer; }
body.progress-practice .progress-tools summary::-webkit-details-marker { display: none; }
body.progress-practice .progress-tools-chevron { margin-inline-start: auto; width: 8px; height: 8px; flex: 0 0 8px; border-inline-end: 1.5px solid var(--muted); border-bottom: 1.5px solid var(--muted); transform: rotate(45deg); }
body.progress-practice .progress-tools[open] .progress-tools-chevron { transform: rotate(225deg); }
body.progress-practice .progress-tools-body { border-top: 1px solid var(--border); padding: 24px; }
body.progress-practice .progress-export-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
body.progress-practice .pdf-btn { min-height: 48px; margin-bottom: 20px; padding: 14px 16px; font-size: 14px; font-weight: 500; color: var(--sky); background: var(--practice-accent-wash); border-color: var(--border2); line-height: 1.6; }
body.progress-practice .pdf-btn:hover { background: var(--surface2); }
body.progress-practice .sg-overlay { position: static; inset: auto; z-index: auto; backdrop-filter: none; color: var(--text); background: var(--bg); border: 1px solid var(--border); border-radius: 14px; gap: 12px; padding: 20px; margin-bottom: 20px; }
body.progress-practice .sg-overlay-text { font-size: 15px; line-height: 1.7; }
body.progress-practice .sg-overlay-sub { font-size: 13px; line-height: 1.7; }
body.progress-practice .sg-spinner { width: 30px; height: 30px; border-width: 3px; border-color: var(--border); border-top-color: var(--sky); }
body.progress-practice .progress-action-status { color: var(--muted); font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
body.progress-practice .progress-action-status.error { color: var(--coral); }
body.progress-practice .progress-action-status:empty { display: none; }
body.progress-practice .cert-section { padding: 20px; margin-bottom: 0; }
body.progress-practice .cert-section-title { color: var(--text); font-size: 18px; font-weight: 500; line-height: 1.6; margin-bottom: 10px; }
body.progress-practice .cert-section-sub { color: var(--muted); font-size: 14px; line-height: 1.7; margin-bottom: 20px; }
body.progress-practice .cert-gen-btn { min-height: 48px; color: var(--practice-on-accent); background: var(--sky); border-color: var(--sky); font-size: 14px; font-weight: 600; padding: 14px 16px; line-height: 1.6; }
body.progress-practice .cert-gen-btn:hover:not(:disabled) { background: var(--sky2); }
body.progress-practice .cert-item-info { min-width: 0; flex-basis: 120px; }
body.progress-practice .cert-item-level { font-size: 18px; font-weight: 500; }
body.progress-practice .cert-item-date { color: var(--muted); font-size: 13px; line-height: 1.7; }
body.progress-practice .cert-item-actions { min-width: 0; flex-shrink: 1; gap: 10px; }
body.progress-practice .cert-item-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 12px; color: var(--muted); background: var(--practice-card); border-color: var(--border2); border-radius: 10px; text-decoration: none; font-size: 13px; line-height: 1.6; }
body.progress-practice .cert-item-btn:hover { color: var(--text); background: var(--surface2); }
body.progress-practice .cert-item-btn.danger { color: var(--coral); }
body.progress-practice .cert-item-btn.danger:hover { color: var(--coral); border-color: var(--coral); }
body.progress-practice .cert-empty,
body.progress-practice .cert-locked span,
body.progress-practice .cert-locked a { font-size: 14px !important; line-height: 1.7; }
body.progress-practice .cert-locked a { display: inline-flex; align-items: center; min-height: 44px; }
body.progress-practice :is(.pdf-btn,.cert-gen-btn,.cert-item-btn):disabled { color: var(--muted); background: var(--bg3); border-color: var(--border); opacity: 1; cursor: not-allowed; }
body.progress-practice .ex-card { background: var(--practice-card); border-color: var(--border) !important; border-radius: 16px; gap: 16px; padding: 20px; margin-bottom: 12px; }
body.progress-practice .ex-card:hover { background: var(--surface2); transform: none; }
body.progress-practice .ex-icon { background: var(--practice-accent-wash) !important; }
body.progress-practice .ex-icon svg,
body.progress-practice .xp-icon-box svg,
body.progress-practice .heatmap-dot svg,
body.progress-practice .pdf-btn svg,
body.progress-practice #certIcon svg { stroke: var(--sky); }
body.progress-practice .ex-info { min-width: 0; }
body.progress-practice .ex-label { color: var(--text) !important; font-size: 17px; font-weight: 500; line-height: 1.6; }
body.progress-practice .ex-meta { color: var(--muted); font-size: 13px; line-height: 1.7; }
body.progress-practice .ex-avg { color: var(--sky) !important; font-size: 22px; font-weight: 600; }
body.progress-practice .ex-avg-lbl { color: var(--muted); font-size: 12px; line-height: 1.6; }
body.progress-practice .ex-arrow { color: var(--muted); }
@media (max-width: 600px) {
  body.progress-practice :is(.xp-card,.heatmap-card,.mistakes-card,.progress-empty) { padding: 20px; }
  body.progress-practice .skill-levels-row,
  body.progress-practice .stats-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.progress-practice .progress-export-actions { grid-template-columns: minmax(0,1fr); }
  body.progress-practice .pdf-btn { margin-bottom: 0; }
  body.progress-practice .progress-tools-body { padding: 16px; }
  body.progress-practice .progress-tools summary { padding: 20px; }
  body.progress-practice .sg-overlay { margin-top: 20px; }
  body.progress-practice .cert-section { margin-top: 20px; padding: 16px; }
  body.progress-practice .ex-card { flex-wrap: wrap; padding: 16px; }
  body.progress-practice .ex-info { flex-basis: calc(100% - 66px); }
  body.progress-practice .ex-card > div[style*="text-align:right"] { margin-inline-start: 62px; }
  body.progress-practice .ex-arrow { margin-inline-start: auto; }
  body.progress-practice .xp-info { flex-basis: calc(100% - 72px); }
  body.progress-practice .cefr-badge { margin-inline-start: 72px; }
}
html.pp-embedded-exercise body.progress-practice .main-content { padding-top: 28px !important; }
