/* Kärnämnesutveckling: comparison first, then the paired subject detail. */
.core-section { padding: 24px; border: 1px solid #cee4ed; border-radius: 20px; background: linear-gradient(135deg, #f0faff, #f7fbfc 70%); }
.core-section .section-head { margin-bottom: 18px; }
.core-section .section-head h2 { font-size: 22px; letter-spacing: -.02em; overflow-wrap: anywhere; hyphens: auto; }
.core-intro { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.core-intro p { margin: 6px 0 0; font-size: 14px; color: #375b6b; line-height: 1.6; }
.core-eyebrow { color: #0479a5; font-size: 11px; font-weight: 650; letter-spacing: .055em; text-transform: uppercase; }
.core-context { color: #516c79; font-size: 11px; margin: 12px 0 20px; line-height: 1.7; }
.core-chart .chart-card { box-shadow: none; border: 1px solid #deebf0; }
.core-chart .chart-head { flex-wrap: wrap; }
.core-chart .chart-tools { max-width: 100%; min-width: 0; flex: 0 1 auto; }
.core-chart .chart-titles { min-width: min(100%, 240px); flex: 1 1 260px; }
.core-chart .chart-body { height: 300px; }
.core-metric-tabs { flex-wrap: wrap; }
.core-metric-tabs .tab { min-height: 36px; }
.core-subject-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 18px 0; }
.core-subject-card { min-width: 0; display: flex; flex-direction: column; align-items: stretch; text-align: left; border: 1px solid #d6e6ec; border-radius: 14px; background: #fff; color: var(--ink); padding: 18px; cursor: pointer; transition: border-color 140ms, box-shadow 140ms; font: inherit; }
.core-subject-card:hover { border-color: #67bbdc; box-shadow: 0 3px 12px #0e56600b; }
.core-subject-card[aria-pressed="true"] { border-color: #0084b8; box-shadow: inset 0 0 0 1px #0084b8; }
.core-subject-card:focus-visible, .core-table-wrap:focus-visible { outline: 3px solid #0084b8; outline-offset: 3px; }
.core-row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; }
.core-row > span { color: var(--muted); font-size: 11px; }
.core-card-label { color: #536d79; font-size: 11px; margin-top: 19px; }
.core-card-value { color: #006d97; font-size: clamp(27px, 3cqi, 38px); line-height: 1.3; font-weight: 650; letter-spacing: -.025em; font-variant-numeric: tabular-nums; margin: 4px 0; }
.core-card-meta { color: var(--muted); font-size: 11px; min-height: 18px; }
.core-card-other { display: flex; justify-content: space-between; gap: 6px; padding-top: 14px; margin-top: 14px; border-top: 1px solid #e3edf1; color: #536d79; font-size: 12px; }
.core-card-other strong { color: #385768; }
.core-gap { margin-top: 8px; color: #627984; font-size: 11px; line-height: 1.5; }
.core-gap.positive { color: #087552; }
.core-gap.negative { color: #ad3e43; }
.core-card-link { display: flex; justify-content: space-between; font-size: 11px; color: #0477a1; margin-top: 18px; }
.core-detail { padding: 22px; box-shadow: none; border: 1px solid #deebf0; }
.core-detail-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; padding-bottom: 20px; }
.core-detail-head h3 { font-size: 22px; font-weight: 650; margin-top: 5px; }
.core-period { color: #526f7d; font-size: 12px; padding: 5px 10px; border-radius: 20px; background: #f0f7fa; }
.core-detail-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.3fr); gap: 28px; }
.core-detail-grid > *, .core-matrices > * { min-width: 0; }
.core-detail h4 { font-size: 13px; font-weight: 650; }
.core-muted { color: #617883; font-size: 11px; line-height: 1.7; margin: 6px 0 12px; }
.core-movement { margin-top: 22px; }
.core-track { display: flex; height: 12px; overflow: hidden; border-radius: 4px; margin: 10px 0; background: #edf3f5; }
.core-improved { background: #0084b8; }
.core-unchanged { background: #9db3bb; }
.core-declined { background: #cb7377; }
.core-movement-labels { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 9px; }
.core-movement-labels > span { font-size: 10px; color: #5b727d; }
.core-movement-labels i { display: inline-block; width: 7px; height: 7px; border-radius: 2px; margin-right: 4px; }
.core-movement-labels strong { color: #244755; font-weight: 600; }
.core-movement-labels small { display: block; margin: 3px 0 0 11px; font-size: 10px; }
.core-language-note { color: #536d79; font-size: 11px; line-height: 1.7; margin-top: 20px; padding: 12px; background: #f2f8fa; border-radius: 8px; }
.core-table-wrap { overflow-x: auto; max-width: 100%; }
.core-table, .core-matrix { width: 100%; border-collapse: collapse; font-size: 11px; font-variant-numeric: tabular-nums; }
.core-table caption, .core-matrix caption { text-align: left; font-weight: 600; color: #426271; font-size: 11px; padding-bottom: 10px; }
.core-table th, .core-table td { padding: 9px 8px; border-bottom: 1px solid #e7eef2; vertical-align: top; }
.core-table thead th { background: #f4f8fa; text-align: right; color: #446474; }
.core-table th:first-child { text-align: left; width: 42%; }
.core-table tbody th { font-weight: 500; color: #536d79; }
.core-table td { text-align: right; font-weight: 600; color: #204858; }
.core-table td small { display: block; font-weight: 400; color: #6d7f87; font-size: 10px; line-height: 1.5; margin-top: 3px; }
.core-transitions { margin-top: 20px; padding-top: 16px; border-top: 1px solid #e3edf1; }
.core-transitions summary { color: #366174; font-size: 12px; cursor: pointer; line-height: 1.6; }
.core-matrices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 20px; }
.core-matrices h4 { margin-bottom: 10px; }
.core-matrix th, .core-matrix td { text-align: center; padding: 9px 6px; border: 2px solid #fff; }
.core-matrix th { background: #f1f7fa; font-weight: 500; }
.core-matrix td { background: rgb(0 132 184 / var(--cell-alpha)); }
.core-method { margin-top: 16px; }
.core-loading { min-height: 430px; border-radius: 14px; }
.core-empty { padding: 28px; color: #536d79; font-size: 13px; }
@container statistics (max-width: 1000px) {
  .core-detail-grid { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .core-progress { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
  .core-progress h4, .core-progress > p { grid-column: 1 / -1; }
}
@container statistics (max-width: 650px) {
  .core-section { padding: 16px 12px; border-radius: 14px; }
  .core-section .section-head h2 { font-size: 20px; }
  .core-intro p { font-size: 12px; }
  .core-subject-cards { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .core-subject-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 12px; padding: 15px; }
  .core-subject-card .core-row { grid-column: 1 / -1; }
  .core-card-label { margin-top: 10px; }
  .core-card-value { grid-row: 2 / 4; grid-column: 2; font-size: 28px; align-self: center; }
  .core-card-other, .core-gap, .core-card-link { grid-column: 1 / -1; }
  .core-card-other { margin-top: 6px; padding-top: 9px; }
  .core-card-link { margin-top: 8px; }
  .core-detail { padding: 15px 12px; }
  .core-chart .chart-head { padding: 15px 12px; }
  .core-chart .chart-card { padding: 4px 0 12px; }
  .core-chart .chart-head { gap: 10px; }
  .core-chart .chart-tools { flex: 1 1 100%; justify-content: flex-start; }
  .core-chart .chart-head > .btn-icon { margin-left: auto; }
  .core-chart .chart-body { height: 270px; padding: 0 8px 12px; }
  .core-matrices, .core-progress { grid-template-columns: minmax(0, 1fr); }
  .core-table { min-width: 330px; }
  .core-metric-tabs { gap: 2px; }
  .core-metric-tabs .tab { font-size: 11px; padding: 7px 9px; }
}
@media (max-width: 560px) {
  .statistik .chart-tools { max-width: 100%; min-width: 0; flex: 0 1 auto; }
}
@media (prefers-reduced-motion: reduce) { .core-subject-card { transition: none; } }