/* ============================================================================
   FORRE.NU — SPELA I NYA TEMAT (forre_ny) · ny-spela.css           2026-10-20
   Källa: design-proposals/nytt-forre-2026-10-20.html, riktning C (#rikt=c|sida=lfg):
     Ditt lag ........ C.lag (b-lag · b-lagh · b-slots · b-lagr · b-pl · sw)
     valen ........... c-vad / a-vad (kort, cupen med pumpan, passar dig · anmäld)
     listan .......... a-lt (a-lth · a-lg · a-lr · sel)
     detaljen ........ a-lfgd · a-dt (dh · why · c-draft · db · dn3)
     mobilen ......... C.mLfg (bm-lag · am-vad · am-lfgl · am-lr · am-sheet)
   Markupen: themes/forre_ny/views/pages/lfg/spela.php. JS: ny-spela.js.

   ★ Laddas bara på Spela (app/Helpers/PulseAssets.php). Prefix nsp-.
   ★ Roten är också .lfgp.lfg6 (pulse-lfg.js kräver det) — pulse-lfg.css styr därför
     modalerna, och grupprutorna (.mine) som skrivs om här med .nsp.lfg6 före.
   ★ Bara forre_pulse-tokens + ny.css. Inga lodräta avdelare, ingen glow.
   ============================================================================ */

.nsp [hidden]{display:none!important}
/* pulse-lfg.css laddas EFTER den här filen och har tre generiska regler som slår ut nya
   temats byggklossar inuti roten: .lfgp a{color:inherit}, .lfg6 button{border:0;
   background:initial;padding:0…} och .lfg6 .sel (fältens stil — därför heter vald rad
   .vald). Knapparna skrivs därför om här med .nsp.lfg6 före (högre specificitet). */
