body{background: #f5f7fb;}
.mybox {
width: 100%;
display: flex;
flex-direction: column;
gap: 24px;
}

.card {
background: #ffffff;
border-radius: 10px;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.02), 0 2px 6px rgba(0, 0, 0, 0.03);
padding:20px;
transition: box-shadow 0.2s ease;
}

.card:hover {
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.05);
}

/* ========== 设备信息栏 ========== */
.sblistbox {
display: block;margin-bottom:10px;
}

.sbtoppic {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 16px 28px;
}

.sbtoppic .flex-1 {
min-width: 130px;
display: flex;
flex-direction: column;
}

.sbtoppic .flex-1 p {
margin: 0;
line-height: 1.4;
}

.sbtoppic .flex-1 p:first-child {
font-size: 0.8rem;
font-weight: 500;
color: #64748b;
letter-spacing: 0.3px;
text-transform: uppercase;
}

.sbtoppic .flex-1 p:last-child {
font-size: 1.15rem;
font-weight: 600;
color: #0f172a;
margin-top: 2px;
word-break: break-word;
}

.sbtoppic .flex-1:first-of-type p:last-child {
font-family: 'SF Mono', 'Fira Code', monospace;
font-size: 1.2rem;
letter-spacing: 0.5px;
}

.flex-2 {
flex: 0 0 12px;
width: 12px;
height: 12px;
background: #3b82f6;
border-radius: 50%;
opacity: 0.7;
display: block;
margin-right: 4px;
}

.sbtoppic .flex-1 img {
width: 44px;
height: 44px;
object-fit: contain;
filter: drop-shadow(0 2px 4px rgba(0,0,0,0.05));
background: #f1f5f9;
border-radius: 12px;
padding: 6px;
}

.sbtoppic .flex-1:last-child {
flex: 0 0 auto;
}

/* ========== 参数编辑区 ========== */
.editbox {
display: block;
}

.bmstable ul {
list-style: none;
display: grid;
/* 一行多个：默认 4 列，屏幕小自动减少 */
grid-template-columns: repeat(4, 1fr);
gap: 0;
margin: 0;
padding: 0;
border: 1px solid #eef2f6;
border-radius: 16px;
overflow: hidden;
}

/* 每个参数项作为一个格子 */
.bmstable li {
display: flex;
border-right: 1px solid #eef2f6;
border-bottom: 1px solid #eef2f6;
padding: 0;
transition: background 0.15s ease;
background: #ffffff;
min-height: 60px;
}

/* 去掉每行最后一个格子的右边框 */
.bmstable li:nth-child(4n) {
border-right: none;
}
.bmstable li:nth-last-child(-n+4):nth-child(4n+1),
.bmstable li:nth-last-child(-n+3):nth-child(4n+2),
.bmstable li:nth-last-child(-n+2):nth-child(4n+3),
.bmstable li:nth-last-child(-n+1):nth-child(4n+4) {
border-bottom: none;
}

/* 重写一下 ul 的边框，保留 */
.bmstable ul {
border: 1px solid #eef2f6;
border-radius: 16px;
overflow: hidden;
}

/* 去掉之前针对最后一行的复杂选择器，简化样式 */
.bmstable li {
display: flex;
border-right: 1px solid #eef2f6;
border-bottom: 1px solid #eef2f6;
padding: 0;
background: #ffffff;
min-height: 60px;
transition: background 0.15s ease;
}

/* 每行最后一个去掉右边框 */
.bmstable li:nth-child(4n) {
border-right: none;
}

/* 最后一行会有下边框，但父容器有圆角，最底部的线可能穿过圆角，可接受。
如果想完美，用下面方式：父容器 overflow hidden 且 padding-bottom: 1px; 背景 #fff;
但是会遮住？不纠结了。
*/

/* 每个 li 内部布局 */
.bmstable li > div {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
padding: 12px 16px;
gap: 12px;
flex-wrap: nowrap; /* 不换行，保持一行显示 */
}

/* 左侧标签 */
.bmstable li span:first-child {
font-size: 0.875rem;
font-weight: 500;
color: #334155;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
flex: 0 1 auto;
min-width: 0;
}

/* 右侧输入+按钮容器 */
.bmstable li span:last-child {
display: flex;
align-items: center;
gap: 8px;
flex: 0 0 auto;
flex-shrink: 0;
}

/* 输入框 */
.myval {
width: 90px;
padding: 6px 8px;
border: 1px solid #cbd5e1;
border-radius: 8px; /* 输入框圆角也减小一点 */
font-size: 0.85rem;
font-family: 'SF Mono', 'Fira Code', monospace;
text-align: right;
background: #ffffff;
transition: 0.15s;
color: #0f172a;
font-weight: 500;
}

.myval:focus {
outline: none;
border-color: #3b82f6;
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

/* 按钮——圆角变小 */
.xiafa {
background: #f1f5f9;
border: 1px solid #e2e8f0;
color: #1e293b;
font-size: 0.75rem;
font-weight: 600;
padding: 6px 12px;
border-radius: 6px; /* 小圆角 */
cursor: pointer;
transition: 0.15s;
letter-spacing: 0.3px;
box-shadow: 0 1px 2px rgba(0,0,0,0.02);
display: inline-flex;
align-items: center;
justify-content: center;
white-space: nowrap;
line-height: 1.4;margin-left:10px;
}

.xiafa:hover {
background: #3b82f6;
border-color: #3b82f6;
color: white;
box-shadow: 0 4px 8px rgba(59, 130, 246, 0.2);
}

.xiafa:active {
transform: scale(0.97);
background: #2563eb;
border-color: #2563eb;
}

/* 辅助: 文字过长显示省略号 */
.bmstable li span:first-child {
max-width: 130px;
}

