/* 方向: 「ぷにぷに」の粘土世界（形・影・動きはD案 2026-08-29 のまま）
   色は2パレット制（2026-09-01 あきらさん選定）:
   ・既定 =「うすぞら」（案B。空色・参考アプリの色味を50代向けに白寄りへ）
   ・スキン「藍」= 旧D案の青緑。html[data-theme="ai"] で名札を丸ごと上書き（切替は設定の紙）
   枠線は最小限・影とふくらみで区切る・警告色は面で塗らずチップと数字だけ。
   コントラストは両パレットとも全ペア機械検証済み（最低4.59）。 */
:root{
  /* うすぞら（既定） */
  --ji-koi:#D9E7F6; --ji-naka:#E9F1FA; --ji-usu:#F4F8FC; --men:#FFFFFF;
  --moji:#28405F; --usumoji:#445D86; /* 補助は雲の上でも4.5:1を守る濃さ（2026-09-01 雲導入で半歩濃く。旧#46608A） */
  --ai:#3560AC; --ai-koi:#274B85; --ai-usu:#E7EEF9; --ai-akarui:#4374C8; --ai-shizumi:#28477E;
  --aka:#A63A26; --aka-men:#FBF4F2; --aka-men2:#F7E9E6;
  --ki:#7A5A10; --ki-men:#FDF6E4; --ki-men2:#F6EBCB;
  --chip1:#F2F7FD; --chip2:#E3EDF9;
  --waku:#C6D7EC;
  --kage-iro:53,96,172;      /* 影の色（三つ数字。黒影は使わない） */
  --shizumi-iro:40,71,126;   /* 主ボタンの沈み影の透け */
  --maku-iro:40,64,95;       /* 暗幕・シートの影 */
  --bar-akarui:#7FA8E8;      /* 時間の物差しの線の明るい端 */
  --usu-b-ji:#EBF2FA;        /* 小ボタンの地 */
  --in-ji:#FBFCFE;           /* 入力欄の地 */
  --obi-ji:rgba(244,248,252,.6); /* 下帯（薄氷） */
  --omo-hosoku:#E3EDF9;      /* 藍地ボタンの補足文字 */
  --toast-moji:#F4F8FC; --toast-undo:#A9CBF4;
  --kage1:0 2px 6px rgba(var(--kage-iro),.10);
  --kage2:0 1px 2px rgba(var(--kage-iro),.08), 0 10px 24px rgba(var(--kage-iro),.14);
  --puni:cubic-bezier(.34,1.56,.64,1);
}
/* スキン「藍」（旧D案の青緑。2026-08-29〜08-31の顔） */
html[data-theme="ai"]{
  --ji-koi:#DCEBEE; --ji-naka:#E9F2F3; --ji-usu:#F3F8F8;
  --moji:#28454C; --usumoji:#46626B; /* 同上（旧#4A666D） */
  --ai:#2F6B75; --ai-koi:#265860; --ai-usu:#E7F0F1; --ai-akarui:#38808C; --ai-shizumi:#234E56;
  --chip1:#F4F9FA; --chip2:#E3EEF0;
  --waku:#C9DBDE;
  --kage-iro:47,107,117;
  --shizumi-iro:35,78,86;
  --maku-iro:40,69,76;
  --bar-akarui:#5FAAB6;
  --usu-b-ji:#EDF4F5;
  --in-ji:#FBFDFD;
  --obi-ji:rgba(243,248,248,.6);
  --omo-hosoku:#E7F0F1;
  --toast-moji:#F3F8F8; --toast-undo:#9FD4DC;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%; background:var(--ji-koi)}
body{
  /* 空の雲（2026-09-01 あきらさん決定「雲あり」）: すりガラスの透け感を出す3つのにじみ。
     置き場所は柵つき＝上（.20）は表札の裏だけ（日付行y88pxより上で消える）・下（.18）は下帯の裏だけ・
     中（.10）はカードの中腹でどこに文字が来ても床4.5:1を守る薄さ。数値の根拠はDESIGN.md §1 */
  background:
    radial-gradient(320px 190px at 82% -60px, rgba(var(--kage-iro),.20), rgba(var(--kage-iro),0) 70%),
    radial-gradient(300px 200px at 60% calc(100% + 70px), rgba(var(--kage-iro),.18), rgba(var(--kage-iro),0) 70%),
    radial-gradient(340px 240px at 22% 52%, rgba(var(--kage-iro),.10), rgba(var(--kage-iro),0) 70%),
    linear-gradient(175deg, var(--ji-koi) 0%, var(--ji-naka) 46%, var(--ji-usu) 100%);
  color:var(--moji);
  font-family:"LINE Seed JP","Hiragino Kaku Gothic ProN",sans-serif; /* 2026-08-29 あきらさん選定（3書体見比べ→③） */
  line-height:1.7; font-size:16px;
  max-width:480px; margin:0 auto;
  min-height:100dvh; display:flex; flex-direction:column;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left);
}
button, input, label.b{font-family:inherit; color:inherit}

