youtube home サムネイルたくさん表示 by buhoho

/* ==UserStyle==
@name           YouTube Dynamic Grid Columns (Responsive - Direct Set v2)
@namespace      userstyles.world/user/buhoho
@version        20250424.22.27
@description    Adjusts video columns on YouTube home/subscriptions based on viewport width (Directly sets variable). Adjusted breakpoints based on zoom levels.
@author         buhoho
@match          https://www.youtube.com/*
@grant          none
==/UserStyle== */

@-moz-document url-prefix("https://www.youtube.com") {


/* --- ▼▼▼ ブレークポイントと列数の目安 (コメント) ▼▼▼ --- */
/* 実際の挙動はこの下の @media ルールで決まります */
/* ~ 1199px      : YouTube Default (or specify below) */
/* 1200px ~ 1599px : 4 columns (e.g., 100% zoom on ~1470px width) */
/* 1600px ~ 2099px : 5 columns (e.g., 90% or 80% zoom on ~1470px base) */
/* 2100px ~      : 6 columns (e.g., further zoom out) */
/* --- ▲▲▲ 目安ここまで ▲▲▲ --- */


/* --- スタイル適用ルール --- */

/* デフォルト (狭い幅、または基本設定) */
/* YouTubeのデフォルト (通常3列) に任せる場合はこのブロック不要 */
/*
ytd-browse[page-subtype="home"] ytd-rich-grid-renderer,
ytd-browse[page-subtype="subscriptions"] ytd-rich-grid-renderer {
  --ytd-rich-grid-items-per-row: 3 !important;
}
*/

/* 基準の幅 (論理ピクセル幅 1200px 以上) */
@media (min-width: 1200px) {
  ytd-browse[page-subtype="home"] ytd-rich-grid-renderer,
  ytd-browse[page-subtype="subscriptions"] ytd-rich-grid-renderer {
    /* ↓↓↓ 1200px以上での列数 (100%ズーム時に適用される想定) ↓↓↓ */
    --ytd-rich-grid-items-per-row: 4 !important;
  }
}

/* 少し広い幅 (論理ピクセル幅 1600px 以上) */
@media (min-width: 1600px) {
  ytd-browse[page-subtype="home"] ytd-rich-grid-renderer,
  ytd-browse[page-subtype="subscriptions"] ytd-rich-grid-renderer {
    /* ↓↓↓ 1600px以上での列数 (90%, 80%ズーム時に適用される想定) ↓↓↓ */
    --ytd-rich-grid-items-per-row: 5 !important;
  }
}

/* さらに広い幅 (論理ピクセル幅 2100px 以上) */
/* (もし80%ズーム(1862px)でもっと列数を増やしたいなら、この値を1800pxなどに調整) */
@media (min-width: 2100px) {
  ytd-browse[page-subtype="home"] ytd-rich-grid-renderer,
  ytd-browse[page-subtype="subscriptions"] ytd-rich-grid-renderer {
    /* ↓↓↓ 2100px以上での列数 (さらに縮小した場合) ↓↓↓ */
    --ytd-rich-grid-items-per-row: 6 !important;
  }
}


/* (オプション) 動画タイトルが2行で表示されるように調整 */
ytd-browse[page-subtype="home"] #video-title.ytd-rich-grid-media,
ytd-browse[page-subtype="subscriptions"] #video-title.ytd-rich-grid-media {
  max-height: 3.2rem;
  -webkit-line-clamp: 2;
}

}