/* Utseende spesifikt for selve forsiden (index.html). Selve kortene/
   topplinjen/chip-raden kommer fra core/ui, se README.md i denne mappa. */

.home-stack{
  display:flex; flex-direction:column; gap:var(--space-6);
  padding:var(--space-6) 0 var(--space-9);
}

.home-stack section h2{ font-size:var(--text-lg); margin-bottom:var(--space-1); }

.home-empty{ color:var(--text-dim); text-align:center; padding:var(--space-6) 0; }

/* Sortering flyttet INN i søkepanelet igjen (Fase 5-revisjon, se
   core/search/search-panel.js) — `.sort-control` (egen alltid synlig rad,
   revisjon 5) er dermed fjernet. Delte skjul/vis-mekanikk med
   kategori/skjerm i stedet for en ekstra rad. */

/* Hjelper-boksen øverst (revisjon 6, erstatter tips-hylla fra revisjon 4
   OG den vanlige teksten fra revisjon 5) — inspirert av sikkerhetsvarselet
   (`.safety`, core/game-shell/game-shell.css: ikon i rund tile + tekst),
   men i merkefargen (ikke gult, som er reservert varsler), som en hel,
   klikkbar <button>, og holdt til ÉN LINJE (`.safety` sitt to-linjers
   oppsett tar for mye plass til en hjelper som ikke skal kreve
   oppmerksomhet) — kuttes med "…" på svært smale skjermer i stedet for å
   bryte til ny linje. `text-align:left` fordi knappe-nullstillingen i
   base.css ikke setter det selv. */
.settings-tip{
  display:flex; align-items:center; gap:var(--space-2);
  width:100%; text-align:left;
  padding:var(--space-2) var(--space-3);
  background:color-mix(in srgb, var(--aksent) 10%, var(--bg));
  border:var(--border-w) solid color-mix(in srgb, var(--aksent) 32%, transparent);
  border-radius:var(--radius-full);
}
.settings-tip:hover{ background:color-mix(in srgb, var(--aksent) 16%, var(--bg)); }
.settings-tip-icon{
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  width:28px; height:28px;
  font-size:0.9rem; line-height:1;
  border-radius:var(--radius-full);
  background:color-mix(in srgb, var(--aksent) 30%, var(--card));
}
.settings-tip-text{
  margin:0; flex:1; min-width:0;
  color:var(--text-dim); font-size:var(--text-sm);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.settings-tip-lead{ color:var(--aksent); }
.settings-tip-arrow{
  flex-shrink:0;
  color:var(--aksent); font-weight:700; font-size:var(--text-md);
}