.head{padding:24px 20px 12px; text-align:center} /* 2026-08-30 あきらさん指示「中央に」 */
/* 看板＝白い表札に朱ハンコと藍の名前（2026-08-30 案D＝B+C あきらさん選定） */
.app-name{
  display:inline-flex; align-items:center; gap:10px;
  font-size:22px; font-weight:700; letter-spacing:.03em; color:var(--ai);
  background:rgba(255,255,255,.66); border-radius:999px; padding:9px 12px 9px 24px; /* 薄氷（2026-08-30 案E）。ハンコが右端になったぶん余白も左右入れ替え（2026-08-31） */
  -webkit-backdrop-filter:blur(14px) saturate(1.3); backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:0 10px 24px rgba(var(--kage-iro),.14), inset 0 1px 0 rgba(255,255,255,.85), inset 0 0 0 1px rgba(255,255,255,.45);
}
.hanko-mark{
  width:34px; height:34px; border-radius:50%; flex:0 0 auto;
  background:radial-gradient(circle at 38% 30%, #C7573F, #A63A26 68%);
  color:#fff; font-size:26px; font-weight:700; line-height:1; /* 「済」は朱丸いっぱいに（あきらさん指示） */
  display:flex; align-items:center; justify-content:center;
  transform:rotate(-8deg);
  box-shadow:0 3px 8px rgba(166,58,38,.35), inset 0 1px 0 rgba(255,255,255,.35);
}
.today{font-size:13px; color:var(--usumoji); font-variant-numeric:tabular-nums}
#dueCount{font-weight:700}
#dueCount.aru{color:var(--aka)}

main{flex:1; padding:0 12px 16px}
.list{list-style:none}

/* カード: 枠線なし・白いふくらみ。状態の色は面で塗らず右のチップだけ（D案の核） */
/* 薄氷（うすらい）: カードはうっすら透ける白＋すりガラス（2026-08-30 案E あきらさん選定。コントラスト全ペア機械検証済み・最低5.45） */
.card{
  background:rgba(255,255,255,.62); border-radius:18px;
  -webkit-backdrop-filter:blur(14px) saturate(1.3); backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:0 10px 24px rgba(var(--kage-iro),.12), inset 0 1px 0 rgba(255,255,255,.85), inset 0 0 0 1px rgba(255,255,255,.4);
  margin-bottom:14px; position:relative; overflow:hidden;
  transition:box-shadow 240ms ease;
}
.card-main{
  display:block; width:100%; text-align:left; background:none; border:none; position:relative;
  padding:15px 16px; font-size:16px; cursor:pointer; min-height:44px;
}
.card-main:focus-visible{outline:2px solid var(--ai); outline-offset:-2px; border-radius:18px}
.namae{font-weight:700; display:block; padding-right:64px}
.shita{display:flex; justify-content:space-between; align-items:center; font-size:13px; margin-top:4px}
.zenkai{color:var(--usumoji); font-variant-numeric:tabular-nums}
/* 残り日数＝ぷにチップ（状態はここと数字の色だけで語る） */
.nokoru{
  font-weight:700; font-variant-numeric:tabular-nums; font-size:14px;
  padding:4px 12px; border-radius:14px;
  background:rgba(255,255,255,.55); /* 薄氷: チップも半透明（2026-08-30） */
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 3px 8px rgba(var(--kage-iro),.10);
}
.card.kigire .nokoru{color:var(--aka); background:rgba(251,244,242,.75); box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 3px 8px rgba(166,58,38,.12)}
.card.chikai .nokoru{color:var(--ki); background:rgba(253,246,228,.75); box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 3px 8px rgba(122,90,16,.12)}
.card.daijoubu .nokoru{color:var(--usumoji); font-weight:700}
.card.hiraita{box-shadow:0 0 0 2px var(--ai), var(--kage2); overflow:visible} /* 大判子が縁で切れないように */
/* 開いたカードは項目名を大きく中央に（2026-08-26 あきらさん指示） */
.card.hiraita .namae{justify-content:center; padding-right:0; font-size:26px; color:var(--ai); letter-spacing:.02em}
/* 開いたカードは全部を中央の1本線に（2026-08-26 あきらさん指示「散らばって見づらい」） */
.card.hiraita .shita{display:none} /* 前回・残りは「時間の物差し」に引っ越し（2026-08-27） */
.card.hiraita .card-open .botans{justify-content:center}
.card.hanko .card-main{padding-right:76px}

.card-open{padding:0 16px 16px}
.botans{display:flex; gap:8px; margin-top:12px; flex-wrap:wrap}
.b{
  border-radius:999px; padding:10px 16px; font-size:14px; font-weight:700;
  border:1.5px solid var(--ai); color:var(--ai); background:var(--men);
  display:inline-flex; align-items:center; gap:6px; cursor:pointer; min-height:44px;
  transition:transform 220ms var(--puni);
}
.b:active{transform:scale(.96); transition-duration:90ms}
.b:focus-visible, .btn-add:focus-visible, .btn-settings:focus-visible{outline:2px solid var(--ai-koi); outline-offset:2px}
.b.omo{
  background:linear-gradient(180deg, var(--ai-akarui), var(--ai)); color:#fff;
  border:none; font-size:15px; padding:12px 20px;
  box-shadow:0 3px 0 var(--ai-shizumi), 0 8px 16px rgba(var(--shizumi-iro),.22);
}
.b.omo:active{transform:translateY(3px); box-shadow:0 0 0 var(--ai-shizumi), 0 3px 8px rgba(var(--shizumi-iro),.25)}
.b.usu{border:none; background:var(--usu-b-ji); color:var(--usumoji); font-weight:400; font-size:13px; padding:8px 14px; min-height:36px}
.memo{font-size:13px; color:var(--usumoji); margin-top:8px}
.history{list-style:none; margin-top:8px; font-size:13px; color:var(--usumoji);
  border-top:1px dashed var(--chip2); padding-top:8px; font-variant-numeric:tabular-nums}
.history li{padding:2px 0}
.hist-b{
  background:none; border:none; padding:6px 0; min-height:36px; font-size:13px; color:var(--moji);
  display:flex; align-items:center; gap:10px; cursor:pointer; font-variant-numeric:tabular-nums; width:100%; text-align:left;
}
.hist-b small{color:var(--ai); font-weight:700; font-size:12px; border:1.5px solid var(--ai); border-radius:999px; padding:0 8px; line-height:20px}
.hist-b:focus-visible{outline:2px solid var(--ai); outline-offset:2px; border-radius:6px}

/* 済ハンコ＝朱肉の粘土玉（D案。警告の赤とは正円＋白文字の形で区別） */
.sumi{
  position:absolute; top:50%; margin-top:-25px; right:14px; width:50px; height:50px;
  border-radius:50%; border:none; color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:36px; font-weight:700; line-height:1; /* 「済」は朱丸いっぱいに（2026-08-30 あきらさん指示・看板のハンコと同じ顔） */
  background:radial-gradient(circle at 38% 30%, #C7573F, #A63A26 68%);
  box-shadow:0 5px 12px rgba(166,58,38,.32), inset 0 2px 3px rgba(255,255,255,.35);
  transform:rotate(-8deg); pointer-events:none;
}
.sumi small{position:absolute; bottom:3px; font-size:8px; font-weight:400; color:#F7E9E6; text-shadow:0 0 3px rgba(166,58,38,.9)}
/* やった！ボタンの真上に押される大判子（2026-08-30 あきらさん選定＝8/29見本・案Aの動き。旧「ぽちゃん」は引退・§10参照） */
.sumi-big{
  position:absolute; left:50%; top:50%; width:118px; height:118px; margin:-59px 0 0 -59px;
  border-radius:50%; color:#fff; pointer-events:none;
  display:flex; align-items:center; justify-content:center;
  font-size:78px; font-weight:700; line-height:1;
  background:radial-gradient(circle at 38% 30%, #C7573F, #A63A26 68%);
  box-shadow:0 8px 20px rgba(166,58,38,.4), inset 0 2px 3px rgba(255,255,255,.35);
  transform:rotate(-8deg);
  will-change:transform, opacity;
  animation:stampNoru 950ms both; /* 2026-08-30「もっとゆっくり」→「もっと滑らかに」＝段階拍子をやめ、一筆の連続曲線に */
}
@keyframes stampNoru{
  0%{transform:rotate(-8deg) scale(3); opacity:0; animation-timing-function:cubic-bezier(.3,.1,.35,1)}
  76%{transform:rotate(-8deg) scale(.92); opacity:1; animation-timing-function:cubic-bezier(.34,1.56,.64,1)}
  100%{transform:rotate(-8deg) scale(1); opacity:1}
}
@media (prefers-reduced-motion: reduce){
  .sumi-big{animation:none}
  .card{transition:none}
  .b, .b.omo, .maru, .btn-add{transition:none}
  .b:active, .maru:active{transform:none}
  .mono-fill{transition:none}
}

.foot{
  position:sticky; bottom:0;
  background:var(--obi-ji); /* 薄氷: 下帯もひとまわり透明に（2026-08-30 案E） */
  -webkit-backdrop-filter:blur(18px) saturate(1.3); backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:0 -4px 16px rgba(var(--kage-iro),.08);
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  display:flex; gap:10px; align-items:center;
}
.btn-add{
  flex:1; border:none; border-radius:999px;
  background:linear-gradient(180deg, var(--ai-akarui), var(--ai)); color:#fff;
  padding:13px; font-weight:700; font-size:16px; cursor:pointer; min-height:48px;
  box-shadow:0 4px 0 var(--ai-shizumi), 0 10px 18px rgba(var(--shizumi-iro),.22);
  transition:transform 220ms var(--puni), box-shadow 220ms var(--puni);
}
.btn-add:active{transform:translateY(4px); box-shadow:0 0 0 var(--ai-shizumi), 0 3px 8px rgba(var(--shizumi-iro),.25); transition-duration:90ms}
.btn-settings{
  width:48px; height:48px; border:none; border-radius:999px;
  background:rgba(255,255,255,.62); color:var(--usumoji); font-size:18px; cursor:pointer; /* 薄氷（2026-08-30） */
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 6px 14px rgba(var(--kage-iro),.1);
}
.btn-settings:active{transform:scale(.94)}

.toast{
  position:fixed; left:0; right:0; margin:0 auto; width:max-content; max-width:min(90vw, 440px);
  bottom:calc(84px + env(safe-area-inset-bottom));
  background:var(--moji); color:var(--toast-moji); border-radius:16px;
  padding:10px 16px; font-size:14px; display:flex; gap:14px; align-items:center;
  box-shadow:0 8px 22px rgba(var(--maku-iro),.3); max-width:90%;
}
.toast button{
  background:none; border:none; color:var(--toast-undo); font-weight:700;
  font-size:14px; cursor:pointer; padding:6px;
  white-space:nowrap; flex-shrink:0;
}

/* ---------- 2日目: 仮の周期・提案・空のとき ---------- */
.namae{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.kari-chip{
  font-size:11px; font-weight:700; color:var(--ai); background:var(--ai-usu);
  border:none; border-radius:999px; padding:1px 9px; line-height:18px;
}
/* 時間の物差し（開いたカードの情報行。DESIGN.md §4.1・2026-08-27 あきらさん選定「案B＋じわっと伸びる線」） */
.mono{display:block; margin-top:4px}
.mono-shuki{display:block; text-align:center; font-size:13px; color:var(--usumoji); margin-top:10px}
.mono-line{display:flex; align-items:center; gap:10px; max-width:340px; margin:0 auto}
/* 白い小札→ぷにチップに衣替え（D案）: ラベル小さく上・数字太く下 */
.fuda{
  display:flex; flex-direction:column; align-items:center; flex:0 0 auto;
  background:linear-gradient(180deg, var(--chip1), var(--chip2));
  border:none; border-radius:14px; padding:6px 13px 7px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 3px 8px rgba(var(--kage-iro),.10);
}
.fuda-label{font-size:12px; color:var(--usumoji); line-height:1.4}
.fuda-value{font-size:15px; font-weight:700; color:var(--moji); font-variant-numeric:tabular-nums; line-height:1.4}
/* 上の一等地に置く「超過／残り」の窓＝ひとまわり大きく（2026-08-27 あきらさん指示「もっと目立たせて周期の位置に」） */
.fuda-naka{width:fit-content; min-width:104px; margin:0 auto 14px; padding:8px 22px 9px}
.fuda-naka .fuda-value{font-size:22px}
.card.kigire .fuda-naka{background:linear-gradient(180deg, var(--aka-men), var(--aka-men2)); box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 4px 10px rgba(166,58,38,.12)}
.card.chikai .fuda-naka{background:linear-gradient(180deg, var(--ki-men), var(--ki-men2)); box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 4px 10px rgba(122,90,16,.12)}
.card.kigire .fuda-naka .fuda-label{color:var(--aka)}
.card.kigire .fuda-naka .fuda-value{color:var(--aka)}
.card.chikai .fuda-naka .fuda-label{color:var(--ki)}
.card.chikai .fuda-naka .fuda-value{color:var(--ki)}
.mono-track{
  flex:1 1 auto; height:8px; border-radius:999px; border:none;
  background:var(--chip2); box-shadow:inset 0 1px 2px rgba(var(--kage-iro),.16);
  position:relative; overflow:hidden;
}
.mono-fill{
  position:absolute; top:0; left:0; bottom:0; width:0;
  background:linear-gradient(90deg, var(--bar-akarui), var(--ai));
  border-radius:999px; transition:width 600ms ease-out;
}
/* 超過は藍→赤のグラデ満タン（時間が安全→超過へ流れた印。D案見本の色） */
.card.kigire .mono-fill{background:linear-gradient(90deg, var(--ai-akarui), var(--aka))}
.teian{
  margin:0 12px 12px; padding:12px 14px; border-radius:14px;
  background:var(--ai-usu); border:none; color:var(--moji);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
/* バックアップおすすめの紙（案A・2026-09-01）。一覧の上・提案カードと同じ藍薄の地 */
.backup-teian{margin:0 0 14px}
.teian-text{font-size:14px; font-weight:700}
.teian .botans{margin-top:8px}
.teian .b.omo{font-size:14px; padding:9px 16px; min-height:40px}
.empty{color:var(--usumoji); font-size:14px; text-align:center; padding:40px 16px}
.b.aka{border:none; color:#fff; background:linear-gradient(180deg,#B54831,var(--aka)); box-shadow:0 3px 0 #7E2C1D}
.b.aka:active{transform:translateY(3px); box-shadow:0 0 0 #7E2C1D}

/* ---------- 項目を足す／編集する（下からせり上がる紙） ---------- */
.sheet-bg{
  position:fixed; inset:0; background:rgba(var(--maku-iro),.45); z-index:20;
  display:flex; align-items:flex-end; justify-content:center;
}
.sheet{
  width:100%; max-width:480px; max-height:92dvh; overflow:auto;
  background:var(--men); border-radius:24px 24px 0 0;
  padding:20px 20px calc(20px + env(safe-area-inset-bottom));
  box-shadow:0 -12px 36px rgba(var(--maku-iro),.24);
  animation:sheet-up 320ms var(--puni) both;
}
@keyframes sheet-up{from{transform:translateY(32px); opacity:0} to{transform:none; opacity:1}}
@media (prefers-reduced-motion: reduce){ .sheet{animation:none} }
.sheet-title{font-size:18px; font-weight:700; margin-bottom:12px}
.f{display:block; border:none; margin-bottom:16px; min-width:0}
.f-label{display:block; font-size:13px; font-weight:700; color:var(--usumoji); margin-bottom:6px}
.f-in{
  width:100%; font-size:16px; padding:10px 14px; min-height:48px;
  border:1.5px solid var(--waku); border-radius:14px; background:var(--in-ji); color:var(--moji);
}
.f-in:focus-visible{outline:2px solid var(--ai); outline-offset:1px; border-color:var(--ai)}
.f-inline{display:flex; align-items:center; gap:10px; margin-top:8px; font-size:15px}
.f-inline .f-in{width:auto; flex:1; min-width:0}
.f-num{max-width:120px; text-align:right; font-variant-numeric:tabular-nums}
.seg{
  display:flex; border:none; border-radius:999px; overflow:hidden; margin-bottom:10px;
  background:var(--chip2); box-shadow:inset 0 1px 3px rgba(var(--kage-iro),.14);
  padding:3px; gap:3px;
}
.seg-b{
  flex:1; padding:9px; min-height:44px; font-size:14px; font-weight:700;
  background:none; color:var(--ai); border:none; cursor:pointer; border-radius:999px;
}
.seg-b[aria-pressed="true"]{
  background:linear-gradient(180deg, var(--ai-akarui), var(--ai)); color:#fff;
  box-shadow:0 2px 6px rgba(var(--shizumi-iro),.25);
}
.seg-b:focus-visible{outline:2px solid var(--ai-koi); outline-offset:-3px}
.chips{display:flex; gap:8px; flex-wrap:wrap}
.chip{
  border:1.5px solid var(--waku); background:var(--men); color:var(--moji);
  border-radius:999px; padding:6px 14px; font-size:14px; min-height:36px; cursor:pointer;
}
.chip[aria-pressed="true"]{border-color:var(--ai); background:var(--ai-usu); color:var(--ai); font-weight:700}
.chip:focus-visible{outline:2px solid var(--ai); outline-offset:2px}
.hint{font-size:13px; color:var(--usumoji); line-height:1.6}
.hint strong{color:var(--ai)}
.chk{display:flex; align-items:center; gap:8px; font-size:14px; margin-top:10px; min-height:32px; cursor:pointer}
.chk input{width:20px; height:20px; accent-color:var(--ai)}
.f-error{color:var(--aka); font-size:14px; font-weight:700; margin:-6px 0 12px}
.sheet-actions{display:flex; gap:10px; margin-top:4px}
.sheet-actions .b.omo{flex:1; justify-content:center}
.danger{margin-top:24px; padding-top:16px; border-top:1px dashed var(--chip2)}
.del-confirm{margin-top:10px; font-size:14px; color:var(--aka); display:flex; flex-direction:column; gap:8px}
.del-confirm .botans{margin-top:0}

/* ---------- 候補カタログ・設定・初回 ---------- */
.tabs{margin-bottom:14px}
.cat-group{margin-bottom:14px}
.cat-group h3{font-size:13px; font-weight:700; color:var(--usumoji); margin-bottom:6px}
.cat-list{display:flex; flex-wrap:wrap; gap:8px}
.cat-b{
  border:none; background:linear-gradient(180deg, var(--chip1), var(--chip2)); color:var(--moji);
  border-radius:14px; padding:8px 14px; font-size:14px; min-height:44px; cursor:pointer;
  display:inline-flex; align-items:center; gap:8px; text-align:left;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 2px 6px rgba(var(--kage-iro),.10);
}
.cat-b small{font-size:12px; color:var(--usumoji); white-space:nowrap}
.cat-b:active{transform:scale(.97)}
.cat-b:focus-visible{outline:2px solid var(--ai); outline-offset:2px}
.cat-b[disabled]{opacity:.55; cursor:default; box-shadow:none; background:var(--chip2)}
.cat-b[disabled] small{color:var(--ai); font-weight:700}
.set-sec{margin-bottom:22px; padding-bottom:18px; border-bottom:1px dashed var(--chip2)}
.set-sec .botans{margin-top:10px}
.set-sec .b.usu{margin-top:8px}
.yakusoku{padding-left:1.2em; font-size:14px; line-height:1.8}
.yakusoku strong{color:var(--ai)}
.welcome{border-radius:24px; margin:0 12px 24px; align-self:center}
.welcome-text{font-size:15px; line-height:1.8; margin-bottom:18px}
.welcome-text strong{color:var(--ai)}
.welcome-btns{display:flex; flex-direction:column; gap:10px}
.welcome-btns .b{flex-direction:column; align-items:flex-start; gap:2px; padding:12px 18px; font-size:16px; border-radius:18px}
.welcome-btns .b small{font-size:12px; font-weight:400; opacity:.85}
.welcome-btns .b.omo small{color:var(--omo-hosoku)}
#welcomeBg{align-items:center}

/* ---------- 月カレンダー（見るだけ・2026-08-24。DESIGN.md §4.6） ---------- */
.view-seg{margin:0 4px 12px}
.cal-head{display:flex; align-items:center; gap:8px; margin:0 4px 8px}
.cal-title{flex:1; text-align:center; font-size:18px; font-weight:700; font-variant-numeric:tabular-nums}
.cal-nav{min-width:44px; justify-content:center; padding:8px}
.cal-back{text-align:center; margin-bottom:8px}
.cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:5px; margin:0 2px}
.cal-wd{font-size:12px; color:var(--usumoji); text-align:center; padding:2px 0}
.cal-blank{min-height:56px}
.cal-day{
  min-height:56px; background:var(--men); border:none; border-radius:12px;
  box-shadow:var(--kage1);
  padding:4px 5px 5px; font-family:inherit; cursor:pointer; text-align:left;
  display:flex; flex-direction:column; gap:1px; overflow:hidden;
}
.cal-day:focus-visible{outline:2px solid var(--ai); outline-offset:1px}
.cal-num{font-size:13px; color:var(--moji); font-variant-numeric:tabular-nums; line-height:1.3}
.cal-day.kyou{box-shadow:0 0 0 2px var(--ai), var(--kage1)}
.cal-day.kyou .cal-num{font-weight:700; color:var(--ai)}
.cal-day.erabi{background:var(--ai-usu)}
.cal-item{font-size:11px; line-height:1.35; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:700; max-width:100%}
.cal-item.kigire{color:var(--aka)}
.cal-item.chikai{color:var(--ki)}
.cal-item.daijoubu{color:var(--ai)}
.cal-more{font-size:11px; color:var(--usumoji); line-height:1.3}
.cal-sum{margin:10px 6px 0; font-variant-numeric:tabular-nums}
.day-pane{margin-top:16px}
.day-title{font-size:16px; font-weight:700; margin:0 4px 8px}
.day-list{list-style:none}
.day-row{
  background:var(--men); border:none; border-radius:16px;
  box-shadow:var(--kage1);
  padding:10px 12px; margin-bottom:8px; display:flex; align-items:center; gap:10px;
}
.day-row .dr-name{font-weight:700; font-size:15px; flex:1; min-width:0}
.day-row .dr-nokori{font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap}
.day-row.kigire .dr-nokori{color:var(--aka)}
.day-row.chikai .dr-nokori{color:var(--ki)}
.day-row.daijoubu .dr-nokori{color:var(--usumoji); font-weight:400}
.day-row .b.omo{font-size:14px; padding:9px 16px; min-height:40px; white-space:nowrap}
.day-empty{padding:8px 4px}

/* ---------- カードのボタンをわかりやすく（2026-08-22 検収反映） ---------- */
.b.futa{flex-direction:column; align-items:flex-start; gap:0; line-height:1.35; padding:9px 16px; text-align:left}
.b.futa small{font-size:11px; font-weight:400; color:var(--usumoji); white-space:normal}
.b.omo.futa small{color:var(--omo-hosoku)}
.b.omo.futa{padding:10px 20px}
.card-open .botans{align-items:stretch}
.setsumei{font-size:13px; font-weight:700; color:var(--moji); margin-top:14px}
/* やった！は丸い大ボタンを中央に（2026-08-25 あきらさん選定・案B「まんなかにどん」。DESIGN.md §4.1）
   D案: ぷにっと沈む粘土玉。押すと下影が縮み、離すとバネで戻る */
.maru-col{display:flex; flex-direction:column; align-items:center; gap:16px; margin-top:14px}
.maru{
  position:relative; /* 大判子（.sumi-big）の座席 */
  width:152px; height:152px; border-radius:50%; border:none; cursor:pointer;
  background:linear-gradient(180deg, var(--ai-akarui), var(--ai)); color:#fff; font-weight:700; font-size:24px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; flex:0 0 auto;
  line-height:1.25;
  box-shadow:0 6px 0 var(--ai-shizumi), 0 16px 28px rgba(var(--shizumi-iro),.26), inset 0 2px 3px rgba(255,255,255,.25);
  transition:transform 260ms var(--puni), box-shadow 260ms var(--puni);
}
.maru-ue{font-size:24px} /* 2026-08-29 あきらさん指示「やった！と同じ大きさに」 */
.maru:active{
  transform:translateY(5px) scale(.98);
  box-shadow:0 1px 0 var(--ai-shizumi), 0 6px 12px rgba(var(--shizumi-iro),.28), inset 0 2px 3px rgba(255,255,255,.25);
  transition-duration:90ms;
}
.maru:focus-visible{outline:2px solid var(--ai-koi); outline-offset:2px}
/* 子の段＝別の日にやった・編集を横並び（少し距離を置く。2026-08-29 あきらさん指示） */
.maru-shita{display:flex; gap:36px; align-items:center; justify-content:center}
/* 別の日にやった・編集＝小さめの白い粘土玉（控えめな親子） */
.maru-ko{
  width:80px; height:80px; font-size:13px;
  background:var(--men); color:var(--ai);
  box-shadow:0 4px 0 rgba(var(--kage-iro),.35), 0 10px 18px rgba(var(--kage-iro),.16), inset 0 1px 0 #fff;
}
.maru-ko:active{
  transform:translateY(4px) scale(.98);
  box-shadow:0 1px 0 rgba(var(--kage-iro),.35), 0 4px 8px rgba(var(--kage-iro),.18), inset 0 1px 0 #fff;
}
/* 編集＝いちばん控えめな粘土玉（2026-08-29「別の日にやったと同格に見える」の検収指摘。小さく・薄い藍鼠地・文字も小さく） */
.maru-edit{
  width:60px; height:60px; font-size:12px;
  background:linear-gradient(180deg, var(--chip1), var(--chip2)); color:var(--usumoji);
  box-shadow:0 3px 0 rgba(var(--kage-iro),.22), 0 8px 14px rgba(var(--kage-iro),.10), inset 0 1px 0 #fff;
}
.maru-edit:active{
  transform:translateY(3px) scale(.98);
  box-shadow:0 1px 0 rgba(var(--kage-iro),.22), 0 3px 6px rgba(var(--kage-iro),.12), inset 0 1px 0 #fff;
}

/* ---------- 冷蔵庫に貼る1枚（2026-08-30 おまけ。画面には出さず、印刷のときだけこの紙に切り替える）
   印刷はインクの世界＝面は塗らず、文字と細い罫線だけで語る（家のプリンタは背景色を刷らない設定が既定のため）。
   文字色は画面と同じ藍系・状態は「残り」列の文字色だけ（赤=超過・黄=近い）。 */
#printArea{display:none}
@page{size:A4; margin:14mm 12mm}
@media print{
  html{background:#fff}
  body{background:#fff; max-width:none; padding:0; display:block}
  body > :not(#printArea){display:none !important}
  #printArea{display:block; color:var(--moji); font-variant-numeric:tabular-nums}
  .pr-head{display:flex; align-items:baseline; justify-content:space-between; gap:12pt;
    border-bottom:2pt solid var(--ai); padding-bottom:6pt; margin-bottom:10pt}
  .pr-head h1{font-size:17pt; font-weight:700; letter-spacing:.02em}
  .pr-sub{font-size:9.5pt; color:var(--usumoji)}
  .pr-table{width:100%; border-collapse:collapse; font-size:10.5pt; line-height:1.5}
  .pr-table th{
    text-align:left; font-size:9pt; font-weight:700; color:var(--usumoji);
    border-bottom:1pt solid var(--ai); padding:3pt 6pt;
  }
  .pr-table td{border-bottom:.5pt solid var(--waku); padding:4.5pt 6pt; vertical-align:top}
  .pr-table tr{break-inside:avoid}
  .pr-name span{font-weight:700}
  .pr-name small{display:block; font-size:8.5pt; color:var(--usumoji)}
  .pr-kigire{color:var(--aka); font-weight:700}
  .pr-chikai{color:var(--ki); font-weight:700}
  .pr-daijoubu{color:var(--usumoji)}
  .pr-foot{margin-top:10pt; font-size:9pt; color:var(--usumoji)}
}