:root {
  --bg:       #0d0d0d;
  --surface:  #1a1a1a;
  --surface2: #222;
  --border:   #2d2d2d;
  --green:    #22c55e;
  --green-dk: #16a34a;
  --text:     #f0f0f0;
  --muted:    #888;
  --red:      #ef4444;
  --radius:   12px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; appearance: textfield; }

html { font-size: 16px; -webkit-text-size-adjust: 100%; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, 'Hiragino Kaku Gothic ProN', sans-serif;
  line-height: 1.5;
  padding-bottom: 100px;
}

/* ── Header ── */
.site-header {
  position: sticky;
  top: 0;
  background: #111;
  border-bottom: 1px solid var(--border);
  z-index: 100;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo {
  font-size: 1.2rem;
  font-weight: 900;
  letter-spacing: -.5px;
}
.logo span { color: var(--green); }

/* ── Cards ── */
.card {
  background: var(--surface);
  border-radius: var(--radius);
  padding: 16px;
  margin: 12px 16px 0;
}
.card-label {
  font-size: .75rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 12px;
}

/* ── Date Button ── */
.date-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--surface2);
  border: 2px solid var(--border);
  border-radius: 10px;
  padding: 12px 14px;
  cursor: pointer;
  width: 100%;
  -webkit-user-select: none;
  user-select: none;
}
.date-input {
  flex: 1;
  background: transparent;
  border: none;
  color: var(--text);
  font-size: 1rem;
  outline: none;
  cursor: pointer;
  min-width: 0;
  pointer-events: none;
}
.date-display {
  flex: 1;
  font-size: 1rem;
  font-weight: 700;
}
.date-chevron {
  font-size: 1.4rem;
  color: var(--muted);
  line-height: 1;
}
.date-input::-webkit-calendar-picker-indicator { display: none; }

/* ── Service Pills ── */
.service-pills {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.pill {
  background: var(--surface2);
  border: 2px solid var(--border);
  border-radius: 10px;
  padding: 12px 8px;
  text-align: center;
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
  color: var(--muted);
  transition: .15s;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.pill.active {
  border-color: var(--green);
  color: var(--green);
  background: #0d2d1a;
}

/* ── Number Inputs ── */
.input-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.input-row:last-child { border-bottom: none; }
.input-row label {
  font-size: 1rem;
  font-weight: 600;
  flex-shrink: 0;
}
.input-with-unit {
  display: flex;
  align-items: center;
  gap: 6px;
}
.input-with-unit input {
  background: var(--surface2);
  border: 2px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 1.1rem;
  font-weight: 700;
  padding: 8px 10px;
  text-align: right;
  width: 110px;
  outline: none;
  -webkit-appearance: none;
}
.input-with-unit input:focus { border-color: var(--green); }
.input-with-unit span { font-size: .9rem; color: var(--muted); }
.time-inputs { display: flex; align-items: center; gap: 6px; }
.time-inputs input { width: 64px; }
select {
  background: var(--surface2);
  border: 2px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 1rem;
  padding: 8px 10px;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
select:focus { border-color: var(--green); }

/* ── Text Input ── */
.text-input-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.text-input-row:last-child { border-bottom: none; }
.text-input-row label { font-size: 1rem; font-weight: 600; flex-shrink: 0; width: 80px; }
.text-input-row input {
  flex: 1;
  background: var(--surface2);
  border: 2px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 1rem;
  padding: 8px 10px;
  outline: none;
  -webkit-appearance: none;
}
.text-input-row input:focus { border-color: var(--green); }

/* ── Toggle ── */
.toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
}
.toggle-row:last-child { border-bottom: none; }
.toggle-row .label-group { display: flex; flex-direction: column; }
.toggle-row .label-group span:first-child { font-size: 1rem; font-weight: 600; }
.toggle-row .label-group span:last-child { font-size: .78rem; color: var(--muted); margin-top: 2px; }
.toggle {
  position: relative;
  width: 48px;
  height: 28px;
  flex-shrink: 0;
}
.toggle input { opacity: 0; width: 0; height: 0; }
.toggle-track {
  position: absolute;
  inset: 0;
  background: var(--border);
  border-radius: 28px;
  cursor: pointer;
  transition: .2s;
}
.toggle input:checked + .toggle-track { background: var(--green); }
.toggle-track::after {
  content: '';
  position: absolute;
  width: 22px;
  height: 22px;
  background: #fff;
  border-radius: 50%;
  top: 3px;
  left: 3px;
  transition: .2s;
}
.toggle input:checked + .toggle-track::after { transform: translateX(20px); }

/* ── Computed Stats ── */
.stats-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.stat-box {
  background: var(--surface2);
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}
.stat-box .stat-val {
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--green);
}
.stat-box .stat-lbl {
  font-size: .72rem;
  color: var(--muted);
  margin-top: 2px;
}

/* ── Preview ── */
.preview-box {
  background: var(--surface2);
  border-radius: 10px;
  padding: 14px;
  font-size: .92rem;
  line-height: 1.7;
  white-space: pre-wrap;
  word-break: break-all;
  color: var(--text);
  min-height: 80px;
}
.char-count {
  text-align: right;
  font-size: .75rem;
  color: var(--muted);
  margin-top: 6px;
}
.char-count.over { color: var(--red); }

/* ── Buttons ── */
.action-area {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.btn-post {
  display: block;
  width: 100%;
  background: var(--green);
  color: #000;
  border: none;
  border-radius: var(--radius);
  font-size: 1.1rem;
  font-weight: 900;
  padding: 18px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-post:active { opacity: .85; }
.btn-save {
  display: block;
  width: 100%;
  background: transparent;
  color: var(--muted);
  border: 2px solid var(--border);
  border-radius: var(--radius);
  font-size: 1rem;
  font-weight: 700;
  padding: 14px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-save:active { opacity: .75; }
.btn-secondary {
  display: inline-block;
  background: var(--surface2);
  color: var(--text);
  border: none;
  border-radius: 8px;
  font-size: .9rem;
  font-weight: 700;
  padding: 10px 20px;
  cursor: pointer;
  text-decoration: none;
}

/* ── Toast ── */
.toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(80px);
  /* v136: 緑→墨（8/24実機: 休憩中画面で緑トーストが緑の稼働再開ボタンと重なり混線。
     緑=「押せるもの」専用色へ純化。墨地でも浮くよう薄枠つき） */
  background: #26231e;
  color: #f5f2e6;
  border: 1px solid rgba(245,242,230,.28);
}
.toast.toast-error { background: var(--red); color: #fff; }
.toast {
  font-weight: 700;
  font-size: .95rem;
  padding: 12px 24px;
  border-radius: 20px;
  opacity: 0;
  transition: .3s;
  pointer-events: none;
  /* v86: 長文（位置情報の案内等）が画面からはみ出て読めなかった（えーくん実機7/21）
     →折り返し可に。v87: max-widthでなくwidthを明示指定（word-break併用時にmax-widthだけだと
     ブラウザが内容幅を極端に狭く見積もる既知のCSSの罠があり「7文字で折り返し」を引いた実機バグの
     原因だった。widthを明示すればその計算に頼らず確実な幅になる） */
  white-space: normal;
  word-break: break-word;
  width: calc(100% - 48px);
  box-sizing: border-box;
  text-align: center;
  line-height: 1.5;
  z-index: 2200;  /* css v206: ☁シート(2100)・修正シート(2000)より上（旧999=kmeditの中でトーストが隠れていた） */
}
/* v87: 重要な案内（特に位置情報）はユーザーを迷子にしかねないため自動で消さない。
   支配者はユーザー・消すのはユーザー（タイマー復帰UIと同じ原則をトースト全体に適用・えーくんGO 7/21）
   →v171(8/24)で精緻化: 対象は警告・案内（isError/sticky）だけ。完了報告=返事は2.6秒で自動閉じ */
.toast.show {
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
  transform: translateX(-50%) translateY(0);
}

/* ── History ── */
.history-list { padding: 0 16px; }
.history-item {
  background: var(--surface);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 10px;
}
.history-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.history-date { font-size: .8rem; color: var(--muted); }
.history-services { font-size: .75rem; color: var(--green); font-weight: 700; }
.history-earnings { font-size: 1.3rem; font-weight: 900; }
.history-sub { font-size: .82rem; color: var(--muted); margin-top: 2px; }
.history-delete {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1.1rem;
  cursor: pointer;
  padding: 4px 8px;
}

/* ── Graph ── */
.graph-section { padding: 0 16px; margin-bottom: 16px; }
.graph-title {
  font-size: .85rem;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 10px;
}
.bar-chart {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 160px;
}
.bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.bar {
  width: 100%;
  background: var(--green);
  border-radius: 4px 4px 0 0;
  min-height: 3px;
  opacity: .8;
}
.bar.today { opacity: 1; }
.bar-lbl { font-size: .65rem; color: var(--muted); }

/* ── Empty state ── */
.empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--muted);
}
.empty p:first-child { font-size: 1.1rem; margin-bottom: 8px; }
.empty p:last-child { font-size: .85rem; }

/* ── Footer ── */

/* ── PWA Install Overlay ── */
#pwa-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #0d0d0d;
  z-index: 9999;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 24px;
  overflow-y: auto;
}
.pwa-sheet {
  text-align: center;
  max-width: 360px;
  width: 100%;
  margin: auto 0;
  padding: 16px 0;
}
.pwa-emoji  { font-size: 4rem; margin-bottom: 12px; }
.pwa-brand  { font-size: 2.2rem; font-weight: 900; color: var(--green); margin-bottom: 4px; }
.pwa-sub    { font-size: .85rem; color: var(--muted); margin-bottom: 28px; }
.pwa-msg    { font-size: 1.1rem; font-weight: 700; line-height: 1.7; margin-bottom: 28px; }
.pwa-guide  {
  background: var(--surface);
  border-radius: 12px;
  padding: 18px 16px;
  margin-bottom: 20px;
  font-size: .92rem;
  line-height: 1.8;
  text-align: left;
}
.pwa-step   { padding: 4px 0; }
.pwa-skip {
  display: block;
  width: 100%;
  background: none;
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--muted);
  font-size: .95rem;
  cursor: pointer;
  padding: 12px;
  margin-top: 16px;
  text-align: center;
}

/* ── PWA hint banner ── */
#pwa-hint {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  padding: 10px 16px;
  font-size: .85rem;
  color: var(--muted);
  gap: 8px;
}
.pwa-hint-btn {
  background: none;
  border: none;
  color: var(--text);
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
  text-align: left;
  flex: 1;
}
.pwa-hint-close {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1.1rem;
  cursor: pointer;
  padding: 0 4px;
  flex-shrink: 0;
}

/* ── Nav tab ── */
.tab-nav {
  display: flex;
  border-bottom: 1px solid var(--border);
  margin: 0 16px 4px;
}
.tab-nav a {
  flex: 1;
  text-align: center;
  padding: 12px;
  font-size: .9rem;
  font-weight: 700;
  color: var(--muted);
  text-decoration: none;
  border-bottom: 2px solid transparent;
}
.tab-nav a.active {
  color: var(--green);
  border-bottom-color: var(--green);
}