.nsp.lfg6 button.n-btn,.nsp.lfg6 a.n-btn,.nsp.lfg6 span.n-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 12px;border-radius:var(--r);font:600 12.5px/1 var(--ui);white-space:nowrap;border:1px solid transparent;color:var(--ink);background:transparent;cursor:pointer;flex:none;text-decoration:none}
.nsp.lfg6 .n-btn.p{background:color-mix(in srgb,var(--accent) 80%,#000);color:#fff}
.nsp.lfg6 .n-btn.p:hover{background:color-mix(in srgb,var(--accent) 68%,#000)}
[data-theme="dark"] .nsp.lfg6 .n-btn.p{background:var(--accent);color:#06121f}
[data-theme="dark"] .nsp.lfg6 .n-btn.p:hover{background:var(--accent-ink)}
.nsp.lfg6 .n-btn.s{border-color:var(--line2);color:var(--ink)}
.nsp.lfg6 .n-btn.s:hover{border-color:var(--accent);color:var(--accent-ink)}
.nsp.lfg6 .n-btn.g{color:var(--accent-ink);padding:0 6px}
.nsp.lfg6 .n-btn.g:hover{background:var(--accent-wash)}
.nsp.lfg6 .n-btn.q{background:var(--inset);color:var(--ink2);cursor:default}
.nsp.lfg6 .n-btn.sm{height:26px;padding:0 9px;font-size:12px}
.nsp.lfg6 .n-btn.g.sm{padding:0 6px}
.nsp.lfg6 .n-btn.klar{background:var(--live-wash);color:var(--live);border-color:transparent}
.nsp.lfg6 .n-btn[disabled]{opacity:.55;cursor:default}
.nsp a.n-lk{color:var(--accent-ink)}
.nsp a:not(.n-btn):not(.n-lk):not(.n-av){color:inherit}
.nsp .n-dim{color:var(--dim)}
.nsp .acc{color:var(--accent-ink)}
.nsp-mmeta{display:none}
.nsp-tg{display:inline-block;font:700 9.5px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent-wash);padding:3px 5px;border-radius:4px;vertical-align:1px;white-space:nowrap}
.nsp-tg.ok{color:var(--live);background:var(--live-wash)}
.nsp-ok,.nsp-kanske,.nsp-nej{display:inline-flex;align-items:center;gap:5px;min-width:0}
.nsp-ok{color:var(--ink)}.nsp-ok>i{color:var(--live)}
.nsp-kanske{color:var(--ink2)}.nsp-kanske>i{color:var(--gold)}
.nsp-nej{color:var(--dim)}.nsp-nej>i{color:var(--dim);font-size:11px}

/* Epic-inbjudan (bara overifierad, bara för en själv) */
.nsp-ep{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;margin-bottom:16px;font-size:13px;color:var(--ink2)}
.nsp-ep>i{color:var(--accent);flex:none}
.nsp-ep>span{flex:1;min-width:180px}

/* ---------------------------------------------------------------- 1. DITT LAG (C.lag) */
.nsp-lag{padding:18px 22px;margin-bottom:16px}
.nsp-lag .lh{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.nsp-lag .lh h2{font:700 18px/1 var(--hd);margin:0;color:var(--ink)}
.nsp-lag .lh .n-dim{font-size:12.5px;margin-left:auto}
.nsp-lag .lb{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.nsp-lag .slots{display:flex;align-items:flex-start;gap:14px}
.nsp.lfg6 .nsp-lag .sl{display:flex;flex-direction:column;align-items:center;gap:6px;width:80px;padding:0;border:0;background:none;color:inherit;font:inherit;text-decoration:none;cursor:pointer}
.nsp.lfg6 .nsp-lag .sl>b{max-width:80px;font-size:12px;font-weight:500;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp.lfg6 .nsp-lag .sl.du .n-av{box-shadow:0 0 0 3px var(--card),0 0 0 5px var(--accent)}
.nsp.lfg6 .nsp-lag .sl.du>b{color:var(--ink);font-weight:600}
.nsp.lfg6 .nsp-lag .sl .n-av{--s:56px}
.nsp.lfg6 .nsp-lag .tom>i{width:56px;height:56px;border-radius:50%;border:2px dashed var(--line2);display:grid;place-items:center;font-size:20px;color:var(--dim);transition:border-color .12s,color .12s}
.nsp.lfg6 .nsp-lag button.tom:hover>i{border-color:var(--accent);color:var(--accent-ink)}
.nsp.lfg6 .nsp-lag .tom.ledig{cursor:default}
/* ★ LAGKAMRATER SOM ÄR INNE i de lediga platserna (2026-10-22) — ett tryck öppnar en DM med ett förslag */
.nsp.lfg6 .nsp-lag .sl.forslag .sl-av{position:relative;display:inline-flex}
.nsp.lfg6 .nsp-lag .sl.forslag .sl-av>.on{position:absolute;right:1px;bottom:1px;width:12px;height:12px;border-radius:50%;background:var(--live);box-shadow:0 0 0 2px var(--card)}
.nsp.lfg6 .nsp-lag .sl.forslag>small{max-width:80px;margin-top:-4px;font-size:11px;color:var(--live);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp.lfg6 .nsp-lag .sl.forslag:hover .n-av{box-shadow:0 0 0 3px var(--card),0 0 0 5px var(--accent)}
.nsp-lag .lr{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;max-width:520px}
.nsp-lag .lr>small{flex-basis:100%;order:3;text-align:right;font-size:12px;color:var(--dim)}
.nsp-pl{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:var(--inset)}
.nsp-pl>div{min-width:0}
.nsp-pl b{display:block;font-size:13px;color:var(--ink)}
.nsp-pl small{display:block;font-size:11.5px;color:var(--dim)}
.nsp-pl .sw{width:36px;height:20px;border-radius:10px;background:var(--line2);position:relative;flex:none}
.nsp-pl .sw i{position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:var(--card);box-shadow:0 1px 2px rgba(0,0,0,.3);transition:left .15s}
.nsp-pl.pa .sw{background:var(--live)}
.nsp-pl.pa .sw i{left:18px}

/* Dina grupper + grupper du är med i (samma markup som forre_pulse — skrivs om här) */
.nsp-grp:not(:has(> #joinedBands > *, > .mine, > section:not([hidden]))){display:none}
.nsp-grp{margin:16px -22px -18px;border-top:1px solid var(--line)}
.nsp.lfg6 .nsp-grp .mine,.nsp.lfg6 .nsp-grp .mine.joined{border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;overflow:visible}
.nsp.lfg6 .nsp-grp .mine:last-child{border-bottom:0}
.nsp.lfg6 .nsp-grp .mine .bar,.nsp.lfg6 .nsp-grp .mine.joined .bar{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap;padding:10px 22px;background:transparent}
.nsp.lfg6 .nsp-grp .mine .lb{font:700 10px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink);margin:0}
.nsp.lfg6 .nsp-grp .mine.joined .lb{color:var(--live)}
.nsp.lfg6 .nsp-grp .mine .md{font:600 12px/1 var(--ui);color:var(--ink2);background:var(--inset);padding:4px 7px;border-radius:var(--r-sm)}
.nsp.lfg6 .nsp-grp .mine .txt{font-size:13px;font-weight:600;color:var(--ink)}
.nsp.lfg6 .nsp-grp .mine .cnt{font:700 13px/1 var(--hd);color:var(--ink);letter-spacing:0}
.nsp.lfg6 .nsp-grp .mine .resv{font-size:11.5px;color:var(--dim)}
.nsp.lfg6 .nsp-grp .mine .rt{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap;width:auto}
.nsp.lfg6 .nsp-grp .mine.is-paused .lb::after{content:" · pausad";color:var(--dim)}
.nsp.lfg6 .nsp-grp .btn{height:26px;padding:0 9px;border-radius:var(--r);border:1px solid var(--line2);background:transparent;color:var(--ink);font:600 12px/1 var(--ui);gap:5px}
.nsp.lfg6 .nsp-grp .btn:hover{border-color:var(--accent);color:var(--accent-ink);background:transparent}
.nsp.lfg6 .nsp-grp .btn.g{background:var(--accent-wash);border-color:transparent;color:var(--accent-ink)}
.nsp.lfg6 .nsp-grp .btn.gh{border-color:transparent;color:var(--dim)}
.nsp.lfg6 .nsp-grp .btn.gh:hover{background:var(--inset);color:var(--ink)}
.nsp.lfg6 .nsp-grp .lfgm-inbox,.nsp.lfg6 .nsp-grp [data-lfgr-sido]{margin:0;padding:10px 22px;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none}

/* ---------------------------------------------------------------- 2. VALEN (c-vad) */
.nsp-vad{display:flex;gap:8px;margin-bottom:16px}
.nsp.lfg6 .nsp-vad>button,.nsp.lfg6 .nsp-vad>a{flex:1 1 0;min-width:0;position:relative;display:flex;flex-direction:column;gap:5px;padding:11px 14px;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:var(--r);color:var(--ink);font:inherit;cursor:pointer;text-decoration:none}
.nsp.lfg6 .nsp-vad>button:hover{border-color:var(--line2)}
.nsp.lfg6 .nsp-vad>button b{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp.lfg6 .nsp-vad>button small{font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp.lfg6 .nsp-vad>button small .nsp-tg{margin-left:4px}
.nsp.lfg6 .nsp-vad>button.on{border-color:var(--accent);background:var(--accent-wash)}
.nsp.lfg6 .nsp-vad>button.on b{color:var(--accent-ink)}
.nsp.lfg6 .nsp-vad>button.cup .pm~b,.nsp.lfg6 .nsp-vad>button.cup .pm~small{padding-left:32px}
.nsp-vad .pm{position:absolute;left:12px;top:50%;margin-top:-13px;width:26px;height:26px;border-radius:50%;background:#000 center/cover}
.nsp.lfg6 .nsp-vad>a.alla{flex:0 0 120px;flex-direction:row;align-items:center;justify-content:center;gap:6px;font-size:13px;font-weight:600;color:var(--accent-ink);background:transparent;border-style:dashed}
.nsp.lfg6 .nsp-vad>a.alla:hover{background:var(--accent-wash)}
/* ★ DINA LAGS PASS i remsan (2026-10-22) — lagets märke till vänster, grönt = bestämt, guld = förslag */
.nsp.lfg6 .nsp-vad>a.lag{padding-left:48px}
.nsp.lfg6 .nsp-vad>a.lag:hover{border-color:var(--line2)}
.nsp-vad>a.lag>.nsq-cr{position:absolute;left:12px;top:50%;margin-top:-12px}
.nsp.lfg6 .nsp-vad>a.lag b{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp.lfg6 .nsp-vad>a.lag small{font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp.lfg6 .nsp-vad>a.lag.ok b{color:var(--live)}
.nsp.lfg6 .nsp-vad>a.lag.gd b{color:var(--gold)}

/* Eventrutan (bara när ett lagevent är valt) */
.nsp-ev{display:flex;align-items:flex-start;gap:14px;padding:14px 18px;margin-bottom:16px}
.nsp-ev .dag{flex:none;width:48px;height:54px;border-radius:var(--r);background:var(--inset);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.nsp-ev .dag b{font:700 9.5px/1 var(--ui);letter-spacing:.08em;color:var(--dim)}
.nsp-ev .dag span{font:700 19px/1 var(--hd);color:var(--ink)}
.nsp-ev.cup .dag{background:var(--hw-wash)}
.nsp-ev.cup .dag b{color:var(--hw-ink)}
.nsp-ev .tt{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.nsp-ev .tt>b{font-size:15px;font-weight:700;color:var(--ink)}
.nsp-ev .tt>small{font-size:12.5px;color:var(--dim)}
.nsp-ev .fit{display:flex;flex-direction:column;gap:3px;margin-top:4px;font-size:12.5px}
.nsp-ev .hj{color:var(--ink2)!important}
.nsp-ev .kn{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;max-width:420px}
.nsp-eg{display:flex;flex-direction:column;text-align:right}
.nsp-eg b{font-size:13px;color:var(--ink)}
.nsp-eg small{font-size:11.5px;color:var(--dim)}

/* ---------------------------------------------------------------- 3. LISTAN + DETALJEN (a-g-lfg) */
.nsp-g{grid-template-columns:minmax(0,1fr) 440px}
.nsp.nsp-laddar .nsp-lt,.nsp.nsp-laddar .nsp-dt{opacity:.55;transition:opacity .15s;pointer-events:none}
.nsp-lt{overflow:hidden;min-height:120px}
.nsp-th,.nsp-lr{display:grid;grid-template-columns:minmax(0,1.5fr) 64px 1fr 1fr 118px 124px;gap:10px;align-items:center;padding:0 16px}
.nsp-th{height:38px;font:600 10.5px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--dim);border-bottom:1px solid var(--line)}
.nsp-th>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp-lg{display:flex;align-items:baseline;gap:10px;padding:12px 16px 6px;background:color-mix(in srgb,var(--inset) 45%,var(--card))}
.nsp-lg b{font-size:12.5px;font-weight:700;color:var(--ink)}
.nsp-lg span{font-size:12px;color:var(--dim)}
.nsp-lr{min-height:56px;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink2);cursor:pointer;outline:0}
.nsp-lr:hover,.nsp-lr:focus-visible{background:color-mix(in srgb,var(--inset) 60%,transparent)}
.nsp-lr.vald{background:var(--accent-wash)}
.nsp-lr>span{min-width:0}
.nsp-lr .nm{display:flex;align-items:center;gap:10px;min-width:0}
.nsp-lr .nm>span{min-width:0}
.nsp-lr .nm b{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;min-width:0}
.nsp-lr .nm b>a{min-width:0;overflow:hidden;text-overflow:ellipsis;text-decoration:none}
.nsp-lr .nm b>a:hover{text-decoration:underline}
.nsp-lr .nm small{display:block;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp-lr .nm small i.fm{font-style:normal}
.nsp-lr .nm small i.fm .bi{font-size:11px;margin-right:2px}
.nsp-lr .nm small i.fm.het{color:var(--ink2)}
.nsp-lr .nm small i.fm.het .bi{color:var(--gold)}
.nsp-lr .c2,.nsp-lr .c3,.nsp-lr .c4{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp-lr .ac{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.nsp-lr .mx{display:none}
.nsp-av{flex:none}
.nsp-av.r-live{box-shadow:0 0 0 2px var(--card),0 0 0 3.5px var(--live)}
.nsp-av.r-acc{box-shadow:0 0 0 2px var(--card),0 0 0 3.5px var(--accent)}
.nsp-lr.vald .nsp-av.r-live,.nsp-lr.vald .nsp-av.r-acc{box-shadow:0 0 0 2px var(--accent-wash),0 0 0 3.5px currentColor}
.nsp-ps{display:inline-flex;align-items:center;gap:6px;max-width:100%;font-weight:600}
.nsp-ps>span{overflow:hidden;text-overflow:ellipsis}
.nsp-ps>i{font-size:11px}
.nsp-ps .n-dot{width:7px;height:7px}
.nsp-ps.live{color:var(--live)}
.nsp-ps.acc{color:var(--accent-ink)}
.nsp-ps.acc .n-dot{background:var(--accent)}
.nsp-ps.neu{color:var(--ink2)}
.nsp-ps.snart,.nsp-ps.off{font-weight:400;color:var(--ink2)}
.nsp-svar{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;white-space:nowrap}
.nsp-svar.ja{color:var(--live)}
.nsp-svar.sen{color:var(--gold)}
.nsp-svar.nej{color:var(--dim);font-weight:400}
.nsp-ej{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);font-size:12.5px}
.nsp-ej .n-dim{flex:1;min-width:0}
.nsp-ejhj{padding:0 16px 12px;font-size:12.5px;color:var(--ink2);border-bottom:1px solid var(--line)}

/* Detaljen (a-dt + c-draft) */
.nsp-dt{position:sticky;top:112px}
.nsp-dtin{padding:20px}
.nsp-dtin .dh{display:flex;gap:14px;align-items:center;margin-bottom:16px}
.nsp-dtin .dh>div{min-width:0}
.nsp-dtin .dh b{display:block;font:700 20px/1.1 var(--hd);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsp-dtin .dh small{display:block;margin:3px 0 8px;font-size:12.5px;color:var(--dim)}
.nsp-st{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--live);background:var(--live-wash)}
.nsp-st .n-dot{width:7px;height:7px}
.nsp-st.acc{color:var(--accent-ink);background:var(--accent-wash)}
.nsp-st.acc .n-dot{background:var(--accent)}
.nsp-st.neu,.nsp-st.snart{color:var(--ink2);background:var(--inset)}
.nsp-st.neu .n-dot,.nsp-st.snart .n-dot{background:var(--faint)}
.nsp-dtin>.n-ml{margin-bottom:8px}
.nsp-dtin .why{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:6px}
.nsp-dtin .why li{display:flex;gap:9px;padding:9px 11px;border-radius:var(--r);background:var(--inset);font-size:13.5px;color:var(--ink2)}
.nsp-dtin .why li>i{color:var(--live);flex:none}
.nsp-dtin .why li b{color:var(--ink)}
.nsp-dtin .draft{margin:0 0 12px;padding:9px 11px;border-radius:12px 12px 12px 4px;background:var(--inset);font-size:13px;color:var(--ink)}
.nsp-dtin .draft em{display:block;margin-bottom:3px;font-style:normal;font-size:10.5px;color:var(--dim)}
.nsp-dtin .db{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.nsp-dtin .dn3{margin:12px 0 0;font-size:12.5px;color:var(--dim)}
.nsp-dtin .mer{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.nsp-dtin .mer>.n-ml{margin-bottom:8px}
.nsp-dtin .mer>.n-ml+.kv,.nsp-dtin .mer>.n-ml+p{margin-top:0}
.nsp-dtin .kv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.nsp-dtin .kv div{padding:7px 9px;border-radius:var(--r);background:var(--inset);min-width:0}
.nsp-dtin .kv small{display:block;font:600 9.5px/1 var(--ui);letter-spacing:.05em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.nsp-dtin .kv b{display:block;margin-top:4px;font:700 15px/1 var(--hd);color:var(--ink)}
.nsp-dtin .mer>p{margin:0;font-size:12.5px}
.nsp-hbx{margin-bottom:14px}
.nsp-hbx .hb{position:relative;height:10px;border-radius:5px;background:var(--inset);overflow:hidden}
.nsp-hbx .hb span{position:absolute;top:0;bottom:0;border-radius:5px}
.nsp-hbx .hb .hen{background:color-mix(in srgb,var(--accent) 45%,transparent)}
.nsp-hbx .hb .over{background:var(--accent)}
.nsp-hbx .hb .nu{background:var(--ink);opacity:.35;border-radius:2px}
.nsp-hbx .hb.du{height:4px;margin-top:3px;background:transparent}
.nsp-hbx .hb.du span{background:var(--live)}
.nsp-hbx .ax{display:flex;justify-content:space-between;margin-top:4px;font:600 10px/1 var(--hd);color:var(--faint)}
.nsp-hbx p{margin:6px 0 0;font-size:12.5px;color:var(--ink2)}
.nsp-hbx p b{color:var(--ink)}
.nsp-dt0{display:flex;align-items:center;gap:10px;padding:20px;font-size:13px;color:var(--dim)}
.nsp-dt0 i{font-size:20px;opacity:.5}
.nsp-prompts{margin-top:16px}
.nsp-ark{display:none}

/* ---------------------------------------------------------------- 4. SMALARE DATORSKÄRMAR */
@media (max-width:1300px){
  .nsp-g{grid-template-columns:minmax(0,1fr) 380px}
  .nsp-th,.nsp-lr{grid-template-columns:minmax(0,1.5fr) 56px 1fr 1fr 104px 118px}
}
@media (max-width:1180px){
  .nsp-th,.nsp-lr{grid-template-columns:minmax(0,1.6fr) 1fr 1fr 118px}
  .nsp-th>span:nth-child(2),.nsp-lr .lg,.nsp-th>span:nth-child(5),.nsp-lr .c4{display:none}
  .nsp-vad{flex-wrap:wrap}
  .nsp.lfg6 .nsp-vad>button,.nsp.lfg6 .nsp-vad>a.lag{flex:1 1 180px}
}
@media (max-width:1000px){
  .nsp-g{grid-template-columns:minmax(0,1fr)}
  .nsp-dt{position:static}
  .nsp-lag .lr{margin-left:0;justify-content:flex-start}
  .nsp-lag .lr>small{text-align:left}
}

/* ---------------------------------------------------------------- 5. MOBILEN (≤ 820, C.mLfg) */
@media (max-width:820px){
  .nsp-ph{flex-direction:row;align-items:baseline;gap:10px;margin-bottom:12px}
  .nsp-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding-top:4px}
  .nsp-ph h1{font-size:25px;line-height:1.1}
  .nsp-ph .np-meta{display:none}
  .nsp-mmeta{display:inline;font-size:12.5px;color:var(--dim)}
  .nsp-ph .np-phr{display:none}
  .nsp-ep{margin-bottom:12px}
  /* Ditt lag (bm-lag) */
  .nsp-lag{padding:14px;margin-bottom:12px}
  .nsp-lag .lh{display:none}
  .nsp-lag .lb{flex-direction:column;align-items:stretch;gap:12px}
  .nsp-lag .slots{gap:10px}
  .nsp.lfg6 .nsp-lag .sl{width:56px}
  .nsp.lfg6 .nsp-lag .sl .n-av{--s:48px;--f:15px}
  .nsp.lfg6 .nsp-lag .tom>i{width:48px;height:48px;font-size:16px}
  .nsp.lfg6 .nsp-lag .sl>b{display:none}
  .nsp.lfg6 .nsp-lag .sl.du>b{display:block}
  .nsp.lfg6 .nsp-lag .sl.forslag>small{display:none}
  .nsp.lfg6 .nsp-lag .sl.forslag .sl-av>.on{width:11px;height:11px}
  .nsp-lag .lr{margin:0;max-width:none;justify-content:flex-start}
  .nsp-lag .lr>small{display:none}
  .nsp-lag .lr>.n-btn.p{flex:1}
  .nsp-pl{flex:1 1 100%}
  .nsp-pl small{display:none}
  .nsp-grp{margin:12px -14px -14px}
  .nsp.lfg6 .nsp-grp .mine .bar,.nsp.lfg6 .nsp-grp .mine.joined .bar,.nsp.lfg6 .nsp-grp .lfgm-inbox,.nsp.lfg6 .nsp-grp [data-lfgr-sido]{padding:10px 14px}
  /* valen (am-vad) */
  .nsp-vad{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px 12px;padding:0 16px}
  .nsp-vad::-webkit-scrollbar{display:none}
  .nsp.lfg6 .nsp-vad>button{flex:0 0 150px;padding:10px 12px}
  .nsp.lfg6 .nsp-vad>button b{font-size:13px}
  .nsp.lfg6 .nsp-vad>button small{font-size:11.5px}
  .nsp.lfg6 .nsp-vad>a.alla{flex:0 0 120px}
  .nsp.lfg6 .nsp-vad>a.lag{flex:0 0 170px;padding:10px 12px 10px 46px}
  .nsp-ev{flex-wrap:wrap;padding:12px 14px;margin-bottom:12px}
  .nsp-ev .kn{max-width:none;justify-content:flex-start;flex-basis:100%}
  .nsp-eg{text-align:left}
  /* listan (am-lfgl · am-lr) */
  .nsp-g{display:block}
  .nsp-dt{display:none}
  .nsp-th{display:none}
  .nsp-lg{padding:12px 12px 6px;font:700 10.5px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase}
  .nsp-lg b{font:inherit;color:var(--dim)}
  .nsp-lg span{display:none}
  .nsp-lr{grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"av t ac" "av mx ac";column-gap:10px;row-gap:1px;padding:9px 12px;min-height:0;border-bottom:0;border-top:1px solid var(--line)}
  .nsp-lr .lg,.nsp-lr .c2,.nsp-lr .c3,.nsp-lr .c4{display:none}
  .nsp-lr .nm{display:contents}
  .nsp-lr .nm>.nsp-av{grid-area:av;--s:40px;--f:13px;align-self:center}
  .nsp-lr .nm>span{grid-area:t;align-self:end;min-width:0}
  .nsp-lr .nm small{display:none}
  .nsp-lr .mx{display:block;grid-area:mx;align-self:start;min-width:0}
  .nsp-lr .mx small{display:block;font-size:11.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .nsp-lr .mx .nsp-ps,.nsp-lr .mx .nsp-ok,.nsp-lr .mx .nsp-kanske,.nsp-lr .mx .nsp-nej{font-weight:400}
  .nsp-lr .mx .nsp-ps.acc{color:var(--accent-ink)}
  .nsp-lr .ac{grid-area:ac;align-self:center}
  /* arket (am-sheet) */
  .nsp-ark{display:block;position:fixed;inset:0;z-index:80}
  .nsp-ark[hidden]{display:none!important}
  .nsp-ark .bg{position:absolute;inset:0;background:rgba(0,0,0,.45)}
  .nsp-ark .in{position:absolute;left:0;right:0;bottom:0;max-height:86vh;overflow-y:auto;background:var(--card);border-radius:16px 16px 0 0;box-shadow:0 -10px 30px rgba(0,0,0,.35);padding-bottom:calc(16px + env(safe-area-inset-bottom))}
  .nsp.lfg6 .nsp-ark .grip{display:block;width:100%;height:22px;border:0;background:none;padding:10px 0 0;cursor:pointer}
  .nsp-ark .grip::before{content:"";display:block;width:40px;height:4px;margin:0 auto;border-radius:2px;background:var(--line2)}
  .nsp-ark .nsp-dtin{padding:12px 16px 16px}
  html.nsp-arkopen,html.nsp-arkopen body{overflow:hidden}
}