/* 实时记账页面样式 */ page { background: linear-gradient(135deg, #1A1A1A 0%, #252525 100%); min-height: 100vh; } .container { padding: 30rpx; padding-bottom: 120rpx; } /* 顶部信息 */ .session-header { display: flex; justify-content: space-between; align-items: center; background: linear-gradient(135deg, #1A1A1A 0%, #252525 100%); color: white; } .header-info { flex: 1; } .session-name { font-size: 32rpx; font-weight: bold; margin-bottom: 8rpx; display: block; } .round-number { font-size: 26rpx; opacity: 0.9; } .header-actions button { background: rgba(255, 255, 255, 0.2); color: white; font-size: 26rpx; padding: 12rpx 24rpx; } /* 快速记账区 */ .quick-entry { background: #1A1A1A; margin-bottom: 20rpx; } .section-label { font-size: 28rpx; color: #E0E0E0; margin-bottom: 16rpx; display: block; } .player-select { display: flex; flex-wrap: wrap; gap: 16rpx; margin-bottom: 24rpx; } .player-option { display: flex; align-items: center; padding: 12rpx 20rpx; border: 2rpx solid #e5e5e5; border-radius: 12rpx; background: #f8f8f8; position: relative; transition: all 0.2s ease; } .player-option.selected { background: #e8f5e9; border-color: #50C878; } .player-option.losing { background: #ffebee; border-color: #ff3b30; } .player-name { font-size: 28rpx; color: #FFFFFF; margin-left: 8rpx; } .check-mark { position: absolute; right: 8rpx; top: 50%; transform: translateY(-50%); width: 24rpx; height: 24rpx; border-radius: 50%; background: #50C878; color: white; font-size: 16rpx; display: flex; align-items: center; justify-content: center; } .check-mark.lose { background: #ff3b30; } /* 分数输入区 */ .score-section { margin-top: 24rpx; } .score-input-group { display: flex; gap: 12rpx; align-items: center; } .score-preset { flex: 1; background: #f0f0f0; border: none; padding: 16rpx; border-radius: 8rpx; font-size: 30rpx; color: #FFFFFF; text-align: center; } .score-preset:active { background: #50C878; color: white; } .score-input { flex: 2; background: #f8f8f8; border: 1rpx solid #e5e5e5; padding: 16rpx; border-radius: 8rpx; font-size: 30rpx; text-align: center; } .submit-btn { width: 100%; margin-top: 24rpx; } /* 详细记账区 */ .detailed-entry { margin-bottom: 20rpx; } .toggle-btn { color: #50C878; font-size: 26rpx; } .detail-content { margin-top: 20rpx; } .player-entry { display: flex; justify-content: space-between; align-items: center; padding: 16rpx 0; border-bottom: 1rpx solid #f0f0f0; } .player-entry:last-child { border-bottom: none; } .player-info { display: flex; align-items: center; flex: 1; } .score-entry { display: flex; align-items: center; gap: 16rpx; } .current-chips { font-size: 26rpx; color: #B0B0B0; } .chips-input { width: 120rpx; text-align: center; font-weight: bold; } .chips-input.win { color: #50C878; border-color: #50C878; } .chips-input.lose { color: #ff3b30; border-color: #ff3b30; } /* 平衡检查 */ .balance-check { display: flex; align-items: center; justify-content: center; padding: 20rpx; background: #f8f8f8; border-radius: 8rpx; margin: 20rpx 0; } .balance-label { font-size: 28rpx; color: #E0E0E0; margin-right: 16rpx; } .balance-value { font-size: 36rpx; font-weight: bold; } .balance-value.balanced { color: #50C878; } .balance-value.unbalanced { color: #ff3b30; } .balance-tip { font-size: 24rpx; color: #ff3b30; margin-left: 16rpx; } /* 积分榜 */ .scoreboard { margin-bottom: 20rpx; } .scoreboard-list { margin-top: 20rpx; } .scoreboard-item { display: flex; align-items: center; padding: 16rpx 0; border-bottom: 1rpx solid #f0f0f0; } .scoreboard-item:last-child { border-bottom: none; } .rank { width: 48rpx; height: 48rpx; border-radius: 50%; background: #f0f0f0; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 28rpx; margin-right: 20rpx; } .scoreboard-item:nth-child(1) .rank { background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%); color: white; } .scoreboard-item:nth-child(2) .rank { background: linear-gradient(135deg, #c0c0c0 0%, #e0e0e0 100%); color: white; } .scoreboard-item:nth-child(3) .rank { background: linear-gradient(135deg, #cd7f32 0%, #daa520 100%); color: white; } .player-score { font-size: 32rpx; font-weight: bold; margin-left: auto; } /* 最近记录 */ .recent-records { margin-bottom: 100rpx; } .record-list { margin-top: 20rpx; } .record-item { padding: 16rpx; background: #f8f8f8; border-radius: 8rpx; margin-bottom: 12rpx; position: relative; } .record-round { font-size: 26rpx; font-weight: bold; color: #E0E0E0; margin-bottom: 8rpx; } .record-scores { display: flex; flex-wrap: wrap; gap: 12rpx; margin-bottom: 8rpx; } .score-item { font-size: 24rpx; padding: 4rpx 12rpx; background: #1A1A1A; border-radius: 4rpx; } .record-time { font-size: 22rpx; color: #B0B0B0; } .undo-btn { position: absolute; right: 16rpx; top: 50%; transform: translateY(-50%); color: #ff3b30; font-size: 24rpx; padding: 8rpx 16rpx; background: #1A1A1A; border-radius: 4rpx; } /* 历史记录弹窗 */ .history-modal .modal-content { width: 90%; max-width: none; } .history-item { padding: 20rpx; border-bottom: 1rpx solid #f0f0f0; } .history-item:last-child { border-bottom: none; } .history-header { display: flex; justify-content: space-between; margin-bottom: 12rpx; } .history-round { font-size: 28rpx; font-weight: bold; color: #FFFFFF; } .history-time { font-size: 24rpx; color: #B0B0B0; } .history-scores { display: flex; flex-wrap: wrap; gap: 12rpx; } .history-score { display: flex; align-items: center; padding: 8rpx 16rpx; background: #f8f8f8; border-radius: 6rpx; } .history-score .player-name { font-size: 24rpx; color: #E0E0E0; margin-right: 8rpx; } .history-score .score-change { font-size: 26rpx; font-weight: bold; }