/* ── Custom Calendar ── */
#cal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 400;
  display: none;
  align-items: flex-end;
}
#cal-sheet {
  background: var(--surface);
  border-radius: 20px 20px 0 0;
  /* v84: 左右6px=見本v10と同じ（16pxだとセルが約3px痩せて気温の右が切れる・12mini実機）。
     上下も圧縮=6週の月+週計帯でもスクロール無しで1画面（スクショで1ヶ月撮れる事が至上命題） */
  padding: 10px 6px calc(8px + env(safe-area-inset-bottom, 0px));
  width: 100%;
  /* v83: 全画面を覆って脱出不能になった対策。上限=上に必ず「外側タップで閉じる」逃げ場を残す。
     v84で中身を圧縮したのでスクロールは保険（6週+全週判子の最長ケース用） */
  max-height: 92vh;
  max-height: 92dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transform: translateY(100%);
  transition: transform .25s ease;
}
#cal-sheet.cal-open { transform: translateY(0); }
.cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}
.cal-header span {
  font-size: 1.05rem;
  font-weight: 700;
}
.cal-nav {
  background: var(--surface2);
  border: none;
  border-radius: 8px;
  color: var(--text);
  font-size: 1.15rem;
  width: 34px;
  height: 34px;
  cursor: pointer;
  line-height: 1;
  -webkit-tap-highlight-color: transparent;
}
.cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  margin-bottom: 3px;
}
.dow {
  font-size: .68rem;
  font-weight: 700;
  color: var(--muted);
  text-align: center;
  padding: 2px 0;
}
.dow.sun { color: #f87171; }
.dow.sat { color: #60a5fa; }
/* ===== v103: カレンダー刷新（見本v10=design_ref/calendar_mock_v10.html が正・スクショ前提） ===== */
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));  /* minmax(0,1fr)=中身で列が膨れて溢れるのを防ぐ */
  gap: 1px;  /* v88: 6週+全週帯の常時表示ぶん縦を回収 */
}
.cal-grid > * { min-width: 0; }
.cal-day {
  background: var(--surface2);
  border: 1px solid var(--border, #333);
  border-radius: 7px;
  color: var(--text);
  /* v87: 左だけ2px=気温列に+1pxの逃げ（右3pxは売上の余白として死守） */
  padding: 3px 3px 4px 2px;
  min-height: 56px;  /* v85→v88: 6週+全週帯の縦収支に合わせ再圧縮（内容量の実測下限は≈55px） */
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  width: 100%;
  overflow: hidden;
  font-variant-numeric: tabular-nums;
}
/* またぎ週の前月・翌月日=薄字で中身ごと見せる（週計に入っている事が目で分かる）。
   .28だと売上数字が読めない端末がある→.35（脇役感は維持） */
.cal-day.ghost { opacity: .35; }
/* v91: マークの役割を交換（えーくん8/7）: **枠=見てる日**（セル全体を囲む=「画面内にはこの日が
   表示されている」感）・**日付数字の緑判子=今日**（暦の基準点）。v84の全面塗り廃止は維持 */
.cal-day.selected { outline: 2px solid var(--green); outline-offset: -1px; }
.cal-day:active { opacity: .7; }
.cal-num { font-size: 13px; font-weight: 700; line-height: 1; }
.cal-day.sun .cal-num { color: #f87171; }
.cal-day.sat .cal-num { color: #60a5fa; }
.cal-day.today .cal-num {
  background: var(--green);
  color: #f5f2e6;
  border-radius: 5px;
  padding: 2px 5px;
  margin: -2px 0 0 -2px;
  align-self: flex-start;
}
/* v177: セル再構成（えーくんGO 8/31・見本=mock_calweek_v3.htmlの5番）。
   1行目=日付左+天気右端（space-between）・気温は2行目に横並び右寄せ・3行目=件数・4行目=売上 */
.cal-r1 { display: flex; align-items: center; justify-content: space-between; }
/* v176: 19px→17px→v177: 14px（セル再構成で日付の右に同居=脇役サイズ） */
.cal-wx { font-size: 14px; line-height: 1; display: inline-block; max-width: 21px; }
.cal-tmp {
  display: flex;
  justify-content: flex-end;  /* v177: 横並び右寄せ（旧: 縦積み） */
  /* v179: 件数とサイズ交換（えーくん8/31「気温は小さいほうが良い」=件数は稼ぎのデータ・気温は環境情報） */
  font-size: clamp(8px, 2.3vw, 9.5px);
  line-height: 1.2;
  font-weight: 400;
  white-space: nowrap;
  margin-top: 1px;
}
.cal-hi { color: #d2491e; }  /* v6で肉眼基準に調整した最高/最低の色 */
.cal-lo { color: #4a86d8; margin-left: 1px; }  /* v177: 最高と最低は近接（えーくん指定） */
/* v178: 件数・売上=右寄せ（えーくん8/31「1桁をそろえるとだいたい気持ちイイ」=tabular-numsと合わせ位が縦に揃う）
   v179: 気温とサイズ交換=件数の方を大きく（件数=稼ぎのデータ・気温=環境情報の格） */
.cal-cnt { font-size: clamp(9px, 2.6vw, 11px); color: var(--muted); line-height: 1.3; text-align: right; }
.cal-t1 { color: var(--muted); }  /* hi/lo無しの旧記録=単一気温フォールバック */
/* °は日本語フォントだと全角級に化ける端末がある（↑↓と同じ罠）→欧文フォント強制 */
.cal-tmp .deg { font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 700; }
.cal-amt {
  margin-top: auto;
  text-align: right;  /* v177中央→v178右寄せ復帰（1の位を縦に揃える・件数と同列） */
  font-weight: 700;
  /* v180: 金茶→Y3Kマゼンタ（えーくんGO 8/31・見本=mock_calweek_v4のE・和紙の実値はd-washi側）。
     桁数フィット案は却下=「安い日ほど大きい」逆転（9,850＞12,400に見える・v4実機評ｗ） */
  color: #e0489d;
  /* v180: 主役サイズを一段拡大（旧2.8vw/11.5px上限。aceの縮小=イレギュラー感はOK・えーくん8/31） */
  font-size: clamp(10px, 3vw, 12.5px);
  letter-spacing: -.03em;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.cal-amt.ace { color: #bf2b1f; font-size: clamp(8.5px, 2.4vw, 10px); }  /* 日売上10万以上=朱色縮小 */
/* 週計=墨帯に白抜きの判子チップ（罫線は悪手・v6確定） */
/* v86: 週計行をさらに圧縮（7月=5週全部に判子が付く月で数px溢れた・12mini実機8/6。
   文字サイズは据え置き=詰めるのは余白と判子の厚みだけ）。
   v88: 帯を全週固定幅+常時表示に（幅バラバラ・出たり消えたりがゴチャつきの元・えーくん8/7）。
   「週計」=帯の左端固定・金額=右寄せ・末尾「円・N日」は定幅→桁が違っても数字の位が縦に揃う */
.cal-wsub { grid-column: 1 / -1; display: flex; justify-content: flex-end; margin: 0 0 1px; }
/* v89: 丸ごと翌月の週=非表示のまま高さだけ確保（2週先まで見えるのは違和感・えーくん8/7。
   visibility:hidden=行の枠は残る→どの月も高さ固定を維持。hidden要素はタップも受けない） */
.cal-day.void, .cal-wsub.void { visibility: hidden; }
/* v90→v92: 月送り=本物のページスライド（iPhoneホーム画面方式・えーくん8/7）。
   22px滑りは「着地の間際しか見えない」→旧月クローンが画面外へ・新月が画面幅まるごと反対側から。
   viewport=窓（overflow:hiddenで滑走中の頭とお尻を隠す） */
.cal-viewport { position: relative; overflow: hidden; }
@keyframes calInL { from { transform: translateX(-100%); } to { transform: none; } }
@keyframes calInR { from { transform: translateX(100%); } to { transform: none; } }
@keyframes calOutL { to { transform: translateX(-100%); } }
@keyframes calOutR { to { transform: translateX(100%); } }
.cal-in-l { animation: calInL .32s ease-out; }
.cal-in-r { animation: calInR .32s ease-out; }
.cal-out { position: absolute; inset: 0; pointer-events: none; }
.cal-out-l { animation: calOutL .32s ease-out forwards; }
.cal-out-r { animation: calOutR .32s ease-out forwards; }
/* v93: メイン画面の日送りも同じページスライド（矢印・フリック共通・keyframesはカレンダーと共用）。
   day-outクローンはbody直下にmainのoffsetTopで重ねる→body相対の基準を明示 */
body { position: relative; }
/* v119: mainはBFC（flow-root）=先頭子のmargin-topが外へ相殺しない。理由: 日送りクローンは
   position:absolute=相殺しない構造→本物だけ相殺すると先頭要素（ダイヤル）がクローンで約12px下に
   落ちて見える（8/19実機「フリックの瞬間ダイヤルが下がる」の正体・崩れ感の一因） */
main { display: flow-root; }
.day-in-l { animation: calInL .32s ease-out; }
.day-in-r { animation: calInR .32s ease-out; }
.day-out { position: absolute; left: 0; right: 0; pointer-events: none; z-index: 5; }
.day-out-l { animation: calOutL .32s ease-out forwards; }
.day-out-r { animation: calOutR .32s ease-out forwards; }
/* v175: 週計帯=案3薄墨帯（えーくんGO 8/31・見本=design_ref/mock_calweek_v1.html）。
   旧=墨の反転帯に9px白抜き=老眼原則違反で「見づらい」。反転をやめ地の色+墨文字・金額14px。
   8/7の帯採用の本旨（常時表示・定幅・右寄せ=位が縦に揃う）は不変 */
.cal-chip {
  display: flex;
  align-items: baseline;
  width: 150px;
  /* v176: surface2はシート地と2%差=実質透明で「背景がない」実機評→一段濃いbgで薄墨の板を見せる */
  background: var(--bg);
  color: var(--text);
  border-radius: 5px;
  padding: 1px 8px 2px;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}
.cw-lbl { font-size: 10px; color: var(--muted); margin-right: auto; }
.cw-y { font-size: 14px; font-weight: 700; }
.cw-n { font-size: 10px; color: var(--muted); margin-left: 2px; }
/* 月計=下部の帳簿締め行（売上・件数・時給） */
.cal-total {
  margin-top: 4px;
  border-top: 2px solid var(--text);
  padding-top: 4px;
  display: flex;
  justify-content: space-around;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.cal-total > div { display: flex; flex-direction: column; }
.ct-lbl { font-size: 10px; font-weight: 600; color: var(--muted); letter-spacing: .15em; }
.ct-val { font-size: 18px; font-weight: 700; margin-top: 1px; }
.ct-val small { font-size: 11px; font-weight: 400; color: var(--muted); margin-left: 1px; }
.cal-foot { margin-top: 3px; text-align: center; font-size: 9px; color: var(--muted); letter-spacing: .2em; }

/* ── Timer ── */
.btn-timer-start {
  display: block;
  width: 100%;
  background: var(--green);
  color: #000;
  border: none;
  border-radius: 10px;
  font-size: 1.1rem;
  font-weight: 900;
  padding: 16px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-timer-start:active { opacity: .85; }
.timer-display {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0 14px;
}
.timer-icon { font-size: 1.4rem; line-height: 1; }
.timer-count {
  font-size: 2.4rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  line-height: 1;
}
.timer-count-pause { color: var(--muted); }
.timer-work-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 12px;
}
.timer-icon-sm { font-size: 1rem; }
.timer-count-sm {
  font-size: 1.1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}
.timer-work-label {
  font-size: .78rem;
  color: var(--muted);
  margin-left: 2px;
}
.alarm-row { margin-bottom: 14px; }
.alarm-set, .alarm-active {
  display: flex;
  align-items: center;
  gap: 8px;
}
.alarm-label {
  font-size: .82rem;
  color: var(--muted);
  font-weight: 700;
  flex-shrink: 0;
}
.btn-alarm {
  background: var(--surface2);
  border: 2px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: .9rem;
  font-weight: 700;
  padding: 6px 14px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-alarm:active { opacity: .75; }
.alarm-countdown {
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--green);
  font-variant-numeric: tabular-nums;
}
.btn-alarm-cancel {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1.3rem;
  cursor: pointer;
  padding: 2px 8px;
  line-height: 1;
}
.timer-btns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.btn-timer-sub {
  background: var(--surface2);
  border: 2px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  font-size: 1rem;
  font-weight: 700;
  padding: 14px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-timer-sub:active { opacity: .75; }
.btn-timer-end {
  background: transparent;
  border: 2px solid var(--red);
  border-radius: 10px;
  color: var(--red);
  font-size: 1rem;
  font-weight: 700;
  padding: 14px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-timer-end:active { opacity: .75; }

/* ══════════════════════════════════════
   v13: 状態駆動ホーム + 全画面入力モード
   ══════════════════════════════════════ */

/* ── 朝（idle） ── */
.home-date {
  text-align: center;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 14px;
}
.btn-shift-start {
  display: block;
  width: 100%;
  background: var(--green);
  color: #000;
  border: none;
  border-radius: 14px;
  font-size: 1.5rem;
  font-weight: 900;
  padding: 26px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-shift-start:active { opacity: .85; }
.yesterday-line {
  text-align: center;
  font-size: .82rem;
  color: var(--muted);
  margin-top: 12px;
  min-height: 1em;
}

/* ── 稼働中/休憩中 ヘッダー ── */
.tz-top {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 4px 0 14px;
}
.tz-icon { font-size: 1.3rem; line-height: 1; align-self: center; }
.tz-count {
  font-size: 2.2rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  line-height: 1;
}
.tz-count-pause { color: var(--muted); }
.tz-lbl { font-size: .8rem; color: var(--muted); }

/* ── 終了後（ended） ── */
.ended-title {
  font-size: 1.05rem;
  font-weight: 900;
  margin-bottom: 6px;
}
/* v227: .ended-sub（件数・時給・📍のサマリー行）は退役=上のコンソールと重複。家=時間・場所・距離の枠 */
.tz-run-row { pointer-events: none; }  /* v227: 走行距離=計算値（押せない・chevron無し） */
/* v228: 記録の家の3グループ見出し（時間／エリア／距離）。行ラベルは「開始/終了/走行」だけ=見出しが単位を語る（えーくん9/11） */
/* v228b（えーくん9/11「見出しが見出しと分かるように・混ざってる」）: 濃く太く+下罫線=点線枠の行と別物に見せる。行側のアイコンは撤去（休憩のコーヒーだけ） */
/* v228c（えーくん9/11「まだ溶け込む・グループ感が弱い」）: グループ=薄い地の箱・見出し=箱の肩の塗りタグ（文字色地に紙色の字）・項目=箱の中の紙色の行
   =「見出し！項目！」を色の階層（塗り＞地＞紙）で分ける。下罫線方式（v228b）は行の点線と同じ細さで負けた */
.tz-sec { background:var(--surface2); border:1px solid var(--border); border-radius:12px; padding:8px 10px 2px; margin:10px 0 0; }
.tz-grp { display:inline-flex; align-items:center; gap:5px; margin:0 0 8px; padding:3px 10px 3px 8px; font-size:.875rem; font-weight:900; color:var(--surface); background:var(--text); border-radius:6px; letter-spacing:.06em; }
.tz-grp .pi { opacity:.9; }
.tz-sec .tz-start-row { background:var(--surface); }
.tz-sec .tz-area-editw { background:var(--surface); }
.btn-resume {
  display: block;
  width: 100%;
  background: transparent;
  border: 2px solid var(--border);
  border-radius: 10px;
  color: var(--muted);
  font-size: .95rem;
  font-weight: 700;
  padding: 12px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.btn-resume:active { opacity: .75; }

/* ── 合計デカ数字 ── */
.zone-total {
  text-align: center;
  padding: 18px 16px 6px;
}
/* v71: 売上の左右で前日/翌日へ（えーくん要望7/19） */
.total-row { display: flex; align-items: center; justify-content: space-between; }
.day-nav {
  flex-shrink: 0;
  width: 44px;
  height: 60px;
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1.05rem;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.day-nav:active { opacity: .6; }
.total-big {
  font-size: 3.2rem;
  font-weight: 900;
  color: var(--green);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.03em;
  line-height: 1.1;
  /* v98: 枠=◀▶の間の残り幅に固定（10万超え=6桁で行があふれ▶が画面外へ・実機8/7。
     あふれはJSのtotalFit実測フィットが縮めて収める・ellipsis禁止の作法どおりhidden保険のみ） */
  flex: 1;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}
.total-sub {
  font-size: .85rem;
  color: var(--muted);
  margin-top: 4px;
  min-height: 1.2em;
}

/* ── サービスボタン ── */
.zone-services { padding: 12px 16px 0; }
.svc-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.svc-big {
  background: var(--surface);
  border: 2px solid var(--border);
  border-radius: 14px;
  padding: 14px 10px;
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 88px;
}
.svc-big:active { opacity: .8; }
.svc-big-name { font-size: .88rem; font-weight: 700; color: var(--text); }
.svc-big-amt  { font-size: 1.3rem; font-weight: 900; color: var(--green); font-variant-numeric: tabular-nums; }
.svc-big-cnt  { font-size: .75rem; color: var(--muted); }
.svc-chips {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}
.svc-chip {
  background: var(--surface);
  border: none;  /* v172: 押せる物=塗りだけ・枠線なし（テンキーと同じ文法・えーくん8/29） */
  border-radius: 100px;
  color: var(--muted);
  font-size: .85rem;
  font-weight: 700;
  padding: 12px 16px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  flex: 1;
  white-space: nowrap;
}
.svc-chip:active { opacity: .75; }

/* ── 折りたたみ ── */
.fold {
  margin: 10px 16px 0;
  background: var(--surface);
  border-radius: var(--radius);
}
.fold summary {
  padding: 14px 16px;
  font-size: .9rem;
  font-weight: 700;
  color: var(--muted);
  cursor: pointer;
  list-style: none;
  -webkit-tap-highlight-color: transparent;
}
.fold summary::-webkit-details-marker { display: none; }
.fold summary::after { content: ' ▸'; }
.fold[open] summary::after { content: ' ▾'; }
.fold > *:not(summary) { margin: 0 16px; }
.fold > *:last-child { margin-bottom: 16px; }

/* ── 入力モード（全画面・曇りガラス） ── */
#io-overlay {
  position: fixed;
  inset: 0;
  background: rgba(13, 13, 13, .6);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  z-index: 500;
  display: none;
  flex-direction: column;
}
.io-sheet {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
  max-width: 480px;
  margin: 0 auto;
  width: 100%;
}
.io-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.io-svc { font-size: 1.15rem; font-weight: 900; }
.io-head-left { min-width: 0; }  /* v97: 社名+計の縦積み列（入力終了ボタンより低い=ヘッダー高さ不変） */
.io-sum {
  /* v222（えーくんGO 9/22）: .85rem薄墨→1.15rem本文色。v113の「控えめ=まとめ派が計を売上と取り違えない」は
     タブに売上が別に見え「計」ラベルもあるので取り違えの道筋が無い（えーくん指摘で根拠が崩れた）→主役の大きさへ */
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;  /* 保険。「計」ラベル明示+薄墨=まとめ派が売上と取り違えない控えめ表示 */
  /* v99: 箱=文字の幅ぴったり（blockのままだと箱=列幅・scaleの軸が列中心に固定され、
     桁が少ない時に左へ膨らんで見えた・実機8/7。箱が文字を抱けば軸=常に文字の中心） */
  width: fit-content;
  max-width: 100%;
}
.io-done {
  background: var(--green);
  color: #000;
  border: none;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 900;
  padding: 12px 22px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.io-done:active { opacity: .85; }

/* タブ: 金額グループ + 区切り + 件数 */
.io-tabs {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin-bottom: 14px;
}
.io-tabs-money {
  display: flex;
  gap: 4px;
  flex: 4;
  min-width: 0;  /* v63: これが無いと6桁の累計の最小幅より縮めず、行が広がり件数タブが画面外へ（実機7/18） */
  background: rgba(255, 255, 255, .04);
  border-radius: 12px;
  padding: 4px;
}
.io-tabs-sep {
  width: 1px;
  background: var(--border);
  margin: 6px 8px;
  flex-shrink: 0;
}
.io-tab {
  flex: 1;
  background: transparent;
  border: 2px solid transparent;
  border-radius: 10px;
  padding: 8px 2px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 0;
}
.io-tab.active {
  background: var(--surface);
  border-color: var(--green);
}
/* v57: タブのラベル.72rem/累計.78remは老眼原則違反（11.5/12.5px）だった→14px級に引き上げ（実機7/17） */
.io-tab-l { font-size: .82rem; font-weight: 700; color: var(--text); white-space: nowrap; }
.io-tab-v {
  font-size: .95rem;
  font-weight: 900;
  color: var(--green);
  font-variant-numeric: tabular-nums;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;  /* v94: iOSはカンマ直後を折返し点にする事がある（緩い禁則）→累計は1行厳守 */
}
/* v96: 累計の「…」（ellipsis）は廃止（1px未満のサブピクセル溢れでも発動して「1,4…」と数文字失う
   爆弾だった・実機8/7。JSの実測フィット+万丸めが役目を引き継ぎ・最後の保険はhiddenの微小クリップ） */
.io-tab-v-count { color: var(--text); }
.io-tab-v-sm { font-size: .78rem; }  /* v63: 累計7文字以上（10万〜）は一段縮めて「100,0…」を防ぐ */
.io-tab-count { flex: 0 0 64px; background: rgba(255, 255, 255, .04); border-radius: 12px; }
.io-tab-count.active { background: var(--surface); border-color: #60a5fa; }

/* 入力表示 */
.io-display {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;   /* v61: ✔＋の2ボタン化で液晶が狭い→gapとpaddingで数字の場所を稼ぐ */
  background: var(--surface);
  border-radius: 14px;
  padding: 14px 12px;
  margin-bottom: 14px;
}
.io-unit { font-size: 1.2rem; font-weight: 700; color: var(--muted); }
#io-value {
  font-size: 2.4rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  min-width: 0;
  overflow: hidden;
  transition: font-size .15s ease;  /* v61: 桁数で自動縮小（実機の電卓と同じ動き）を滑らかに */
}
#io-value.editing { color: var(--green); }
.io-add {
  flex-shrink: 0;
  width: 60px;   /* v60: ✔と2つ並ぶため64→60（タップ60px基準は維持） */
  height: 60px;
  border-radius: 50%;
  background: var(--green);
  color: #000;
  border: none;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.io-add:active { opacity: .85; }
/* v60: ✔=上書き確定（罫線の丸=塗りの＋と主従を分ける）・C=打ち直し（えーくん発案の電卓文法7/18） */
.io-ok {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: transparent;
  border: 2px solid var(--green);
  color: var(--green);
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.io-ok:active { opacity: .8; }
.io-pad .io-clear { color: var(--red); }
/* v245: 入力のしかた「まとめて決定」（#io-overlay.io-batch・えーくんGO 9/22）。
   上部=入力終了→[キャンセル][決定]・✔は隠す・仮の値が入ったタブ累計はマゼンタ（未決定の印・決定で通常色へ） */
.io-head-btns { display: none; gap: 8px; flex-shrink: 0; }
#io-overlay.io-batch .io-head-btns { display: flex; }
#io-overlay.io-batch .io-done-tap,
#io-overlay.io-batch .io-ok { display: none; }
.io-cancel {
  background: transparent;
  color: var(--text);
  border: 1.5px solid var(--border);
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 700;
  padding: 12px 16px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.io-cancel:active { opacity: .7; }
.io-tab-v.io-tab-v-pend { color: #e0489d; }
html.d-washi .io-tab-v.io-tab-v-pend { color: #c9187e; }
/* v246: 電卓文法の式「1,000 ＋ 300」（元の値=小さく薄く・縮まない）と、＋モード中の＋ボタン点灯（マゼンタの輪） */
#io-base { font-size: 1.1rem; font-weight: 700; color: var(--muted); flex-shrink: 0; white-space: nowrap; }
.io-add.io-add-on { box-shadow: 0 0 0 3px #e0489d; }
html.d-washi .io-add.io-add-on { box-shadow: 0 0 0 3px #c9187e; }
.io-done-ok { padding: 12px 24px; font-size: 1.25rem; line-height: 1; }
#io-overlay.io-locked .io-head-btns .io-done { pointer-events: none; opacity: .35; }

/* テンキー */
.io-pad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  flex: 1;
  min-height: 0;
}
.io-pad button {
  background: var(--surface);
  border: none;
  border-radius: 14px;
  color: var(--text);
  font-size: 1.7rem;
  font-weight: 700;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  min-height: 60px;
}
.io-pad button:active { background: var(--surface2); }
.io-pad .io-back { color: var(--muted); }

/* ── v14: 日付チップ + 過去日モード + カレンダー売上表示 ── */
.date-chip {
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 100px;
  color: var(--text);
  font-size: .9rem;
  font-weight: 700;
  padding: 10px 16px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.date-chip:active { opacity: .75; }

.past-banner {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 12px 16px 0;
  background: #341c08;
  border: 1px solid #f97316;
  border-radius: var(--radius);
  padding: 10px 14px;
  font-size: .9rem;
  font-weight: 700;
  color: #fdba74;
}
.past-banner button {
  background: #f97316;
  color: #000;
  border: none;
  border-radius: 8px;
  font-size: .85rem;
  font-weight: 900;
  padding: 8px 14px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  flex-shrink: 0;
}

/* v103: 旧カレンダーの上書きブロック（.cal-month-total・中央寄せセル）はv10刷新で撤去。
   v84: 選択日の全面塗り関連（.cal-amt黒）も撤去=マークは日付数字の緑判子だけ */

/* ── v15: クラウドバックアップ ── */
.header-btns { display: flex; align-items: center; gap: 8px; }
.cloud-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 100px;
  padding: 8px 12px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  filter: grayscale(1);
  opacity: .55;
  line-height: 1;
}
.cloud-btn .pi {
  width: 26px;   /* v179: 20→23 → v180: 26（全体サイズアップと歩調） */
  height: 26px;
  display: block;
}
.cloud-btn.cloud-on {
  filter: none;
  opacity: 1;
}
/* v182: 同期中の演出はアイコン本体へ（下の「☁の状態表現」ブロックが正）。
   旧cloudPulse（1秒周期のopacity点滅）は退役=薄くなる方向の演出は老眼原則と逆・
   「消えかけ」に見えて不安を煽る。新演出は膨らむ方向 */

/* css v206（えーくんGO 9/11）: ☁シートは他のオーバーレイ（2000以下）より上。メーター画面・距離の修正シートの中で
   カメラを押した未ログイン者へ「その場で」ログインを出す（旧400=メーター画面と同値でDOM後置のメーターが上に来て
   シートが裏で開いていた・9/11実機）。閉じれば元の画面に戻る=操作を途切らせない */
#cloud-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 2100;
  display: none;
  align-items: flex-end;
}
#cloud-sheet {
  background: var(--surface);
  border-radius: 20px 20px 0 0;
  padding: 24px 20px calc(36px + env(safe-area-inset-bottom, 0px));
  width: 100%;
  transform: translateY(100%);
  transition: transform .25s ease;
}
#cloud-sheet.cal-open { transform: translateY(0); }
.cloud-title {
  font-size: 1.1rem;
  font-weight: 900;
  margin-bottom: 16px;
}
.cloud-msg { font-size: .95rem; line-height: 1.7; margin-bottom: 12px; }
.cloud-points {
  list-style: none;
  margin-bottom: 20px;
  font-size: .88rem;
  color: var(--muted);
}
.cloud-points li { padding: 4px 0; }
.cloud-points li::before { content: '✓ '; color: var(--green); font-weight: 900; }
.cloud-status { font-size: 1rem; font-weight: 700; margin-bottom: 6px; }
.cloud-mail   { font-size: .85rem; color: var(--muted); margin-bottom: 2px; }
.cloud-last   { font-size: .85rem; color: var(--muted); margin-bottom: 18px; }
.cloud-logout {
  display: block;
  width: 100%;
  background: none;
  border: none;
  color: var(--muted);
  font-size: .85rem;
  padding: 14px;
  margin-top: 6px;
  cursor: pointer;
  text-decoration: underline;
}

/* ── v22: ライブ時給・休憩合計の小表示 ── */
.tz-pause-line {
  text-align: center;
  color: var(--muted);
  font-size: .85rem;
  font-variant-numeric: tabular-nums;
  margin: -4px 0 10px;
}

/* ── v20: アラーム4プリセット＋ビューアーのアラーム表示 ── */
/* 4ボタンは横幅を均等に分け合って必ず1行に収める（60分だけ改行するのを防ぐ） */
.alarm-set .btn-alarm {
  flex: 1 1 0;
  min-width: 0;
  padding: 6px 0;
  text-align: center;
}
.tz-viewer-alarm {
  text-align: center;
  color: var(--green);
  font-size: .9rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin: -6px 0 14px;
}

/* ── v19: 他端末で稼働中（ビューアーモード） ── */
.tz-viewer-note {
  text-align: center;
  color: var(--muted);
  font-size: .95rem;
  margin: 10px 0 14px;
}
.btn-takeover {
  display: block;
  width: 100%;
  min-height: 60px;
  background: none;
  border: 2px solid var(--green);
  color: var(--green);
  border-radius: 14px;
  font-size: 1.05rem;
  font-weight: 700;
  cursor: pointer;
}

/* ── v18: アカウント切替告知 ── */
.cloud-notice {
  background: rgba(255, 170, 0, .12);
  border: 1px solid rgba(255, 170, 0, .5);
  border-radius: 12px;
  padding: 14px;
  font-size: .9rem;
  line-height: 1.7;
  margin-bottom: 16px;
  word-break: break-all;
}
.cloud-prev {
  font-size: .85rem;
  color: var(--muted);
  margin-top: 12px;
  text-align: center;
  word-break: break-all;
}

/* ===== v23: 宣言モデル（押し忘れ救済カードの注記） ===== */
.tz-note {
  margin-top: 8px;
  font-size: .85rem;
  color: var(--muted);
  text-align: center;
}

/* ===== v24: 投稿文テンプレート編集（自由文＋チップ差し込み） ===== */
.tpl-edit-btn {
  width: 100%;
  margin-top: 10px;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  font-size: .9rem;
  font-weight: 700;
  padding: 13px;
  cursor: pointer;
}
.tpl-edit-btn:active { opacity: .8; }

.btn-midpost {
  width: 100%;
  margin-top: 10px;
  background: transparent;
  border: 2px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  font-size: .95rem;
  font-weight: 700;
  padding: 13px;
  cursor: pointer;
}
.btn-midpost:active { opacity: .8; }

#tpl-overlay {
  position: fixed;
  inset: 0;
  background: rgba(13, 13, 13, .72);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  z-index: 500;
  display: none;
  flex-direction: column;
}
.tpl-sheet {
  height: 100%;
  overflow-y: auto;
  padding: 16px 16px calc(24px + env(safe-area-inset-bottom, 0px));
  max-width: 480px;
  margin: 0 auto;
  width: 100%;
}
.tpl-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.tpl-title { font-size: 1.05rem; font-weight: 900; }
.tpl-cancel {
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: .9rem;
  font-weight: 700;
  padding: 12px 4px;
  cursor: pointer;
}
.tpl-cancel:active { opacity: .7; }
.tpl-tabs { display: flex; gap: 8px; margin-bottom: 12px; }
.tpl-tab {
  flex: 1;
  padding: 13px;
  border-radius: 10px;
  border: 2px solid var(--border);
  background: var(--surface);
  color: var(--muted);
  font-size: .95rem;
  font-weight: 700;
  cursor: pointer;
}
.tpl-tab.active {
  border-color: var(--green);
  color: var(--text);
  background: var(--surface2);
}
.tpl-note {
  font-size: .88rem;
  color: var(--muted);
  margin: 4px 0 10px;
  line-height: 1.6;
}
.tpl-note b { color: var(--text); }
.tpl-start {
  width: 100%;
  margin-top: 14px;
  background: var(--green);
  color: #000;
  border: none;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 900;
  padding: 16px;
  cursor: pointer;
}
.tpl-start:active { opacity: .85; }
#tpl-text {
  width: 100%;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  font-size: 16px;   /* 16px未満だとiOSが勝手にズームする */
  line-height: 1.8;
  padding: 12px;
  /* v37: 高さ固定（min/maxの「伸びる箱」廃止）。改行で箱が伸びるとパレットが下へ逃げる
     （えーくん実機7/11）＋従来の初期値150pxから1行分（line-height 1.8×16px≒29px）小さく */
  height: 121px;
  font-family: inherit;
  white-space: pre-wrap;   /* contenteditable: 連続スペース・改行を素直に保つ */
  word-break: break-word;
}
#tpl-text:focus { outline: none; border-color: var(--green); }
#tpl-text:empty::before { content: attr(data-placeholder); color: var(--muted); }
/* チップ＝1オブジェクト（v33/app v36）: カーソル不可侵の部品。パレットのチップと同族の見た目 */
.tpl-token {
  display: inline-block;
  background: rgba(34, 197, 94, .13);
  border: 1px solid var(--green-dk);
  border-radius: 999px;
  color: var(--green);
  font-size: .85em;
  font-weight: 700;
  line-height: 1.3;
  padding: 1px 9px;
  margin: 0 2px;
  white-space: nowrap;
  vertical-align: baseline;
}
/* k表記チップの添え字（「売上k」と読めてしまう問題の修正・v34） */
.tpl-token-k {
  font-size: .7em;
  opacity: .85;
  margin-left: 1px;
}

/* ===== v35: iPhoneテンプレ編集のスクロール問題（えーくん実機2026-07-11） ===== */
/* 編集箱が画面を占領すると、スクロールの指が「文字選択」に化けてシートが動かせない
   → 箱は画面の1/3まで・中身は箱内スクロール。箱の外はシートのスクロールが確実に効く */
#tpl-text {
  /* v37: 高さは上の固定121pxが正（28vh上限は廃止）。中身が超えたら箱内スクロール */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.tpl-sheet { overscroll-behavior: contain; }
/* v36: パレット常駐化 — 2段×横スクロールの1本ストリップ（見出し廃止・頻度順）。
   編集箱のすぐ下に常に見える＝「編集しながらサクサク挿入」・下へのスクロールの旅を廃止 */
.tpl-strip {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(2, auto);
  justify-content: start;
  gap: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 2px 0 8px;
}
.tpl-strip .tpl-chip { white-space: nowrap; }
/* v37: カテゴリタブ（基本/詳細/社別・A案）。頻度順フラットは「探すのに横スクロールの旅」で不評
   （えーくん実機7/11）→ カテゴリで場所を覚えられる形に。
   v38: 緑ピルはチップと同族に見えて紛らわしい（えーくん実機7/11）→ 上部の「本日終了用/途中経過用」
   タブ（.tpl-tab）と同族の見た目に。役割で形を統一: 角丸四角＝タブ・緑ピル＝チップ */
.tpl-cats {
  display: flex;
  gap: 6px;
  margin: 0 0 6px;
}
.tpl-cat {
  background: var(--surface);
  border: 2px solid var(--border);
  border-radius: 10px;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 700;
  padding: 6px 14px;
  cursor: pointer;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
}
.tpl-cat.active {
  border-color: var(--green);
  color: var(--text);
  background: var(--surface2);
}
/* css v186（v215・えーくんGO 9/9）: パレット見出し=上向き矢印だけ（説明文は退役）。
   表記ボタン（.tpl-kmode）は「文字＋⟳」の設定の形にしてプレビュー直上の .tpl-fmt 行へ
   =緑ピル（チップ）・角丸四角（タブ）と混ざらない第3の形（v38の役割で形を統一を拡張） */
.tpl-pal-head {
  margin: 6px 0 0;
  text-align: center;   /* css v191: ど真ん中（えーくん9/9）。v190のイエローライムは和紙地で見えず失敗→チップと同じ緑 */
  color: var(--green);
  font-size: 2rem;      /* 太い矢印（arrow-fat-up）で「ここから上へ入る」を一目で */
  line-height: 1;
}
.tpl-fmt {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin: 0 0 6px;
  font-size: .75rem;
  color: var(--muted);
}
.tpl-fmt-l { margin-right: auto; padding-left: 2px; }
/* css v190（えーくん実機9/9）: 文字だけだと押せると分からない→枠ありのボタンへ。チップ（緑ピル・塗り）とは
   「角丸8px+細枠+地なし+⟳」で見分ける。並びは時間→金額（HTML側） */
.tpl-kmode {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: .8rem;
  font-weight: 600;
  font-family: inherit;
  padding: 8px 10px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.tpl-kmode .pi { opacity: .8; }
/* css v191: 表記ボタンのアクティブ表示（.kon）は廃止=順送りループに「非既定」の意味が無い（えーくん9/9） */
.tpl-group {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 8px;
}
.tpl-group-l {
  flex-shrink: 0;
  width: 2.6em;
  font-size: .7rem;
  color: var(--muted);
  padding-top: 10px;
}
.tpl-group-c { display: flex; flex-wrap: wrap; gap: 6px; }
.tpl-chip {
  background: var(--surface2);
  border: 1px solid var(--green-dk);
  border-radius: 999px;
  color: var(--green);
  font-size: .85rem;
  font-weight: 700;
  padding: 9px 13px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.tpl-chip:active { background: var(--green-dk); color: #000; }
.tpl-prev-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 12px 0 6px;
  font-size: .75rem;
  color: var(--muted);
}
.tpl-prev-head .char-count { margin-top: 0; }
.tpl-reset {
  width: 100%;
  margin-top: 14px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--muted);
  font-size: .85rem;
  padding: 12px;
  cursor: pointer;
}

/* ===== v26: 縦スライドで次のタップが食われる対策（2026-07-08） ===== */
/* スクロールする物がないオーバーレイは縦パンを発生させない。
   滑り→スクロール扱い→次のタップがスクロール停止に消費される、を根絶する。
   tpl-overlayは本文スクロールが必要なので対象外。
   cal-overlayはv83（カレンダーv10刷新）でシート内スクロールが必要になったため対象から除外 */
#io-overlay { touch-action: none; }

/* ===== v27: 「投稿文を確認」を開くと横スクロールが出る修正（2026-07-08） ===== */
/* fold内の子要素は左右16pxマージンが付くため、width:100%指定だと 100%+32px で画面からはみ出す */
.tpl-edit-btn { width: auto; display: block; }
/* 保険: 今後どこかの要素が数pxはみ出しても、画面が横に動く形では出さない */
html, body { overflow-x: hidden; }

/* ===== v28: Android横スライド後の2タップ問題（2026-07-08） ===== */
/* 横スライドがAndroidではテキスト選択に化け、次のタップが選択解除に食われる。
   テンキー・カレンダーは文字選択が不要なので選択自体を無効化（tpl-overlayは文章選択が要るので対象外） */
#io-overlay, #cal-overlay {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

/* ===== v30: v29(overscroll-behavior:none)は撤回（2026-07-08） ===== */
/* Androidで縦スクロール自体が死ぬ副作用が実機で出た。本命修正（即時タップ）に不要な蛇足だった */

/* ===== v31: クラウドシート簡素化（今すぐ同期ボタン削除・ログアウト2段階確認）2026-07-10 ===== */
.cloud-last {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  padding: 8px 0;   /* タップしやすく（隠しレバー: 行タップで手動同期） */
}
.cloud-logout-arm {
  border: 2px solid var(--red) !important;
  border-radius: 10px;
  color: var(--red) !important;
  font-weight: 700;
  line-height: 1.6;
  text-decoration: none;  /* 赤文字だけで十分（えーくん・下線は通常状態のリンク風だけに） */
}
.cloud-logout-note {
  font-size: .75rem;
  font-weight: 400;
  color: var(--muted);
}

/* ===== v39: おつり電卓（現金会計「玄関先の2秒」・えーくん発案7/13） ===== */
#cash-overlay {
  position: fixed;
  inset: 0;
  background: rgba(13, 13, 13, .6);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  z-index: 500;
  display: none;
  flex-direction: column;
  touch-action: none;   /* スクロール不要のオーバーレイはこれもセット（css v26の教訓） */
}
/* v104: ヘッダーにキャッチ「＼２秒で打てる／」（えーくん8/11・実証済みの売り文句を常設看板に） */
.cash-title { text-align: center; }
.cash-catch { display: block; font-size: .72rem; font-weight: 700; color: var(--muted); letter-spacing: .04em; margin-bottom: 1px; }
.cash-fields { display: flex; gap: 8px; margin-bottom: 10px; }
.cash-field {
  flex: 1;
  min-width: 0;  /* v102: 数字が育っても枠は50/50固定（溢れはJS実測フィットが縮める） */
  background: var(--surface);
  border: 2px solid transparent;
  border-radius: 14px;
  padding: 10px 12px;
  text-align: right;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  color: var(--text);
  font-family: inherit;
}
.cash-field.active { border-color: var(--green); }
/* v101: お客様に画面を見せる機会が多い→主役情報を巨大化（えーくん8/10。
   サイズはPC検証でなく実機が正・6桁¥999,999が最悪ケースの幅） */
.cash-field-label { display: block; font-size: 1rem; color: var(--muted); text-align: left; }
.cash-field-val { display: block; font-size: 1.9rem; font-weight: 900; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }  /* v102: block=幅を枠に固定（実測フィットの物差し） */
.cash-change {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 10px;
  background: var(--surface);
  border-radius: 14px;
  padding: 12px 16px;
  margin-bottom: 10px;
}
.cash-change-label { font-size: 1.1rem; font-weight: 700; color: var(--muted); white-space: nowrap; flex-shrink: 0; }  /* v102: 縦書き化の根絶 */
.cash-change-val {
  font-size: 3.2rem;
  font-weight: 900;
  color: var(--green);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  min-width: 0;  /* v102: 溢れはJS実測フィットが縮める */
}
.cash-change.short .cash-change-val,
.cash-change.short .cash-change-label { color: #f97316; }  /* 不足はオレンジで警告 */
/* v72: 札はドット絵画像（えーくん作・3枚計4KB）。お預かり選択中だけ登場（商品代金を打つ時に
   押し間違う対象ごと消す）。visibilityで場所は確保=テンキーの位置がガタつかない（雑タッチの錨） */
/* v101: billzone=札とリセットの同居枠（表示は排他・場所は共有）。札は限界まで拡大（お客に見せる札） */
.cash-billzone { position: relative; margin-bottom: 10px; }
.cash-billzone .cash-bills { margin-bottom: 0; }
.cash-bills {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px;
  visibility: hidden; opacity: 0; transition: opacity .18s;
}
.cash-bills.on { visibility: visible; opacity: 1; }
.cash-bill {
  border: none;
  border-radius: 8px;
  min-height: 64px;
  padding: 0;
  display: flex; align-items: center; justify-content: center;
  background: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cash-bill img { width: 94%; height: auto; max-height: 72px; image-rendering: pixelated; }  /* ドット絵はぼかさない */
.cash-bill:active { transform: scale(.94); }
/* v252（えーくん9/22）: 札の叩いた数=札の中央に墨の丸（1回以上だけ表示・履歴閲覧中は出さない） */
.cash-bill { position: relative; }
.cash-bill-n {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  display: none; align-items: center; justify-content: center;
  min-width: 34px; height: 34px; padding: 0 8px; border-radius: 17px;
  background: rgba(34, 38, 31, .88); color: #f5f2e6;
  font-size: 1.15rem; font-weight: 900; font-variant-numeric: tabular-nums;
  pointer-events: none;
}
.cash-bill-n.on { display: flex; }
/* v252: ¥は数字の55%（電卓の3値・ロック画面の3値で同じ比率=読みやすい） */
.cash-yen { font-size: .55em; font-weight: 700; margin-right: .06em; }
/* v123: リセット=札の空白地に「商品代金選択中＆数字あり」限定で登場（ワンタッチ仕切り直し・
   赤枠族=「終える」。札と表示排他なので玄関の2秒での誤爆は構造上起きない） */
.cash-reset {
  position: absolute; inset: 0; width: 100%;
  display: none; align-items: center; justify-content: center; gap: 6px;
  border: 2px solid var(--red); color: var(--red); background: var(--surface);
  border-radius: 14px; font-size: 1.3rem; font-weight: 700; font-family: inherit;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.cash-reset.on { display: flex; }
.cash-reset:active { transform: scale(.97); }
/* v125: 札が飛ぶ（タップした札がお預かり金額の1の位へ吸い込まれる。io-flyと同族の作法:
   右下角基準・透明化は行程の後半だけ=54%地点から消え始め着地で消え切る） */
.cash-bill-fly {
  position: fixed;
  z-index: 600;
  pointer-events: none;
  image-rendering: pixelated;
  transform: translate(0, 0);
  transform-origin: right bottom;
  transition: transform .48s cubic-bezier(.4, .0, .75, 1), opacity .22s ease-in .26s;
}
/* v73: 会計履歴ナビ（電卓本体がビューア兼エディタ・専用の一覧画面は作らない） */
.cash-head-btns { display: flex; gap: 8px; }
/* v250（えーくんGO 9/22）: テンキー真下の状態ボタン（決定▶／ロック）。テンキーはflex:1なので56px足してもキーが14pxずつ縮むだけ */
.cash-act {
  flex-shrink: 0;
  margin-top: 8px;
  height: 56px;
  border: none;
  border-radius: 14px;
  background: var(--green);
  color: #000;
  font-family: inherit;
  font-size: 1.15rem;
  font-weight: 900;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cash-act:active { opacity: .85; }
.cash-act.off { opacity: .35; pointer-events: none; }
.cash-act.hide { display: none; }
.cash-act .pi { vertical-align: -0.25em; }
/* ロック画面=明細1枚。cash-overlay（z500）の中でさらに前面=タブバー(300)も電卓も全部覆う */
#cash-lock {
  position: fixed;
  inset: 0;
  z-index: 10;
  background: var(--bg);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px 20px calc(24px + env(safe-area-inset-bottom, 0px));
  touch-action: none;
}
.cash-lock-body { flex: 0 0 auto; margin: auto 0; }
.cash-lock-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 4px;
  border-bottom: 1px solid var(--border);
}
.cash-lock-l { font-size: 1.15rem; font-weight: 700; color: var(--muted); white-space: nowrap; }
/* v251（えーくん実機9/22）: お客様にも見せる画面=少し離れても読める大きさ。代金/預かり=3.4rem（旧おつり）・おつり=4.8rem。
   値は flex:1 で残り幅を持ち、入らない時だけJS実測（cashFitOne）で縮む */
.cash-lock-v { flex: 1; text-align: right; font-size: 3.4rem; font-weight: 900; font-variant-numeric: tabular-nums; letter-spacing: -.02em; min-width: 0; overflow: hidden; white-space: nowrap; }
.cash-lock-change { border-bottom: none; padding-top: 22px; }
.cash-lock-change .cash-lock-l { color: var(--text); font-size: 1.4rem; }
.cash-lock-change .cash-lock-v { font-size: 4.8rem; color: var(--green); }
.cash-lock-change.short .cash-lock-l, .cash-lock-change.short .cash-lock-v { color: #f97316; }
.cash-lock-body { transition: transform .25s ease; }
.cash-lock-body.flip { transform: rotate(180deg); }  /* v251: 相手に向ける */
.cash-lock-tools { display: flex; justify-content: flex-end; margin-bottom: 12px; flex-shrink: 0; }
.cash-flip {  /* 2族=罫線の静かなボタン */
  height: 44px; padding: 0 16px;
  background: transparent; color: var(--text);
  border: 1.5px solid var(--border); border-radius: 22px;
  font-family: inherit; font-size: 1rem; font-weight: 700;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.cash-flip:active { opacity: .7; }
/* スライドで解除: つまみを右端まで（85%）滑らせた時だけ解除。途中で離すと戻る */
.cash-slide {
  position: relative;
  flex-shrink: 0;
  height: 64px;
  border-radius: 32px;
  background: var(--surface);
  border: 1.5px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
}
.cash-slide-hint { font-size: 1rem; font-weight: 700; color: var(--muted); padding-left: 48px; user-select: none; -webkit-user-select: none; }
.cash-slide-knob {
  position: absolute;
  left: 4px; top: 4px;
  width: 54px; height: 54px;
  border-radius: 50%;
  background: var(--green);
  color: #000;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
  transition: transform .18s ease;
  touch-action: none;
  cursor: grab;
}
#cash-hist-nav { margin-bottom: 10px; }
.cash-hist-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#cash-hist-time { font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.cash-hist-sum { text-align: center; font-size: .82rem; color: var(--muted); margin-top: 4px; }

/* ===== v42: 下部タブ＋その他シート（D2・和帳簿IA） =====
   既定テーマでは非表示。表示のON/OFFは末尾のテーマブロックが担当 */
#tabbar {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 300;                       /* オーバーレイ(400/500)の下 */
  background: var(--bg);
  border-top: 1px solid var(--border);
  padding: 4px 8px calc(4px + env(safe-area-inset-bottom, 0px));
}
.tabbar-btn {
  flex: 1;
  min-height: 56px;
  background: none;
  border: none;
  color: var(--text);    /* v71: mutedだと太陽下でタブが消える（実機7/19） */
  font-family: inherit;
  font-size: .72rem;     /* v71: アイコン+文字の2段構成（文字は位置記憶の補助） */
  font-weight: 600;
  letter-spacing: .02em;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  padding: 2px 2px 0;
  white-space: nowrap;
}
.tabbar-ico { display: block; font-size: 1.15rem; line-height: 1.3; }
.tabbar-btn:active { color: var(--text); }

/* タブの☁️（v43: 「その他」→クラウド直行。状態=ヘッダーの.cloud-btnと同じ3態）
   v181: 灰色化・薄消し・サイズ上書きを全撤去=**他4タブと完全に同じ見た目**（ラベル付き2段構成に
   戻したため、☁だけ特別扱いする理由が消えた）。状態は雲の形（check/arrow-up/slash）が示す。
   薄消しをやめた理由=停止中こそ気づいてほしい状態+老眼原則（薄い文字は読めない） */
/* 同期中の演出は .cloud-sync .pi（アイコン基盤ブロック）に集約 */

/* ===== v43: 投稿確認シート（旧「投稿文を確認」foldを吸収・えーくん7/16） ===== */
#post-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .6);
  z-index: 400;
  display: none;
  align-items: flex-end;
}
#post-sheet {
  background: var(--surface);
  border-radius: 20px 20px 0 0;
  padding: 20px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  width: 100%;
  transform: translateY(100%);
  transition: transform .25s ease;
}
#post-sheet.cal-open { transform: translateY(0); }
#post-sheet .preview-box { max-height: 40vh; overflow-y: auto; }
#post-sheet .btn-post { width: 100%; margin: 14px 0 4px; }
#post-sheet .tpl-edit-btn { margin: 10px auto 0; }

/* v43: おつり電卓もカレンダー式に下から登場 */
#cash-overlay .io-sheet {
  transform: translateY(100%);
  transition: transform .25s ease;
}
#cash-overlay .io-sheet.cal-open { transform: translateY(0); }

/* ===== v57: 加算アニメ「数字が飛ぶ」（説明トースト廃止・えーくんGO 7/17） ===== */
.io-fly {
  position: fixed;
  z-index: 600;
  /* font-sizeはJSが液晶の現在サイズを注入（v62・「あの数字がそのまま飛び出す」連続感） */
  font-weight: 900;
  color: var(--green);
  font-variant-numeric: tabular-nums;
  pointer-events: none;
  transform: translate(0, 0);
  transform-origin: right bottom;  /* v62: 縮小は右下角=1の位の下辺基準（右端＋ベースラインが揺れない） */
  /* v59: 透明化は行程の後半だけ（.26s遅延=54%地点から消え始め着地で消え切る・えーくん実機7/18
     「真ん中過ぎてから透明化のほうがカッコいい」） */
  transition: transform .48s cubic-bezier(.4, 0, .9, 1), opacity .22s ease-in .26s;
  opacity: 1;
}
.io-bump { animation: ioBump .4s ease; }
@keyframes ioBump {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.35); }
  100% { transform: scale(1); }
}
/* v64: ＋のカウント転送中、タブ累計が高速で脈打つ（バンプが肝・えーくん構想7/18）。到達で止まる */
.io-pulse { animation: ioPulse .12s ease-in-out infinite; }
@keyframes ioPulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.12); }
}
/* v65: 転送完了→空の間150ms→新しい累計が液晶へズームインでスッと戻る（バンプなし・右端錨） */
#io-value { transform-origin: right center; }
.io-value-in { animation: ioValueIn .25s ease-out; }
@keyframes ioValueIn {
  from { opacity: 0; transform: scale(1.25); }
  to   { opacity: 1; transform: scale(1); }
}

/* ===== v66: 天気（帳簿の最上段・えーくんGO 7/18）。既定テーマでは非表示=テーマ側が出す =====
   css v211/app v238: 縦詰めラウンド1（えーくんGO 2026-09-18・見本=mock_wx_inline_v8_compare.png右側）。
   .wx=2列グリッド（左=今の天気アイコン+気温+最高/最低・右=降水量グラフ+軸）。1段目(wx-row1)は枠いっぱいの
   地名+👁+レーダー+雨予告。--wx-card-bg/--wx-card-borderは面の見た目を後で変えるための調整用変数 */
.wx {
  display: none;
  grid-template-columns: auto 1fr;
  column-gap: 16px;
  align-items: stretch;
  background: none;   /* css v212: 面は箱 .wx-box::before が持つ（つまみの粒々ごと囲む・えーくん9/18） */
  border: none;
  border-radius: 14px;
  box-sizing: border-box;
  width: calc(100% - 32px);
  margin: 10px 16px 0;
  padding: 8px 10px 6px;
  color: var(--text);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.wx-line {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  line-height: 1;
  flex-wrap: nowrap;               /* v79: mini幅でも縦崩れさせない（雨予告は独立行に降ろした） */
}
.wx-line > span { white-space: nowrap; }
/* v238: データ表示後はwx-desc（「くもり」等）を隠す（アイコンで足りる）。未取得の案内文「タップで
   天気を表示」はwx-readyが付く前なので見える。安全条件④=main内はIDセレクタ禁止のためclassで指定 */
.wx.wx-ready .wx-desc{display:none}
/* v69: 1行目=日付（常時）。v211: 場所・👁・レーダー・雨予告はwx-row1へ統合（枠いっぱい） */
.wx-date {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 2px;
  grid-column: 1 / -1;
}
.wx-date-d { font-size: 1.05rem; font-weight: 600; letter-spacing: .06em; }
/* v67: どこの予報かを常に明示。v211: 縮むのは地名だけ（flex:0 1 auto）・色は本文と同じ濃さに */
.wx-place { color: var(--text); font-size: .875rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 0 1 auto; }
/* v211: 1段目=地名+👁+レーダー+雨予告の同居行（旧wx-subを統合・レーダーの導線は畳まない=常時表示決定） */
.wx-row1 { grid-column: 1 / -1; display: flex; align-items: center; gap: 3px; min-width: 0; height: 20px; }
/* v217: アイコン27→24px・気温28→24px・℃16→14px（えーくん9/19「主張しすぎ」+最高最低の間隔を詰める） */
.wx-ico { font-size: 1.5rem; }
.wx-temp { font-size: 1.5rem; font-weight: 300; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.wx-temp small { font-size: .875rem; margin-left: 1px; }
/* v211: 左カラム（今の天気）の箱。wxn-now=旧「いま」線マーカーclass(.wx-chart.wx-now)と名前が衝突する
   ため回避した内部クラス名（役割はモックのwxn-nowと同じ） */
.wxn-now { display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; }
.wx-pair { display: inline-grid; justify-items: stretch; align-self: flex-start; }
/* v78: 最高/最低気温（装備決め用・えーくんGO 7/25）。v218: 矢印なしの「28°/19°」を左寄せ（えーくんGO 9/19）。
   旧=↑↓つきの両端揃え（v211 width:0 は冬に7px・v217 は夏でも9px、下段が上段の右端からはみ出した=全角幅の矢印が原因）。
   v219: 左寄せ→右寄せ（えーくんGO 9/20・左詰めは右が25px空いて℃の右端とズレた。幅はいじらない=下段が広い冬は .wx-pair ごと広がる） */
.wx-hilo { display: flex; justify-content: flex-end; gap: 0; font-size: 1rem; font-weight: 400; letter-spacing: -.01em; line-height: 1.2; margin-top: 2px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.wx-hi { color: var(--red); }      /* 最高=弁柄（過去日バナーと同族） */
.wx-lo { color: #93a9c8; }         /* 最低=藍鼠（雨グラフと同色。washiのみ#4d7fa8へ上書き） */
.wx-lo::before { content: '/'; color: var(--text); margin: 0 1px; }  /* v218: 区切り=墨（青に染めない） */
/* v211: 右カラム（降水量グラフ+軸） */
.wx-right { display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; }
/* v79→v211: 雨予告はレーダーの直後（右寄せの担当は.wx-radarのmargin-left:autoへ移動）。雨の無い日は消える */
.wx-rain { font-size: .875rem; color: var(--text); margin-left: 2px; flex: none; white-space: nowrap; }
.wx-rain:empty { display: none; }
.wx-chart {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 32px;
  margin-top: 0;
  border-bottom: 1px solid var(--border);
  position: relative;  /* v80: 「いま」の朱線の基準 */
}
/* v80: 「いま」を中央にした窓のマーカー。v211: 過去6時間+未来12時間窓なので中央=33.333%位置。
   v81: 朱線は実機で目立ちすぎ→時間罫線と同じ色に（えーくん7/28「線でわかるから軸の『いま』も不要」） */
.wx-chart.wx-now::after {
  content: '';
  position: absolute;
  left: 33.333%;
  top: -2px;
  bottom: -1px;
  width: 1px;
  background: var(--text);
  opacity: .55;
}
.wx-chart i {
  flex: 1;
  background: #93a9c8;   /* 藍鼠=雨の色（washi/sumi両テーマで読める中間色。washiのみ#6f8fb8へ上書き） */
  border-radius: 1px 1px 0 0;
  min-height: 1px;
}
.wx-axis {
  display: flex;
  justify-content: space-between;
  font-size: .75rem;
  color: var(--text);
  margin-top: 2px;
  line-height: 1.2;
}
/* v219: 3時間ごと7点・数字だけ=棒の左端（その時刻の実位置）へ絶対配置。両端は枠からはみ出さないよう内側へ寄せる。
   高さ1.2em=旧の1行と同じ=天気枠の高さは不変。旧キャッシュ(24本)の5点はこのclassが付かず従来のspace-betweenのまま */
.wx-axis.wx-axis-pos { display: block; position: relative; height: 1.2em; }
.wx-axis-pos span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.wx-axis-pos span:first-child { transform: none; }
.wx-axis-pos span:last-child { transform: translateX(-100%); }
/* v70: 過去日の「その日の天気」（記録から・静かな一行） */
/* v74→v211: 雨雲レーダー（wxボタンの内側span・入れ子button禁止のためwx-eyeと同じ作法。天気枠が出ていれば
   常に見える=「レーダー導線は畳まない」決定・タップ域は::afterで上下に拡張し👁のタップ域と重ねない） */
.wx-radar {
  margin: 0 0 0 auto;
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: .75rem;
  line-height: 20px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--bg);
  color: var(--text);
  white-space: nowrap;
  cursor: pointer;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.wx-radar svg { width: 1.1em; height: 1.1em; }
.wx-radar::after {
  content: '';
  position: absolute;
  left: -4px;
  right: -2px;
  top: -12px;
  bottom: -10px;
}

.wx-past {
  text-align: center;
  color: var(--muted);
  font-size: .88rem;
  margin: 8px 16px 0;
}
/* v70の日ごと天気アイコン(.cal-wx .6rem)はv103刷新で本体ブロックへ統合（21px大型化） */

/* ===== v52: タイマー=帳簿のライブ行＋操作シート（えーくん「稼働中もおとなしく」7/17） ===== */
.tz-line {
  display: none;
  align-items: baseline;
  gap: 8px;
  width: calc(100% - 32px);
  margin: 12px 16px 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text);
  font-family: inherit;
  font-size: 1rem;
  padding: 13px 14px;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.tz-line-count {
  font-size: 1.15rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.tz-line-lbl { color: var(--muted); flex: 1; }
.tz-line-sub { color: var(--muted); font-variant-numeric: tabular-nums; }
.tz-line.tz-line-pause .tz-line-lbl { animation: pauseBreathe 4s ease-in-out infinite; }
#tz-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .6);
  z-index: 400;
  display: none;
  align-items: flex-end;
}
#tz-sheet {
  background: var(--surface);
  border-radius: 20px 20px 0 0;
  padding: 10px 16px calc(24px + env(safe-area-inset-bottom, 0px));
  width: 100%;
  transform: translateY(100%);
  transition: transform .25s ease;
}
#tz-sheet.cal-open { transform: translateY(0); }
/* css v231（えーくん実機9/23）: 右上の閉じる=絶対配置（シートの高さを足さない・1行目は左寄せなので衝突しない） */
#tz-sheet { position: relative; }
.tz-close { position: absolute; top: 10px; right: 16px; z-index: 2; }
#tz-sheet .card { margin: 0; padding: 14px 4px 4px; background: none; border: none !important; box-shadow: none; }

/* ===== v51: めもシート（日ごと＋📌ピン・えーくんGO 7/17） ===== */
#memo-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .6);
  z-index: 400;
  display: none;
  align-items: flex-end;
}
#memo-sheet {
  background: var(--surface);
  border-radius: 20px 20px 0 0;
  padding: 14px 16px calc(18px + env(safe-area-inset-bottom, 0px));
  width: 100%;
  max-height: 82vh;
  display: flex;
  flex-direction: column;
  transform: translateY(100%);
  transition: transform .25s ease;
}
#memo-sheet.cal-open { transform: translateY(0); }
.memo-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  flex-shrink: 0;   /* v71: リストが増えても頭とメモ欄は縮まない（縮むのはリストのスクロールだけ） */
}
.memo-close { padding: 9px 14px; font-size: .9rem; }
.memo-label { font-size: .8rem; color: var(--muted); margin-bottom: 3px; flex-shrink: 0; }
.memo-day {
  background: none;
  border: none;
  color: var(--text);
  font-family: inherit;
  font-size: 1.02rem;
  font-weight: 600;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.memo-box {
  flex-shrink: 0;   /* v71: ログが増えるとメモ欄が縮んでいくバグの修正（実機7/19） */
  width: 100%;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.6;
  padding: 10px 12px;
  margin-bottom: 10px;
  resize: none;
}
#memo-pin { border-style: dashed; }  /* ピン=点線枠（貼ってあるメモの記号） */
#memo-list {
  overflow-y: auto;
  min-height: 0;
  border-top: 1px solid var(--border);
  padding-top: 4px;
}
.memo-item {
  display: flex;
  align-items: baseline;
  gap: 10px;
  width: 100%;
  background: none;
  border: none;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  font-family: inherit;
  font-size: .95rem;
  padding: 11px 4px;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.memo-item-date { flex: 0 0 6em; color: var(--muted); font-variant-numeric: tabular-nums; }
.memo-item-prev { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.memo-empty { color: var(--muted); font-size: .9rem; text-align: center; padding: 14px 0; }

/* ===== v44: 休憩画面の改修（えーくん7/16） ===== */
/* アイコン拡大＋「休憩中」を大きく・2秒で消え2秒で点く明滅 */
#tz-paused .tz-icon { font-size: 1.8rem; }
#tz-paused .timer-icon-sm { font-size: 1.35rem; }
#tz-paused .tz-lbl {
  font-size: 1.05rem;
  animation: pauseBreathe 4s ease-in-out infinite;
}
@keyframes pauseBreathe {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0; }
}
/* 今日の休憩合計は実働と横並び（右端寄せ） */
.tz-pause-inline {
  margin-left: auto;
  color: var(--muted);
  font-size: .85rem;
  font-variant-numeric: tabular-nums;
}

/* アラーム=テンキーで分入力（プリセット廃止） */
.btn-alarm-open {
  width: 100%;
  min-height: 48px;
  font-size: 1rem;
}
#alarm-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .6);
  z-index: 400;
  display: none;
  align-items: flex-end;
  touch-action: none;   /* スクロール不要のオーバーレイの作法（css v26） */
}
#alarm-sheet {
  background: var(--surface);
  border-radius: 20px 20px 0 0;
  padding: 20px 16px calc(24px + env(safe-area-inset-bottom, 0px));
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  transform: translateY(100%);
  transition: transform .25s ease;
}
#alarm-sheet.cal-open { transform: translateY(0); }
.alarm-display {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 8px;
  background: var(--surface2);
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 14px;
}
#alarm-value {
  font-size: 2.4rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.alarm-unit { font-size: 1.2rem; font-weight: 700; color: var(--muted); }
.alarm-pad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
.alarm-pad button {
  background: var(--surface2);
  border: none;
  border-radius: 14px;
  color: var(--text);
  font-size: 1.7rem;
  font-weight: 700;
  min-height: 60px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.alarm-pad button:active { opacity: .75; }
.alarm-pad .alarm-key-sub { color: var(--muted); }
.alarm-go {
  width: 100%;
  min-height: 60px;
  background: var(--green);
  color: #000;
  border: none;
  border-radius: 14px;
  font-size: 1.15rem;
  font-weight: 900;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.alarm-go:disabled { opacity: .35; }
.alarm-go:active { opacity: .85; }


/* ═══════════════════════════════════════════════════════════════
   v40: 和帳簿テーマ（並行搭載・D1=テーマ換装）
   ?design=washi(昼・和紙) / ?design=sumi(夜・墨) / ?design=classic(解除)
   決定文書= CLAUDE.md「デザイン方針」。既定表示は従来のまま＝
   このブロックは html.d-washi / html.d-sumi が付いた時だけ生きる
   ═══════════════════════════════════════════════════════════════ */
@font-face{
  font-family:'Libre Caslon Text';
  src:url(data:font/woff2;base64,d09GMgABAAAAABVoABAAAAAANAQAABUMAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAG4JSHIFCBmAAXAiBDgmabREICrk8sUULZgABNgIkA4FIBCAFhWAHIAyBMRuKLjOSlU4PkanOxBg39MevP/9+/pda6W8AgzH2jAXNx/VhuBw05oybI+ccerDL40pVON8tC+zMrrwNEkHG5cqYP5A+YypGKoXKWAqdi1iHATr1/27zXQoGUANqDSpmqJVsTp/Q2cWDZqe7J36A/vO61Z9733sJCZbAQDBJxsKqZ8WQEVtYcYYvrpV7KVZU4uUvOtVuBR7+517vS4EoJeZ8CYCuyEZV/hQ29juzpv6XzTLtbu2dgTlykBxzFK9ej6D7t5ZoDkdHOHOE2tkDoMhAKOlIMmrNGUHmEJAyqtxJxJHjzEGe2BAkm8Wi50YNgjbEz/SZf/gkiKhHM1qQu9r+2EM6+rlv7n+Jjn65/PZX6Sh5tBN+aXB9af+bX6XOrTzO7pFDHXLpn/RFGpBDlwWvd0V/oi45dFTW/CFZqvn9mnjzN3JOx3SJqEX92CvIoR51+qB2udqnFsNccmixxv4xpdV+Ti6z+Xfz5+ZvcXZBLs0oJkUOdUmQ6HOIQx65Ofou8P/3ibqn+zjUh3g+5LdRrZhiOZDQSIJhDjEdlxRt7swhv/mQOs1fSFC3+Y8xu31OD4ULxe/H5qtf+wrxV7/zlW/S6W9/9TtfoaPGtapwCQVGzOk4dYyO67WP0tFSL596pivsu4Z3xjxDI2IKk/pJOksRTekF2qIXKaE5naMLhrfEM89IUY/O03kakufcFb8y+lRO5Rgi2k1c4jN0UdykkVZhW9Lgznbufjy/Q+8T02vuB08/iiZzPxAeE/12fY1z2FWEWGncIqejDgD7ePQKjSRWfp5K0Zyu00v0WtO0QDnv/OtqPmya5mnzx+afzU/HnX0n6osZSyDNwW7kHL6LxncHzf/dyHmm+f/Tj6qOFF9pDg4XX2k+u1Tjt91L/Jp+d29hTp4+ZiDFoEcms8y779Lo3i78B58wuBxgyxYHXD0ycKLyPe97Ea/Xci8IQ5AFabl6nQTpIk0gFLg4SOAo3jDez+FNP/H6lujrbJ3Bz0wIN7L3P2lCGQaVYeS5CXHbBoxFbkIsrOVa9HW2zsoNtnIT1qKvs3XGOJ+bEOdt0GNmwwdcVSWjl5siYHAPuncrrrKruRTW2gBOhJ5eg+4b0G7NwSF6OkA8535ut3x3QuvKf1vvtmjP2k1pIWJrJSg3+9YmcBVnDC8qN4yWzg1aMoUv0yAMLUSRwFMylCFv6tZeyvBlCj8zQS36OlvXoq/hFdka7ixk+JorriDi+nwrgje9Z4o8KO9bI21oGbcfGIg4CHHbSlBu9m2ClkJbx6+TQ7pIE/gKbZlKBsm0hLN3ALGGKNCaJWgr5owx0Ot3PdpjUG5wu7AHEOtiBVEk6KjX2wPSWToLHbWcrnKc6fWQScQSpOFFBWeVLJ0ojVtCgQNGgQPcNtBYcCNZrrpfmH5TB2dzky/wdgM2wGQeo9f7PTczYSBDOwsTDFXtOBk25SrBSEEUzBjqV5PJGEOZWoxK/D4feROMFWOijyec3/VoXckSY11wVTDGMpUJJmr3oam9zcqexXBffj/BIbV7z+w+WFEchLuBIyc/rGqa6EdJJhMNUaYYxwHughOl9fCCj5JBHJcMN8pNrTk3vCitKh5y/NEslBDlvQmqUL/UiZZuw2KodzDSO0U0756d/Fgva010RK4gNOjm60KI/RfAEUU1OdlDg4lMOcNApuhLeEXKBUT51uHDgsaUplVRH/Zj/CQOztgER1VNR+IEx1Qtrtlx4bATwmUnhcdOiRY7LXwWiDZ7RnTYs6Lb+0UlTZ4UfrH70EieQ3z60bF2gtmGnY7nfaPReKdp3jev0c8pwjBWjT/Pn+OMaxUC1BmAkgB1FqAigJoC1AsAtQWIK8VLH2VJkgKHC9YSoggDVcYlUGH6sZkrJDGSWYJzinmHHejIciFfPv1X6kDxgvN2depBLwuyVDg3q1viWGbOWwXnvqAbX9Xxi4qvSN3rkiIWkI23YYhYDqyz6fibb1CTrW7KRX1RHFPzKrmseMk7sn+SQLpcJLii5ieWCa7WywFCrxcJrqnaoeMRz3nnWSATnOhuVe3IHVmy2QueZe+FTF+/KsSxo7MECwU6jkPRMC+CF9XZft2jFF0d71dzybysFlETrpfyvBjJ8GQqWMMoXkbqf/ueecNhl4M3nKl72qapZHQ0V1L4CsrtAp5+jOri5c169cnN0cVGwtXlJjdwdBnA1cVLW0LxzKVkhjeV2+UikOjo7Vem0o4eYYUFp1oyVMLThSUuuBWVaPVYA2+qEEVbsEtUyBfPmcYZaBO8ZIYzMDNa0wnkcpHg5dWl6FRFt8GAcGDhUn+YiGXkKUEPzZyXMnxdDa3QLFPIDpcHP0IruvsewbJgrYEecpSW/j73DSkKtK108TEi4XTD9h16U0meG/AL3sYhbfLgvjW8tPN6Lo7GCW5VdH4/yBd8u51v4Yt8R2ERDzZ5qnA9rpiX4bWS1aLeGPD0HPOE9HQRmmZq9OElejKdNrxzXMlLnstF3+OvVN3xorT+7PTnP8VOAEMdvISddykXQRgq5aGVkXnI0RtQ8w0yjVMwB2j4VHoRUiQyfe4yJY/5knngyX2TFIlm5TzhrHtdTh7BHAAWF80qeMJZr2BWxRPO+gw4vYNOEVGcGXqjoUr8Am++zVkfXzgbEMwDgJ0fDQ0K5gHwhoUIXFJhJDpSzR1iDWJdDtBRQFVMsEAxYMn2jgsW5C1LGHBZVWChK0UEKKpkrKuR6BokunY8bhN12NP1AN0A0I3V3CmagG4G6BYAtcrErYEk9mktgNYBaD2ANgCoDUDtgFEdgjlAaz3qLBXPGnfyurhJd2tcHnPzgB7BHFhteo9AoK8ByPorAV2PNFCSmMEjYIZAXTYcAzeakRiYUQAbqwT0fdF4SWImjoCZBPCp0EaTioFJA9jGSsDQF20qSczmI2C2APjW0EazLQZmO2C8HYKF1cuWfJjdipU/u6p1dikjPPz6rIWfkuP//z+Q9+ZK0kvekiYAAMt/AQArnwAn0VWUQ+JPoNYn+tiSc3wOnsPL4bW/hOCypUvz81Fked5yAToXTYBR6Nz8fBShLG85syi3GA2jisqzijooVCHq/HmUSMZW5a5uRK0YG8759+IikMpmoczz52AaQeD72SyQWlyEpxEETD9/DjXHABSYWA6BSILJR1ZMCWWyZSwEgaebvZ9ozm6Ez4xCONQXCJh+uiGYVvqBntnTGc7D02eJO09+mKfMyHEJXBtzCQxAwBDjglUVJfDSLw7QhF1lp1s/iU15m1NanfM2nhlFRRclniGBvZ3NUk4jh+aRjD/Ubc4BILUIt2WzFbNQ5hSYXhDXo46c4bASzFRJzs+VjiVUt1obdw49UEwbwTSYlsb/Xf/yorh7CEI/oTG5ueYe/3CT+X2hz13PnGEnxem9z0EJBvGlNeVMccouDrjPYS1ozInCp8UHe0PIM3bqkA8wrP3syZGX5cCNiElsePqSzj3FuASpWmFG7ei7CoxHEaCV0sOUdgoHrjkMKAE7zdIg0p6Et98XrRd06RqYvgplThTPAKkr8NpsNrrnyBFXQ0dyBwv/cEUEW1Gd+OhqIhvZl9WHp5LmAyB1QZM9A6QubFup9wulPLh7CP2NDxo4CHzmcrfO9Gn07mEW5d8aa7S6Watb5DdNq27ub5rri6a1tbhft9B/z6lH7t/Sz6O/0lD0ui/B0xeA1CdQ5iK48f7zXLwEpo+xjp0C05fg6StAKspDKuZAC/cY8M4HZwQVxpvJgDUQCJ9/K67ad0oJ5gDvnABS2Eq4ejeY/khZ+7/N0P9892HOw5fXKC+UvB4p6rugkmD6UEPrHe91dtjnh5Ie92DSPt/RaX9vcL0bo3fidm/ciJvR2WRynR0/k07jd+tdMkERN1VU2lm6qciXKumiN9e6qMktqd0fOF82O10VGkmNacFLDKea/epqlaxR33Toy4/3kP8gsucmfJ+XXstE/zFXscFQxmdLyk3JgbzwaGvYVRU2yizVc8uCK+raY27HyLDTLY8zhEzCYxz+1au7yaUEtk3ICQjFwmBQKC7or9IXZLtfY+78rtZfe7qiEK1EDxWeXrr9e/XSnxnKbv+X7+kxGDtcAc/kpNsvW0P5J51wAYt/6dEMsZjAd0m5cYVKGI+UKSjSvu9kw9hPPncyRkHMmYMfrE6/uamz5vapmW7u8L6uPt/WkXiEIDI1aZRJm9vU1Wvw/sfRHE14Wky0+5h5Q72r0yj//hdVT3yPK0uwInQGU0Tz/g1gkWbxXu+FZIG23nh/U7DNYrIke7QO6wa5rlZr8jUFOTa+sVqlUsWby4y6Gp7cX6awxP/PjSbUVqtaYdbLJK5AiD7ULanR+oIxhyXgMZqq6pNCDrZ8dfrNTZ01t0/NdHOH93X1+baOxCMEkalJo0zapPu/6bJ/3HQbuG0WM3edSy8QuPScdWYLt81l4DcdhGOhEFy+H4M5D5eHQqjYQbT4EsOTW/pTqSfX4cE6cj8tJ3/fkaxOy1ntFIIiV08P6iQqr1uprOxtj74RdZSL3i449J3k7f+1U9Efo7Ff3eHsdaskote4tKvsZcs0ZimP7/JwhRKbmFbkKihY1rfFVUKqYYlLufnfj5gxPelvlXK8UqMMGkrvlTpygku/7NtfNHikfjsdZ4v4jCK+188TS35FLXblF3zX1+9E05+w2RYe5VEh5d+HUFh08xuw3z2xOlQRaBo/mGQcw8a6686+jNW4g3pzLGxfWiKUqMgFl1+qYMp4ZJ3mhGZKOCB5AyEWSgvQG16Gj5PyuGWv0FlPuYLvv2Ab4n67NWhTOBJMN4eu9Fr0GpdKRG4IHxGQZWQiCY/bseiNtBEE51m0zWSK9Tj//9dDiUDT+KEk4zgu1tdw9hWs2u3TWKIh+59KREI5Of/yS+tJMi1Jm/c67DZw2yxmrgXadK1lVWlN2W4ztg6Je9BMcx1sx7oWomnG37Zw1ubIXwplqxXd/ELXRnF/CyN3bElhu5nEHUX9xw5tv9rOWso/hns36tF87OH3q3GfS5AocTIx+cNy6UBhw/3nXlw8XbbjcWPj3lSxXyhfWb/ugtZma8uBzSuVnGrY1tqNjU39upEZfo2dVO3txsXq0cZLnZcaL73VTTgFp5d4663GW523Gk/ct+6f72edtLP4tx2755KQvMSYigzNf+Ds98RO+TROcgiW6hoLpqYkAgvi/tdPt5iHEDjyS6inAxgh9av0s2QrM+UHY4qEoGOSiIotMOMYgBLalgVYZauUSSOO2LCmp/ygpCQVkxA1wyGmfVkx3Z08nAzayQTraT8wctmwKRnUbL2TneoGuagXHUO3Xy15BFJmWhAiI9r5IAchxT2VP2LZ7n1sp9LesNKzfrBhVcIQCitJKG5CQUCJ2yAkhLyl4aMkJR8Dc4nbw57X8FxNz/nBkmjECEkmaiYFY5+k9AllYlAfzBluAwkLMcSS9pCmO34Q90miTiy5OTrCap8COYyApZAsboOmqSNQyhlKaknnFJHDb6tE7XzrneGpbuDVvWxAMuSgycwHlUFdRKvZB5VaX3QmgRx6vcAcGhr2vOGKruf9YEVYcrup0V/Y52EBHriuHiVqOw7guE69mEcaqSUOc8K2xXn/JPE+6dJZIOIjYHZalu6ZD2I/L5RRf8HV+zCTdoU+XN7K4XxU+lNvMGu6QggfSTY+3vCknvGD5eGmkErv/ct9bcYpr1qw2KpUDUmkSDCJQf3YAd9bL2MyRZAuRAF1Tc7N45Y6adOwQipKbIEJA7CUPF98xVl27KGU5ykz6wdbliWMkFRYGlQOAarpCMksDwSWS/Kk67opN5sQs1vvhIN9TCbiyyXtToZ5SQAdCbe3EtTJB1kw8T3r1+kFsTDk5i673czUrFZY2wclWSq+Dewt6pY8rkPTCagBROKAz9wHQZNJ23Zd16uEzIIfrDcOl1WcQTjiHBxmSQLJSrKcdZCA7RvbHo7HgoZbmHtB90wMmmQ0GTF10ilXyDl8dEk1bXqI9ZwTGMQOeEk+aSfHx8ZcaWb8YJ2xdxYVY6/ra5XkNxy+EnlTqwPyNQss9Gb87IWOQRPW+AuChDvz2/7m5fPtJYH7w/vcbPq6hAcJX8wlM7/O1A7eUCQz4Qscg7nW4tOZtW6JfOfBWA3ylOIYhCiJtuu61dcqHZVS7U1qrhmnt6EC633EsBK13eo7mbnKbUuFGAg92Cwm0yaZGE2l0l6EA91UgyZTeE6ue5aN1sqkYCQT8ZiUgpshgk4duxY1YkX28fTDJhvG+4rqjGxnX+rlWF6t2LadTNq2nY7oRT+Y6AQN9oZxdx8h7+mQ95MIwfMaMYsj+lqB6HTGTGv+XobsM0++ffaxY/HN/4d08dN7SOeb/k+fXG/xu93vfH7+xLkz6lXx5UxJnEQJa9bdDVbfnj9x/rh6dW7cyVfylVhJ1muN78Ameh0jvBMOj6PBe2ByHXWewDr6HWmexUaehEfPYwXV4dFNKNMlcOkGWNRHhe7EUppGlh7CMroNVXoeK2gEY3Qb6nQxPLoBFi2iSndgKbUh8phwF+PcxQPchcNd7OEuRrmLNnexvQdJYU9SGKq+S1HOskhiQiQyIdrYPu8n3VCDNQ+ybw8BuHMLCUg0McIt8JLhnFGYjzbdFsenFAf8F7ETBDXi4QSJTHF0QhxzYuyEeHpE6gkJvKI7IZEO+lQmDwcsBAjgYYROOvGjx4cVDwH26cD/bDjowI0PM51sssAaa1jR4cPILFr8OHDjYg8jEQK0s0M2M0EcaPFxgBFfLxDwynTTQfcsTXsUeeTbM6ElSAA3lngfFwG7iZBQ9QDNeNtxIDN0y312P10FX6SefnBIkZ6p74DPYWwKjOdtx4SM65CMZR6mxVuurF1DjULzykWhXDRJnkWJW+Yy62wxzahhEpTqOL53Fjceog4is+Ms5e1uegTI0q7OaqTawocbG0b0ZZo2P1ncTP6DcFjE/IVtxlpZHUR3cOd63DjpxIoTD1oc8uczd+fYjbfv1E7Nv18Gd8u/Pn/pTHiSfvUH/3YUVYgHTUzMG7kNj0rSzCdTXXKkW+63OJU6L/Un1ycXJMcnL5xpkfHE9sSKxB2lzfzNOco4SjlKOCKelIxllTN1Kskljjm1TlxtK7GpK0WNM8ypDaVkv5KPEPFTV/o9ZXOJRvNp6ZEtMpjYmFiUGJ/e8kN8ncfi71WJufcEQyJzcwA=) format('woff2');
}
/* v148 R1: 青緑グレー計器盤の配色土台（確定見本=no-upload/design_ref/tone_mock_v8.htmlのA状態）。
   --surface=カード#f4f6f0・--surface2=押せる面#eef0ea（枠線でなく明度差の文法）。
   旧抹茶の緑資産（動かす・フォーカス・選択・✓）は墨#22261fが引き継ぐ=彩色は朱・気温・会社色の3つだけ。
   値を変えたらapp.jsのWX_TONE_BASEも同値更新（ハーネスが機械検証） */
html.d-washi{
  --bg:#d8dcd5; --surface:#f4f6f0; --surface2:#eef0ea; --border:#b6bbb2;
  --green:#22261f; --green-dk:#4a4f45; --text:#22261f; --muted:#5c6158; --red:#a8402c;
  --dot-red:#a8402c;  /* R2: 衛星の朱=赤鉄（朱一滴=衛星の玉+終了のみ。sumiはvarのフォールバック#e03a2aのまま） */
}
html.d-sumi{
  --bg:#201e1a; --surface:#282520; --surface2:#312c24; --border:#3c382e;
  --green:#7a8552; --green-dk:#6a7446; --text:#e9e3d3; --muted:#9a927e; --red:#c96a52;
}
/* v75: 明朝は「和の顔」だけ（ロゴ・日付・地名）。本文と操作部はシステムゴシック=可読性優先
   （実稼働数日で「明朝は読みづらい」えーくん7/21・チャッピー事前警告どおりの役割分担。
   Noto Sans/ヒラギノ角ゴは端末標準=Webフォント追加なし・0KB・速度影響ゼロ。
   数字の世界観はLibre Caslon（下のブロック）が引き続き担う） */
html.d-washi .wx-date,html.d-sumi .wx-date,
html.d-washi .home-date,html.d-sumi .home-date,
html.d-washi .past-banner span,html.d-sumi .past-banner span{
  font-family:'Hiragino Mincho ProN','Yu Mincho','Noto Serif JP','BIZ UDMincho',serif;
}
html.d-washi .site-header,html.d-sumi .site-header{background:var(--bg);}
/* v115: ヘッダー薄型化（結界の罫線を撤去・紙と地続きにしてダイヤルを上げる=1画面コンソール8/19。
   ロゴ=入力モードの入口なのでこれ以上は絞らない（タップ判定を痩せさせない） */
html.d-washi .site-header,html.d-sumi .site-header{border-bottom:none;padding:8px 16px;}
/* 数字=Libre Caslon Text（合計・タイマー・入力・おつり・サービス金額）
   ※R1.5(css v149)でwashiは細ゴシックに上書き（下のR1.5ブロック）。この指定はsumi用に生存 */
html.d-washi .total-big,html.d-sumi .total-big,
html.d-washi .tz-count,html.d-sumi .tz-count,
html.d-washi .timer-count-sm,html.d-sumi .timer-count-sm,
html.d-washi #io-value,html.d-sumi #io-value,
html.d-washi .cash-field-val,html.d-sumi .cash-field-val,
html.d-washi .cash-change-val,html.d-sumi .cash-change-val,
html.d-washi .svc-big-amt,html.d-sumi .svc-big-amt{
  font-family:'Libre Caslon Text','Hiragino Mincho ProN',serif;
  font-weight:400;
}
/* 金額=墨（帳簿のインク。旧「金額=緑」はこのテーマでは墨が引き継ぐ・決定7/14） */
html.d-washi .total-big,html.d-sumi .total-big,
html.d-washi .svc-big-amt,html.d-sumi .svc-big-amt{
  color:var(--text);
  letter-spacing:0;
}
/* カード=紙（影なし。v172: 外枠線も撤去=面の色差だけで領域を示す・押せる物と同じ枠なし文法。
   帳簿の行の罫線(svc-bigのborder-bottom)は外枠でないので残す=帳簿の顔は維持） */
html.d-washi .card,html.d-sumi .card{box-shadow:none;border:none;}
/* サービス=帳簿の行（会社色の太枠→罫線・地は透明） */
html.d-washi .svc-big,html.d-sumi .svc-big{
  background:transparent;
  border:none!important;
  border-bottom:1px solid var(--border)!important;
  border-radius:0;
}
/* v172: 待機チップの枠線撤去=基礎の塗り(surface)に戻す（washiはさらに下のsurface2上書きが生きる） */
/* 稼働操作=塗り面（背景=var(--green)。washi=墨・sumi=抹茶のまま）・文字は生成り */
html.d-washi .btn-shift-start,html.d-sumi .btn-shift-start,
html.d-washi .btn-resume,html.d-sumi .btn-resume,
html.d-washi .io-add,html.d-sumi .io-add,
html.d-washi .cash-act,html.d-sumi .cash-act,html.d-washi .cash-slide-knob,html.d-sumi .cash-slide-knob{color:#f5f2e6;}  /* v250: 決定/ロック・解除つまみも1族=塗り+生成り */
html.d-washi .btn-shift-start,html.d-sumi .btn-shift-start{letter-spacing:.18em;font-weight:600;}
/* X投稿=罫線だけの控えめボタン（決定7/14） */
html.d-washi .btn-post,html.d-sumi .btn-post{
  background:transparent;
  border:1px solid var(--border);
  color:var(--text);
  font-weight:500;
  letter-spacing:.08em;
}
/* v41: 全画面オーバーレイの地紙。暗地rgba(13,13,13)ハードコードのままだと
   washiでは墨文字（[入力終了]・非アクティブタブ・「おつり電卓」）が沈んで読めない（実機7/16）。
   ボトムシート系（cal/tpl/cloud/pwa）はシート自体が明るく浮くので暗スクリムのまま */
html.d-washi #io-overlay,
html.d-washi #cash-overlay{background:rgba(216,220,213,.82);}
html.d-sumi #io-overlay,
html.d-sumi #cash-overlay{background:rgba(32,30,26,.72);}
/* v54: テンプレ編集も全画面シート族＝同じ地紙が必要だった（v41で「ボトムシート系」と
   誤分類した直し忘れ・実機7/17。編集画面なので透けは弱め=不透明度高めで読みやすさ優先） */
html.d-washi #tpl-overlay{background:rgba(216,220,213,.92);}
html.d-sumi #tpl-overlay{background:rgba(32,30,26,.88);}
/* v68: 過去日バナー=最後の発光オレンジ残党（#341c08/#f97316ハードコード・実機7/18）→
   テーマの弁柄色（--red）で組み直し。新色は足さない=彩色最小限の原則 */
html.d-washi .past-banner,html.d-sumi .past-banner{
  background:transparent;
  border:1px solid var(--red);
  color:var(--red);
}
html.d-washi .past-banner button,html.d-sumi .past-banner button{
  background:var(--red);
  color:#f5f2e6;
}
/* v55: テンプレ編集の残り色バグ（実機7/17）: 旧テーマの発光緑・黒文字のハードコード掃除 */
html.d-washi .tpl-token,html.d-sumi .tpl-token{background:rgba(111,122,77,.14);}  /* 蛍光緑→抹茶の薄地 */
html.d-washi .tpl-start,html.d-sumi .tpl-start,
html.d-washi .tpl-chip:active,html.d-sumi .tpl-chip:active{color:#f5f2e6;}  /* 抹茶地の黒文字→生成り */
/* タブ群の枠地: 白4%は明るい地の上では見えない→墨の薄掛け */
html.d-washi .io-tabs-money,
html.d-washi .io-tab-count{background:rgba(34,38,31,.06);}
/* 完了ボタンも抹茶ボタンの作法（文字=生成り。黒文字は抹茶地に沈む） */
html.d-washi .io-done,html.d-sumi .io-done,
html.d-washi .alarm-go,html.d-sumi .alarm-go{color:#f5f2e6;}
/* v71: カレンダーの選択日=抹茶地に黒文字で沈んでいた（実機7/19）→生成りに */
/* v103: カレンダー刷新（見本v10=和帳簿基準）のテーマ別調整 */
html.d-washi .cal-day{background:rgba(255,255,255,.6);}  /* 見本の#fff9・休みの日も同じ白（8/6） */
html.d-washi .cal-day.sun .cal-num{color:#9c3520;}  /* 弁柄 */
html.d-washi .cal-day.sat .cal-num{color:#3f5468;}  /* 藍鼠 */
/* v84→v91: 日付数字の緑判子（v91で今日マークに交換）。
   ↑のsun/sat色と同点のため後置=白抜きが必ず勝つ */
html.d-washi .cal-day.today .cal-num,html.d-sumi .cal-day.today .cal-num{color:#f5f2e6;}
html.d-sumi .cal-amt.ace{color:#c96a52;}  /* 墨地では朱が沈む→テーマredと同系に明るく */
/* v42: D2=IA変更。下部タブを出し、ヘッダーのボタン群はタブへ引っ越し（ヘッダー=ロゴだけに整理） */
html.d-washi #tabbar,html.d-sumi #tabbar{display:flex;}
/* v66: 天気は和帳簿の最上段（配達員は一日中天気を気にしてる=リザルトの上に常時が最強・決定7/14） */
html.d-washi .wx,html.d-sumi .wx{display:grid;}
/* css v211: レーダーはwxボタンの内側spanになった=天気枠と表示が一致するため単独のdisplay出し分けは不要（整理） */
html.d-washi .wx-lo{color:#4d7fa8;}  /* v211: 旧#93a9c8は薄すぎ（えーくんGO 9/18） */
html.d-washi .wx-chart i{background:#6f8fb8;}  /* v211: 旧#93a9c8より濃く */
html.d-washi .header-btns,html.d-sumi .header-btns{display:none;}
html.d-washi body,html.d-sumi body{padding-bottom:76px;}
/* v45: ボタン三族ルール（えーくんGO 7/16・決定）
   1族=塗り抹茶・文字生成り「動かす」／2族=罫線・墨文字「静かな」／3族=赤枠「終える」（btn-timer-end現状のまま）
   ※btn-timer-subは共用class: 休憩中の「稼働再開」=動かす・稼働中の「一旦オフ」=静か、を画面で分岐 */
html.d-washi .btn-resume,html.d-sumi .btn-resume,
html.d-washi #tz-paused .btn-timer-sub,html.d-sumi #tz-paused .btn-timer-sub,
html.d-washi .btn-takeover,html.d-sumi .btn-takeover{
  background:var(--green);
  border:2px solid var(--green);
  color:#f5f2e6;
}
html.d-washi #tz-working .btn-timer-sub,html.d-sumi #tz-working .btn-timer-sub,
html.d-washi .btn-midpost,html.d-sumi .btn-midpost,
html.d-washi .btn-alarm-open,html.d-sumi .btn-alarm-open,
html.d-washi .tpl-edit-btn,html.d-sumi .tpl-edit-btn{
  background:transparent;
  border:1px solid var(--border);
  color:var(--text);
}
/* v46: サービス行=帳簿の表組み（B案＋会社色の糸＋›・えーくんGO 7/17）
   未入力社はチップのまま待機→数字が入った社だけ行に昇格＝リザルトが入るほど表に育つ（えーくん発案）。
   列は固定幅（件数3.5em・売上6.5em右揃え）＝行が増えると縦にビシッと揃う */
html.d-washi .svc-grid,html.d-sumi .svc-grid{
  grid-template-columns:1fr;
  gap:0;
}
html.d-washi .svc-big,html.d-sumi .svc-big{
  display:flex;
  flex-direction:row;
  align-items:baseline;
  gap:8px;
  padding:11px 6px 11px 10px;
  min-height:0;  /* v47: 「1行がすごく広い」の犯人=classicの大ボタン用min-height:88pxの上書き漏れ（実機7/17） */
  text-align:left;
  border-left:3px solid var(--svc-color,var(--border))!important;  /* 会社色の糸（ロゴなしでも一瞬で識別） */
}
/* v140: .svc-big-icoの非表示ルールは撤去（v175で色丸絵文字ごと退役=DOMから消えた） */
html.d-washi .svc-big-name,html.d-sumi .svc-big-name{
  order:1;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.95rem;
}
html.d-washi .svc-big-cnt,html.d-sumi .svc-big-cnt{
  order:2;
  flex:0 0 3.5em;
  text-align:right;
  font-variant-numeric:tabular-nums;
  font-size:.95rem;  /* v47: classicの補助表示(.75rem)を引きずっていた。行では本文情報＝老眼原則の14px以上を確保 */
}
html.d-washi .svc-big-amt,html.d-sumi .svc-big-amt{
  order:3;
  flex:0 0 6.5em;
  text-align:right;
  font-size:1.15rem;
}
html.d-washi .svc-big::after,html.d-sumi .svc-big::after{
  content:'›';
  order:4;
  color:var(--muted);
  font-size:1.05rem;
}
/* v48: 文字の呼吸（えーくん実機7/17「詰め込もう感・隣と近すぎて読みづらい」＋小さい字の底上げ）
   参照画像の読みやすさの正体=字間。明朝の日本語に一律の字間を与え、数字（Caslon）は詰めたまま */
html.d-washi body,html.d-sumi body{letter-spacing:.05em;}
html.d-washi .total-big,html.d-sumi .total-big,
html.d-washi .tz-count,html.d-sumi .tz-count,
html.d-washi .timer-count-sm,html.d-sumi .timer-count-sm,
html.d-washi #io-value,html.d-sumi #io-value,
html.d-washi .cash-field-val,html.d-sumi .cash-field-val,
html.d-washi .cash-change-val,html.d-sumi .cash-change-val,
html.d-washi .svc-big-amt,html.d-sumi .svc-big-amt{letter-spacing:0;}  /* 帳簿の数字は詰めて組む */
html.d-washi .io-tab-v,html.d-sumi .io-tab-v{letter-spacing:0;}  /* v95: タブ累計も同作法（.05emの字間は6桁で約4px=狭い枠では実害） */
/* 「稼働開始」は特大すぎた→一段静かに（明朝+字間で存在感は保てる） */
html.d-washi .btn-shift-start,html.d-sumi .btn-shift-start{
  font-size:1.25rem;
  padding:20px;
}
/* 小さい字の底上げ（老眼原則: 本文14px以上・50cm距離） */
html.d-washi .tz-note,html.d-sumi .tz-note,
html.d-washi .total-sub,html.d-sumi .total-sub,
html.d-washi .tz-pause-line,html.d-sumi .tz-pause-line{font-size:.95rem;}
html.d-washi .tz-lbl,html.d-sumi .tz-lbl{font-size:1rem;}
html.d-washi .tz-pause-inline,html.d-sumi .tz-pause-inline{font-size:.9rem;}
/* 非公式注記: 読めないレベル(.7rem/#444固定)は明記の意味がない→読めるサイズ・テーマの薄墨に */
/* v49: 字間の精密調整（えーくん実機7/17「出前館がほぼくっついてる・10件/¥1000がきつい」
   →参照画像の組み方に合わせる: 社名=広い字間・数字と単位/記号の間にすき間） */
html.d-washi .svc-big-name,html.d-sumi .svc-big-name{letter-spacing:.15em;}
html.d-washi .yen-mark,html.d-sumi .yen-mark{margin-right:.09em;}
html.d-washi .unit-mark,html.d-sumi .unit-mark{margin-left:.18em;}
html.d-washi .pwa-hint-btn,html.d-sumi .pwa-hint-btn{
  letter-spacing:.09em;
  font-size:.95rem;  /* .85rem=13.6pxは老眼原則の下限割れだった */
}
/* v50: 脱・太字（えーくん7/17「太字が清涼感を消す」。参照画像は明朝regularの世界=
   視認性は太さでなく字間とサイズで確保する。数字はCaslon 400で統一済み） */
html.d-washi button,html.d-sumi button,
html.d-washi .fold summary,html.d-sumi .fold summary{font-weight:500;}
html.d-washi .svc-big-name,html.d-sumi .svc-big-name,
html.d-washi .io-tab-l,html.d-sumi .io-tab-l,
html.d-washi .home-date,html.d-sumi .home-date,
html.d-washi .total-sub,html.d-sumi .total-sub,
html.d-washi .tz-note,html.d-sumi .tz-note,
html.d-washi .pwa-hint-btn,html.d-sumi .pwa-hint-btn{font-weight:400;}
html.d-washi .ended-title,html.d-sumi .ended-title,
html.d-washi .cloud-title,html.d-sumi .cloud-title,
html.d-washi .io-svc,html.d-sumi .io-svc{font-weight:600;}
/* 長文の開始ボタンは字間を絞る（.18emは「稼働開始」4文字用・日付入り長文だと間延び=実機7/17） */
html.d-washi .btn-shift-long,html.d-sumi .btn-shift-long{letter-spacing:.05em;}  /* v100: tz-newday廃止で選択子掃除 */
/* v53: トーストは下部タブの上に出す（bottom:24pxのままだとタブと重なる）
   v56: 文字=生成り（抹茶地に黒は沈む・「おまかせに戻しました」実機7/17。赤系エラーも生成りで統一） */
html.d-washi .toast,html.d-sumi .toast{bottom:88px;color:#f5f2e6;}
/* v52: タイマーのライブ行=帳簿の行（罫線・Caslonの数字・地は透明） */
html.d-washi .tz-line,html.d-sumi .tz-line{
  background:transparent;
  border:none;
  border-bottom:1px solid var(--border);
  border-radius:0;
}
html.d-washi .tz-line-count,html.d-sumi .tz-line-count{
  font-family:'Libre Caslon Text','Hiragino Mincho ProN',serif;
  font-weight:400;
  letter-spacing:0;
}
/* v149 R1.5: washiの数字=細ゴシック（確定8/28「実用計器だから」・見本=tone_mock_v8の.num準拠）。
   Caslonはsumi専用として残置（5R中sumi不触。@font-faceの完全退役はsumiの去就決定時）。
   ダイヤル系(.dial-num/.dial-time/.dstat-n)もここで上書き=特異性でプレーン指定に勝つ。
   v150: weight200→300（見本帖のThinはPCの話・実機「老眼には厳しい細さ」えーくん8/28） */
html.d-washi .total-big,
html.d-washi .tz-count,
html.d-washi .timer-count-sm,
html.d-washi #io-value,
html.d-washi .cash-field-val,
html.d-washi .cash-change-val,
html.d-washi .svc-big-amt,
html.d-washi .tz-line-count,
html.d-washi .dial-num,
html.d-washi .dial-time,
html.d-washi .dstat-n{
  font-family:'Helvetica Neue',-apple-system,'Hiragino Sans','Noto Sans JP',sans-serif;
  font-weight:300;
  letter-spacing:.01em;
}
/* v229→v230（えーくんGO 9/22〜23・モック審査= design_ref/gen_num_weight_artifact.py）: 数字の太さは3段
   「打つ=900／読む=500／顔=300」。打つ数字（おつり電卓の3値・入力モードの液晶）=標準ゴシック900・字間-.02em／
   読む数字（各社カードの金額・件数/時給/平均単価）=書体そのまま500（600はAndroidのNoto Sansが持たず端末で揺れる）／
   顔（ダイヤルの¥・稼働時間）=細ゴシック300のまま（直上のブロック）。太さは変数=将来の設定「文字: 老眼向け（切・中・大）」は
   この2変数を振るだけ（えーくん9/23）。**直上の300より後に置く=後勝ち**（v229で前に書いてカスケードで負けた） */
html.d-washi,html.d-sumi{--num-w-input:900;--num-w-read:500;}
html.d-washi .cash-field-val,html.d-sumi .cash-field-val,
html.d-washi .cash-change-val,html.d-sumi .cash-change-val,
html.d-washi #io-value,html.d-sumi #io-value{font-family:inherit;font-weight:var(--num-w-input);letter-spacing:-.02em;}
html.d-washi .svc-big-amt,html.d-sumi .svc-big-amt,
html.d-washi .dstat-n,html.d-sumi .dstat-n{font-weight:var(--num-w-read);}  /* dial-onカードの金額は下の400ブロックの直後で再指定 */

/* ═══════════════════════════════════════════════════════════════
   v105: 羅針盤ダイヤル（実装第1弾R1・設計図=design_ref/gadget_mock_v12.html・えーくんGO 8/18）
   washi/sumi時だけJSが表示（dialActive）。classic=旧表示のまま。
   ◀▶=画面端の日付ナビ（absolute・fixed禁止=日送りクローンの安全条件）
   ═══════════════════════════════════════════════════════════════ */
/* v118: ダイヤル一族の見た目=class指定（dial-zone/dial-face/dial-compass/dial-stats）。
   日送りクローンはid全剥がし=IDセレクタの見た目はクローンで裸になる（8/19実機被弾）。
   JSのgetElementById用にidは併存 */
.dial-zone{
  position:relative;
  display:flex;
  justify-content:center;
  /* v115: 下16px=衛星軌道のクリアランス（銀線r146+赤丸がダイヤル下端から13px+影2pxはみ出す
     →時給の文字と衝突・えーくん実機8/19） */
  margin:12px 16px 16px;
}
/* v120: ◀▶=縮小+画面端へ寄せ（「三角は大きいと悪目立ちする」プロ助言+衛星軌道r146と接触・
   えーくん実機8/20。glyphは端寄せ=軌道クリア・当たり判定34×76は維持） */
.dial-nav{
  position:absolute;
  left:-16px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:76px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  background:transparent;
  border:none;
  padding:0 0 0 9px;  /* v121: 3→9px=glyphをわずかにダイヤル側へ（端すぎた・えーくん実機8/20） */
  font-size:15px;
  color:var(--muted);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  z-index:2;
}
.dial-nav-next{left:auto;right:-16px;justify-content:flex-end;padding:0 9px 0 0;}
.dial-wrap{position:relative;}
.dial-face{
  --dial-bg:#26231d;
  --dial-fg:#f5f3ee;
  --dial-line:#b7b3a8;
  width:280px;
  height:280px;
  border-radius:50%;
  background:var(--dial-bg);
  color:var(--dial-fg);
  border:none;
  padding:0;
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  box-shadow:0 0 0 5px var(--bg), 0 0 0 6px var(--dial-line);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  font-family:inherit;
}
html.d-sumi .dial-face{--dial-bg:#2b2822;--dial-fg:#ece6d6;--dial-line:#4a463c;}
.dial-ring{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;}
.dial-ring circle{stroke:rgba(245,243,238,.35);stroke-width:1;}
.dial-ring text{font-size:13px;fill:rgba(245,243,238,.8);}
.dial-ring text.dial-n{fill:#e08a75;}
.dial-ticks line{stroke:rgba(245,243,238,.4);stroke-width:1.3;}
/* v110-111: コンパス回転=グループはCSS transform（GPU合成=診断口の滑らかさ）。
   文字の逆回転はSVG属性rotate（JS側dialCompassApply）。CSSのtransform-box（fill系）は
   iOS SafariがSVG textで解釈できず文字が消えるため使用禁止（実機8/19・ハーネスが機械検証） */
.dial-compass{transform-box:view-box;transform-origin:50% 50%;will-change:transform;}
/* v112: iOSは東西南北をデフォルト非表示（許可がセッション限りのApple仕様→🧭タップで登場・えーくん決定8/19） */
.compass-off .dial-compass text{display:none;}
/* v113: 🧭=ヘッダーの絶対配置（header-btnsは和帳簿でdisplay:none=中に入れると親ごと消える・8/19被弾）。
   v235: 右端→左端（お手本の構図=左に計器類・右に歯車・えーくん9/24） */
#compass-btn{
  position:absolute;
  left:8px;
  top:50%;
  transform:translateY(-50%);
  min-width:44px;
  min-height:44px;
  background:transparent;
  border:none;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
/* v106: 全行=固定高さスロット（座標固定・えーくん実機8/18「日送りで縦位置が動くと煩わしい」）。
   出ない行はvisibilityで消す=高さは常に確保→どの日でも日付・売上の座標が不動 */
.dial-off{visibility:hidden;}
.dial-date{
  font-size:26px;
  font-weight:700;
  letter-spacing:.02em;
  line-height:1.1;
  height:29px;
  color:var(--dial-fg);
  font-family:'Hiragino Mincho ProN','Yu Mincho','Noto Serif JP','BIZ UDMincho',serif;
}
/* v185: small→.dd-w（日付3スパン化）。この行はsumi/classic用の旧見た目・括弧もsumiだけCSSで復元 */
.dial-date .dd-w{font-size:15px;font-weight:600;margin-left:3px;}  /* v170: opacity:.75撤去（dd-mと同判断・曜日≧日にちの序列にも濃さ引きは逆行） */
html.d-sumi .dd-w::before{content:'（';}
html.d-sumi .dd-w::after{content:'）';}
/* v108: 天気の予約席は撤去（v132決定=ダイヤルに天気を入れない・スクショプライバシー） */
.dial-num{
  /* v106: 40→44（実機「売上少し小さい」8/18）→v168: 44→41→**v169: 38（iPhone 12miniで窮屈・
     えーくん8/29に2段階で下げた）**。※v106の「40では小さい」判定を下回るが、当時よりダイヤル内の
     要素が増えている（スイッチ・指標3連）ので同じ数字でも窮屈さが違う＝v106の蒸し返しではない。
     **heightは49pxのまま据え置き**＝v130「固定高さスロット=座標が日送りで動かない」を守る
     （文字だけ縮んでスロット内の余白が増える＝窮屈感の解消はそこで取る・下の要素は1pxも動かない） */
  font-size:38px;
  line-height:1.1;
  height:49px;
  margin:2px 0 8px;
  color:var(--dial-fg);
  font-family:'Libre Caslon Text','Hiragino Mincho ProN',serif;
  letter-spacing:0;
  white-space:nowrap;
}
.dial-num.dial-num-sm{font-size:31px;}  /* v168→v169: 36→34→31（本体と同率＝100万超えの落差を保つ） */
.dial-yen{font-size:22px;margin-right:2px;}  /* v168→v169: 26→24→22（¥据え置きは数字とのバランスが崩れる） */
/* v142: 操作スイッチ（状態ピルの後継・えーくん8/19設計。状態ランプ●=外周衛星が担当で廃止）。
   カプセル1本にセグメント3枠・入っている位置=点灯（生成りに反転）。スロット高さ=旧ピルと同じ帯
   （v130固定スロット=座標不動）。終了枠=3族の赤の血筋。idle=［▶開始する］1枠が同じカプセルに入る */
.dial-sw{
  display:flex;
  align-items:center;
  gap:2px;
  border:1.5px solid rgba(245,243,238,.55);
  border-radius:999px;
  padding:2px;
  min-height:31px;
  box-sizing:border-box;
  position:relative;  /* v191: つまみ（絶対配置）の親 */
}
.dial-sw-seg{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:56px;
  min-height:25px;
  padding:2px 10px;
  box-sizing:border-box;
  border-radius:999px;
  font-size:14.5px;  /* v119: 13pxは12mini実機で「ちょっと小さい」（えーくん8/19）→旧状態ピルと同寸へ */
  font-weight:700;
  letter-spacing:.12em;
  color:rgba(245,243,238,.72);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  white-space:nowrap;
  position:relative;  /* v191: つまみより上に描画（positioned同士はDOM順・washiは既存relを踏襲） */
  transition:color .18s ease;  /* v191: つまみのスライドに合わせ文字色もクロスフェード */
}
/* v191: スライドつまみ=白枠の別部品（点灯の背景はsegからここへ移管）。
   位置・寸法はJSがinline styleで実測適用（dialSwThumbRender）。thumb-jump=無アニメ配置（出現・resize） */
.dial-sw-thumb{
  position:absolute;left:0;top:0;
  border-radius:999px;
  background:#f5f3ee;
  transition:transform .22s cubic-bezier(.32,.72,.28,1),width .22s cubic-bezier(.32,.72,.28,1);
}
.dial-sw-thumb.thumb-jump{transition:none;}
.dial-sw-seg.on{color:#26231d;}
.dial-sw-end{color:rgba(240,140,125,.9);}
.dial-sw-end.on{color:var(--red);}
.dial-sw-start{background:#f5f3ee;color:#26231d;letter-spacing:.18em;padding:2px 20px;}
.dial-sw-disabled{opacity:.45;pointer-events:none;}
.dial-sw-viewer{font-size:14.5px;font-weight:600;letter-spacing:.14em;color:rgba(245,243,238,.8);padding:2px 12px;}
.dial-time{
  font-size:19px;
  font-weight:700;
  height:26px;
  margin-top:8px;
  color:var(--dial-fg);
  font-family:'Libre Caslon Text','Hiragino Mincho ProN',serif;
  letter-spacing:0;
}
/* v142: ⏱スロットの脇役メモ（昨日リザルト/押し忘れ注記）。数字書体でなく地の文の顔に */
.dial-time.dial-time-note{
  font-size:12.5px;
  font-weight:600;
  font-family:inherit;
  letter-spacing:.04em;
  color:rgba(245,243,238,.72);
}
/* 320px級の狭幅端末はダイヤルを一回り縮小（ring=viewBoxごと追従）。
   v142: スイッチも一回り縮小（それでも入らない実機が出たら⏸/●/⏹の記号短縮へ=えーくん8/19） */
@media (max-width:340px){
  .dial-face{width:248px;height:248px;}
  .dial-num{font-size:33px;height:43px;}      /* v168→v169: 38→36→33（本体と同率・heightは据え置き） */
  .dial-num.dial-num-sm{font-size:28px;}      /* v168→v169: 32→30→28 */
  .dial-sw-seg{min-width:46px;padding:2px 7px;font-size:13px;letter-spacing:.05em;}
}

/* ═══ v107-108: 天気パネルのスリム化（R2→R2.1・えーくんGO 8/19）═══
   ダイヤル表示中（body.dial-on・renderHomeが付け外し）に隠すのは日付だけ（ダイヤルと二重）。
   天気・気温・最高/最低・場所・雨予告・雨量グラフ・レーダーはパネルに常駐=「雨グラフのそばに
   天気とエリア」（v132決定: ダイヤルに天気を入れない=スクショプライバシー。
   ダイヤル非表示（idleの今日等）=フルパネルのまま） */
.dial-on .wx{padding:8px 10px 6px;margin-top:4px;}
.dial-on .wx .wx-date{display:none;}  /* v159: 場所がwx-subへ移動し日付だけの行になったため行ごと隠す */
.dial-on .wx-chart{height:32px;}  /* v211: 確定モックv8の高さに揃える（旧30px） */

/* ═══ v109: R3=衛星・指標3連・4社カード（えーくんGO 8/19・正=gadget_mock_v12）═══ */
/* 赤丸衛星: 外周の外の薄い銀線r=146の真上・10px（見本帖v10決定）。色=状態ランプ */
.dial-dot{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--dot-red,#e03a2a);
  box-shadow:0 0 0 2px var(--bg);
  pointer-events:none;
  z-index:1;
}
.dial-dot.dial-dot-pause{background:#d9a441;}
/* v135: 衣替え=7〜9月の休憩は氷色（暦で固定=日々揺れない・えーくんGO 8/24。彩度明度は琥珀と同格） */
.dial-dot.dial-dot-pause.dial-dot-summer{background:#55a9c6;}
/* v119: 終了後=消灯しない・薄鼠で最終実働位置に残す（えーくん8/19「終了しても衛星は残したい」） */
.dial-dot.dial-dot-end{background:#b5b0a4;}
/* v127: 衛星の生命化（えーくんGO 8/23）。動きは全てtransform=GPU合成・位置(left/top)とは別レーン。
   稼働中=少し楕円で高速自転（生きて働いてる）／休憩中=真ん丸+琥珀で呼吸／終了=薄鼠で静止（不変） */
/* v130: 色替え（朱↔琥珀↔薄鼠）=徐々に0.8秒（「休憩でいきなり変わる」の解消・propertyを明示） */
.dial-dot{will-change:transform;transition:background-color .8s ease;}
/* v130→v166: 自転=.15s/周（8/29に約1.5倍速へ・継ぎ目は4turn/720degで再計算）・大きさ=v129の1.5倍（えーくん?dotdemo判定8/23）。
   css v162: 楕円をさらに30%細く .38→.27（えーくん8/28。離陸終形・着陸/減速初形も同形=継ぎ目維持で5箇所セット） */
.dial-dot.dial-dot-spin{animation:dialSpin .15s linear infinite;}
@keyframes dialSpin{
  from{transform:rotate(0turn) scale(1.01,.27);}
  to{transform:rotate(1turn) scale(1.01,.27);}
}
.dial-dot.dial-dot-breathe{animation:dialBreathe 2.6s ease-in-out infinite;}
@keyframes dialBreathe{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.35);}
}
/* v132: 離陸回転=着陸の逆再生（えーくん発見8/23）。丸のまま着地→静止から加速しつつ楕円へ1.2秒。
   加速bezier(.4,0,.67,.34)=着陸bezier(.33,.66,.6,1)の鏡映=入り勾配0・出口勾配2→
   終速=2×(4/1.2)=6.7回転/s=自転と同速で継ぎ目なし。spinより後置=同時に付いてもこちらが勝つ */
.dial-dot.dial-dot-spinup{animation:dialSpinUp 1.2s forwards;}
@keyframes dialSpinUp{
  0%{transform:rotate(0turn) scale(1,1);animation-timing-function:cubic-bezier(.4,0,.67,.34);}
  100%{transform:rotate(4turn) scale(1.01,.27);}
}
/* v134: スイッチ内の衛星（▶退役・えーくんGO 8/24）。待機=黒芯+朱リング=消灯の待機ランプ
   （芯まで赤だとRECに見える）。点火=.litで芯に朱が満ちる→その座標から飛び立つ */
.dial-sw-dot{
  display:inline-block;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--text);
  border:1.5px solid var(--dot-red,#e03a2a);
  box-sizing:border-box;
  margin-right:7px;
  vertical-align:-1px;
  transition:background-color .2s;
}
.dial-sw-dot.lit{background:var(--dot-red,#e03a2a);}
/* ?dotdemo用: 待機の見た目再現（黒芯+朱リング） */
.dial-dot.dial-dot-demoidle{background:var(--text);box-shadow:0 0 0 1.5px var(--dot-red,#e03a2a);}

/* ═══ v167: 稼働中のバチバチ（?dotdemo&zap=N の実験専用・えーくんGO 8/29）═══
   狙い=棒状の楕円の長さを左右非対称に突発的に伸び縮み＝生物の不随意運動。
   【本番の.dial-dotは無傷】shell/body/coreはデモが自転の局面にだけ生やす（zap未指定なら一切生えない）。
   ・自転のrotateは親が占有済み→伸縮は子の別レーンへ（transformの奪い合いを回避）
   ・**step-end=キーフレーム間を補間しない**＝値が瞬間ジャンプ＝「バチッ」の正体（滑らかなうねりの逆）
   ・**87%は基準形のまま**・スパイクは短く不規則にばら撒く（動きっぱなしはただの振動でバチバチに見えない）
   ・**縮むスパイクも混ぜる**（伸びるだけだと単調・縮みが入ると「ビクッ」という不随意感が出る）
   ・左右非対称= translateX と scaleX の組（scaleX単体は中心対称＝片側だけは作れない）
     左をa右をb伸ばす ＝ translateX((b-a)/2) scaleX((L+a+b)/L)
   ・2.7sと4.3s=互いに素(27:43)の2レーン重ね→重なりの一周は116秒＝目にループが見えない
     （v171: 旧1.1s:1.7sは「最大スパイクが1.1秒おきに同じ顔で再来する拍」を実機で看破された8/29→
      周期を伸ばし、大スパイク(+.42〜.5級)を両レーンの不等間隔な位置に散らして拍を消した）
   ・強さは--zapで一括スケール（step-end=補間しないのでcalc+varが素直に効く） */
.dial-dot.dial-dot-shell{background:transparent;box-shadow:none;}
.dial-dot-shell .dot-body,.dial-dot-shell .dot-core{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
}
.dial-dot-shell .dot-body{animation:dotZapA 2.7s step-end infinite;}
.dial-dot-shell .dot-core{
  border-radius:50%;
  background:var(--dot-red,#e03a2a);
  box-shadow:0 0 0 2px var(--bg);
  animation:dotZapB 4.3s step-end infinite;
}
@keyframes dotZapA{
  0%,100%{transform:translateX(0) scaleX(1);}
  3%     {transform:translateX(calc(1.2px * var(--zap,1)))  scaleX(calc(1 + .3 * var(--zap,1)));}
  4%     {transform:translateX(0) scaleX(1);}
  9%     {transform:translateX(calc(-.5px * var(--zap,1)))  scaleX(calc(1 - .22 * var(--zap,1)));}
  10%    {transform:translateX(0) scaleX(1);}
  14%    {transform:translateX(calc(2px * var(--zap,1)))    scaleX(calc(1 + .5 * var(--zap,1)));}
  15.5%  {transform:translateX(0) scaleX(1);}
  22%    {transform:translateX(calc(-.9px * var(--zap,1)))  scaleX(calc(1 + .24 * var(--zap,1)));}
  23%    {transform:translateX(0) scaleX(1);}
  29%    {transform:translateX(calc(1.5px * var(--zap,1)))  scaleX(calc(1 + .36 * var(--zap,1)));}
  30%    {transform:translateX(0) scaleX(1);}
  33%    {transform:translateX(calc(.4px * var(--zap,1)))   scaleX(calc(1 - .28 * var(--zap,1)));}
  34%    {transform:translateX(0) scaleX(1);}
  41%    {transform:translateX(calc(-1.7px * var(--zap,1))) scaleX(calc(1 + .46 * var(--zap,1)));}
  42.5%  {transform:translateX(0) scaleX(1);}
  50%    {transform:translateX(calc(.7px * var(--zap,1)))   scaleX(calc(1 + .2 * var(--zap,1)));}
  51%    {transform:translateX(0) scaleX(1);}
  58%    {transform:translateX(calc(-1.2px * var(--zap,1))) scaleX(calc(1 + .32 * var(--zap,1)));}
  59%    {transform:translateX(0) scaleX(1);}
  67%    {transform:translateX(calc(1px * var(--zap,1)))    scaleX(calc(1 + .26 * var(--zap,1)));}
  68%    {transform:translateX(0) scaleX(1);}
  76%    {transform:translateX(calc(-1.6px * var(--zap,1))) scaleX(calc(1 + .42 * var(--zap,1)));}
  77.5%  {transform:translateX(0) scaleX(1);}
  85%    {transform:translateX(calc(.5px * var(--zap,1)))   scaleX(calc(1 - .18 * var(--zap,1)));}
  86%    {transform:translateX(0) scaleX(1);}
  93%    {transform:translateX(calc(1.1px * var(--zap,1)))  scaleX(calc(1 + .28 * var(--zap,1)));}
  94%    {transform:translateX(0) scaleX(1);}
}
@keyframes dotZapB{
  0%,100%{transform:translateX(0) scaleX(1);}
  5%     {transform:translateX(calc(-.7px * var(--zap,1)))  scaleX(calc(1 - .2 * var(--zap,1)));}
  6%     {transform:translateX(0) scaleX(1);}
  11%    {transform:translateX(calc(1px * var(--zap,1)))    scaleX(calc(1 + .28 * var(--zap,1)));}
  12%    {transform:translateX(0) scaleX(1);}
  19%    {transform:translateX(calc(-1.9px * var(--zap,1))) scaleX(calc(1 + .48 * var(--zap,1)));}
  20%    {transform:translateX(0) scaleX(1);}
  26%    {transform:translateX(calc(.6px * var(--zap,1)))   scaleX(calc(1 + .22 * var(--zap,1)));}
  27%    {transform:translateX(0) scaleX(1);}
  35%    {transform:translateX(calc(-.5px * var(--zap,1)))  scaleX(calc(1 - .24 * var(--zap,1)));}
  36%    {transform:translateX(0) scaleX(1);}
  44%    {transform:translateX(calc(1.4px * var(--zap,1)))  scaleX(calc(1 + .34 * var(--zap,1)));}
  45%    {transform:translateX(0) scaleX(1);}
  53%    {transform:translateX(calc(-1px * var(--zap,1)))   scaleX(calc(1 + .26 * var(--zap,1)));}
  54%    {transform:translateX(0) scaleX(1);}
  61%    {transform:translateX(calc(.9px * var(--zap,1)))   scaleX(calc(1 + .3 * var(--zap,1)));}
  62%    {transform:translateX(0) scaleX(1);}
  72%    {transform:translateX(calc(-1.6px * var(--zap,1))) scaleX(calc(1 + .44 * var(--zap,1)));}
  73%    {transform:translateX(0) scaleX(1);}
  81%    {transform:translateX(calc(.4px * var(--zap,1)))   scaleX(calc(1 - .16 * var(--zap,1)));}
  82%    {transform:translateX(0) scaleX(1);}
  90%    {transform:translateX(calc(1.2px * var(--zap,1)))  scaleX(calc(1 + .28 * var(--zap,1)));}
  91%    {transform:translateX(0) scaleX(1);}
}

/* v133: 休憩の入口=着陸の回転部だけ（減速1.2秒→丸。backgroundは書かない=琥珀への色替えは
   base transitionが0.8秒でふわっと運ぶ・えーくんGO 8/24「休憩の出入口=終了の再生/逆再生」） */
.dial-dot.dial-dot-slowdown{animation:dialSlowDown 1.2s forwards;}
@keyframes dialSlowDown{
  0%{transform:rotate(0turn) scale(1.01,.27);animation-timing-function:cubic-bezier(.33,.66,.6,1);}
  100%{transform:rotate(4turn) scale(1,1);}
}
/* v131: ジャンプの残像（左カーブの通過点に落ちて0.6秒で消える。飛行本体=JSのrAFベジェ=dialDotFlyCurve・
   旧.dial-dot-flyの直線トランジションは退役） */
.dial-trail{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--dot-red,#e03a2a);
  pointer-events:none;
  z-index:1;
  animation:dialTrail .6s ease-out forwards;
}
@keyframes dialTrail{
  from{opacity:.45;transform:scale(.7);}
  to{opacity:0;transform:scale(.25);}
}
/* v131: 着陸=2秒（えーくん8/23）。減速しながら同じカーブで丸・元サイズへ戻す→停止と戻し完了が
   同時（1.2秒）→そこから徐々に薄鼠（0.8秒）。初速=自転と同速の数学合わせは再計算して維持
   （自転6.7回転/s・bezier(.33,.66,.6,1)=勾配2・1.2秒で4回転→初速=2×(4/1.2)=6.7回転/s=連続。
   spinより後置=同時に付いてもこちらが勝つ） */
.dial-dot.dial-dot-landing{animation:dialSpinDown 2s forwards;}
@keyframes dialSpinDown{
  0%{transform:rotate(0turn) scale(1.01,.27);background:var(--dot-red,#e03a2a);animation-timing-function:cubic-bezier(.33,.66,.6,1);}
  60%{transform:rotate(4turn) scale(1,1);background:var(--dot-red,#e03a2a);}
  100%{transform:rotate(4turn) scale(1,1);background:#b5b0a4;}
}
/* ═══ v151 R2: ダイヤル軽量化A案「金額フル・脇絞り」（washiのみ・えーくんGO 8/28・
   確定見本=tone_mock_v8.htmlのA状態・仕様=CLAUDE_spec.md「次期デザイン」節）═══
   全面墨→透明化: 墨の核=radial-gradient（closest-side 65%=280px面でr91・248px面は自動追従）だけ残し、
   方位・目盛り・r118リングは地に細線。外周軌道線r146=box-shadowの--dial-line差し替えで続投。
   sumi=全面墨のまま不触。¥44pxは不変=主役フル・絞るのは日付/スイッチ/実働の脇だけ */
html.d-washi .dial-face{
  --dial-bg:#20241e;
  --dial-fg:#f5f6f2;
  --dial-line:#b6bbb2;
  background:radial-gradient(circle closest-side, var(--dial-bg) 64.7%, rgba(32,36,30,0) 65.3%);
  box-shadow:none;  /* R2.1: box-shadowの軌道線r146は退役（washiの軌道=SVGのdial-orbit r124） */
}
html.d-washi .dial-ring circle{stroke:var(--muted);opacity:.7;}
html.d-washi .dial-ring text{fill:var(--muted);}
html.d-washi .dial-ring text.dial-n{fill:var(--red);}
html.d-washi .dial-ticks line{stroke:var(--muted);opacity:.7;}
/* v156: 日付=B案「曜日ピル」確定（えーくん8/28・見本=date_mock_v1のB+実機調整3点:
   ピルまん丸(正円)・日にちにギリ寄せml3px・月16px。重要度=曜日≧日にち＞月・英語曜日は禁止） */
html.d-washi .dial-date{
  font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  font-weight:400;
  letter-spacing:.02em;
  height:30px;
  opacity:.85;
  display:flex;
  align-items:baseline;
  justify-content:center;
}
html.d-washi .dd-m{font-size:16px;margin-right:1px;}  /* v170: opacity:.6撤去=直射日光で薄字は読めない・序列はサイズ差(16/26)だけで立つ（えーくん8/29） */
html.d-washi .dd-d{font-size:26px;}
html.d-washi .dd-w{
  font-size:16px;
  font-weight:500;
  opacity:1;
  width:27px;
  height:27px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1.5px solid rgba(245,246,242,.5);
  border-radius:50%;
  margin-left:3px;
  align-self:center;
}
html.d-washi .dial-yen{font-size:20px;}  /* v168→v169: 24→22→20（既定テーマの¥と同率で縮める） */
html.d-washi .dial-sw{min-height:27px;}
html.d-washi .dial-sw-seg{
  min-width:44px;
  min-height:21px;
  padding:2px 6px;
  font-size:12px;
  position:relative;
}
/* タップ判定は従来サイズ維持（spec実装注意）: 透明の当たり拡大で高さ31px級を確保。
   横は-2px止まり=隣セグとの重なりを作らない（誤爆防止） */
html.d-washi .dial-sw-seg::after{content:'';position:absolute;inset:-5px -2px;border-radius:999px;}
html.d-washi .dial-sw-seg.on{color:#20241e;}
html.d-washi .dial-sw-thumb{background:#f5f6f2;}  /* v191: 点灯背景はつまみが担ぐ（テーマ別の白） */
html.d-washi .dial-sw-start{background:#f5f6f2;color:#20241e;padding:2px 16px;}
html.d-washi .dial-sw-viewer{font-size:12px;}
/* v163: 実働/休憩中時間の数字拡大 13.5→16px（えーくん8/28「もっと大きく」・R2脇絞りの部分改定） */
html.d-washi .dial-time{font-size:16px;height:22px;margin-top:6px;}
html.d-washi .dial-time.dial-time-note{font-size:12.5px;}
/* R2.1: ジオメトリ2組の出し分け（c1=旧118/146・c2=washi近接版103/128・方位=リング際）。
   衛星の軌道半径はapp.js dialOrbitR()がテーマ分岐=SVG座標・DIAL_TXT_Cと一致必須 */
.dial-c2{display:none;}
html.d-washi .dial-c2{display:inline;}
html.d-washi .dial-c1{display:none;}
html.d-washi .dial-ring circle.dial-orbit{stroke:var(--border);opacity:1;}
/* コンパス許可前は方位文字を出さない（v112原則を新旧ジオメトリ両方に・特異性で表示ルールに勝たせる） */
html.compass-off .dial-compass text{display:none;}

@media (prefers-reduced-motion: reduce){
  .dial-dot.dial-dot-spin,.dial-dot.dial-dot-breathe,.dial-dot.dial-dot-landing,
  .dial-dot.dial-dot-spinup,.dial-dot.dial-dot-slowdown{animation:none;}
  .dial-dot-shell .dot-body,.dial-dot-shell .dot-core{animation:none;}  /* v167: バチバチも止める */
  .dial-trail{display:none;}
}
/* 指標3連（件数/時給/平均単価・数字=Caslonの計器文法） */
.dial-stats{margin:2px 16px 10px;}
.dstat{flex:1;text-align:center;}
.dstat + .dstat{border-left:1px solid var(--border);}
.dstat-l{font-size:12px;color:var(--muted);}
.dstat-n{
  font-size:22px;
  font-weight:700;
  line-height:1.15;
  letter-spacing:0;
  font-family:'Libre Caslon Text','Hiragino Mincho ProN',serif;
}
/* v160: 指標3連の拡大+ダイヤル近接（washiのみ・えーくん8/28「読みづらいので大きく・もっと近づけて」
   =ひと画面完結の仕上げ）。詰め代の根拠: .dial-zone下16px(v115)=衛星クリアランスはc1軌道r146の話。
   washiはR2.1で軌道r128(ダイヤル内側)+box-shadow退役=下にはみ出す物が無い。sumi/classicは不触 */
html.d-washi .dial-zone{margin-bottom:4px;}
html.d-washi .dial-stats{margin:0 16px 8px;}
html.d-washi .dstat-l{font-size:14px;}  /* 12px→老眼下限14px */
html.d-washi .dstat-n{font-size:26px;}
/* v161: 上の詰め（washiのみ・えーくんGO 8/28「ダイヤル上は限界？」→計約20px上へ）。
   ダイヤル上4px=v160と同じ理屈（washi軌道r128=上もクリアランス不要）。
   🧭(iOS)のタップ域44pxは薄いヘッダーからはみ出すが透明・実害なし=実機確認項目。sumiは8px/12pxのまま不触 */
html.d-washi .site-header{padding:4px 16px;}
/* v235: 銘板（えーくん9/24・お手本 new_sample.jpg の Kuragallu）。旧 .logo{line-height:1.15}（v161）は退役=2段でも高さは同じ22px
   （12+2+8）=ヘッダーの高さ不変。文字は「かなり小さく」がえーくんの指定（銘板は情報でなく飾り=老眼下限14pxの対象外）。
   色は墨のまま（副情報を淡色で弱めない・9/18）。中央=space-betweenの単独子にmargin auto（history.htmlの2子ヘッダーを巻き込まない） */
.logo-plate{display:flex;flex-direction:column;align-items:center;gap:2px;margin:0 auto;font-weight:400;letter-spacing:0;line-height:1;}
.logo-plate .logo-nm{font-size:12px;letter-spacing:.24em;margin-right:-.24em;color:var(--text);}
.logo-plate .logo-en{font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;font-size:8px;letter-spacing:.22em;margin-right:-.22em;color:var(--text);}
/* 歯車=右端の絶対配置（コンパスと同じ寸法・当たり判定44px）。header-btnsが生きる既定テーマでは重なるので出さない */
#set-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);min-width:44px;min-height:44px;background:transparent;border:none;font-size:22px;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent;color:var(--text);display:none;}
html.d-washi #set-btn,html.d-sumi #set-btn{display:block;}
/* 指標3連の¥=他の金額と同じ文法（小さく・数字26pxに対し14px=.55倍・おつりの.cash-yenと同率）。えーくん実機9/24「¥が小さくなっていない」 */
html.d-washi .dstat-n .yen-mark,html.d-sumi .dstat-n .yen-mark{font-size:14px;margin-right:.09em;}
/* v164: さらに10px上へ（えーくん8/28）。washiの箱上端〜最初のインク=軌道線r124まで16px透明
   →マイナスmarginで頭上に食い込ませる。下限=-6px（北通過時の衛星の玉上端=箱から9px・ヘッダーと3px確保） */
html.d-washi .dial-zone{margin-top:-6px;}
/* 4社カード: ダイヤル表示中だけ帳簿行→カードに変身（社名=会社色・classic/ダイヤル非表示=従来の帳簿行）
   ※セレクタはhtml.d-washi付き必須（帳簿行のgrid-template-columns:1frに特異性で勝つため）
   v115: 4列固定（auto-fitは実機375pxで数px足りず3列+下段1社に落ちた・えーくん8/19。モックv12=4列が正）
   v116: minmax(0,1fr)+min-width:0（素の1frはmin-content下限あり=「ロケットナウ」14pxがカード幅を
   突き破り4社目が画面外へ・えーくん実機8/19）。字の寸法もモックv12の実寸に統一（nm11.5/amt15/cnt11） */
html.d-washi .dial-on .svc-grid,html.d-sumi .dial-on .svc-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
}
/* カード短名の切替（帳簿行=長名・カード=短名「ロケット」。スパン2本はrenderServicesが常時出す） */
.svc-nm-s{display:none;}
html.d-washi .dial-on .svc-nm-l,html.d-sumi .dial-on .svc-nm-l{display:none;}
html.d-washi .dial-on .svc-nm-s,html.d-sumi .dial-on .svc-nm-s{display:inline;}
html.d-washi .dial-on .svc-big,html.d-sumi .dial-on .svc-big{
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  min-width:0;
  padding:8px 7px 6px;
  background:var(--surface);
  /* v173: 外枠撤去（v172の取り残し=えーくんの言う「各社カード」はここだった）。
     !important維持=基礎svc-bigの帳簿罫線border-bottom!importantをdial-onでは消す役 */
  border:none!important;
  border-radius:14px;
}
html.d-washi .dial-on .svc-big-name,html.d-sumi .dial-on .svc-big-name{
  order:1;
  flex:none;
  width:100%;
  white-space:nowrap;
  overflow:hidden;
  color:var(--svc-color,var(--text));
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.02em;
  /* css v225（えーくんAndroid実機9/22）: 漢字の社名（出前館）はNoto Sans CJKの字面で行が育ち、金額・件数が3〜4px落ちて隣のUberEatsと
     段違い（iPhoneのヒラギノは字面が小さく出ない・PCでも同種を実測=design_ref/svc_card_check.py）。行の高さを固定=PCの実測17pxと同値・文字種に依らず同じ位置 */
  height:17px;
  line-height:17px;
}
html.d-washi .dial-on .svc-big-amt,html.d-sumi .dial-on .svc-big-amt{
  order:2;
  flex:none;
  text-align:left;
  font-size:20px;
  font-weight:400;
  color:var(--text);
  letter-spacing:-.01em;
  white-space:nowrap;
}
/* v230: 稼働中カードの金額=読む数字500（上の400より後=後勝ち・変数の正は2750行付近の3段ブロック） */
html.d-washi .dial-on .svc-big-amt,html.d-sumi .dial-on .svc-big-amt{font-weight:var(--num-w-read);}
html.d-washi .dial-on .svc-big-cnt,html.d-sumi .dial-on .svc-big-cnt{
  order:3;
  flex:none;
  text-align:left;
  font-size:16px;
  font-weight:500;
  color:var(--text);
}
/* css v211: dial-onカードの¥/件はmuted解除（縦詰めラウンド1・えーくんGO 9/18）。
   washiの旧muted指定（3112/3113行付近）は帳簿行用に残すためdial-on側で個別に上書き */
html.d-washi .dial-on .svc-big-amt .yen-mark,html.d-sumi .dial-on .svc-big-amt .yen-mark{font-size:13px;color:var(--text);}
html.d-washi .dial-on .svc-big-cnt .unit-mark,html.d-sumi .dial-on .svc-big-cnt .unit-mark{font-size:14px;color:var(--text);}
/* 10万円以上は枠ちょうどになるため縮小（1,000,000以上は考えない・renderServicesが判定） */
html.d-washi .dial-on .svc-big-amt.amt-long,html.d-sumi .dial-on .svc-big-amt.amt-long{font-size:17px;letter-spacing:-.02em;}
html.d-washi .dial-on .svc-big::after,html.d-sumi .dial-on .svc-big::after{content:none;}

/* ═══ v157 R3: 帳簿/チップ/タブの新装（washiのみ・えーくんGO 8/28・確定見本=tone_mock_v8）═══
   会社色=「ちょい色の糸」: JSが--svc-soft（低彩度版SERVICE_COLORS_SOFT）を併記→washiだけsoftを参照。
   sumi/classic=鮮色--svc-colorのまま不触 */
html.d-washi .svc-big{border-left-color:var(--svc-soft,var(--border))!important;}
html.d-washi .dial-on .svc-big-name{color:var(--svc-soft,var(--text));}
html.d-washi .shelf-on{border-color:var(--svc-soft);border-left-color:var(--svc-soft);}
html.d-washi .shelf-on .shelf-nm,html.d-washi .shelf-on .shelf-st{color:var(--svc-soft);}
/* 帳簿行の顔（見本v8: 社名=太字が幹・¥と件=小さく薄く=金額数字が主役の計器主従） */
html.d-washi .svc-big-name{font-weight:700;}
html.d-washi .svc-big-amt .yen-mark{font-size:12px;color:var(--muted);}
html.d-washi .svc-big-cnt .unit-mark{font-size:11px;color:var(--muted);}
/* 待機チップ=押せる面（「押せる場所が白く浮く」文法。旧transparentは地に沈む）・＋は透明の脇役 */
html.d-washi .svc-chip{background:var(--surface2);}
html.d-washi .svc-chip-plus{background:transparent;}
/* タブバー=押せる面。文字は全タブvar(--text)のまま（v71: mutedは太陽下で消える→見本のink-soft非活性は不採用） */
html.d-washi #tabbar{background:var(--surface2);}

/* ═══ v158 R4/R5: カレンダー色の調和＋オーバーレイの抹茶残骸掃除（washiのみ・えーくんGO 8/28）═══
   カレンダーは構造・数字フォント不触（weight700=実機GOOD評価8/28）・sun弁柄/sat藍鼠=低彩度で
   新世界と調和済みのため不触。シート類の地=R1の変数替えで波及済み・ボトムシート系の暗スクリム=
   v41仕様（シート自体が明るく浮く）どおり維持 */
html.d-washi .cal-hi{color:#b85433;}       /* 気温=確定トーンの暖（旧#d2491e鮮橙・見本v8のhot） */
html.d-washi .cal-lo{color:#4d7fa8;}       /* 気温=確定トーンの寒（旧#4a86d8鮮青・見本v8のcold） */
html.d-washi .cal-amt.ace{color:#a8402c;}  /* ace=赤鉄に統一（朱2種混在の解消・新色は足さない） */
html.d-washi .cal-amt{color:#c9187e;}      /* v180: 売上=Y3Kマゼンタ（見本mock_calweek_v4のE・えーくんGO 8/31・金茶v177は1日で交代） */
html.d-washi .tpl-token{background:rgba(34,38,31,.08);}  /* 抹茶の薄地→墨の薄掛け（sumi=抹茶のまま） */

/* ═══ v117: 終了のYES/NO確認（「確認ダイアログを出さない主義」の唯一の例外・えーくん8/19）═══
   スクロールしないオーバーレイ=lock-bg+touch-action:none（オーバーレイ作法） */
#endc-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:2000;
  align-items:center;
  justify-content:center;
  touch-action:none;
}
#endc-box{
  background:var(--surface);
  border-radius:16px;
  padding:22px 20px 18px;
  width:min(320px,86vw);
  box-shadow:0 12px 40px rgba(0,0,0,.35);
}
.endc-msg{font-size:16px;font-weight:700;text-align:center;margin-bottom:16px;}
.endc-btns{display:flex;gap:10px;}
.endc-btns button{
  flex:1;
  min-height:56px;
  border-radius:12px;
  font-size:17px;
  font-weight:800;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  font-family:inherit;
}
.endc-yes{background:var(--red);color:#fff;border:none;}
.endc-no{background:transparent;border:1.5px solid var(--border);color:var(--text);}

/* v237: 同期ゲート（入力モードの帯） */
#io-overlay.io-locked .io-pad,
#io-overlay.io-locked .io-add,
#io-overlay.io-locked .io-ok { pointer-events: none; opacity: .35; }
#io-gate { margin: 0 0 10px; }
#io-gate .io-gate-wait { font-size: 16px; font-weight: 700; color: var(--muted); text-align: center; padding: 8px 0; }
#io-gate .io-gate-ask { display: none; }
#io-gate.io-gate-asking .io-gate-wait { display: none; }
#io-gate.io-gate-asking .io-gate-ask { display: block; }
.io-gate-msg { font-size: 16px; line-height: 1.5; font-weight: 700; text-align: center; margin-bottom: 12px; }
.io-gate-btns { display: flex; gap: 10px; }
.io-gate-btns button { flex: 1; min-height: 60px; border-radius: 12px; font-size: 17px; font-weight: 800; cursor: pointer; -webkit-tap-highlight-color: transparent; font-family: inherit; }
.io-gate-go { background: var(--red); color: #fff; border: none; }
.io-gate-stay { background: transparent; border: 1.5px solid var(--border); color: var(--text); }
/* v237: 同期ゲート（タイマー操作の帯・endcと同じ作り） */
#gate-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 2000; align-items: center; justify-content: center; touch-action: none; }
#gate-box { background: var(--surface); border-radius: 16px; padding: 22px 20px 18px; width: min(320px, 86vw); box-shadow: 0 12px 40px rgba(0,0,0,.35); }
#gate-overlay .gate-wait { font-size: 16px; font-weight: 700; color: var(--muted); text-align: center; }
#gate-overlay .gate-ask { display: none; }
#gate-overlay.gate-asking .gate-wait { display: none; }
#gate-overlay.gate-asking .gate-ask { display: block; }
.gate-msg { font-size: 16px; line-height: 1.5; font-weight: 700; text-align: center; margin-bottom: 16px; }
.gate-btns { display: flex; gap: 10px; }
.gate-btns button { flex: 1; min-height: 56px; border-radius: 12px; font-size: 17px; font-weight: 800; cursor: pointer; -webkit-tap-highlight-color: transparent; font-family: inherit; }
.gate-go { background: var(--red); color: #fff; border: none; }
.gate-stay { background: transparent; border: 1.5px solid var(--border); color: var(--text); }

/* ═══ v122: 開始時刻の修正（開始時刻宣言モデル・8/21）═══
   シート内の行=点線枠（「直せる場所」の記号・memo-pinと同族）。ピッカー=OSネイティブtime入力 */
.tz-start-row{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  min-height:44px;
  margin:2px 0 8px;
  padding:6px 12px;
  background:transparent;
  border:1px dashed var(--border);
  border-radius:10px;
  font-size:.95rem;
  color:var(--muted);
  cursor:pointer;
  font-family:inherit;
  -webkit-tap-highlight-color:transparent;
}
.tz-start-row span{color:var(--text);font-weight:700;font-variant-numeric:tabular-nums;}
.tz-start-row .tz-start-chev{margin-left:auto;color:var(--muted);font-weight:400;font-size:.85rem;}
/* v138: エリア上限40字対応（複数市の連記）。長いエリアは行内で素直に折り返す=切り詰めない */
#tz-ed-area{flex:1;min-width:0;text-align:left;white-space:normal;word-break:break-word;line-height:1.35;}
/* v139: 👁地域名の伏せトグル（専用の的=雑タッチで誤爆しない・薄く=脇役） */
.wx-eye{flex:none;margin-left:0;padding:4px 3px;font-size:.8rem;opacity:.45;cursor:pointer;}
/* v137: エリアの家の編集行（行タップで入れ替わるインライン入力・実線枠=編集中の合図） */
.tz-area-editw{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  min-height:44px;
  margin:2px 0 8px;
  padding:6px 12px;
  border:1px solid var(--muted);
  border-radius:10px;
}
.tz-area-editw .tz-area-lbl{color:var(--muted);font-size:.95rem;white-space:nowrap;}
#tz-area-input{
  flex:1;
  min-width:0;
  border:none;
  background:transparent;
  color:var(--text);
  font-size:1rem;
  font-weight:700;
  font-family:inherit;
  outline:none;
  padding:4px 0;
}
#stedit-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:2000;
  align-items:center;
  justify-content:center;
  touch-action:none;
}
#stedit-box{background:var(--surface);border-radius:16px;padding:20px;width:min(320px,86vw);}
/* v229: 距離の修正専用シート（kmedit）=steditと同じ箱。数字の欄とカメラだけ（えーくんGO 9/11） */
#kmedit-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:2000;align-items:center;justify-content:center;touch-action:none;}
#kmedit-box{background:var(--surface);border-radius:16px;padding:20px;width:min(320px,86vw);}
.kmedit-field{display:flex;align-items:baseline;justify-content:center;gap:8px;margin:4px 0 12px;}
.kmedit-field input{width:100%;max-width:200px;font-size:34px;font-weight:700;text-align:center;border:none;border-bottom:2px dashed var(--border);background:transparent;color:var(--text);font-family:inherit;font-variant-numeric:tabular-nums;padding:4px 0;outline:none;}
.kmedit-field input:focus{border-bottom-color:var(--text);}
.kmedit-unit{font-size:16px;color:var(--muted);}
/* v230: 大きなアイコン2つ（カメラ／鉛筆）・読み込み中は数字の欄が点滅（メーター画面の読み中と同じ合図） */
.kmedit-icons{display:flex;gap:12px;justify-content:center;margin-bottom:10px;}
.kmedit-ico{width:84px;height:72px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--border);border-radius:14px;background:transparent;color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent;}
.kmedit-ico .pi{width:44px;height:44px;}  /* v231: 枠でなくアイコン本体を大きく（えーくん実機9/11「枠ばかり大きくても駄目」） */
.odo-icons{margin:2px 0 14px;}
/* v232: メーター画面の行は折り返さない（実機9/11: 「前回の交換」の末尾1字と「›」だけが次の行に落ちた）。日付は小さく括弧なし */
#odo-body .tz-start-row{white-space:nowrap;}
#odo-body .tz-start-row .tz-start-chev{flex-shrink:0;}
.odo-when{font-size:.8rem;color:var(--muted);font-weight:400;margin-left:5px;}  /* v231: メーター画面=大きい数字の下に同じ2つ（メーターなおす行・撮り直す行は退役=重複） */
.kmedit-ico:active{opacity:.7;}
.kmedit-field.reading input{opacity:.4;animation:odoBlink 1s ease-in-out infinite;}
.kmedit-field.reading + .kmedit-icons .kmedit-ico{opacity:.35;pointer-events:none;}
.kmedit-note{min-height:1.3em;margin-bottom:10px;font-size:.875rem;color:var(--muted);text-align:center;line-height:1.4;}
.kmedit-note.err{color:var(--red);}
.stedit-title{font-size:15px;font-weight:700;margin-bottom:12px;}
/* v126: 自作ドラムピッカー（v123点線枠+✏の後継。OS標準type=time退役=Android時計文字盤が不評・
   えーくん実機8/23。確定見本=timepicker_mock_v1。点線=直せる場所の記号は中央の選択帯が継承） */
.stedit-drums{
  position:relative;
  display:flex;
  justify-content:center;
  gap:6px;
  margin-bottom:10px;
}
.stedit-band{
  position:absolute;
  left:22px;
  right:22px;
  top:calc(50% - 19px);
  height:38px;
  border-top:1.5px dashed var(--green);
  border-bottom:1.5px dashed var(--green);
  border-radius:6px;
  opacity:.85;
  pointer-events:none;
}
.stedit-drum{
  height:190px;               /* 38px×可視5行 */
  width:84px;
  overflow-y:auto;
  scroll-snap-type:y mandatory;
  touch-action:pan-y;          /* overlayのnoneの中でドラムだけ縦パン許可 */
  overscroll-behavior:contain; /* 慣性をページに漏らさない */
  scrollbar-width:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 28%,#000 72%,transparent 100%);
          mask-image:linear-gradient(to bottom,transparent 0,#000 28%,#000 72%,transparent 100%);
}
.stedit-drum::-webkit-scrollbar{display:none;}
.stedit-pad{height:76px;}      /* (190-38)/2=中央帯に1行目/最終行が届く下駄 */
.stedit-item{
  height:38px;
  scroll-snap-align:center;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  font-variant-numeric:tabular-nums;
  color:var(--muted);
  opacity:.45;
  transform:scale(.86);
  transition:opacity .12s,transform .12s,color .12s;
}
@media (prefers-reduced-motion: reduce){
  .stedit-item{transition:none;}
}
.stedit-item.on{color:var(--text);opacity:1;transform:scale(1);font-weight:700;}
.stedit-item.near{opacity:.7;transform:scale(.93);}
.stedit-colon{display:flex;align-items:center;font-size:24px;font-weight:700;color:var(--muted);}
.stedit-unit{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  font-size:11px;
  color:var(--muted);
  pointer-events:none;
}
/* ラベルはドラムの外側（見本v1.1: ドラム上に置くと数字と重なる・えーくん実機8/23） */
.stedit-unit-h{left:calc(50% - 126px);}
.stedit-unit-m{right:calc(50% - 126px);}
.stedit-quick{display:flex;gap:8px;margin-bottom:14px;}
.stedit-quick button{
  flex:1;
  min-height:44px;
  border:1px solid var(--border);
  border-radius:999px;
  background:transparent;
  color:var(--text);
  font-size:.9rem;
  font-weight:700;
  cursor:pointer;
  font-family:inherit;
  -webkit-tap-highlight-color:transparent;
}
/* v125: 相方の予告行（会計モデル・確定前に結果が見える=確認ダイアログを出さずに分かる設計） */
/* v183: 休憩ピッカーの1袋会計注記（休憩を開いた時だけJSが出す・14px=老眼下限） */
.duredit-note{
  font-size:14px;
  color:var(--muted);
  text-align:center;
  line-height:1.5;
  margin:-2px 0 12px;
}
.stedit-mate{
  min-height:21px;
  font-size:14px;
  color:var(--muted);
  text-align:center;
  margin-bottom:12px;
  font-variant-numeric:tabular-nums;
}
.stedit-btns{display:flex;gap:10px;}
.stedit-btns button{
  flex:1;
  min-height:52px;
  border-radius:12px;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
  font-family:inherit;
  -webkit-tap-highlight-color:transparent;
}
.stedit-ok{background:var(--green);color:#fff;border:none;}
.stedit-cancel{background:transparent;border:1.5px solid var(--border);color:var(--text);}

/* ═══ v124: 長さピッカー（R9b-1・実働/休憩の「なおす」。時=ステッパー・分=15分チップ）═══ */
#duredit-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:2000;
  align-items:center;
  justify-content:center;
  touch-action:none;
}
#duredit-box{background:var(--surface);border-radius:16px;padding:20px;width:min(320px,86vw);}
.duredit-val{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
#duredit-disp{
  flex:1;
  text-align:center;
  font-size:23px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  border:1.5px dashed var(--border);
  border-radius:12px;
  padding:10px 4px;
}
.dur-step{
  width:52px;
  min-height:52px;
  border:1px solid var(--border);
  border-radius:12px;
  background:transparent;
  color:var(--text);
  font-size:24px;
  font-weight:700;
  cursor:pointer;
  font-family:inherit;
  -webkit-tap-highlight-color:transparent;
}

/* ═══ R2: 会社棚（v176・えーくんGO 8/25）＝待機チップ列端の「＋」→マスター7社のON/OFFシート ═══
   オーバーレイ作法: lock-bg+touch-action:none（スクロールなし）。ON=会社色・OFF=墨。
   retired社（shelf-dead）=「サービス終了」表示で新規ON不可 */
.svc-chip-plus{
  flex:0 0 auto;      /* 他チップのflex:1に混ざって太らない=脇役 */
  min-width:0;
  width:40px;
  height:40px;
  padding:0;
  align-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:400;
  font-size:1.05rem;
  opacity:.6;
  /* v174: ⊕の丸囲み（えーくん8/29「枠が消えてただの＋がポツン」）。
     押せる面の外枠でなく「追加」記号⊕の一部=v172の枠なし文法とは別物 */
  border:1.5px solid var(--border);
  border-radius:50%;
  position:relative;
}
.svc-chip-plus::after{content:'';position:absolute;inset:-8px;border-radius:50%;}  /* タップ域=56px相当を維持 */
#shelf-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  z-index:400;
  display:none;
  align-items:flex-end;
  touch-action:none;
}
#shelf-sheet{
  background:var(--surface);
  border-radius:20px 20px 0 0;
  padding:20px 20px calc(28px + env(safe-area-inset-bottom,0px));
  width:100%;
  transform:translateY(100%);
  transition:transform .25s ease;
  /* v250: 8社+設定行で背が伸びた→小さい画面では中でスクロール（親overlayはtouch-action:noneなのでシートだけ縦を許す） */
  max-height:calc(100dvh - 48px);
  overflow-y:auto;
  touch-action:pan-y;
}
.shelf-head{margin-bottom:12px;}
.shelf-head .cloud-title{margin:0;}
#shelf-sheet.cal-open{transform:translateY(0);}
/* v235: 全体設定シート（歯車の行き先）=棚と同じ器。中身は少ないので中スクロール不要 */
#set-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:400;display:none;align-items:flex-end;touch-action:none;}
#set-sheet{background:var(--surface);border-radius:20px 20px 0 0;padding:20px 20px calc(28px + env(safe-area-inset-bottom,0px));width:100%;transform:translateY(100%);transition:transform .25s ease;}
#set-sheet.cal-open{transform:translateY(0);}
#set-body .shelf-mode{margin-top:0;}
.shelf-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:56px;
  padding:12px 14px;
  margin-bottom:8px;
  background:var(--surface);
  border:1px solid var(--border);
  border-left:3px solid var(--border);
  border-radius:12px;
  cursor:pointer;
  font-family:inherit;
  -webkit-tap-highlight-color:transparent;
}
.shelf-row:active{opacity:.75;}
.shelf-nm{font-size:1rem;font-weight:700;color:var(--muted);}
.shelf-st{font-size:.8rem;color:var(--muted);}
.shelf-on{border-color:var(--svc-color);border-left:3px solid var(--svc-color);}
.shelf-on .shelf-nm,.shelf-on .shelf-st{color:var(--svc-color);}
.shelf-dead{opacity:.45;cursor:default;}
/* v245: 入力のしかたの切替行=会社の列と一呼吸あける。v248（えーくんGO 9/22）: 設定の行=会社の列と見た目を分ける
   （色の帯なし・破線の枠・歯車・右に2択の切替つまみ=選ばれている方が墨で塗り潰し・両方の名前を常に見せる） */
.shelf-mode{margin-top:14px;background:transparent;border:1px dashed var(--border);border-left:1px dashed var(--border);}
.shelf-mode .shelf-nm{display:flex;align-items:center;gap:8px;color:var(--muted);}
.shelf-seg{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--border);border-radius:999px;}
.shelf-seg-i{font-size:.85rem;font-weight:700;color:var(--muted);padding:6px 12px;border-radius:999px;}
.shelf-seg-i.on{background:var(--text);color:var(--bg);}
.shelf-note{font-size:.8rem;color:var(--muted);margin-top:4px;line-height:1.6;}

/* ═══ v178: Phosphorアイコン基盤（絵文字→SVG総新装・えーくんGO 8/26） ═══
   スプライト=index.htmlの<symbol>群（Phosphor regular・MITライセンス）。1em角=置いた場所の
   文字サイズに従う・fill:currentColor=文字色に従う（テーマ・状態色も自動追従）。
   境界: アイコンスロット（行頭・見出し・タブ）=SVG／文章・トースト・X投稿文の中=絵文字続投 */
/* v179: 1em→1.2em（絵文字グリフは元々エム箱より大きく描かれる=等寸感の回復）
   v180: 1.2em→1.35em（えーくん実機8/26「配達員は本当に老眼だからもう一段階大きめに」） */
.pi{width:1.35em;height:1.35em;fill:currentColor;display:inline-block;vertical-align:-0.3em;}
/* v180: カレンダー内の天気だけ現サイズ維持（えーくん指定・セルが窮屈になるため） */
/* v175: 1.2em→1em（実寸22.8px→19px）。1.2emは絵文字時代の掛け算の残り=「アイコンもう少し小さく」8/31 */
.cal-wx .pi{width:1em;height:1em;vertical-align:-0.2em;}
/* v181: ☁の状態表現=**雲の形**に一本化（sync.jsのsetCloudStateがuse hrefを差し替え）。
   退役: 緑の点灯（和帳簿のオリーブ緑は判別不能・実機8/26「色全然わからない」）／緑地の四角バッジ
   （v179の急ごしらえ・和帳簿の世界観に対して異物・えーくん8/26「センスがない」）。
   **色に頼る状態表現をここへ戻さない**（テーマ次第で消える・色覚にも依存する）

   v182: 同期中=**一回り大きくなって脈打つ**（えーくんGO 8/26）。旧opacity点滅から転換した理由=
   薄くなる演出は老眼原則と逆＋「消えかけ」に見える。**動きはtransformだけ**（GPU合成・レイアウトを
   動かさない=ラベルの位置が揺れない）。基準を1.08倍に置いて1.25倍まで膨らむ→戻る→**半周期は休む**
   （衛星ラウンドの教訓「演出は速度の連続だけでなく間（リズム）も審査」＝ぽふっ…ぽふっ…と息をする） */
.cloud-btn.cloud-sync .pi,.tabbar-cloud.cloud-sync .pi{
  animation:cloudSyncPuff 1.2s ease-in-out infinite;
  transform-origin:center center;
}
@keyframes cloudSyncPuff{
  0%   {transform:translateY(0) scale(1.08);}
  25%  {transform:translateY(-2px) scale(1.25);}
  50%  {transform:translateY(0) scale(1.08);}
  100% {transform:translateY(0) scale(1.08);}
}
/* 動きを止める設定の端末: アニメは切るが「一回り大きい」は残す=状態は静止画でも伝わる */
@media (prefers-reduced-motion: reduce){
  .cloud-btn.cloud-sync .pi,.tabbar-cloud.cloud-sync .pi{
    animation:none;
    transform:scale(1.08);
  }
}

/* ===== v181: クラウドシート「クラウドから記録を読み直す」ボタン（sync v23・2026-09-08） =====
   旧: 「最終同期」行のタップが隠しレバー（専門的で見つからない）→ 誰でも分かる文言の普通のボタンに */
.cloud-repull {
  display: block;
  width: 100%;
  min-height: 52px;
  background: none;
  border: 2px solid var(--muted);
  border-radius: 12px;
  color: var(--text);
  font-size: 1rem;
  font-weight: 700;
  padding: 12px 14px;
  margin: 4px 0 6px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cloud-repull:disabled { opacity: .6; }
.cloud-repull .pi { width: 1.2em; height: 1.2em; vertical-align: -0.25em; }
.cloud-last { cursor: default; padding: 0; }

/* ===== v182: PWA案内シートに「デリガジェについて →」（LPへの入口・移転バッチ② 2026-09-08） ===== */
.pwa-about {
  display: inline-block;
  font-size: .9rem;
  color: var(--muted);
  text-decoration: underline;
  margin: -16px 0 24px;
  padding: 8px 4px;
}

/* ===== css v183: 天気枠の置き場（えーくんGO 2026-09-09）=====
   箱 .wx-box が天気枠+レーダーを包む。表示条件は .wx と同じ（和帳簿/墨だけ）=classicで空箱のつまみが出ない。
   つまみ .wx-grip=左端の縦帯（当たり36px幅=JSのWX_GRIP_W・箱いっぱいの高さ）。見た目は2列×5点の「ザラザラ」(::before)。
   touch-action:none=つまみから始めた縦の指はスクロールに取られない（つまみだけ・箱や天気枠には付けない）。
   .wx-drag=ドラッグ中（重なり順だけ上げる・影や色は付けない=雑味を足さない） */
.wx-box { display: none; position: relative; }
/* css v214（えーくんGO 9/19）: 箱ごと右へ8px=面の左右端を各社カード・チップと揃える（左右16px）。副産物で粒々が画面端12→28px
   =Androidの左端ジェスチャー帯（約20px）の外へ（掴んだつもりがシステムに取られていた・9/18実機）。縦は0（縦リズム=v213のgap） */
.wx-box { margin: 0 16px; }
.wx-box {
  /* css v212: 天気の面=つまみの粒々ごと囲む（えーくん9/18）。見た目の調整はこの2変数だけ（背景なし=none・枠だけ=1px solid var(--border) 等）。
     既定=各社チップ（待機チップ）と同じ面の色 --surface2。幾何（つまみ帯36px・.wx の margin/width）は不変=面は疑似要素で敷くだけ */
  --wx-card-bg: var(--surface2);
  --wx-card-border: none;
}
.wx-box::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0;  /* v214: 箱いっぱい（箱自身が左右16pxを持つ） */
  background: var(--wx-card-bg); border: var(--wx-card-border); border-radius: 14px; box-sizing: border-box; pointer-events: none;
}
.wx-box .wx, .wx-box .wx-grip { z-index: 1; }
.wx-box .wx { position: relative; }
html.d-washi .wx-box, html.d-sumi .wx-box { display: block; }
/* css v184: つまみ帯36pxの外へ（Androidタッチ補正の吸い寄せ対策の4手の1つ）→ v214: 28px=帯に8px重ねて粒々→中身の空きを23→11pxに詰める
   （えーくんGO 9/19）。掴みの本命はv212の「帯に落ちた指は相手がどの要素でも箱が受ける」なので重ねても効く=Android実機で要確認。
   右は0（箱が左右16pxを持つ）=右端は従来どおり画面から16px */
.wx-box .wx { margin-left: 20px; margin-right: 0; width: calc(100% - 20px); }  /* v215: 28→24（粒々→中身の空き11→7px）→v216: 20（粒々と一緒に4px左・帯36に16px重ね） */
.wx-grip {
  position: absolute; left: 0; top: 0; bottom: 0; width: 36px;  /* css v184: 帯=JSのWX_GRIP_Wと同値 */
  touch-action: none; cursor: grab; -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none;
}
.wx-grip::before {
  content: ''; position: absolute; left: 8px; top: 50%; width: 11px; height: 29px; transform: translateY(-50%);  /* v216: 12→8（画面端28→24px・えーくん9/19「もう少し左」・Android端ジェスチャー帯≈20〜24pxの際=段階踏み） */
  color: var(--muted); opacity: .3;  /* v215: .5→.3（粒々の存在感がデカい・えーくん9/19実機。位置=画面端28pxは不変・ドラッグ中は.9） */
  background: radial-gradient(circle, currentColor 1.2px, transparent 1.5px) 0 0 / 6px 6px;
}
.wx-box.wx-drag { z-index: 6; }
.wx-box.wx-drag .wx-grip { cursor: grabbing; }
.wx-box.wx-drag .wx-grip::before { opacity: .9; }

/* ===== css v187（v216・えーくんGO 9/9）: チップが編集窓へ飛ぶ（tplChipFly）。#tpl-overlay 直下の absolute・
   左上基準（着地=トークンの左上・scaleで縮む）・transformとopacityだけ・触れない・連打は連なる ===== */
.tpl-chip-fly {
  position: absolute;
  z-index: 5;
  margin: 0;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;     /* css v190: 長いチップ（ウーバー売上等）が複製で2段に折れた（.tpl-strip外はnowrapが効いていなかった） */
  font-size: .85rem;
  line-height: 1.3;
  pointer-events: none;
  transform-origin: left top;
  transform: translate(0, 0);
  /* css v191: 縮小はscaleでなく箱の寸法（width/height/padding）を編集窓のチップに合わせて変える=文字は同じ13.6pxのまま
     （scaleは文字まで半分に縮み「小さすぎ」・えーくん9/9）。着地の形が見えるようフェードは終盤だけ */
  transition: transform .32s cubic-bezier(.3, .1, .3, 1), width .32s cubic-bezier(.3, .1, .3, 1), height .32s cubic-bezier(.3, .1, .3, 1),
    padding .32s cubic-bezier(.3, .1, .3, 1), opacity .1s ease-in .3s;
  will-change: transform, opacity;
}

/* ── v217: オイル交換管理（メーター画面・ヘッダーのランプ・えーくんGO 9/9・仕様=CLAUDE_spec「オイル交換管理」節）── */
#odo-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  z-index:400;
  display:none;
  align-items:flex-end;
  touch-action:none;
}
#odo-sheet{
  background:var(--surface);
  border-radius:20px 20px 0 0;
  padding:20px 20px calc(28px + env(safe-area-inset-bottom,0px));
  width:100%;
  transform:translateY(100%);
  transition:transform .25s ease;
}
#odo-sheet.cal-open{transform:translateY(0);}
/* v226: 稼働の行「今日の稼働 +38 km」（終了km or 最新値 − 開始km）。見出しの日付表示は退役 */
/* v233: .odo-run（今日の稼働 +N km）は退役=記録の家の走行行と二重（えーくんGO 9/11） */
/* 大きい数字=この画面の主役（Y3K蛍光1点の置き場・下の和紙側で色を差す） */
.odo-big{display:flex;align-items:baseline;justify-content:center;gap:2px;margin:6px 0 4px;font-variant-numeric:tabular-nums;line-height:1;}
.odo-num{font-size:52px;font-weight:700;letter-spacing:.01em;color:var(--text);}
.odo-dec{font-size:26px;font-weight:700;color:var(--text);opacity:.7;}
.odo-unit{font-size:16px;color:var(--muted);margin-left:6px;}
.odo-reading .odo-num{opacity:.4;animation:odoBlink 1s ease-in-out infinite;}
@keyframes odoBlink{50%{opacity:.15;}}
.odo-sub{text-align:center;font-size:.95rem;color:var(--muted);margin-bottom:14px;line-height:1.5;}
.odo-sub b{color:var(--text);font-size:1.15rem;}
.odo-over{color:var(--red);}
.odo-warn{font-size:.9rem;color:var(--red);margin:-6px 0 12px;text-align:center;}
.odo-note{font-size:.85rem;color:var(--muted);margin:-4px 0 10px 4px;line-height:1.5;}
.odo-note.odo-vnote{margin:14px 0 2px 4px;}  /* v222: 乗り物ボタンの下の注記=ボタンに寄せない（-4pxは行の直下用） */
.odo-editunit{color:var(--muted);font-size:.9rem;}
#odo-input{flex:1;min-width:0;border:none;background:transparent;color:var(--text);font-size:1.1rem;font-weight:700;font-family:inherit;outline:none;padding:4px 0;text-align:right;}
/* v223: 「オイル交換した」=中央の塗り丸ボタン（なおす›の行とは別物=1日1回でなく数千kmに1回の儀式。えーくん9/10「差別化・センター」） */
.odo-oil-btn{
  display:block;width:auto;min-width:200px;min-height:48px;margin:10px auto 14px;padding:12px 32px;
  border:none;border-radius:999px;background:var(--green);color:#fff;
  font-size:1rem;font-weight:700;font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
/* v223→v224: 交換時期=イエローネオンの帯に黒文字（緊張感・えーくん9/10）・超過kmは朱で大きめ。
   v224: 色=LPのネオン #eaff00（--acid/--neon・#fff200は「普通の黄色」で却下）・帯は細く横一杯・上に8px（大きい数字のカンマに重なった） */
.odo-due{display:block;margin:8px -20px 0;background:#eaff00;color:#111;font-weight:800;font-size:1.05rem;padding:4px 12px;border-radius:0;letter-spacing:.02em;}  /* v225: シートの余白20pxを食って端から端まで（えーくんGO 9/10・緊張感） */
.odo-due-over{display:block;margin-top:8px;font-size:1.1rem;font-weight:700;color:var(--red);}
html.d-washi .odo-due-over{color:#a8402c;}
.odo-oil-btn:active{opacity:.75;}
.odo-vehicle{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:.9rem;color:var(--muted);}
.odo-vehicle button{flex:1;min-height:40px;border:1px solid var(--border);border-radius:10px;background:transparent;color:var(--muted);font-family:inherit;font-size:.9rem;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.odo-vehicle button.on{border-color:var(--text);color:var(--text);font-weight:700;}
/* ランプ: 消灯でも薄く常時表示（入口を兼ねる）・残り少で点灯・超過で朱。コンパス（left:8px）の右隣（v235: コンパスと一緒に左へ） */
#oil-btn{
  position:absolute;
  left:56px;
  top:50%;
  transform:translateY(-50%);
  min-width:44px;
  min-height:44px;
  background:transparent;
  border:none;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  color:var(--text);
  opacity:.35;
}
#oil-btn.oil-warn{opacity:1;color:var(--text);}
#oil-btn.oil-over{opacity:1;color:var(--red);}
/* 和紙: 蛍光1点=メーターの数字（カレンダー売上と同じマゼンタ・1画面1点）／朱=赤鉄 */
html.d-washi .odo-num{color:#c9187e;}
html.d-washi .odo-dec{color:#c9187e;}
html.d-washi .odo-over,html.d-washi .odo-warn,html.d-washi #oil-btn.oil-over{color:#a8402c;}

/* ===== css v189（v218・退行レビュー9/9）: history.html の脚注。v213で旧脚注クラスのCSSを消した巻き添えで無スタイル化していた
   （同じクラス名を履歴ページの「端末のみ保存」注記も共用していた）。専用クラスで小さく控えめに戻す ===== */
.hist-note { text-align: center; font-size: .82rem; color: var(--muted); padding: 24px 16px; }

/* ═══ css v207: 素の皮 d-plain（?design=plain・えーくんGO 2026-09-16）═══
   用途=Xアプローチ第五弾「自分用に使ってた簡素なガジェット」のβスクショ。washiと同じ骨格（ダイヤル・
   タブバー・天気）を出したまま装飾だけ剥がす=「同じ道具が服を脱いだ形」（別物に見えたら作戦が外れる）。
   彩色ゼロ・角ゼロ・影ゼロ・システムフォント。既存のwashi/sumi行には継ぎ足さない（ハーネスがセレクタ
   文字列を固定）=追記オンリー。幾何はc1（sumi/classic側・dialOrbitR=146）に自動で倒れる=JSは
   dialActive の1語だけ。将来の着せ替えスキンの土台候補。撮影はSafari直開き（?designはPWAに届かない） */
html.d-plain{
  --bg:#fff; --surface:#fff; --surface2:#f2f2f2; --border:#8a8a8a;
  --green:#000; --green-dk:#333; --text:#000; --muted:#666; --red:#000;  /* v208: --green=墨（文字色にも使われる資産） */
  --dot-red:#000; --radius:0;
}
/* 角と影を一括で剥がす。円である事に意味がある部品（ダイヤル面・曜日ピル・衛星ドット・つまみ）だけ除外 */
html.d-plain *:not(.dial-face):not(.dd-w):not([class*="dot"]):not(.dial-sw-thumb){border-radius:0!important;box-shadow:none!important;}
html.d-plain .site-header{background:var(--bg);border-bottom:1px solid var(--border);padding:8px 16px;}
html.d-plain #tabbar{display:flex;background:var(--bg);}
html.d-plain .wx{display:grid;}
html.d-plain .wx-box{display:block;}
html.d-plain .wx-box{--wx-card-bg:none;}
html.d-plain .header-btns{display:none;}
html.d-plain #set-btn{display:block;}  /* v235: 歯車（washi/sumi行に継ぎ足さない規約） */
html.d-plain body{padding-bottom:76px;}
/* 塗りボタン（1族＋classic基礎で background:var(--green) の面）=ブラウザ標準風の灰地・灰枠・黒文字 */
html.d-plain .btn-resume,html.d-plain #tz-paused .btn-timer-sub,html.d-plain .btn-takeover,
html.d-plain .past-banner button,html.d-plain .btn-post,html.d-plain .btn-timer-start,html.d-plain .btn-shift-start,
html.d-plain .io-done,html.d-plain .io-add,html.d-plain .tpl-start,html.d-plain .tpl-chip:active,html.d-plain .alarm-go,
html.d-plain .stedit-ok,html.d-plain .odo-oil-btn,html.d-plain .cash-act,html.d-plain .cash-slide-knob{background:#e9e9e9;border:1px solid #767676;color:#000;}
html.d-plain .past-banner{background:transparent;border:1px solid var(--border);color:var(--text);}
/* 全画面オーバーレイの地紙=白（暗地+blurは素でない） */
html.d-plain #io-overlay,html.d-plain #cash-overlay,html.d-plain #tpl-overlay{background:rgba(255,255,255,.94);-webkit-backdrop-filter:none;backdrop-filter:none;}
/* カレンダー・気温・曜日=単色 */
html.d-plain .cal-amt,html.d-plain .cal-amt.ace,html.d-plain .cal-hi,html.d-plain .cal-lo,
html.d-plain .dow.sun,html.d-plain .dow.sat,html.d-plain .cal-day.sun .cal-num,html.d-plain .cal-day.sat .cal-num{color:var(--text);}
/* ダイヤル=白地に黒線の計器（c1幾何・外周の黒線=box-shadowの軌道r146はそのまま生かす） */
html.d-plain .dial-face{--dial-bg:#fff;--dial-fg:#000;--dial-line:#000;}
html.d-plain .dial-ring circle{stroke:#999;}
html.d-plain .dial-ring text{fill:#000;}
html.d-plain .dial-ring text.dial-n{fill:#000;}
html.d-plain .dial-ticks line{stroke:#999;}
html.d-plain .dial-sw-thumb{background:#e9e9e9;border:1px solid #767676;}  /* 白い面の上で白いつまみは消えるので灰に */
/* 数字も明朝もやめてシステムフォント一本 */
html.d-plain .dial-date,html.d-plain .dial-num,html.d-plain .dial-time,html.d-plain .dstat-n,
html.d-plain .total-big,html.d-plain .tz-count,html.d-plain .timer-count-sm,html.d-plain #io-value,
html.d-plain .cash-field-val,html.d-plain .cash-change-val,html.d-plain .svc-big-amt,html.d-plain .tz-line-count{font-family:inherit;font-weight:400;}
/* css v224（えーくん実機9/22）: 2列カードで漢字の社名（出前館）は日本語フォントの字面で行が16→20pxに育ち、金額と件数が4px下に落ちて
   隣のUberEatsと段違いになる（実測=design_ref/svc_card_check.py）。社名行の高さを固定=文字種に依らず同じ位置。
   範囲はd-plainだけ（基礎に書くと和紙の稼働中カードが3px育つ副作用・実測で確認） */
html.d-plain .svc-big-name{height:20px;line-height:20px;}
/* css v208: 実機第1巡（えーくん9/16「すごい綺麗・これでも良いくらい・白と黒は究極系」）の直し2点
   ①ダイヤルの円は全部消して文字だけ（外周の軌道=box-shadow・リングr118・目盛り・衛星の玉）。コンパスの方位文字は
     話題性があるので残す ②スイッチと各社売上が見えない=生成りrgba(245,243,238)の直書きと文字色var(--green)が原因。
     --greenはwashiと同じ「墨」に倒し（文字・フォーカス・✓が黒になる）、塗りボタンだけ灰地に個別指定 */
html.d-plain .dial-face{box-shadow:none!important;}
html.d-plain .dial-ring circle,html.d-plain .dial-ticks line,html.d-plain .dial-dot,html.d-plain .dial-dot-shell{display:none;}
html.d-plain .dial-sw{border-color:#000;}
html.d-plain .dial-sw-seg,html.d-plain .dial-sw-end,html.d-plain .dial-time-note{color:#666;}
html.d-plain .dial-sw-seg.on,html.d-plain .dial-sw-end.on,html.d-plain .dial-sw-viewer{color:#000;}
html.d-plain .dial-sw-start{background:#e9e9e9;color:#000;border:1px solid #767676;}
/* css v209: 雨グラフも白黒で出す（えーくん9/16「白黒でも天気予報あったら目を引く・出せたらGO」）。
   棒=藍鼠#93a9c8の直書き→墨。最低気温の藍鼠も墨。天気枠自体はv207でwashiと同じ表示条件（暦日今日か稼働日）。
   ※Safari直開きはPWAと別空間=位置情報の許可を別に取る（許可が無いと天気枠はデータ無しで空） */
html.d-plain .wx-chart i{background:#000;}
html.d-plain .wx-lo,html.d-plain .wx-hi{color:var(--text);}

/* ═══ css v213: 縦リズム統一（gap方式・えーくんGO 2026-09-18・正=CLAUDE_spec「縦リズム」節）═══
   ルール: ①main直下の部品は上下マージン/上下パディングを持たない（左右16pxだけ）。間隔は親 main の gap が持つ
   ②仲間の中を詰めるのは隣接セレクタ `+` だけ（間に天気枠が割り込めば自動でグループ間に戻る）
   ③見た目補正は名前付き変数＋理由（生の「-6px」を書かない） ④ハーネスが「main直下の部品に上下余白なし」を見張る
   値: --rg=グループ間14px／--rk=仲間の中6px（C案: 近接の法則は比率で効く=14:6。A16/8・B12/8は却下・実測=design_ref/slot_gap_mock_*.png）
   display:none の部品は gap を生まない（flexの性質）=隠れた部品が間隔を崩さない。wxPosShift/FLIPは実測ベース=gapで挙動不変。
   範囲=washiだけ（sumi/classic/plainは旧マージンのまま不触） */
html.d-washi{--rg:14px;--rk:6px;--dial-ink:9px;--main-top:4px;}
/* --dial-ink: ダイヤル箱の上端〜北通過時の衛星の玉の上端（透明部分・v164の実測9px）。8/28「-6px」の後継=ヘッダー直下4px+9=箱-5px */
html.d-washi main{display:flex;flex-direction:column;gap:var(--rg);padding-top:var(--main-top);}
html.d-washi .wx-box .wx{margin-top:0;margin-bottom:0;padding:8px 10px 8px 6px;}  /* 面の内側余白=上下対称（旧: margin4+padding8/6の非対称）。左6px=v214（粒々側を詰める） */
html.d-washi .dial-zone{margin:calc(-1 * var(--dial-ink)) 16px;}
html.d-washi .dial-stats{margin:0 16px;}
html.d-washi .dial-zone + .dial-stats{margin-top:calc(var(--rk) - var(--rg));}  /* 仲間の中: 隣接時だけ */
html.d-washi .zone-services{padding:0 16px;}
html.d-washi .svc-chips{margin-top:var(--rk);}  /* 各社カード→待機チップ=仲間の中 */
html.d-washi .wx-past{margin:0 16px;}
html.d-washi #zone-post .action-area{padding:0 16px;}

/* ===== v253 不具合・要望 ===== */
.rep-foot{display:flex;justify-content:flex-end;padding:0 16px;}
.rep-btn{background:var(--surface2);border:none;border-radius:999px;color:var(--text);font-family:inherit;font-size:.95rem;padding:9px 16px;display:inline-flex;align-items:center;gap:6px;position:relative;min-height:40px;}
.rep-btn .pi{width:20px;height:20px;}
.rep-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--red,#e5484d);color:#fff;font-size:12px;font-weight:700;margin-left:6px;}
#rep-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:400;display:none;align-items:flex-end;}
#rep-sheet{background:var(--surface);border-radius:20px 20px 0 0;padding:20px 20px calc(28px + env(safe-area-inset-bottom,0px));width:100%;transform:translateY(100%);transition:transform .25s ease;max-height:calc(100dvh - 48px);overflow-y:auto;touch-action:pan-y;}
#rep-sheet.cal-open{transform:translateY(0);}
.rep-head{margin-bottom:12px;}
.rep-head .cloud-title{margin:0;}
.rep-note{font-size:.9rem;line-height:1.6;margin:0 0 10px;color:var(--text);}
.rep-note a{text-decoration:underline;}
.rep-kind{display:flex;gap:8px;margin-bottom:10px;}
.rep-kind-btn{flex:1;min-height:44px;border-radius:12px;border:1px solid var(--border);background:var(--surface2);color:var(--text);font-size:1rem;}
.rep-kind-btn.on{background:var(--green);color:var(--surface);border-color:transparent;font-weight:700;}  /* v233: washiの--greenは墨=#000文字が沈む（報告#1）→生成り=io-doneと同じ作法 */
.rep-text{margin-bottom:8px;}
.rep-send-row{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-bottom:14px;}  /* v234: 診断注記を削除→ボタンだけ右寄せ */
.rep-send:disabled{opacity:.4;}
.rep-list-title{font-size:.9rem;font-weight:700;margin:6px 0 8px;}
.rep-item{border-top:1px solid var(--border);padding:12px 0;}
.rep-item-head{display:flex;gap:6px;align-items:center;font-size:.85rem;margin-bottom:6px;}
.rep-pill{border-radius:999px;padding:2px 8px;background:var(--surface2);font-size:.8rem;}
.rep-pill.st-open{}
.rep-pill.st-working{background:var(--green);color:var(--surface);}
.rep-pill.st-done{background:var(--text);color:var(--surface);}
.rep-msg{font-size:1rem;line-height:1.6;white-space:pre-wrap;word-break:break-word;}
.rep-msg-admin{background:var(--surface2);border-radius:10px;padding:8px 10px 8px 12px;margin-top:8px;border-left:4px solid #eaff00;}  /* v234: 返信の箱が紙と見分けにくい→交換時期帯と同じネオンの縦線（文章は墨のまま・全面ネオンはまぶしい） */
.rep-msg-who{font-size:.8rem;font-weight:700;margin-bottom:2px;}
.rep-tabs{display:flex;gap:8px;margin-bottom:12px;}
.rep-tab{flex:1;min-height:40px;border-radius:10px;border:none;background:var(--surface2);color:var(--text);font-size:.95rem;position:relative;}
.rep-tab.on{background:var(--text);color:var(--surface);}
.rep-msg + .rep-msg{margin-top:6px;}
.rep-reply-toggle{background:none;border:none;color:var(--text);font-family:inherit;font-size:.9rem;padding:8px 0 0;text-decoration:underline;}
.rep-inbox-item{border-top:1px solid var(--border);padding:12px 0;}
.rep-st-row{display:flex;gap:6px;margin:6px 0;}
/* v233: 状態の切替ボタン=選んでいない物は地の色・選んだ物だけ状態色+枠（v232の「全部に状態色+opacity」は墨地に墨文字で黒潰れ・実機9/23） */
.rep-st-row .rep-pill{min-height:32px;display:inline-flex;align-items:center;border:2px solid transparent;font-family:inherit;background:var(--surface2);color:var(--text);}
.rep-st-row .rep-pill.on{border-color:var(--text);}
.rep-st-row .rep-pill.on.st-working{background:var(--green);color:var(--surface);}
.rep-st-row .rep-pill.on.st-done{background:var(--text);color:var(--surface);}
.rep-inbox-item details{margin:6px 0;font-size:.9rem;}
.rep-diag{font-size:.8rem;line-height:1.5;white-space:pre-wrap;}
.rep-admin-note{width:100%;margin-top:8px;background:var(--surface2);border:1px solid var(--border);border-radius:10px;color:var(--text);font-family:inherit;font-size:.95rem;padding:8px 10px;}
