IKcoding-jp · IKcoding-jp · Aug 3, 2026 · Aug 3, 2026 · Aug 3, 2026
diff --git a/DESIGN.md b/DESIGN.md
diff --git a/app/assignment/components/AssignmentSettingsModal.tsx b/app/assignment/components/AssignmentSettingsModal.tsx
@@ -196,7 +196,7 @@ export function AssignmentSettingsModal({
                     options={memberOptions}
                     placeholder="選択..."
                     disabled={isLoading}
-                    className="!text-sm !py-2"
+                    className="text-sm! py-2!"
                   />
                   <Select
                     label="メンバー2"
@@ -205,7 +205,7 @@ export function AssignmentSettingsModal({
                     options={memberOptions}
                     placeholder="選択..."
                     disabled={isLoading}
-                    className="!text-sm !py-2"
+                    className="text-sm! py-2!"
                   />
                 </div>
 
@@ -247,7 +247,7 @@ export function AssignmentSettingsModal({
                           size="sm"
                           onClick={() => handleDelete(exclusion.id)}
                           disabled={isLoading}
-                          className="!p-1.5 !min-h-0 !text-red-500 hover:!text-red-700 hover:!bg-red-50"
+                          className="!p-1.5 min-h-0! !text-red-500 hover:!text-red-700 hover:!bg-red-50"
                           aria-label="削除"
                         >
                           <HiTrash className="w-4 h-4" />

diff --git a/app/assignment/components/assignment-table/DesktopTableBody.tsx b/app/assignment/components/assignment-table/DesktopTableBody.tsx
@@ -116,10 +116,10 @@ export const DesktopTableBody: React.FC<DesktopTableBodyProps> = ({
                     onTouchMove={handleCellTouchMove}
                     onClick={() => handleCellClick(team.id, label.id)}
                     className={`
-                                                !min-h-0 w-full py-2 md:py-3 px-1 !rounded-lg text-sm md:text-base !font-bold text-center transition-all truncate select-none
+                                                min-h-0! w-full py-2 md:py-3 px-1 rounded-lg! text-sm md:text-base !font-bold text-center transition-all truncate select-none
                                                 ${member && isSelected ? 'shadow-md scale-105' : ''} ${
-                                                  !member && isSelected ? '!bg-surface !border-spot' : ''
-                                                } ${!member && !isSelected ? '!text-ink-muted !bg-ground !border-dashed !border-edge-strong hover:!bg-ground/80 !shadow-none' : ''}
+                                                  !member && isSelected ? 'bg-surface! !border-spot' : ''
+                                                } ${!member && !isSelected ? '!text-ink-muted !bg-ground !border-dashed border-edge-strong! hover:!bg-ground/80 !shadow-none' : ''}
                                             `}
                   >
                     {member ? member.name : '未割当'}

diff --git a/app/assignment/components/assignment-table/DesktopTableFooter.tsx b/app/assignment/components/assignment-table/DesktopTableFooter.tsx
@@ -49,7 +49,7 @@ export const DesktopTableFooter: React.FC<DesktopTableFooterProps> = ({
               if (e.key === 'Enter') handleAddTaskLabel();
             }}
             placeholder={`${headerLabels.left}を入力`}
-            className="!p-2 !text-sm !min-h-0 !text-center"
+            className="!p-2 text-sm! min-h-0! !text-center"
           />
         </div>
       ) : (
@@ -66,7 +66,7 @@ export const DesktopTableFooter: React.FC<DesktopTableFooterProps> = ({
             size="sm"
             onClick={handleAddTaskLabel}
             disabled={!newLeftLabel.trim()}
-            className="!rounded-full !px-4 shadow-md active:scale-95"
+            className="rounded-full! px-4! shadow-md active:scale-95"
           >
             <MdAdd size={18} />
             <span className="font-medium text-sm">担当を追加</span>
@@ -77,7 +77,7 @@ export const DesktopTableFooter: React.FC<DesktopTableFooterProps> = ({
           size="sm"
           onClick={onShuffle}
           disabled={isShuffleDisabled}
-          className="!rounded-full !px-4 shadow-md active:scale-95"
+          className="rounded-full! px-4! shadow-md active:scale-95"
         >
           <PiShuffleBold className="w-5 h-5" />
           <span className="font-medium text-sm">シャッフル</span>
@@ -93,7 +93,7 @@ export const DesktopTableFooter: React.FC<DesktopTableFooterProps> = ({
               if (e.key === 'Enter') handleAddTaskLabel();
             }}
             placeholder={`${headerLabels.right}を入力`}
-            className="!min-w-0 !p-2 !text-center !text-sm !min-h-0 w-full"
+            className="min-w-0! !p-2 !text-center text-sm! min-h-0! w-full"
           />
         </div>
       ) : (

diff --git a/app/assignment/components/assignment-table/DesktopTableHeader.tsx b/app/assignment/components/assignment-table/DesktopTableHeader.tsx
@@ -71,7 +71,7 @@ export const DesktopTableHeader: React.FC<DesktopTableHeaderProps> = ({
           if (e.key === 'Escape') setIsAddingTeam(false);
         }}
         variant="dark"
-        className="!min-h-[30px] !w-20 !border-none !px-1 !py-1 !text-sm"
+        className="!min-h-[30px] !w-20 !border-none !px-1 py-1! text-sm!"
       />
       <IconButton variant="primary" size="sm" onClick={handleAddTeam} title="班を追加">
         <MdAdd size={18} />
@@ -142,7 +142,7 @@ export const DesktopTableHeader: React.FC<DesktopTableHeaderProps> = ({
             variant="outline"
             size="sm"
             onClick={() => setIsAddingTeam(true)}
-            className="!min-h-[34px] !text-sm md:!text-base !gap-1 !bg-transparent"
+            className="!min-h-[34px] text-sm! md:!text-base gap-1! !bg-transparent"
           >
             <MdAdd className="md:w-5 md:h-5" /> 最初の班を追加
           </Button>
@@ -170,7 +170,7 @@ export const DesktopTableHeader: React.FC<DesktopTableHeaderProps> = ({
                 onKeyDown={(e) => e.key === 'Enter' && handleUpdateTeam(team.id)}
                 onBlur={() => handleUpdateTeam(team.id)}
                 variant="light"
-                className="!text-sm md:!text-base"
+                className="text-sm! md:!text-base"
               />
             ) : (
               <div

diff --git a/app/assignment/components/assignment-table/MobileListView.tsx b/app/assignment/components/assignment-table/MobileListView.tsx
@@ -68,28 +68,28 @@ export const MobileListView: React.FC<MobileListViewProps> = ({
                     value={editLeftLabel}
                     onChange={(e) => setEditLeftLabel(e.target.value)}
                     placeholder={headerLabels.left}
-                    className="!p-2 !text-lg !font-bold !min-h-0"
+                    className="!p-2 !text-lg !font-bold min-h-0!"
                   />
                   <div className="flex gap-2">
                     <Input
                       value={editRightLabel}
                       onChange={(e) => setEditRightLabel(e.target.value)}
                       placeholder={headerLabels.right}
-                      className="flex-1 !p-2 !text-sm !min-h-0"
+                      className="flex-1 !p-2 text-sm! min-h-0!"
                     />
                     <Button
                       variant="success"
                       size="sm"
                       onClick={() => saveLabel(label.id)}
-                      className="!p-2 !min-h-0 shrink-0"
+                      className="!p-2 min-h-0! shrink-0"
                     >
                       <MdCheck size={20} />
                     </Button>
                     <Button
                       variant="danger"
                       size="sm"
                       onClick={() => handleDeleteTaskLabel(label.id)}
-                      className="!p-2 !min-h-0 shrink-0"
+                      className="!p-2 min-h-0! shrink-0"
                     >
                       <MdDelete size={20} />
                     </Button>
@@ -144,15 +144,15 @@ export const MobileListView: React.FC<MobileListViewProps> = ({
                         onTouchEnd={handleCellTouchEnd}
                         onTouchMove={handleCellTouchMove}
                         onClick={() => handleCellClick(team.id, label.id)}
-                        className={`!min-h-0 !rounded-md !px-2 !py-3 !shadow-none truncate select-none ${
+                        className={`min-h-0! rounded-md! !px-2 py-3! !shadow-none truncate select-none ${
                           member && isSelected
                             ? '!border-spot !bg-spot !text-on-spot ring-2 ring-spot/20'
                             : member
-                              ? '!border-edge !bg-surface hover:!bg-spot-surface'
+                              ? 'border-edge! bg-surface! hover:!bg-spot-surface'
                               : ''
                         } ${
-                          !member && isSelected ? '!bg-surface !border-spot' : ''
-                        } ${!member && !isSelected ? '!border-dashed !border-edge-strong !bg-surface !text-ink-muted' : ''}`}
+                          !member && isSelected ? 'bg-surface! !border-spot' : ''
+                        } ${!member && !isSelected ? '!border-dashed border-edge-strong! bg-surface! !text-ink-muted' : ''}`}
                       >
                         {member ? member.name : '未割当'}
                       </Button>

diff --git a/app/assignment/components/assignment-table/modals/ContextMenuModal.tsx b/app/assignment/components/assignment-table/modals/ContextMenuModal.tsx
@@ -67,7 +67,7 @@ export function ContextMenuModal({ data, state, setMemberMenu, callbacks }: Cont
                           setCurrent(null);
                         }
                       }}
-                      className="!py-2"
+                      className="py-2!"
                     />
                   </div>
                   <IconButton

diff --git a/app/assignment/components/assignment-table/modals/HeightSettingsModal.tsx b/app/assignment/components/assignment-table/modals/HeightSettingsModal.tsx
@@ -130,7 +130,7 @@ function HeightSettingsModalContent({
               setHeightConfig(null);
             }
           }}
-          className="!flex !items-center !justify-center !gap-1"
+          className="flex! items-center! !justify-center gap-1!"
         >
           <MdDelete size={18} />
           削除

diff --git a/app/assignment/components/assignment-table/modals/MemberSelectionModal.tsx b/app/assignment/components/assignment-table/modals/MemberSelectionModal.tsx
@@ -45,7 +45,7 @@ export function MemberSelectionModal({ data, state, callbacks }: MemberSelection
                         handleAddMember(current.taskLabelId, current.teamId);
                       }
                     }}
-                    className="!py-2 !text-sm"
+                    className="py-2! text-sm!"
                     autoFocus
                   />
                 </div>
@@ -71,7 +71,7 @@ export function MemberSelectionModal({ data, state, callbacks }: MemberSelection
                       callbacks.onUpdateMember(createEmptyAssignment(current.teamId, current.taskLabelId), member.id);
                       setCurrent(null);
                     }}
-                    className="flex-1 !justify-start !text-left !text-ink hover:!bg-ground"
+                    className="flex-1 !justify-start text-left! !text-ink hover:bg-ground!"
                   >
                     {member.name}
                   </Button>

diff --git a/app/assignment/components/assignment-table/modals/TeamActionModal.tsx b/app/assignment/components/assignment-table/modals/TeamActionModal.tsx
@@ -151,7 +151,7 @@ function TeamActionModalContent({
           size="sm"
           fullWidth
           onClick={handleDeleteTeamFromModal}
-          className="!flex !items-center !justify-center !gap-1"
+          className="flex! items-center! !justify-center gap-1!"
         >
           <MdDelete size={18} />
           削除

diff --git a/app/assignment/page.tsx b/app/assignment/page.tsx
@@ -73,7 +73,7 @@ export default function AssignmentPage() {
             variant="outline"
             size="sm"
             onClick={() => setIsSettingsModalOpen(true)}
-            className="!rounded-full !px-3 !py-2 shadow-md !bg-surface !text-ink-sub hover:!bg-ground !border !border-edge-strong"
+            className="rounded-full! px-3! py-2! shadow-md bg-surface! text-ink-sub! hover:bg-ground! border! border-edge-strong!"
             title="詳細設定"
           >
             <HiCog className="w-5 h-5" />
@@ -114,8 +114,8 @@ export default function AssignmentPage() {
           variant={data.manager ? 'outline' : 'primary'}
           size="md"
           onClick={() => setIsManagerDialogOpen(true)}
-          className={`!flex !items-center !gap-2 !px-4 !py-3 !rounded-lg shadow-lg ${
-            data.manager ? '!bg-surface hover:!bg-ground !border-edge' : ''
+          className={`flex! items-center! gap-2! px-4! py-3! rounded-lg! shadow-lg ${
+            data.manager ? 'bg-surface! hover:bg-ground! border-edge!' : ''
           }`}
         >
           {data.manager ? (

diff --git a/app/clock/page.tsx b/app/clock/page.tsx
@@ -258,7 +258,7 @@ export default function ClockPage() {
                 variant="primary"
                 size="sm"
                 onClick={enableAudio}
-                className="col-span-2 mt-1 w-full !min-h-11 !px-4 sm:col-span-1 sm:mt-0 sm:w-auto"
+                className="col-span-2 mt-1 w-full !min-h-11 px-4! sm:col-span-1 sm:mt-0 sm:w-auto"
                 style={{
                   backgroundColor: colors.accent,
                   color: '#FFFFFF',

diff --git a/app/contact/page.tsx b/app/contact/page.tsx
@@ -121,7 +121,7 @@ export default function ContactPage() {
             {/* エラーメッセージ */}
             {status === 'error' && errorMessage && (
               <div className="mb-6 p-4 bg-danger-subtle border border-danger rounded-lg flex items-start gap-3">
-                <HiExclamationCircle className="h-5 w-5 text-danger flex-shrink-0 mt-0.5" />
+                <HiExclamationCircle className="h-5 w-5 text-danger shrink-0 mt-0.5" />
                 <div>
                   <p className="text-danger font-medium">エラーが発生しました</p>
                   <p className="text-danger text-sm mt-1">{errorMessage}</p>

diff --git a/app/defect-beans/page.tsx b/app/defect-beans/page.tsx
@@ -190,7 +190,7 @@ export default function DefectBeansPage() {
                 size="sm"
                 onClick={toggleCompareMode}
                 title={compareMode ? '選択モード' : '比較モード'}
-                className="!px-3 !py-2 gap-1.5"
+                className="px-3! py-2! gap-1.5"
               >
                 <MdCompareArrows className="h-5 w-5" />
                 <span className="text-xs sm:text-sm">{compareMode ? '選択モード' : '比較'}</span>
@@ -201,7 +201,7 @@ export default function DefectBeansPage() {
                   size="sm"
                   onClick={handleShowCompare}
                   title="比較を表示"
-                  className="!px-3 !py-2 gap-1.5"
+                  className="px-3! py-2! gap-1.5"
                 >
                   比較 ({selectedIds.size})
                 </Button>
@@ -212,7 +212,7 @@ export default function DefectBeansPage() {
                   size="sm"
                   onClick={() => setShowAddForm(true)}
                   title="欠点豆を追加"
-                  className="!px-3 !py-2 gap-1.5"
+                  className="px-3! py-2! gap-1.5"
                 >
                   <HiPlus className="h-5 w-5" />
                   <span className="text-xs sm:text-sm">追加</span>

diff --git a/app/drip-guide/page.tsx b/app/drip-guide/page.tsx
@@ -21,7 +21,7 @@ export default function DripGuidePage() {
         right={
           <Link
             href="/drip-guide/new"
-            className="inline-flex items-center gap-2 bg-btn-primary hover:bg-btn-primary-hover text-btn-primary-text px-4 py-2 rounded-lg font-semibold transition-colors shadow-sm min-h-[44px]"
+            className="inline-flex items-center gap-2 bg-btn-primary hover:bg-btn-primary-hover text-btn-primary-text px-4 py-2 rounded-lg font-semibold transition-colors shadow-sm min-h-11"
           >
             <HiPlus size={20} />
             <span className="hidden sm:inline">新規レシピ</span>

diff --git a/app/error.tsx b/app/error.tsx
@@ -16,7 +16,7 @@ export default function Error({ reset }: { error: Error & { digest?: string }; r
         </Button>
         <Link
           href="/"
-          className="min-h-[44px] px-5 rounded-xl border border-edge text-ink text-[15px] font-semibold flex items-center"
+          className="min-h-11 px-5 rounded-xl border border-edge text-ink text-[15px] font-semibold flex items-center"
         >
           ホームへ
         </Link>

diff --git a/app/globals.css b/app/globals.css
@@ -1,5 +1,10 @@
 @import 'tailwindcss';
 
+/* 過去の仕様・計画・作業ログはクラス名の検出対象から外す。
+   古いクラス名を拾って未使用CSSが生成されるのを防ぐ */
+@source not '../docs';
+@source not '../.superpowers';
+
 :root {
   --background: #fdf8f0;
   --foreground: #171717;
@@ -480,6 +485,11 @@
   --font-mono: var(--font-geist-mono);
   --font-nunito: var(--font-nunito);
   --font-num: var(--font-outfit);
+  /* ブランド表記（ロゴ・スプラッシュ・ログイン/新規登録の見出し）用。
+     書体をクラス側の任意値で直接指定すると Tailwind v4 では font-weight として
+     解釈され効かないため、ここでユーティリティ化する
+     （コメント内にクラス名を書くと Tailwind が拾ってしまうので書かない） */
+  --font-brand: var(--font-inter);
 }
 
 /* stylelint-enable at-rule-no-unknown */

diff --git a/app/inventory/page.tsx b/app/inventory/page.tsx
@@ -131,7 +131,7 @@ export default function InventoryPage() {
                 setEditing(null);
                 setModalOpen(true);
               }}
-              className="!min-h-0 shrink-0 gap-1.5 !rounded-[10px] !px-4 !py-2 !text-sm"
+              className="min-h-0! shrink-0 gap-1.5 !rounded-[10px] px-4! py-2! text-sm!"
             >
               <MdAdd className="h-4 w-4" aria-hidden="true" />
               品目を追加

diff --git a/app/login/page.tsx b/app/login/page.tsx
@@ -92,7 +92,7 @@ function LoginForm() {
     <div className="flex min-h-screen items-center justify-center bg-page px-4">
       <div className="w-full max-w-md rounded-lg bg-surface p-8 shadow-md border border-edge">
         <div className="mb-8 flex flex-col items-center rounded-xl bg-[#3a261d] py-6 shadow-inner">
-          <h1 className="text-4xl font-bold tracking-tight text-header-text font-[var(--font-playfair)]">
+          <h1 className="text-4xl font-bold tracking-tight text-header-text font-brand">
             Roast<span className="text-header-accent">Plus</span>
           </h1>
         </div>

diff --git a/app/page.tsx b/app/page.tsx
@@ -194,7 +194,7 @@ export default function HomePage(_props: HomePageProps = {}) {
   return (
     <div
       className={`h-dvh flex flex-col overflow-hidden animate-home-page relative transition-colors duration-1000 bg-page text-ink ${
-        isChristmasMode ? 'bg-[radial-gradient(circle_at_center,_#0a2f1a_0%,_#051a0e_100%)]' : ''
+        isChristmasMode ? 'bg-[radial-gradient(circle_at_center,#0a2f1a_0%,#051a0e_100%)]' : ''
       }`}
     >
       {isChristmasMode && <Snowfall />}
@@ -212,7 +212,7 @@ export default function HomePage(_props: HomePageProps = {}) {
 
       {/* メインコンテンツ */}
       <main className="relative z-10 mx-auto w-full max-w-6xl px-4 pt-2 pb-2 sm:px-6 sm:pt-3 sm:pb-3 flex-1 min-h-0">
-        <div className="flex h-full flex-col gap-2 md:grid md:h-auto md:grid-cols-4 md:gap-4 md:[grid-auto-rows:1fr]">
+        <div className="flex h-full flex-col gap-2 md:grid md:h-auto md:grid-cols-4 md:gap-4 md:auto-rows-[1fr]">
           {visibleActions.map(({ key, title, label, description, href, icon: DefaultIcon, badge }, index) => {
             const Icon = isChristmasMode ? CHRISTMAS_ICONS[key] || DefaultIcon : DefaultIcon;