/* Admincentret, sidgrupp 3: bara det sidorna behöver utöver kitet (admin-ui.css). Laddas av base.html.
   Bibliotek (mx-), Nivåmallar (lv-page), Ordbok (ob-) och Kalkylstatistik (ks-). Kitets tokens (--adm-*) överallt. */

/* Ordbokens rader fälls ut som kitets adm-fold (sammanfattningen utan markör). */
.ob-row > details > summary { list-style: none; cursor: pointer; }
.ob-row > details > summary::-webkit-details-marker { display: none; }

/* adm-page är ett rutnät: barnen får inte tänja kolumnen till sitt innehålls bredd (rutnät, tabeller som rullar). */
.lv-page > *, .mx-lib > *, .mx-panel > *, .ks-page > *, .ob > * { min-width: 0; }

/* ── Ordbok ───────────────────────────────────────────────────────────────────────────────────────────────── */
.ob-results { display: grid; gap: 12px; }
.ob-group .adm-card__head { min-height: 46px; padding-top: 9px; padding-bottom: 9px; }
.ob-group .adm-card__head h2 { font-size: 17px; }
.ob-row { margin: 0; border-bottom: 1px solid var(--adm-soft); }
.ob-row:last-child { border-bottom: 0; }
.ob-row__head { display: grid; grid-template-columns: minmax(12rem, 1.1fr) minmax(0, 1.6fr) 20px; align-items: center; gap: 4px 14px;
  min-height: 48px; padding: 8px 14px 8px 18px; transition: background-color 140ms; }
