/* settings.css - 설정 and its sheets. Owner: slice S6. Every selector starts with .se- (CONTRACT_shell.md 6.2, 6.3); tokens and u- parts live in app.css. */

/* 설정 is a pushed page with no tab bar (audit F60). The page and nav#tabs are siblings under body. */
.se-pg:not([hidden]) ~ .tabs { display:none; }

/* The gear on the three tab headers (D6): 44 px, the frames' 22 px icon in ink, its glyph on the gutter. With the
   stage text beside it the text takes the free space, so the two never split it. */
#tbar-set:not([hidden]) { display:grid; place-items:center; flex:none; width:44px; min-width:44px; height:44px;
  margin:0 -10px 0 auto; padding:0; color:var(--ink); }
#tbar-set svg { width:22px; height:22px; }
#stage-badge:not([hidden]):not(:empty) ~ #tbar-set { margin-left:0; }
/* 오늘 under 360 wraps its header: the gear stays on the title's line and the stage text takes the line under it. */
@media (max-width:359px) {
  .tbar[data-pg="today"] #tbar-set, .tbar[data-pg="today"] #stage-badge:not([hidden]):not(:empty) ~ #tbar-set { order:1; margin-left:auto; }
  .tbar[data-pg="today"] #stage-badge { order:2; flex:1 0 100%; margin-left:0; }
}

/* 설정 (frame settings; F1 F2 F4 F5, F9): groups on the page with a hairline under each; a row 56 tall (two lines 72),
   name 15 / 600 ink left, value 13 / 500 sub right, one › in a 12 px box on the gutter. The headless last group keeps a
   heading's 37 px above it. The same row is the 빼는 재료 row of 안 먹이는 것 and the 끼니 시각 rows of 끼니 수. */
.se-root { padding-bottom:8px; }
.se-card { margin:0; border-bottom:1px solid var(--line); }
.se-card.se-nohead { padding-top:37px; }
.se-h { margin:0; padding:14px 0 4px; line-height:19px; font-size:13px; font-weight:500; color:var(--sub); }
.se-kv { display:grid; grid-template-columns:auto minmax(0,1fr) 12px; column-gap:12px; align-items:center; box-sizing:border-box;
  width:100%; min-height:56px; margin:0; padding:0; border:0; border-top:1px solid var(--line); border-radius:0;
  background:none; font:inherit; color:var(--ink); text-align:left; cursor:pointer; }
.se-h + .se-kv, .se-card > .se-kv:first-child { border-top:0; }
.se-kv:active { background:var(--well); }
.se-kv.se-nodoor { cursor:default; }
.se-kv.se-nodoor:active { background:none; }
.se-k { white-space:nowrap; font-size:15px; font-weight:600; color:var(--ink); }
.se-v { justify-self:end; min-width:0; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  text-align:right; font-size:13px; font-weight:500; color:var(--sub); }
.se-v small { font:inherit; color:inherit; }
.se-chev { display:inline-flex; justify-content:center; width:12px; font-size:15px; font-weight:600; line-height:1; color:var(--sub); }
.se-kv.se-2l { grid-template-rows:auto auto; row-gap:2px; min-height:72px; padding:12px 0; }
.se-kv.se-2l .se-v { display:contents; }
.se-kv.se-2l .se-l1 { grid-column:2; grid-row:1; justify-self:end; }
.se-kv.se-2l .se-l2 { grid-column:1 / 3; grid-row:2; font-size:12px; line-height:1.4; white-space:normal; text-align:left; }
.se-kv.se-2l .se-chev { grid-column:3; grid-row:1 / 3; }
.se-mtimes { border-bottom:1px solid var(--line); }
/* 안 먹이는 것 (frame settings-out, RULINGS B103): 6 / 8's 알레르기 and 빼는 재료 labels, 15 / 600 ink, both open as check
   rows 44 tall 13 / 500 (user 2026-10-22: one level, one way), 저장 52 tall 15 / 600; the sheet's caption line is not
   drawn. */
