/* 新MeLab の見た目（今のMeLabの色をそのまま使う） */
*{touch-action:manipulation}
:root{
  --bg:#f3f6f2; --surface:#ffffff; --ink:#15211c; --muted:#5b6a63; --line:#dce5df;
  --accent:#11795c; --accent-soft:#e2f1e9; --accent-ink:#ffffff; --pop:#f26b21; --pop-soft:#fff0e6;
  --good:#2e7d32; --warn:#a86400; --bad:#bf3a30; --warn-soft:#fbf0dd; --bad-soft:#fbe5e2; --good-soft:#e3f1e4;
  --s1:#2a78d6; --s2:#eb6834; --track:#e8eeea;
  --display:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif;
  --body:"BIZ UDPGothic","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  --r:14px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0f1512; --surface:#18201c; --ink:#edf3ef; --muted:#a2b0a9; --line:#2a3530;
  --accent:#4cc39a; --accent-soft:#1c3a2e; --accent-ink:#0b1a13; --pop:#ff9459; --pop-soft:#3a2416;
  --good:#6cc070; --warn:#e2a64a; --bad:#ef7a70; --warn-soft:#3a2d17; --bad-soft:#3d1f1c; --good-soft:#1d3220;
  --s1:#3987e5; --s2:#d95926; --track:#26312c; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0f1512; --surface:#18201c; --ink:#edf3ef; --muted:#a2b0a9; --line:#2a3530;
  --accent:#4cc39a; --accent-soft:#1c3a2e; --accent-ink:#0b1a13; --pop:#ff9459; --pop-soft:#3a2416;
  --good:#6cc070; --warn:#e2a64a; --bad:#ef7a70; --warn-soft:#3a2d17; --bad-soft:#3d1f1c; --good-soft:#1d3220;
  --s1:#3987e5; --s2:#d95926; --track:#26312c; color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.6;margin:0;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--display);font-weight:700;margin:0;line-height:1.35;text-wrap:balance}
h1{font-size:1.4rem} h2{font-size:1.15rem} h3{font-size:1rem}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--muted)} .small{font-size:.84rem}
.good{color:var(--good)} .bad{color:var(--bad)}
.sp{flex:1}
.wrap{max-width:560px;margin:0 auto;padding:8px 16px 110px}
.stack{display:flex;flex-direction:column;gap:14px}
.stack-s{display:flex;flex-direction:column;gap:8px}
.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.card.soft{background:var(--accent-soft);border-color:transparent}
ul.clean{list-style:none;margin:0;padding:0}

/* 上の帯 */
header.top{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
header.top .in{max-width:560px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:10px}
.logo{font-family:var(--display);font-size:1.2rem;font-weight:700;color:var(--accent)}

/* ボタン・チップ */
.btn{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:9px 16px;cursor:pointer;min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.btn.pri{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
.btn.sm{padding:5px 12px;font-size:.85rem;min-height:34px}
.btn.big{width:100%;padding:13px;font-size:1rem}
.btn.ghost{background:transparent;border-color:transparent}
.btn:disabled{opacity:.5;cursor:default}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips.col{flex-direction:column;align-items:stretch}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 14px;cursor:pointer;min-height:40px;text-align:left}
.chip.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
.pill{display:inline-flex;align-items:center;border-radius:999px;padding:2px 10px;font-size:.78rem;font-weight:700;background:var(--accent-soft);color:var(--accent);white-space:nowrap}
.pill.warn{background:var(--warn-soft);color:var(--warn)} .pill.bad{background:var(--bad-soft);color:var(--bad)}

/* 入力 */
.field{display:flex;flex-direction:column;gap:4px}
.field label{font-size:.84rem;color:var(--muted)}
.field input,.inp,select,textarea{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:10px 12px;min-height:44px;width:100%}
.q{display:flex;flex-direction:column;gap:8px}
.check{display:flex;gap:8px;align-items:flex-start}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--accent)}
.err{color:var(--bad);min-height:1.2em}
details summary{cursor:pointer;color:var(--accent);font-weight:700}

/* 最初の質問 */
.onb{max-width:560px;margin:0 auto;padding:16px 16px 40px;display:flex;flex-direction:column;gap:14px;min-height:100dvh}
.onb-top{display:flex;align-items:center;gap:8px;padding-top:env(safe-area-inset-top,0px)}
.onb-foot{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding-top:8px}
.prog{height:6px;background:var(--track);border-radius:9px;overflow:hidden}
.prog span{display:block;height:100%;background:var(--accent);border-radius:9px;transition:width .25s}
.goals{display:flex;flex-direction:column;gap:8px}
.goal,.opt{display:flex;gap:12px;align-items:center;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:12px 14px;cursor:pointer;width:100%}
.opt{display:block}
.goal.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset;background:var(--accent-soft)}
.goalicon{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:1.1rem}

