/* 重要事项、经期、设置三个本子的样式（按设计规范 v1.2 第 7 节）。只用 tokens.css 里的变量。 */

/* ===== 重要事项（规范 7.6）===== */
.fl-in b { display:block; font-size:20px; }
.fl-in i { font-style:normal; font-size:11px; font-weight:700; }
.seg { display:inline-flex; gap:8px; margin:0 0 4px; }
.seg button { height:36px; padding:0 16px; border-radius:var(--r-pill); background:var(--card); font-size:13px; font-weight:700; transition:background .2s, color .2s, transform .15s; }
.seg button:active { transform:scale(.95); }
.seg button.on { background:var(--ink); color:#fff; }
.srow.irow { border-radius:var(--r-mid); margin-bottom:8px; border-top:0; }
.srow.irow + .srow.irow { border-top:0; }
.srow.irow.open .imp { transform:translateX(calc(-1 * var(--open-x, 122px))); }
.imp { display:flex; gap:12px; align-items:center; background:var(--card); border-radius:var(--r-mid); padding:12px; transition:transform .3s var(--e-spring); cursor:pointer; position:relative; }
.imp .ic { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; flex:none; }
.imp .t { flex:1; min-width:0; }
.imp .t > div { font-weight:600; font-size:16px; line-height:1.4; word-break:break-word; }
.imp .t p { margin:3px 0 0; font-size:13px; color:var(--muted); display:flex; flex-wrap:wrap; gap:2px 10px; line-height:1.45; }
.imp .t p span { display:inline-flex; align-items:center; gap:3px; }
.imp .t p svg.i { width:14px; height:14px; }
.imp .cd { text-align:center; flex:none; min-width:48px; }
.imp .cd b { display:block; font-family:var(--font-display); font-size:20px; font-weight:800; line-height:1; }
.imp .cd small { font-size:11px; color:var(--muted); }
.imp.fin .t > div { color:var(--muted); text-decoration:line-through; text-decoration-thickness:1.5px; }
.act.leaf { background:var(--leaf); }
.hero.tap { cursor:pointer; transition:transform .15s; }
.hero.tap:active { transform:scale(.98); }
.pills { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
textarea.plain { width:100%; border:0; background:none; outline:0; resize:none; font-size:16px; line-height:1.5; padding:8px 0; color:var(--ink); font-family:var(--font-body); }
textarea.plain::placeholder { color:var(--muted); }
.fieldbox { border-radius:var(--r-sm); padding:4px 14px; background:var(--bg); margin-bottom:6px; }
.row-btns { display:flex; gap:8px; margin-top:12px; }
.row-btns .btn { height:44px; font-size:14px; }
.btn.sec.armed { background:var(--coral); }

/* ===== 经期（规范 7.9）===== */
.cal-h { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; font-weight:800; font-family:var(--font-display); font-size:16px; }
.cal-h span { display:flex; gap:8px; }
.cal-h button { width:36px; height:36px; border-radius:50%; background:var(--bg); display:grid; place-items:center; transition:transform .15s; }
.cal-h button:active { transform:scale(.9); }
.cal-h svg.i { width:16px; height:16px; }
.cal { display:grid; grid-template-columns:repeat(7, 1fr); row-gap:2px; text-align:center; }
.cal .w { font-size:12px; color:var(--muted); font-weight:700; padding-bottom:4px; }
.cal .c { height:44px; display:grid; place-items:center; font-size:15px; font-weight:600; position:relative; }
.cal .c i { width:38px; height:38px; border-radius:50%; display:grid; place-items:center; font-style:normal; transition:transform .15s; font-variant-numeric:tabular-nums; }
.cal .c:active i { transform:scale(.85); }
.cal .p i { background:var(--berry-deep); color:#fff; }
.cal .pr i { color:var(--berry-deep); outline:1.5px dashed var(--berry-deep); outline-offset:-1.5px; }
.cal .f i { background:var(--leaf-soft); color:var(--leaf-deep); }
.cal .ov i { background:var(--leaf); color:var(--ink); }
.cal .td i { box-shadow:0 0 0 2px var(--ink); font-weight:800; }
.cal .sel i { background:var(--ink) !important; color:#fff !important; outline:none; }
.cal .dot::after { content:""; position:absolute; bottom:0; width:4px; height:4px; border-radius:50%; background:var(--ink2); }
.legend { display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12px; color:var(--ink2); margin-top:10px; font-weight:600; }
.legend span { display:inline-flex; align-items:center; gap:5px; }
.legend i { width:10px; height:10px; border-radius:50%; display:inline-block; box-sizing:border-box; }
.calinfo { margin-top:12px; background:var(--bg); border-radius:var(--r-sm); padding:10px 12px; font-size:14px; font-weight:600; line-height:1.5; display:flex; gap:8px; align-items:flex-start; }
.calinfo svg.i { color:var(--berry-deep); margin-top:2px; }
.faces { display:flex; gap:8px; }
.faces button { flex:1; border-radius:var(--r-mid); background:var(--bg); padding:8px 0 6px; font-size:12px; font-weight:700; transition:background .2s, transform .15s; display:flex; flex-direction:column; align-items:center; gap:2px; }
.faces button:active { transform:scale(.95); }
.faces button.on { background:var(--berry); }
.faces svg { width:32px; height:32px; }
.ob-row { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-top:1.5px dashed var(--line); min-height:52px; font-weight:700; font-size:15px; }
.ob-row:first-child { border-top:0; }
.ob-row > span:first-child { display:flex; align-items:center; gap:8px; }
.pill-input { position:relative; overflow:hidden; display:inline-flex; align-items:center; height:36px; padding:0 14px; border-radius:var(--r-pill); background:var(--ink); color:#fff; font-size:13px; font-weight:700; }
.pill-input input { position:absolute; inset:0; opacity:0; width:100%; height:100%; }

/* ===== 设置（规范 7.15）===== */
.setrow { display:flex; gap:12px; align-items:center; padding:12px 0; border-top:1.5px dashed var(--line); min-height:52px; }
.setrow:first-child { border-top:0; }
.setrow > i { width:36px; height:36px; border-radius:50%; background:var(--sky-soft); display:grid; place-items:center; flex:none; }
.setrow > i svg.i { width:18px; height:18px; }
.setrow .tx { flex:1; min-width:0; font-size:16px; font-weight:600; line-height:1.4; }
.setrow .tx small { display:block; font-weight:400; font-size:13px; color:var(--muted); line-height:1.45; }
.setrow .val { font-size:13px; color:var(--muted); white-space:nowrap; display:inline-flex; align-items:center; gap:2px; }
.setrow.tap { cursor:pointer; }
.setrow input[type=time] { border:0; background:var(--bg); border-radius:var(--r-pill); padding:6px 12px; font-size:14px; font-weight:700; font-family:var(--font-body); }
.back { display:inline-flex; align-items:center; gap:2px; font-size:16px; font-weight:700; color:var(--ink2); min-height:44px; margin:0 0 -4px; }
.btn.sm { height:36px; width:auto; padding:0 14px; font-size:13px; }
.pill.leafy { background:var(--leaf-soft); }
.pill.warn { background:var(--peach); }
.hero .stat { display:flex; gap:16px; margin:6px 0 10px; font-family:var(--font-display); font-weight:800; }
.hero .stat span { font-size:24px; }
.hero .stat small { font-size:12px; font-weight:600; font-family:var(--font-body); margin-left:2px; }
.hero .warnbox { background:rgba(255,255,255,.7); border-radius:var(--r-sm); padding:8px 12px; font-size:13px; font-weight:600; line-height:1.5; margin-bottom:10px; }
.verlog { padding:8px 0; border-top:1.5px dashed var(--line); font-size:14px; line-height:1.6; }
.verlog:first-child { border-top:0; }
.verlog b { font-family:var(--font-display); font-size:15px; }
.verlog ul { margin:2px 0 0; padding-left:18px; color:var(--ink2); }