#kd-allergy :is(#al-lab, #al-xlab) { margin:16px 0 8px; font-size:15px; font-weight:600; color:var(--ink); }
#kd-allergy #al-xlab { margin-top:24px; }
#kd-allergy :is(#allergy-chips .chip.se-ck, .al-x .se-ck) { min-height:44px; font-size:13px; font-weight:500; }
#kd-allergy .al-x .se-ck:nth-child(-n+2) { border-top:0; }
#kd-allergy #al-xbody { margin-bottom:16px; }
#kd-allergy .pnl-body > .se-note:not(.se-alsrc) { display:none; }
#kd-allergy #al-save { box-sizing:border-box; min-height:52px; font-size:15px; font-weight:600; }
/* sheets (blueprint sheet_birth / feed / meals / meal_times; mockup baby_wireframe.html 147-178) */
.se-ymd { display:flex; gap:8px; }
.se-ymdf { flex:1; display:flex; align-items:center; gap:4px; min-width:0; min-height:48px; padding:0 12px;
  border:1.5px solid var(--line); border-radius:14px; }
.se-ymdf:first-child { flex:1.4; }
.se-ymdf:focus-within { border-color:var(--accent); }
.se-ymdf input { width:100%; min-width:0; min-height:44px; margin:0; padding:0; border:0; outline:none; background:none;
  font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; }
.se-ymdf span { flex:none; font-size:14px; font-weight:700; color:var(--sub); }
.se-kvl { display:flex; gap:10px; padding:10px 2px 0; font-size:13px; }
.se-kvl span { flex:none; width:78px; color:var(--sub); }
.se-err { min-height:18px; margin:6px 2px 8px; font-size:var(--fs-m); font-weight:700; color:var(--warn); }
.se-cta { flex-direction:column; }
.se-cta small { display:block; margin-top:2px; font-size:var(--fs-s); font-weight:600; opacity:.85; }
.se-note { margin:6px 2px 12px; font-size:var(--fs-s); color:var(--sub); line-height:1.55; }
.se-src { white-space:nowrap; color:var(--accent-2); font-weight:700; }
.se-seg { display:flex; padding:3px; margin:0 0 6px; border-radius:999px; background:var(--well); }
.se-seg button { flex:1; min-height:44px; border:0; border-radius:999px; background:none; font-size:var(--fs-base);
  font-weight:700; color:var(--sub); text-align:center; cursor:pointer; }
.se-seg button[aria-checked="true"] { background:var(--card); color:var(--ink); box-shadow:0 1px 4px rgba(20,20,20,.12); }
.se-seg button:disabled { opacity:.45; cursor:default; }
.se-step { display:flex; align-items:center; justify-content:space-between; margin:10px 0 4px; padding:6px;
  border:1.5px solid var(--line); border-radius:16px; }
.se-step button { width:44px; height:44px; border:0; border-radius:50%; background:var(--well); font-size:20px;
  font-weight:700; text-align:center; cursor:pointer; }
.se-step button:disabled { opacity:.35; cursor:default; }
.se-step b { font-size:20px; }
.se-frow { display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid var(--line); font-size:14px; }
.se-seg + .se-frow { border-top:0; }
.se-frow > span { flex:none; width:84px; }
.se-frow input { flex:1; min-width:0; min-height:44px; margin:0; padding:0 12px; border:1.5px solid var(--line);
  border-radius:12px; outline:none; font-size:16px; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }
.se-frow input:focus { border-color:var(--accent); }
.se-frow em { flex:none; width:30px; font-style:normal; font-size:13px; font-weight:700; color:var(--sub); }
.se-fixed { flex:1; text-align:right; font-size:var(--fs-base); }
.se-flab { margin:12px 0 6px; font-size:var(--fs-m); font-weight:700; }
.se-flab small { margin-left:4px; font-size:var(--fs-s); font-weight:500; color:var(--sub); }
.se-flab ~ .se-flab { margin-top:14px; }
.se-nw { white-space:nowrap; }
.se-wheel { box-sizing:border-box; height:220px; overflow-y:auto; scroll-snap-type:y mandatory; border-radius:16px;
  background:var(--well); padding:88px 0; margin:4px 0 6px; overscroll-behavior:contain; }
.se-wheel button { display:block; width:100%; height:44px; margin:0; padding:0; border:0; border-radius:0; background:none;
  scroll-snap-align:center; font-size:16px; font-weight:700; color:var(--faint); text-align:center; cursor:pointer;
  font-variant-numeric:tabular-nums; }
