/* UTBRUTEN ur themes/forre_pulse/views/partials/pulse-topbar.php rad 1008 (2026-09-24, prestandapasset).
   Låg förut som inline <style> och skickades om i HTML:en på VARJE sidvisning;
   som fil cachas den av webbläsaren. Redigera HÄR — <link> sitter kvar på samma
   plats i partialen, så kaskadordningen är oförändrad. */
/* Aim Training-flik: subtil puls som signalerar nytt spel — smälter in bland övriga flikar */
.top .tab-aim{ position:relative; }
.top .tab-aim > i{ animation:aimTabPulse 2.6s ease-in-out infinite; transform-origin:center; }
.top .tab-aim:hover > i,
.top .tab-aim.on > i{ animation:none; }
.top .tab-aim .tab-new{
  position:absolute; top:-3px; right:-4px; z-index:2;
  font-size:8px; font-weight:800; letter-spacing:.03em; line-height:1;
  padding:2px 3px; border-radius:4px; color:#fff;
  background:var(--accent, #2796f2);
  animation:aimTabBadge 2.6s ease-in-out infinite;
}
.top .tab-aim.on .tab-new{ display:none; }
@keyframes aimTabPulse{
  0%,100%{ transform:scale(1); filter:none; }
  50%{ transform:scale(1.16); filter:drop-shadow(0 0 5px var(--accent, #2796f2)); }
}
@keyframes aimTabBadge{
  0%,100%{ box-shadow:0 0 0 0 var(--primary-glow, rgba(39,150,242,.5)); }
  55%{ box-shadow:0 0 0 5px transparent; }
}
@media (prefers-reduced-motion:reduce){
  .top .tab-aim > i, .top .tab-aim .tab-new{ animation:none; }
}

/* ============================================================
   VÄLKOMNANDE TOPBAR (2026-07-12) — INLINE i partialen med FLIT.
   pulse-topbar.css-filen synkade inte upp i denna session medan
   partialen gjorde det → kritiska stilar bor här så de alltid
   följer markupen. (Samma regler finns även i pulse-topbar.css.)
   ============================================================ */
/* Sökrutan får ALDRIG krympa när hälsnings-pillen tar plats. */
.top .search{ flex:0 0 auto; width:210px; }
/* Konto-pill: "Hej, <namn>" + streak/XP i stället för bara avatar. */
.top .me--greet{ display:flex; align-items:center; gap:10px; padding:5px 12px 5px 5px; border:1px solid var(--line); border-radius:30px; background:transparent; max-width:172px; }
.top .me--greet:hover{ background:var(--inset); border-color:var(--line2); }
.top .me--greet .av{ width:32px; height:32px; border-radius:50%; border:1px solid var(--line); background-color:var(--inset); background-size:cover; background-position:center; flex:0 0 auto; }
.top .me--greet .me-greet{ display:flex; flex-direction:column; line-height:1.16; min-width:0; }
.top .me--greet .mg-hi{ font-size:13px; font-weight:800; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top .me--greet .mg-wave{ font-weight:400; }
.top .me--greet .mg-sub{ display:flex; align-items:center; gap:5px; font-size:10.5px; font-weight:600; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top .me--greet .mg-sub--streak{ color:var(--gold); font-weight:700; }
.top .me--greet .mg-fire{ font-size:11px; color:var(--gold); }
.top .me--greet .mg-cev{ font-size:13px; color:var(--dim); flex:0 0 auto; }
/* ••• MER: radar + crew infällda som standard, visas vid .more-open. */
.top .right .tb-sec{ display:none; }
.top .right.more-open .tb-sec{ display:block; }
.top .more-btn .more-badge{ background:var(--accent); }
.top .right.more-open .more-btn{ color:var(--ink); background:var(--accent-wash); border-color:color-mix(in srgb,var(--accent) 35%,transparent); }
@media (max-width:1360px){
  .top .me--greet{ padding:4px; border:0; border-radius:50%; gap:0; max-width:none; }
  .top .me--greet:hover{ background:transparent; }
  .top .me--greet .me-greet, .top .me--greet .mg-cev{ display:none; }
  .top .me--greet .av{ width:36px; height:36px; border-width:2px; }
}
/* MOBIL dubbelmeny: dolj tema+crew ur ... (finns i drawern) -> ... = radar+tickets. 2026-07-12 */
@media(max-width:820px){
  .top .right .tgl{display:none}
  .top .right .crew-item{display:none}
}

/* ============================================================
   LFG-DROPDOWN I TOPBAREN (2026-07-16): pil + chatt-badge på tabben
   och undermeny i samma pulse-stil. Ärver tff-grundstilarna från
   pulse-topdeck.css; här bor LFG-varianten (accent, aldrig lila).
   ============================================================ */
/* Tabler-tab-ikoner (2026-07-18): samma storlek som bi hade i fallback-läget
   utan .tdk (topdeck-CSS:en sätter redan 15px via ".tdk .top .tab i"). */
.top .tab .ti{ font-size:20px; line-height:1; }
.top .tab .tab-car{ font-size:8.5px; margin-left:3px; color:var(--dim); transition:transform .15s ease, color .15s ease; vertical-align:middle; }
.top .tab:hover .tab-car{ color:var(--accent); }
.top .tab.fly-open .tab-car{ transform:rotate(180deg); color:var(--accent); }
.top .tab .tab-ct-chat{ background:var(--danger); display:inline-flex; align-items:center; gap:3px; }
.top .tab .tab-ct-chat i{ font-size:8px; }
/* Kompakt skala (2026-07-16, Kentas notering: menyerna var större än navbaren) —
   samma täthet som topbarens flikar: mindre brickor, mindre typsnitt, tightare rader. */
.tdk-lfgfly{ width:264px; padding:4px; }
.tdk-lfgfly .tff-h{ color:var(--accent-ink); display:flex; align-items:center; gap:6px; padding:7px 9px 4px; font-size:9.5px; letter-spacing:.08em; }
.tdk-lfgfly .tff-h::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--accent); flex:0 0 auto; }
.tdk-lfgfly .tff-row{ gap:8px; padding:6px 9px; border-radius:7px; }
.tdk-lfgfly .tff-l1 b{ font-size:12px; }
.tdk-lfgfly .tff-arch{ font-size:10.5px; margin-top:0; }
.tdk-lfgfly .tff-av.tff-lfgav{ width:26px; height:26px; border-radius:6px; background:var(--accent-wash); border:1px solid var(--line); color:var(--accent-ink); }
.tdk-lfgfly .tff-av.tff-lfgav i{ font-size:12px; }
.tdk-lfgfly .tff-row.tff-hot{ background:color-mix(in srgb, var(--danger) 6%, transparent); }
.tdk-lfgfly .tff-row.tff-hot:hover{ background:color-mix(in srgb, var(--danger) 11%, transparent); }
.tdk-lfgfly .tff-new{ display:inline-flex; align-items:center; gap:3px; background:var(--danger); color:#fff; font-size:9px; font-weight:800; border-radius:20px; padding:1px 7px; white-space:nowrap; flex:0 0 auto; }
.tdk-lfgfly .tff-new i{ font-size:8px; }
.tdk-lfgfly .tff-req{ color:var(--accent-ink); font-weight:800; font-style:normal; }
.tdk-lfgfly .tff-go{ font-size:11px; color:var(--dim); flex:0 0 auto; transition:transform .12s ease, color .12s ease; }
.tdk-lfgfly .tff-row:hover .tff-go{ transform:translateX(2px); color:var(--accent); }
.tdk-lfgfly .tff-more{ border-top:1px solid var(--line); border-radius:0 0 8px 8px; margin-top:4px; }
.tdk-lfgfly .tff-more .tff-l1 b{ color:var(--accent-ink); font-size:12px; }
/* Squad-dropdownen (delar tdk-lfgfly-stilarna): roll-chip i rubriken. */
.tdk-sqfly .tff-role{ margin-left:auto; font-size:9px; font-weight:800; letter-spacing:.06em; background:var(--inset); border:1px solid var(--line); border-radius:20px; padding:1.5px 8px; color:var(--ink2); text-transform:uppercase; }
.tdk-sqfly .tff-h{ display:flex; align-items:center; gap:6px; }
/* SQUAD-VÄLJAREN (2026-08-22): taggbricka i ikonrutan + "du är här"-raden.
   Taggen är samma identitetsspråk som chipet i topbaren (.pdk-sqtag) — squads
   känns igen på taggen i hela sajten, och en shield-ikon tre gånger i rad hade
   gjort raderna omöjliga att skilja åt i ögonvrån. 4 tecken är taket i en 26 px
   ruta; hela namnet står bredvid och hela taggen i title.
   Aktiv rad = ton på HELA ytan, aldrig en lodrät list (§0.5). */
.tdk-sqfly .tff-sqtag{ font-size:8.5px; font-weight:900; letter-spacing:0; line-height:1; max-width:100%; overflow:hidden; }
.tdk-sqfly .tff-row.is-nu{ background:var(--accent-wash); }
.tdk-sqfly .tff-row.is-nu .tff-l1 b{ color:var(--accent-ink); }
.tdk-sqfly .tff-har{ font-size:9px; font-weight:800; letter-spacing:.04em; color:var(--accent-ink); white-space:nowrap; flex:0 0 auto; }
/* `b` är ett flex-item och krymper inte under sitt innehåll utan detta —
   ett långt squadnamn hade knuffat ut "Du är här" ur rutan i stället för att
   själv få sina tre punkter. Ellipsen finns redan på .tff-l1 b; den behöver
   bara tillåtelse att slå till. */
.tdk-sqfly .tff-l1 b{ min-width:0; }

/* ══ D · SPEGELN — SQUAD-FLYOUTEN KOMPAKTERAD (2026-08-22, Kentas val) ══════
   Förlaga: design-proposals/dropdowns-v2-2026-08-22.html, vy D.
   Blocket ligger SIST och skriver bara över mått — inga färger, ingen logik.
   Rollback = radera blocket, allt ovanför är orört.

   Uppmätt före: 300 px bred, radie 12 (finns inte bland tokens: --r är 6),
   34 px-avatar, 13 px titel. Flikraden den hänger i har 10,5 px etikett och
   15 px ikon (pulse-topdeck.css:34-35). Menyn var alltså större än navbaren.

   Kvar att göra: den här panelen är den enda som fortfarande renderas i PHP.
   §0C R1 säger att det vi lagar blir React — squad-flyouten ska lyftas till
   samma Panel/FRad som flikpanelerna. Det är ett eget pass; det här är måtten. */
.tdk-finderfly.tdk-sqfly{ width:240px; padding:0; border-radius:var(--r); overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.30); }
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .tdk-finderfly.tdk-sqfly{ background:color-mix(in srgb, var(--card) 86%, transparent);
    -webkit-backdrop-filter:blur(16px) saturate(1.35); backdrop-filter:blur(16px) saturate(1.35); }
}
.tdk-sqfly .tff-h{ height:26px; padding:0 10px; font-size:9px; font-weight:800;
  letter-spacing:.13em; color:var(--faint);
  border-bottom:1px solid color-mix(in srgb, var(--line) 70%, transparent); }
.tdk-sqfly .tff-h::before{ display:none; }
.tdk-sqfly .tff-h + .tff-h{ border-top:1px solid color-mix(in srgb, var(--line) 70%, transparent); }
.tdk-sqfly .tff-role{ font-size:8.5px; padding:1px 6px; }
.tdk-sqfly .tff-row{ gap:6px; padding:4px 8px; border-radius:0;
  border-top:1px solid color-mix(in srgb, var(--line) 55%, transparent); }
.tdk-sqfly .tff-h + .tff-row{ border-top:0; }
.tdk-sqfly .tff-av.tff-lfgav{ width:20px; height:20px; border-radius:var(--r-sm); }
.tdk-sqfly .tff-av.tff-lfgav i{ font-size:11px; }
/* Taggen är 4 tecken (PHP kapar där) i en 20 px-ruta. 7,5 px klipper "4FUN"
   till "4FUI" — uppmätt i Chromium 2026-08-22. 7 px med negativ spärr ger
   4×~4,1 px = 16,4 px och ryms med marginal. */
.tdk-sqfly .tff-sqtag{ font-size:7px; letter-spacing:-.03em; }
.tdk-sqfly .tff-l1 b{ font-size:10.5px; font-weight:700; }
.tdk-sqfly .tff-arch{ font-size:9px; margin-top:0; }
.tdk-sqfly .tff-har{ font-size:8.5px; }
.tdk-sqfly .tff-new{ font-size:8px; padding:0 6px; }
/* Chevronen bar ingen information — hela raden är klickbar och hovern säger det.
   35 sådana räknades i menyfamiljen 2026-08-22. */
.tdk-sqfly .tff-go{ display:none; }
.tdk-sqfly .tff-more{ border-top:1px solid color-mix(in srgb, var(--line) 70%, transparent);
  border-radius:0; margin-top:0; height:26px; padding:0 10px; }
.tdk-sqfly .tff-more .tff-l1 b{ font-size:9px; font-weight:800; letter-spacing:.09em;
  text-transform:uppercase; color:var(--accent-ink); }
/* ── FORUM-DROPDOWN (2026-07-20): två grupper (Heta / Nytt) i tdk-lfgfly-basen.
   Rubriken bär en bi-ikon i stället för accent-pricken; "Nytt"-gruppen får en
   tunn skiljelinje. Ikonbrickorna färgas per grupp (hett = champ, nytt = accent). */
.tdk-fofly .tff-h{ color:var(--ink2); }
.tdk-fofly .tff-h::before{ display:none; }
.tdk-fofly .tff-h i{ font-size:11px; }
.tdk-fofly .tff-h-hot{ color:var(--champ); }
.tdk-fofly .tff-h-hot i{ color:var(--champ); }
.tdk-fofly .tff-h-new{ color:var(--accent-ink); border-top:1px solid var(--line); margin-top:4px; padding-top:8px; }
.tdk-fofly .tff-h-new i{ color:var(--accent); }
.tdk-fofly .tff-av.tff-hotav{ background:color-mix(in srgb, var(--champ) 14%, transparent); border-color:color-mix(in srgb, var(--champ) 28%, var(--line)); color:var(--champ); }
.tdk-fofly .tff-av.tff-newav{ background:var(--accent-wash); border-color:var(--line); color:var(--accent-ink); }
/* "NYTT" på FORUM-tabben: grön PRATBUBBLA (forum = diskussion) — geometrin (storlek/
   inline-läge) ärvs från ".tdk .top .tab .tab-ct". Tre runda hörn + ett spetsigt + liten
   svans nedåt-vänster = pratbubbla. Grön = nytt/färskt. Engångs-pop, ingen idle-animation.
   Göms av JS (hidden) när inget är oläst → ingen "0". */
.top .tab .tab-ct-fonew{ position:relative; color:#fff; background:var(--live,#22c55e); animation:tabFoPop .28s ease-out; }
/* Pratbubble-radie måste slå den enhetliga .tab-ct{border-radius:20px} → högre specificitet
   (.tab-ct.tab-ct-fonew). Tre runda hörn + spetsigt nedåt-vänster + svans = bubbla. */
.tdk .top .tab .tab-ct.tab-ct-fonew{ border-radius:8px 8px 8px 2px; }
.top .tab .tab-ct-fonew::after{ content:""; position:absolute; left:4px; bottom:-3px; width:0; height:0; border-style:solid; border-width:4px 4px 0 0; border-color:var(--live,#22c55e) transparent transparent transparent; }
@keyframes tabFoPop{ 0%{ transform:scale(.4); opacity:0; } 60%{ transform:scale(1.12); } 100%{ transform:scale(1); opacity:1; } }
@media (prefers-reduced-motion:reduce){ .top .tab .tab-car, .tdk-lfgfly .tff-go, .top .tab .tab-ct-fonew{ animation:none; } }

/* ══ MOCKUP 1 (test 2026-07-20, Kentas "testa 1an"): presence-pill + tre fria ikoner +
      avatar-only profil. Allt scopat till .tdk-split → återgång = sätt switchen false. ══ */
/* Göm hopslagna Klockan redan vid första paint (tdk-split sätts synkront före headern). */
.tdk-split .top .tdk-klocka-item{ display:none; }
/* De tre fria ikonerna: samma iconbtn-look som resten, tightare mellanrum. */
.tdk-split .top .right .tb-item .iconbtn{ width:36px; height:36px; }
/* Profil = BARA avatar i command-deck (samma grepp som mobil-regeln). */
.tdk .top .me--greet{ padding:4px; border:0; border-radius:50%; gap:0; max-width:none; }
.tdk .top .me--greet:hover{ background:var(--inset); }
.tdk .top .me--greet .me-greet, .tdk .top .me--greet .mg-cev{ display:none; }
.tdk .top .me--greet .av{ width:36px; height:36px; border-width:2px; }
/* (Presence-pill-CSS borttagen — pillen fick inte plats i topbaren, se not i markupen ovan.) */