:root {
  /* Colors heretats de Qunnum (blaus foscos, que encaixen amb el blaugrana) */
  --bg: #000000;
  --panel: #050d22;
  --panel-2: #0a1a3d;
  --line: #13244a;
  --text: #eef3ff;
  --muted: #8794b4;
  --accent: #4b8fe8;
  --accent-2: #2967ba;
  --radius: 16px;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--text); }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 16px; line-height: 1.45; -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { width: 100%; max-width: 640px; margin: 0 auto; padding: 0 16px; }

/* Capçalera */
.top {
  position: sticky; top: 0; z-index: 5;
  background: rgba(0, 0, 0, .78); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.top-in { display: flex; align-items: center; justify-content: space-between; height: 60px; }
.left { display: flex; align-items: center; gap: 8px; min-width: 0; }
.menu { position: relative; }
.menu-btn {
  position: relative; width: 20px; height: 20px; padding: 0; display: grid; place-items: center; cursor: pointer;
  background: transparent; color: var(--muted); border: 1px solid transparent; border-radius: 50%;
}
/* zona de toc una mica més gran que la icona, perquè al mòbil es pugui prémer bé */
.menu-btn::before { content: ""; position: absolute; inset: -8px; }
.menu-btn:hover { color: var(--text); }
.menu-btn:hover, .menu-btn[aria-expanded="true"] { background: var(--panel-2); border-color: var(--line); }
.menu-panel {
  position: absolute; top: calc(100% + 10px); left: 0; z-index: 20; min-width: 120px; padding: 3px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, .6);
}
.menu-panel[hidden] { display: none; }
.menu-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 5px 6px; border-radius: 6px; font-size: 11px; color: var(--muted); cursor: pointer; }
.menu-item:hover { background: var(--panel-2); }
.menu-item input { position: absolute; opacity: 0; pointer-events: none; }
.switch { position: relative; width: 22px; height: 12px; border-radius: 999px; background: var(--line); transition: background .2s; flex: none; }
.switch::after { content: ""; position: absolute; top: 2px; left: 2px; width: 8px; height: 8px; border-radius: 50%; background: var(--muted); transition: transform .2s, background .2s; }
.menu-item input:checked + .switch { background: var(--accent-2); }
.menu-item input:checked + .switch::after { transform: translateX(10px); background: #fff; }
.menu-item input:focus-visible + .switch { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Fletxa per anar a dalt / a baix */
.jump {
  position: fixed; left: 50%; bottom: 20px; z-index: 15; transform: translateX(-50%);
  width: 46px; height: 46px; display: grid; place-items: center; cursor: pointer;
  background: rgba(10, 26, 61, .92); color: var(--text); border: 1px solid var(--accent-2); border-radius: 50%;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .6); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  transition: opacity .2s, transform .2s;
}
.jump[hidden] { display: none; }
.jump:hover { background: var(--accent-2); }
.jump.up svg { transform: rotate(180deg); }
/* Quan es puja, la fletxa va a dalt (just sota la barra superior) */
.jump.up { bottom: auto; top: 72px; }

.brand { display: flex; align-items: center; gap: 10px; color: var(--text); }
.brand:hover { text-decoration: none; }
.mark { width: 34px; height: 34px; border-radius: 50%; display: block; box-shadow: 0 0 0 1px var(--line); }
/* Nom com al logo del bàner: Arial/Helvetica, lletres espaiades, "FCB" en negreta i "IFY" normal, tot daurat */
.word { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 400; font-size: 20px; letter-spacing: .18em; color: #dfb53c; }
.word b { font-weight: 700; }
.refresh {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  background: var(--text); color: var(--bg); border: 0; border-radius: 999px;
  padding: 8px 16px; font: inherit; font-weight: 700; font-size: 15px;
}
.refresh:hover { background: #fff; }
.refresh .ico-stop { display: none; }
.refresh.loading { background: #d32f2f; color: #fff; }   /* V024: vermell més fosc perquè el text blanc es llegeixi bé (contrast 5:1) */
.refresh.loading .ico-stop { display: inline; }
.refresh.loading .ico-refresh { display: none; }
.actions { display: flex; align-items: center; gap: 10px; }
/* Temps des de l'última càrrega (a la dreta de Refresh) */
.elapsed { font-variant-numeric: tabular-nums; font-weight: 700; font-size: 12.6px; letter-spacing: .3px; padding: 5.4px 9px; border-radius: 999px; border: 1px solid currentColor; white-space: nowrap; }
.elapsed[hidden] { display: none; }
.elapsed.fresh { color: #a8e6b5; }
.elapsed.aging { color: #f3e19b; }
.elapsed.old { color: #f8c08f; }
.elapsed.stale { color: #f4a7a7; }
.elapsed.stopped { color: #ff3b30; }
.count { position: relative; display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 14px; }
.count-btn {
  display: inline-flex; align-items: center; gap: 4px; min-width: 70px; justify-content: space-between;
  background: var(--panel-2); color: var(--text); border: 1px solid var(--line); border-radius: 999px;
  padding: 7px 10px 7px 14px; font: inherit; font-size: 14px; cursor: pointer;
}
.count-btn:hover, .count-btn[aria-expanded="true"] { border-color: var(--accent); }
.count-menu {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 20; margin: 0; padding: 4px; list-style: none;
  min-width: 84px; background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .6);
}
.count-menu[hidden] { display: none; }
.count-menu li { padding: 7px 12px; border-radius: 8px; color: var(--text); font-size: 14px; cursor: pointer; text-align: right; }
.count-menu li:hover, .count-menu li.focus { background: var(--panel-2); }
.count-menu li[aria-selected="true"] { color: var(--accent); font-weight: 700; }

/* Capçalera: la mateixa imatge que el perfil d'X, com a màxim 900 px d'ample (300 px d'alt).
   Els costats segueixen el contorn de l'escut del logo (esquerra i dreta), amb una línia daurada fina. */
.hero { position: relative; max-width: 900px; margin: 0 auto; }
.hero img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 1; object-fit: cover;
  clip-path: polygon(89.68% 0.85%, 10.32% 0.85%, 10.13% 1.23%, 9.88% 1.80%, 9.61% 2.43%, 9.33% 3.00%, 9.07% 3.47%, 8.80% 3.83%, 8.52% 4.07%, 8.26% 4.30%, 7.98% 4.53%, 7.71% 4.80%, 7.44% 5.03%, 7.17% 5.23%, 6.90% 5.40%, 6.62% 5.50%, 6.36% 5.57%, 6.08% 5.60%, 5.81% 5.63%, 5.54% 5.63%, 5.27% 5.63%, 5.00% 5.63%, 4.72% 5.60%, 4.46% 5.57%, 4.18% 5.50%, 3.91% 5.40%, 3.64% 5.23%, 3.37% 5.00%, 3.10% 4.80%, 2.82% 4.67%, 2.56% 4.40%, 2.37% 5.30%, 2.19% 6.03%, 2.01% 6.87%, 1.83% 7.67%, 1.69% 8.47%, 1.58% 9.30%, 1.53% 10.10%, 1.58% 10.93%, 1.68% 11.73%, 1.81% 12.53%, 1.96% 13.37%, 2.11% 14.17%, 2.24% 15.00%, 2.38% 15.80%, 2.50% 16.63%, 2.61% 17.43%, 2.71% 18.23%, 2.80% 19.07%, 2.88% 19.87%, 2.96% 20.70%, 3.03% 21.50%, 3.10% 22.33%, 3.16% 23.13%, 3.20% 23.93%, 3.22% 24.77%, 3.23% 25.57%, 3.23% 26.40%, 3.23% 27.20%, 3.22% 28.00%, 3.21% 28.83%, 3.19% 29.63%, 3.16% 30.47%, 3.11% 31.27%, 3.08% 32.10%, 3.02% 32.90%, 2.97% 33.70%, 2.90% 34.53%, 2.83% 35.33%, 2.74% 36.17%, 2.66% 36.97%, 2.54% 37.80%, 2.43% 38.60%, 2.31% 39.40%, 2.18% 40.23%, 2.03% 41.03%, 1.89% 41.87%, 1.73% 42.67%, 1.57% 43.50%, 1.38% 44.30%, 1.18% 45.10%, 0.97% 45.93%, 0.74% 46.73%, 0.50% 47.57%, 0.24% 48.37%, 0.11% 48.77%, 0.11% 49.20%, 0.40% 50.00%, 0.63% 50.80%, 0.84% 51.63%, 1.04% 52.43%, 1.22% 53.27%, 1.34% 54.07%, 1.42% 54.90%, 1.46% 55.70%, 1.47% 56.50%, 1.47% 57.33%, 1.47% 58.13%, 1.48% 58.97%, 1.50% 59.77%, 1.53% 60.60%, 1.57% 61.40%, 1.60% 62.20%, 1.63% 63.03%, 1.67% 63.83%, 1.71% 64.67%, 1.76% 65.47%, 1.80% 66.30%, 1.86% 67.10%, 1.91% 67.90%, 1.99% 68.73%, 2.07% 69.53%, 2.17% 70.37%, 2.28% 71.17%, 2.39% 72.00%, 2.51% 72.80%, 2.63% 73.60%, 2.76% 74.43%, 2.89% 75.23%, 3.03% 76.07%, 3.18% 76.87%, 3.33% 77.67%, 3.51% 78.50%, 3.71% 79.30%, 3.94% 80.13%, 4.19% 80.93%, 4.46% 81.77%, 4.72% 82.57%, 5.00% 83.37%, 5.27% 84.20%, 5.56% 85.00%, 5.87% 85.83%, 6.20% 86.63%, 6.59% 87.47%, 7.02% 88.27%, 7.51% 89.07%, 8.06% 89.90%, 8.68% 90.70%, 9.41% 91.53%, 10.27% 92.33%, 11.23% 93.17%, 12.19% 93.97%, 13.02% 94.77%, 13.68% 95.60%, 14.14% 96.40%, 14.48% 97.20%, 14.76% 98.00%, 14.96% 98.60%, 15.14% 99.15%, 18.62% 97.63%, 22.11% 96.27%, 25.60% 95.07%, 29.08% 94.03%, 32.57% 93.15%, 36.06% 92.43%, 39.54% 91.87%, 43.03% 91.47%, 46.51% 91.23%, 50.00% 91.15%, 53.49% 91.23%, 56.97% 91.47%, 60.46% 91.87%, 63.94% 92.43%, 67.43% 93.15%, 70.92% 94.03%, 74.40% 95.07%, 77.89% 96.27%, 81.38% 97.63%, 84.86% 99.15%, 85.04% 98.60%, 85.24% 98.00%, 85.52% 97.20%, 85.86% 96.40%, 86.32% 95.60%, 86.98% 94.77%, 87.81% 93.97%, 88.77% 93.17%, 89.73% 92.33%, 90.59% 91.53%, 91.32% 90.70%, 91.94% 89.90%, 92.49% 89.07%, 92.98% 88.27%, 93.41% 87.47%, 93.80% 86.63%, 94.13% 85.83%, 94.44% 85.00%, 94.73% 84.20%, 95.00% 83.37%, 95.28% 82.57%, 95.54% 81.77%, 95.81% 80.93%, 96.06% 80.13%, 96.29% 79.30%, 96.49% 78.50%, 96.67% 77.67%, 96.82% 76.87%, 96.97% 76.07%, 97.11% 75.23%, 97.24% 74.43%, 97.37% 73.60%, 97.49% 72.80%, 97.61% 72.00%, 97.72% 71.17%, 97.83% 70.37%, 97.93% 69.53%, 98.01% 68.73%, 98.09% 67.90%, 98.14% 67.10%, 98.20% 66.30%, 98.24% 65.47%, 98.29% 64.67%, 98.33% 63.83%, 98.37% 63.03%, 98.40% 62.20%, 98.43% 61.40%, 98.47% 60.60%, 98.50% 59.77%, 98.52% 58.97%, 98.53% 58.13%, 98.53% 57.33%, 98.53% 56.50%, 98.54% 55.70%, 98.58% 54.90%, 98.66% 54.07%, 98.78% 53.27%, 98.96% 52.43%, 99.16% 51.63%, 99.37% 50.80%, 99.60% 50.00%, 99.89% 49.20%, 99.89% 48.77%, 99.76% 48.37%, 99.50% 47.57%, 99.26% 46.73%, 99.03% 45.93%, 98.82% 45.10%, 98.62% 44.30%, 98.43% 43.50%, 98.27% 42.67%, 98.11% 41.87%, 97.97% 41.03%, 97.82% 40.23%, 97.69% 39.40%, 97.57% 38.60%, 97.46% 37.80%, 97.34% 36.97%, 97.26% 36.17%, 97.17% 35.33%, 97.10% 34.53%, 97.03% 33.70%, 96.98% 32.90%, 96.92% 32.10%, 96.89% 31.27%, 96.84% 30.47%, 96.81% 29.63%, 96.79% 28.83%, 96.78% 28.00%, 96.77% 27.20%, 96.77% 26.40%, 96.77% 25.57%, 96.78% 24.77%, 96.80% 23.93%, 96.84% 23.13%, 96.90% 22.33%, 96.97% 21.50%, 97.04% 20.70%, 97.12% 19.87%, 97.20% 19.07%, 97.29% 18.23%, 97.39% 17.43%, 97.50% 16.63%, 97.62% 15.80%, 97.76% 15.00%, 97.89% 14.17%, 98.04% 13.37%, 98.19% 12.53%, 98.32% 11.73%, 98.42% 10.93%, 98.47% 10.10%, 98.42% 9.30%, 98.31% 8.47%, 98.17% 7.67%, 97.99% 6.87%, 97.81% 6.03%, 97.63% 5.30%, 97.44% 4.40%, 97.18% 4.67%, 96.90% 4.80%, 96.63% 5.00%, 96.36% 5.23%, 96.09% 5.40%, 95.82% 5.50%, 95.54% 5.57%, 95.28% 5.60%, 95.00% 5.63%, 94.73% 5.63%, 94.46% 5.63%, 94.19% 5.63%, 93.92% 5.60%, 93.64% 5.57%, 93.38% 5.50%, 93.10% 5.40%, 92.83% 5.23%, 92.56% 5.03%, 92.29% 4.80%, 92.02% 4.53%, 91.74% 4.30%, 91.48% 4.07%, 91.20% 3.83%, 90.93% 3.47%, 90.67% 3.00%, 90.39% 2.43%, 90.12% 1.80%, 89.87% 1.23%, 89.68% 0.85%); }
.hero-edge { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden; }
.hero-edge path { fill: none; stroke-linejoin: round; stroke-linecap: butt; }
.hero-edge .edge-o { stroke: #ac8530; stroke-width: 5.1; }
.hero-edge .edge-i { stroke-width: 3.6; stroke-linecap: round; }
/* Contorn amagat (gruix 0, com si fos transparent); per tornar-lo a mostrar, esborrar aquesta línia */
.hero-edge .edge-o, .hero-edge .edge-i { stroke-width: 0; }
/* Contorn: la vora fosca és un sol camí tancat (dalt, esquerra, baix i dreta), perquè els quatre vèrtexs coincideixin exactament;
   el nucli daurat són quatre trams amb els mateixos extrems i puntes rodones. El retall de la imatge segueix el mateix contorn. */
/* Línia de baix: còncava (el centre puja 24 de 300 unitats, 24 px a 900 px d'ample), amb el mateix gruix que les laterals i la de dalt (classes edge-o i edge-i). */

.intro { padding: 10px 0 6px; }
.intro h1 { margin: 0 0 4px; font-size: 18px; }
.intro p { margin: 0; color: var(--muted); font-size: 15px; }
.cats-wrap { position: relative; margin: 10px -16px 10px; }
.cats {
  display: flex; gap: 8px; margin: 0; padding: 0 16px; overflow-x: auto; scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.cats::-webkit-scrollbar { display: none; }
.cats a {
  flex: none; padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--panel);
  color: var(--muted); font-size: 14px; white-space: nowrap;
}
.cats a:hover { color: var(--text); text-decoration: none; border-color: var(--accent-2); }
.cats a[aria-current="page"] { background: var(--accent-2); border-color: var(--accent-2); color: #fff; }
/* Fletxes a les vores: només surten quan hi ha pestanyes amagades en aquell costat */
.cats-arrow {
  position: absolute; top: 0; bottom: 0; width: 44px; display: flex; align-items: center; padding: 0 6px;
  border: 0; color: var(--muted); cursor: pointer; z-index: 1;
}
.cats-arrow[hidden] { display: none; }
.cats-prev { left: 0; justify-content: flex-start; background: linear-gradient(to right, var(--bg) 45%, transparent); }
.cats-next { right: 0; justify-content: flex-end; background: linear-gradient(to left, var(--bg) 45%, transparent); }
.cats-arrow:hover { color: #fff; }

.status { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 14px; padding: 14px 0; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex: none; }
.status.busy .dot { animation: pulse 1.2s ease-in-out infinite; }
.status.done .dot { background: #3ecf8e; }
.status.done.stopped .dot { background: #ff3b30; }
@keyframes pulse { 50% { opacity: .25; } }

/* Targetes */
.feed { display: flex; flex-direction: column; }
.card { padding: 14px 0 18px; border-top: 1px solid var(--line); }
.card-title { font-size: 16px; line-height: 1.4; margin: 0; font-weight: 500; color: var(--text); overflow-wrap: anywhere; }
.card-title a { color: var(--text); }
.card-title > a:hover { color: #fff; text-decoration: none; }
/* Pantalles petites (mòbils i tauletes, fins a 1024 px d'ample): títol un punt més gran */
@media (max-width: 1024px) { .card-title { font-size: 19px; } }   /* 19 px des de la V009 del 23/10 (abans 18) */
.card:hover .thumb { border-color: var(--accent-2); }
.num { color: var(--muted); font-variant-numeric: tabular-nums; }   /* posició a la llista: #001 | */
.who { color: var(--accent); }
.who a { color: var(--accent); }
.who .nolink { color: #b9c3dc; }   /* nom de l'autor sense compte d'X: no és un enllaç */
.when { color: var(--muted); font-size: 14px; margin-bottom: 6px; }
.when b { color: var(--text); font-weight: 700; }
.when .src { font-weight: 700; }
.when a.src { color: var(--accent); }   /* mitjà enllaçat al seu compte d'X */
.when .site { color: var(--muted); }
.when .site:hover { color: var(--accent); }
@media (max-width: 1024px) { .when { font-size: 15px; } }   /* 15 px des de la V010 del 23/10 (abans 14): línia de sobre més llegible a mòbils i tauletes */
.thumb {
  display: block; margin-top: 10px; border: 1px solid var(--line); transition: border-color .2s; border-radius: var(--radius);
  overflow: hidden; background: var(--panel); position: relative; aspect-ratio: 1.91 / 1;
}
.thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.thumb .cap {
  position: absolute; left: 10px; bottom: 10px; max-width: calc(100% - 20px);
  background: rgba(0, 0, 0, .72); color: #fff; font-size: 13px; padding: 2px 8px; border-radius: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.thumb.noimg { aspect-ratio: auto; padding: 14px 16px; background: var(--panel-2); }
.thumb.noimg .cap { position: static; background: none; padding: 0; white-space: normal; font-size: 15px; }
.from { color: var(--muted); font-size: 13px; margin-top: 6px; }

.more {
  display: block; width: 100%; margin: 4px 0 24px; padding: 14px; cursor: pointer;
  background: var(--panel-2); color: var(--text); border: 1px solid var(--line); border-radius: 999px;
  font: inherit; font-weight: 700; font-size: 15px;
}
.more[hidden] { display: none; }
.more-refresh { display: flex; align-items: center; justify-content: center; gap: 8px; background: var(--text); color: var(--bg); border-color: var(--text); }
.more-refresh[hidden] { display: none; }
.more.more-refresh:hover { background: #fff; color: var(--bg); }
.more:hover { border-color: var(--accent); color: #fff; box-shadow: 0 0 18px rgba(75, 143, 232, .25); }
.empty { color: var(--muted); text-align: center; padding: 40px 0; }

.foot { color: var(--muted); font-size: 13px; padding-top: 24px; padding-bottom: 40px; margin-top: 8px; }
.foot p { margin: 0 0 6px; }
/* Peu com el de calculatest.com: "How does FCBIFY work?" i "Privacy" són desplegables */
.foot details summary { cursor: pointer; list-style: none; color: var(--muted); }
.foot details summary::-webkit-details-marker { display: none; }
.foot details summary::before { content: "▸"; display: inline-block; margin-right: 6px; transition: transform .15s; }
.foot details[open] summary::before { transform: rotate(90deg); }
.foot details ul { margin: 10px 0 0; padding-left: 18px; text-align: left; }
.foot details li { margin: 0 0 4px; line-height: 1.45; }
.foot-how { margin: 0 0 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.foot-how summary { display: block; width: max-content; max-width: 100%; margin: 0 auto; font-weight: 600; font-size: 14px; }
.foot-mid { text-align: center; margin-bottom: 14px; }
.foot-tag { color: var(--muted); }
.foot-nw { white-space: nowrap; }
/* Línia de baix: "© 2026 FCBIFY.com" tocant a l'esquerra i "X | Privacy" tocant a la dreta */
.foot-bot { display: flex; justify-content: space-between; align-items: center; font-size: 12px; white-space: nowrap; }
.foot-r { display: inline-flex; align-items: center; }
.foot-sep { margin: 0 8px; }
.foot-privbtn { background: none; border: 0; padding: 0; font: inherit; color: var(--muted); cursor: pointer; }
.foot-privbtn::before { content: "▸"; display: inline-block; margin-right: 6px; transition: transform .15s; }
.foot-privbtn[aria-expanded="true"]::before { transform: rotate(90deg); }
.foot-privbtn:hover { color: var(--text); }
.foot-privbox { margin-top: 10px; }
.foot-privbox ul { margin: 10px 0 0; padding-left: 18px; font-size: 13px; }
.foot-privbox li { margin: 0 0 4px; line-height: 1.45; }
.foot-hintro { margin: 10px 0 0; text-align: left; }
.foot-pintro { margin: 10px 0 0; text-align: left; font-size: 13px; font-weight: 600; }
.foot-contact { margin: 10px 0 0; text-align: left; font-size: 13px; }
.foot-upd { margin: 8px 0 0; text-align: left; font-size: 13px; }
.foot-x { display: inline-flex; vertical-align: -2px; color: var(--muted); }
.foot-x:hover, .foot-x:focus-visible { color: #fff; }

@media (max-width: 370px) {
  .word { display: none; }
}
/* De 371 a 385 px, quan surt el comptador ja no hi cap amb marge: només la icona "F" (sense la paraula "FCBIFY") */
@media (max-width: 385px) {
  .top-in:has(#elapsed:not([hidden])) .word { display: none; }
}
@media (max-width: 480px) {
  .word { font-size: 18px; }
  .left { gap: 4px; }

  .refresh span { display: none; }
  .refresh { padding: 9px; }
  .actions { gap: 8px; }
  .count-btn { min-width: 64px; padding: 7px 8px 7px 12px; }
  .elapsed { font-size: 11.4px; padding: 4.75px 6.65px; }
  .count-label { display: none; }   /* sense lloc per a "Show" al costat del comptador */
}

/* Mode diagnòstic (?debug) */
.srclog { font-size: 13px; color: var(--muted); margin: 0 0 12px; overflow-wrap: anywhere; }
.srclog summary { cursor: pointer; color: var(--text); }
.srclog ul { margin: 8px 0 0; padding-left: 18px; }
.srclog li { margin: 2px 0; }
.srclog i { color: #6aa5ec; font-style: normal; }   /* V024: més clar, es llegeix millor sobre negre */
.srclog .offlist { margin: 2px 0 6px; }
.srclog .offlist summary { color: var(--muted); font-size: 12px; }
.srclog .offlist ul { margin: 4px 0 0; padding-left: 16px; }
.srclog .offlist li { font-size: 12px; }
.srclog .expandall { margin: 8px 0 0; font: inherit; font-size: 12px; color: var(--text); background: none; border: 1px solid var(--muted); border-radius: 4px; padding: 2px 8px; cursor: pointer; }

/* V024: qui té activat "reduir el moviment" al sistema no veu animacions ni desplaçaments suaus */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}