/* tw-subset.css — 実際に使われている Tailwind ユーティリティだけを静的化したもの。 * * なぜ(2026-08-08): * 全501ページが で https://cdn.tailwindcss.com を読み込んでいた。 * これは **本番非推奨の開発用ビルド**で、407KB を転送したうえに * ブラウザ上で CSS をコンパイルする。 にあるためレンダリングを塞ぐ。 * トップページはサイトの全需要(12,206表示/月)を受けて8位で止まっており、 * ページ体験は順位シグナルなので、ここは落とす価値がある。 * * 作り方: * 全501ページの class 属性を走査して実使用クラスを抽出(144種)。 * assets/styles.css で定義済みのものを除き、残った標準ユーティリティのみ記述した。 * 値は Tailwind v3 の既定に合わせてある。 * preflight(リセット)は入れない。styles.css が独自にリセットを持っており、 * h1 等も常に class 付き(.site-title / .kanji-title)で preflight に依存していないため。 * * クラスを新しく使うときは、ここに追記するか styles.css に定義を書くこと。 * 未定義のまま使うと無言でスタイルが当たらない。 */ /* --- base ---------------------------------------------------------------- */ .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* --- layout -------------------------------------------------------------- */ .flex { display: flex; } .items-center { align-items: center; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .gap-2 { gap: 0.5rem; } .mx-auto { margin-left: auto; margin-right: auto; } .max-w-xs { max-width: 20rem; } /* --- spacing ------------------------------------------------------------- */ .mb-1 { margin-bottom: 0.25rem; } .mb-2 { margin-bottom: 0.5rem; } .mb-3 { margin-bottom: 0.75rem; } .mb-4 { margin-bottom: 1rem; } .mb-6 { margin-bottom: 1.5rem; } .mb-8 { margin-bottom: 2rem; } .mt-2 { margin-top: 0.5rem; } .mt-4 { margin-top: 1rem; } .mt-6 { margin-top: 1.5rem; } .pb-2 { padding-bottom: 0.5rem; } .px-2 { padding-left: 0.5rem; padding-right: 0.5rem; } .py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; } .space-y-1 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.25rem; } /* --- typography ---------------------------------------------------------- */ .text-xs { font-size: 0.75rem; line-height: 1rem; } .text-sm { font-size: 0.875rem; line-height: 1.25rem; } .text-base { font-size: 1rem; line-height: 1.5rem; } .text-xl { font-size: 1.25rem; line-height: 1.75rem; } .text-2xl { font-size: 1.5rem; line-height: 2rem; } .font-bold { font-weight: 700; } .leading-relaxed { line-height: 1.625; } .text-center { text-align: center; } .underline { text-decoration-line: underline; } /* --- lists --------------------------------------------------------------- */ .list-disc { list-style-type: disc; } .list-decimal { list-style-type: decimal; } .list-inside { list-style-position: inside; } /* --- colors (Tailwind v3 既定値) ----------------------------------------- */ .text-gray-400 { color: #9ca3af; } .text-gray-500 { color: #6b7280; } .text-gray-600 { color: #4b5563; } .text-gray-700 { color: #374151; } .text-stone-700 { color: #44403c; } .text-stone-800 { color: #292524; } .text-green-600 { color: #16a34a; } .text-red-500 { color: #ef4444; } .text-red-600 { color: #dc2626; } .text-orange-600 { color: #ea580c; } /* サイト独自configも同値 */ .bg-orange-100 { background-color: #ffedd5; } .bg-red-100 { background-color: #fee2e2; } .bg-white\/50 { background-color: rgb(255 255 255 / 0.5); } /* --- borders / effects --------------------------------------------------- */ .border-b { border-bottom-width: 1px; border-bottom-style: solid; } .border-none { border-style: none; } .rounded { border-radius: 0.25rem; } .shadow-none { box-shadow: 0 0 #0000; } .opacity-70 { opacity: 0.7; } /* --- transforms / transitions -------------------------------------------- */ .transform { transform: translate(var(--tw-translate-x, 0), var(--tw-translate-y, 0)) rotate(var(--tw-rotate, 0)); } .transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .duration-500 { transition-duration: 500ms; } .rotate-3 { --tw-rotate: 3deg; transform: translate(var(--tw-translate-x, 0), var(--tw-translate-y, 0)) rotate(3deg); } .hover\:rotate-0:hover { --tw-rotate: 0deg; transform: translate(var(--tw-translate-x, 0), var(--tw-translate-y, 0)) rotate(0deg); } .group:hover .group-hover\:translate-x-1 { --tw-translate-x: 0.25rem; transform: translate(0.25rem, var(--tw-translate-y, 0)) rotate(var(--tw-rotate, 0)); }