/* MUMINS-specific additions to the shared publication layout. */
.mumins-lead{
  margin:30px auto 0; text-align:center; font-size:18px;
  line-height:1.7; color:var(--ink-soft);
}
.mumins-section-links{
  margin-top:24px; display:flex; flex-wrap:wrap; gap:12px 24px;
  justify-content:center; font-family:var(--mono); font-size:12px;
}
.mumins-method-figure{ padding:20px 20px 0; background:#fff; }
.mumins-method-figure figcaption{ margin:0 -20px; }
.pub-page-figure img{ background:#fff; }
.pub-page-figure > a{ display:block; cursor:zoom-in; }
.variant-table-wrap{ margin:24px 0; }
.variant-table caption{
  padding:14px; text-align:left; color:var(--ink);
  font-family:var(--mono); font-size:12px; background:var(--teal-pale);
}
.variant-table tbody th{
  padding:10px; text-align:left; font-weight:400;
  color:var(--ink-soft); border-bottom:1px solid var(--line-soft);
}
.variant-table tbody tr:last-child th{ border-bottom:none; }
.variant-table .mumins-result{ background:var(--teal-pale); }
.variant-table .mumins-result th{ font-weight:600; color:var(--teal-deep); }
.pub-page-section .mumins-note, .mumins-note{
  font-size:13px; color:var(--ink-soft); line-height:1.7;
}
#citation-status{ display:block; min-height:24px; margin-top:8px; }
/* The interactive section stays visible instead of using the reveal animation. */
.mumins-examples .eyebrow::before{ transform:scaleX(1); }
.mumins-examples p, .mumins-examples .mumins-note{
  font-size:16px; line-height:1.8;
  text-align:left; text-justify:auto; hyphens:none;
}
.mumins-case-grid{ display:grid; grid-template-columns:1fr; gap:28px; margin:28px 0; align-items:start; }
.mumins-case{ min-width:0; }
.mumins-case-header{ min-height:0; }
.mumins-examples .mumins-case-header h3{ margin:0 0 6px; }
.mumins-case-header p{ margin:0 0 12px; }
.mumins-case .mumins-oasis-note{ margin:12px 0 0; }
.mumins-live-viewer{
  --viewer-ink:#dbe7ea; --viewer-muted:#9aaeb7;
  margin:0; border:1px solid #2c404a; border-radius:14px;
  scroll-margin-top:12px;
  overflow:hidden; background:#101a22; color:var(--viewer-ink);
}
/* Two panels match the CT viewer's five columns, including borders and gaps.
   The minimum follows the CT grid's 640px scrolling width on small screens. */
.mumins-prediction-viewer{ width:max(257.4px, calc(40% + 0.6px)); max-width:100%; }
.mumins-prediction-viewer .mumins-viewer-toolbar{ display:flex; flex-wrap:wrap; }
.mumins-prediction-viewer .mumins-case-summary{ width:100%; }
.mumins-viewer-toolbar{
  display:grid; grid-template-columns:1fr auto; align-items:center;
  gap:12px; padding:14px 12px; border-bottom:1px solid #2c404a;
}
.mumins-case-summary{ grid-column:1 / -1; font-family:var(--mono); font-size:11px; }
.mumins-setting{
  display:inline-block; margin-left:8px; border:1px solid #386473;
  border-radius:4px; padding:3px 7px; color:#8be2e9;
}
.mumins-plane-control{ display:flex; align-items:center; gap:8px; font-size:12px; }
.mumins-plane{ width:112px; min-width:0; background:#172731; color:var(--viewer-ink); border:1px solid #3d5663; border-radius:6px; padding:6px 8px; }
.mumins-zoom-controls{ display:flex; gap:5px; }
.mumins-live-viewer button{
  color:var(--viewer-ink); background:#1b303c; border:1px solid #3d5663;
  border-radius:6px; padding:6px 10px; font:inherit; font-size:12px; cursor:pointer;
}
.mumins-live-viewer button:hover{ background:#244553; border-color:#67c5d3; }
.mumins-live-viewer button:disabled, .mumins-live-viewer select:disabled{ opacity:0.45; cursor:default; }
.mumins-panel-strip{ overflow-x:auto; overscroll-behavior-x:contain; }
.mumins-panel-strip:focus-visible{ outline:2px solid #69d2df; outline-offset:-2px; }
.mumins-slice-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; background:#2c404a; }
.mumins-live-viewer:not(.mumins-prediction-viewer) .mumins-slice-grid{ min-width:640px; }
.mumins-prediction-viewer .mumins-slice-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.mumins-mobile-hint{ display:none; padding:8px 12px 0; font-size:11px; color:var(--viewer-muted); }
.mumins-slice-panel{ margin:0; min-width:0; background:#080e13; }
.mumins-slice-panel figcaption{
  padding:9px 5px; text-align:center; font-family:var(--mono);
  font-size:10px; background:#14242e; min-height:38px;
  display:flex; align-items:center; justify-content:center; line-height:1.3;
}
.mumins-image-area{
  position:relative; overflow:hidden; aspect-ratio:var(--physical-aspect,1);
  background:#000;
}
.mumins-view-image{ width:100%; height:100%; transform-origin:center; will-change:transform; }
.mumins-view-image img{ display:block; width:100%; height:100%; pointer-events:none; user-select:none; }
.mumins-playback-controls{ display:flex; gap:12px; align-items:center; padding:15px 18px 12px; }
.mumins-play{ min-width:84px; }
.mumins-slice-slider{ min-width:0; flex:1; accent-color:#69d2df; cursor:pointer; }
.mumins-frame-count{ font-family:var(--mono); font-size:11px; min-width:66px; text-align:right; }
.mumins-color-keys{ display:flex; gap:32px; justify-content:flex-end; padding:3px 18px 12px; }
.mumins-color-key{ width:180px; max-width:45%; font-family:var(--mono); font-size:10px; color:var(--viewer-muted); }
.mumins-color-key > img{ display:block; width:100%; height:7px; margin:5px 0 3px; border-radius:2px; }
/* Hide numeric labels if an older copy of the page is still cached. */
.mumins-color-key .mumins-color-limits{ display:none; }
.mumins-viewer-footer{
  padding:10px 18px; border-top:1px solid #2c404a; display:flex; flex-wrap:wrap;
  align-items:center; justify-content:space-between; gap:5px 12px;
  font-family:var(--mono); font-size:10px; line-height:1.7; color:var(--viewer-muted);
}
.mumins-load-status{ color:#ffc38a; }
.mumins-sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:760px){
  .mumins-method-figure{ padding:10px 10px 0; }
  .mumins-method-figure figcaption{ margin:0 -10px; }
  .mumins-mobile-hint{ display:block; }
  .mumins-viewer-toolbar{ padding:12px; gap:10px; }
  .mumins-case-summary{ width:100%; }
  .mumins-slice-panel figcaption{
    font-size:9px; line-height:1.3; height:40px; padding:5px;
    display:flex; align-items:center; justify-content:center; white-space:normal;
  }
  .mumins-playback-controls{ padding:12px; gap:8px; }
  .mumins-play{ min-width:76px; }
  .mumins-frame-count{ min-width:58px; font-size:10px; }
  .mumins-color-keys{ padding:2px 12px 12px; gap:20px; justify-content:space-between; }
  .mumins-viewer-footer{ padding:10px 12px; }
}
@media (max-width:400px){
  .mumins-plane-control{ grid-column:1 / -1; }
  .mumins-zoom-controls{ grid-column:1 / -1; }
}