/* プログラム */
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
@media (min-width:420px){.kpis{grid-template-columns:repeat(4,1fr)}}
.kpi{background:var(--bg);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column}
.kpi .v{font-family:var(--display);font-size:1.35rem;line-height:1.2}
.chart{width:100%;height:auto;display:block}
.chart .grid{stroke:var(--line);stroke-width:1}
.chart .ax{font-size:9px;fill:var(--muted)}
.chart .plan{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart .ph{stroke:var(--line);stroke-dasharray:3 3}
.chart .real{fill:var(--s2)}
.chart .goal{fill:var(--accent);stroke:var(--surface);stroke-width:2}
.legend{display:flex;gap:14px;color:var(--muted)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;vertical-align:-1px}
.lplan{background:var(--accent)} .lreal{background:var(--s2)} .lgoal{background:var(--accent);box-shadow:0 0 0 2px var(--surface),0 0 0 3px var(--accent)}
.phases{margin:0;padding-left:1.3em;display:flex;flex-direction:column;gap:8px}
.days{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.day{background:var(--bg);border-radius:10px;padding:8px 10px}
.tips{display:flex;flex-direction:column;gap:6px}
.tips li{border-left:4px solid var(--accent);background:var(--surface);border-radius:6px;padding:8px 10px}
.tips li.warn{border-color:var(--warn)} .tips li.bad{border-color:var(--bad)} .tips li.good{border-color:var(--good)}

/* 表 */
.tbl{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:.88rem}
th,td{padding:6px 6px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{color:var(--muted);font-weight:400;font-size:.8rem}

/* 今日 */
.coach{display:flex;gap:12px;align-items:flex-start}
.coach img{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:none;background:var(--accent-soft)}
.coach-select-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.coach-card{display:flex;flex-direction:column;align-items:center;gap:4px;border:2px solid var(--line);background:var(--surface);border-radius:12px;padding:10px 6px;cursor:pointer}
.coach-card img{width:72px;height:96px;object-fit:cover;border-radius:8px}
.coach-card-name{font-weight:700;text-align:center}
.coach-card-type{text-align:center;line-height:1.2}
.coach-card.active{border-color:var(--accent);background:var(--accent-soft)}
.xsmall{font-size:.7rem}
.bubble{background:var(--surface);border:1px solid var(--line);border-radius:4px 14px 14px 14px;padding:10px 12px;flex:1}
.bar{height:10px;background:var(--track);border-radius:9px;overflow:hidden}
.bar span{display:block;height:100%;background:var(--accent);border-radius:9px}
.bar.over span{background:var(--pop)}
.todo{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.todo:last-child{border-bottom:0}
.todo .tick{width:28px;height:28px;border-radius:50%;border:2px solid var(--line);flex:none;display:grid;place-items:center;background:var(--surface);cursor:pointer;color:transparent}
.todo.done .tick{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.todo.done .t{color:var(--muted);text-decoration:line-through}
.scale5{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.scale5 .chip{text-align:center;padding:8px 0}

/* 下のタブ */
nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:6;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
nav.tabs .in{max-width:560px;margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr)}
.tab{border:0;background:none;padding:8px 0 10px;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.72rem;color:var(--muted);cursor:pointer;min-height:56px}
.tab svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tab[aria-selected="true"]{color:var(--accent);font-weight:700}

#toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px;font-size:.88rem;opacity:0;transition:.2s;pointer-events:none;z-index:20;max-width:calc(100% - 32px)}
#toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

/* ふりかえり */
.cmp-photos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cmp-photos figure{margin:0;display:flex;flex-direction:column;gap:4px;align-items:center}
.ph{width:100%;aspect-ratio:3/4;background:var(--bg);border:1px dashed var(--line);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);font-size:.8rem;overflow:hidden;position:relative}
.ph img{width:100%;height:100%;object-fit:cover}
.ph span{position:absolute;bottom:4px;right:6px;background:var(--surface);padding:0 6px;border-radius:6px}
.cmp-meals{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.meal-mini li{display:flex;flex-direction:column;padding:4px 0;border-bottom:1px solid var(--line)}
.meal-mini img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px}
.cmp-tot{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.daynav h2{font-size:1.05rem}
.ph:not(:has(img)){aspect-ratio:auto;min-height:90px}

/* おまかせ */
.seg{display:grid;grid-template-columns:repeat(3,1fr);background:var(--track);border-radius:999px;padding:3px;gap:3px}
.seg button{border:0;background:transparent;border-radius:999px;padding:8px 4px;cursor:pointer;font-size:.88rem;min-height:38px}
.seg button[aria-selected="true"]{background:var(--surface);font-weight:700;color:var(--accent);box-shadow:0 1px 2px rgb(0 0 0 / .08)}
.meal-row{border-top:1px solid var(--line);padding-top:8px}
.recipe{background:var(--bg);border-radius:10px;padding:10px 12px;margin-top:6px;display:flex;flex-direction:column;gap:4px}
.recipe ol{margin:0;padding-left:1.3em}

/* 食品検索 */
.food-results{margin-top:6px;display:flex;flex-direction:column;gap:2px}
.food-results li{padding:0}
.food-pick{display:flex!important;flex-direction:column;gap:2px;padding:8px 10px!important;border-radius:8px!important;background:var(--bg)!important}
.food-pick:hover,.food-pick:focus{background:var(--track)!important}
.food-name{font-size:.88rem;font-weight:600;color:var(--fg)}
.food-meta{display:block;font-size:.78rem}
.food-search-wrap{display:flex;flex-direction:column;gap:6px}

/* ログイン画面 */
.auth-wrap{max-width:400px;margin:0 auto;padding:env(safe-area-inset-top,24px) 16px 40px;display:flex;flex-direction:column;gap:16px;min-height:100dvh;justify-content:center}
.auth-logo{text-align:center;padding:24px 0 8px}
.auth-logo .logo{font-size:2rem}

/* 同意画面 */
.consent-wrap{max-width:480px;margin:0 auto;padding:env(safe-area-inset-top,16px) 16px 40px;display:flex;flex-direction:column;gap:14px}
.consent-logo{text-align:center;padding:20px 0 4px}
.consent-logo .logo{font-size:1.8rem}
.consent-list{margin:0;padding-left:1.3em;display:flex;flex-direction:column;gap:6px;font-size:.88rem}
.consent-list li{color:var(--ink)}

/* 有料プラン */
.pro-table{display:flex;flex-direction:column;gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:.85rem}
.pro-row{display:grid;grid-template-columns:1fr 80px 80px;gap:0;padding:8px 12px;border-bottom:1px solid var(--line);align-items:center}
.pro-row:last-child{border-bottom:none}
.pro-row.head{background:var(--track);font-weight:700;font-size:.8rem}
.pro-row span:nth-child(2),.pro-row span:nth-child(3){text-align:center}
.pro-price-wrap{display:flex;flex-direction:column;gap:8px;margin-top:4px}

/* コーチAIチャット */
.coach-chat-btn{margin-top:6px;font-size:.8rem;padding:4px 10px;min-height:30px}
#coachModal{position:fixed;inset:0;z-index:30;background:var(--bg);display:flex;flex-direction:column}
#coachModal[hidden]{display:none!important}
.chat-wrap{display:flex;flex-direction:column;height:100%;max-width:560px;margin:0 auto;width:100%}
.chat-head{display:flex;align-items:center;gap:10px;padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top,12px));border-bottom:1px solid var(--line);background:var(--surface);flex:none}
.chat-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.chat-msg{max-width:84%;padding:10px 13px;border-radius:14px;font-size:.92rem;line-height:1.55}
.chat-msg p{margin:0}
.user-msg{background:var(--accent);color:var(--accent-ink);align-self:flex-end;border-bottom-right-radius:4px}
.coach-msg{background:var(--surface);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.chat-msg.loading{display:flex;gap:5px;align-items:center;padding:12px 16px}
.chat-msg.loading span{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:chatdot 1.2s ease-in-out infinite}
.chat-msg.loading span:nth-child(2){animation-delay:.2s}
.chat-msg.loading span:nth-child(3){animation-delay:.4s}
@keyframes chatdot{0%,80%,100%{transform:scale(0.7);opacity:.5}40%{transform:scale(1);opacity:1}}
.chat-warn{padding:6px 16px;text-align:center;background:var(--warn-soft)}
.chat-foot{display:flex;gap:8px;padding:10px 16px;padding-bottom:max(10px,env(safe-area-inset-bottom,10px));border-top:1px solid var(--line);background:var(--surface);flex:none;align-items:flex-end}
.chat-foot .inp{flex:1;resize:none;min-height:40px;max-height:100px;border-radius:12px;padding:8px 12px}

/* サプリ・薬 */
.supp-row{display:inline-flex;align-items:center;gap:2px}
.supp-del{padding:4px 6px;min-height:unset;font-size:.75rem;opacity:.6}

/* 冷蔵庫・在庫 */
.warn-card{background:var(--warn-soft);color:var(--warn);border-radius:var(--r);padding:10px 14px;border:1px solid var(--warn)}