.report { padding: 0.625rem;
}
.modes { display: flex; gap: 0.375rem; margin-bottom: 0.4375rem;
}
.mode-tab { flex: 1; text-align: center; padding: 0.5rem 0; border-radius: 31.21875rem; background: #f4f4f4; color: #666; border: 0.03125rem solid #e9e9e9;
}
.mode-tab.active { background: #1aad19; color: #fff; border-color: #1aad19; font-weight: 700;
}
.toolbar { display: flex; align-items: center; gap: 0.25rem; background: #fff; padding: 0.4375rem 0.5rem; border-radius: 0.375rem;
}
.date { padding: 0.3125rem 0.5rem; border: 0.03125rem solid #eee; border-radius: 0.25rem;
}
.tabs { display: flex; gap: 0.5rem; margin-top: 0.4375rem;
}
.tab { padding: 0.375rem 0.5625rem; border-radius: 31.21875rem; background: #f4f4f4; color: #666;
}
.tab.active { background: #1aad19; color: #fff;
}
.summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.25rem; margin-top: 0.4375rem;
}
.summary .item { background: #fff; border-radius: 0.375rem; padding: 0.5rem;
}
.summary .label { font-size: 0.6875rem; color: #888;
}
.summary .value { display: block; margin-top: 0.25rem; font-weight: 700; color: #333;
}
.card { margin-top: 0.5rem; background: #fff; border-radius: 0.375rem; padding: 0.5rem;
}
.row-head { display: flex; align-items: center; gap: 0.375rem;
}
.thumb { width: 2.25rem; height: 2.25rem; border-radius: 0.25rem; background: #f2f2f2;
}
.title { font-size: 0.875rem; font-weight: 700;
}
.row-body { margin-top: 0.3125rem; color: #666;
}