.ob-row__head:hover { background: rgb(255 255 255 / 72%); }
.ob-row__head:focus-visible { outline: 2px solid var(--adm-green); outline-offset: -2px; }
.ob-row__name { min-width: 0; }
.ob-row__name b { display: block; overflow: hidden; font-size: 13.5px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.ob-row__name small { display: block; overflow: hidden; color: var(--adm-mut); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.ob-sum { display: flex; align-items: baseline; gap: 4px 10px; min-width: 0; color: var(--adm-ink); font-size: 13px; }
.ob-count { flex: none; color: var(--adm-deep); font-weight: 500; font-variant-numeric: tabular-nums; }
.ob-count.is-empty { color: var(--adm-mut); font-weight: 400; }
.ob-preview { flex: 0 1 auto; min-width: 0; overflow: hidden; color: #35443b; text-overflow: ellipsis; white-space: nowrap; }
.ob-preview small, .ob-optcount { color: var(--adm-mut); font-size: 12px; white-space: nowrap; }
.ob-ok { display: inline-flex; flex: none; align-items: center; gap: 2px; margin-left: auto; color: var(--adm-green); font-size: 12px; white-space: nowrap; }
.ob-ok i, .ob-added i { font-size: 15px; }
.ob-row__chev { color: #7f8b83; font-size: 20px; transition: transform 140ms; }
.ob-row > details[open] .ob-row__chev { transform: rotate(180deg); }
.ob-row > details[open] > summary { background: rgb(255 255 255 / 55%); }
.ob-row__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 14px 18px; padding: 4px 18px 18px; background: rgb(255 255 255 / 55%); }
.ob-row__body:has(> :only-child) { grid-template-columns: minmax(0, 36rem); }
.ob-words textarea { min-height: 96px; line-height: 1.5; }
.ob-options { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); align-content: start; gap: 10px 12px; }
.ob-options__l { grid-column: 1 / -1; margin: 0; color: #3f4b43; font-size: 12.5px; font-weight: 500; }
.ob-options__l small, .ob-words > span small { color: var(--adm-mut); font-weight: 400; }
.ob-option > span small { margin-left: 4px; color: var(--adm-mut); font-weight: 400; }
.ob-cands > summary { list-style: none; cursor: pointer; border-bottom: 0; }
.ob-cands > summary::-webkit-details-marker { display: none; }
.ob-cands[open] > summary { border-bottom: 1px solid var(--adm-soft); }
.ob-cands h2 small { color: var(--adm-mut); font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 12.5px; }
.ob-cands .adm-rows { max-height: 22rem; overflow-y: auto; }
.ob-added { display: inline-flex; align-items: center; gap: 2px; color: var(--adm-green); font-size: 12.5px; }
.htmx-request .ob-sum, .ob-row.htmx-request .ob-sum { opacity: .65; }
@media (max-width: 760px) {
  .ob-row__head { grid-template-columns: minmax(0, 1fr) 20px; padding: 10px 12px 10px 14px; }
  .ob-sum { grid-column: 1; grid-row: 2; margin-top: 2px; }
  .ob-optcount { display: none; }
  .ob-row__chev { grid-column: 2; grid-row: 1 / span 2; }
  .ob-row__body { grid-template-columns: minmax(0, 1fr); padding: 4px 14px 16px; }
  .ob-ok { margin-left: 0; }
}

/* ── Kalkylstatistik ──────────────────────────────────────────────────────────────────────────────────────── */
.ks-page { font-variant-numeric: tabular-nums; }
.ks-main { gap: 14px; }
.ks-note { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; margin: 0; color: var(--adm-mut); font-size: 12.5px; line-height: 1.5; }
/* Verktygsraden på en rad: rumstypernas chips tar det som blir över (rullar och tonas ut), perioden och Filter till höger. */
.ks-toolbar { flex-wrap: nowrap; }
.ks-toolbar .ks-types { flex: 1 1 auto; min-width: 0; }
.ks-toolbar .adm-toolbar__end { flex: none; }
.ks-period .adm-select { max-width: 13rem; }
.ks-card .ks-segs { align-items: center; }
.ks-segs__tip { display: inline-flex; margin-left: auto; padding-left: 8px; }
.ks-head-tip { display: inline-flex; align-items: center; justify-content: flex-end; gap: 2px; }
.ks-head-tip .adm-tip__btn { width: 20px; height: 20px; }
.ks-others > summary { list-style: none; cursor: pointer; }
.ks-others > summary::-webkit-details-marker { display: none; }
.ks-others > summary h3 { font-size: 16px; }
.ks-others > summary h3 small { color: var(--adm-mut); font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: 12.5px; }
.ks-others > summary .material-symbols-outlined { color: #7f8b83; transition: transform 140ms; }
.ks-others[open] > summary .material-symbols-outlined { transform: rotate(180deg); }
.ks-others[open] > summary { border-bottom: 1px solid var(--adm-soft); }
.ks-others .ks-events > li { opacity: .9; }
@media (min-width: 641px) { .ks-pop { width: min(360px, calc(100vw - 32px)); } }
.ks-pop__fields { display: grid; gap: 12px; }
.adm-pop.is-kept { animation: none; }
.ks-types .adm-chip.is-empty:not([aria-current]) { color: var(--adm-mut); }
.ks-card .ks-segs { padding: 0 12px; border-bottom-color: var(--adm-soft); }
.ks-card .ks-segs small { margin-left: 2px; }
.ks-table .adm-td small { font-size: 12px; }
.ks-table .adm-td small.ks-inline { display: inline; margin-left: 4px; }
.ks-table--added { --cols: minmax(0, 2.2fr) minmax(5.5rem, .7fr) minmax(8rem, 1fr) minmax(0, .9fr); }
.ks-table--removed { --cols: minmax(0, 2fr) minmax(5.5rem, .7fr) minmax(0, 1.1fr) minmax(8rem, .9fr); }
.ks-table--choices { --cols: minmax(0, 2fr) minmax(5.5rem, .6fr) minmax(0, 1.6fr); }
.ks-table--hours, .ks-table--price { --cols: minmax(0, 2fr) minmax(5.5rem, .7fr) minmax(0, 1.3fr) minmax(4.5rem, .5fr); }
.ks-table--material { --cols: minmax(0, 1.8fr) minmax(5rem, .6fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .8fr); }
.ks-table--logg { --cols: minmax(7.5rem, .8fr) minmax(0, 1.1fr) minmax(0, 1.5fr) minmax(0, 1.2fr) minmax(6.5rem, .7fr); }
.ks-when > span { display: block; color: var(--adm-ink); }
.ks-change { color: var(--adm-ink); }
.ks-change i { color: var(--adm-mut); font-style: normal; }
.ks-table .adm-td--meta > span:first-child:not(.adm-td__l) { display: block; overflow: hidden; text-overflow: ellipsis; }
.ks-more-row { justify-content: center; }
/* Panelen (kitets sidopanel): händelserna som rader i ett kort, effekten till höger. */
.ks-events { margin: 0; padding: 0; list-style: none; }
.ks-events > li { flex-wrap: nowrap; align-items: flex-start; }
.ks-events .adm-rows__main > b { font-weight: 500; }
.ks-events .ks-change { display: inline; font-weight: 400; }
.ks-events__link { display: inline-block; margin-top: 3px; color: var(--adm-green); font-size: 12.5px; text-decoration: underline; text-decoration-color: rgb(31 107 79 / 30%); text-underline-offset: 2px; }
.ks-events__link:hover { color: var(--adm-green-hover); text-decoration-color: currentColor; }
.ks-events .adm-rows__main > b .ks-events__link { margin: 0; font-size: inherit; }
.ks-events__effect { flex: none; padding-top: 1px; color: var(--adm-deep); font-size: 13px; white-space: nowrap; }
.ks-pass .adm-card__head { min-height: 46px; padding-top: 10px; padding-bottom: 10px; }
.ks-pass .adm-card__head h3 { font-size: 17px; }
@container adm-page (max-width: 760px) {
  .ks-toolbar { flex-wrap: wrap; }
  .ks-toolbar .ks-types { flex-basis: 100%; order: 2; }
  .ks-toolbar .adm-toolbar__end { flex: 1 1 auto; margin-left: 0; }
  .ks-toolbar .ks-period { flex: 1 1 auto; }
  .ks-toolbar .ks-period .adm-select { width: 100%; max-width: none; }
}
@media (max-width: 640px) {
  .ks-toolbar .adm-toolbar__end { width: auto; margin-left: 0; }
  .ks-tiles > li:nth-child(3) { grid-column: 1 / -1; border-left: 0 !important; border-top: 1px solid var(--adm-soft); }
  .ks-card .ks-segs { padding: 0 6px; }
  .ks-table .adm-td--meta { font-size: 12.5px; }
  .ks-table--logg .ks-when { order: 3; }
  .ks-table .adm-td--meta { flex-basis: 100%; }
  .ks-table .adm-td--meta > small, .ks-table .adm-td--meta > span { display: block; }
  .ks-table .adm-td--meta > span + small::before { content: none; }
  .ks-table .adm-td--meta.ks-change:empty { display: none; }
}

/* ── Nivåmallar (blueprints/level_templates): rutnätet är verktyget; kitets flikar, verktygsrad, kort och popover. ── */
.lv-page .lv { gap: 14px; }
.lv-page .lv.htmx-request { opacity: 1; }
.lv-page .lv.htmx-request .lv-scroll { opacity: .7; transition: opacity 140ms; }
.lv-page .lv-spaces { flex-wrap: nowrap; gap: 6px; }
.lv-page .lv-spaces a { padding: 0 10px; border-radius: 0; background: none; color: var(--adm-mut); font-size: 13.5px; }
.lv-page .lv-spaces a:hover { background: none; color: var(--adm-ink); }
.lv-page .lv-spaces a.is-active { background: none; color: var(--adm-deep); }
/* «+ Moment»: sökrutan och träffarna i en popover (bottenark på mobil); träffarna i flödet under sökrutan. */
.lv-page .lv-toolbar { flex-wrap: nowrap; }
@media (min-width: 641px) { .lv-page .lv-add__pop { right: 0; left: auto; width: min(560px, calc(100vw - 32px)); } }
.lv-page .lv-add__pop .adm-search { width: 100%; max-width: none; }
.lv-page .lv-add__pop .lv-hits { position: static; margin-top: 10px; }
.lv-page .lv-add__pop .lv-hits:empty { display: none; }
.lv-page .lv-hitlist, .lv-page .lv-hits-empty { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.lv-page .lv-hits-empty { padding: 4px 2px; color: var(--adm-mut); font-size: 12.5px; }
.lv-page .lv-hitlist { max-height: min(360px, 50dvh); margin: 0 -6px; }
.lv-page .lv-hitlist li { gap: 10px; padding: 8px 10px; border-radius: 14px; }
.lv-page .lv-hitlist li:hover { background: rgb(255 255 255 / 80%); }
.lv-page .lv-hitlist b { color: var(--adm-ink); font-size: 13.5px; }
.lv-page .lv-hitlist small { display: block; color: var(--adm-mut); font-size: 12px; }
.lv-page .lv-hit-add { flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.lv-page .lv-hit-add .adm-btn { height: 28px; padding: 0 10px 0 7px; gap: 2px; font-size: 12px; }
.lv-page .lv-hit-add .adm-btn .material-symbols-outlined { position: static; color: inherit; font-size: 16px; transform: none; }
/* Historiken: senaste ändringen som statuspill; popovern listar de senaste med Ångra på den översta. */
.lv-page .lv-history .adm-status__value { max-width: 22rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (min-width: 641px) { .lv-page .lv-history__pop { width: min(420px, calc(100vw - 32px)); } }
.lv-page .lv-error { margin: 0; }
/* Rutnätet i ett glaskort; de klistrade rubrikerna och namnkolumnen får papperets ton så att de täcker det som rullar under. */
.lv-page .lv-scroll { border: 1px solid var(--adm-glass-edge); border-radius: 20px; background: var(--adm-glass); box-shadow: var(--adm-lift); }
.lv-page .mall-head, .lv-page .mall-m, .lv-page .lv-foot, .lv-page .mall-g > b { background: #fbfaf6; }
.lv-page .mall-head { border-bottom-color: var(--adm-soft); }
.lv-page .mall-head > b { color: var(--adm-deep); font-family: var(--adm-serif); font-size: 19px; font-weight: 400; }
.lv-page .mall-head.corner { color: var(--adm-mut); font-size: 12px; }
.lv-page .mall-g { color: var(--adm-green); font-weight: 600; }
.lv-page .mall-g span { color: var(--adm-mut); font-weight: 400; }
.lv-page .mall-m, .lv-page .mcell { border-color: var(--adm-soft); }
.lv-page .mall-m b { color: var(--adm-ink); }
.lv-page .mcell.added { background: color-mix(in srgb, var(--adm-green-soft) 80%, transparent); }
.lv-page .mcell.changed { background: color-mix(in srgb, var(--adm-warn-bg) 85%, transparent); }
.lv-page .mcell i { font-size: 11px; }
.lv-page .mcell small { color: var(--adm-mut); }
.lv-page .mall-chip.is-warn { background: var(--adm-warn-bg); color: var(--adm-warn); }
/* Hela cellen är knappen (växlar momentet i nivån); valen öppnas med ⌄ uppe till höger, bara när det finns något att välja. */
.lv-page .lv-cell { position: relative; justify-content: flex-start; gap: 0; padding: 0; }
.lv-page .lv-cell .lv-row { display: block; margin: 0; }
.lv-page .lv-hit { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 46px; padding: 9px 12px; border: 0; background: none;
  color: inherit; font: inherit; font-size: 13px; text-align: left; cursor: pointer; transition: background-color 140ms; }
.lv-page .lv-cell:has(> .lv-more) .lv-hit { padding-right: 46px; }
.lv-page .lv-hit:hover { background: rgb(255 255 255 / 62%); }
.lv-page .lv-hit:focus-visible { outline: 2px solid var(--adm-green); outline-offset: -2px; border-radius: 4px; }
.lv-page .lv-tg { border-color: rgb(18 56 43 / 18%); background: #fff; color: var(--adm-mut); transition: background-color 140ms, border-color 140ms, color 140ms; }
.lv-page .lv-hit:hover .lv-tg { border-color: var(--adm-green); color: var(--adm-green); }
.lv-page .lv-tg.is-on, .lv-page .lv-hit:hover .lv-tg.is-on { border-color: var(--adm-deep); background: var(--adm-deep); color: #fff; }
.lv-page .mcell.off .lv-sum, .lv-page .mcell.same .lv-sum { color: var(--adm-mut); }
.lv-page .lv-more { position: static; }
.lv-page .lv-more summary { position: absolute; top: 9px; right: 8px; display: inline-flex; align-items: center; justify-content: center; gap: 0; min-width: 28px; height: 28px;
  margin: 0; padding: 0 4px; border-radius: 999px; color: var(--adm-green); font-size: 12px; font-variant-numeric: tabular-nums; }
.lv-page .lv-more summary .material-symbols-outlined { font-size: 18px; transition: transform 140ms; }
.lv-page .lv-more[open] summary .material-symbols-outlined { transform: rotate(180deg); }
.lv-page .lv-more summary:hover, .lv-page .lv-more[open] summary { background: var(--adm-soft); color: var(--adm-deep); }
.lv-page .lv-more summary:focus-visible { outline: 2px solid var(--adm-green); outline-offset: 1px; }
.lv-page .lv-cell .lv-cell-error { margin: 0; padding: 0 12px 8px; }
/* Cellens val: kitets popover (papper, glaskant, radie 20) under knappen, i flödet så att den aldrig klipps av rutnätet. */
.lv-page .lv-pop { gap: 10px; width: auto; margin: 0 8px 8px; padding: 12px; border: 1px solid var(--adm-glass-edge); border-radius: 18px;
  background: var(--adm-paper-grain), linear-gradient(180deg, #fdfcf8, #f8f7f1); box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgb(20 30 25 / 6%), 0 18px 36px -22px rgb(18 56 43 / 45%);
  animation: adm-pop-in 150ms ease-out; }
.lv-page .lv-pop .adm-field > span { font-size: 12px; }
.lv-page .lv-pop select { max-width: none; min-height: 34px; padding: 0 10px; border: 1px solid var(--adm-field-line); border-radius: 12px; font-size: 13px; }
.lv-page .lv-cell-error { color: var(--adm-bad); font-size: 12px; }
.lv-page .lv-foot { border-top: 1px solid var(--adm-line); }
.lv-page .lv-total b { color: var(--adm-deep); font-family: var(--adm-serif); font-size: 19px; font-weight: 400; }
.lv-page .lv-total.is-error b { color: var(--adm-warn); font-family: inherit; font-size: 13px; font-weight: 500; }
.lv-page .lv-skel { background: linear-gradient(90deg, #ecebe4 0%, #f7f6f1 50%, #ecebe4 100%); background-size: 200% 100%; animation: adm-skel 1.2s ease-in-out infinite; }
.lv-page .mall-head.corner .adm-tip { margin-left: 2px; }
.lv-page .mall-head.corner > span { display: inline-flex; align-items: center; gap: 2px; }
@media (max-width: 640px) {
  .lv-page .lv-history { min-width: 0; flex: 1 1 auto; }
  .lv-page .lv-history .adm-status { max-width: 100%; }
  .lv-page .lv-history .adm-status__value { max-width: none; min-width: 0; }
  .lv-page .lv-history .adm-status__label { display: none; }
  .lv-page .lv-hit { min-height: 52px; }
}
@media (prefers-reduced-motion: reduce) { .lv-page .lv-pop, .lv-page .lv-skel { animation: none; } }

/* ── Bibliotek (blueprints/matrix.html): flikar, verktygsrad, listor i kort och redigeraren som stor dialog. ──────
   Laddas också för abonnenter utan adminskalet (base.html laddar filen överallt). */
.mx-lib { max-width: 100rem; padding-bottom: 40px; }
.mx-lib .mx-tabs { margin-top: -4px; }
.mx-lib .mx-panel { gap: 10px; }
.mx-toolbar .adm-toolbar__end { flex-wrap: wrap; justify-content: flex-end; }
@media (min-width: 641px) { .mx-pop { width: min(560px, calc(100vw - 32px)); } }
.mx-pop .adm-fields { gap: 12px 14px; }
.mx-status { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; min-height: 28px; }
.mx-status .adm-active { flex: 1 1 auto; }
.mx-status__count { margin-left: auto; color: var(--adm-mut); font-size: 12.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Momentlistan (projects/partials/calculation_ui_list.html) byter sin räknare OOB med egen stil: id slår klasserna. */
.mx-lib #matrix-moment-count { display: flex; justify-content: flex-end; min-height: 28px; padding: 0; border: 0; background: none; }
.mx-lib #matrix-moment-count > span { color: var(--adm-mut); font-size: 12.5px; }
/* Momentlistan (projects/partials/calculation_ui_list.html): yrkesgrupp och sektion som lugna rader i meningsform, raden i
   listans stil. Publicerad/Ändrad som pill; «Ej i någon mall» är chipset i verktygsraden, inte text på varje rad. */
.mx-mtable { --cols: minmax(14rem, 1.6fr) minmax(8rem, 1fr) 4.5rem minmax(9rem, 1fr) 18px; }
.mx-mgroup { padding: 14px 18px 6px; border-bottom: 1px solid var(--adm-soft); color: var(--adm-deep); font-family: var(--adm-serif); font-size: 17px; }
.mx-msection { padding: 10px 18px 4px; color: var(--adm-mut); font-size: 12px; font-weight: 500; }
.mx-mrow { cursor: pointer; transition: background-color 140ms; }
.mx-mrow.is-saved { background: color-mix(in srgb, var(--adm-green-soft) 70%, transparent); }
.mx-mrow__go { color: #7f8b83; font-size: 18px; }
.mx-mrow:hover .mx-mrow__go { color: var(--adm-green); }
.mx-mtable .adm-pill { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.mx-moments__pick { display: grid; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--adm-soft); }
.mx-moments__pick p { margin: 0; color: #3f4b43; font-size: 13px; }
.mx-moments__pick b { font-weight: 500; }
.mx-moments__pick .adm-search { max-width: none; }
@media (max-width: 640px) {
  .mx-mrow .mx-mrow__go { order: 1; margin-left: auto; }
  .mx-mgroup { padding: 12px 14px 6px; }
  .mx-msection { padding: 8px 14px 4px; }
}
.mx-lib .text-\[0\.58rem\], .mx-lib .text-\[0\.6rem\], .mx-lib .text-\[0\.62rem\], .mx-lib .text-\[0\.64rem\], .mx-lib .text-\[0\.66rem\],
.mx-lib .text-\[0\.67rem\], .mx-lib .text-\[0\.68rem\] { font-size: 11px; }
.mx-loading { padding: 18px; }
.mx-loading .material-symbols-outlined { animation: none; }

/* Verktygsraden: sök · Aktiva/Inaktiva/Alla (radioknappar som chips) · Filter · sortering · AI-utkast · Ny post. */
.mx-toolbar .adm-search { flex: 1 1 220px; max-width: 420px; }
.mx-chips { flex: 0 1 auto; min-width: 0; }
.mx-drafts { color: var(--adm-mut); }
.mx-drafts:hover { color: var(--adm-deep); }

/* Postlistan: markering · post · moment · timmar · material · status (bara när posten inte är aktiv). Hela raden (utom
   markeringen) öppnar redigeraren. Kryssrutan syns vid hover, fokus och när den är satt (alltid på pekskärm). */
.mx-posts { --mx-cols: minmax(14rem, 1.7fr) minmax(10rem, 1fr) minmax(6.5rem, .45fr) minmax(7rem, .5fr) minmax(5.5rem, .4fr); }
.mx-rate { white-space: nowrap; }
.mx-rate.is-quiet { color: var(--adm-mut); }
.mx-check input { opacity: 0; transition: opacity 140ms; }
.mx-row:hover .mx-check input, .mx-row:focus-within .mx-check input, .mx-check input:checked { opacity: 1; }
@media (hover: none) { .mx-check input { opacity: 1; } }
.mx-posts .adm-table__head { grid-template-columns: 36px var(--mx-cols); padding-left: 8px; }
.mx-row { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; column-gap: 12px; padding-left: 8px;
  border-bottom: 1px solid var(--adm-soft); transition: background-color 140ms; }
.mx-row:last-child { border-bottom: 0; }
.mx-row:hover { background: rgb(255 255 255 / 72%); }
.mx-row:has([data-post-check]:checked) { background: color-mix(in srgb, var(--adm-green-soft) 55%, transparent); }
.mx-check { display: grid; place-items: center; width: 36px; height: 44px; cursor: pointer; }
.mx-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--adm-deep); cursor: pointer; }
.mx-open { display: grid; grid-template-columns: var(--mx-cols); align-items: center; column-gap: 12px; width: 100%; min-height: 52px; padding: 7px 18px 7px 0;
  border: 0; background: none; color: inherit; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.mx-open:focus-visible { outline: 2px solid var(--adm-green); outline-offset: -2px; border-radius: 10px; }
.mx-open .adm-td--title b { display: block; overflow: hidden; text-overflow: ellipsis; }
.mx-line { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-id { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11.5px !important; }
.mx-sm-meta, .mx-sm-inline { display: none !important; }
.mx-state { display: grid; justify-items: end; gap: 2px; }
.mx-state small { color: var(--adm-mut); font-size: 12px; }
/* Basvärden och historik. */
.mx-base { --cols: minmax(0, 1.6fr) minmax(7rem, .7fr) minmax(6rem, .6fr) minmax(0, 1fr) minmax(6rem, .5fr); }
button.adm-table__row { width: 100%; border: 0; border-bottom: 1px solid var(--adm-soft); background: none; font: inherit; font-size: 13px; text-align: left; }
button.adm-table__row:hover, button.adm-table__row:focus-visible { background: rgb(255 255 255 / 72%); }
button.adm-table__row:focus-visible { outline: 2px solid var(--adm-green); outline-offset: -2px; }
.mx-notice { margin: 0; border-radius: 0; }
.mx-history > li { align-items: flex-start; }
.mx-history > li:only-child:has(> .adm-empty) { padding: 0; }
.mx-history__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0 0 6px; color: var(--adm-mut); font-size: 12px; }
.mx-num { font-variant-numeric: tabular-nums; }
.mx-history__actions { display: flex; flex: none; gap: 6px; }
.mx-diff { margin-top: 8px; }
.mx-diff > summary { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; background: var(--adm-soft); color: #35443b; font-size: 12px; }
.mx-diff > summary:hover, .mx-diff[open] > summary { background: rgb(18 56 43 / 11%); }
.mx-diff dl { display: grid; gap: 6px; margin: 10px 0 0; }
.mx-diff dl > div { display: grid; grid-template-columns: minmax(8rem, 12rem) minmax(0, 1fr); gap: 10px; font-size: 12.5px; }
.mx-diff dt { color: #3f4b43; font-weight: 500; }
.mx-diff dd { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin: 0; min-width: 0; color: var(--adm-mut); }
.mx-diff code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; overflow-wrap: anywhere; }
.mx-diff code.is-new { color: var(--adm-ink); }
@media (max-width: 1023px) {
  .mx-posts .adm-table__head { display: none; }
  .mx-open { grid-template-columns: minmax(0, 1fr) max-content; min-height: 58px; padding-right: 14px; }
  .mx-open .mx-state { max-width: none; overflow: visible; margin-left: 0; justify-items: end; }
  .mx-open .mx-col { display: none; }
  .mx-sm-meta { display: block !important; }
}
@media (max-width: 640px) {
  .mx-row { padding-left: 4px; column-gap: 6px; }
  .mx-drafts__l { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .mx-drafts { width: 44px; padding: 0; justify-content: center; }
  .mx-toolbar .adm-search { flex-basis: 100%; max-width: none; }
  .mx-chips { flex-basis: 100%; }
  /* Mobil: sök · chips · en rad med Filter, sortering/urval och huvudknappen. */
  .mx-toolbar .adm-search { order: 1; }
  .mx-toolbar .mx-chips { order: 2; }
  .mx-toolbar .adm-toolbar__end { order: 3; width: 100%; flex-wrap: wrap; justify-content: flex-start; }
  .mx-toolbar .adm-toolbar__end > .adm-btn, .mx-toolbar .adm-toolbar__end > .adm-filter { flex: none; }
  .mx-toolbar .adm-toolbar__end > .adm-select { flex: 1 1 8rem; width: auto; min-width: 0; }
  .mx-toolbar .adm-sort { flex: 1 1 6rem; min-width: 0; }
  .mx-toolbar .adm-sort .adm-select { width: 100%; min-width: 0; }
  .mx-toolbar .adm-sort > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .mx-toolbar .adm-toolbar__end > .mx-iconbtn { flex: none; }
  .mx-sm-inline { display: block !important; }
  .mx-history > li { flex-direction: column; }
  .mx-diff dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .mx-status__count { margin-left: 0; }
}

/* Redigeraren: kitets dialog i stort format – papper med korn, radie 24, huvud med Newsreader-rubrik, fot med åtgärderna. */
.matrix-dialog.mx-dialog { border: 0; border-radius: 24px; background: var(--adm-paper-grain), var(--adm-paper); color: var(--adm-ink);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 85%), 0 30px 70px -24px rgb(18 56 43 / 50%); }
.matrix-dialog.mx-dialog::backdrop { background: rgb(18 40 32 / 28%); }
.matrix-dialog.mx-dialog[open] { animation: zimla-mx-in 160ms var(--adm-ease); }
@keyframes zimla-mx-in { from { opacity: 0; transform: translateY(6px) scale(.995); } }
.mx-dialog__frame { position: relative; display: flex; flex-direction: column; width: 100%; height: 100%; overflow: hidden; }
.mx-dialog__head { display: flex; flex: none; align-items: center; gap: 6px; min-height: 64px; padding: 12px 14px 12px 24px; border-bottom: 1px solid var(--adm-soft); }
.mx-dialog__head > .adm-btn:first-child { margin-left: -10px; }
.mx-dialog__head h2 { flex: 1 1 auto; min-width: 0; margin: 0; overflow: hidden; color: var(--adm-deep); font-family: var(--adm-serif); font-size: 24px; font-weight: 400;
  line-height: 1.2; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
.mx-dialog__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; background: rgb(255 255 255 / 38%); }
/* Kort innehåll: formuläret fyller dialogen så att foten står i botten, inte mitt i. */
.mx-dialog__body { display: flex; flex-direction: column; }
.mx-dialog__body > * { flex: none; }
.mx-dialog__body > form { display: flex; flex: 1 0 auto; flex-direction: column; }
.mx-dialog__body > form > .mx-foot { margin-top: auto; }
.mx-dialog__body > form > :nth-last-child(2) { margin-bottom: 20px; }
.mx-dialog__confirm { display: flex; flex: none; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 24px; background: var(--adm-warn-bg); color: var(--adm-warn); font-size: 13px; }
.mx-dialog__confirm p { flex: 1 1 14rem; margin: 0; }
.mx-dialog__layer { position: absolute; inset: 0; z-index: 20; display: flex; flex-direction: column; background: var(--adm-paper-grain), var(--adm-paper); }
.mx-foot { position: sticky; bottom: 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px;
  margin: 20px -16px -16px; padding: 12px 16px; padding-bottom: calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--adm-soft);
  background: rgb(246 245 239 / 92%); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.mx-foot__end { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.mx-foot__primary { margin-left: auto; }
.mx-foot__state { display: inline-flex; align-items: center; gap: 2px; color: var(--adm-green); font-size: 12.5px; }
.mx-foot__state .material-symbols-outlined { font-size: 16px; }
.mx-foot__state.is-dirty { color: var(--adm-warn); }
.mx-foot__note { flex: 1 1 16rem; margin: 0; color: var(--adm-mut); font-size: 12.5px; }
@media (min-width: 640px) { .mx-foot { margin: 20px -24px -24px; padding-left: 24px; padding-right: 24px; } }
/* Fälten i redigeraren i kitets form: vita, rundade 12, grön fokusring. */
.mx-dialog .matrix-form-control { border-color: var(--adm-field-line); border-radius: 12px; color: var(--adm-ink); }
.mx-dialog .matrix-form-control:focus { border-color: var(--adm-green); box-shadow: var(--adm-ring); outline: none; }
@media (max-width: 639px) {
  .matrix-dialog.mx-dialog { border-radius: 0; box-shadow: none; }
  .mx-dialog__head { min-height: 56px; padding: 8px 8px 8px 16px; padding-top: calc(8px + env(safe-area-inset-top)); }
  .mx-dialog__head h2 { font-size: 21px; }
  .mx-foot .adm-btn { height: 44px; }
  .mx-foot { flex-wrap: nowrap; }
  .mx-foot__state { display: none !important; }
}
@media (prefers-reduced-motion: reduce) { .matrix-dialog.mx-dialog[open] { animation: none; } button.adm-table__row, .mx-row, .mx-check input { transition: none; } }
.mx-rate-warn { display: flex; align-items: flex-start; gap: 8px; margin: 0; }
.mx-rate-warn .material-symbols-outlined { flex: none; font-size: 18px; }
.ob-cands__lead { margin: 0; padding: 10px 18px 0; color: var(--adm-mut); font-size: 12.5px; }
.ob-cands__chev { color: #7f8b83; transition: transform 140ms; }
.ob-cands[open] .ob-cands__chev { transform: rotate(180deg); }