/* ============================================================
   base.css — 共通 UI
   スコープ: html/body, タブバー, .container, .card, ボタン, 共通入力, 文字の大きさ「大」
   触らない: 各画面専用の見た目（input/graph/report/led/easy/ocr/health/settings/about）
   命名: 共通部品はクラス（.card .btn .tab-bar）。画面専用は各 css へ
   ============================================================ */
/* 共通：画面全体・タブ・ボタン・入力欄など */
html{
  background:var(--bg);
  touch-action:pan-x pan-y;
  overscroll-behavior:none;
  height:100%;
}
body{
  touch-action:pan-x pan-y;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  margin:0;
  padding:0;
  background:transparent;
  color:var(--text);
  -webkit-user-select:none;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior:none;
  min-height:100%;
  min-height:100dvh;
}
body::before{
  content:"";
  position:fixed;
  left:0;right:0;top:0;bottom:0;
  z-index:-1;
  background:var(--page-bg);
  pointer-events:none;
}
.tab-bar{
  display:flex;
  background:color-mix(in srgb, var(--tab-bg) 82%, transparent);
  border-top:1px solid var(--border);
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:100;
  padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -4px 14px rgba(var(--sh),.08);
  /* iOS風のすりガラス（対応端末のみ。非対応はほぼ不透明のまま） */
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  backdrop-filter:saturate(180%) blur(16px);
}
@supports not (background:color-mix(in srgb, white 50%, transparent)){
  .tab-bar{background:var(--tab-bg)}
}
.tab-btn{
  flex:1;
  /* 上下の余白＝縦の余白4px×2＋内側の余白で、全体の高さは v140 と同じ（--tab-bar-h を変えない） */
  margin:4px 4px;
  padding:4px 0 2px;
  text-align:center;
  background:none;
  border:none;
  font-size:.78rem;
  font-weight:bold;
  color:var(--sub);
  cursor:pointer;
  border-radius:14px;
  transition:opacity .12s ease, color .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.tab-btn:active{opacity:.55}
.tab-btn svg{
  display:block;
  width:26px;height:26px;
  margin:0 auto 3px;
  fill:currentColor;
}
.tab-btn.active{color:var(--primary);background:var(--tint);box-shadow:var(--sunk)}
.container{
  padding:calc(12px + env(safe-area-inset-top)) 12px calc(var(--tab-bar-h) + env(safe-area-inset-bottom));
  max-width:640px;
  margin:0 auto;
}
.tab-content{display:none}
.tab-content.active{display:block}
.card{
  background:var(--card-bg);
  border-radius:16px;
  border:1px solid var(--border);
  padding:16px;
  margin-bottom:16px;
  box-shadow:var(--elev-card);
}
.card-title{font-weight:bold;font-size:1.1rem;margin-bottom:12px}
label{font-size:.95rem;color:var(--sub);display:block;margin-top:10px}
input,textarea{
  width:100%;
  padding:12px;
  margin-top:4px;
  border:1px solid var(--input-border);
  border-radius:8px;
  box-sizing:border-box;
  font-size:1.1rem;
  font-family:inherit;
  background:var(--input-bg);
  color:var(--text);
}
::placeholder{color:var(--sub);opacity:1}
input[type=date],input[type=month]{
  -webkit-appearance:none;
  appearance:none;
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  min-height:48px;
  background:var(--date-bg);
  color:var(--text);
  text-align:center;
}
input[type=date]::-webkit-date-and-time-value,
input[type=month]::-webkit-date-and-time-value{
  text-align:center;
  min-height:1.2em;
}
.row{display:flex;gap:8px}
.row>div{flex:1}
.btn{
  width:100%;
  background:var(--tint);
  background-image:var(--face);
  color:var(--btn-text);
  border:none;
  padding:14px;
  border-radius:14px;
  font-size:1.05rem;
  font-weight:bold;
  margin-top:20px;
  cursor:pointer;
  box-shadow:var(--elev-1);
  transition:opacity .12s ease, transform .12s ease, box-shadow .12s ease;
  -webkit-touch-callout:none;
}
.btn:active{opacity:.75;transform:scale(.985);box-shadow:var(--press)}
/* 主役のボタン（青い面。保存など）。v142 */
.btn.pri{background:var(--primary);background-image:var(--face-pri);color:var(--on-primary);box-shadow:var(--elev-pri)}
.btn.pri:active{box-shadow:var(--press)}
.btn-sub{
  background:var(--card-bg);
  background-image:var(--face);
  border:1px solid var(--input-border);
  color:var(--btn-text);
  margin-top:10px;
}
.btn-danger{background:#ff3b30;background-image:var(--face-pri);color:#fff;border:none;margin-top:10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 2px 5px rgba(255,59,48,.38),0 6px 14px rgba(255,59,48,.2)}
.status-msg{margin-top:10px;text-align:center;font-weight:bold;color:#34c759;min-height:24px}
.seg{display:flex;gap:8px}
.seg button{
  flex:1;
  padding:12px 4px;
  border-radius:12px;
  border:none;
  background:var(--tint);
  background-image:var(--face);
  color:var(--btn-text);
  font-size:1rem;
  font-weight:bold;
  cursor:pointer;
  box-shadow:var(--elev-1);
  transition:opacity .12s ease, background .12s ease, box-shadow .12s ease;
}
.seg button:active{opacity:.75;box-shadow:var(--press)}
.seg button.on{background:var(--primary);background-image:var(--face-pri);color:var(--on-primary);box-shadow:var(--elev-pri)}
.note{font-size:.9rem;color:var(--sub);margin:6px 0 0}
.bp-high{color:var(--high);font-weight:bold}
.bp-low{color:var(--low);font-weight:bold}
.sat-color{color:var(--sat)}
.sun-color{color:var(--sun)}
/* 推移グラフ・レポートの日付／月の行は、ここ1か所で同じ大きさ（高さ46px・上に12px・‹›は幅42px）にする。記録入力の日付の行と同じ見た目（v144・v167） */
.month-nav{display:flex;justify-content:center;gap:6px;align-items:center;height:46px;padding-top:12px;box-sizing:content-box}
.month-nav input{margin-top:0;height:48px;flex:1;min-width:0;background-image:var(--face);box-shadow:var(--elev-1)}
.mnav{
  flex:none;
  width:42px;height:46px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--pill-bg);
  color:var(--text);
  font-size:1.6rem;
  line-height:1;
  background-image:var(--face);
  padding:0;
  cursor:pointer;
  box-shadow:var(--elev-1);
  transition:opacity .12s ease, box-shadow .12s ease;
}
.mnav:active{opacity:.65;box-shadow:var(--press)}
.cell{
  background:var(--card-bg);
  border:1px solid var(--input-border);
  border-radius:14px;
  padding:6px 4px 2px;
  text-align:center;
  background-image:var(--face);
  box-shadow:var(--elev-1);
  transition:box-shadow .12s ease;
}
/* 入力中のマスは「へこんで」、青い縁が残る（v141） */
.cell:focus-within{border-color:var(--primary);background-image:none;box-shadow:var(--sunk),var(--ring)}
.cell span{display:block;font-size:.75rem;color:var(--sub)}
.cell input{
  border:none;
  background:transparent;
  text-align:center;
  font-size:1.6rem;
  font-weight:bold;
  padding:0;margin:0;
  height:36px;
  border-radius:0;
}
.cell input:focus{outline:none}

/* ===== 「進む」ボタン（›）：記録入力・推移グラフ・レポートで表示。今日／当月のときは薄くして押せない ===== */
.mnav:disabled{opacity:.3;cursor:default}

/* ===== 文字の大きさ「大」（設定の「表示」）。rem の大きさをまとめて1.2倍にする。印刷プレビューは標準のまま。動きは js/theme.js ===== */
html[data-fs="l"]{font-size:120%}
html[data-fs="l"] .cell input{height:44px}
html[data-fs="l"] .mrow .cell input{height:38px}
html[data-fs="l"] .container{padding-bottom:calc(var(--tab-bar-h-lg) + env(safe-area-inset-bottom))}
html[data-fs="l"] #graphTab.active{height:calc(100vh - var(--graph-chrome-h-lg) - env(safe-area-inset-top) - env(safe-area-inset-bottom));height:calc(100dvh - var(--graph-chrome-h-lg) - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
@media screen{html[data-fs="l"] #rp-print-pages{zoom:.8334}}

/* ===== 日付・月の行のデザイン（v182）。‹ › は枠なしの矢印だけ、日付・月の枠は凹んだカプセル。ライト・ダークのみ（白黒は mono.css のまま）。
   タップできる範囲（.dnav 幅42×高さ46、.mnav 幅52×高さ48）は変えない。押せない側（:disabled）は今までどおり薄くする。
   対象：記録入力の日付、グラフの日付・月・選んだ日の行、先生への月の行。かんたんモードの日付（.ez-date）は対象外 ===== */
:root:not([data-theme=mono]) .dnav,:root:not([data-theme=mono]) .mnav{background:transparent;background-image:none;border-color:transparent;box-shadow:none;color:var(--text);font-weight:bold}
:root:not([data-theme=mono]) .dnav{font-size:2rem}
:root:not([data-theme=mono]) .mnav{font-size:2.1rem}
:root:not([data-theme=mono]) .dnav:active,:root:not([data-theme=mono]) .mnav:active{box-shadow:none;opacity:.5}
:root:not([data-theme=mono]) .date-pill,:root:not([data-theme=mono]) .gday{background-image:none;border-radius:24px;box-shadow:var(--sunk)}