body { background: linear-gradient(to bottom, #faf6f0, #ebd7cb) no-repeat fixed; color: #3d3a37; font-family: "Quicksand", "PingFang SC", sans-serif; margin: 0; padding: 20px; line-height: 1.6; }
.vlcr-wrapper { max-width: 1200px; margin: 0 auto; box-sizing: border-box; }
/* 结构突变：气泡式悬浮头 */
.vlcr-bubble-header { background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); border-radius: 30px; padding: 15px 40px; margin-bottom: 40px; display: flex; justify-content: space-between; align-items: center; box-shadow: 8px 8px 16px #ebd6ca, -8px -8px 16px #ffffff; border: 1px solid rgba(255,255,255,0.6); }
.vlcr-logo img { height: 42px; object-fit: contain; }
.vlcr-menu { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.vlcr-menu a { color: #5c5550; text-decoration: none; font-size: 14px; font-weight: bold; padding: 8px 18px; border-radius: 20px; transition: all 0.3s; background: transparent; }
.vlcr-menu a:hover, .vlcr-menu a.active { color: #e07a5f; background: #faf6f0; box-shadow: inset 4px 4px 8px #ebd6ca, inset -4px -4px 8px #ffffff; }
.vlcr-clay-notice { background: rgba(224, 122, 95, 0.05); border-radius: 20px; padding: 20px 30px; margin-bottom: 40px; font-size: 14px; color: #e07a5f; font-weight: bold; border: 1px solid rgba(224, 122, 95, 0.15); box-shadow: 4px 4px 8px #ebd6ca, -4px -4px 8px #ffffff; }
.vlcr-clay-notice b { font-size: 16px; margin-right: 10px; }
.vlcr-sec-title { font-size: 16px; font-weight: bold; color: #5c5550; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 25px; border-bottom: 2px solid rgba(224, 122, 95, 0.2); padding-bottom: 10px; display: inline-block; }
/* 非对称便当盒流式网格 */
.vlcr-bento-grid { display: flex; flex-wrap: wrap; gap: 25px; }
.vlcr-bento-card { background: #faf6f0; border-radius: 24px; padding: 25px; transition: all 0.3s ease; text-decoration: none; color: inherit; display: flex; flex-direction: column; width: calc(33.333% - 17px); box-sizing: border-box; box-shadow: 10px 10px 20px #ebd6ca, -10px -10px 20px #ffffff; border: 1px solid rgba(255,255,255,0.8); }
.vlcr-bento-card:hover { transform: translateY(-4px); box-shadow: inset 6px 6px 12px #ebd6ca, inset -6px -6px 12px #ffffff; }
.vlcr-bento-card:nth-child(even) { margin-top: 15px; } /* 纵向错位深度突变 */
.vlcr-clay-frame { height: 160px; background: #faf6f0; border-radius: 18px; display: flex; align-items: center; justify-content: center; padding: 15px; margin-bottom: 20px; box-shadow: inset 4px 4px 8px #ebd6ca, inset -4px -4px 8px #ffffff; }
.vlcr-clay-frame img { max-width: 90%; max-height: 90%; object-fit: contain; }
.vlcr-card-title { font-size: 15px; font-weight: bold; color: #3d3a37; margin-bottom: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vlcr-card-bottom { display: flex; justify-content: space-between; align-items: center; margin-top: auto; }
.vlcr-badge { font-size: 11px; padding: 4px 12px; border-radius: 15px; font-weight: bold; box-shadow: inset 2px 2px 4px #ebd6ca, inset -2px -2px 4px #ffffff; }
.vlcr-b-auto { color: #38a169; }
.vlcr-b-hand { color: #e07a5f; }
.vlcr-price { color: #e07a5f; font-size: 20px; font-weight: bold; }
/* 详情页重构：Neumorphic 双翼布局 */
.vlcr-split-bento { display: flex; gap: 40px; }
.vlcr-dt-visual { width: 45%; }
.vlcr-dt-form { width: 55%; }
.vlcr-dt-screen { background: #faf6f0; border-radius: 28px; padding: 30px; display: flex; align-items: center; justify-content: center; box-shadow: 10px 10px 20px #ebd6ca, -10px -10px 20px #ffffff; border: 1px solid rgba(255,255,255,0.8); }
.vlcr-dt-screen img { max-width: 100%; border-radius: 16px; }
.vlcr-form-box { background: #faf6f0; border-radius: 28px; padding: 40px; box-shadow: 12px 12px 24px #ebd6ca, -12px -12px 24px #ffffff; border: 1px solid rgba(255,255,255,0.8); }
.vlcr-dt-title { font-size: 24px; font-weight: bold; color: #3d3a37; margin-bottom: 25px; line-height: 1.4; border-bottom: 1px solid rgba(224, 122, 95, 0.1); padding-bottom: 15px; }
.vlcr-stat-row { display: flex; gap: 40px; border-bottom: 1px dashed rgba(224, 122, 95, 0.15); padding-bottom: 25px; margin-bottom: 30px; }
.vlcr-stat-item label { display: block; font-size: 11px; color: #8c827a; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
.vlcr-stat-item span { font-size: 24px; font-weight: bold; color: #e07a5f; }
.vlcr-group { margin-bottom: 20px; }
.vlcr-label { display: block; font-size: 12px; color: #5c5550; font-weight: bold; margin-bottom: 8px; text-transform: uppercase; }
.vlcr-input { width: 100%; box-sizing: border-box; background: #faf6f0; border: none; color: #3d3a37; padding: 16px 20px; border-radius: 16px; font-size: 15px; outline: none; transition: 0.3s; font-family: inherit; box-shadow: inset 4px 4px 8px #ebd6ca, inset -4px -4px 8px #ffffff; }
.vlcr-input:focus { box-shadow: inset 2px 2px 4px #ebd6ca, inset -2px -2px 4px #ffffff; }
.vlcr-btn-clay { width: 100%; background: #e07a5f; color: #fff; border: none; padding: 18px; border-radius: 18px; font-size: 16px; font-weight: bold; cursor: pointer; transition: 0.3s; box-shadow: 4px 4px 8px rgba(224, 122, 95, 0.4), -4px -4px 8px #ffffff; font-family: inherit; text-transform: uppercase; }
.vlcr-btn-clay:hover { background: #d06f55; transform: scale(0.99); }
.vlcr-btn-clay:disabled { background: #dcd7d2; color: #a59e97; box-shadow: none; cursor: not-allowed; transform: none; }
.vlcr-desc-deck { background: #faf6f0; border-radius: 28px; padding: 35px; margin-top: 40px; box-shadow: 10px 10px 20px #ebd6ca, -10px -10px 20px #ffffff; border: 1px solid rgba(255,255,255,0.8); }
.vlcr-desc-title { font-size: 16px; color: #e07a5f; font-weight: bold; margin-bottom: 20px; text-transform: uppercase; }
.vlcr-desc-content { font-size: 14px; color: #5c5550; line-height: 1.8; }
/* 归档检索面板 */
.vlcr-q-tabs { display: flex; background: #faf6f0; border-radius: 18px; padding: 4px; margin-bottom: 35px; box-shadow: inset 3px 3px 6px #ebd6ca, inset -3px -3px 6px #ffffff; }
.vlcr-q-tabs a { flex: 1; text-align: center; padding: 12px; color: #8c827a; font-weight: bold; text-decoration: none; border-radius: 14px; font-size: 13px; transition: 0.3s; }
.vlcr-q-tabs a.active, .vlcr-q-tabs a:hover { background: #faf6f0; color: #e07a5f; box-shadow: 3px 3px 6px #ebd6ca, -3px -3px 6px #ffffff; }
.vlcr-deck-table { width: 100%; border-collapse: collapse; }
.vlcr-deck-table th, .vlcr-deck-table td { padding: 18px; border-bottom: 1px solid rgba(224, 122, 95, 0.1); text-align: left; }
.vlcr-deck-table th { color: #8c827a; font-size: 12px; text-transform: uppercase; }
.vlcr-deck-table td { color: #3d3a37; font-weight: 500; }
.vlcr-footer { border-top: 2px solid rgba(224, 122, 95, 0.1); margin-top: 80px; padding-top: 30px; text-align: center; font-size: 12px; color: #8c827a; }
@media (max-width: 900px) {
    .vlcr-bento-card { width: 100%; }
    .vlcr-bento-card:nth-child(even) { margin-top: 0; }
    .vlcr-bubble-header { flex-direction: column; gap: 20px; border-radius: 20px; }
    .vlcr-split-bento { flex-direction: column; }
    .vlcr-dt-visual, .vlcr-dt-form { width: 100%; }
}