/* =====================================================================
 * 11 宠物出行应急包 · 独立版式「开箱格子」
 * 芥末金 + 掀盖行李箱 + 六宫格物品 + 可勾选小方块
 * ===================================================================== */
.pb--pk { --pb-a: #9a7b1e; --pb-a-soft: #f5efd9; }
:root[data-theme="dark"] .pb--pk { --pb-a: #e0c25c; --pb-a-soft: #332c17; }

.pk-hero { padding-top: 32px; }
.pk-board { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(0, .8fr); gap: 14px; margin-top: 22px; align-items: start; }
.pk-form { border-top: 3px solid var(--pb-a); }
.pk-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pk-flags { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 13px; }

/* 开箱 */
.pk-case { background: var(--pb-card); border: 1px solid var(--pb-line2); border-radius: var(--pb-r); box-shadow: var(--pb-shadow-sm); padding: 17px; }
.pk-case-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--pb-line2); padding-bottom: 9px; }
.pk-case-head span { font-family: var(--pb-mono); font-size: 9.5px; letter-spacing: .14em; color: var(--pb-a); }
.pk-case-head b { font-size: 14px; }
.pk-case-body { margin: 14px 0; border: 2px solid var(--pb-line); border-radius: 10px; background: var(--pb-card2); padding: 9px; box-shadow: inset 0 0 0 4px var(--pb-card); }
.pk-case-lid { display: flex; gap: 5px; margin-bottom: 9px; }
.pk-case-lid span { flex: 1; text-align: center; font-size: 10.5px; color: var(--pb-muted); border-bottom: 2px dashed var(--pb-line); padding-bottom: 4px; }
.pk-case-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.pk-case-cell { border: 1px dashed var(--pb-line); border-radius: 7px; background: var(--pb-card); padding: 9px 7px; text-align: center; min-width: 0; }
.pk-case-cell b { display: block; font-family: var(--pb-serif); font-size: 20px; color: var(--pb-a); line-height: 1.2; }
.pk-case-cell span { display: block; font-size: 10.5px; color: var(--pb-muted); }
.pk-case-cell small { display: block; font-family: var(--pb-mono); font-size: 9.5px; color: var(--pb-ink2); margin-top: 2px; }
.pk-case-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.pk-case-stats > div { border: 1px solid var(--pb-line2); border-radius: var(--pb-r-sm); background: var(--pb-card2); padding: 8px; }
.pk-case-stats span { display: block; font-size: 10.5px; color: var(--pb-muted); }
.pk-case-stats b { display: block; font-family: var(--pb-mono); font-size: 12.5px; color: var(--pb-ink); word-break: break-all; }
.pk-weight { margin-top: 13px; }
.pk-weight-top { display: flex; justify-content: space-between; font-size: 12px; color: var(--pb-muted); }
.pk-weight-top b { font-family: var(--pb-mono); color: var(--pb-ink); }
.pk-weight .pb-meter { margin: 7px 0 5px; }
.pk-weight .pb-meter.is-over > i { background: var(--pb-danger); }
.pk-weight small { font-size: 10.5px; color: var(--pb-muted); }

/* 清单分类 */
.pk-cats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.pk-cat { background: var(--pb-card); border: 1px solid var(--pb-line2); border-radius: var(--pb-r); box-shadow: var(--pb-shadow-sm); padding: 15px; }
.pk-cat-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--pb-line2); padding-bottom: 9px; margin-bottom: 10px; }
.pk-cat-head b { font-size: 14.5px; }
.pk-cat-head span { font-family: var(--pb-mono); font-size: 11px; color: var(--pb-a); }
.pk-cat-items { display: grid; gap: 6px; }
.pk-item { display: flex; align-items: flex-start; gap: 7px; padding: 7px 8px; border: 1px solid var(--pb-line2); border-radius: 7px; background: var(--pb-card2); font-size: 12.5px; line-height: 1.6; cursor: pointer; }
.pk-item:hover { border-color: var(--pb-a); }
.pk-item.is-on { background: var(--pb-a-soft); border-color: var(--pb-a); }
.pk-item input { margin-top: 3px; width: 14px; height: 14px; accent-color: var(--pb-a); flex: 0 0 auto; }
.pk-item span { flex: 1; min-width: 0; }
.pk-item small { display: block; font-size: 10.5px; color: var(--pb-muted); }
.pk-item i { font-style: normal; font-family: var(--pb-mono); font-size: 10.5px; color: var(--pb-muted); }
.pk-batch { min-width: 620px; }
.pk-batch td input[type="text"], .pk-batch td input[type="number"], .pk-batch td select { padding: 5px 7px; font-size: 12px; min-width: 60px; }
.pk-prose { font-size: 14.5px; line-height: 2; color: var(--pb-ink2); }
.pk-prose b { color: var(--pb-ink); }
.pk-prose p { margin-bottom: 11px; }

@media (max-width: 1060px) {
    .pk-board { grid-template-columns: 1fr; }
    .pk-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
    .pk-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pk-flags { grid-template-columns: 1fr; }
}
@media (max-width: 520px) { .pk-cats { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .pk-fields { grid-template-columns: 1fr; } }
