/* ============================================================================
   Nya myceon — Samtal och Meddelanden, utan kolumn (okt 2026, admin docs/NYA-MYCEON.md, skissen D)
   ============================================================================
   Gäller bara när personen valt det (<html data-nya>, js/myceon-nya.js) och bara på datorn (från 721 px).
   js/nya-myceon.js sätter <html data-nya-mode="samtal|meddelanden"> i Samtal och data-nya-hist när listan över
   tidigare samtal är öppen. Det nuvarande myceon påverkas inte. */

.ss-badge { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 600;
  letter-spacing: .02em; color: var(--text-secondary); background: var(--bg-inset); vertical-align: 1px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Delarna Nya myceon lägger till syns bara med valet, och bara på datorn. */
html:not([data-nya]) :is(.nya-tb, .nya-folders, .nya-under, .nya-rooms, #nya-drawer, .nya-subnav) { display: none !important; }
@media (max-width: 720px) { :is(.nya-tb, .nya-folders, .nya-under, .nya-rooms, #nya-drawer, .nya-subnav) { display: none !important; } }

@media (min-width: 721px) {
  /* ── Skalet: ingen kolumn, en tunn rad överst — på alla platser ─────────────────────────────── */
  html[data-nya] #myceon-shell { --areas: "h" "m" "f"; --cols: minmax(0, 1fr); --rows: auto minmax(0, 1fr) auto; }
  html[data-nya] #myceon-shell[data-side] { --areas: "h h" "m r" "f f"; --cols: minmax(0, 1fr) var(--ms-side-w); --rows: auto minmax(0, 1fr) auto; }
  /* Fråga myceon-panelen (myceon-ask.css) utan kolumnen. */
  /* Bara där myceon-ask.css gör panelen till en kolumn (ensam från 64rem, bredvid Öppna bredvid från 90rem); annars ligger
     den som ett ark över platsen och rutnätet får ingen tom kolumn. */
  @media (min-width: 64.0625rem) { html[data-nya] #myceon-shell[data-ask]:not([data-side]) { --areas: "h h" "m q" "f f"; --cols: minmax(0, 1fr) var(--ms-ask-w); } }
  @media (min-width: 90.0625rem) { html[data-nya] #myceon-shell[data-ask][data-side] { --areas: "h h h" "m r q" "f f f"; --cols: minmax(0, 1fr) var(--ms-side-w) var(--ms-ask-w); } }
  html[data-nya] #myceon-shell > .ms-col { display: none !important; }
  html[data-nya] #myceon-shell > .ms-bar { display: flex !important; align-items: center; gap: 8px; min-height: 60px; padding: 0 20px; border: 0; background: transparent; box-shadow: none; }
  html[data-nya] #myceon-shell > .ms-bar > :not(.nya-tb, .ms-live, .ms-pa) { display: none !important; }
  html[data-nya] #myceon-shell > .ms-bar > :is(.ms-live, .ms-pa) { order: 2; }

  .nya-tb { flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, auto) minmax(0, 1fr); align-items: center; min-height: 60px; }   /* mitten så bred flikarna behöver (Flikarna i topbaren), sidorna delar resten */
  .nya-tb-l { display: flex; align-items: center; gap: 6px; min-width: 0; }
  .nya-brand { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 10px; border: 0; border-radius: 10px; background: transparent;
    color: var(--text-primary); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
  .nya-brand:hover, .nya-brand[aria-expanded="true"] { background: var(--bg-hover); }
  .nya-brand .ui-icon { width: 14px; height: 14px; color: var(--text-muted); }
  .nya-brand-t { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  /* Ett långt organisationsnamn krymper (med …) i stället för att lägga sig över flikarna. */
  .nya-brand { min-width: 0; flex: 0 1 auto; }
  .nya-brand-t { min-width: 0; }
  .nya-brand > .ui-icon, .nya-logo, .nya-side { flex: none; }
  .nya-where { min-width: 0; flex: 0 1 auto; }
  /* Märket: till Samtal, en ny fråga (E3). */
  .nya-logo { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; text-decoration: none; }
  .nya-logo:hover { background: var(--bg-hover); }
  .nya-logo:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .nya-mark { width: 26px; height: 26px; border-radius: 7px; background: var(--text-primary); color: var(--bg-base); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; }
  .nya-where { font-size: 14px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .nya-where:not(:empty)::before { content: "/"; margin: 0 8px 0 2px; color: var(--text-faint, var(--text-muted)); }
  .nya-tabs { justify-self: center; display: flex; gap: 28px; min-width: 0; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .nya-tabs::-webkit-scrollbar { display: none; }
  /* Fler än två flikar (Flikarna i topbaren): tätare, och en lång verktygsetikett kortas. */
  .nya-tabs:has(.nya-tab:nth-child(3)) { gap: 20px; }
  .nya-tab { white-space: nowrap; flex: none; max-width: 16ch; }
  .nya-tab.is-tool { overflow: hidden; text-overflow: ellipsis; display: inline-block; line-height: 60px; }
  .nya-tab { position: relative; display: inline-flex; align-items: center; gap: 6px; height: 60px; color: var(--text-muted); font-size: 15px; text-decoration: none; }
  .nya-tab:hover { color: var(--text-primary); }
  .nya-tab[aria-current="page"] { color: var(--text-primary); font-weight: 600; box-shadow: inset 0 -2px 0 var(--text-primary); }
  .nya-tab-dot { width: 7px; height: 7px; border-radius: 4px; background: var(--lugn-lingon, var(--accent)); }
  .nya-tab-dot[hidden] { display: none; }
  .nya-tb-r { justify-self: end; display: flex; align-items: center; gap: 4px; }
  .nya-ib { width: 40px; height: 40px; border: 0; border-radius: 10px; background: transparent; color: var(--text-secondary); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
  .nya-ib:hover { background: var(--bg-hover); color: var(--text-primary); }
  .nya-ib .ui-icon { width: 19px; height: 19px; }
  .nya-me { width: 32px; height: 32px; margin-left: 6px; border: 0; border-radius: 16px; background: var(--nya-sel, var(--accent)); color: var(--bg-base); font: inherit; font-size: 11px; font-weight: 600; cursor: pointer; }
  :is(.nya-brand, .nya-tab, .nya-ib, .nya-me, .nya-chip, .nya-nu, .nya-link):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

  /* ── Samtal i båda lägena: ingen egen topbar, ingen mappkolumn, ingen dragbar list-bredd ─────────── */
  html[data-nya-mode] #platform-chat-overlay > .platform-chat-topbar { display: none !important; }
  html[data-nya-mode] #platform-chat-overlay #pc-rail,
  html[data-nya-mode] #platform-chat-overlay .pc-sidebar-resize,
  html[data-nya-mode] #platform-chat-overlay .platform-chat-sidebar :is(.pc-drawer-new, .pc-drawer-nav, .plh-collapse) { display: none !important; }
  html[data-nya-mode] #platform-chat-overlay .platform-chat-messages > * { width: 100%; max-width: 760px; margin-left: auto; margin-right: auto; box-sizing: border-box; }
  html[data-nya-mode] #platform-chat-overlay .platform-chat-input-wrap { border-top: 0; background: transparent; padding: 10px 24px 22px; }
  html[data-nya-mode] #platform-chat-overlay .platform-chat-input-wrap > * { width: 100%; max-width: 760px; margin-left: auto; margin-right: auto; box-sizing: border-box; }

  /* ── Samtal: bara samtalet ───────────────────────────────────────────────────────────── */
  html[data-nya-mode="samtal"] #platform-chat-overlay .platform-chat-body { position: relative; }
  html[data-nya-mode="samtal"]:not([data-nya-hist]) #platform-chat-overlay .platform-chat-sidebar { display: none !important; }
  /* Alla samtal: listan som en låda över samtalet. */
  html[data-nya-mode="samtal"][data-nya-hist] #platform-chat-overlay .platform-chat-sidebar { display: flex !important; position: absolute; z-index: 30; left: 16px; top: 4px; bottom: 16px;
    width: 320px !important; padding: 12px 8px; border: 1px solid var(--border-default); border-radius: 16px; background: var(--bg-surface); box-shadow: var(--shadow-lg); }
  #platform-chat-overlay.nya-home .platform-chat-main { justify-content: center; }
  #platform-chat-overlay.nya-home .platform-chat-messages { flex: 0 0 auto; overflow: visible; padding-bottom: 8px; }
  #platform-chat-overlay.nya-home :is(#pc-collab-bar, #pc-participants-bar) { display: none !important; }

  /* ── Meddelanden: listan och tråden som två lugna ytor ──────────────────────────────────── */
  html[data-nya-mode="meddelanden"] #platform-chat-overlay .platform-chat-body { justify-content: center; gap: 24px; padding: 4px 24px 24px; box-sizing: border-box; background: transparent; }
  html[data-nya-mode="meddelanden"] #platform-chat-overlay .platform-chat-sidebar { width: auto !important; flex: 0 1 clamp(260px, 38%, 380px); min-width: 0; padding: 10px 0 0; border: 0; border-radius: 16px; background: var(--bg-surface); }
  html[data-nya-mode="meddelanden"] #platform-chat-overlay :is(.platform-chat-main, .pc-rum-view, .pc-contacts-view) { flex: 1 1 auto; max-width: 820px; border-radius: 16px; background: var(--bg-surface); overflow: hidden; }
  html[data-nya-mode="meddelanden"] #platform-chat-overlay #pc-list-head :is(.plh-title, .plh-count) { display: none; }
  /* Nytt meddelande står i raden överst (pennan). */
  html[data-nya-mode="meddelanden"] #platform-chat-overlay #pc-list-head .plh-act .plh-btn:not(.plh-filter) { display: none; }
  /* Rum: listan visar rummen (inte trådarna), rummet står i mitten. */
  html[data-nya-mode="meddelanden"][data-nya-rum] #platform-chat-overlay .platform-chat-body.pc-mode-rum > .platform-chat-sidebar { display: flex !important; }
  html[data-nya-mode="meddelanden"][data-nya-rum] #platform-chat-overlay .platform-chat-sidebar :is(#pc-list-head, #platform-chat-threads-list, .pc-list-foot) { display: none !important; }
  .nya-rooms { display: flex; flex-direction: column; gap: 2px; padding: 0 8px 12px; overflow-y: auto; }
  .nya-rooms[hidden] { display: none; }
  .nya-room { display: block; padding: 9px 12px; border-radius: 10px; color: var(--text-secondary); font-size: 14px; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .nya-room:hover { background: var(--bg-hover); color: var(--text-primary); }
  .nya-room.is-on { background: var(--bg-inset); color: var(--text-primary); font-weight: 500; }
  .nya-room.is-new { color: var(--text-primary); font-weight: 600; }
  .nya-room:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  /* ── Lådan till vänster (F1, 28 okt 2026): stängd som standard, knappen längst till vänster i raden ───────
     <html data-nya-dk="gen|own"> när platsen har en låda, data-nya-drawer när den står öppen. gen: lådan är en egen
     kolumn (d) i skalet; own (Arbete, Riktning): platsens egen kolumn är lådan. */
  #myceon-shell { --nya-dw: 288px; }
  #nya-drawer { grid-area: d; }
  #nya-drawer[hidden] { display: none !important; }
  /* Breda fönster utan panel till höger: lådan är en kolumn (d) som skjuter innehållet åt sidan. */
  html[data-nya][data-nya-drawer][data-nya-dmode="grid"] #myceon-shell:not([data-side]):not([data-ask]) { --areas: "h h" "d m" "f f"; --cols: var(--nya-dw) minmax(0, 1fr); }
  /* Smala fönster (till 1100 px) eller med en panel till höger: lådan ligger över innehållet, för stunden. */
  html[data-nya][data-nya-drawer][data-nya-dmode="over"] #nya-drawer { position: fixed; z-index: 60; top: 64px; left: 12px; bottom: 16px; width: var(--nya-dw); max-width: calc(100vw - 24px); margin: 0;
    box-shadow: var(--shadow-lg, 0 16px 40px rgba(0, 0, 0, .16)); border: 1px solid var(--border-subtle); }
  .nya-drawer { display: flex; flex-direction: column; gap: 1px; min-height: 0; margin: 4px 0 24px 16px; padding: 10px; box-sizing: border-box; border-radius: 16px; background: var(--bg-surface); overflow-y: auto; }
  .nya-side { width: 40px; height: 40px; border: 0; border-radius: 10px; background: transparent; color: var(--text-secondary); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
  .nya-side[hidden] { display: none; }
  .nya-side:hover, .nya-side[aria-expanded="true"] { background: var(--bg-hover); color: var(--text-primary); }
  .nya-side:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .nya-dnew { display: flex; align-items: center; gap: 10px; min-height: 40px; margin: 0 0 6px; padding: 0 12px; border: 1px solid var(--border-default); border-radius: 10px; background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; text-align: left; }
  .nya-dnew:hover { background: var(--bg-hover); }
  .nya-dnew .ui-icon, .nya-dr .ui-icon, .nya-dq .ui-icon { width: 16px; height: 16px; flex: none; }
  .nya-dq { display: flex; align-items: center; gap: 8px; min-height: 36px; margin: 0 0 4px; padding: 0 10px; border-radius: 9px; background: var(--bg-inset); color: var(--text-secondary); }
  .nya-dq input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--text-primary); font: inherit; font-size: 14px; outline: none; }
  .nya-dq:focus-within { outline: 2px solid var(--accent); outline-offset: 1px; }
  .nya-dh { padding: 12px 10px 4px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
  .nya-dr { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 36px; padding: 0 10px; border: 0; border-radius: 9px; background: transparent; color: var(--text-primary); font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
  .nya-dr:hover { background: var(--bg-hover); }
  .nya-dr.is-on { background: var(--bg-inset); font-weight: 600; }
  .nya-dr:focus-visible, .nya-dnew:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
  .nya-dr-t { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nya-dr-m { flex: none; font-size: 12px; color: var(--text-secondary); }
  .nya-dempty { margin: 8px 10px; font-size: 13.5px; color: var(--text-secondary); }
  /* Öppen tar lådan över vyns egen navigering. */
  html[data-nya][data-nya-drawer][data-nya-dmode="grid"] .nya-folders,
  html[data-nya][data-nya-drawer][data-nya-dmode="grid"] #ms-main > [data-place] > .ms-head .ms-tabs,
  html[data-nya][data-nya-drawer][data-nya-dmode="grid"] #ms-main .ct-app.is-place .ct-list .ct-filters { display: none !important; }
  html[data-nya][data-nya-drawer][data-nya-dmode="grid"] #ms-main > [data-place] > .ms-head:not(:has(.ms-head-link)) { position: absolute; padding: 0; }
  html[data-nya][data-nya-drawer][data-nya-dmode="grid"][data-nya-rum] #platform-chat-overlay .platform-chat-body.pc-mode-rum > .platform-chat-sidebar { display: none !important; }

  /* ── Flikraden under raden överst (G2: Meddelandens mappar, G4: Riktnings vyer) ───────────────────── */
  .nya-subnav { flex: none; display: flex; align-items: center; gap: 22px; min-height: 44px; padding: 0 32px; overflow-x: auto; scrollbar-width: none; }
  .nya-subnav[hidden] { display: none; }
  .nya-subnav::-webkit-scrollbar { display: none; }
  .nya-sn { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 2px; border: 0; background: transparent; color: var(--text-secondary); font: inherit; font-size: 14px; white-space: nowrap; cursor: pointer; }
  .nya-sn:hover { color: var(--text-primary); }
  .nya-sn .ui-icon { width: 12px; height: 12px; }
  .nya-sn-n { font-size: 12px; font-weight: 400; color: var(--text-secondary); }
  .nya-sn-fill { flex: 1 1 auto; }
  .nya-sn-note { flex: 0 1 auto; min-width: 0; font-size: 13px; color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .nya-sn-new { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 0; border-radius: 9px; background: var(--accent); color: var(--text-on-accent, #fff); font: inherit; font-size: 13.5px; font-weight: 500; cursor: pointer; }
  .nya-sn-new .ui-icon { width: 15px; height: 15px; }
  .nya-sn:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; border-radius: 6px; }
  :is(.nya-sn-new, .nya-sn-link):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
  .nya-sn-link { flex: none; border: 0; background: none; padding: 4px 6px; color: var(--text-secondary); font: inherit; font-size: 13px; text-decoration: underline; cursor: pointer; }
  .nya-sn-link:hover { color: var(--text-primary); }
  /* Smalt fönster med något bredvid: en öppen tråd tar listans plats (listan kommer tillbaka via flikraden). */
  @media (max-width: 1100px) {
    html[data-nya-mode="meddelanden"][data-nya-thread] #myceon-shell[data-side] #platform-chat-overlay .platform-chat-sidebar { display: none !important; }
  }
  /* Riktning: flikarna i stället för vänsterkolumnen. */
  html[data-nya] #ms-main > [data-place="riktning"] .rk-host { flex-direction: column; }
  html[data-nya] #ms-main > [data-place="riktning"] .rk-host > .rk-app { flex: 1 1 auto; min-height: 0; }
  html[data-nya] #ms-main > [data-place="riktning"] .rk-side { display: none !important; }

  /* ── Platserna: samma lugna ytor som Meddelanden (okt 2026) ───────────────────────────────────
     Platsens namn står i raden överst (/ Tid …), så platsens egen rubrik läses bara upp. Flikarna (Nu, Dokument, Ekonomi)
     står på en lugn rad utan eget band. En plats med lista och innehåll visar dem som två ytor med luft och rundade hörn. */
  html[data-nya] #ms-main > [data-place] > .ms-head { padding: 0 24px; border: 0; background: transparent; box-shadow: none; align-items: center; min-height: 0; }
  html[data-nya] #ms-main > [data-place] > .ms-head:not(:has(.ms-tabs, .ms-head-link)) { position: absolute; padding: 0; }
  html[data-nya] #ms-main > [data-place] > .ms-head > .ms-h1 { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  html[data-nya] #ms-main > [data-place] > .ms-head .ms-tabs { margin: 0 0 8px; }
  html[data-nya] #ms-main > [data-place] > .ms-head .ms-head-link { margin: 0 0 8px auto; }
  /* Bygg: Projekt · Bygg på samma lugna rad. */
  html[data-nya] #ms-main > [data-place="bygg"] #app-topbar { border: 0; background: transparent; box-shadow: none; padding-left: 24px; padding-right: 24px; }
  /* Lista och innehåll som två ytor. */
  html[data-nya] #ms-main > [data-place] :is(.ct-app.is-place, .ar-app, .rk-app, .dv-app),
  html[data-nya] #ms-main > [data-place="bygg"] .app-layout { gap: 24px; padding: 4px 24px 24px; box-sizing: border-box; background: transparent; }
  html[data-nya] #ms-main > [data-place] :is(.ct-app.is-place > .ct-list, .ct-app.is-place > .ct-detail, .ar-side, .ar-main, .rk-side, .rk-main, .dv-listcol, .dv-viewcol),
  html[data-nya] #ms-main > [data-place="bygg"] :is(.left-panel, .right-panel) { border: 0 !important; border-radius: 16px; background: var(--bg-surface); overflow: hidden; box-shadow: none; min-height: 0; }
  html[data-nya] #ms-main > [data-place="bygg"] .left-panel > .resize-handle { display: none; }
  html[data-nya] #ms-main > [data-place] .ct-app.is-place > .ct-detail { min-width: 0; }

  /* Inställningar öppnas under raden överst, så man står kvar i myceon. */
  html[data-nya] .settings-view { top: 60px; background: var(--bg-base); }
  html[data-nya] .settings-view .ss-head { min-height: 48px; padding: 0 24px 4px; border: 0; background: transparent; }
  html[data-nya] .settings-view .ss-body { gap: 24px; padding: 4px 24px 24px; }
  html[data-nya] .settings-view :is(.ss-nav, .ss-main) { border: 0; border-radius: 16px; background: var(--bg-surface); }
  html[data-nya] .settings-view .ss-content .settings-footer { background: var(--bg-surface); }
  /* Bygg: förhandsvisningen utan projekt på samma yta. */
  html[data-nya] #ms-main > [data-place="bygg"] #preview-empty { background: var(--bg-surface); }   /* inte genomskinlig: under ligger förhandsvisningens vita ram (mörkt läge) */

  .nya-folders { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 12px 10px; }
  .nya-folders[hidden] { display: none; }
  .nya-chip { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--border-default); background: transparent;
    color: var(--text-secondary); font: inherit; font-size: 13px; cursor: pointer; }
  .nya-chip:hover { background: var(--bg-hover); color: var(--text-primary); }
  .nya-chip[aria-pressed="true"] { background: var(--bg-inset); color: var(--text-primary); border-color: transparent; font-weight: 500; }
  .nya-chip .ui-icon { width: 12px; height: 12px; }
}

/* Organisationerna överst i myceon ▾ (rutorna kommer från handlingskärnan: .ea-tiles). */
.nya-om { position: relative; width: 28px; height: 28px; border-radius: 8px; background: #3B5B8C; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; flex: none; }
.nya-om.is-private { background: #7A6A55; }
.nya-om.is-household { background: #6B7F5A; }
.nya-om-dot { position: absolute; top: -3px; right: -3px; width: 9px; height: 9px; border-radius: 5px; background: var(--lugn-lingon, var(--accent)); border: 2px solid var(--bg-elevated, var(--bg-surface)); }
.ea-tiles .ea-item svg + .nya-om, .ea-tiles .ea-item .nya-om { opacity: 1; }
.nya-hello-sub { margin: 8px 0 0; font-size: 14px; color: var(--text-muted); }
#platform-chat-messages .nya-hello { padding: 0 0 8px; text-align: center; color: var(--text-primary); }
.nya-h { margin: 0; font-family: var(--font-display, inherit); font-size: clamp(26px, 3vw, 36px); font-weight: 300; letter-spacing: -.02em; color: var(--text-primary); }
.nya-under { width: 100%; max-width: 760px; margin: 0 auto; padding: 0 24px 24px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.nya-under[hidden] { display: none; }
.nya-nu { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--border-default);
  background: transparent; color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; max-width: 100%; }
.nya-nu:hover { background: var(--bg-hover); }
.nya-nu-l { flex: none; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--lugn-lingon, var(--accent)); }
.nya-nu-t { min-width: 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nya-nu-calm { margin: 0; text-align: center; font-size: 14px; color: var(--text-muted); }
.nya-link { border: 0; background: none; color: var(--text-muted); font: inherit; font-size: 13px; cursor: pointer; padding: 6px 8px; border-radius: 6px; }
.nya-link:hover { color: var(--text-primary); background: var(--bg-hover); }

/* ── H1 (28 okt 2026): det valda syns tydligt — samma markering i flikar, listor, lådan och menyer ─────────────────
   En tjock linje under en vald flik; en ton och en kant till vänster på en vald rad. Fokus är en egen ring ovanpå. */
html[data-nya] { --nya-sel: var(--accent); --nya-sel-bg: color-mix(in srgb, var(--nya-sel) 12%, var(--bg-surface)); }
html[data-nya][data-look="lugn"]:not([data-theme="dark"]) { --nya-sel: #2F6F62; }
html[data-nya][data-look="lugn"][data-theme="dark"] { --nya-sel: #9DBBA6; }
@media (prefers-color-scheme: dark) { html[data-nya][data-look="lugn"]:not([data-theme]) { --nya-sel: #9DBBA6; } }
html[data-nya] :is(.nya-tab[aria-current="page"], .nya-sn[aria-current="page"]) { color: var(--nya-sel); font-weight: 600; box-shadow: inset 0 -3px 0 var(--nya-sel); }
html[data-nya] #ms-main .ms-tab:is(.is-on, [aria-selected="true"]) { color: var(--nya-sel); font-weight: 600; border-bottom-color: transparent; box-shadow: inset 0 -3px 0 var(--nya-sel); }
html[data-nya] #platform-chat-threads-list [data-tid][aria-selected="true"],
html[data-nya] #ms-main [data-dv-id].is-sel,
html[data-nya] #ms-main .ct-item.is-on,
html[data-nya] #ms-main .ar-nav-item[aria-current="true"] { background: var(--nya-sel-bg) !important; box-shadow: inset 3px 0 0 var(--nya-sel); }
/* På en tonad rad står texten i textfärgen (kontrasten håller i alla utseenden); tonen och kanten bär markeringen. */
html[data-nya] :is(.nya-dr.is-on, .nya-room.is-on) { background: var(--nya-sel-bg); color: var(--text-primary); font-weight: 600; box-shadow: inset 3px 0 0 var(--nya-sel); }
html[data-nya] #ms-main .ct-chip.is-on, html[data-nya] .nya-chip[aria-pressed="true"] { background: var(--nya-sel-bg); color: var(--text-primary); border-color: var(--nya-sel); font-weight: 600; }
html[data-nya] .ea-menu .ea-item[aria-checked="true"] { background: var(--nya-sel-bg); color: var(--text-primary); font-weight: 600; box-shadow: inset 3px 0 0 var(--nya-sel); }

/* Arbete i en smal yta (Arbetes egen container-fråga lägger uppdragen i en vågrät remsa): remsan ska gå att rulla. */
@container arapp (max-width: 760px) { html[data-nya] #ms-main .ar-side { overflow-x: auto !important; overflow-y: hidden !important; } }

/* ── Det lugnare myceon (admin CHANGELOG-lugnare.md) ─────────────────────────────────────────────── */
html[data-nya] .nya-quiet { margin-inline-start: 8px; padding: 2px 10px; border: 1px solid var(--border, rgba(0,0,0,.12)); border-radius: 999px; background: transparent; color: var(--text-secondary, inherit); font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap; }
html[data-nya] .nya-quiet:hover, html[data-nya] .nya-quiet:focus-visible { color: var(--text, inherit); border-color: var(--text-secondary, currentColor); }
.mc-sum { max-width: 640px; margin: 0 auto; padding: 14px 16px; border: 1px solid var(--border, rgba(0,0,0,.12)); border-radius: 12px; background: var(--surface, transparent); text-align: start; }
.mc-sum-t { margin: 0 0 8px; color: var(--text, inherit); line-height: 1.5; }
.mc-sum-l { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 2px; }
.mc-sum-r { display: flex; gap: 8px; width: 100%; padding: 8px 6px; border: 0; border-radius: 8px; background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; min-height: 44px; align-items: center; }
.mc-sum-r:hover, .mc-sum-r:focus-visible { background: var(--surface-hover, rgba(0,0,0,.04)); }
.mc-sum-r b { flex: none; font-weight: 600; }
.mc-sum-r span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-secondary, inherit); }
.mc-sum-ok { padding: 6px 14px; border: 1px solid var(--border, rgba(0,0,0,.12)); border-radius: 8px; background: none; color: inherit; font: inherit; cursor: pointer; min-height: 36px; }
/* Långa samtal: äldre svar som sin första rad (foldOld), stegen som en diskret rad, och bara det senaste steget medan
   myceon arbetar. */
html[data-nya] .platform-chat-msg.nya-folded { max-height: 4.8em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent); }
html[data-nya] .platform-chat-msg.nya-folded .pc-steps { display: none; }
html[data-nya] .nya-unfold { display: inline-block; margin-top: 4px; padding: 2px 0; border: 0; background: none; color: var(--text-secondary, inherit); font: inherit; font-size: 13px; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
html[data-nya] .pc-steps:not(.is-live) { border: 0; background: none; padding: 0; margin: 0 0 6px; font-size: 12px; color: var(--text-muted, var(--text-secondary, inherit)); }
html[data-nya] .pc-steps:not(.is-live) > summary { list-style: none; cursor: pointer; opacity: .8; }
html[data-nya] .pc-steps.is-live li:not(:last-child) { display: none; }