/* Sanntidssynk (solpark-synk.jsx, 14. nov 2026): hvem som er inne ved prosjektnavnet, meldinger og pynt på kort/felt andre redigerer. */
.sps { position: relative; display: inline-flex; align-items: center; flex: none; }
.sps-knapp { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 3px 10px 3px 8px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--spg-kant, oklch(0.88 0.03 80)); background: var(--spg-pille, oklch(0.98 0.02 80)); color: var(--spg-tekst, oklch(0.29 0.03 60));
  font: 500 12.5px/1.2 "DM Sans", system-ui, sans-serif; }
.sps-knapp:hover { border-color: var(--spg-kant-sterk, oklch(0.84 0.04 78)); }
.sps-knapp:focus-visible { outline: 2px solid var(--spg-aksent, oklch(0.56 0.15 45)); outline-offset: 2px; }
.sps-prikk { width: 8px; height: 8px; border-radius: 50%; margin-right: 2px; background: oklch(0.7 0.02 80); }
.sps-prikk--gronn { background: oklch(0.62 0.14 148); box-shadow: 0 0 0 3px oklch(0.62 0.14 148 / 0.18); }
.sps-prikk--gul { background: oklch(0.72 0.14 75); }
.sps-prikk--gra { background: oklch(0.72 0.02 80); animation: sps-puls 1.2s ease-in-out infinite; }
@keyframes sps-puls { 50% { opacity: 0.35; } }
.sps-avatar { --synk-farge: oklch(0.6 0.12 250); display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; flex: none;
  background: var(--synk-farge); color: oklch(0.99 0 0); font: 700 10.5px/1 "DM Sans", system-ui, sans-serif; letter-spacing: 0.02em;
  box-shadow: 0 0 0 2px var(--spg-flate, oklch(0.985 0.008 80)); margin-left: -4px; }
.sps-knapp .sps-avatar:first-of-type { margin-left: 0; }
.sps-avatar--redigerer { box-shadow: 0 0 0 2px var(--spg-flate, oklch(0.985 0.008 80)), 0 0 0 4px var(--synk-farge); }
.sps-avatar--flere { background: oklch(0.55 0.02 70); }
.sps-tekst { color: var(--spg-dempet, oklch(0.5 0.04 65)); }
.sps-ko { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: oklch(0.72 0.14 75); color: oklch(0.25 0.03 60); font-size: 11px; font-weight: 700; }
.sps-pop { position: absolute; top: calc(100% + 8px); left: 0; z-index: 60; width: min(340px, calc(100vw - 32px)); padding: 12px 14px; border-radius: 12px;
  background: var(--spg-flate, oklch(0.985 0.008 80)); border: 1px solid var(--spg-kant, oklch(0.88 0.03 80)); box-shadow: 0 10px 30px oklch(0.25 0.03 60 / 0.16);
  font: 400 13px/1.45 "DM Sans", system-ui, sans-serif; color: var(--spg-tekst, oklch(0.29 0.03 60)); }
.sps-pop__linje { margin: 0 0 8px; }
.sps-pop__dempet { color: var(--spg-dempet, oklch(0.5 0.04 65)); font-size: 12px; margin: 8px 0 0; }
.sps-liste { list-style: none; margin: 4px 0 8px; padding: 0; display: grid; gap: 6px; }
.sps-liste li { display: flex; align-items: center; gap: 8px; }
.sps-liste .sps-avatar { margin-left: 0; }
.sps-foreldet { position: absolute; top: calc(100% + 8px); left: 0; z-index: 61; width: min(380px, calc(100vw - 32px)); padding: 12px 14px; border-radius: 12px;
  background: oklch(0.97 0.04 85); border: 1px solid oklch(0.8 0.1 80); box-shadow: 0 10px 30px oklch(0.25 0.03 60 / 0.16); font: 400 13px/1.45 "DM Sans", system-ui, sans-serif; }
.sps-foreldet p { margin: 0 0 10px; }
.sps-rad { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.sps-meldinger { position: fixed; right: 16px; bottom: 16px; z-index: 6000; display: grid; gap: 8px; max-width: min(360px, calc(100vw - 32px)); pointer-events: none; }
.sps-melding { padding: 10px 14px; border-radius: 10px; background: oklch(0.27 0.03 60); color: oklch(0.97 0.01 80); font: 500 13px/1.4 "DM Sans", system-ui, sans-serif;
  box-shadow: 0 8px 24px oklch(0.2 0.03 60 / 0.25); animation: sps-inn 0.18s ease-out; }
.sps-melding--advarsel { background: oklch(0.42 0.1 60); }
@keyframes sps-inn { from { transform: translateY(6px); opacity: 0; } }
@media (max-width: 1100px) { .sps-knapp { padding: 2px 8px 2px 6px; } .sps-tekst { display: none; } .sps-pop, .sps-foreldet { position: fixed; top: 64px; left: 16px; right: 16px; width: auto; } }

/* Kort og felt en annen redigerer akkurat nå (attributtene settes av solpark-synk.jsx) */
[data-synk-fokus] { position: relative; box-shadow: 0 0 0 2px var(--synk-farge, oklch(0.6 0.15 250)); border-radius: 12px; }
[data-synk-fokus]::before { content: attr(data-synk-fokus); position: absolute; top: -10px; right: 12px; z-index: 5; max-width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 1px 8px; border-radius: 999px; background: var(--synk-farge, oklch(0.6 0.15 250)); color: oklch(0.99 0 0); font: 600 11px/1.5 "DM Sans", system-ui, sans-serif; pointer-events: none; }
input[data-synk-felt], select[data-synk-felt], textarea[data-synk-felt] { outline: 2px solid var(--synk-farge, oklch(0.6 0.15 250)); outline-offset: 1px; }
@media (prefers-reduced-motion: reduce) { .sps-prikk--gra, .sps-melding { animation: none; } }
