/* ---- 月曜4時の週切り替えフロー ---- */
.weekly-flow-overlay{
  z-index:calc(var(--app-popup-z, 140) + 4);
}
.overlay-modal .weekly-flow-card{
  width:100%;
  max-width:min(620px, 100%);
  padding:clamp(18px, 4vw, 28px);
}
.weekly-flow-step[hidden]{ display:none; }
.weekly-flow-kicker{
  margin:0 0 4px;
  color:var(--selected-soft-ink);
  font-size:var(--fs-xs);
  font-weight:800;
  letter-spacing:.04em;
}
.weekly-flow-title{
  margin:0;
  color:var(--heading-ink);
  font-size:clamp(1.15rem, 4vw, 1.45rem);
  line-height:1.35;
}
.weekly-flow-range{
  margin:5px 0 0;
  color:var(--ink-soft);
  font-size:var(--fs-xs);
  font-variant-numeric:tabular-nums;
}
.weekly-flow-lead{
  margin:15px 0 0;
  color:var(--ink);
  font-size:var(--fs-sm);
  line-height:1.65;
}
.weekly-flow-section{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:18px;
  padding-top:15px;
  border-top:1px solid var(--line);
}
.weekly-flow-section-title{
  margin:0;
  color:var(--ink);
  font-size:var(--fs-sm);
  font-weight:800;
}
.weekly-flow-section-note{
  margin:0;
  color:var(--ink-soft);
  font-size:var(--fs-2xs);
  line-height:1.5;
}
.weekly-flow-energy-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
}
.weekly-flow-energy-field{
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
  color:var(--ink-soft);
  font-size:var(--fs-2xs);
  font-weight:700;
  line-height:1.35;
}
.weekly-flow-energy-field input{
  width:100%;
  min-width:0;
  padding:7px 8px;
  border:1px solid var(--line);
  border-radius:7px;
  background:var(--paper);
  color:var(--ink);
  font:inherit;
  font-size:16px;
  font-variant-numeric:tabular-nums;
}
.weekly-flow-energy-field input:focus-visible,
.weekly-flow-memo-input:focus-visible{
  outline:2px solid var(--focus-ring);
  outline-offset:2px;
}
.weekly-flow-memo{
  display:flex;
  flex-direction:column;
  gap:7px;
}
.weekly-flow-memo-label{
  color:var(--ink);
  font-size:var(--fs-xs);
  font-weight:700;
}
.weekly-flow-memo-input{
  width:100%;
  min-height:40px;
  padding:7px 9px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--paper);
  color:var(--ink);
  font:inherit;
  font-size:16px;
}
.weekly-flow-memo-colors{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.weekly-flow-memo-color{
  width:26px;
  height:26px;
  padding:0;
  border:2px solid transparent;
  border-radius:50%;
  cursor:pointer;
}
.weekly-flow-memo-color.active{
  border-color:var(--selected-strong-border);
  box-shadow:0 0 0 2px var(--paper);
  outline:2px solid var(--selected-strong-border);
}
.weekly-flow-memo-color.hc-memo-gray{ background:#B9BFCE; }
.weekly-flow-memo-color.hc-memo-red{ background:#E77C7C; }
.weekly-flow-memo-color.hc-memo-orange{ background:#E8A04E; }
.weekly-flow-memo-color.hc-memo-yellow{ background:#E5C84C; }
.weekly-flow-memo-color.hc-memo-green{ background:#74B989; }
.weekly-flow-memo-color.hc-memo-blue{ background:#70A7D8; }
.weekly-flow-memo-color.hc-memo-purple{ background:#A887C7; }
.weekly-flow-memo-color.hc-memo-pink{ background:#D889B0; }
.weekly-flow-choice-grid{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.weekly-flow-field-choice,
.weekly-flow-choice{
  box-sizing:border-box;
  min-height:38px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--paper);
  color:var(--ink-soft);
  font:inherit;
  font-size:var(--fs-xs);
  font-weight:600;
  cursor:pointer;
}
.weekly-flow-field-choice{
  display:inline-flex;
  align-items:center;
  gap:7px;
  flex:1 1 135px;
  justify-content:flex-start;
  padding:6px 9px;
  text-align:left;
}
.weekly-flow-field-choice img{
  width:42px;
  height:25px;
  flex:none;
  border-radius:4px;
  object-fit:cover;
}
.weekly-flow-choice{
  padding:7px 11px;
}
.weekly-flow-reward-choice{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.weekly-flow-reward-choice img{
  width:28px;
  height:28px;
  flex:none;
  object-fit:contain;
}
.weekly-flow-field-choice:hover,
.weekly-flow-choice:hover{ background:var(--paper-dim); }
.weekly-flow-field-choice.active,
.weekly-flow-choice.active{
  border:3px solid var(--selected-strong-border);
  background:var(--selected-soft-bg);
  color:var(--selected-soft-ink);
  font-weight:700;
}
.weekly-flow-field-choice.active{ padding:4px 7px; }
.weekly-flow-choice.active{ padding:5px 9px; }
.weekly-flow-field-choice:focus-visible,
.weekly-flow-choice:focus-visible,
.weekly-flow-memo-color:focus-visible{
  outline:2px solid var(--focus-ring);
  outline-offset:2px;
}
.weekly-flow-empty{
  margin:0;
  color:var(--ink-soft);
  font-size:var(--fs-2xs);
}
.weekly-flow-next-toggle{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:18px;
  color:var(--ink-soft);
  font-size:var(--fs-xs);
  font-weight:700;
  cursor:pointer;
}
.weekly-flow-next-toggle input{
  width:18px;
  height:18px;
  margin:0;
  accent-color:var(--selected-strong-border);
  cursor:pointer;
}
.weekly-flow-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:22px;
}
.weekly-flow-action{
  min-height:40px;
  padding:8px 14px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--paper-dim);
  color:var(--ink-soft);
  font:inherit;
  font-size:var(--fs-sm);
  font-weight:700;
  cursor:pointer;
}
.weekly-flow-action:hover{ background:var(--line); color:var(--ink); }
.weekly-flow-action.is-primary{
  border-color:var(--selected-border);
  background:var(--selected-bg);
  color:var(--selected-ink);
}
.weekly-flow-action.is-primary:hover{ filter:brightness(1.08); }
@media (max-width:480px){
  .weekly-flow-energy-grid{ grid-template-columns:1fr; }
  .weekly-flow-energy-field{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(110px, 42%); align-items:center; }
  .weekly-flow-actions{ align-items:stretch; flex-direction:column-reverse; }
  .weekly-flow-action{ width:100%; }
}