:root{--bg: #f7f6f3;--card: #ffffff;--ink: #2b2b2b;--muted: #8a8a8a;--accent: #85b79d;--chip: #eef2f0;font-family:system-ui,-apple-system,Hiragino Sans,Noto Sans JP,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}main{max-width:680px;margin:0 auto;padding:0 16px 64px}.state{text-align:center;color:var(--muted);padding:48px 16px}.app-header h1{font-size:22px;padding:20px 0 8px}.sober{display:flex;flex-direction:column;gap:14px;background:linear-gradient(135deg,#85b79d,#5e9b80);color:#fff;border-radius:16px;padding:18px 20px;margin-bottom:24px;box-shadow:0 2px 8px #5e9b8059}.sober__top{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px}.sober__icon{font-size:22px}.sober__label{font-size:16px;font-weight:600;letter-spacing:1px}.sober__days{font-size:44px;font-weight:800;line-height:1;margin-left:auto;font-variant-numeric:tabular-nums}.sober__unit{font-size:18px;font-weight:700}.sober__note{flex-basis:100%;font-size:12px;opacity:.85}.sober__calorie{display:flex;align-items:baseline;gap:8px;border-top:1px solid rgba(255,255,255,.3);padding-top:12px}.sober__calorie-label{font-size:15px;font-weight:600;letter-spacing:1px}.sober__calorie-value{font-size:56px;font-weight:800;line-height:1;margin-left:auto;font-variant-numeric:tabular-nums}.sober__calorie-unit{font-size:20px;font-weight:700}.mock-badge{position:fixed;top:8px;right:8px;background:#d98880;color:#fff;font-weight:700;font-size:12px;letter-spacing:1px;padding:4px 10px;border-radius:999px;z-index:10}.summary{background:var(--card);border-radius:14px;padding:16px;margin-bottom:24px;box-shadow:0 1px 3px #0000000f}.summary h2{font-size:15px;margin:0 0 12px;display:flex;align-items:baseline;gap:8px}.summary__count{font-size:12px;color:var(--muted);font-weight:400}.summary__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:10px}.summary__cell{text-align:center}.summary__value{font-size:18px;font-weight:700}.summary__target{font-size:11px;color:var(--muted);margin-top:1px;display:flex;align-items:baseline;justify-content:center;gap:4px}.summary__pct{font-weight:700;font-variant-numeric:tabular-nums}.summary__pct--ok{color:#16a34a}.summary__pct--over{color:#dc2626}.summary__label{font-size:11px;color:var(--muted)}.summary__unit{margin-left:2px}.trend{background:var(--card);border-radius:14px;padding:16px;margin-bottom:24px;box-shadow:0 1px 3px #0000000f}.trend__head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:12px}.trend__head h2{font-size:15px;margin:0}.trend__tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:14px}.ntag{display:inline-flex;align-items:stretch;font-size:12px;border:1px solid #ddd;border-radius:999px;background:#fff;overflow:hidden}.ntag__label{border:none;background:transparent;color:var(--ink);font-size:12px;padding:4px 4px 4px 12px;cursor:pointer}.ntag__remove{border:none;background:transparent;color:var(--muted);font-size:13px;line-height:1;padding:0 8px 0 2px;cursor:pointer}.ntag.is-active{background:var(--accent);border-color:var(--accent)}.ntag.is-active .ntag__label,.ntag.is-active .ntag__remove{color:#fff}.ntag-add{position:relative;display:inline-flex}.ntag-add__btn{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;border:1px dashed #c7c7c7;border-radius:999px;background:#fff;color:var(--muted);cursor:pointer}.ntag-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:10;display:flex;flex-direction:column;min-width:140px;padding:4px;background:#fff;border:1px solid #e3e3e3;border-radius:10px;box-shadow:0 4px 16px #0000001f}.ntag-menu button{text-align:left;border:none;background:transparent;font-size:13px;padding:7px 10px;border-radius:7px;cursor:pointer;color:var(--ink)}.ntag-menu button:hover{background:var(--chip)}.trend__empty{text-align:center;color:var(--muted);font-size:13px;padding:40px 16px}.trend__charts{display:flex;flex-direction:column;gap:18px}.trend__chart{border-top:1px solid rgba(0,0,0,.06);padding-top:12px}.trend__chart:first-child{border-top:none;padding-top:0}.trend__chart-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:4px;padding:0 4px}.trend__chart-name{font-size:13px;font-weight:700}.trend__chart-target{font-size:11px;color:var(--muted)}.trend__zone{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 0;padding:0 4px;font-size:11px;color:var(--muted)}.trend__zone-ok:before,.trend__zone-ng:before{content:"";display:inline-block;width:10px;height:10px;margin-right:5px;border-radius:2px;vertical-align:-1px}.trend__zone-ok:before{background:#85b79d73}.trend__zone-ng:before{background:#e0556d73}.trend__zone--mixed{display:block}.trend__tip{background:var(--card, #fff);border:1px solid rgba(0,0,0,.1);border-radius:8px;padding:8px 10px;font-size:12px;box-shadow:0 2px 8px #0000001f}.trend__tip-label{color:var(--muted);margin-bottom:4px}.trend__tip-row{display:flex;justify-content:space-between;gap:12px}.trend__tip-name{font-weight:600}.trend__tip-val{color:var(--text, #333)}.trend__controls{display:flex;align-items:center;gap:8px}.trend__reset{font-size:12px;padding:4px 10px;border:1px solid #ddd;background:#fff;border-radius:8px;color:var(--muted);cursor:pointer}.trend__reset:hover{border-color:var(--accent);color:var(--accent)}.trend__periods{display:flex;gap:4px}.trend__periods button{font-size:12px;padding:4px 10px;border:1px solid #ddd;background:#fff;border-radius:8px;cursor:pointer}.trend__periods button.is-active{background:var(--accent);color:#fff;border-color:var(--accent)}.timeline h2{font-size:15px;margin:0 0 12px}.timeline__date{font-size:13px;color:var(--muted);margin:20px 0 8px}.card{display:flex;gap:12px;background:var(--card);border-radius:14px;overflow:hidden;margin-bottom:10px;box-shadow:0 1px 3px #0000000f}.card__photo-wrap{position:relative;width:96px;height:96px;flex-shrink:0;padding:0;border:0;background:none;cursor:pointer;display:block}.card__photo{width:96px;height:96px;object-fit:cover;display:block}.card__photo-badge{position:absolute;top:6px;right:6px;display:inline-flex;align-items:center;gap:3px;background:#0009;color:#fff;font-size:11px;font-weight:700;line-height:1;padding:3px 6px;border-radius:999px;pointer-events:none}.card__photo-badge-icon{display:block}.gallery{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#000000d9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px 12px}.gallery__close{position:absolute;top:12px;right:16px;width:40px;height:40px;border:0;border-radius:999px;background:#ffffff26;color:#fff;font-size:24px;line-height:1;cursor:pointer}.gallery__stage{position:relative;margin:0;max-width:100%;max-height:75vh;display:flex;align-items:center;justify-content:center}.gallery__img{max-width:100%;max-height:75vh;object-fit:contain;border-radius:8px}.gallery__nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:999px;background:#ffffff2e;color:#fff;font-size:28px;line-height:1;cursor:pointer}.gallery__nav--prev{left:8px}.gallery__nav--next{right:8px}.gallery__counter{position:absolute;bottom:8px;left:50%;transform:translate(-50%);background:#0000008c;color:#fff;font-size:12px;padding:3px 10px;border-radius:999px}.gallery__thumbs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:100%}.gallery__thumb{width:56px;height:56px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:none;cursor:pointer;opacity:.6}.gallery__thumb.is-active{border-color:#fff;opacity:1}.gallery__thumb img{width:100%;height:100%;object-fit:cover;display:block}.card__body{padding:10px 12px 12px 0;flex:1;min-width:0}.card__head{display:flex;align-items:center;gap:8px}.card__type{background:var(--accent);color:#fff;font-size:11px;padding:2px 8px;border-radius:999px}.card__name{font-weight:600;margin:6px 0}.card__memo{font-size:13px;margin:4px 0}.card__nutri{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.chip{background:var(--chip);font-size:11px;padding:2px 7px;border-radius:6px;color:#555}.card__tags{margin-top:6px}.tag{font-size:12px;color:var(--accent);margin-right:6px}