トグラボです！
Apple Developer Programの登録用ページをAIに作らせていたら、スタイルがHTMLのインラインにベタ書きされていた。動くからそのままにしていたけど、きろくのページを増やそうとしたときに、どこをどう直せば全体に効くのか分からなくて手が止まった。さすがに面倒になったので整理した。
やったこと
- フォントの読み込み（SawarabiGothic の
@font-face）をcommon.cssに集約 - 囲みブロック（
.topocs-board）のフォントと行間を共通CSSに移動 - 各ページの
<style>を全部消してcommon.css参照に統一 - トップのカーテン文字のサイズ計算を、あちこちに書いていたのをやめて
main.jsのfitCurtainText()ひとつにまとめた
やること自体はただの移動作業なんだけど、消したら崩れるページがないか一枚ずつ見て回るのがだるかった。
パーツカタログ
ついでに、サイトで使っているパーツ（ボタン、囲み、見出し、ぶるぶる揺れるやつ）を1ページに並べたカタログを作った。新しいページを作るときはここからコピペすれば見た目が揃う。公開はしていない、手元用のメモみたいなもの。
ロゴ幅
ヘッダーのロゴが、768pxを境に幅 480px から 300px へ一段階でガクッと変わっていた。clamp(200px, 40vw, 480px) にして、画面幅に合わせてなめらかに縮むようにした。
まだ !important があちこち残っているし、CSSの設計としてきれいかというと微妙。とりあえず次に触るときの自分が困らない程度にはなった。