/* lifeinjapan —— type-iryohi-calc.css
   /iryohi 页内嵌的「高額療養費计算器」增量规则。
   区块由 ~/.workbuddy/skills/lifeinjapan-site-check/inject-iryohi-calc.py 注入，
   样式只在本文件维护，**不要内联回页面**（全站纪律：设计系统只改 css/）。

   复用 type-content.css 里已有的积木，本文件只补工具自身需要的类：
     .calc-box / .calc-box h3 / .calc-note  → 表单卡与脚注
     .warn-box                              → 免责区（原本用 .iry-warn，改用站点已有的红色警示框）
     .hsp-table                             → 速查表
   颜色一律取 base.css 的变量，不新增任何色值。 */

.iry-field{margin-bottom:16px}
.iry-field:last-of-type{margin-bottom:14px}
.iry-field label{display:block;font-size:13px;font-weight:700;color:var(--text);margin-bottom:6px}
.iry-field select,.iry-field input[type=number]{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:6px;font-size:15px;font-family:inherit;background:var(--bg);color:var(--text)}
.iry-field select:focus,.iry-field input[type=number]:focus{outline:2px solid var(--accent2);outline-offset:1px}
.iry-hint{font-size:12px;color:var(--muted);line-height:1.7;margin:6px 0 0;font-weight:400}

.iry-res{border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-top:4px}
.iry-row{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid var(--border);font-size:14px;line-height:1.6}
.iry-row:last-child{border-bottom:0}
.iry-row>span:last-child{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
.iry-row.hi{background:var(--card2)}
.iry-row.hi>span:last-child{color:var(--accent);font-size:17px}

/* 速查表与改点清单：间距对齐 type-content.css 里 .hsp-table 的 24px 下边距 */
.iry-tblnote{font-size:12px;color:var(--muted);line-height:1.7;margin:8px 0 24px}
.iry-chg{margin:0 0 24px;padding-left:20px;font-size:14px;line-height:1.9}
.iry-chg li{margin-bottom:4px}
.iry-chg li:last-child{margin-bottom:0}
.iry-chg b{color:var(--accent)}

/* 速查表兜底：4 列在 320–360px 的窄屏上排不下（实测 468px 宽刚好放得下），
   让它在本块内横向滚动，绝不把整页撑出横向滚动条。 */
.iry-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:8px}
.iry-scroll .hsp-table{margin-bottom:0}

/* 结果区四个数字在窄屏要能并排放下，不让金额折行 */
@media(max-width:500px){
.iry-row{font-size:13px;padding:9px 11px}
.iry-row.hi>span:last-child{font-size:15px}
.iry-chg{font-size:13px}
}