.se-wheel button[aria-selected="true"] { color:var(--ink); font-size:19px; font-weight:700; background:var(--card); }
/* radio rows: 장 보는 날, 남은 큐브 (mockup 179-185) */
.se-picks { display:flex; flex-direction:column; }
.se-pick { display:flex; align-items:center; gap:12px; width:100%; min-height:52px; margin:0; padding:8px 2px; border:0;
  border-top:1px solid var(--line); border-radius:0; background:none; text-align:left; font-size:var(--fs-body); cursor:pointer; }
.se-pick:first-child { border-top:0; }
.se-rd { flex:none; box-sizing:border-box; width:20px; height:20px; border-radius:50%; border:2px solid var(--box); }
.se-pick[aria-checked="true"] .se-rd { border:6px solid var(--accent); }
.se-pickt { flex:1; min-width:0; }
.se-pickt b { font-weight:700; }
.se-pickt small { display:block; margin-top:2px; font-size:var(--fs-s); color:var(--sub); }
.se-pick em { font-style:normal; color:var(--accent); font-weight:700; visibility:hidden; }
.se-pick[aria-checked="true"] em { visibility:visible; }
/* 바구니 모양: each basket (84 x 124) at half size in its radio row, the picked one in its 설정 row */
.se-bk { display:block; width:42px; height:62px; }
.se-bkv { display:block; height:40px; width:auto; aspect-ratio:84 / 124; }
/* 큐브 틀 list and form (mockup 116-136) */
.se-tray { display:flex; align-items:center; gap:8px; border-top:1px solid var(--line); }
.se-tray:first-child { border-top:0; }
.se-trayb { flex:1; display:flex; align-items:center; gap:8px; min-width:0; min-height:44px; margin:0; padding:11px 0;
  border:0; border-radius:0; background:none; text-align:left; font-size:var(--fs-base); cursor:pointer; }
.se-trayb b { font-size:var(--fs-body); }
.se-del { flex:none; min-height:44px; margin:0; padding:0 14px; border:0; border-radius:999px; background:var(--well);
  color:var(--sub); font-size:var(--fs-s); font-weight:700; white-space:nowrap; cursor:pointer; }
.se-none { padding:11px 0; margin:0; color:var(--sub); font-size:var(--fs-base); }
.se-unown { margin:2px 0 4px; font-size:var(--fs-s); color:var(--sub); }
.se-add { display:block; width:100%; min-height:44px; margin:8px 0 12px; padding:11px; border:1.5px dashed var(--line);
  border-radius:14px; background:var(--card); font-size:13.5px; font-weight:700; color:var(--accent); cursor:pointer; }
.se-add:disabled { color:var(--sub); cursor:default; }
.se-add + .se-note { margin-top:-6px; }
.se-unit { display:inline-flex; margin:2px 0 10px; }
.se-unit button { flex:none; padding:0 18px; }
.se-capin { display:flex; align-items:center; gap:8px; }
.se-capin input { flex:1; min-width:0; min-height:44px; margin:0; padding:0 14px; border:1.5px solid var(--line);
  border-radius:14px; outline:none; font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; }
.se-capin input:focus { border-color:var(--accent); }
.se-capin span { flex:none; width:36px; font-size:15px; font-weight:700; }
.se-conv { min-height:18px; margin:8px 2px 0; font-size:var(--fs-s); color:var(--sub); }
.se-hint { margin:2px 2px 12px; font-size:var(--fs-s); color:var(--sub); line-height:1.5; }
.se-gr { display:flex; align-items:center; gap:10px; padding:8px 0; border-top:1px solid var(--line); font-size:var(--fs-base); }
.se-gr:first-child { border-top:0; }
.se-gr b { font-weight:600; }
.se-gr small { display:block; margin-top:2px; font-size:var(--fs-s); color:var(--sub); }
.se-gr small:empty { display:none; }
.se-gr small.se-mv { color:var(--accent-2); font-weight:700; }
.se-back { display:block; min-height:44px; margin:4px auto 0; padding:0 16px; border:0; background:none;
  font-size:var(--fs-m); font-weight:700; color:var(--sub); text-decoration:underline; cursor:pointer; }
