.page { height: 100vh; display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden; background: #FDFBF7; }
.head { flex-shrink: 0; padding: 24rpx 32rpx 8rpx; }
.head-title { font-size: 34rpx; font-weight: 700; color: #2C1810; }
.head-sub { margin-top: 6rpx; font-size: 24rpx; color: #c0392b; }

.form-scroll { flex: 1; min-height: 0; padding: 8rpx 32rpx 24rpx; box-sizing: border-box; }
.card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 20rpx; box-shadow: 0 4rpx 16rpx rgba(44, 24, 16, 0.04); }

/* shared feedback */
.btn-hover { opacity: .85; transform: scale(.98); }

/* skeleton */
.skeleton-card { padding: 32rpx; }
.sk { background: #EDE3D6; border-radius: 10rpx; }
.sk-line { height: 28rpx; margin-bottom: 20rpx; }
.sk-block { height: 120rpx; background: #F2EAE0; border-radius: 12rpx; margin-top: 10rpx; }
.w-90 { width: 90%; }
.w-80 { width: 80%; }
.w-100 { width: 100%; }
.w-60 { width: 60%; }

/* error state */
.error-card { padding: 120rpx 40rpx; text-align: center; }
.error-icon { width: 96rpx; height: 96rpx; line-height: 96rpx; margin: 0 auto 24rpx; border-radius: 50%; background: #fdecea; color: #c0392b; font-size: 48rpx; font-weight: 700; }
.error-text { color: #5A4A3A; font-size: 28rpx; margin-bottom: 48rpx; }
.btn-retry { display: inline-block; min-width: 240rpx; background: #C67B30; color: #fff; border-radius: 12rpx; }

.readonly-tip { margin: 8rpx 0 16rpx; padding: 14rpx 20rpx; background: #fff3e6; border-radius: 10rpx; color: #c0392b; font-size: 26rpx; text-align: center; }

.content { width: 100%; min-height: 200rpx; box-sizing: border-box; padding: 16rpx; border: 1rpx solid #e4d9cb; border-radius: 12rpx; background: #FDFBF7; color: #2C1810; font-size: 28rpx; }
.content[disabled], .content.readonly { background: #f6f1ea; }
.char-count { margin-top: 8rpx; text-align: right; font-size: 22rpx; color: #B6A996; }

.upload-section { margin-top: 20rpx; }
.upload-btn { background: #FDFBF7; color: #C67B30; border: 2rpx dashed #C67B30; border-radius: 12rpx; font-size: 26rpx; }
.upload-btn[disabled] { color: #d8c7b4; border-color: #d8c7b4; background: #FDFBF7; }
.thumb-grid { display: flex; flex-wrap: wrap; gap: 14rpx; margin-top: 18rpx; }
.thumb-item { position: relative; width: 156rpx; height: 156rpx; }
.thumb { width: 100%; height: 100%; border-radius: 12rpx; background: #f6efe6; }
.thumb-del { position: absolute; top: -12rpx; right: -12rpx; width: 44rpx; height: 44rpx; line-height: 40rpx; text-align: center; border-radius: 50%; background: #c0392b; color: #fff; font-size: 30rpx; }

.btn-primary { background: #C67B30; color: #fff; border-radius: 12rpx; }
.btn-save { margin-top: 24rpx; }
.btn-primary[disabled] { background: #d8c7b4; color: #fff; }
.save-hint { margin-top: 12rpx; text-align: center; font-size: 22rpx; color: #B6A996; }

.section-title { margin: 4rpx 8rpx 14rpx; font-size: 28rpx; font-weight: 700; color: #2C1810; }
.history-card { display: flex; flex-direction: column; gap: 10rpx; }
.history-head { font-size: 28rpx; font-weight: 700; color: #2C1810; }
.history-head .pending { color: #c0392b; }
.content-text { color: #5A4A3A; font-size: 26rpx; }
.history-thumbs { display: flex; flex-wrap: wrap; gap: 12rpx; margin-top: 8rpx; }
.history-thumb { width: 148rpx; height: 148rpx; border-radius: 12rpx; background: #f6efe6; }

.state-block { padding: 48rpx 0; text-align: center; color: #B6A996; font-size: 26rpx; }
.empty { padding: 48rpx 0; text-align: center; color: #B6A996; font-size: 26rpx; }