.se-foot { margin:12px 0 0; font-size:12px; font-weight:500; color:var(--sub); text-align:center; }
/* check rows: 알레르기 (two columns), 빼는 재료 picks (one) - mockup 186-192. The allergy rows keep class
   chip for the checks that read them, so their rule carries the id to beat app.css #allergy-chips .chip. */
.se-alsrc { margin:0 0 12px; }
.se-chk2 { display:grid; grid-template-columns:1fr 1fr; column-gap:14px; }
.se-chk1 { display:flex; flex-direction:column; }
.se-ck, .se-chk2#allergy-chips .se-ck { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; gap:10px;
  width:100%; min-height:44px; margin:0; padding:0 2px; border:0; border-top:1px solid var(--line); border-radius:0;
  background:none; color:var(--ink); font-size:var(--fs-base); font-weight:400; line-height:1.3; text-align:left;
  word-break:keep-all; cursor:pointer; }
.se-chk1 .se-ck:first-child, .se-chk2#allergy-chips .se-ck:nth-child(-n+2) { border-top:0; }
.se-ck i { box-sizing:border-box; flex:none; display:grid; place-items:center; width:20px; height:20px; border-radius:6px;
  border:2px solid var(--box); font-style:normal; font-size:12px; font-weight:700; color:#fff; }
.se-ck[aria-pressed="true"] i, .se-ck[aria-checked="true"] i, .se-ck:has(> input:checked) i { background:var(--accent); border-color:var(--accent); }
.se-ck[aria-pressed="true"] i::after, .se-ck[aria-checked="true"] i::after, .se-ck:has(> input:checked) i::after { content:"✓"; }
/* A label row over a native checkbox (땅콩 고위험, rubric D8 reads .checked): the input stays focusable, unseen. */
.se-ck:has(> input) { position:relative; }
.se-ck > input[type="checkbox"] { position:absolute; left:0; top:0; width:1px; height:1px; margin:0; opacity:0; }
.se-ck:has(> input:focus-visible) i { outline:2px solid var(--accent); outline-offset:2px; }
.se-chk2 + .se-note { margin-top:10px; }
/* 빼는 재료 - mockup 193-203. The count sits after the title; its auto margin keeps ✕ on the right. */
.se-ecnt { flex:none; margin:0 auto 0 0; font-size:var(--fs-s); font-weight:700; color:var(--sub); white-space:nowrap; }
.se-ecnt:empty { display:none; }
.se-xrow { display:flex; align-items:center; gap:10px; min-height:52px; padding:8px 0; border-top:1px solid var(--line);
  font-size:var(--fs-body); }
.se-excl > .se-xlist:first-child > .se-xrow:first-child, .se-xlist:empty + .se-xlist > .se-xrow:first-child { border-top:0; }
.se-xrow > span { flex:1; min-width:0; word-break:keep-all; }
.se-xrow b { font-weight:700; }
.se-xrow small { display:block; margin-top:2px; font-size:var(--fs-s); color:var(--sub); line-height:1.45; }
.se-rx b { color:#B3362B; }
.se-tbtn { flex:none; min-height:44px; padding:0 14px; border:1.5px solid var(--line); border-radius:999px; background:#fff;
  font-size:var(--fs-m); font-weight:700; color:var(--accent); white-space:nowrap; cursor:pointer; }
.se-cbtns { display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.se-cbtns .kd-wide { margin-top:0; }
.se-excl > .se-note { margin-top:6px; }
.se-more { display:block; width:100%; min-height:44px; padding:0 2px; border:0; border-top:1px solid var(--line); background:none;
  font-size:var(--fs-base); font-weight:700; color:var(--accent); text-align:left; cursor:pointer; }
.se-ck.se-risk { padding:8px 2px; }
.se-risk > span { font-size:var(--fs-s); color:var(--sub); line-height:1.45; }
.se-risk > span b { display:block; margin-bottom:2px; font-size:var(--fs-body); color:var(--ink); }
/* 주지 않는 음식: week.js writes #banned; the id in each selector beats app.css #banned .excluded */
.se-rl #banned { margin:0; }
.se-rl #banned .excluded { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:2px;
  min-height:52px; margin:0; padding:8px 0; border:0; border-top:1px solid var(--line); border-radius:0; background:none;
  font-size:var(--fs-body); font-weight:400; color:var(--ink); word-break:keep-all; }
.se-rl #banned .excluded:first-child { border-top:0; }
.se-rl #banned .excluded b { font-weight:700; white-space:normal; }
.se-rl #banned .excluded > span { font-size:var(--fs-s); color:var(--sub); text-align:left; line-height:1.45; }
.se-rl #banned .excluded.bn-hold { display:block; padding:10px 0; font-size:var(--fs-base); line-height:1.6; color:var(--warn); }
.se-rl #banned .tier, .se-drink .tier { font-weight:400; color:inherit; }
/* 내 데이터 - mockup 451-466 (rows, .confirm, .cta.ghost / .cta.danger, details.priv) */
.se-data > .se-xrow:first-child { border-top:0; }
.se-data .se-tbtn.se-danger { color:#B04A3E; border-color:#E5B4AC; }
.se-data #import-status { margin:6px 0 0; }
.se-data .card { margin:10px 0 0; padding:0; border:0; border-top:1px solid var(--line); border-radius:0; background:none; box-shadow:none; }
.se-data .dt-policy summary { display:flex; flex-wrap:wrap; align-items:center; column-gap:6px; min-height:44px;
  font-size:var(--fs-base); color:var(--sub); }
.se-data .dt-policy summary em { margin-left:0; font-size:var(--fs-s); }
.se-data .dt-policy .privacy { margin:4px 0 8px; font-size:var(--fs-s); line-height:1.6; color:var(--ink); }
.se-ask { word-break:keep-all; }
.se-ask .se-kvl:first-child { padding-top:0; }
.se-ask .se-kvl b { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.se-ask p { margin:12px 2px 0; font-size:var(--fs-base); color:var(--sub); }
.se-cbtns .u-cta.se-danger { background:#B04A3E; }
/* 검진 - mockup 469-480 (.opt tag, five .frow, #cSum, .note, cta); inputs inherit the app face (F31) */
.se-check > h2 { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 2px 8px; font-size:var(--fs-s);
  font-weight:500; color:var(--sub); line-height:1.55; }
.se-check > h2 .opt { height:auto; padding:2px 6px; border:0; border-radius:6px; background:var(--well); font-size:12px;
  font-weight:700; color:var(--sub); }
.se-frow { display:flex; align-items:center; gap:10px; padding:6px 0; border-top:1px solid var(--line); font-size:var(--fs-base); }
.se-check > h2 + .se-frow { border-top:0; }
.se-frow > span { flex:none; width:84px; color:var(--ink); }
.se-frow input { flex:1; min-width:0; min-height:44px; margin:0; padding:0 12px; border:1.5px solid var(--line); border-radius:12px;
  background:#fff; font:inherit; font-size:16px; font-weight:700; color:var(--ink); text-align:right; font-variant-numeric:tabular-nums; }
.se-frow input:focus { outline:none; border-color:var(--accent); }
.se-frow em { flex:none; width:30px; font-style:normal; font-size:13px; font-weight:700; color:var(--sub); }
.se-frow .se-seg { flex:1; margin:0; }
.se-check .cu-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:0; }
.cu-new { flex:none; min-height:44px; padding:0 2px 0 12px; border:0; background:none; font:inherit; font-size:var(--fs-m);
  font-weight:700; color:var(--accent-2); cursor:pointer; }
.cu-new:disabled { color:var(--sub); opacity:.45; cursor:default; }
.se-check #cu-read .cu-head + .se-curec { border-top:0; }
.cu-row { flex:1; min-width:0; min-height:44px; margin:0; padding:0; border:0; background:none; font:inherit;
  font-size:var(--fs-base); font-weight:600; color:var(--ink); text-align:left; word-break:keep-all; cursor:pointer; }
.cu-row[aria-current="true"] { font-weight:700; color:var(--accent-2); }
/* 홈 화면에 추가 - the common sheet shell with three numbered rows and the note (audit F59) */
.se-steps { margin:0 0 4px; padding:0; list-style:none; }
.se-steps li { display:flex; align-items:center; gap:12px; min-height:52px; border-top:1px solid var(--line);
  font-size:var(--fs-body); font-weight:700; }
.se-steps li:first-child { border-top:0; }
.se-steps i { flex:none; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--accent-soft);
  font-style:normal; font-size:var(--fs-base); font-weight:700; color:var(--accent); }
